:root {
  /* Primitive tokens */
  --primitive-paper-0: oklch(100% 0 0);
  --primitive-paper-1: oklch(97.6% 0.006 82);
  --primitive-paper-2: oklch(95.5% 0.007 82);
  --primitive-ink-950: oklch(18% 0.008 82);
  --primitive-ink-800: oklch(34% 0.009 82);
  --primitive-ink-600: oklch(49% 0.009 82);
  --primitive-ink-400: oklch(65% 0.008 82);
  --primitive-line-200: oklch(88% 0.008 82);
  --primitive-line-300: oklch(81% 0.009 82);
  --primitive-coral-700: oklch(49% 0.18 35);
  --primitive-coral-600: oklch(57% 0.2 35);
  --primitive-coral-100: oklch(94% 0.035 35);
  --primitive-green-700: oklch(45% 0.1 165);
  --primitive-green-100: oklch(94% 0.025 165);
  --primitive-amber-700: oklch(48% 0.1 75);
  --primitive-amber-100: oklch(95% 0.035 75);
  --primitive-red-700: oklch(47% 0.18 28);
  --primitive-red-100: oklch(95% 0.03 28);

  /* Semantic tokens */
  --color-canvas: var(--primitive-paper-1);
  --color-surface: var(--primitive-paper-0);
  --color-surface-subtle: var(--primitive-paper-2);
  --color-text: var(--primitive-ink-950);
  --color-text-muted: var(--primitive-ink-800);
  --color-text-faint: var(--primitive-ink-600);
  --color-border: var(--primitive-line-200);
  --color-border-strong: var(--primitive-line-300);
  --color-accent: var(--primitive-coral-600);
  --color-accent-strong: var(--primitive-coral-700);
  --color-accent-subtle: var(--primitive-coral-100);
  --color-accent-ink: var(--primitive-paper-0);
  --color-positive: var(--primitive-green-700);
  --color-positive-subtle: var(--primitive-green-100);
  --color-warning: var(--primitive-amber-700);
  --color-warning-subtle: var(--primitive-amber-100);
  --color-danger: var(--primitive-red-700);
  --color-danger-subtle: var(--primitive-red-100);
  --color-danger-border: oklch(76% 0.09 28);
  --focus-ring: oklch(57% 0.2 35 / 28%);
  --focus-ring-soft: oklch(57% 0.2 35 / 12%);
  --color-dark-border: oklch(28% 0.007 82);
  --color-dark-border-soft: oklch(29% 0.007 82);
  --color-dark-surface-hover: oklch(24% 0.007 82);
  --color-dark-surface-active: oklch(27% 0.035 35);
  --color-dark-text: oklch(87% 0.006 82);
  --color-dark-text-muted: oklch(70% 0.007 82);
  --color-dark-text-faint: oklch(61% 0.007 82);
  --color-active-text: oklch(76% 0.15 35);
  --color-status: oklch(73% 0.11 165);
  --color-status-ring: oklch(73% 0.11 165 / 12%);
  --color-canvas-translucent: oklch(97.6% 0.006 82 / 92%);
  --color-neutral-chip: oklch(93% 0.006 82);
  --color-neutral-chip-text: oklch(48% 0.007 82);
  --color-skeleton-edge: oklch(91% 0.007 82);
  --color-skeleton-highlight: oklch(96% 0.005 82);
  --color-code-surface: oklch(94% 0.006 82);
  --color-backdrop: oklch(18% 0.008 82 / 48%);
  --shadow-line: 0 1px 1px oklch(18% 0.008 82 / 2%);
  --shadow-dialog: 0 28px 80px oklch(18% 0.008 82 / 24%);

  /* Component compatibility tokens */
  --bg: var(--color-canvas);
  --surface: var(--color-surface);
  --surface-soft: var(--color-surface-subtle);
  --ink: var(--color-text);
  --ink-2: var(--color-text-muted);
  --ink-3: var(--color-text-faint);
  --line: var(--color-border);
  --line-strong: var(--color-border-strong);
  --accent: var(--color-accent);
  --accent-hover: var(--color-accent-strong);
  --accent-soft: var(--color-accent-subtle);
  --positive: var(--color-positive);
  --positive-soft: var(--color-positive-subtle);
  --warning: var(--color-warning);
  --warning-soft: var(--color-warning-subtle);
  --danger: var(--color-danger);
  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 2px oklch(18% 0.008 82 / 4%), 0 14px 38px oklch(18% 0.008 82 / 6%);
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Avenir Next", Avenir, Futura, "Trebuchet MS", sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
}