:root {
  /* Color tokens */
  --color-page: rgb(255 255 255);
  --color-page-alt: rgb(249 250 251);
  --color-surface: rgb(15 23 42);
  --color-surface-alt: rgb(17 24 39);
  --color-bg: var(--color-surface);
  --color-card: rgb(30 41 59);
  --color-card-private: rgb(59 29 116);
  --color-card-critical: rgb(63 11 19);
  --color-panel: rgb(31 41 55);
  --color-panel-hover: rgb(51 65 85);
  --color-border: rgb(55 65 81);
  --color-border-subtle: rgb(209 213 219);
  --color-primary: rgb(254 0 50);
  --color-secondary: rgb(255 147 165);
  --color-info: rgb(96 165 250);
  --color-info-strong: rgb(37 99 235);
  --color-info-pressed: rgb(29 78 216);
  --color-muted-strong: rgb(107 114 128);
  --color-text: rgb(248 250 252);
  --color-text-strong: rgb(15 23 42);
  --color-muted: rgb(148 163 184);
  --color-muted-alt: rgb(156 163 175);
  --color-subtle-text: rgb(226 232 240);
  --color-subtle: rgb(229 231 235);
  --color-critical: rgb(127 29 29);
  --color-critical-strong: rgb(153 27 27);
  --color-neutral-700: rgb(63 63 70);
  --color-neutral-600: rgb(82 82 91);
  --color-white: rgb(255 255 255);
  --color-black: rgb(0 0 0);
  --color-overlay: rgb(26 34 52);

  /* Spacing scale */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;

  /* Border radii */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm: 0 0.0625rem 0.125rem 0 rgb(0 0 0 / 5%);
  --shadow-md: 0 0.25rem 0.375rem -0.0625rem rgb(0 0 0 / 10%);
  --shadow-lg: 0 0.625rem 0.9375rem -0.1875rem rgb(0 0 0 / 10%);
  --shadow-modal: 0 1.25rem 2.5rem -0.375rem rgb(15 23 42 / 55%);

  /* Typography */
  --font-family-sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-family-mono: "Fira Code", "SFMono-Regular", ui-monospace, monospace;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --line-height-tight: 1.1;
  --line-height-snug: 1.25;
  --line-height-base: 1.5;
  --line-height-relaxed: 1.75;

  /* Motion */
  --motion-duration-fast: 120ms;
  --motion-duration-base: 160ms;
  --motion-duration-slow: 280ms;
  --motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --modal-motion-duration: var(--motion-duration-base);
}