:root {
  --color-paper: oklch(97% .002 80);
  --color-white: oklch(100% 0 0);
  --color-ink: oklch(28% .005 65);
  --color-muted: oklch(47% .016 265);
  --color-accent: oklch(51% .255 266);
  --color-accent-hover: oklch(44% .245 266);
  --color-accent-ink: oklch(100% 0 0);
  --color-blue-light: oklch(91% .04 266);
  --color-blue-mid: oklch(75% .12 266);
  --color-line: oklch(87% .009 265);
  --color-dark: oklch(27% .005 65);
  --color-dark-raised: oklch(32% .005 65);
  --color-dark-line: oklch(34% .014 266);
  --color-dark-muted: oklch(73% .018 266);
  --color-lime: oklch(92% .15 123);
  --color-focus: oklch(57% .23 37);
  --color-clear: transparent;
  --color-backdrop: oklch(12% .015 266 / .65);
  --font-display: 'Darker Grotesque', Arial, sans-serif;
  --font-body: 'Manrope', Arial, sans-serif;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;
  --page-gutter: clamp(20px, 6.7vw, 104px);
  --text-display: clamp(64px, 7.6vw, 120px);
  --text-heading: clamp(40px, 4.7vw, 72px);
  --radius-sm: 8px;
  --radius-md: 12px;
  --rule-hair: 1px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in: cubic-bezier(.7, 0, .84, 0);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long: 420ms;
  --z-sticky: 200;
  --z-modal: 400;
}