@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --color-bg-primary: #0a0c10;
  --color-bg-secondary: #111520;
  --color-bg-panel: #1a1f2e;
  --color-bg-panel-hover: #232a3d;
  --color-bg-panel-active: #2a3350;
  --color-bg-surface: #0f1218;

  --color-danger: #e63946;
  --color-danger-dark: #b82d38;
  --color-danger-glow: rgba(230, 57, 70, 0.4);
  --color-danger-soft: rgba(230, 57, 70, 0.15);

  --color-warning: #f4a261;
  --color-warning-dark: #c47f3e;
  --color-warning-glow: rgba(244, 162, 97, 0.4);

  --color-success: #2a9d8f;
  --color-success-dark: #1f7a6f;
  --color-success-glow: rgba(42, 157, 143, 0.4);

  --color-wire-blue: #4a90d9;
  --color-wire-blue-bg: rgba(74, 144, 217, 0.15);
  --color-wire-red: #e63946;
  --color-wire-red-bg: rgba(230, 57, 70, 0.15);
  --color-wire-yellow: #f2cc0c;
  --color-wire-yellow-bg: rgba(242, 204, 12, 0.15);

  --color-text-primary: #e8e6e3;
  --color-text-secondary: #8b95a8;
  --color-text-muted: #5a6478;
  --color-text-accent: #f4a261;
  --color-text-bright: #ffffff;

  --color-border: #2d3548;
  --color-border-light: #3a4560;
  --color-border-active: #4a90d9;

  --color-captain: #e63946;
  --color-alpha: #4a90d9;
  --color-bravo: #f4a261;
  --color-charlie: #2a9d8f;
  --color-delta: #9b5de5;

  --font-display: 'Rajdhani', 'Barlow Condensed', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-round: 50%;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-glow-danger: 0 0 20px var(--color-danger-glow);
  --shadow-glow-success: 0 0 20px var(--color-success-glow);
  --shadow-glow-warning: 0 0 20px var(--color-warning-glow);
  --shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.3);

  --z-base: 1;
  --z-hand: 10;
  --z-board: 20;
  --z-modal: 100;
  --z-pass-device: 200;
  --z-notification: 300;

  --transition-fast: 150ms ease;
  --transition-med: 300ms ease;
  --transition-slow: 500ms ease;
}