:root {
    /* Colors - Modern Dark Theme */
    --primary-color: #6366f1;
    --primary-light: #818cf8;
    --secondary-color: #a855f7;
    --accent-cyan: #06b6d4;
    --accent-emerald: #10b981;
    --accent-amber: #f59e0b;
    --accent-rose: #f43f5e;

    /* Backgrounds - Deeper, richer tones */
    --bg-base: #09090b;
    --bg-elevated: #18181b;
    --bg-surface: #27272a;
    --bg-card: #1f1f23;

    /* Text */
    --text-color: #fafafa;
    --text-secondary: #a1a1aa;
    --text-muted: #71717a;

    /* Borders */
    --border-color: #3f3f46;
    --border-subtle: #27272a;

    /* Glassmorphism */
    --glass-bg: rgba(24, 24, 27, 0.8);
    --glass-bg-light: rgba(39, 39, 42, 0.6);
    --glass-border: rgba(63, 63, 70, 0.5);
    --glass-blur: blur(16px);

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.6);

    /* Transitions */
    --transition-fast: 0.1s ease;
    --transition-normal: 0.2s ease;
    --transition-slow: 0.3s ease;

    /* Gradients */
    --primary-gradient: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    --surface-gradient: linear-gradient(180deg, var(--bg-surface) 0%, var(--bg-elevated) 100%);

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;
}

/* Base Reset */
* {
    box-sizing: border-box;
}

body {
    min-height: 100vh;
    margin: 0;
    background: var(--bg-base);
    color: var(--text-color);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Utility Classes */
.glass {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
}

.text-gradient {
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.fade-in {
    animation: fadeIn var(--transition-normal);
}

.slide-up {
    animation: slideUp var(--transition-slow);
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

/* Selection */
::selection {
    background: rgba(99, 102, 241, 0.4);
    color: #fff;
}