/* theme toggle (both modes) */
html { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }
.theme { display: inline-grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--ink-line); border-radius: 8px; background: transparent; color: var(--ink-muted); cursor: pointer; transition: color .15s, border-color .15s; }
.theme:hover { color: var(--fg-strong, #fff); border-color: #737373; }
.theme:focus-visible { outline: 2px solid #f59e0b; outline-offset: 1px; }
.theme svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.theme .moon { display: none; }
html[data-theme="light"] .theme .sun { display: none; }
html[data-theme="light"] .theme .moon { display: block; }

/* light mode: tokens first */
html[data-theme="light"] {
  --ink: #fafafa; --ink-2: #ffffff; --ink-3: #f4f4f5; --ink-line: #e2e2e6; --ink-muted: #525252;
  --bg: #f1f1f3; --line: #e0e0e3; --fg-strong: #000;
  --sky: #0369a1; --ok: #15803d;
}
/* code-like surfaces stay dark in both modes */
html[data-theme="light"] .term,
html[data-theme="light"] .tree,
html[data-theme="light"] .fm,
html[data-theme="light"] .viz {
  --ink: #0a0a0a; --ink-2: #141414; --ink-3: #1c1c1c; --ink-line: #2a2a2a; --ink-muted: #a3a3a3;
  --sky: #7dd3fc; --ok: #4ade80;
}

/* surfaces and text */
html[data-theme="light"] section.dark,
html[data-theme="light"] .hero,
html[data-theme="light"] .stats { color: #171717; }
html[data-theme="light"] .lead b,
html[data-theme="light"] .ticks b { color: #000; }
html[data-theme="light"] .btn.light { background: #171717; color: #fafafa; }
html[data-theme="light"] .btn.light:hover { background: #000; }
html[data-theme="light"] .btn.outline { border-color: #d0d0d5; color: #171717; }
html[data-theme="light"] .btn.outline:hover { border-color: #171717; }

/* nav */
html[data-theme="light"] nav { background: rgba(250,250,250,.82); color: #171717; }
html[data-theme="light"] .links a:hover { color: #000; }
html[data-theme="light"] .brand svg rect { fill: #171717; }
html[data-theme="light"] .brand svg path { fill: #fafafa; }
html[data-theme="light"] .lang button:hover { color: #000; }
html[data-theme="light"] .lang button[aria-pressed="true"] { background: #171717; color: #fafafa; }

/* hero */
html[data-theme="light"] .hero::before { background-image: radial-gradient(#d4d4d8 1px, transparent 1px); }
html[data-theme="light"] .hero::after { background: radial-gradient(640px circle at var(--mx, 50%) var(--my, 18%), rgba(245,158,11,.13), transparent 60%); }
html[data-theme="light"] .pill { background: rgba(255,255,255,.85); }
html[data-theme="light"] h1 { background: linear-gradient(180deg, #171717 30%, #6b6b6b); -webkit-background-clip: text; background-clip: text; }
html[data-theme="light"] h1 .grad { background: linear-gradient(90deg, #d97706, #f59e0b 50%, #ea580c); -webkit-background-clip: text; background-clip: text; }
html[data-theme="light"] .acronym b,
html[data-theme="light"] .diamond,
html[data-theme="light"] .col h5 .g,
html[data-theme="light"] .card.gate .tag,
html[data-theme="light"] .feed .warn { color: #b45309; }

/* demo frame */
html[data-theme="light"] .frame { box-shadow: 0 40px 80px -36px rgba(180,83,9,.25), 0 30px 60px -34px rgba(0,0,0,.28); }
html[data-theme="light"] .frame-bar i { background: #d4d4d8; }
html[data-theme="light"] .card { border-color: #e0e0e3; }
html[data-theme="light"] .card .ctitle,
html[data-theme="light"] .tally b { color: #171717; }
html[data-theme="light"] .card .cbar { background: #e5e5e9; }
html[data-theme="light"] .card.done { border-color: #86efac; }
html[data-theme="light"] .feed li:first-child { color: #171717; }

/* stats and rail */
html[data-theme="light"] .stat b { background: linear-gradient(180deg, #171717, #6b6b6b); -webkit-background-clip: text; background-clip: text; }
html[data-theme="light"] .st h4 { color: #6b6b6b; }
html[data-theme="light"] .st.lit h4 { color: #171717; }
html[data-theme="light"] .dot { color: #8a8a8a; }
html[data-theme="light"] .st.lit .dot { color: #171717; }
html[data-theme="light"] .st.gate .dot { background: #fef3c7; color: #b45309; border-color: #fcd34d; }
html[data-theme="light"] .st.gate.lit .dot { background: var(--accent); color: #1c1100; }
html[data-theme="light"] .legend i { border-color: #a3a3a3; }

/* text on formerly dark sections */
html[data-theme="light"] .ticks li { color: #404040; }
html[data-theme="light"] .tool { border-top-color: #d4d4d8; }
html[data-theme="light"] .tool .mono { color: #404040; }
html[data-theme="light"] .final::before { background: radial-gradient(600px circle at 50% 100%, rgba(245,158,11,.16), transparent 70%); }
html[data-theme="light"] footer { color: #737373; }