/* ─── Navixar — Light Theme ("Holi Morning") + Citations ───
   Dark theme is the default (:root in styles.css).
   Light mode = warm ivory, same saffron/pink/green accents.
   Baked-dark visuals (3D hero, world map, sensor diagram, splat sim)
   intentionally stay dark — framed as cinematic panels.
*/

html[data-theme="light"] {
  --bg-black: #faf5eb;
  --bg-dark: #f3ebdc;
  --bg-glass: rgba(255, 253, 248, 0.82);
  --border-glass: rgba(180, 83, 9, 0.28);
  --border-glass-hover: rgba(233, 30, 99, 0.5);

  --text-white: #201028;
  --text-silver: #2e1d38;
  --text-grey: #5f4a6d;
  --text-muted: rgba(95, 74, 109, 0.6);
  --indigo-deep: #efe4d1;

  /* Slightly deeper accents for contrast on ivory */
  --marigold: #d99a00;
  --turmeric: #c99a10;
  --peacock-blue: #005fce;
  --peacock-teal: #00806e;
  --holi-pink: #e00f7e;
}

/* Page chrome */
html[data-theme="light"] body::after { opacity: 0.05; }
html[data-theme="light"] body::before {
  background:
    radial-gradient(ellipse 80% 50% at 20% 30%, rgba(255, 153, 51, 0.10) 0%, transparent 70%),
    radial-gradient(ellipse 60% 40% at 80% 70%, rgba(233, 30, 99, 0.06) 0%, transparent 70%);
}
html[data-theme="light"] #tb {
  background: rgba(250, 245, 235, 0.85);
  border-bottom-color: rgba(180, 83, 9, 0.3);
}
html[data-theme="light"] .glass-card:hover {
  box-shadow: 0 24px 48px rgba(80, 40, 20, 0.14), 0 0 40px rgba(255, 153, 51, 0.08);
}
html[data-theme="light"] .hero-vignette { opacity: 0.12; }

/* Generic dark-glass surfaces → light equivalents */
html[data-theme="light"] .quiz-opt,
html[data-theme="light"] .compcard,
html[data-theme="light"] .brow-item,
html[data-theme="light"] .budget-summary,
html[data-theme="light"] .tl-card,
html[data-theme="light"] .ladder-rung {
  background: rgba(120, 70, 20, 0.04);
  border-color: rgba(60, 30, 60, 0.14);
}
html[data-theme="light"] .ladder-rung.open { background: rgba(0, 95, 206, 0.05); border-color: rgba(0, 95, 206, 0.35); }
html[data-theme="light"] .sc-track,
html[data-theme="light"] .bi-track,
html[data-theme="light"] .bs-rw-track,
html[data-theme="light"] .rp-track { background: rgba(60, 30, 60, 0.1); }
html[data-theme="light"] .rp-row:hover { background: rgba(60, 30, 60, 0.05); }
html[data-theme="light"] .tam-layer { border-color: rgba(60, 30, 60, 0.14); }
html[data-theme="light"] .tam-layer:hover { border-color: rgba(60, 30, 60, 0.4); }
html[data-theme="light"] .ue-bar { border-color: rgba(60, 30, 60, 0.18); }
html[data-theme="light"] .ue-seg span { color: rgba(255, 255, 255, 0.95); text-shadow: 0 1px 2px rgba(0,0,0,.4); }
html[data-theme="light"] .ue-readouts { border-top-color: rgba(60, 30, 60, 0.14); }
html[data-theme="light"] .ue-ctl input[type="range"] { background: rgba(60, 30, 60, 0.18); }
html[data-theme="light"] .ue-benchmark { background: rgba(0, 95, 206, 0.06); border-color: rgba(0, 95, 206, 0.25); }
html[data-theme="light"] .mm-a-title { border-top-color: rgba(60, 30, 60, 0.14); }
html[data-theme="light"] .rp-note { border-top-color: rgba(60, 30, 60, 0.14); }
html[data-theme="light"] .pokemon-box { background: linear-gradient(135deg, rgba(255,153,51,.1), rgba(217,154,0,.05)); }

/* Readout / stat colours that assumed a dark backdrop */
html[data-theme="light"] .msv.b,
html[data-theme="light"] .lr-big { filter: saturate(1.1) brightness(0.82); }
html[data-theme="light"] .ue-ro-val.good,
html[data-theme="light"] .mm-rev { color: #1e8a3c; }

/* ── Theme toggle button ── */
#themeToggle {
  display: inline-flex; align-items: center; gap: 8px;
  background: none; border: 1px solid rgba(255, 183, 77, 0.35);
  border-radius: 20px; padding: 6px 14px; cursor: pointer;
  font: 600 11px/1 Inter, sans-serif; letter-spacing: 1px;
  color: var(--text-grey); transition: all .3s ease;
}
#themeToggle:hover { border-color: var(--marigold); color: var(--text-white); }
#themeToggle .tt-icon { font-size: 13px; }

/* ── Citation links ── */
.cite-link {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px dashed rgba(255, 183, 77, 0.55);
  padding-bottom: 1px;
  transition: color .25s ease, border-color .25s ease;
  cursor: pointer;
}
.cite-link::after {
  content: '↗';
  font-size: 0.85em;
  margin-left: 2px;
  opacity: 0.65;
  color: var(--marigold);
}
.cite-link:hover { color: var(--marigold); border-bottom-color: var(--marigold); }
.src, .mss, .twtag { pointer-events: auto; }