/* TornWarBot design tokens — single source of truth for every page.
   Loaded BEFORE the page's own stylesheet. Moved out of styles.css so
   faction-admin.html / admin.html stop carrying drifted copies. */

:root {
  --bg:       #0b0f14;  /* was #0d1117 — a step darker for deeper surface contrast */
  --card:     #161b22;
  --border:   #2b323b;  /* was #30363d — softened toward a hairline */
  --text:     #e6edf3;
  --muted:    #8b949e;
  --green:    #3fb950;
  --yellow:   #d29922;
  --red:      #f85149;
  --blue:     #58a6ff;
  --purple:   #bc8cff;
  --sidebar:  160px;
  --dash-font: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* Live numbers (timers, metrics, FF) use a true mono so digit width never
     jitters as values tick — tabular-nums fixes spacing, mono fixes width. */
  --mono: 'Geist Mono', 'Cascadia Code', 'Fira Code', ui-monospace, monospace;
  /* Directional combat colors (Binance trading up/down): damage/respect/score
     deltas. Distinct tokens from status green/red so the two meanings never collide. */
  --up:   #3fb950;
  --down: #f85149;
  /* Surface ladder (Linear): canvas → panel → elevated, with a tokenized
     hairline. Gives nested panels real depth instead of one flat tone. */
  --bg-elevated: #1c2230;
  --hairline:    rgba(255,255,255,.06);
  --shadow-card: 0 1px 3px rgba(0,0,0,.45), 0 6px 20px rgba(0,0,0,.28);
  /* Radius scale (Warp): tight on inner elements, softer on containers. */
  --r-xs: 4px; --r-sm: 6px; --r-md: 8px; --r-lg: 12px; --r-pill: 9999px;
  /* Type scale — the ONLY font sizes any page may use. 12px is the floor:
     nothing on the site renders smaller. Every component references these
     tokens (never raw px) so the whole site scales together on large
     screens via the breakpoint bumps below. */
  --fs-xs:   12px;  /* micro labels, uppercase table headers, tile captions */
  --fs-sm:   13px;  /* secondary/meta text: subs, dims, notes, badges */
  --fs-base: 14px;  /* body, table cells, list rows, inputs, buttons */
  --fs-lg:   16px;  /* emphasized rows, section sub-headings, big inputs */
  --fs-xl:   20px;  /* card titles, stat-tile values */
  --fs-2xl:  24px;  /* dashboard metric values */
  --fs-3xl:  28px;  /* page titles */
  --fs-4xl:  34px;  /* large display numbers */
  --fs-hero: 40px;  /* hero headings on standalone pages */
}

/* Large-screen type bumps — every token grows together, so component text
   scales with the monitor instead of only the body default (the old ladder
   bumped body only, which fixed-px components ignored). */
@media (min-width: 2000px) {
  :root { --fs-xs: 13px; --fs-sm: 14px; --fs-base: 15px; --fs-lg: 17px;
          --fs-xl: 21px; --fs-2xl: 26px; --fs-3xl: 30px; --fs-4xl: 36px; --fs-hero: 44px; }
}
@media (min-width: 3440px) {
  :root { --fs-xs: 14px; --fs-sm: 15px; --fs-base: 16px; --fs-lg: 18px;
          --fs-xl: 23px; --fs-2xl: 28px; --fs-3xl: 32px; --fs-4xl: 40px; --fs-hero: 48px; }
}
@media (min-width: 5120px) {
  :root { --fs-xs: 15px; --fs-sm: 17px; --fs-base: 18px; --fs-lg: 20px;
          --fs-xl: 25px; --fs-2xl: 32px; --fs-3xl: 36px; --fs-4xl: 44px; --fs-hero: 54px; }
}

/* Themes */
body.theme-orange { --blue: #f38a1d; --bg: #1a1510; --card: #241c16; --border: #3b2e24; }
body.theme-hacker { --blue: #00ff00; --bg: #051005; --card: #0a180a; --border: #153015; --text: #ccffcc; --muted: #669966; --green: #00ff00; }
body.theme-blurple { --blue: #5865F2; --bg: #1e1f22; --card: #2b2d31; --border: #3f4147; }
body.theme-light { --bg: #f6f8fa; --card: #ffffff; --border: #d0d7de; --text: #1f2328; --muted: #656d76; --blue: #0969da; --green: #1a7f37; --yellow: #9a6700; --red: #d1242f; --purple: #8250df; }
