/* Agentic — 10 switchable themes. The default (no data-theme attribute) is
   "Deep Space", defined by styles.css. Each theme overrides design tokens on
   :root[data-theme] plus a handful of structural rules for real layout and
   sizing variation. Cycled by the header button (see main.js); deep-linkable
   via ?theme=<id>. */

/* ── 2. Terminal — green phosphor, monospace, sharp, left-aligned ── */
:root[data-theme="terminal"] {
  --primary: #33ff66;
  --primary-hover: #7dffa1;
  --surface: #041407;
  --surface-alt: #020a04;
  --text-muted: #4e9963;
  --background-body: #010401;
  --text-main: #b8eec4;
  --text-bright: #dfffe6;
  --links: #33ff66;
  --border: #14421f;
  --frame: #1f8f3f;
  --glow: rgba(51, 255, 102, 0.25);
  --font-display: 'Cascadia Code', Consolas, 'Courier New', monospace;
  --radius: 0;
  --shadow: none;
}
[data-theme="terminal"] body { font-family: Consolas, 'Courier New', monospace; background: var(--background-body); }
[data-theme="terminal"] #starfield { display: none; }
[data-theme="terminal"] .hero { text-align: left; }
[data-theme="terminal"] .hero-card { padding: var(--space-md) var(--space-lg); }
[data-theme="terminal"] .hero-tagline, [data-theme="terminal"] .hero-hosts { margin-left: 0; }
[data-theme="terminal"] .hero-actions { justify-content: flex-start; }
[data-theme="terminal"] .wordmark { font-size: clamp(2rem, 5vw, 3rem); text-shadow: none; }
[data-theme="terminal"] .wordmark::before { content: '> '; color: var(--primary); }
[data-theme="terminal"] .logo-mark { display: none; }
[data-theme="terminal"] .btn, [data-theme="terminal"] .platform, [data-theme="terminal"] .nav-cta { border-radius: 0; }
[data-theme="terminal"] .topic-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
[data-theme="terminal"] .topic-card h3::before { content: '$ '; }

