/* Dark mode uses Underhood's warm charcoal / amber CRT palette.
   The light theme remains the incumbent default; all changes below are
   scoped to the explicit dark theme. */
:root[data-theme='dark'] {
  color-scheme: dark;
  --paper: #17120e;
  --paper-2: #1b1511;
  --paper-3: #201914;
  --node: #251d17;
  --ink: #f2e8dc;
  --ink-soft: #b8a898;
  --ink-faint: #998570;
  --accent: #f0a03c;
  --accent-2: #ffc46b;
  --accent-rgb: 240, 160, 60;
  --accent-hover: #ffc46b;
  --green: #8fce87;
  --danger: #ff7a6b;
  --blue: #8fb9d0;
  --gold: #ffc46b;
  --line: #3d332b;
  --line-strong: #51443a;
  --code-bg: #100c09;
  --code-bar: #1a1410;
  --code-ink: #f2e8dc;
  --code-faint: #a89781;
  --shadow: 0 8px 24px rgba(24, 15, 8, .6);
  --bfp-paper: #17120e;
  --bfp-paper-2: #1b1511;
  --bfp-paper-3: #201914;
  --bfp-node: #251d17;
  --bfp-ink: #f2e8dc;
  --bfp-ink-soft: #b8a898;
  --bfp-ink-faint: #998570;
  --bfp-accent: #f0a03c;
  --bfp-accent-2: #ffc46b;
  --bfp-line: #3d332b;
  --bfp-line-strong: #51443a;
  --bfp-code-bg: #100c09;
  --bfp-code-bar: #1a1410;
  --bfp-code-line: #3d332b;
  --bfp-code-ink: #f2e8dc;
  --bfp-code-faint: #a89781;
}

:root[data-theme='dark'] body {
  background: var(--paper);
  background-image: radial-gradient(circle at 18% 12%, rgba(240, 160, 60, .045), transparent 45%), radial-gradient(circle at 82% 78%, rgba(143, 206, 135, .035), transparent 42%);
}

:root[data-theme='dark'] body::before {
  opacity: .22;
  mix-blend-mode: screen;
}

:root[data-theme='dark'] .chapter-card,
:root[data-theme='dark'] .community-card,
:root[data-theme='dark'] .stat,
:root[data-theme='dark'] .tag {
  background: var(--node);
  border-color: var(--line);
  color: var(--ink);
}

:root[data-theme='dark'] .chapter-card:hover,
:root[data-theme='dark'] .search-trigger:hover {
  background: #2b2119;
  border-color: var(--accent);
}

:root[data-theme='dark'] .card-num,
:root[data-theme='dark'] .progress-pill {
  background: rgba(240, 160, 60, .12);
}

