/*
 * SCOVER Academic · PX-R1-A Dark Mode Declutter Pilot · 2026-10-11
 * Scope: shared sidebar navigation, Student Home, Tutor Home.
 * CSS-only presentation overlay. No route keys, DOM contracts, state, API, auth,
 * SW, or legacy theme modification. Intentionally inactive in light mode.
 * Rollback: remove the two PX-R1 stylesheet links from index.html.
 */
@layer pxr1-pilot {
  /* Design tokens: deliberately local to this opt-in pilot. */
  html:not([data-theme="light"]) body.academic-shell-page {
    --pxr1-line: #29465f;
    --pxr1-line-active: #3984a2;
    --pxr1-nav-text: #d5e5f5;
    --pxr1-nav-muted: #93aac2;
    --pxr1-card-text: #eaf4ff;
    --pxr1-body-text: #b7cadd;
  }
}
/* Don't use @layer for overrides: legacy application rules are unlayered. */

/* A1 — SAME NAVIGATION, CLEARER GROUPING, LESS CHROME. */
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .academic-nav-group {
  margin-bottom: 10px;
}
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .academic-nav-group-title {
  font-size: 10px;
  letter-spacing: .11em;
  color: #9eb9d0;
  padding: 3px 0 5px;
  margin-bottom: 5px;
}
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .academic-nav-group > .nav {
  gap: 4px!important;
}
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .nav button.sc-nav-remastered {
  min-height: 41px!important;
  padding: 6px 9px!important;
  font-size: 11.5px!important;
  font-weight: 720!important;
  line-height: 1.32!important;
  gap: 9px!important;
  color: #d2e1ef!important;
  border-color: #1e3a54!important;
  border-radius: 10px!important;
}
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .nav button.sc-nav-remastered.active {
  border-color: #3c789c!important;
  background: linear-gradient(95deg,#163753,#10253a)!important;
  color: #f3faff!important;
}
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .nav button.sc-nav-remastered .sc-nav-icon {
  flex-shrink: 0;
}
html:not([data-theme="light"]) body[data-academic-shell="admin"] .academic-sidebar #nav .nav button.sc-nav-remastered .sc-nav-label {
  min-width: 0;
  overflow-wrap: anywhere;
}

