/* StrataWager Design Tokens — single source of truth */
:root {
  /* Brand surface */
  --sw-bg-primary: #0a0e17;
  --sw-bg-secondary: #111827;
  --sw-bg-card: #151d2e;
  --sw-bg-elevated: #1c2740;

  /* Brand ink */
  --sw-text-primary: #e8edf5;
  --sw-text-secondary: #8899b4;
  --sw-text-muted: #5a6a82;

  /* Accents */
  --sw-accent: #00d084;
  --sw-accent-hover: #00b872;
  --sw-accent-dim: rgba(0, 208, 132, 0.15);
  --sw-accent-blue: #3b82f6;

  /* State */
  --sw-positive: #00d084;
  --sw-negative: #ef4444;
  --sw-warning: #f59e0b;
  --sw-danger: #ef4444;

  /* Structure */
  --sw-border: #1e2a3a;
  --sw-border-subtle: #172030;
  --sw-radius-sm: 6px;
  --sw-radius: 10px;
  --sw-radius-lg: 16px;

  /* Shadow */
  --sw-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
  --sw-shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.4);

  /* Motion */
  --sw-transition: 0.2s ease;
  --sw-transition-fast: 0.12s ease-out;

  /* Layout */
  --sw-max-width: 1200px;
  --sw-nav-height: 72px;

  /* Typography */
  --sw-font-body: 'Barlow', system-ui, -apple-system, sans-serif;
  --sw-font-heading: 'Barlow Condensed', 'Barlow', sans-serif;
  --sw-font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* Spacing scale (4/8 system) */
  --sw-space-1: 4px;
  --sw-space-2: 8px;
  --sw-space-3: 12px;
  --sw-space-4: 16px;
  --sw-space-6: 24px;
  --sw-space-8: 32px;
  --sw-space-12: 48px;

  /* Z-index ladder */
  --sw-z-base: 1;
  --sw-z-sticky: 100;
  --sw-z-nav: 1000;
  --sw-z-modal: 2000;
  --sw-z-toast: 3000;

  /* Legacy aliases (kept so existing --bg-*, --text-*, --accent-* references keep working until migrated) */
  --bg-primary: var(--sw-bg-primary);
  --bg-secondary: var(--sw-bg-secondary);
  --bg-card: var(--sw-bg-card);
  --text-primary: var(--sw-text-primary);
  --text-secondary: var(--sw-text-secondary);
  --text-muted: var(--sw-text-muted);
  --accent: var(--sw-accent);
  --accent-hover: var(--sw-accent-hover);
  --accent-dim: var(--sw-accent-dim);
  --accent-green: var(--sw-accent);
  --accent-blue: var(--sw-accent-blue);
  --positive: var(--sw-positive);
  --negative: var(--sw-negative);
  --danger: var(--sw-danger);
  --border: var(--sw-border);
  --border-subtle: var(--sw-border-subtle);
  --radius: var(--sw-radius);
  --radius-sm: var(--sw-radius-sm);
  --radius-lg: var(--sw-radius-lg);
  --shadow: var(--sw-shadow);
  --shadow-lg: var(--sw-shadow-lg);
  --max-width: var(--sw-max-width);
  --nav-height: var(--sw-nav-height);
  --transition: var(--sw-transition);

  /* Legacy aliases — extended (dashboard vars not present in initial set) */
  --bg-elevated: #1e293b;
  --bg-card-hover: #1a2540;
  --accent-blue-dim: rgba(59, 130, 246, 0.15);
  --accent-gold: #fbbf24;
  --accent-gold-glow: rgba(251, 191, 36, 0.4);
  --accent-green-dim: rgba(0, 208, 132, 0.15);
  --accent-orange: #f97316;
  --accent-purple: #a855f7;
  --accent-red: #ff4757;
  --accent-red-dim: rgba(255, 71, 87, 0.15);
  --shadow-card: 0 4px 24px rgba(0,0,0,0.3), 0 1px 4px rgba(0,0,0,0.2);
  --shadow-glow-green: 0 0 20px rgba(0, 208, 132, 0.2);
  --shadow-glow-gold: 0 0 20px rgba(251, 191, 36, 0.15);
  --star-1: #6b7280;
  --star-2: #60a5fa;
  --star-3: #34d399;
  --star-4: #f59e0b;
  --star-5: #ef4444;
}
