:root {
  color-scheme: light;
  --bg-default: #f8fafc;
  --bg-surface: #ffffff;
  --bg-subtle: #f1f4f8;
  --fg-default: #182033;
  --fg-muted: #536174;
  --fg-subtle: #687386;
  --fg-on-accent: #ffffff;
  --fg-on-inverse: #ffffff;
  --stroke-default: #c8d1de;
  --stroke-subtle: #e2e8f0;
  --accent-default: #4966aa;
  --accent-hover: #36528e;
  --focus: #4966aa;
  --code-background: #f1f4f8;
  --code-foreground: #25324a;
  --code-stroke: #c8d1de;
  --syntax-comment: #5c687a;
  --syntax-keyword: #9a4f20;
  --syntax-string: #46672f;
  --syntax-number: #7a5b12;
  --syntax-variable: #9b3d48;
  --syntax-function: #235f85;
  --status-danger: #9d302a;
  --status-danger-background: #fff0ee;
  --status-success: #2f6e54;
  --status-success-background: #edf7f1;
  --overlay: rgba(24, 32, 51, .48);
  --shadow-dialog: 0 12px 32px rgba(24, 32, 51, .18);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --radius-control: .25rem;
  --radius-dialog: .375rem;
  --font-sans: system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  --content-width: 57.5rem;
  --reading-width: 43.75rem;
  --control-min-size: 2.75rem;
  --type-page-title: 600 clamp(2rem, 4.5vw, 2.5rem)/1.35 var(--font-sans);
  --type-list-title: 600 clamp(1.25rem, 2vw, 1.5rem)/1.45 var(--font-sans);
  --type-section: 600 1.5rem/1.4 var(--font-sans);
  --type-reading: 400 1.125rem/1.8 var(--font-sans);
  --type-label: 600 .875rem/1.5 var(--font-sans);
  --type-meta: 400 .8125rem/1.5 var(--font-sans);
  --type-code: 400 .875rem/1.75 var(--font-mono);

  /* Temporary aliases keep existing feature styles on the shared foundation. */
  --paper: var(--bg-default);
  --surface: var(--bg-surface);
  --soft: var(--bg-subtle);
  --ink: var(--fg-default);
  --secondary: var(--fg-muted);
  --muted: var(--fg-subtle);
  --line: var(--stroke-subtle);
  --accent: var(--accent-default);
  --green: var(--accent-default);
  --danger: var(--status-danger);
  --danger-bg: var(--status-danger-background);
  --max: var(--content-width);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg-default: #171b22;
  --bg-surface: #222832;
  --bg-subtle: #1c2430;
  --fg-default: #e9edf3;
  --fg-muted: #b3bdcc;
  --fg-subtle: #a0acbd;
  --fg-on-accent: #182033;
  --fg-on-inverse: #ffffff;
  --stroke-default: #566273;
  --stroke-subtle: #3a4554;
  --accent-default: #a3b9ee;
  --accent-hover: #c0cff4;
  --focus: #a3b9ee;
  --code-background: #1c2430;
  --code-foreground: #e9edf3;
  --code-stroke: #566273;
  --syntax-comment: #b5bfce;
  --syntax-keyword: #f0b27b;
  --syntax-string: #c3d9ac;
  --syntax-number: #e3c77e;
  --syntax-variable: #efaaaa;
  --syntax-function: #9bcbec;
  --status-danger: #f0aaa2;
  --status-danger-background: #40292c;
  --status-success: #98d3b5;
  --status-success-background: #203b31;
  --overlay: rgba(0, 0, 0, .58);
  --shadow-dialog: 0 12px 32px rgba(0, 0, 0, .4);
}
