@font-face { font-family: "Platypi"; src: url("../_fonts/Platypi-VariableFont_wght.woff2") format("woff2"); font-weight: 400 600; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../_fonts/ibm-plex-mono-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
:root {
  --color-canvas: #f8f4e9; --color-terracotta: #b84b30; --color-espresso: #5f1d1a; --color-text: #000000;
  --color-frost: #ffffff; --color-stone: #666666; --color-border: #e5e7eb;
  --font-display: "Platypi", Georgia, serif; --font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --text-10: 10px; --text-12: 12px; --text-15: 15px; --text-16: 16px; --text-20: 20px; --text-24: 24px; --text-36: 36px;
  --w-400: 400; --w-600: 600;
  --track-36: 0.1em; --track-24: 0.025em; --track-20: 0.05em; --track-mono: -0.025em; --track-12: 0.1em;
  --lh-display: 0.9; --lh-head: 1.1; --lh-sub: 1.2; --lh-body: 1.35;
  --r-card: 14px; --r-pill: 9999px;
  --s-4: 4px; --s-8: 8px; --s-12: 12px; --s-16: 16px; --s-24: 24px; --s-32: 32px; --s-48: 48px; --s-64: 64px; --s-96: 96px;
  --line-terra: 1px solid var(--color-terracotta); --line: 1px solid var(--color-border);
  --max: 1200px; --measure: 54ch; --sketch-hero: min(44vw, 280px);
}