/* 1. VARIABLES & RESET (CYBERPUNK INDIGO EDITION) */
:root {
    /* THE DEEP VOID */
    --bg-void: #020205;       /* Almost Pure Black (Base) */
    --bg-sidebar: #0a0b14;    /* Darkened Indigo */
    
    /* GLASS & ATMOSPHERE (#232551 based) */
    --bg-glass: rgba(35, 37, 81, 0.75); /* Your #232551 at 75% opacity */
    --bg-card: rgba(35, 37, 81, 0.4);   /* Your #232551 at 40% opacity */
    
    /* The "Light Source" Gradient */
    --gradient-body: radial-gradient(circle at 50% -20%, #232551 0%, #020205 80%);
    
    /* HIGH VOLTAGE NEON */
    --neon-cyan: #00f0ff;    /* Cyberpunk Cyan */
    --neon-blue: #2d5bf0;    /* Electric Blue */
    --neon-purple: #bc13fe;  /* Neon Purple */
    --neon-pink: #ff003c;    /* Cyberpunk Red/Pink */
    --neon-green: #00ff9f;   /* Matrix Green */
    --neon-orange: #ff9e00;
    
    --text-primary: #ffffff;
    --text-secondary: #94a3b8;
    
    --border-subtle: 1px solid rgba(80, 90, 140, 0.2);
    --border-glow: 1px solid rgba(0, 240, 255, 0.4);
}

* { box-sizing: border-box; }

body {
    margin: 0;
    background-color: var(--bg-void);
    background-image: var(--gradient-body);
    color: var(--text-primary);
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    height: 100vh;
    overflow: hidden;
}

/* Luxury Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(35, 37, 81, 0.8); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--neon-cyan); }