/* Presentation-only final theme. No navigation, state or permission selectors are changed. */
@media screen {
  html:root {
    --ink:#202531; --muted:#697180; --paper:#f6f7fa; --page:#f6f7fa; --bg:#f6f7fa;
    --card:#fff; --surface:#fff; --line:#e5e7ed; --navy:#202b49;
    --blue:#4255d4; --green:#4255d4; --blue-dark:#3243b5; --blue-soft:#eef0ff;
    --lime:#e4e8ff; --yellow:#e4e8ff; --gold:#ad7616;
    --shadow:0 2px 4px #20253106,0 6px 18px #20253103;
    --ui-sidebar:#f8f9fc; --ui-hover:#eef0f6;
  }
  html[data-theme="dark"] {
    --ink:#e9edf5; --muted:#a8b1c2; --paper:#151922; --page:#151922; --bg:#151922;
    --card:#1e2430; --surface:#1e2430; --line:#343d4c; --navy:#dce3f5;
    --blue:#9daaff; --green:#9daaff; --blue-dark:#8797f6; --blue-soft:#2d3555;
    --ui-sidebar:#1a202b; --ui-hover:#2b3343; --shadow:0 2px 8px #0002;
  }
  html body { background:var(--paper);color:var(--ink);font-family:Inter,"Helvetica Neue",Arial,sans-serif;font-size:14px;line-height:1.5; }
  html body :is(h1,h2,h3,h4) {font-family:inherit;letter-spacing:-.025em;color:var(--ink);line-height:1.3;}
  html body h1 {font-size:26px;font-weight:700;}
  html body h2 {font-size:20px;font-weight:650;}
  html body h3 {font-size:16px;font-weight:650;}
  html body :is(.muted,.page-subtitle) {color:var(--muted);}
  html body .eyebrow {font-size:10px;letter-spacing:.09em;color:var(--blue);}
  html body :is(button,input,select,textarea) {font-family:inherit;}
  html body :is(button,.primary,.ghost) {border-radius:7px;font-weight:600;box-shadow:none;}
  html body main button:not(.primary):not(.link-button):not(.back-link):not(.icon):not(.executive-kpi):not(.active) {background:var(--card);border-color:var(--line);color:var(--ink);}
  html body :is(button.primary,.primary) {background:#4255d4!important;border-color:#4255d4!important;color:#fff!important;}
  html body :is(button.primary,.primary):hover {background:#3445ba!important;border-color:#3445ba!important;}
  html body button:disabled {opacity:.5;cursor:not-allowed;}
  html body :is(button,a,input,select,textarea,summary):focus-visible {outline:3px solid #7b8af099;outline-offset:2px;}
  html body :is(input,select,textarea) {border-color:var(--line);border-radius:7px;background:var(--card);color:var(--ink);}
  html body input::placeholder,html body textarea::placeholder {color:var(--muted);opacity:.85;}
  html body :is(input[type="checkbox"],input[type="radio"],input[type="range"]) {accent-color:#4255d4;}
  html body :is(.panel,.metric,.filters,.course-card,.executive-kpi,.course-search-empty,.login-card) {
    border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);box-shadow:var(--shadow);
  }
  html body .panel {padding:22px;}
  html body :is(.panel-head,.dialog-head) {border-color:var(--line);gap:12px;}
  html body :is(.metrics .metric,.executive-kpi) {background:var(--card)!important;border-color:var(--line)!important;box-shadow:var(--shadow)!important;}
  html body :is(.metric strong,.metric b,.metrics .metric strong) {color:var(--ink);text-shadow:none;font-size:26px;}
  html body :is(.metric span,.metrics .metric span,.metric small) {color:var(--muted);}
  html body :is(.metric.accent b,.finance-hero strong,.staff-total strong) {color:var(--blue);}
  html body table {border-color:var(--line);}
  html body th {background:var(--ui-sidebar);color:var(--muted);font-size:12px;font-weight:650;border-color:var(--line);padding:12px 14px;}
  html body td {border-color:var(--line);padding:13px 14px;}
  html body tbody tr:hover {background:var(--ui-hover);}
  html body :is(.pill,.secure-label) {border-radius:5px;}
  html body :is(dialog,.header-popover,.search-results) {border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);box-shadow:0 18px 60px #10182a25;}
  html body dialog::backdrop {background:#151e3b88;backdrop-filter:blur(3px);}
  html body :is(.toolbar,.actions,.dialog-actions,.pagination-bar) {gap:8px;}
  html body :is(.tabs,.tab-strip) {border-color:var(--line);}
  html body :is(.tabs,.tab-strip) button.active {background:var(--blue-soft)!important;color:var(--blue)!important;border-color:var(--blue)!important;}

  /* Keep the established desktop viewport and mobile drawer behavior. */
  html body aside#sidebar,html body .shell>.side {background:var(--ui-sidebar)!important;color:var(--ink)!important;border-right:1px solid var(--line)!important;}
  html body aside#sidebar {padding-top:0!important;}
  html body #sidebar .brand,html body .side .brand {height:64px!important;min-height:64px!important;padding:0 12px!important;border-bottom:1px solid var(--line);display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-shrink:0;gap:8px;}
  html body #sidebar .brand-logo-frame {width:151px!important;height:48px!important;padding:6px 8px;border-radius:6px!important;background:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;}
  html body :is(.brand-logo,.brand img,.logo-image) {display:block!important;width:auto!important;height:auto!important;max-width:135px!important;max-height:36px!important;object-fit:contain!important;object-position:center!important;mix-blend-mode:normal!important;flex-shrink:0;}
  html body .side .brand img {background:#fff;border-radius:5px;}
  html body .side .brand>div {font-size:11px;min-width:0;}
  html body .side .brand b {font-size:13px;color:var(--ink);}
  html body .side .brand span {font-size:10px;color:var(--muted);}
  html body #sidebar nav {margin-top:15px!important;}
  html body .side nav {margin-top:18px;}
  html body #sidebar nav button,html body .side nav button {color:var(--muted)!important;background:transparent!important;border-radius:6px!important;box-shadow:none!important;font-size:13px;line-height:1.4;}
  html body #sidebar nav button i {color:inherit;}
  html body #sidebar nav button:hover,html body .side nav button:hover {background:var(--ui-hover)!important;color:var(--ink)!important;}
  html body #sidebar nav button.active,html body .side nav button.active {background:var(--blue-soft)!important;color:var(--blue)!important;box-shadow:inset 2px 0 var(--blue)!important;font-weight:650;}
  html body #sidebar .nav-group-toggle {font-weight:650;color:var(--ink)!important;}
  html body #sidebar .nav-group-items {border-color:var(--line);}
  html body :is(.aside-foot,.side footer) {color:var(--muted);border-color:var(--line);}
  html body .aside-foot small {color:var(--muted);}
  html body main>header {height:64px;min-height:64px;background:var(--card);border-bottom:1px solid var(--line);box-shadow:none;}
  html body .global-search {background:var(--ui-sidebar);border:1px solid var(--line);border-radius:7px;}
  html body .global-search input {background:transparent;}
  html body .page-heading {margin-bottom:22px;}
  html body :is(.header-icon,.theme-button) {border-radius:7px;}
  html body .avatar {background:var(--blue-soft);color:var(--blue);}
  html body .executive-welcome {background:linear-gradient(110deg,#3443bb,#5264e4);border-radius:10px;padding:24px;}
  html body .executive-welcome h2 {color:#fff;font-size:24px;}
  html body .executive-welcome :is(p,.eyebrow) {color:#e7eaff;}
  html body .period-switch button {background:transparent!important;color:#f0f2ff!important;}
  html body .period-switch button.active {background:#fff!important;color:#3443bb!important;}
  html body :is(.mini-stats span,.funnel-track div,.conversion-strip,.security-summary) {background:var(--ui-sidebar);border-color:var(--line);color:var(--ink);}
  html body .executive-kpi .kpi-icon {background:var(--blue-soft);color:var(--blue);}
  html body :is(.marketing-hero,.accounts-hero,.agent-hero,.bulk-hero,.conversion-hero,.governance-hero,.hr-hero,.payroll-hero,.portal-hero,.report-hero,.staff-hero,.system-hero,.refund-hero) {background:linear-gradient(110deg,#3443bb,#5264e4)!important;border-radius:10px;color:#fff!important;}
  html body :is(.marketing-hero,.accounts-hero,.agent-hero,.bulk-hero,.conversion-hero,.governance-hero,.hr-hero,.payroll-hero,.portal-hero,.report-hero,.staff-hero,.system-hero,.refund-hero) :is(h1,h2,h3,p,.eyebrow) {color:#fff;}
  html body :is(.marketing-metrics,.finance-metrics,.agent-metrics,.staff-metrics,.hr-metrics,.payroll-metrics,.report-metrics,.communication-metrics,.governance-metrics,.automation-metrics,.copilot-insights)>:is(div,article) {background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);color:var(--ink);}
  html body :is(.marketing-metrics,.finance-metrics,.agent-metrics,.staff-metrics,.hr-metrics,.payroll-metrics,.report-metrics,.communication-metrics,.governance-metrics,.automation-metrics,.copilot-insights) :is(b,strong) {color:var(--ink);}
  html body :is(.marketing-metrics,.finance-metrics,.agent-metrics,.staff-metrics,.hr-metrics,.payroll-metrics,.report-metrics,.communication-metrics,.governance-metrics,.automation-metrics,.copilot-insights) span {color:var(--muted);}
  html body #sidebar nav button.active i {color:var(--blue)!important;}
  html body :is(.journey-strip>div,.status-cloud>span,.suite-stats>div,.quality-card,.ai-message,.course-details,.suite-empty) {background:var(--ui-sidebar);border-color:var(--line);color:var(--ink);}
  html[data-theme="dark"] body :is(.header-icon,.header-actions button,.security-summary,.search-results,.profile-menu,.theme-menu) {background:var(--card)!important;color:var(--ink)!important;border-color:var(--line)!important;}
  html[data-theme="dark"] body :is(.journey-strip b,.suite-stats b,.security-summary b,.side .brand b,.aside-foot) {color:var(--ink);}
  html body .action-centre>div>button {background:transparent!important;}
  html body :is(.login-brand img,.login img) {display:block;width:auto!important;height:auto!important;max-width:160px!important;max-height:44px!important;object-fit:contain;mix-blend-mode:normal;background:#fff!important;border-radius:5px;}
  html body .login-card .brand {flex-wrap:wrap;}
  html body .login-card .brand img {max-width:160px!important;max-height:44px!important;}
  html body .login-card .brand>div {flex-basis:100%;}
  html body #portal>.login {background:radial-gradient(ellipse at top,#e7ebff, #f6f7fa 70%);}
  html body .login-dialog::backdrop {background:#e9edf7ee;}

  @media(min-width:901px) {
    html body #sidebar .brand {margin-left:-16px;margin-right:-16px;padding-left:28px!important;}
    html body .shell>.side {padding-top:0;}
    html body .side .brand {margin-left:-18px;margin-right:-18px;padding-left:18px!important;}
  }
  /* Compact symbol treatment is CSS-only; existing collapse state remains authoritative. */
  html body.sidebar-collapsed #sidebar .brand-logo-frame {width:32px!important;height:32px!important;padding:0;background:#fff url('/studyos-wordmark-2026.png') -6px center/124px auto no-repeat!important;}
  html body.sidebar-collapsed #sidebar .brand-logo {opacity:0;max-width:32px!important;max-height:32px!important;}
  @media(max-width:900px) {
    html body :is(.brand-logo,.brand img,.logo-image) {max-width:120px!important;max-height:32px!important;}
    html body .panel {padding:18px;}
    html body main>header {gap:10px;}
    html body .page-heading h1 {font-size:24px;}
  }
  @media(max-width:560px) {
    html body .executive-welcome {padding:20px;}
    html body .executive-welcome h2 {font-size:21px;}
    html body .period-switch {max-width:100%;flex-wrap:wrap;}
    html body .panel {padding:16px;}
  }
  @media(prefers-reduced-motion:reduce) {html body * {scroll-behavior:auto!important;transition:none!important;}}
}