[data-theme="dark"] {
  color-scheme: dark;
  --primary: #3b82f6;
  --primary-dark: #93c5fd;
  --accent: #2dd4bf;
  --accent-dark: #5eead4;
  --accent-soft: rgba(45, 212, 191, 0.18);
  --text: #e2e8f0;
  --muted: #94a3b8;
  --heading: #f1f5f9;
  --bg: #0f172a;
  --card: #1e293b;
  --border: #334155;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.45);
  --surface: rgba(30, 41, 59, 0.94);
  --surface-muted: rgba(15, 23, 42, 0.88);
  --surface-subtle: rgba(51, 65, 85, 0.55);
  --surface-border: rgba(51, 65, 85, 0.95);
  --primary-tint-08: rgba(59, 130, 246, 0.12);
  --primary-tint-10: rgba(59, 130, 246, 0.14);
  --primary-tint-12: rgba(59, 130, 246, 0.16);
  --primary-tint-18: rgba(59, 130, 246, 0.22);
  --primary-tint-24: rgba(59, 130, 246, 0.28);
  --accent-tint-06: rgba(45, 212, 191, 0.08);
  --accent-tint-08: rgba(45, 212, 191, 0.10);
  --accent-tint-12: rgba(45, 212, 191, 0.14);
  --accent-tint-14: rgba(45, 212, 191, 0.16);
  --accent-tint-16: rgba(45, 212, 191, 0.18);
  --grid-line: rgba(59, 130, 246, 0.08);
  --glow-teal: rgba(45, 212, 191, 0.14);
  --glow-blue: rgba(59, 130, 246, 0.16);
}

[data-theme="dark"] body {
  background:
    radial-gradient(circle at top left, var(--glow-teal), transparent 34rem),
    radial-gradient(circle at 90% 6%, var(--glow-blue), transparent 30rem),
    linear-gradient(180deg, #0b1220 0%, var(--bg) 48%, #0b1220 100%);
}

[data-theme="dark"] body::before {
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
}

[data-theme="dark"] body::after {
  background:
    radial-gradient(circle at 18% 72%, var(--glow-teal), transparent 18rem),
    radial-gradient(circle at 78% 60%, var(--glow-blue), transparent 22rem);
}

[data-theme="dark"] .site-header {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.88));
  border-bottom-color: var(--surface-border);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .site-header__nav a:hover,
[data-theme="dark"] .site-header__nav a:focus-visible {
  background: linear-gradient(90deg, var(--primary-tint-08), var(--accent-tint-12));
  border-color: var(--primary-tint-24);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .site-header__nav a.site-header__cta {
  border-color: var(--primary-tint-24);
  background: linear-gradient(90deg, var(--primary-tint-12), var(--accent-tint-14));
}

[data-theme="dark"] main {
  background:
    linear-gradient(180deg, var(--surface), var(--surface-muted)),
    radial-gradient(circle at 8% 12%, var(--accent-tint-12), transparent 18rem),
    radial-gradient(circle at 92% 4%, var(--primary-tint-12), transparent 20rem);
  border-color: var(--surface-border);
}

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] .hero h1,
[data-theme="dark"] .summary-card strong,
[data-theme="dark"] .translation-note strong,
[data-theme="dark"] .gift-header strong,
[data-theme="dark"] .meta-card strong,
[data-theme="dark"] .doc-footer strong,
[data-theme="dark"] .footer strong,
[data-theme="dark"] .chapter-grid .chapter-card h3 {
  color: var(--heading);
}

[data-theme="dark"] .eyebrow,
[data-theme="dark"] .chapter-label,
[data-theme="dark"] .kicker,
[data-theme="dark"] h1::after {
  background: linear-gradient(90deg, var(--primary-tint-12), var(--accent-tint-14));
}

