/* css/font.css */
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&family=Space+Mono:wght@400;700&family=Pixelify+Sans:wght@400;500;600;700&display=swap');

:root {
  --font-pixel: 'Press Start 2P', monospace;
  --font-pixel-alt: 'Pixelify Sans', 'Press Start 2P', monospace;
  --font-mono: 'Space Mono', 'VT323', monospace;
  --font-ui: 'VT323', 'Space Mono', monospace;
  
  /* Onyx Hollow Theme */
  --bg-void: #000000;
  --bg-surface: rgba(10, 10, 10, 0.85);
  --bg-elevated: rgba(20, 20, 20, 0.9);
  --border-hollow: rgba(255, 255, 255, 0.15);
  --border-active: rgba(255, 215, 0, 0.5);
  --text-primary: #FFFFFF;
  --text-secondary: rgba(255, 255, 255, 0.6);
  --text-dim: rgba(255, 255, 255, 0.3);
  --accent-gold: #FFD700;
  --accent-amber: #FFB300;
  --accent-bright: #FFEA00;
  --danger: #FF4444;
  --danger-bg: rgba(255, 68, 68, 0.1);
  --success: #00E676;
  --info: #448AFF;
  --hollow-glow: 0 0 20px rgba(255, 215, 0, 0.1);
  --hollow-shadow: 0 4px 24px rgba(0, 0, 0, 0.6);
}

.theme-smooth-white {
  --bg-void: #FAFAFA;
  --bg-surface: rgba(255, 255, 255, 0.9);
  --bg-elevated: rgba(245, 245, 245, 0.95);
  --border-hollow: rgba(0, 0, 0, 0.1);
  --border-active: rgba(124, 77, 255, 0.5);
  --text-primary: #1A1A1A;
  --text-secondary: rgba(0, 0, 0, 0.55);
  --text-dim: rgba(0, 0, 0, 0.3);
  --accent-gold: #7C4DFF;
  --accent-amber: #651FFF;
  --accent-bright: #B388FF;
  --hollow-glow: 0 0 20px rgba(124, 77, 255, 0.08);
  --hollow-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

body {
  font-family: var(--font-ui);
  background: var(--bg-void);
  color: var(--text-primary);
  margin: 0;
  padding: 0;
  min-height: 100vh;
  -webkit-font-smoothing: none;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  transition: background-color 0.3s steps(2), color 0.3s steps(2);
}

* {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  box-sizing: border-box;
}