:root {
  color-scheme: dark;

  --bg: #090a0c;
  --surface: #101216;
  --surface-raised: #161a20;
  --scrim: rgba(9, 10, 12, 0.76);
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.2);
  --ink: #f2f4f7;
  --ink-muted: #9aa2b1;
  --cta-bg: #f2f4f7;
  --cta-ink: #090a0c;
  --cta-hover: #ffffff;
  --focus-ring: #3b82f6;
  --danger: #ffb4b4;
  --plan-line: rgba(255, 255, 255, 0.3);

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  --step-wordmark: clamp(4.25rem, 15.2vw, 15.5rem);
  --step-statement: clamp(1.85rem, 4.1vw, 3.85rem);
  --step-h2: clamp(1.5rem, 2.5vw, 2.35rem);
  --step-lead: clamp(1.0625rem, 1.2vw, 1.1875rem);
  --step-body: 1rem;
  --step-meta: 0.875rem;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-6: 3rem;
  --space-8: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;

  --page-gutter: clamp(1rem, 2.5vw, 2rem);
  --header-h: 48px;

  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;

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