/* NEETAce design system - one look for every page.
 *
 * Loaded last on every page (see scripts/apply-theme.js). The theme comes from
 * the student's own choice in the app (localStorage na_theme), applied before
 * paint by /lib/theme-boot.js, so moving between pages never switches look.
 *
 * Tokens use html:root[data-theme=...] so they win over the older per-page
 * :root palettes without editing every page. Older variable names used across
 * pages (--card, --panel, --ink, --line, --brand ...) are aliased to the same
 * tokens.
 */

html:root{
  --f-disp:"Bricolage Grotesque",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
  --brand-navy:#0a2342; --brand-amber:#f59e0b; --brand-green:#10b981;
  --r:12px; --r-sm:8px; --r-lg:16px;
}

/* ---- Default: "start" (the app's default skin) ---- */
html:root,
html:root[data-theme="start"]{
  --navy:#0a2342; --blue:#1a56db; --blue-d:#1647b8; --blue-l:#eef4ff;
  --green:#0ca30c; --green-l:#e8fdf5; --amber:#f59e0b; --amber-l:#fef3e2;
  --red:#dc2626; --red-l:#feecec; --purple:#4a3aa7; --purple-l:#f3e8ff;
  --teal:#1baf7a; --teal-l:#e1f5ee;
  --bg:#f4f7fd; --page-bg:linear-gradient(180deg,#eef4ff 0,#f7f9fc 45%,#fff 100%) fixed;
  --surf:#ffffff; --surf2:#f8faff; --surf3:#eef3fb; --bdr:#dfe6ef;
  --txt:#172033; --txt2:#344054; --mute:#667085;
  --sh:0 1px 2px rgba(15,35,65,.06),0 2px 8px rgba(15,35,65,.05);
  --sh-lg:0 10px 28px rgba(27,54,93,.13);
  --appbar:linear-gradient(120deg,#0a2342 0%,#123a8c 58%,#1a56db 100%);
  --appbar-txt:#ffffff; --appbar-mute:#c9d8f5;
  color-scheme:light;
}
html:root[data-theme="light"]{
  --navy:#0a2342; --blue:#1a56db; --blue-d:#1647b8; --blue-l:#e8f0fe;
  --green:#0ca30c; --green-l:#e8fdf5; --amber:#f59e0b; --amber-l:#fef3e2;
  --red:#dc2626; --red-l:#feecec; --purple:#4a3aa7; --purple-l:#f3e8ff;
  --teal:#1baf7a; --teal-l:#e1f5ee;
  --bg:#f0f4f8; --page-bg:#f0f4f8;
  --surf:#ffffff; --surf2:#f8faff; --surf3:#edf2f8; --bdr:#e2e8f0;
  --txt:#1a202c; --txt2:#344054; --mute:#718096;
  --sh:0 1px 2px rgba(0,0,0,.06),0 2px 6px rgba(0,0,0,.05); --sh-lg:0 10px 28px rgba(0,0,0,.12);
  --appbar:linear-gradient(120deg,#0a2342 0%,#123a8c 58%,#1a56db 100%);
  --appbar-txt:#ffffff; --appbar-mute:#c9d8f5;
  color-scheme:light;
}
/* Dark: the navy "instrument" palette already used by the test and analytics
   pages, now shared by every page including the main app. */
html:root[data-theme="dark"]{
  --navy:#0a2342; --blue:#4f8dff; --blue-d:#3b78ec; --blue-l:rgba(79,141,255,.16);
  --green:#18d3a0; --green-l:rgba(24,211,160,.14); --amber:#f6b23c; --amber-l:rgba(246,178,60,.14);
  --red:#ff6b6b; --red-l:rgba(255,107,107,.14); --purple:#a98bff; --purple-l:rgba(169,139,255,.16);
  --teal:#38bdf8; --teal-l:rgba(56,189,248,.14);
  --bg:#0a0e1a;
  --page-bg:radial-gradient(1100px 600px at 82% -8%,rgba(79,141,255,.10),transparent 60%),radial-gradient(900px 520px at 8% 4%,rgba(24,211,160,.07),transparent 55%),#0a0e1a;
  --surf:#111830; --surf2:#182140; --surf3:#1e2950; --bdr:#28324f;
  --txt:#ecf1fb; --txt2:#c9d3e8; --mute:#a2b0ce;
  --sh:0 1px 2px rgba(0,0,0,.4); --sh-lg:0 14px 34px rgba(0,0,0,.5);
  --appbar:linear-gradient(120deg,#070b16 0%,#0f1d40 60%,#163574 100%);
  --appbar-txt:#ecf1fb; --appbar-mute:#a2b0ce;
  color-scheme:dark;
}
html:root[data-theme="saffron"]{
  --navy:#431407; --blue:#c2410c; --blue-d:#9a3412; --blue-l:#ffedd5;
  --green:#166534; --green-l:#dcfce7; --amber:#b45309; --amber-l:#fef3c7;
  --red:#b91c1c; --red-l:#fee2e2; --purple:#78350f; --purple-l:#fef3c7;
  --teal:#115e59; --teal-l:#ccfbf1;
  --bg:#fcf8f2; --page-bg:#fcf8f2;
  --surf:#fffaf4; --surf2:#fbf3e6; --surf3:#f6ead6; --bdr:#eddcb9;
  --txt:#3c1a0c; --txt2:#5c3420; --mute:#7d5a46;
  --sh:0 1px 2px rgba(67,20,7,.06),0 2px 8px rgba(67,20,7,.05); --sh-lg:0 10px 28px rgba(67,20,7,.12);
  --appbar:linear-gradient(120deg,#431407 0%,#9a3412 60%,#c2410c 100%);
  --appbar-txt:#fffaf4; --appbar-mute:#fde3c8;
  color-scheme:light;
}
html:root[data-theme="forest"]{
  --navy:#052e2a; --blue:#2dd4bf; --blue-d:#14b8a6; --blue-l:rgba(45,212,191,.14);
  --green:#34d399; --green-l:rgba(52,211,153,.14); --amber:#fbbf24; --amber-l:rgba(251,191,36,.14);
  --red:#f87171; --red-l:rgba(248,113,113,.14); --purple:#93c5fd; --purple-l:rgba(147,197,253,.14);
  --teal:#5eead4; --teal-l:rgba(94,234,212,.14);
  --bg:#051412; --page-bg:#051412;
  --surf:#09211d; --surf2:#11352f; --surf3:#174139; --bdr:#1c4d44;
  --txt:#e6f4f1; --txt2:#c4dfd9; --mute:#9bbab3;
  --sh:0 1px 2px rgba(0,0,0,.35); --sh-lg:0 14px 34px rgba(0,0,0,.45);
  --appbar:linear-gradient(120deg,#031210 0%,#0a2d28 60%,#0f4a42 100%);
  --appbar-txt:#e6f4f1; --appbar-mute:#9bbab3;
  color-scheme:dark;
}
html:root[data-theme="royal"]{
  --navy:#2e1065; --blue:#c084fc; --blue-d:#a855f7; --blue-l:rgba(192,132,252,.16);
  --green:#4ade80; --green-l:rgba(74,222,128,.14); --amber:#fbbf24; --amber-l:rgba(251,191,36,.14);
  --red:#fb7185; --red-l:rgba(251,113,133,.14); --purple:#a855f7; --purple-l:rgba(168,85,247,.16);
  --teal:#2dd4bf; --teal-l:rgba(45,212,191,.14);
  --bg:#07030e; --page-bg:#07030e;
  --surf:#100720; --surf2:#1a0c33; --surf3:#231245; --bdr:#2e175c;
  --txt:#f1ecf9; --txt2:#d9cdef; --mute:#ab9dc7;
  --sh:0 1px 2px rgba(0,0,0,.4); --sh-lg:0 14px 34px rgba(0,0,0,.5);
  --appbar:linear-gradient(120deg,#07030e 0%,#1d0b3d 60%,#3b1677 100%);
  --appbar-txt:#f1ecf9; --appbar-mute:#ab9dc7;
  color-scheme:dark;
}

/* Pastel: flat colour-block tiles with black text and thin dark rules, framed
   by a near-black app bar. Reading surfaces (questions, options, inputs)
   stay off-white. */
html:root[data-theme="pastel"]{
  --navy:#131313; --blue:#24127f; --blue-d:#170a5c; --blue-l:#dbd0ff;
  --green:#0a6b49; --green-l:#b2fffe; --amber:#7a5b00; --amber-l:#f0ff31;
  --red:#b3261e; --red-l:#ffd2c6; --purple:#6b2fc0; --purple-l:#e5baff;
  --teal:#0a6b6a; --teal-l:#b2fffe;
  --bg:#f2f0fb; --page-bg:#f2f0fb;
  --surf:#f8f9ff; --surf2:#ece8ff; --surf3:#dbd0ff; --bdr:rgba(19,19,19,.24);
  --txt:#131313; --txt2:#262335; --mute:#4a4560;
  --sh:none; --sh-lg:0 10px 28px rgba(19,19,19,.14);
  --appbar:#131313; --appbar-txt:#f8f9ff; --appbar-mute:#c9bff2;
  --tile-1:#ac86ff; --tile-2:#b2fffe; --tile-3:#da9cff; --tile-4:#f0ff31; --tile-5:#f88468; --tile-6:#dbd0ff;
  color-scheme:light;
}

/* Calm Paper (default): warm ivory paper, near-black ink, one muted clay
   accent, serif headings, hairline borders and no gradients - quiet enough to
   study on for hours. */
html:root[data-theme="paper"]{
  --f-disp:"Source Serif 4","Iowan Old Style",Georgia,"Times New Roman",serif;
  --navy:#1f1e1b; --blue:#b4532f; --blue-d:#933f20; --blue-l:#f5e6dd;
  --green:#3f7a4a; --green-l:#e6efe3; --amber:#9a6412; --amber-l:#f6ecd7;
  --red:#b3372b; --red-l:#f7e2dd; --purple:#5d4f86; --purple-l:#ebe6f3;
  --teal:#2f7069; --teal-l:#e0eeec;
  --bg:#faf9f5; --page-bg:#faf9f5;
  --surf:#ffffff; --surf2:#f5f4ee; --surf3:#eeece4; --bdr:#e5e2d8;
  --txt:#1f1e1b; --txt2:#3d3a34; --mute:#6b675f;
  --sh:0 1px 2px rgba(31,30,27,.04); --sh-lg:0 8px 24px rgba(31,30,27,.08);
  --appbar:#faf9f5; --appbar-txt:#1f1e1b; --appbar-mute:#6b675f;
  color-scheme:light;
}

/* ---- Names the older pages use, pointed at the shared tokens ---- */
html:root[data-theme],html:root{
  --card:var(--surf); --card-2:var(--surf2); --surface:var(--surf); --surface-2:var(--surf2);
  --panel:var(--surf); --panel-2:var(--surf2); --panel-3:var(--surf3);
  --line:var(--bdr); --line-soft:var(--surf2); --border:var(--bdr);
  --ink:var(--txt); --text:var(--txt); --text-primary:var(--txt); --muted:var(--mute); --faint:var(--mute);
  --brand:var(--blue); --brand-2:var(--blue); --accent:var(--blue); --primary:var(--blue);
  --brand-dim:var(--blue-l); --bg-2:var(--bg);
  --bank-bg:var(--bg); --bank-surface:var(--surf); --bank-ink:var(--txt); --bank-muted:var(--mute); --bank-line:var(--bdr); --bank-accent:var(--blue);
}

/* ---- Base: page, type and controls ---- */
html:root[data-theme] body,html:root body{
  background:var(--page-bg)!important;
  color:var(--txt);
  font-family:var(--f-body)!important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
html:root body :is(h1,h2,h3,h4),
html:root body .font-display,
html:root body .font-serif{font-family:var(--f-disp)!important;letter-spacing:-.015em}
html:root body :is(button,input,select,textarea,optgroup){font-family:inherit}
html:root body :is(code,pre,kbd,samp,.font-mono,.mono){font-family:var(--f-mono)!important}
html:root body textarea.font-mono{font-family:var(--f-mono)!important}
::selection{background:var(--blue);color:#fff}
html:root body :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid color-mix(in srgb,var(--blue) 70%,transparent);outline-offset:2px;
}
@media (prefers-reduced-motion:reduce){
  html:root *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---- Tailwind pages in a light theme: the brand palette, not Tailwind's ---- */
html:root[data-mode="light"] :is(.bg-slate-50,.bg-gray-50,.bg-\[\#f8fafc\]){background-color:var(--surf2)!important}
html:root[data-mode="light"] .bg-white{background-color:var(--surf)!important}
html:root[data-mode="light"] :is(.bg-slate-100,.bg-gray-100){background-color:var(--surf3)!important}
html:root[data-mode="light"] :is(.border-slate-100,.border-slate-200,.border-gray-100,.border-gray-200,.border-slate-200\/80){border-color:var(--bdr)!important}
html:root[data-mode="light"] :is(.text-slate-900,.text-slate-800,.text-gray-900,.text-gray-800){color:var(--txt)!important}
html:root[data-mode="light"] :is(.text-slate-700,.text-slate-600,.text-gray-700,.text-gray-600){color:var(--txt2)!important}
html:root[data-mode="light"] :is(.text-slate-500,.text-slate-400,.text-gray-500,.text-gray-400){color:var(--mute)!important}
html:root[data-mode="light"] :is(.bg-blue-600,.bg-indigo-600){background-color:var(--blue)!important}
html:root[data-mode="light"] :is(.hover\:bg-blue-700:hover,.hover\:bg-indigo-700:hover){background-color:var(--blue-d)!important}
html:root[data-mode="light"] :is(.text-blue-600,.text-indigo-600){color:var(--blue)!important}
html:root[data-mode="light"] :is(.text-blue-700,.text-indigo-700,.text-indigo-900){color:var(--blue-d)!important}
html:root[data-mode="light"] :is(.bg-blue-50,.bg-indigo-50,.bg-blue-100,.bg-indigo-100){background-color:var(--blue-l)!important}
html:root[data-mode="light"] :is(.border-blue-500,.border-indigo-600,.border-indigo-400){border-color:var(--blue)!important}
html:root[data-mode="light"] :is(.border-indigo-100,.border-indigo-200,.border-blue-200){border-color:color-mix(in srgb,var(--blue) 25%,var(--bdr))!important}

/* ---- Shared app bar (lib/app-shell.js) ---- */
.na-appbar{position:sticky;top:0;z-index:60;font-family:var(--f-body);margin:0;padding:0;text-align:left;line-height:1.3;width:auto;max-width:none}
.na-appbar *{box-sizing:border-box}
.na-appbar :is(a,button,span,img,i){margin:0;float:none}
.na-appbar-top{background:var(--appbar);color:var(--appbar-txt);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.na-appbar-inner{max-width:1280px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:12px}
.na-appbar-top .na-appbar-inner{min-height:58px}
.na-appbar a{color:inherit;text-decoration:none}
.na-brand{display:flex;align-items:center;gap:10px;min-width:0}
.na-brand img{width:34px;height:34px;border-radius:9px;flex-shrink:0;background:#fff}
.na-brand-text{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.na-brand-text .neetace-brand-logo{font-size:17px}
.na-brand-sub{font-size:11px;font-weight:600;color:var(--appbar-mute);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.na-spacer{flex:1}
.na-roles{display:flex;gap:4px;background:rgba(255,255,255,.10);border-radius:999px;padding:3px}
.na-roles a{font-size:12px;font-weight:700;padding:5px 11px;border-radius:999px;color:var(--appbar-mute)}
.na-roles a[aria-current="true"]{background:#fff;color:#0a2342}
.na-iconbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;height:36px;padding:0 10px;border-radius:10px;border:0;
  background:rgba(255,255,255,.12);color:var(--appbar-txt);font:600 13px var(--f-body);cursor:pointer}
.na-iconbtn:hover{background:rgba(255,255,255,.2)}
.na-avatar{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#0a2342;font:800 14px var(--f-disp)}
.na-tabs{background:var(--surf);border-bottom:1px solid var(--bdr);box-shadow:var(--sh)}
.na-tabs .na-appbar-inner{gap:2px;overflow-x:auto;scrollbar-width:none}
.na-tabs .na-appbar-inner::-webkit-scrollbar{display:none}
.na-tab{display:flex;align-items:center;gap:7px;padding:12px 12px 10px;border-bottom:3px solid transparent;color:var(--mute);font-size:13.5px;font-weight:600;white-space:nowrap}
.na-tab i{font-size:17px}
.na-tab:hover{color:var(--txt)}
.na-tab[aria-current="page"]{color:var(--blue);border-bottom-color:var(--blue)}
.na-tab-actions{margin-left:auto;display:flex;align-items:center;gap:8px;padding:6px 0 6px 12px;flex-shrink:0}
.na-page-title{max-width:1280px;margin:0 auto;padding:18px 16px 0}
.na-page-title h1{font-size:clamp(22px,2.4vw,28px);margin:0;color:var(--txt)}
.na-page-title p{margin:4px 0 0;color:var(--mute);font-size:14px}
[data-na-legacy-header]{display:none!important}
@media (max-width:640px){
  .na-brand-sub,.na-roles,.na-iconbtn .na-label{display:none}
  .na-tab{padding:11px 10px 9px;font-size:13px}
}
@media print{.na-appbar{display:none!important}}

/* ---- Pastel tiles: cards cycle through the six tile colours ---- */
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.study-mode-card,.section,.item,.policy,.draft-group,.curate-card,.book-card,.summary>div,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)){
  background:var(--tile-6)!important;color:#131313;border-color:rgba(19,19,19,.18)!important;box-shadow:none!important;
}
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.study-mode-card,.section,.item,.policy,.draft-group,.curate-card,.book-card,.summary>div,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)):nth-child(6n+1){background:var(--tile-1)!important}
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.study-mode-card,.section,.item,.policy,.draft-group,.curate-card,.book-card,.summary>div,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)):nth-child(6n+2){background:var(--tile-2)!important}
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.study-mode-card,.section,.item,.policy,.draft-group,.curate-card,.book-card,.summary>div,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)):nth-child(6n+3){background:var(--tile-3)!important}
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.study-mode-card,.section,.item,.policy,.draft-group,.curate-card,.book-card,.summary>div,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)):nth-child(6n+4){background:var(--tile-4)!important}
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.study-mode-card,.section,.item,.policy,.draft-group,.curate-card,.book-card,.summary>div,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)):nth-child(6n+5){background:var(--tile-5)!important}
/* A tile inside a tile, and every reading surface, stays light. */
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.section,.item,.curate-card,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)) :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.section,.item,.policy,.curate-card,.bg-white:is(.rounded-xl,.rounded-2xl,.rounded-3xl)){background:rgba(255,255,255,.55)!important}
html:root[data-theme="pastel"] :is(.qcard,.q-block,.opt,.paper-sheet,input,select,textarea){background-color:var(--surf)}
html:root[data-theme="pastel"] :is(.card,.panel,.panel-card,.feature,.metric,.plan,.mcard,.section,.item) :is(.muted,.small,.hint,.mute){color:#2a2540}
/* Pastel frame: the app's own banners go near-black, like the app bar. */
html:root[data-theme="pastel"] :is(.topbar,.hero,.rhero,.tqhdr){background:#131313!important;color:#f8f9ff}
html:root[data-theme="pastel"] .sc.phy{background:var(--tile-1)}
html:root[data-theme="pastel"] .sc.chem{background:var(--tile-2)}
html:root[data-theme="pastel"] .sc.bio{background:var(--tile-4)}

/* ---- Calm Paper: flat, quiet surfaces ----
   Banners lose their gradients and become paper cards; cards keep a hairline
   border instead of a shadow; titles use the serif. */
html:root[data-theme="paper"] .app{background:var(--bg);box-shadow:none}
html:root[data-theme="paper"] .topbar{background:var(--bg)!important;color:var(--txt);border-bottom:1px solid var(--bdr)}
html:root[data-theme="paper"] .topbar .brand-sub{color:var(--mute);opacity:1}
html:root[data-theme="paper"] .topbar :is(.streak-pill,.ib){background:var(--surf);border:1px solid var(--bdr);color:var(--txt)}
html:root[data-theme="paper"] .topbar .ib:hover{background:var(--surf2)}
html:root[data-theme="paper"] .nav{background:var(--bg)}
html:root[data-theme="paper"] .nb.active{font-weight:700}
html:root[data-theme="paper"] .app :is(.hero,.rhero,.tqhdr){background:var(--surf)!important;color:var(--txt)!important;border:1px solid var(--bdr);box-shadow:none!important}
html:root[data-theme="paper"] .app :is(.hero,.rhero)::before,
html:root[data-theme="paper"] .bt-circuit-bg::after{display:none!important}
html:root[data-theme="paper"] .hero .hero-title{font-family:var(--f-disp)!important;font-weight:600!important;font-size:clamp(22px,3vw,28px)!important;letter-spacing:-.01em;margin:2px 0}
html:root[data-theme="paper"] .hero-cta-primary{background:var(--blue)!important;color:#fff!important;border:0!important}
html:root[data-theme="paper"] .hero-cta-primary:hover{background:var(--blue-d)!important}
html:root[data-theme="paper"] .hero-cta-ghost{background:var(--surf)!important;color:var(--txt)!important;border:1px solid var(--bdr)!important}
html:root[data-theme="paper"] .hero-cta-ghost:hover{background:var(--surf2)!important}
html:root[data-theme="paper"] :is(.hero-cta-primary,.hero-cta-ghost):focus-visible{outline-color:var(--blue)}
html:root[data-theme="paper"] .hs{background:var(--surf2);border:1px solid var(--bdr)}
html:root[data-theme="paper"] .hs-icon{background:var(--blue-l);color:var(--blue)}
html:root[data-theme="paper"] .hs-n{font-family:var(--f-disp)!important;font-weight:600}
html:root[data-theme="paper"] .sec-hd{font-family:var(--f-disp)!important;font-size:18px;font-weight:600;color:var(--txt);letter-spacing:-.01em}
html:root[data-theme="paper"] .sec-hd i{color:var(--mute)}
html:root[data-theme="paper"] :is(.card,.study-mode-card,.sc,.qbox){box-shadow:none!important;border:1px solid var(--bdr)!important}
html:root[data-theme="paper"] :is(.sc.phy,.sc.chem,.sc.bio){background:var(--surf)!important}
html:root[data-theme="paper"] :is(.sc,.study-mode-card,.card):hover{transform:none!important;box-shadow:none!important;border-color:color-mix(in srgb,var(--blue) 35%,var(--bdr))!important}
html:root[data-theme="paper"] .brain-boost-card{background:var(--surf2)!important;border:1px solid var(--bdr)!important}
html:root[data-theme="paper"] :is(.btn-blue,.btn-green,.btn-red,.btn-purple){box-shadow:none}
html:root[data-theme="paper"] .btn:hover{transform:none}
/* The wordmark keeps its navy backing so white NEET and c stay readable on paper. */
html:root[data-theme="paper"] .na-appbar .neetace-brand-logo{background:#0a2342;padding:3px 9px;border-radius:8px}
html:root[data-theme="paper"] .na-appbar-top{border-bottom:1px solid var(--bdr);box-shadow:none}
html:root[data-theme="paper"] .na-iconbtn{background:var(--surf);border:1px solid var(--bdr);color:var(--txt)}
html:root[data-theme="paper"] .na-iconbtn:hover{background:var(--surf2)}
html:root[data-theme="paper"] .na-roles{background:var(--surf2);border:1px solid var(--bdr)}
html:root[data-theme="paper"] .na-roles a[aria-current="true"]{background:var(--txt);color:var(--bg)}
html:root[data-theme="paper"] .na-tabs{background:var(--bg);box-shadow:none}
html:root[data-theme="paper"] .na-page-title h1{font-weight:600}
/* Profile plan banner: flat ink instead of the colour gradient. */
html:root[data-theme="paper"] #planBand{background:var(--txt)!important;color:var(--bg)!important}
/* Landing-page call to action (/start): the paper accent, without the glow. */
html:root[data-theme="paper"] .cta{background:var(--blue)!important;color:#fff!important;box-shadow:none!important}
html:root[data-theme="paper"] .cta:hover{background:var(--blue-d)!important;transform:none!important}
html:root[data-theme="paper"] .cta.green{background:var(--green)!important}
html:root[data-theme="paper"] ::selection{background:var(--blue-l);color:var(--txt)}

/* Tooltips: add data-tip="..." to any control. Shown on hover and keyboard
   focus; touch screens rely on the visible help text next to the control. */
[data-tip]{position:relative}
[data-tip]:hover::after,[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:max-content;max-width:min(280px,80vw);padding:8px 10px;border-radius:8px;background:#1b2430;color:#fff;font:500 12.5px/1.4 var(--na-font-body,system-ui,sans-serif);letter-spacing:0;text-transform:none;text-align:left;white-space:normal;z-index:1000;box-shadow:0 6px 18px rgba(0,0,0,.22);pointer-events:none}
@media (hover:none){[data-tip]:hover::after{display:none}}

/* NEETAce wordmark, in every theme and on every page (also in brand.css).
   theme.css is loaded everywhere, so the logo keeps its navy backing and
   white/amber/green letters even on pages without brand.css, where it used
   to fall back to plain text that vanished on light headers. Opted out of
   phone "auto dark" recolouring and Windows high-contrast overrides, with a
   faint edge so the navy badge stays visible on navy and black headers. */
.neetace-brand-logo{display:inline-flex;align-items:baseline;white-space:nowrap;vertical-align:middle;background:#0a2342 !important;color:#fff !important;padding:.18em .38em;border-radius:.3em;font-weight:900;line-height:1.15;letter-spacing:-.02em;text-decoration:none;box-shadow:0 0 0 1px rgba(255,255,255,.16);color-scheme:only light;forced-color-adjust:none;-webkit-print-color-adjust:exact;print-color-adjust:exact;text-shadow:none}
.neetace-brand-logo>span{display:inline;font:inherit;letter-spacing:inherit;background:transparent !important;padding:0;margin:0;-webkit-text-fill-color:currentColor}
.neetace-brand-logo>.neet,.neetace-brand-logo>.letter-c{color:#fff !important}
.neetace-brand-logo>.letter-a{color:#f59e0b !important}
.neetace-brand-logo>.letter-e{color:#10b981 !important}
@media (forced-colors:active){.neetace-brand-logo{border:1px solid CanvasText}}
.neetace-brand-badge>.neetace-brand-logo{box-shadow:none}
