/* ═══════════════════════════════════════════════════════
   DESIGN TOKENS — the single source of truth for brand-level
   values shared by the homepage (styles.css) and every project
   page (project.css). Link this BEFORE either of those files:

     <link rel="stylesheet" href="…/assets/css/tokens.css">
     <link rel="stylesheet" href="…/assets/css/styles.css">   (or project.css)

   Page-specific tokens (homepage tray geometry, project-page
   surface/semantic colors) still live in their own stylesheet.

   NOTE: the sport colors below are ALSO mirrored as literal RGB
   strings in assets/js/app.js (ACCENT map) and assets/js/boot.js
   (GREEN) — canvas code can't read CSS custom properties, so those
   copies must be kept in sync with this file by hand.
═══════════════════════════════════════════════════════ */
:root{
  /* surface */
  --bg:#06080c;

  /* brand / primary — the site's signature green (site chrome, boot
     screen, brand mark). Decoupled from --football: edit here to reskin
     the brand without moving the football sport accent. */
  --primary:0,214,100;

  /* sport accents (raw r,g,b for rgba() composition) */
  --baseball:45,170,255;
  --football:155,245,49;   /* football sport accent — decoupled from --primary */
  --hockey: 209,71,255;
  --basketball:255,107,26;

  /* type */
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --disp:'Schibsted Grotesk',system-ui,sans-serif;
  --spg:'Space Grotesk',system-ui,sans-serif;
}