:root {
  color-scheme: dark;
  --indigo-400: #8992fe;
  --indigo-500: #6564f4;
  --indigo-600: #4b41cf;
  --font-sans: 'Ubuntu Sans', system-ui, sans-serif;
  --type-h3-size: 1.375rem;
  --type-h3-line: 1.875rem;
  --type-body-size: 1rem;
  --type-body-line: 1.5rem;
  --type-small-size: 0.875rem;
  --type-small-line: 1.25rem;
  --space-8: 0.5rem;
  --space-12: 0.75rem;
  --space-16: 1rem;
  --space-24: 1.5rem;
  --space-32: 2rem;
  --space-48: 3rem;
  --space-64: 4rem;
  --space-96: 6rem;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --control-lg: 3rem;
  --width-content: 75rem;
  --duration-fast: 100ms;
  --duration-base: 200ms;
  --ease: cubic-bezier(.2,0,0,1);
  --bg-page: #0a0b15;
  --bg-raised: #12131f;
  --bg-overlay: #1a1c2c;
  --border: #262938;
  --border-strong: #363a4f;
  --text: #f9fafd;
  --text-secondary: #9fa1aa;
  --text-muted: #878995;
  --text-accent: #8992fe;
  --button: #4b41cf;
  --button-hover: #5b56ea;
  --on-button: #ffffff;
  --focus: #8992fe;
}

@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --bg-page: #f9fafd;
    --bg-raised: #ffffff;
    --bg-overlay: #ffffff;
    --border: #e5e6ec;
    --border-strong: #d2d4dc;
    --text: #151621;
    --text-secondary: #51535e;
    --text-muted: #6b6d78;
    --text-accent: #4b41cf;
    --button: #4b41cf;
    --button-hover: #3b2eaf;
    --on-button: #ffffff;
    --focus: #4b41cf;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
  }
}
