/* GENERATED by frontend-build/make_theme_css.py — edit that (palette) or theme-dark.css (the rest). */
/* Dark theme (2026-10-20): navy / blue / white. Light = the site as it always was (no rules apply). */
html[data-theme="dark"] .bg-\[\#F5F0EB\]{background-color:#18243D}
html[data-theme="dark"] .bg-\[\#F8D9CE\]{background-color:rgba(59,130,246,0.3)}
html[data-theme="dark"] .bg-\[\#FAF9F5\]{background-color:#0B1120}
html[data-theme="dark"] .bg-\[\#FAF9F5\]\/90{background-color:rgba(11,17,32,.88)}
html[data-theme="dark"] .bg-\[\#FAF9F5\]\/95{background-color:rgba(11,17,32,.95)}
html[data-theme="dark"] .bg-amber-100{background-color:rgba(245,158,11,0.16)}
html[data-theme="dark"] .bg-amber-200\/20{background-color:rgba(245,158,11,0.08)}
html[data-theme="dark"] .bg-amber-50{background-color:rgba(245,158,11,0.1)}
html[data-theme="dark"] .bg-amber-50\/80{background-color:rgba(245,158,11,0.1)}
html[data-theme="dark"] .bg-clay{background-color:#3B82F6}
html[data-theme="dark"] .bg-clay-subtle{background-color:rgba(59,130,246,0.14)}
html[data-theme="dark"] .bg-clay-subtle\/60{background-color:rgba(59,130,246,0.1)}
html[data-theme="dark"] .bg-clay-subtle\/80{background-color:rgba(59,130,246,0.14)}
html[data-theme="dark"] .bg-clay\/10{background-color:rgba(59,130,246,0.1)}
html[data-theme="dark"] .bg-cyan-100{background-color:rgba(6,182,212,0.18)}
html[data-theme="dark"] .bg-cyan-50{background-color:rgba(6,182,212,0.12)}
html[data-theme="dark"] .bg-emerald-50{background-color:rgba(16,185,129,0.12)}
html[data-theme="dark"] .bg-ink{background-color:#2563EB}
html[data-theme="dark"] .bg-ink-muted{background-color:#5B6B88}
html[data-theme="dark"] .bg-ink-subtle{background-color:#3A4A68}
html[data-theme="dark"] .bg-ink\/40{background-color:rgba(2,6,23,.6)}
html[data-theme="dark"] .bg-paper{background-color:#0B1120}
html[data-theme="dark"] .bg-paper-border{background-color:#24314D}
html[data-theme="dark"] .bg-paper-subtle{background-color:#18243D}
html[data-theme="dark"] .bg-paper-subtle\/40{background-color:rgba(24,36,61,.45)}
html[data-theme="dark"] .bg-paper-subtle\/60{background-color:rgba(24,36,61,.6)}
html[data-theme="dark"] .bg-red-50{background-color:rgba(239,68,68,0.12)}
html[data-theme="dark"] .bg-sky-50{background-color:rgba(14,165,233,0.12)}
html[data-theme="dark"] .bg-teal-50{background-color:rgba(20,184,166,0.12)}
html[data-theme="dark"] .bg-white{background-color:#131D33}
html[data-theme="dark"] .bg-white\/80{background-color:rgba(19,29,51,.85)}
html[data-theme="dark"] .border-amber-100{border-color:rgba(245,158,11,0.2)}
html[data-theme="dark"] .border-amber-200{border-color:rgba(245,158,11,0.3)}
html[data-theme="dark"] .border-amber-300{border-color:rgba(245,158,11,0.4)}
html[data-theme="dark"] .border-clay{border-color:#3B82F6}
html[data-theme="dark"] .border-clay\/20{border-color:rgba(59,130,246,0.3)}
html[data-theme="dark"] .border-clay\/25{border-color:rgba(59,130,246,0.35)}
html[data-theme="dark"] .border-clay\/40{border-color:rgba(59,130,246,0.5)}
html[data-theme="dark"] .border-cyan-100{border-color:rgba(6,182,212,0.22)}
html[data-theme="dark"] .border-cyan-200{border-color:rgba(6,182,212,0.32)}
html[data-theme="dark"] .border-emerald-200{border-color:rgba(16,185,129,0.3)}
html[data-theme="dark"] .border-paper-border{border-color:#24314D}
html[data-theme="dark"] .border-paper-borderLight{border-color:#1C2840}
html[data-theme="dark"] .border-red-100{border-color:rgba(239,68,68,0.25)}
html[data-theme="dark"] .border-red-200{border-color:rgba(239,68,68,0.35)}
html[data-theme="dark"] .border-sky-100{border-color:rgba(14,165,233,0.25)}
html[data-theme="dark"] .border-teal-200{border-color:rgba(20,184,166,0.3)}
html[data-theme="dark"] .border-white{border-color:#0B1120}
html[data-theme="dark"] .disabled\:hover\:bg-clay:disabled:hover{background-color:#3B82F6}
html[data-theme="dark"] .disabled\:hover\:bg-paper:disabled:hover{background-color:#0B1120}
html[data-theme="dark"] .disabled\:hover\:border-paper-border:disabled:hover{border-color:#24314D}
html[data-theme="dark"] .focus-within\:border-clay\/40:focus-within{border-color:rgba(59,130,246,0.55)}
html[data-theme="dark"] .focus-within\:shadow-\[0_0_0_4px_rgba\(217\,101\,59\,0\.10\)\]:focus-within{--tw-shadow:0 0 0 4px rgba(59,130,246,0.18);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}
html[data-theme="dark"] .focus\:border-clay\/40:focus{border-color:rgba(59,130,246,0.55)}
html[data-theme="dark"] .focus\:ring-clay\/30:focus{--tw-ring-color:rgba(59,130,246,0.35)}
html[data-theme="dark"] .from-amber-50{--tw-gradient-from:rgba(245,158,11,0.1) var(--tw-gradient-from-position);--tw-gradient-to:rgba(245,158,11,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
html[data-theme="dark"] .from-cyan-50{--tw-gradient-from:rgba(6,182,212,0.12) var(--tw-gradient-from-position);--tw-gradient-to:rgba(6,182,212,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
html[data-theme="dark"] .hover\:bg-amber-100:hover{background-color:rgba(245,158,11,0.18)}
html[data-theme="dark"] .hover\:bg-amber-200\/70:hover{background-color:rgba(245,158,11,0.22)}
html[data-theme="dark"] .hover\:bg-black:hover{background-color:#1D4ED8}
html[data-theme="dark"] .hover\:bg-clay:hover{background-color:#3B82F6}
html[data-theme="dark"] .hover\:bg-clay-hover:hover{background-color:#2563EB}
html[data-theme="dark"] .hover\:bg-clay-subtle:hover{background-color:rgba(59,130,246,0.16)}
html[data-theme="dark"] .hover\:bg-clay\/15:hover{background-color:rgba(59,130,246,0.18)}
html[data-theme="dark"] .hover\:bg-cyan-100:hover{background-color:rgba(6,182,212,0.2)}
html[data-theme="dark"] .hover\:bg-ink:hover{background-color:#2563EB}
html[data-theme="dark"] .hover\:bg-paper-border\/50:hover{background-color:rgba(36,49,77,.5)}
html[data-theme="dark"] .hover\:bg-paper-border\/60:hover{background-color:rgba(36,49,77,.6)}
html[data-theme="dark"] .hover\:bg-paper-subtle:hover{background-color:#18243D}
html[data-theme="dark"] .hover\:bg-paper-subtle\/60:hover{background-color:rgba(24,36,61,.6)}
html[data-theme="dark"] .hover\:bg-red-100:hover{background-color:rgba(239,68,68,0.2)}
html[data-theme="dark"] .hover\:bg-red-50:hover{background-color:rgba(239,68,68,0.12)}
html[data-theme="dark"] .hover\:border-clay:hover{border-color:#3B82F6}
html[data-theme="dark"] .hover\:border-clay\/40:hover{border-color:rgba(59,130,246,0.5)}
html[data-theme="dark"] .hover\:border-paper-border:hover{border-color:#24314D}
html[data-theme="dark"] .hover\:border-red-300:hover{border-color:rgba(239,68,68,0.5)}
html[data-theme="dark"] .hover\:text-amber-900:hover{color:#FEF3C7}
html[data-theme="dark"] .hover\:text-clay-hover:hover{color:#93C5FD}
html[data-theme="dark"] .hover\:text-ink:hover{color:#E8EEF9}
html[data-theme="dark"] .hover\:text-red-600:hover{color:#F87171}
html[data-theme="dark"] .ring-ink\/15{--tw-ring-color:rgba(232,238,249,.15)}
html[data-theme="dark"] .text-\[\#141413\]{color:#E8EEF9}
html[data-theme="dark"] .text-amber-500{color:#FBBF24}
html[data-theme="dark"] .text-amber-600{color:#FBBF24}
html[data-theme="dark"] .text-amber-700{color:#FCD34D}
html[data-theme="dark"] .text-amber-700\/70{color:rgba(252,211,77,.7)}
html[data-theme="dark"] .text-amber-800{color:#FDE68A}
html[data-theme="dark"] .text-amber-900{color:#FDE68A}
html[data-theme="dark"] .text-amber-950{color:#FEF3C7}
html[data-theme="dark"] .text-clay{color:#60A5FA}
html[data-theme="dark"] .text-clay\/60{color:rgba(96,165,250,.6)}
html[data-theme="dark"] .text-clay\/\[0\.025\]{color:rgba(96,165,250,.035)}
html[data-theme="dark"] .text-cyan-600{color:#22D3EE}
html[data-theme="dark"] .text-cyan-700{color:#67E8F9}
html[data-theme="dark"] .text-cyan-800{color:#A5F3FC}
html[data-theme="dark"] .text-emerald-700{color:#34D399}
html[data-theme="dark"] .text-green-700{color:#4ADE80}
html[data-theme="dark"] .text-ink{color:#E8EEF9}
html[data-theme="dark"] .text-ink-muted{color:#A9B6CC}
html[data-theme="dark"] .text-ink-subtle{color:#7D8BA3}
html[data-theme="dark"] .text-ink-subtle\/50{color:rgba(125,139,163,.5)}
html[data-theme="dark"] .text-ink-subtle\/60{color:rgba(125,139,163,.6)}
html[data-theme="dark"] .text-red-600{color:#F87171}
html[data-theme="dark"] .text-teal-700{color:#5EEAD4}
html[data-theme="dark"] .text-teal-900{color:#99F6E4}
html[data-theme="dark"] .to-orange-50{--tw-gradient-to:rgba(59,130,246,0.06) var(--tw-gradient-to-position)}
html[data-theme="dark"] .to-white{--tw-gradient-to:#131D33 var(--tw-gradient-to-position)}
html[data-theme="dark"] .via-orange-50\/60{--tw-gradient-to:rgba(11,17,32,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(59,130,246,0.05) var(--tw-gradient-via-position),var(--tw-gradient-to)}

/* ===== base ============================================================ */
/* the page's very back layer (2026-10-23): on phones the keyboard animation / overscroll can show it for a
   moment — banana in light mode, the same navy in dark mode, never a bright flash */
html { background-color: #FAF9F5; }
html[data-theme="dark"] { color-scheme: dark; background-color: #0B1120; }
html[data-theme="dark"] body { background-color: #0B1120; color: #E8EEF9; }
html[data-theme="dark"] ::selection { background-color: rgba(59,130,246,.35); color: #fff; }
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="dark"] textarea, html[data-theme="dark"] select {
  background-color: #131D33; color: #E8EEF9; border-color: #24314D; }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: #7D8BA3; }
html[data-theme="dark"] hr { border-color: #1C2840; }
html[data-theme="dark"] img[src$="logo.png"], html[data-theme="dark"] img[src*="/logo.png?"] { border-radius: 8px; }

/* ===== the switch: a round button, moon in light / sun in dark ============ */
.theme-toggle { position: relative; width: 40px; height: 40px; flex: none; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid #E5E2DA; color: #191817; cursor: pointer; transition: background-color .2s, border-color .2s, transform .15s; -webkit-tap-highlight-color: transparent; }
.theme-toggle:hover { border-color: #D9653B; }
.theme-toggle:active { transform: scale(.92); }
.theme-toggle svg { position: absolute; width: 20px; height: 20px; transition: transform .55s cubic-bezier(.34,1.56,.64,1), opacity .3s; }
.theme-toggle .tt-moon { color: #191817; }
.theme-toggle .tt-sun { color: #FBBF24; opacity: 0; transform: rotate(-90deg) scale(.4); }
html[data-theme="dark"] .theme-toggle { background: #131D33; border-color: #24314D; }
html[data-theme="dark"] .theme-toggle:hover { border-color: #FBBF24; }
html[data-theme="dark"] .theme-toggle .tt-moon { opacity: 0; transform: rotate(90deg) scale(.4); }
html[data-theme="dark"] .theme-toggle .tt-sun { opacity: 1; transform: none; }
.theme-toggle.theme-spin { animation: themeSpin .6s cubic-bezier(.34,1.56,.64,1); }
@keyframes themeSpin { 0% { transform: rotate(0) scale(1); } 40% { transform: rotate(200deg) scale(.82); } 100% { transform: rotate(360deg) scale(1); } }
/* the burst around the button (theme.js: stars going dark, rays going light) */
.theme-burst { position: fixed; z-index: 2147483000; width: 0; height: 0; pointer-events: none; }
.theme-burst i { position: absolute; left: -3px; top: -3px; width: 6px; height: 6px; border-radius: 999px; }

/* ===== the switching animation ========================================= */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-old(root) { z-index: 1; }
::view-transition-new(root) { z-index: 2; }
html.theme-fade, html.theme-fade *, html.theme-fade *::before, html.theme-fade *::after {
  transition: background-color .5s ease, color .5s ease, border-color .5s ease, fill .5s ease, stroke .5s ease !important; }
@media (prefers-reduced-motion: reduce) { .theme-toggle.theme-spin { animation: none; } }

/* ===== home (newhome.html) ============================================== */
html[data-theme="dark"] .heat-0 { background-color: #1C2840; }
html[data-theme="dark"] .heat-1 { background-color: #1E3A8A; }
html[data-theme="dark"] .heat-2 { background-color: #1D4ED8; }
html[data-theme="dark"] .heat-3 { background-color: #3B82F6; }
html[data-theme="dark"] .heat-4 { background-color: #93C5FD; }
html[data-theme="dark"] .stats-card { box-shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.5); }
html[data-theme="dark"] .invite-strip { border-color: rgba(245,158,11,.3); background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(59,130,246,.08) 60%, #131D33); }
html[data-theme="dark"] .invite-strip-ico { background: rgba(245,158,11,.18); }
html[data-theme="dark"] .invite-strip-text p { color: #FCD34D; }
html[data-theme="dark"] .invite-strip-text b { color: #E8EEF9; }
html[data-theme="dark"] .demo-input-link:hover, html[data-theme="dark"] .demo-input-link:focus-visible {
  border-color: rgba(59,130,246,.55); background-color: #131D33; box-shadow: 0 0 0 4px rgba(59,130,246,.15); }
html[data-theme="dark"] .study-tip { color: #A9B6CC; }
html[data-theme="dark"] .hm-band { border-top-color: #1C2840;
  background: radial-gradient(120% 70% at 50% 0%, #16213A 0%, rgba(22,33,58,0) 60%), linear-gradient(180deg, #0E1628 0%, #070C18 100%); }
html[data-theme="dark"] .hm-band .hm-line { stroke: #24314D; }
html[data-theme="dark"] .hm .hm-line.is-on { stroke: #3B82F6; }
html[data-theme="dark"] .hm-pulse, html[data-theme="dark"] .hm-pulse-glow { fill: #60A5FA; }
html[data-theme="dark"] .hm-band .hm-status { color: #A9B6CC; }
html[data-theme="dark"] .hm.is-thinking .hm-logo { border-color: rgba(59,130,246,.55); }
html[data-theme="dark"] .hm-cite.is-glow { box-shadow: 0 0 0 4px rgba(59,130,246,.25); }

/* ===== chat (chat.html) ================================================= */
html[data-theme="dark"] .zl-bounce i { background: #3B82F6; }
html[data-theme="dark"] .zl-bounce i:nth-child(1) { background: #93C5FD; }
html[data-theme="dark"] .zl-bounce i:nth-child(3) { background: #1D4ED8; }
html[data-theme="dark"] .src-chip { color: #A9B6CC; background: rgba(59,130,246,.12); border-color: rgba(59,130,246,.3); }
html[data-theme="dark"] .src-chip .material-symbols-outlined { color: #60A5FA; }
html[data-theme="dark"] a.src-chip.src-exam:hover { border-color: #3B82F6; }
html[data-theme="dark"] .ans-report { color: #FBBF24; background: rgba(245,158,11,.14); border-color: rgba(245,158,11,.35); }
html[data-theme="dark"] .ans-report:hover, html[data-theme="dark"] .ans-report:focus-visible { background: rgba(245,158,11,.24); border-color: #F59E0B; }
html[data-theme="dark"] .ans-report[data-sent] { color: #34D399; background: rgba(16,185,129,.14); border-color: rgba(16,185,129,.35); }
html[data-theme="dark"] .qz-open-btn { color: #67E8F9; background: rgba(6,182,212,.12); border-color: rgba(6,182,212,.35); }
html[data-theme="dark"] .qz-open-btn:hover { background: rgba(6,182,212,.2); }
html[data-theme="dark"] .dym { border-top-color: #1C2840; }
html[data-theme="dark"] .dym-q { color: #E8EEF9; }
html[data-theme="dark"] .dym-q b { color: #60A5FA; }
html[data-theme="dark"] .dym-yes { background: #3B82F6; border-color: #3B82F6; }
html[data-theme="dark"] .dym-yes:hover:not(:disabled) { background: #2563EB; }
html[data-theme="dark"] .dym-no { background: #131D33; color: #E8EEF9; border-color: #24314D; }
html[data-theme="dark"] .dym-no:hover:not(:disabled) { border-color: #3B82F6; }
html[data-theme="dark"] .answer-md h1, html[data-theme="dark"] .answer-md h2, html[data-theme="dark"] .answer-md h3, html[data-theme="dark"] .answer-md h4,
html[data-theme="dark"] .answer-md strong { color: #F1F5FD; }
html[data-theme="dark"] .answer-md li::marker { color: #60A5FA; }
html[data-theme="dark"] .answer-md a { color: #60A5FA; }
html[data-theme="dark"] .answer-md blockquote { border-inline-start-color: rgba(59,130,246,.5); color: #A9B6CC; }
html[data-theme="dark"] .answer-md hr { border-color: #1C2840; }
html[data-theme="dark"] .answer-md code, html[data-theme="dark"] .answer-md pre, html[data-theme="dark"] .math-fallback { background: #0F172A; border-color: #24314D; color: #CBD5E1; }
html[data-theme="dark"] .answer-md th, html[data-theme="dark"] .answer-md td { border-color: #24314D; }
html[data-theme="dark"] .answer-md th { background: #18243D; }
html[data-theme="dark"] .answer-md img { background: #fff; border-radius: 10px; }   /* book figures are drawn on white */
html[data-theme="dark"] .question-length-note { color: #7D8BA3; }
html[data-theme="dark"] .pro-bolt { animation-name: proGlowBlue; }
@keyframes proGlowBlue { 0% { box-shadow: 0 0 0 0 rgba(59,130,246,.5); } 70% { box-shadow: 0 0 0 16px rgba(59,130,246,0); } 100% { box-shadow: 0 0 0 0 rgba(59,130,246,0); } }
html[data-theme="dark"] #older-btn { background: #18243D !important; color: #A9B6CC !important; border-color: #24314D !important; }
/* the quiz screen keeps its own sea colours, a shade deeper; its cards go dark */
html[data-theme="dark"] .qz-stage { background: linear-gradient(160deg, #020617 0%, #0C4A6E 52%, #0E7490 100%); }
html[data-theme="dark"] .qz-card { background: #131D33; color: #E8EEF9; box-shadow: 0 18px 40px -16px rgba(0,0,0,.7); }
html[data-theme="dark"] .qz-opt, html[data-theme="dark"] .qz-row, html[data-theme="dark"] .qz-seg button, html[data-theme="dark"] .qz-timers button,
html[data-theme="dark"] .qz-count button { border-color: #24314D; background: #0F172A; color: #E8EEF9; }
html[data-theme="dark"] .qz-lessons .qz-row { background: #131D33; }
html[data-theme="dark"] .qz-opt:not(:disabled):hover, html[data-theme="dark"] .qz-row:hover { border-color: #22D3EE; background: rgba(6,182,212,.12); }
html[data-theme="dark"] .qz-row.qz-chosen { border-color: #0891B2; background: rgba(8,145,178,.28); }
html[data-theme="dark"] .qz-seg button.on, html[data-theme="dark"] .qz-timers button.on { border-color: #0891B2; background: #0891B2; color: #fff; }
html[data-theme="dark"] .qz-letter { background: rgba(6,182,212,.2); color: #67E8F9; }
html[data-theme="dark"] .qz-opt.qz-right { background: rgba(34,197,94,.18); }
html[data-theme="dark"] .qz-opt.qz-wrong { background: rgba(239,68,68,.18); }
html[data-theme="dark"] .qz-explain { background: rgba(20,184,166,.12); border-color: rgba(20,184,166,.35); color: #CCFBF1; }
html[data-theme="dark"] .qz-explain small { color: #5EEAD4; }
html[data-theme="dark"] .qz-count b { color: #67E8F9; }
html[data-theme="dark"] .qz-label { color: #E8EEF9; }
html[data-theme="dark"] .qz-cost { background: rgba(6,182,212,.1); border-color: rgba(6,182,212,.3); color: #A5F3FC; }
html[data-theme="dark"] .qz-hint { color: #A9B6CC; }
html[data-theme="dark"] .qz-back { background: #131D33; color: #F87171; border-color: rgba(239,68,68,.4); }
html[data-theme="dark"] .qz-back:hover { background: rgba(239,68,68,.12); border-color: #F87171; }
html[data-theme="dark"] #quizMenu .qz-sub:hover { background: rgba(6,182,212,.12); }
.theme-toggle-sm { width: 36px; height: 36px; border-radius: 12px; }
.theme-toggle-sm svg { width: 19px; height: 19px; }

/* ===== home: quota bar, FAQ, logo ======================================= */
html[data-theme="dark"] #stat-meter-track { background-color: #1C2840 !important; }
html[data-theme="dark"] #stat-meter-fill[data-tone="ok"] { background-color: #3B82F6 !important; }
html[data-theme="dark"] .pfaq { background: #131D33; border-color: #24314D; }
html[data-theme="dark"] .pfaq[open]:not(.pfaq-closing) { border-color: rgba(59,130,246,.45); box-shadow: 0 4px 16px rgba(0,0,0,.35); }
html[data-theme="dark"] .pfaq summary { color: #E8EEF9; }
html[data-theme="dark"] .pfaq summary:focus-visible { outline-color: #3B82F6; }
html[data-theme="dark"] .pfaq-ico, html[data-theme="dark"] .pfaq-link { color: #60A5FA; }
html[data-theme="dark"] .pfaq p { color: #A9B6CC; }
html[data-theme="dark"] .pfaq-more { background: rgba(59,130,246,.08); border-color: rgba(59,130,246,.4); }
html[data-theme="dark"] .pfaq-more-text b { color: #E8EEF9; }
html[data-theme="dark"] .pfaq-more-text span, html[data-theme="dark"] .pfaq-note { color: #A9B6CC; }
/* the logo in dark: a blue mark on a TRANSPARENT background (static/brand/logo-dark.png —
   theme.js swaps the src; `content` shows it from the first paint), and the tile it sits in
   transparent too, keeping its thin blue outline (the admin, 2026-10-20: tried solid black
   first, then asked for transparent). */
html[data-theme="dark"] img[src^="/logo.png"] { content: url("/static/brand/logo-dark.png?v=2"); }
html[data-theme="dark"] :is(div, span):has(> img[src^="/logo.png"]),
html[data-theme="dark"] :is(div, span):has(> img[src^="/static/brand/logo-dark.png"]) { background-color: transparent !important; border-color: rgba(59,130,246,.35) !important; box-shadow: none !important; }
html[data-theme="dark"] .hm-logo, html[data-theme="dark"] .hm-face { background: transparent; border-color: rgba(59,130,246,.35); }

/* ===== exams (exams.html): each subject a deep tint of its colour ========= */
html[data-theme="dark"] #math, html[data-theme="dark"] .subj-chip[href="#math"] { --bg: rgba(59,130,246,.10); --bd: rgba(59,130,246,.38); --ac: #93C5FD; }
html[data-theme="dark"] #physics, html[data-theme="dark"] .subj-chip[href="#physics"] { --bg: rgba(139,92,246,.12); --bd: rgba(139,92,246,.4); --ac: #C4B5FD; }
html[data-theme="dark"] #chemistry, html[data-theme="dark"] .subj-chip[href="#chemistry"] { --bg: rgba(20,184,166,.10); --bd: rgba(20,184,166,.38); --ac: #5EEAD4; }
html[data-theme="dark"] #bio, html[data-theme="dark"] .subj-chip[href="#bio"] { --bg: rgba(132,204,22,.09); --bd: rgba(132,204,22,.35); --ac: #BEF264; }
html[data-theme="dark"] #arabic, html[data-theme="dark"] .subj-chip[href="#arabic"] { --bg: rgba(244,63,94,.10); --bd: rgba(244,63,94,.38); --ac: #FDA4AF; }
html[data-theme="dark"] #english, html[data-theme="dark"] .subj-chip[href="#english"] { --bg: rgba(249,115,22,.10); --bd: rgba(249,115,22,.38); --ac: #FDBA74; }
html[data-theme="dark"] #french, html[data-theme="dark"] .subj-chip[href="#french"] { --bg: rgba(234,179,8,.09); --bd: rgba(234,179,8,.35); --ac: #FDE047; }
html[data-theme="dark"] #islamic, html[data-theme="dark"] .subj-chip[href="#islamic"] { --bg: rgba(180,140,90,.12); --bd: rgba(180,140,90,.4); --ac: #E2C799; }
html[data-theme="dark"] .subj-chip:not([href^="#"]) { background: #131D33; border-color: #24314D; color: #E8EEF9; }
html[data-theme="dark"] .exam-subject + .exam-subject::before { background: #2A3956; }
html[data-theme="dark"] .exam-subject .exam-note { color: #A9B6CC; }
html[data-theme="dark"] .exam-year { background: #131D33; box-shadow: 0 1px 2px rgba(0,0,0,.3); }
html[data-theme="dark"] .exam-year-head img { border-color: #24314D; background: #0F172A; }
html[data-theme="dark"] .exam-year-head h3, html[data-theme="dark"] .exam-session p { color: #E8EEF9; }
html[data-theme="dark"] .exam-session { border-top-color: #24314D; }
html[data-theme="dark"] .exam-session p small, html[data-theme="dark"] .exam-note { color: #7D8BA3; }
html[data-theme="dark"] .exam-tag { background: rgba(6,182,212,.12); border-color: rgba(6,182,212,.35); color: #67E8F9; }
html[data-theme="dark"] .exam-btn.dl { background: #3B82F6; }
html[data-theme="dark"] .exam-btn.dl:hover { background: #2563EB; }
html[data-theme="dark"] .exam-btn.view { color: #E8EEF9; background: #18243D; border-color: #24314D; }
html[data-theme="dark"] .exam-btn.view:hover { background: #24314D; }
html[data-theme="dark"] .study-tip b { color: #93C5FD; }

/* ===== 404 / book page ================================================= */
html[data-theme="dark"] .nf-num { color: #3B82F6; }
html[data-theme="dark"] .nf-primary { background: #3B82F6; }
html[data-theme="dark"] .nf-primary:hover { background: #2563EB; }
html[data-theme="dark"] .nf-secondary { background: #131D33; color: #E8EEF9; border-color: #24314D; }
html[data-theme="dark"] .nf-secondary:hover { border-color: #3B82F6; }
html[data-theme="dark"] .crumbs { color: #7D8BA3; }
html[data-theme="dark"] .crumbs a { color: #A9B6CC; }
html[data-theme="dark"] .crumbs a:hover, html[data-theme="dark"] .book-chip:hover { color: #60A5FA; border-color: #3B82F6; }
html[data-theme="dark"] .book-hero img { border-color: #24314D; box-shadow: 0 8px 22px rgba(0,0,0,.45); }
html[data-theme="dark"] .book-meta span, html[data-theme="dark"] .book-chip { background: #131D33; border-color: #24314D; color: #A9B6CC; }
html[data-theme="dark"] .ask-card { background: #1D4ED8; }
html[data-theme="dark"] .ask-card:hover { background: #2563EB; }
html[data-theme="dark"] .book-link:hover { color: #60A5FA; }

/* ===== mistakes (mistakes.html) ========================================= */
html[data-theme="dark"] .mk-opt { border-color: #24314D; background: #0F172A; }
html[data-theme="dark"] .mk-opt.mk-chosen { border-color: #ef4444; background: rgba(239,68,68,.14); }
html[data-theme="dark"] .mk-opt.mk-correct { border-color: #22c55e; background: rgba(34,197,94,.14); }
html[data-theme="dark"] .mk-letter { background: #24314D; color: #A9B6CC; }
html[data-theme="dark"] .mk-chosen .mk-letter { background: #ef4444; color: #fff; }
html[data-theme="dark"] .mk-correct .mk-letter { background: #22c55e; color: #fff; }
html[data-theme="dark"] .mk-x { background: rgba(239,68,68,.12); color: #F87171; border-color: rgba(239,68,68,.35); }
html[data-theme="dark"] .mk-x:hover { background: rgba(239,68,68,.22); }
html[data-theme="dark"] .mk-chip { border-color: #24314D; background: #131D33; color: #E8EEF9; }
html[data-theme="dark"] .mk-chip.on { background: #0e7490; border-color: #0e7490; color: #fff; }
/* ===== profile ========================================================== */
html[data-theme="dark"] .invite-progress-top { color: #A9B6CC; }
html[data-theme="dark"] .invite-progress-top b { color: #E8EEF9; }

/* chat: the header switch only from 640px; on phones it's a row in the ☰ menu */
@media (max-width: 639px) { .theme-toggle-sm { display: none; } }
@media (min-width: 640px) { .theme-menu-item { display: none !important; } }
.theme-menu-item .tm-ico::before { content: "🌙"; }
.theme-menu-item .tm-label::before { content: "الوضع الداكن"; }
html[data-theme="dark"] .theme-menu-item .tm-ico::before { content: "☀️"; }
html[data-theme="dark"] .theme-menu-item .tm-label::before { content: "الوضع الفاتح"; }

/* ===== scrollbars: blue in dark (orange ones are in zamilak.css) ========= */
html[data-theme="dark"] { scrollbar-color: #3B82F6 #0F172A; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: #0F172A; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3B82F6; border-color: #0F172A; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #2563EB; }
html[data-theme="dark"] .qz-stage, html[data-theme="dark"] .qz-stage * { scrollbar-color: rgba(255,255,255,.45) transparent; }
html[data-theme="dark"] .qz-stage::-webkit-scrollbar-track, html[data-theme="dark"] .qz-stage ::-webkit-scrollbar-track { background: transparent; }
html[data-theme="dark"] .qz-stage::-webkit-scrollbar-thumb, html[data-theme="dark"] .qz-stage ::-webkit-scrollbar-thumb { background: rgba(255,255,255,.45); border-color: transparent; }
/* home dashboard: the «سؤال جاوبك عليه زميلك» card's second soft glow was amber — blue in dark too */
html[data-theme="dark"] .stats-card .bg-amber-200\/20 { background-color: rgba(56,189,248,.10); }

/* Telegram accounts: the avatar is tele.svg, a black glyph — white in dark mode (2026-10-22, the admin) */
html[data-theme="dark"] img[src="/tele.svg"] { filter: invert(1); }