[data-theme="dark"] .hero h1 > span:first-child {
  background: var(--surface-subtle);
  border-color: var(--primary-tint-18);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .translation-note {
  background:
    linear-gradient(180deg, var(--surface), var(--surface-muted)),
    radial-gradient(circle at top left, var(--accent-tint-12), transparent 10rem);
  border-color: var(--primary-tint-18);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .author-photo {
  background: var(--surface-subtle);
  border-color: var(--primary-tint-18);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .audience-tags span {
  background: var(--accent-soft);
}

[data-theme="dark"] .hero .hero-points > li {
  background: var(--surface-subtle);
  border-color: var(--primary-tint-12);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .button.secondary {
  color: var(--primary-dark);
  background: var(--card);
  border-color: var(--border);
}

[data-theme="dark"] .cto-stage {
  border-color: var(--primary-tint-18);
  background:
    radial-gradient(circle at 50% 40%, rgba(30, 41, 59, 0.95), rgba(30, 41, 59, 0.2) 38%, transparent 39%),
    linear-gradient(135deg, var(--primary-tint-12), var(--accent-tint-14));
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .cto-stage::before {
  border-color: var(--primary-tint-18);
  box-shadow: inset 0 0 0 52px rgba(30, 41, 59, 0.35);
}

[data-theme="dark"] .gift-header {
  border-color: rgba(148, 163, 184, 0.2);
  background: var(--surface-subtle);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .toc-step {
  background: var(--surface);
  border-color: var(--surface-border);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22);
}

[data-theme="dark"] .gift-footer {
  background: var(--primary-tint-10);
}

[data-theme="dark"] .node,
[data-theme="dark"] .level-card {
  background: var(--surface);
  border-color: var(--surface-border);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .level::before {
  background: var(--card);
  border-color: #1e3a5f;
}

[data-theme="dark"] .level-track::before {
  background: #1e3a5f;
}

[data-theme="dark"] .summary-card {
  background:
    linear-gradient(180deg, var(--surface), var(--surface-muted)),
    radial-gradient(circle at top left, var(--accent-tint-12), transparent 9rem);
  border-color: var(--surface-border);
}

[data-theme="dark"] .chapter-card a {
  background:
    linear-gradient(180deg, var(--surface), var(--surface-muted)),
    radial-gradient(circle at top left, var(--accent-tint-12), transparent 10rem);
  border-color: var(--surface-border);
}

[data-theme="dark"] .chapter-card a:hover,
[data-theme="dark"] .chapter-card a:focus-visible {
  border-color: var(--primary-tint-24);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .chapter-cover {
  border-color: var(--surface-border);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
  background: var(--surface-subtle);
}

[data-theme="dark"] .landing-cta {
  background:
    linear-gradient(135deg, var(--primary-tint-12), var(--accent-tint-14)),
    var(--surface-subtle);
  border-color: var(--primary-tint-18);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .meta-card,
[data-theme="dark"] li {
  background: linear-gradient(180deg, var(--card), var(--surface-muted));
  border-color: var(--surface-border);
}

[data-theme="dark"] li::before {
  color: var(--accent-dark);
}

[data-theme="dark"] h3 {
  background: linear-gradient(90deg, var(--primary-tint-08), var(--accent-tint-06));
  border-color: var(--primary-tint-10);
}

[data-theme="dark"] h3 + p {
  background: var(--surface-subtle);
}

[data-theme="dark"] div.hero,
[data-theme="dark"] figure.hero,
[data-theme="dark"] figure.chapter-visual,
[data-theme="dark"] .chapter-card {
  background: linear-gradient(135deg, var(--primary-tint-10), var(--accent-tint-08));
  border-color: var(--primary-tint-12);
}

[data-theme="dark"] .callout,
[data-theme="dark"] .callout-block {
  background: linear-gradient(135deg, var(--primary-tint-08), var(--accent-tint-08));
  border-color: var(--primary-tint-18);
}

[data-theme="dark"] .callout-label {
  background: var(--card);
}

[data-theme="dark"] table {
  background: var(--card);
}

[data-theme="dark"] th,
[data-theme="dark"] td {
  border-color: var(--surface-border);
}

[data-theme="dark"] .chapter-nav {
  background: linear-gradient(180deg, var(--surface), var(--surface-muted));
  border-color: var(--surface-border);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
}
[data-theme="dark"] .chapter-nav a,
[data-theme="dark"] .chapter-nav__link,
[data-theme="dark"] .chapter-back-link {
  background: transparent;
  border-color: transparent;
}
[data-theme="dark"] .chapter-nav__link--home {
  background: linear-gradient(90deg, var(--primary-tint-10), var(--accent-tint-12));
  border-color: var(--primary-tint-18);
}
[data-theme="dark"] .chapter-nav a:hover,
[data-theme="dark"] .chapter-nav a:focus-visible,
[data-theme="dark"] .chapter-nav__link:hover,
[data-theme="dark"] .chapter-nav__link:focus-visible {
  background: linear-gradient(90deg, var(--primary-tint-10), var(--accent-tint-12));
  border-color: var(--primary-tint-24);
}
[data-theme="dark"] .chapter-nav__link--home:hover,
[data-theme="dark"] .chapter-nav__link--home:focus-visible {
  background: linear-gradient(90deg, var(--primary-tint-12), var(--accent-tint-14));
}
[data-theme="dark"] .chapter-nav__label {
  color: var(--heading);
}

[data-theme="dark"] .chapter-player {
  background:
    linear-gradient(135deg, var(--surface), var(--surface-muted)),
    radial-gradient(circle at top left, var(--accent-tint-16), transparent 10rem);
  border-color: var(--primary-tint-18);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .chapter-player::before {
  background: var(--accent-soft);
}

[data-theme="dark"] .chapter-card-player {
  background:
    linear-gradient(180deg, var(--surface), var(--surface-muted)),
    radial-gradient(circle at top right, var(--accent-tint-14), transparent 8rem);
  border-color: var(--primary-tint-12);
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .chapter-card-player__label {
  background: var(--accent-soft);
}

[data-theme="dark"] .chapter-player__audio::-webkit-media-controls-panel,
[data-theme="dark"] .chapter-card-audio::-webkit-media-controls-panel {
  background: linear-gradient(90deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.98));
}

[data-theme="dark"] .theme-toggle {
  border-color: var(--primary-tint-24);
  background: linear-gradient(90deg, var(--primary-tint-10), var(--accent-tint-12));
  color: var(--primary-dark);
}

[data-theme="dark"] .chapter-ai-summary {
  background:
    linear-gradient(135deg, var(--primary-tint-08), var(--accent-tint-08)),
    linear-gradient(180deg, var(--surface), var(--surface-muted));
  border-color: var(--primary-tint-18);
}

[data-theme="dark"] .chapter-ai-summary__label {
  background: linear-gradient(90deg, var(--primary-tint-12), var(--accent-tint-14));
}

[data-theme="dark"] .theme-toggle:hover,
[data-theme="dark"] .theme-toggle:focus-visible {
  border-color: rgba(147, 197, 253, 0.45);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}