/* ============================================================================
   cheatcode design system — TOKENS
   "Marathon-influenced instrument grid": black ground, drawn hairline cells,
   uppercase-mono chrome + heavy-display statements, lime as the restrained punch.
   Rule: a new colour must earn a new JOB or it doesn't ship. Lime always leads.
   Source of truth — consumed by the Cloudflare landing (site/), the Next.js dapp
   (app/, via Tailwind theme), the gated docs, and external tools.
   ============================================================================ */
:root {
  /* ── ground + ink (the overwhelming majority of every surface) ── */
  --ground:      #0a0c08;   /* warm near-black — the field */
  --ground-rise: #0e110c;   /* a panel lifted off the field */
  --ink:         #eef2ea;   /* primary text / white-mono     · ~17:1 on ground */
  --ink-dim:     #9aa48c;   /* labels, secondary mono        · ~7:1  (was #899281 ~5.9) */
  --ink-faint:   #7c8470;   /* ticks, part-codes, metadata   · ~4.8:1 (was #49513f ~2.4 — failed) */

  /* hairline grid — the rules that DRAW the layout (the structural signature) */
  --line:   #1b2016;        /* default cell border */
  --line-up:#2a3120;        /* emphasised / hover border */

  /* ── brand hues (raw — reference only; use the SEMANTIC roles below) ── */
  --lime: #c0f73e;
  --mint: #54f0cf;
  --pink: #ff5da2;

  /* ── SEMANTIC ROLES — every UI colour decision references one of these ──
     (new colour = new job; if a need isn't here, it doesn't get a colour) */
  --primary: var(--lime);   /* brand · active · hover · CTA — the ~5-10% punch */
  --up:      var(--lime);   /* bull / positive regime (semantic, not decoration) */
  --venue:   var(--mint);   /* the Hyperliquid layer · live · venue-neutral */
  --down:    var(--pink);   /* bear / negative regime */
  --alert:   var(--pink);   /* alert state · editorial pop */
  --on-accent: #0a0c08;     /* text/ink ON a lime/mint/pink fill */

  --primary-glow: rgba(192, 247, 62, .42);
  --venue-glow:   rgba(84, 240, 207, .38);

  /* ── type: two registers only ── */
  --font-display: "Geist", system-ui, -apple-system, sans-serif;       /* statements */
  --font-mono:    "Geist Mono", ui-monospace, "SF Mono", monospace;    /* chrome / data */
  --tracking-mono: .14em;   /* tracked-out uppercase chrome */
  --tracking-tight: -.04em; /* tight heavy display */

  /* ── spacing scale ── */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-6: 24px; --sp-8: 32px; --sp-12: 48px; --sp-16: 64px; --sp-24: 96px;

  /* ── grid mechanics ── */
  --hair: 1px;        /* rule weight — hairline, always */
  --cell-pad: 20px;
  --tick: 9px;        /* registration corner-bracket length */

  /* full-bleed layout: the drawn grid spans the viewport; content padded in from the edges.
     --edge = the breathing room from the viewport edge; --bleed-cap = the sane ultrawide ceiling
     (so the grid doesn't sprawl to 2560px). The GRID/hairlines fill the bleed; TEXT zones are
     capped with --measure for readability. */
  --edge: clamp(20px, 4vw, 84px);
  --bleed-cap: 2100px;
  --measure: 680px;     /* readable text-zone cap inside a full-width cell */
  --measure-sm: 460px;
}