:root,[data-theme="dark"] {
  color-scheme: dark;

  --color-canvas: #061510;
  --color-canvas-raised: #0b2017;
  --color-surface: #10291e;
  --color-surface-strong: #17382a;
  --color-text: #edf7ef;
  --color-text-muted: #b8cabe;
  --color-border: #315344;
  --color-border-strong: #557d6a;
  --color-accent: #8be7b1;
  --color-accent-strong: #baf5cf;
  --color-accent-ink: #062116;
  --color-signal: #ff9b54;
  --color-signal-strong: #ffc397;
  --color-signal-ink: #2a1002;
  --color-focus: #ffd166;
  --color-selection: #ff9b54;
  --color-selection-text: #1d0b00;
  --color-code: #071a12;
  --color-grid: rgba(139, 231, 177, 0.08);
  --color-halo: rgba(139, 231, 177, 0.13);
  --shadow-low: 0 1rem 3rem rgba(0, 0, 0, 0.2);
  --shadow-high: 0 1.5rem 4rem rgba(0, 0, 0, 0.34);

  --font-display: Georgia, "Times New Roman", serif;
  --font-body: Aptos, "Segoe UI", sans-serif;
  --font-mono: "Cascadia Code", Consolas, monospace;

  --step--1: clamp(0.82rem, 0.79rem + 0.14vw, 0.9rem);
  --step-0: clamp(1rem, 0.96rem + 0.2vw, 1.12rem);
  --step-1: clamp(1.22rem, 1.12rem + 0.48vw, 1.5rem);
  --step-2: clamp(1.52rem, 1.32rem + 0.96vw, 2.05rem);
  --step-3: clamp(1.9rem, 1.55rem + 1.7vw, 2.85rem);
  --step-4: clamp(2.55rem, 1.7rem + 4vw, 5.2rem);

  --space-1: 0.35rem;
  --space-2: 0.65rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.25rem;
  --space-6: 3.5rem;
  --space-7: 5.5rem;

  --radius-small: 0.4rem;
  --radius-medium: 0.8rem;
  --radius-large: 1.4rem;
  --line-readable: 70ch;
  --page-width: 76rem;
  --border-thin: 1px;
  --border-heavy: 2px;
}

[data-theme="light"] {
  color-scheme: light;

  --color-canvas: #f3ede0;
  --color-canvas-raised: #faf5ea;
  --color-surface: #fffaf0;
  --color-surface-strong: #e5eadc;
  --color-text: #123d2d;
  --color-text-muted: #4f665a;
  --color-border: #a9b8aa;
  --color-border-strong: #718a7a;
  --color-accent: #116747;
  --color-accent-strong: #074d33;
  --color-accent-ink: #f8fff9;
  --color-signal: #ad451c;
  --color-signal-strong: #7f2f10;
  --color-signal-ink: #fff8ed;
  --color-focus: #8a3c09;
  --color-selection: #174f3b;
  --color-selection-text: #fffdf7;
  --color-code: #e9eee4;
  --color-grid: rgba(17, 103, 71, 0.1);
  --color-halo: rgba(17, 103, 71, 0.1);
  --shadow-low: 0 0.8rem 2.5rem rgba(34, 58, 45, 0.1);
  --shadow-high: 0 1.4rem 3.5rem rgba(34, 58, 45, 0.16);
}