:root {
  --color-paper: oklch(100% 0 0);
  --color-paper-2: oklch(97.5% 0.012 295);
  --color-ink: oklch(25% 0.05 295);
  --color-ink-2: oklch(47% 0.04 295);
  --color-line: oklch(91% 0.02 295);
  --color-accent: oklch(52% 0.22 295);
  --color-accent-ink: oklch(100% 0 0);
  --color-focus: oklch(52% 0.22 295);
  --color-safe: oklch(46% 0.13 150);
  --color-safe-bg: oklch(95% 0.05 150);
  --color-caution: oklch(47% 0.1 75);
  --color-caution-bg: oklch(95% 0.06 85);
  --color-avoid: oklch(47% 0.18 27);
  --color-avoid-bg: oklch(94% 0.04 27);
  --color-ask: oklch(45% 0.11 240);
  --color-ask-bg: oklch(94% 0.04 235);
  --font-body: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
  --space-2xl: 72px;
  --space-3xl: 112px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 140ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-paper: oklch(18% 0.02 295);
    --color-paper-2: oklch(23% 0.025 295);
    --color-ink: oklch(96% 0.01 295);
    --color-ink-2: oklch(77% 0.03 295);
    --color-line: oklch(33% 0.03 295);
    --color-accent: oklch(74% 0.14 295);
    --color-accent-ink: oklch(20% 0.03 295);
    --color-focus: oklch(74% 0.14 295);
    --color-safe: oklch(82% 0.14 150);
    --color-safe-bg: oklch(30% 0.05 150);
    --color-caution: oklch(84% 0.12 85);
    --color-caution-bg: oklch(32% 0.05 85);
    --color-avoid: oklch(80% 0.11 27);
    --color-avoid-bg: oklch(32% 0.06 27);
    --color-ask: oklch(82% 0.09 235);
    --color-ask-bg: oklch(31% 0.05 235);
  }
}