/* ===========================================================
   Race SMART — Design Tokens  (v2.1 · Velocity)
   Import this file, then map your site's variables to --rs-*.
   Accent usage ratio: Carbon ~70% / neutrals ~22% / Pulse ~6% / Hot ~2%
   =========================================================== */
:root{
  /* Color — core ramp */
  --rs-carbon:#0B0F14;      /* base background           */
  --rs-graphite:#12171D;    /* surface / card            */
  --rs-graphite-2:#171D25;  /* raised surface            */
  --rs-steel:#283039;       /* hairlines on dark         */
  --rs-line:#212932;        /* borders / dividers        */
  --rs-mist:#8E9BA7;        /* muted text                */
  --rs-mist-2:#5A6671;      /* faint text / captions     */
  --rs-chalk:#EEF3F6;       /* primary text / reversal   */
  --rs-pulse:#C6FF3D;       /* brand accent (lime)       */
  --rs-pulse-deep:#9CCF1C;  /* accent hover / mid bar    */
  --rs-hot:#FF5A2C;         /* LIVE / record / alert ONLY*/

  /* Color — semantic aliases (prefer these in components) */
  --rs-bg:var(--rs-carbon);
  --rs-surface:var(--rs-graphite);
  --rs-surface-raised:var(--rs-graphite-2);
  --rs-border:var(--rs-line);
  --rs-text:var(--rs-chalk);
  --rs-text-muted:var(--rs-mist);
  --rs-text-faint:var(--rs-mist-2);
  --rs-accent:var(--rs-pulse);
  --rs-accent-hover:var(--rs-pulse-deep);
  --rs-on-accent:var(--rs-carbon);   /* text/icons on a lime fill */
  --rs-alert:var(--rs-hot);          /* never use as decoration   */

  /* Typography — families */
  --rs-font-display:"Saira Condensed","Arial Narrow",sans-serif;
  --rs-font-sans:"Saira",system-ui,-apple-system,sans-serif;
  --rs-font-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",monospace;

  /* Typography — weights */
  --rs-w-light:300; --rs-w-regular:400; --rs-w-medium:500;
  --rs-w-semibold:600; --rs-w-bold:700; --rs-w-extrabold:800; --rs-w-black:900;

  /* Typography — type scale */
  --rs-text-display:clamp(2.5rem,5vw,4rem);
  --rs-text-h1:clamp(2rem,4vw,2.875rem);
  --rs-text-h2:clamp(1.6rem,3vw,2.25rem);
  --rs-text-h3:1.375rem;
  --rs-text-body:1rem;
  --rs-text-small:0.8125rem;
  --rs-text-label:0.6875rem;

  /* Typography — tracking + leading */
  --rs-track-display:-0.01em;
  --rs-track-wordmark:0.02em;
  --rs-track-race:0.16em;     /* the tracked "RACE" treatment */
  --rs-track-label:0.18em;    /* mono labels, uppercase       */
  --rs-leading-tight:1.02;
  --rs-leading-body:1.6;

  /* Radius / effects / motion */
  --rs-radius-sm:8px; --rs-radius:14px; --rs-radius-lg:16px; --rs-radius-pill:999px;
  --rs-glow:0 0 22px rgba(198,255,61,.22);
  --rs-ease:cubic-bezier(.2,.7,.2,1);
}

/* ---- Optional starter rules (delete if you map tokens yourself) ---- */
/* Headings: condensed, uppercase, tight. */
.rs-display{font-family:var(--rs-font-display);font-weight:var(--rs-w-black);
  font-size:var(--rs-text-display);line-height:var(--rs-leading-tight);
  letter-spacing:var(--rs-track-display);text-transform:uppercase;color:var(--rs-text);}
/* Body copy. */
.rs-body{font-family:var(--rs-font-sans);font-weight:var(--rs-w-light);
  font-size:var(--rs-text-body);line-height:var(--rs-leading-body);color:var(--rs-text);}
/* Mono labels / data readouts. */
.rs-label{font-family:var(--rs-font-mono);font-weight:var(--rs-w-medium);
  font-size:var(--rs-text-label);letter-spacing:var(--rs-track-label);
  text-transform:uppercase;color:var(--rs-accent);}
/* Primary button. */
.rs-btn{font-family:var(--rs-font-display);font-weight:var(--rs-w-bold);
  text-transform:uppercase;letter-spacing:.04em;background:var(--rs-accent);
  color:var(--rs-on-accent);border:0;border-radius:var(--rs-radius-pill);
  padding:.7em 1.4em;cursor:pointer;transition:background .25s var(--rs-ease);}
.rs-btn:hover{background:var(--rs-accent-hover);}
/* Card. */
.rs-card{background:var(--rs-surface);border:1px solid var(--rs-border);
  border-radius:var(--rs-radius-lg);}