/* Studio design tokens (ADR 0006). Semantic tokens only — components must
   never use raw colors. Every color pair used as text meets WCAG AA in both
   themes; verify changes before shipping. light-dark() resolves per element,
   so forcing `color-scheme` on a container re-themes everything inside it
   (the /styleguide panels rely on this). */

:root {
  color-scheme: light dark;

  --bg: light-dark(oklch(97.2% 0.014 85deg), oklch(23% 0.012 60deg));
  --surface: light-dark(oklch(99% 0.005 85deg), oklch(27% 0.014 60deg));
  --surface-muted: light-dark(oklch(93.8% 0.02 82deg), oklch(31% 0.015 60deg));
  --line: light-dark(oklch(93.8% 0.02 82deg), oklch(34% 0.014 60deg));
  --ink: light-dark(oklch(28% 0.015 60deg), oklch(93% 0.012 85deg));
  --ink-soft: light-dark(oklch(47% 0.02 60deg), oklch(76% 0.015 75deg));
  --ink-faint: light-dark(oklch(52% 0.018 65deg), oklch(68% 0.015 70deg));
  --accent: light-dark(oklch(55% 0.13 45deg), oklch(68% 0.12 50deg));
  --accent-strong: light-dark(oklch(46% 0.12 42deg), oklch(75% 0.11 55deg));
  --accent-soft: light-dark(oklch(92% 0.045 55deg), oklch(33% 0.04 50deg));
  --on-accent: light-dark(oklch(98% 0.008 85deg), oklch(21% 0.02 50deg));
  --success: light-dark(oklch(51% 0.07 150deg), oklch(72% 0.08 150deg));
  --focus-ring: var(--ink);
  --font-sans:
    ui-rounded, "SF Pro Rounded", "Avenir Next", "Avenir", seravek, system-ui,
    sans-serif;
  --font-num: "Avenir Next", "Avenir", futura, system-ui, sans-serif;
  --text-2xs: 0.72rem;
  --text-xs: 0.78rem;
  --text-sm: 0.86rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.9rem;
  --text-display: clamp(1.7rem, 7vw, 2rem);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2.25rem;
  --space-7: 3rem;
  --radius-sm: 0.7rem;
  --radius-md: 0.9rem;
  --radius-lg: 1.1rem;
  --radius-pill: 999px;
  --duration-quick: 150ms;
  --ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
}