/* ============================================================
   DESIGN TOKENS — the single source of truth for colour + type.
   Broadcast / tactical-blueprint direction: near-black, violet
   action colour, cyan blueprint lines, amber for goals & trophies.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root {
  /* surfaces */
  --bg:        #070811;
  --bg-soft:   #0B0D18;
  --panel:     #10131F;
  --panel-2:   #161A2A;
  --line:      #262B40;
  --line-soft: #1A1E2E;

  /* brand + signal colours */
  --violet:        #7C5CFF;
  --violet-bright: #9D86FF;
  --cyan:          #36E0C8;   /* blueprint lines / data accents */
  --amber:         #FFB23D;   /* goals, trophies, qualification */
  --coral:         #FF5C72;   /* loss / forward */
  --sky:           #4D9BF6;   /* defender */
  --mint:          #2FD49B;   /* win / midfield */

  /* text */
  --text:  #EAEDF7;
  --muted: #888EA8;
  --dim:   #565C78;

  /* type */
  --display: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --mono: 'Space Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --radius: 10px;
  --radius-lg: 14px;
}