:root {
  color-scheme: light dark;

  --paper: oklch(97% 0.008 85);
  --paper-sunk: oklch(93.5% 0.010 85);
  --ink: oklch(22% 0.012 60);
  --ink-muted: oklch(50% 0.012 60);
  --rule: oklch(83% 0.010 75);
  --rule-strong: oklch(62% 0.012 75);
  --alarm: oklch(52% 0.20 27);

  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --text-xs: 0.6875rem;
  --text-sm: 0.8125rem;
  --text-base: 1rem;
  --text-lg: clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
  --text-xl: clamp(1.375rem, 1.1rem + 1.2vw, 2rem);
  --text-masthead: clamp(2.75rem, 1rem + 8vw, 6.5rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-section: clamp(3rem, 2rem + 4vw, 6rem);

  --page-max: 78rem;
  --measure: 60ch;

  --duration: 600ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: oklch(17% 0.012 250);
    --paper-sunk: oklch(21% 0.014 250);
    --ink: oklch(91% 0.014 240);
    --ink-muted: oklch(68% 0.014 240);
    --rule: oklch(33% 0.014 250);
    --rule-strong: oklch(52% 0.016 250);
    --alarm: oklch(70% 0.19 27);
  }
}