:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --site-color-canvas: #141413;
  --site-color-surface: #1d1d1a;
  --site-color-surface-raised: #25241f;
  --site-color-text: #f5f1e8;
  --site-color-text-muted: #aaa69d;
  --site-color-label: #c8b99f;
  --site-color-accent: #f09a79;
  --site-color-accent-hover: #f5b198;
  --site-color-border: #4a4840;
  --site-color-focus: #f0a07f;
  --site-color-code: #c7d6ac;
  --site-color-positive: #b9c99f;
  --site-color-selection: #47463f;
  --site-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-font-display: ui-serif, Georgia, "Times New Roman", serif;
  --site-font-label: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --site-measure-reading: 1200px;
  --site-header-height: 65px;
}

:root[data-theme="light"] {
  color-scheme: light;
  --site-color-canvas: #faf9f5;
  --site-color-surface: #ffffff;
  --site-color-surface-raised: #f0eee6;
  --site-color-text: #141413;
  --site-color-text-muted: #625f58;
  --site-color-label: #6f5a3c;
  --site-color-accent: #9f402c;
  --site-color-accent-hover: #783020;
  --site-color-border: #b8b5aa;
  --site-color-focus: #9f402c;
  --site-color-code: #435522;
  --site-color-positive: #435522;
  --site-color-selection: #e3dfd4;
}

:root {
  /* Temporary compatibility aliases: shared semantic tokens are authoritative. */
  --bg-color: var(--site-color-canvas);
  --text-color: var(--site-color-text);
  --card-bg: var(--site-color-surface);
  --card-border: var(--site-color-border);
  --primary-color: var(--site-color-accent);
  --secondary-color: var(--site-color-positive);
  --link-color: var(--site-color-accent);
  --link-hover: var(--site-color-accent-hover);
  --text-muted: var(--site-color-text-muted);
  --ayu-bg: var(--site-color-canvas);
  --ayu-fg: var(--site-color-text);
  --ayu-ui: var(--site-color-surface);
  --ayu-ui-border: var(--site-color-border);
  --ayu-selection: var(--site-color-selection);
  --ayu-comment: var(--site-color-text-muted);
  --ayu-accent: var(--site-color-accent);
  --ayu-func: var(--site-color-accent-hover);
  --ayu-entity: var(--site-color-positive);
  --ayu-string: var(--site-color-code);
  --ayu-operator: var(--site-color-accent);
  --ayu-tag: var(--site-color-label);
  --ayu-keyword: var(--site-color-accent);
  --ayu-markup: var(--site-color-accent);
  --font-main: var(--site-font-body);
  --font-mono: var(--site-font-label);
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --spacing-unit: 1rem;
  --content-prose: 1200px;
  --content-wide: 1200px;
}