/* Design tokens. Palette is lifted from the brand mark: near-black graphite,
   electric blue gradient, one white. Two status hues only: computable vs locked. */
:root {
  --bg: #04060b;
  --bg-raise: #070a11;
  --bg-panel: #090d16;
  --bg-inset: #0c111c;

  --line: #17202e;
  --line-soft: #121a26;
  --line-strong: #24314a;

  --blue-deep: #0b5cff;
  --blue: #1f8bff;
  --blue-hi: #6ae2ff;
  --blue-dim: rgba(31, 139, 255, .12);
  --blue-glow: rgba(31, 139, 255, .28);

  --mint: #3ddc97;
  --amber: #f2a93b;
  --hot: #ff6b5d;

  --ink: #eef4fd;
  --ink-2: #a3b4ca;
  --ink-3: #6b7d94;
  --ink-4: #47576b;

  --font-display: 'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;

  --shell: 1240px;
  --gut: clamp(18px, 4vw, 40px);

  --step--1: clamp(11px, .68rem + .1vw, 12.5px);
  --step-0: clamp(14px, .86rem + .15vw, 16px);
  --step-1: clamp(17px, 1rem + .35vw, 20px);
  --step-2: clamp(21px, 1.15rem + .8vw, 28px);
  --step-3: clamp(27px, 1.4rem + 1.6vw, 42px);
  --step-4: clamp(34px, 1.6rem + 3.4vw, 76px);

  --ease: cubic-bezier(.22, .61, .36, 1);
  --shadow: 0 30px 80px -30px rgba(0, 0, 0, .9);
  --cut: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
