:root {
    /* === BACKGROUNDS === */
    --bg-primary:     #0a0a0a;
    --bg-secondary:   #111111;
    --bg-tertiary:    #1a1a1a;
    --bg-elevated:    #222222;

    /* === TEXT === */
    --text-primary:   #f0f0f0;
    --text-secondary: #999999;
    --text-tertiary:  #666666;
    --text-muted:     #444444;

    /* === ACCENT: sharp teal — used sparingly === */
    --accent:         #00d4aa;
    --accent-dim:     #00a88a;
    --accent-glow:    rgba(0, 212, 170, 0.12);
    --accent-subtle:  rgba(0, 212, 170, 0.06);

    /* === FUNCTIONAL === */
    --border-color:   #1e1e1e;
    --border-subtle:  #151515;
    --success:        #00d4aa;
    --error:          #ff4444;
    --error-dim:      rgba(255, 68, 68, 0.1);
    --warning:        #ffaa00;

    /* === TYPOGRAPHY === */
    --font-display:   'Space Grotesk', system-ui, -apple-system, sans-serif;
    --font-body:      'Inter', system-ui, -apple-system, sans-serif;
    --font-mono:      'JetBrains Mono', 'SF Mono', 'Cascadia Code', 'Consolas', monospace;

    /* Type scale (1.25 ratio) */
    --text-xs:    0.75rem;
    --text-sm:    0.875rem;
    --text-base:  1rem;
    --text-lg:    1.125rem;
    --text-xl:    1.25rem;
    --text-2xl:   1.5rem;
    --text-3xl:   1.875rem;
    --text-4xl:   2.25rem;
    --text-5xl:   3rem;
    --text-6xl:   3.75rem;
    --text-7xl:   4.5rem;

    /* === SPACING (4px base) === */
    --space-1:  0.25rem;
    --space-2:  0.5rem;
    --space-3:  0.75rem;
    --space-4:  1rem;
    --space-5:  1.25rem;
    --space-6:  1.5rem;
    --space-8:  2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;

    /* === LAYOUT === */
    --container-max:    1200px;
    --container-narrow: 800px;
    --container-wide:   1400px;

    /* === BORDERS === */
    --radius-sm: 2px;
    --radius-md: 4px;
    --radius-lg: 8px;

    /* === TRANSITIONS === */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 400ms ease;

    /* === Z-INDEX === */
    --z-dropdown: 100;
    --z-sticky:   200;
    --z-modal:    300;
    --z-toast:    400;
}