:root {
    /* Color Palette & Ambient Accents */
    --bg-dark: #050816;
    --bg-surface: #0a0f29;
    --accent-blue: #3b82f6;
    --accent-blue-glow: rgba(59, 130, 246, 0.25);
    --accent-purple: #7c3aed;
    --accent-purple-glow: rgba(124, 58, 237, 0.25);
    --accent-cyan: #06b6d4;

    /* High-Fidelity Typography Colors */
    --text-primary: #f8fafc;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;

    /* Glassmorphism Specs */
    --glass-bg: rgba(15, 23, 42, 0.45);
    --glass-bg-hover: rgba(30, 41, 59, 0.6);
    --glass-border: rgba(255, 255, 255, 0.08);
    --glass-border-hover: rgba(59, 130, 246, 0.35);
    --glass-blur: blur(16px);
    --glass-blur-deep: blur(28px);

    /* Ambient Lighting Gradients */
    --radial-glow-1: radial-gradient(circle at 10% 10%, rgba(59, 130, 246, 0.12) 0%, transparent 40%);
    --radial-glow-2: radial-gradient(circle at 90% 80%, rgba(124, 58, 237, 0.12) 0%, transparent 40%);

    /* Depth & Structural Shadow Layering */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.35);
    --shadow-glass: 0 12px 40px -10px rgba(0, 0, 0, 0.5), inset 0 1px 0 0 rgba(255, 255, 255, 0.1);
    --shadow-glow: 0 0 35px -5px var(--accent-blue-glow);

    /* Layout & Geometry */
    --max-width: 1200px;
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;

    /* Transitions & Motion Dynamics */
    --ease-out-smooth: cubic-bezier(0.16, 1, 0.3, 1);
    --transition-fast: 0.2s var(--ease-out-smooth);
    --transition-main: 0.35s var(--ease-out-smooth);

    /* Typography Matrix */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
}