/* ── 3. Paper — warm light, serif, calm, no space effects ── */
:root[data-theme="paper"] {
  color-scheme: light;
  --primary: #b3541e;
  --primary-hover: #8f3f12;
  --surface: #ffffff;
  --surface-alt: #efeae1;
  --text-muted: #7d7466;
  --background-body: #f7f4ed;
  --background: #ffffff;
  --background-alt: #efeae1;
  --text-main: #2a2620;
  --text-bright: #171410;
  --links: #b3541e;
  --border: #ddd5c6;
  --frame: #c9bfa9;
  --glow: rgba(179, 84, 30, 0.12);
  --font-display: Georgia, 'Times New Roman', serif;
  --radius: 6px;
  --shadow: 0 2px 10px rgba(80, 60, 30, 0.08);
  --form-text: #2a2620;
  --scrollbar-thumb: #d5ccba;
}
[data-theme="paper"] body { background: var(--background-body); font-family: Georgia, 'Times New Roman', serif; }
[data-theme="paper"] #starfield { display: none; }
[data-theme="paper"] .wordmark { text-shadow: none; font-weight: 700; }
[data-theme="paper"] .logo-mark { color: #b3541e; filter: none; }
[data-theme="paper"] .brand-mark { color: #b3541e; filter: none; }
[data-theme="paper"] .site-header { background: color-mix(in srgb, #f7f4ed 92%, transparent); }
[data-theme="paper"] .btn-primary { color: #fff; }
[data-theme="paper"] .chip-active { background: #171410; color: #f7f4ed; border-color: #171410; }

/* ── 4. Synthwave — magenta/cyan, heavy glow, rounded, gradient wordmark ── */
:root[data-theme="synthwave"] {
  --primary: #ff4fd8;
  --primary-hover: #ff86e4;
  --surface: #1d0b33;
  --surface-alt: #150724;
  --text-muted: #a88fc9;
  --background-body: #0e0519;
  --text-main: #efdcff;
  --text-bright: #ffffff;
  --links: #4fe3ff;
  --border: #3d1e63;
  --frame: #ff4fd8;
  --glow: rgba(255, 79, 216, 0.4);
  --radius: 16px;
}
[data-theme="synthwave"] body {
  background:
    linear-gradient(180deg, transparent 0%, transparent 70%, rgba(255, 79, 216, 0.12) 100%),
    radial-gradient(ellipse 90% 60% at 50% 0%, #241040 0%, transparent 60%),
    var(--background-body);
}
[data-theme="synthwave"] #starfield { filter: hue-rotate(120deg) saturate(2); }
[data-theme="synthwave"] .wordmark {
  background: linear-gradient(180deg, #4fe3ff 20%, #ff4fd8 80%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: none; filter: drop-shadow(0 0 18px rgba(255, 79, 216, 0.5));
}
[data-theme="synthwave"] .kicker { color: #4fe3ff; }
[data-theme="synthwave"] .logo-mark { color: #ff9bea; }
[data-theme="synthwave"] .btn-primary { background: linear-gradient(90deg, #ff4fd8, #b44fff); color: #fff; }

/* ── 5. Blueprint — drafting grid, cyan lines, dashed frames, technical ── */
:root[data-theme="blueprint"] {
  --primary: #7fd4ff;
  --primary-hover: #b5e6ff;
  --surface: #0d2c4d;
  --surface-alt: #0a2440;
  --text-muted: #7fa3c4;
  --background-body: #082036;
  --text-main: #d7ebfa;
  --text-bright: #ffffff;
  --links: #7fd4ff;
  --border: #1d4a75;
  --frame: #3f81b8;
  --glow: rgba(127, 212, 255, 0.2);
  --font-display: 'Segoe UI', system-ui, sans-serif;
  --radius: 2px;
  --shadow: none;
}
[data-theme="blueprint"] body {
  background:
    repeating-linear-gradient(0deg, rgba(127, 212, 255, 0.05) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(127, 212, 255, 0.05) 0 1px, transparent 1px 32px),
    var(--background-body);
}
[data-theme="blueprint"] #starfield { display: none; }
[data-theme="blueprint"] .hud-frame, [data-theme="blueprint"] .topic-card { background: transparent; border: 1px dashed var(--frame); }
[data-theme="blueprint"] .wordmark { text-shadow: none; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 700; font-size: clamp(2.2rem, 6vw, 3.4rem); }
[data-theme="blueprint"] .kicker { letter-spacing: 0.5em; }
[data-theme="blueprint"] .section-title { text-transform: uppercase; font-size: var(--text-lg); letter-spacing: 0.12em; }

/* ── 6. Ember — charcoal & fire, warm sparks ── */
:root[data-theme="ember"] {
  --primary: #ff7a33;
  --primary-hover: #ffa066;
  --surface: #1f1512;
  --surface-alt: #17100d;
  --text-muted: #a8907f;
  --background-body: #120c09;
  --text-main: #f2e4da;
  --text-bright: #fff8f4;
  --links: #ffab7a;
  --border: #3d2a20;
  --frame: #8a4a28;
  --glow: rgba(255, 122, 51, 0.3);
  --radius: 10px;
}
[data-theme="ember"] body { background: radial-gradient(ellipse 90% 60% at 50% 100%, #2a1409 0%, transparent 60%), var(--background-body); }
[data-theme="ember"] #starfield { filter: hue-rotate(155deg) saturate(2.4) brightness(1.1); }
[data-theme="ember"] .logo-mark { color: #ffc09a; }
[data-theme="ember"] .btn-primary { color: #1c0d04; }

/* ── 7. Brutalist — stark white, black rules, giant type, zero decoration ── */
:root[data-theme="brutalist"] {
  color-scheme: light;
  --primary: #0000ee;
  --primary-hover: #0000aa;
  --surface: #ffffff;
  --surface-alt: #f2f2f2;
  --text-muted: #444444;
  --background-body: #ffffff;
  --background: #ffffff;
  --background-alt: #f2f2f2;
  --text-main: #000000;
  --text-bright: #000000;
  --links: #0000ee;
  --border: #000000;
  --frame: #000000;
  --glow: transparent;
  --font-display: Arial, Helvetica, sans-serif;
  --radius: 0;
  --shadow: none;
  --form-text: #000;
  --scrollbar-thumb: #999;
}
[data-theme="brutalist"] body { background: #fff; font-family: Arial, Helvetica, sans-serif; }
[data-theme="brutalist"] #starfield { display: none; }
[data-theme="brutalist"] .site-header { background: #fff; border-bottom: 3px solid #000; }
[data-theme="brutalist"] .hero { text-align: left; }
[data-theme="brutalist"] .hero-card { border: 3px solid #000; background: none; padding: var(--space-lg); }
[data-theme="brutalist"] .hero-tagline, [data-theme="brutalist"] .hero-hosts { margin-left: 0; }
[data-theme="brutalist"] .hero-actions { justify-content: flex-start; }
[data-theme="brutalist"] .wordmark { font-size: clamp(3.4rem, 11vw, 6.5rem); text-transform: uppercase; text-shadow: none; letter-spacing: -0.03em; }
[data-theme="brutalist"] .logo-mark { display: none; }
[data-theme="brutalist"] .kicker { color: #000; font-weight: 700; }
[data-theme="brutalist"] .btn, [data-theme="brutalist"] .platform, [data-theme="brutalist"] .nav-cta { border-radius: 0; border: 3px solid #000; }
[data-theme="brutalist"] .btn-primary { background: #000; color: #fff; }
[data-theme="brutalist"] .btn-primary:hover { background: #0000ee; box-shadow: none; }
[data-theme="brutalist"] .topic-card { border: 3px solid #000; border-radius: 0; background: #fff; }
[data-theme="brutalist"] .topic-card:hover { transform: none; background: #f2f2f2; border-color: #000; }
[data-theme="brutalist"] .topic-grid { grid-template-columns: 1fr 1fr; }
[data-theme="brutalist"] .host-card { border: 3px solid #000; background: #fff; }
[data-theme="brutalist"] .section-title .tick { background: #000; box-shadow: none; width: 40px; height: 6px; }
[data-theme="brutalist"] .chip { border: 2px solid #000; border-radius: 0; color: #000; }
[data-theme="brutalist"] .chip-active { background: #000; color: #fff; }

/* ── 8. Forest — deep greens, soft fireflies ── */
:root[data-theme="forest"] {
  --primary: #5fd68a;
  --primary-hover: #8ce6ad;
  --surface: #10231a;
  --surface-alt: #0b1a13;
  --text-muted: #8bab97;
  --background-body: #081410;
  --text-main: #dcefe3;
  --text-bright: #f4fff8;
  --links: #8ce6ad;
  --border: #1e3d2d;
  --frame: #35664a;
  --glow: rgba(95, 214, 138, 0.25);
  --radius: 12px;
}
[data-theme="forest"] #starfield { filter: hue-rotate(255deg) saturate(1.4); opacity: 0.7; }
[data-theme="forest"] .logo-mark { color: #bdeecd; }
[data-theme="forest"] .btn-primary { color: #06130c; }

/* ── 9. Arcade — cabinet colors, chunky offset shadows, big energy ── */
:root[data-theme="arcade"] {
  --primary: #ffd319;
  --primary-hover: #ffe266;
  --surface: #1a0b2e;
  --surface-alt: #130722;
  --text-muted: #b39ddb;
  --background-body: #0d0221;
  --text-main: #f3eaff;
  --text-bright: #ffffff;
  --links: #ff2975;
  --border: #3c1a66;
  --frame: #ff2975;
  --glow: rgba(255, 211, 25, 0.3);
  --font-display: 'Segoe UI', system-ui, sans-serif;
  --radius: 4px;
}
[data-theme="arcade"] #starfield { filter: hue-rotate(60deg) saturate(2); }
[data-theme="arcade"] .wordmark { color: #ffd319; text-shadow: 4px 4px 0 #ff2975; font-weight: 900; text-transform: uppercase; }
[data-theme="arcade"] .kicker { color: #ff2975; }
[data-theme="arcade"] .logo-mark { color: #ffd319; }
[data-theme="arcade"] .btn-primary { background: #ffd319; color: #1a0b2e; box-shadow: 4px 4px 0 #ff2975; }
[data-theme="arcade"] .btn-primary:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 #ff2975; }
[data-theme="arcade"] .btn-ghost { border: 2px solid #ffd319; box-shadow: 4px 4px 0 #3c1a66; }
[data-theme="arcade"] .topic-card { border: 2px solid #3c1a66; box-shadow: 4px 4px 0 #3c1a66; }
[data-theme="arcade"] .topic-card:hover { border-color: #ffd319; }
[data-theme="arcade"] .topic-card h3 { color: #ffd319; }

/* ── 10. Mono — grayscale gallery minimalism, airy spacing, thin type ── */
:root[data-theme="mono"] {
  color-scheme: light;
  --primary: #111111;
  --primary-hover: #444444;
  --surface: #ffffff;
  --surface-alt: #f6f6f6;
  --text-muted: #8a8a8a;
  --background-body: #fafafa;
  --background: #ffffff;
  --background-alt: #f6f6f6;
  --text-main: #222222;
  --text-bright: #000000;
  --links: #111111;
  --border: #e2e2e2;
  --frame: #d0d0d0;
  --glow: transparent;
  --font-display: 'Segoe UI', system-ui, sans-serif;
  --radius: 999px;
  --shadow: none;
  --space-lg: 2.6rem;
  --space-xl: 5.5rem;
  --form-text: #222;
  --scrollbar-thumb: #ccc;
}
[data-theme="mono"] body { background: #fafafa; }
[data-theme="mono"] #starfield { display: none; }
[data-theme="mono"] .site-header { background: color-mix(in srgb, #fafafa 90%, transparent); }
[data-theme="mono"] .hud-frame { background: none; }
[data-theme="mono"] .wordmark { font-weight: 300; letter-spacing: 0.14em; text-transform: uppercase; text-shadow: none; font-size: clamp(2rem, 6vw, 3.2rem); }
[data-theme="mono"] .kicker { color: #8a8a8a; }
[data-theme="mono"] .logo-mark { color: #111; filter: none; }
[data-theme="mono"] .brand-mark { color: #111; filter: none; }
[data-theme="mono"] .btn-primary { background: #111; color: #fff; }
[data-theme="mono"] .topic-card { border: 1px solid #e2e2e2; border-radius: 14px; background: #fff; }
[data-theme="mono"] .topic-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--space-lg); }
[data-theme="mono"] .topic-card h3 { color: #111; letter-spacing: 0.16em; font-weight: 600; }
[data-theme="mono"] .host-card { border: 1px solid #e2e2e2; border-radius: 14px; background: #fff; }
[data-theme="mono"] .section-title { font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; font-size: var(--text-lg); }
[data-theme="mono"] .section-title .tick { background: #111; box-shadow: none; }
[data-theme="mono"] .section-alt { background: #f2f2f2; }