/* GENERATED FILE — do not edit by hand.
   Source: tokens/tokens.json
   Rebuild: npm run tokens   (or: node scripts/build-tokens.js) */

:root{
  /* color */
  --void: #0a0716;   /* Darkest background, text on light buttons */
  --deep: #1c1033;   /* Sky, page glow, platform base, HUD pill */
  --nebula: #4b2e83;   /* Ground platforms, overlay glow */
  --amethyst: #8b5cf6;   /* Borders, outlines, platform edges */
  --magenta: #c084fc;   /* Floating platforms, shards, title */
  --mist: #cbb9ee;   /* Secondary text, key caps */
  --star: #f3ecff;   /* Primary text, stars, highlights */
  --cyan: #5eead4;   /* Button text and border, accents, +1 popups */

  /* font */
  --font-display: 'Orbitron', sans-serif;   /* Titles, buttons, in-game popups */
  --font-body: 'Space Mono', monospace;   /* Body copy, HUD, key caps */

  /* page */
  --page-bg: radial-gradient(ellipse at 50% 20%, var(--deep) 0%, var(--void) 70%);   /* The page behind the game frame */

  /* frame */
  --frame-width: min(96vw, 960px);   /* Width of the game frame */
  --frame-bg: var(--void);   /* Only visible before the canvas paints */
  --frame-radius: 13px;   /* Frame corner rounding */
  --frame-border-width: 1px;   /* Frame border thickness */
  --frame-border-color: var(--cyan);   /* Frame border color */
  --frame-shadow:
    0 0 60px color-mix(in srgb, var(--amethyst) 25%, transparent),
    0 0 140px color-mix(in srgb, var(--nebula) 35%, transparent) inset;   /* Outer glow, then inner glow */

  /* button */
  --button-border-width: 1px;   /* Button border thickness (corner sprites sit on top of it) */
}
