/* WeSpark design tokens: the ONLY place colors and fonts are defined.
   Source: wespark.io/brand (Yellow Spark, Golden Goal, Sandbox Clay, Deep Black, Calm Grey, Clear White). */
:root{
  /* Brand colors */
  --yellow: #FCD307;      /* Yellow Spark */
  --gold: #FFBC00;        /* Golden Goal */
  --clay: #E7DCB9;        /* Sandbox Clay */
  --ink: #000000;         /* Deep Black */
  --grey: #E2E2E2;        /* Calm Grey */
  --white: #FFFFFF;       /* Clear White */

  /* Derived surfaces (tints of the brand colors) */
  --paper: #FFFCF2;       /* warm page background */
  --paper-2: #F6F0DC;     /* light clay tint */
  --ink-2: #1A1A1A;       /* soft black for dark sections */
  --ink-3: #4A4A4A;       /* secondary text */
  --ink-4: #767676;       /* muted text (AA on paper) */
  --line: #000000;        /* outlines */
  --good: #1F9D55;        /* used only in result charts */

  /* Footer (drives the EKY credit colors) */
  --footer-bg: #000000;
  --footer-fg: #FFFFFF;

  /* Type */
  --font-display: "Bricolage Grotesque", "Arial Black", system-ui, sans-serif;
  --font-body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* Shape */
  --radius: 18px;
  --radius-sm: 10px;
  --border: 2px solid var(--line);
  --shadow: 5px 5px 0 var(--ink);
  --shadow-sm: 3px 3px 0 var(--ink);
  --wrap: 1180px;
}