/* Justice Cipher: Design System Variables */
:root {
  /* === Color Palette === */
  --color-void:        #000000;
  --color-abyss:       #040810;
  --color-deep:        #080f1a;
  --color-surface:     #0d1626;
  --color-card:        #0a1220;
  --color-border:      #1a2a40;

  /* Justice Gold */
  --color-justice:     #c8a84b;
  --color-justice-dim: #7a621c;
  --color-justice-glow:rgba(200, 168, 75, 0.25);

  /* Cipher Cyan */
  --color-cipher:      #00e5ff;
  --color-cipher-dim:  #008fa8;
  --color-cipher-glow: rgba(0, 229, 255, 0.20);

  /* Alert Red */
  --color-alert:       #ff3c3c;
  --color-alert-dim:   #8b0000;
  --color-alert-glow:  rgba(255, 60, 60, 0.20);

  /* Matrix Green */
  --color-matrix:      #00ff41;
  --color-matrix-dim:  #007a1f;

  /* Text */
  --color-text-primary:   #e8f4f8;
  --color-text-secondary: #7a9ab5;
  --color-text-muted:     #3a5a75;
  --color-text-code:      #00e5ff;

  /* === Typography === */
  --font-mono:   'Share Tech Mono', 'Courier New', monospace;
  --font-display:'Bebas Neue', 'Impact', sans-serif;
  --font-body:   'Rajdhani', 'Arial', sans-serif;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  2rem;
  --text-3xl:  3rem;
  --text-4xl:  4.5rem;
  --text-5xl:  7rem;

  /* === Spacing === */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* === Effects === */
  --glow-justice: 0 0 8px var(--color-justice), 0 0 24px var(--color-justice-glow);
  --glow-cipher:  0 0 8px var(--color-cipher),  0 0 24px var(--color-cipher-glow);
  --glow-alert:   0 0 8px var(--color-alert),   0 0 24px var(--color-alert-glow);
  --glow-matrix:  0 0 6px var(--color-matrix);

  --border-card:  1px solid var(--color-border);
  --radius-sm:    2px;
  --radius-md:    4px;
  --radius-lg:    8px;

  /* === Transitions === */
  --transition-fast:   150ms ease;
  --transition-base:   300ms ease;
  --transition-slow:   600ms ease;
  --transition-glitch: 50ms steps(1);

  /* === Z-index === */
  --z-bg:     -1;
  --z-base:    1;
  --z-card:    10;
  --z-nav:     100;
  --z-overlay: 200;
  --z-modal:   300;
}