html:not([data-theme="light"]) body[data-academic-shell="portal"]:has(.portal-r3-shell:is(.role-student,.role-tutor)) .academic-sidebar .academic-sidebar-kicker {
  font-size: 10px;
  letter-spacing: .13em;
  color: #9eb9d0;
  margin-bottom: 8px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"]:has(.portal-r3-shell:is(.role-student,.role-tutor)) .academic-sidebar .academic-role-nav .tabs {
  gap: 4px!important;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"]:has(.portal-r3-shell:is(.role-student,.role-tutor)) .academic-sidebar .academic-role-nav .tabs button {
  min-height: 43px!important;
  padding: 7px 10px!important;
  gap: 9px!important;
  font-size: 11.5px!important;
  line-height: 1.25!important;
  color: #d2e1ef!important;
  border-color: #1e3a54!important;
  border-radius: 10px!important;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"]:has(.portal-r3-shell:is(.role-student,.role-tutor)) .academic-sidebar .academic-role-nav .tabs button.active {
  background: linear-gradient(95deg,#163753,#10253a)!important;
  border-color: #3c789c!important;
  color: #f3faff!important;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"]:has(.portal-r3-shell:is(.role-student,.role-tutor)) .academic-sidebar .academic-role-nav .tabs button .sc-portal-nav-icon {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
}
html:not([data-theme="light"]) body.academic-shell-page .academic-sidebar #nav button:focus-visible,
html:not([data-theme="light"]) body.academic-shell-page .academic-sidebar .tabs button:focus-visible {
  outline: 2px solid #7de6ff!important;
  outline-offset: 2px;
}

/* A2 — ONLY Student/Tutor portal shells, never Guardian or auth screens. */
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) {
  gap: 11px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .portal-hero {
  padding: 13px 17px;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.13);
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) .portal-identity-copy h1 {
  font-size: clamp(21px,2.1vw,26px);
  line-height: 1.2;
  margin: 2px 0 5px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) .portal-identity-copy p {
  font-size: 13px;
  line-height: 1.45;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid {
  gap: 8px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric {
  padding: 9px 10px;
  gap: 8px;
  border-color: #294960;
  border-radius: 11px;
  box-shadow: none;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric small {
  font-size: 10px;
  line-height: 1.35;
  color: #acc0d3;
  letter-spacing: .045em;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric b {
  font-size: 17px;
  line-height: 1.2;
}

/* A3 — Student: bring real learning activity above the marketing/app summary. */
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home {
  display: flex;
  flex-direction: column;
  gap: 11px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home > .student-home-hero { order: 0; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home > .student-home-grid { order: 2; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home > .grammar-app-card { order: 3; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home > .student-home-kpis { order: 4; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home > .card { order: 5; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-welcome,
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-next {
  padding: 15px 16px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-welcome h2 {
  font-size: 23px;
  line-height: 1.22;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-welcome p,
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-next p {
  font-size: 13px;
  line-height: 1.52;
  color: #b6cbde;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-home-kpi {
  padding: 9px 11px;
  box-shadow: none;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-home-kpi small {
  font-size: 10px;
  line-height: 1.35;
  color: #a9bed3;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .grammar-app-card {
  padding: 14px 16px;
  box-shadow: none;
  background: linear-gradient(130deg,#0c2033,#111c34);
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .grammar-app-card h2 {
  font-size: 19px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .grammar-app-card p {
  font-size: 13px;
  line-height: 1.5;
  color: #b9cede;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .grammar-app-card-meta {
  margin-top: 8px;
}

/* A4 — Tutor: working queues and upcoming sessions take precedence over counters. */
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home {
  display: flex;
  flex-direction: column;
  gap: 11px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home > .home-hero { order: 0; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home > .home-grid { order: 2; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home > .home-kpis { order: 3; }
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-welcome,
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .next-session-card {
  padding: 15px 16px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-welcome h2 {
  font-size: 23px;
  line-height: 1.23;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-welcome p,
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .next-session-card p {
  font-size: 13px;
  line-height: 1.52;
  color: #b6cbde;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-kpi {
  padding: 9px 11px;
  box-shadow: none;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-kpi small {
  font-size: 10px;
  line-height: 1.35;
  color: #a9bed3;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-grid > .card,
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-home-grid > .card {
  padding: 15px;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home :is(h2,h3),
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home :is(h2,h3) {
  letter-spacing: -.012em;
}
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home button:focus-visible,
html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home button:focus-visible {
  outline: 2px solid #79e4ff;
  outline-offset: 2px;
}

/* A5 — mobile: compact without microscopic labels or undersized touch controls. */
@media(max-width:900px){
  html:not([data-theme="light"]) body.academic-shell-page .academic-sidebar #nav button,
  html:not([data-theme="light"]) body.academic-shell-page .academic-sidebar .tabs button {
    min-height: 46px!important;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-home-hero,
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-hero {
    gap: 10px;
  }
}
@media(max-width:620px){
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .portal-hero {
    padding: 12px 13px;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) .portal-identity-copy h1 {
    font-size: 21px;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric {
    padding: 9px;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .grammar-app-card {
    padding: 13px 14px;
  }
  /* In the legacy layout mobile identity is stacked vertically: recover
     space without hiding the tutor/student name or action buttons. */
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) .portal-identity {
    display: grid!important;
    grid-template-columns: 54px minmax(0,1fr)!important;
    gap: 11px!important;
    align-items: center!important;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) .portal-avatar-shell {
    width: 54px!important;
    height: 54px!important;
    border-radius: 16px!important;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) .portal-identity-copy p {
    font-size: 12px;
    line-height: 1.43;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid {
    grid-template-columns: repeat(2,minmax(0,1fr))!important;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric {
    min-width: 0;
    align-content: start;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric b,
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .portal-r3-shell:is(.role-student,.role-tutor) > .metric-grid .metric small {
    overflow-wrap: anywhere;
  }
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-student .student-home .student-home-kpis,
  html:not([data-theme="light"]) body[data-academic-shell="portal"] .role-tutor .tutor-home .home-kpis {
    gap: 7px;
  }
}
@media(prefers-reduced-motion:reduce){
  html:not([data-theme="light"]) body.academic-shell-page .academic-sidebar #nav button,
  html:not([data-theme="light"]) body.academic-shell-page .academic-sidebar .tabs button {
    transition: none!important;
  }
}