@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Space+Mono:wght@400;700&display=swap');

:root {
  --color-ink: oklch(10% 0.025 293);
  --color-panel: oklch(14% 0.032 293);
  --color-panel-raised: oklch(18% 0.04 293);
  --color-panel-deep: oklch(8% 0.018 293);
  --color-rule: oklch(34% 0.055 302);
  --color-rule-soft: oklch(24% 0.038 293);
  --color-paper: oklch(95% 0.018 320);
  --color-muted: oklch(69% 0.037 296);
  --color-accent: oklch(69% 0.24 344);
  --color-accent-ink: oklch(13% 0.035 310);
  --color-cyan: oklch(78% 0.15 210);
  --color-lime: oklch(80% 0.19 133);
  --color-gold: oklch(82% 0.17 80);
  --color-danger: oklch(67% 0.22 23);
  --color-focus: oklch(85% 0.19 210);
  --color-nav: oklch(10% 0.025 293 / 92%);
  --color-accent-haze: oklch(69% 0.24 344 / 35%);
  --color-accent-shadow: oklch(69% 0.24 344 / 22%);
  --color-panel-hover: oklch(14% 0.032 293 / 72%);
  --color-shadow: oklch(10% 0.025 293 / 60%);
  --color-legacy-glow: oklch(69% 0.24 344 / 37%);
  --font-display: 'Press Start 2P', monospace;
  --font-body: 'Space Mono', monospace;
  --font-outlier: 'Press Start 2P', monospace;
  --text-xs: 0.64rem;
  --text-sm: 0.76rem;
  --text-base: 0.9rem;
  --text-lg: 1.15rem;
  --text-xl: clamp(1.3rem, 2vw, 2rem);
  --text-2xl: clamp(2rem, 5vw, 4.4rem);
  --text-display: clamp(2.6rem, 8vw, 7rem);
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3.5rem;
  --space-3xl: 6rem;
  --page-gutter: clamp(1rem, 3.5vw, 4rem);
  --radius-sm: 0.2rem;
  --radius-md: 0.5rem;
  --rule-hair: 1px;
  --dur-fast: 140ms;
  --dur-base: 240ms;
  --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);
  --z-sticky-nav: 300;
}
