/* ===========================================
   VARIABLES.CSS - CSS Custom Properties
   =========================================== */

:root {
    /* Background colors */
    --bg: #000000;
    --bg-dim: #050505;
    --bg-muted: #0a0a0a;
    --bg-subtle: #111;

    /* Border/surface colors */
    --border-dim: #222;
    --border-muted: #333;
    --border-subtle: #444;
    --border-faint: #555;

    /* Foreground/text colors */
    --fg: #e7e7ea;
    --fg-dim: #889999;
    --fg-muted: #ccc;

    /* Neon accent colors */
    --wired-cyan: #00ffff;
    --wired-cyan-dim: rgba(0, 255, 255, 0.6);
    --wired-pink: #ff00ff;
    --wired-green: #00ff00;
    --wired-yellow: #ffff00;

    /* Typography */
    --f-mono: "IBM Plex Mono", monospace;
    --f-display: "VT323", monospace;
    --f-pixel: "Press Start 2P", cursive;

    /* Spacing */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 40px;

    /* Effects */
    --border-glow: 0 0 8px rgba(0, 255, 255, 0.4);
}