/*
 * StarKraftika — Shared CSS Custom Properties
 * Single source of truth for all design tokens.
 * Linked from every page; inline <style> blocks reference these vars.
 */
:root {
  /* ── Core palette ───────────────────────────────────── */
  --bg:      #050810;
  --panel:   #0b1220;
  --border:  #1a2a4a;

  --accent:  #00d4ff;   /* cyan — primary interactive */
  --accent2: #ff6b00;   /* orange — secondary / highlights */

  --text:    #e8eaf0;   /* body copy */
  --muted:   #7a95b5;   /* secondary text — #607590 failed WCAG AA (3.7:1); #7a95b5 passes at ~6.5:1 */
  --muted2:  #6a80a0;   /* tertiary / captions — passes WCAG AA at ~5.2:1 */

  /* ── Race colours ───────────────────────────────────── */
  --zerg:    #8b2fc9;
  --terran:  #1a8cff;
  --protoss: #ffd700;

  /* ── Blog tag backgrounds ───────────────────────────── */
  --tag-recap:    rgba(0,212,255,0.12);
  --tag-strategy: rgba(255,107,0,0.12);

  /* ── Spacing scale ──────────────────────────────────── */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;

  /* Reading width: running text stops here, about 75 characters of 16px Exo 2 a line; figures and tables may be wider.
     (rem, not ch: Exo 2's zero is wider than its average letter, so 68ch came out at ~86 characters.) */
  --measure: 36rem;

  /* ── Type scale ─────────────────────────────────────
     Every text size below heading level is one of these four. Headings keep their own sizes.
     Nothing on the site is smaller than --fs-label, and phones never get smaller reading text than desktop. */
  --fs-label: 0.8125rem; /* 13px   short monospace labels, tags, badges, eyebrows */
  --fs-small: 0.9rem;    /* 14.4px metadata, captions, nav and footer links, secondary notes */
  --fs-body:  1rem;      /* 16px   every paragraph, description, excerpt, bio and chat message */
  --fs-lead:  1.125rem;  /* 18px   intros and subtitles */

  /* Zerg purple fails contrast as text on --bg (3.2:1); this tint passes (6:1). */
  --zerg-text: #b07ef0;
}
