/**
 * FORGE DESIGN SYSTEM — Design Tokens
 * Version: 2.1
 * The Forge Command Center
 */

:root {
  /* ═══════════════════════════════════════════════════════
     FOUNDATION PALETTE (90% of all surface area)
     Four-tier obsidian scale from absolute dark to subtle gray
     ═══════════════════════════════════════════════════════ */
  --forge-void: #0A0A0B;
  --forge-obsidian: #141416;
  --forge-basalt: #1E1E22;
  --forge-slate: #2A2A30;

  /* ═══════════════════════════════════════════════════════
     ACCENT PALETTE (10% of all surface area)
     Fire/heat gradient: deep ember → molten orange → gold → amber
     ═══════════════════════════════════════════════════════ */
  --forge-ember: #FF4D00;
  --forge-molten: #FF7A00;
  --forge-gold: #FFB800;
  --forge-amber: #FFC94D;
  --forge-gold-light: #FFCC33;
  --forge-gold-muted: #B38600;

  /* ═══════════════════════════════════════════════════════
     STATUS INDICATORS (Stoplight Convention)
     ONLY for: badges, dots, verdict labels, status markers
     NEVER for: borders, backgrounds, message bubbles, decorative
     ═══════════════════════════════════════════════════════ */
  --status-pass: #2EA043;
  --status-flag: #F0B000;
  --status-block: #FF2D00;

  /* ═══════════════════════════════════════════════════════
     SEMANTIC COLORS
     ═══════════════════════════════════════════════════════ */
  --forge-heat-critical: #FF2D00;
  --forge-cool-smoke: #4A4A52;
  --forge-ash: #8A8A92;

  /* ═══════════════════════════════════════════════════════
     TEXT COLORS
     ═══════════════════════════════════════════════════════ */
  --text-primary: #F2F2F2;
  --text-secondary: #A0A0A0;
  --text-gold: #FFB347;
  --ghost: rgba(255, 255, 255, 0.3);

  /* ═══════════════════════════════════════════════════════
     GLOW EFFECTS
     Applied via box-shadow. Always rgba with accent colors.
     ═══════════════════════════════════════════════════════ */
  --forge-glow-ember: 0 0 20px rgba(255, 77, 0, 0.4);
  --forge-glow-gold: 0 0 20px rgba(255, 184, 0, 0.4);
  --forge-glow-molten: 0 0 30px rgba(255, 122, 0, 0.5);
  --glow-pass: 0 0 12px rgba(46, 160, 67, 0.5);
  --glow-warn: 0 0 12px rgba(240, 176, 0, 0.5);
  --glow-fail: 0 0 12px rgba(255, 45, 0, 0.5);

  /* ═══════════════════════════════════════════════════════
     HEAT GRADIENTS (progress bars, meters)
     ═══════════════════════════════════════════════════════ */
  --heat-low: linear-gradient(90deg, #2EA043, #1C1C1E);
  --heat-medium: linear-gradient(90deg, #F0B000, #FF4D00);
  --heat-high: linear-gradient(90deg, #FF4D00, #FF2D00);

  /* ═══════════════════════════════════════════════════════
     TYPOGRAPHY
     ═══════════════════════════════════════════════════════ */
  --font-display: 'Inter Tight', 'SF Pro Display', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-body: 'Inter', 'SF Pro Text', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;

  /* ═══════════════════════════════════════════════════════
     SPACING SCALE
     ═══════════════════════════════════════════════════════ */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  /* ═══════════════════════════════════════════════════════
     BORDER RADII
     ═══════════════════════════════════════════════════════ */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-superellipse: 22.37%;

  /* ═══════════════════════════════════════════════════════
     SHADOWS (Elevation System)
     ═══════════════════════════════════════════════════════ */
  --shadow-level-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-level-2: 0 4px 12px rgba(0, 0, 0, 0.6);
  --shadow-level-3: 0 8px 24px rgba(0, 0, 0, 0.7);

  /* ═══════════════════════════════════════════════════════
     ANIMATION EASINGS
     ═══════════════════════════════════════════════════════ */
  --ease-forge-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-forge-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-forge-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-forge-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ═══════════════════════════════════════════════════════
     TRANSITION DURATIONS
     ═══════════════════════════════════════════════════════ */
  --duration-micro: 100ms;
  --duration-fast: 150ms;
  --duration-normal: 200ms;
  --duration-slow: 300ms;
  --duration-modal: 350ms;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