:root[data-theme='dark'] .progress-pill { color: var(--green); border-color: var(--green); }
:root[data-theme='dark'] .ch-done-btn { border-color: var(--line-strong); }
:root[data-theme='dark'] .ch-done-btn:hover { border-color: var(--green); background: rgba(143, 206, 135, .1); }
:root[data-theme='dark'] .ch-done-btn.done { border-color: var(--green); background: var(--green); }
:root[data-theme='dark'] .search-trigger { background: var(--node); border-color: var(--line-strong); color: var(--ink-soft); }
:root[data-theme='dark'] .search-modal { background: #201914; border-color: var(--line-strong); }
:root[data-theme='dark'] .search-input-wrap { background: #1a1410; border-color: var(--line); }
:root[data-theme='dark'] .search-result { color: var(--ink); }
:root[data-theme='dark'] .search-result:hover,
:root[data-theme='dark'] .search-result.active { background: rgba(240, 160, 60, .1); }
:root[data-theme='dark'] .search-overlay { background: rgba(16, 12, 9, .72); }

/* Shared chapter shell surfaces and controls. */
:root[data-theme='dark'] .bfp-shell,
:root[data-theme='dark'] .bfp-content { background: var(--bfp-paper); color: var(--bfp-ink); }
:root[data-theme='dark'] .bfp-toc { background: linear-gradient(180deg, var(--bfp-paper-2), var(--bfp-paper)); border-color: var(--bfp-line); }
:root[data-theme='dark'] .bfp-toc-link { color: var(--bfp-ink-soft); }
:root[data-theme='dark'] .bfp-toc-link:hover { color: var(--bfp-ink); background: rgba(240, 160, 60, .1); }
:root[data-theme='dark'] .bfp-toc-link.is-active { color: var(--bfp-accent); background: rgba(240, 160, 60, .08); }
:root[data-theme='dark'] .bfp-toc-toggle { background: rgba(32, 25, 20, .94); color: var(--bfp-ink-soft); border-color: var(--bfp-line-strong); }
:root[data-theme='dark'] .bfp-toc-scrim { background: rgba(16, 12, 9, .62); }
:root[data-theme='dark'] .bfp-content a { color: var(--bfp-accent); }
:root[data-theme='dark'] .chapter-nav {
  background: #201914;
  border-top-color: #3d332b;
  box-shadow: 0 -8px 32px -16px rgba(20, 13, 7, .6);
  color: #f2e8dc;
}
:root[data-theme='dark'] .chapter-nav .nav-chapter-link,
:root[data-theme='dark'] .chapter-nav .nav-indicator { color: #b8a898; }
:root[data-theme='dark'] .chapter-nav .nav-indicator {
  background: #17120e;
  border-color: #51443a;
  color: #f2e8dc;
}
:root[data-theme='dark'] .chapter-nav .nav-indicator:hover {
  background: #f0a03c;
  border-color: #f0a03c;
  color: #1a1208;
}
:root[data-theme='dark'] .chapter-nav .nav-arrow,
:root[data-theme='dark'] .chapter-nav .nav-sep { color: #f0a03c; }
:root[data-theme='dark'] .viz,
:root[data-theme='dark'] figure {
  background: linear-gradient(180deg, #201914, #17120e);
  border-color: #3d332b;
  color: #f2e8dc;
}
:root[data-theme='dark'] .viz-title { color: #f2e8dc; }
:root[data-theme='dark'] .viz-note,
:root[data-theme='dark'] figcaption { color: #b8a898; }
:root[data-theme='dark'] .viz svg rect[fill='#e0e9dd'],
:root[data-theme='dark'] .viz svg rect[fill='#dee5ee'],
:root[data-theme='dark'] .viz svg rect[fill='#f0e5c9'],
:root[data-theme='dark'] .viz svg rect[fill='#e6ddcc'],
:root[data-theme='dark'] .viz svg rect[fill='#f6f0e6'],
:root[data-theme='dark'] .viz svg rect[fill='#ece3d4'],
:root[data-theme='dark'] .viz svg rect[fill='#f3ede2'] {
  fill: #251d17;
  stroke: #3d332b;
}
:root[data-theme='dark'] .viz svg rect[fill='#f7e9e2'] {
  fill: #2c1a14;
  stroke: #b8402e;
}
:root[data-theme='dark'] .viz svg rect[fill='#eccdc2'] {
  fill: #2c1a14;
  stroke: #b8402e;
}
:root[data-theme='dark'] .viz svg text[fill='#3f6f4e'] { fill: #8fce87; }
:root[data-theme='dark'] .viz svg text[fill='#37607f'],
:root[data-theme='dark'] .viz svg text[fill='#5b5347'],
:root[data-theme='dark'] .viz svg text[fill='#211e1a'],
:root[data-theme='dark'] .viz svg text[fill='#8d8475'],
:root[data-theme='dark'] .viz svg text[fill='#7d756a'] { fill: #f2e8dc; }
:root[data-theme='dark'] .viz svg text[fill='#8f2f20'] { fill: #ffc46b; }
:root[data-theme='dark'] figure svg rect[fill^='rgba'] {
  fill: #251d17;
  stroke: #3d332b;
}
:root[data-theme='dark'] .fig-frame {
  background: #201914 !important;
  border-color: #3d332b;
  box-shadow: none;
}
:root[data-theme='dark'] .diagram {
  background: #201914 !important;
  border-color: #3d332b;
  box-shadow: none;
}
:root[data-theme='dark'] .flow,
:root[data-theme='dark'] .fig-wrap,
:root[data-theme='dark'] .diagram-wrap,
:root[data-theme='dark'] .demo,
:root[data-theme='dark'] .ref-box,
:root[data-theme='dark'] .code-panel,
:root[data-theme='dark'] .tbl-wrap,
:root[data-theme='dark'] .table-wrap {
  background: #201914 !important;
  border-color: #3d332b;
  color: #f2e8dc;
}
:root[data-theme='dark'] figure > div {
  background: #201914 !important;
  border-color: #3d332b;
  color: #f2e8dc;
}
:root[data-theme='dark'] .flow .step .b,
:root[data-theme='dark'] .section-num,
:root[data-theme='dark'] .section-badge,
:root[data-theme='dark'] .sec-num {
  color: #f2e8dc;
}
:root[data-theme='dark'] .ec-logic,
:root[data-theme='dark'] .ec-config,
:root[data-theme='dark'] .s400 {
  background: #2c1a14 !important;
  color: #f2e8dc;
  border-color: #b8402e;
}
:root[data-theme='dark'] .ec-db,
:root[data-theme='dark'] .ec-input {
  background: #1c2830 !important;
  color: #f2e8dc;
  border-color: #8fb9d0;
}
:root[data-theme='dark'] .ec-ext {
  background: #1c2a20 !important;
  color: #f2e8dc;
  border-color: #8fce87;
}
:root[data-theme='dark'] .ec-db .ec-title,
:root[data-theme='dark'] .ec-input .ec-title { color: #8fb9d0; }
:root[data-theme='dark'] .ec-ext .ec-title { color: #8fce87; }
:root[data-theme='dark'] .diagram-box,
:root[data-theme='dark'] .compare-card {
  background: #201914 !important;
  border-color: #3d332b;
  color: #f2e8dc;
}
:root[data-theme='dark'] .card-grid .card {
  background: #251d17 !important;
  border-color: #3d332b;
  color: #f2e8dc;
}
:root[data-theme='dark'] .card-grid .card-title {
  color: #f2e8dc;
}
:root[data-theme='dark'] figure svg rect[fill='#fff'],
:root[data-theme='dark'] figure svg rect[fill='#f3ede2'],
:root[data-theme='dark'] figure svg rect[fill='#e0e9dd'] {
  fill: #251d17;
  stroke: #3d332b;
}
:root[data-theme='dark'] figure svg rect[fill='#f7d9d1'],
:root[data-theme='dark'] figure svg rect[fill='#f4ded6'] {
  fill: #2c1a14;
  stroke: #b8402e;
}
:root[data-theme='dark'] figure svg rect[fill='var(--ink)'] {
  fill: #251d17;
  stroke: #3d332b;
}
:root[data-theme='dark'] figure svg text[fill='#fff'] {
  fill: #f2e8dc;
}
:root[data-theme='dark'] ol.steps > li::before {
  background: #251d17;
  color: #f2e8dc;
  border: 1px solid #3d332b;
}
:root[data-theme='dark'] figure svg rect[stroke='#d8cfbe'] {
  stroke: #51443a;
}
:root[data-theme='dark'] figure svg text[fill='#3f6f4e'] { fill: #8fce87; }
:root[data-theme='dark'] figure svg text[fill='#37607f'],
:root[data-theme='dark'] figure svg text[fill='#5b5347'],
:root[data-theme='dark'] figure svg text[fill='#211e1a'],
:root[data-theme='dark'] figure svg text[fill='#8d8475'],
:root[data-theme='dark'] figure svg text[fill='#7d756a'] { fill: #f2e8dc; }
:root[data-theme='dark'] figure svg text[fill='#7a4135'],
:root[data-theme='dark'] figure svg text[fill='#9a8f78'],
:root[data-theme='dark'] figure svg text[fill='#a06054'],
:root[data-theme='dark'] figure svg text[fill='#d9a99c'] { fill: #b8a898; }
:root[data-theme='dark'] figure svg text[fill='#8f2f20'] { fill: #ffc46b; }
:root[data-theme='dark'] .tag,
:root[data-theme='dark'] .meta span,
:root[data-theme='dark'] .note,
:root[data-theme='dark'] table,
:root[data-theme='dark'] th,
:root[data-theme='dark'] td,
:root[data-theme='dark'] blockquote,
:root[data-theme='dark'] .callout,
:root[data-theme='dark'] .tip,
:root[data-theme='dark'] .warning,
:root[data-theme='dark'] .formula {
  border-color: var(--line);
}

:root[data-theme='dark'] table,
:root[data-theme='dark'] th,
:root[data-theme='dark'] td,
:root[data-theme='dark'] blockquote,
:root[data-theme='dark'] .note,
:root[data-theme='dark'] .callout,
:root[data-theme='dark'] .tip,
:root[data-theme='dark'] .warning,
:root[data-theme='dark'] .formula,
:root[data-theme='dark'] .meta span,
:root[data-theme='dark'] .tag {
  background: var(--paper-3);
  color: var(--ink-soft);
}
:root[data-theme='dark'] tr:nth-child(even) td { background: var(--node); }
:root[data-theme='dark'] h1,
:root[data-theme='dark'] h2,
:root[data-theme='dark'] h3,
:root[data-theme='dark'] strong,
:root[data-theme='dark'] .hero h1,
:root[data-theme='dark'] .community-title { color: var(--ink); }
:root[data-theme='dark'] .lede,
:root[data-theme='dark'] .hero .lede,
:root[data-theme='dark'] .community-desc,
:root[data-theme='dark'] footer.doc { color: var(--ink-soft); }

:root[data-theme='dark'] pre,
:root[data-theme='dark'] .code-block,
:root[data-theme='dark'] .code-body { background: var(--code-bg) !important; }
:root[data-theme='dark'] .code-tabs,
:root[data-theme='dark'] .code-head,
:root[data-theme='dark'] .code-run-wrap { background: var(--code-bar) !important; }
:root[data-theme='dark'] pre code,
:root[data-theme='dark'] .code-body code { color: var(--code-ink) !important; }
