/* ============================================
   Antigravity System — Design System
   Premium Dark Theme with Glassmorphism
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&family=Outfit:wght@300;400;500;600;700;800&display=swap');

/* ============================================
   1. Design Tokens
   ============================================ */
:root {
    /* ---- Stable Tokens (Unchanging) ---- */
    --primary-50:#ededff;--primary-100:#d4d2ff;--primary-200:#ada9ff;--primary-300:#8580ff;
    --primary-400:#6C63FF;--primary-500:#5a51f0;--primary-600:#4840d9;--primary-700:#3931b3;
    --primary-800:#2c258d;--primary-900:#1f1a66;
    --accent-400:#00D4FF;--accent-500:#00b8e0;--accent-600:#0099bd;
    --violet-400:#7C3AED;--violet-500:#6D28D9;--violet-600:#5B21B6;
    --rose-400:#FB7185;--rose-500:#F43F5E;
    --success-400:#34D399;--success-500:#10B981;--success-600:#059669;
    --warning-400:#FBBF24;--warning-500:#F59E0B;--warning-600:#D97706;
    --danger-400:#F87171;--danger-500:#EF4444;--danger-600:#DC2626;
    --info-400:#60A5FA;--info-500:#3B82F6;--info-600:#2563EB;
    
    --font-sans:'Inter','SF Pro Display',-apple-system,BlinkMacSystemFont,sans-serif;
    --font-display:'Inter','SF Pro Display',sans-serif;
    --font-mono:'JetBrains Mono','Fira Code',monospace;
    --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;
    --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;
    --radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:24px;--radius-full:9999px;
    --transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-base:250ms cubic-bezier(0.4,0,0.2,1);    --transition-slow:400ms cubic-bezier(0.4,0,0.2,1);--transition-spring:500ms cubic-bezier(0.34,1.56,0.64,1);
    --container-max:1280px;--container-wide:1440px;--nav-height:72px;--sidebar-width:280px;
}

/* ---- Dark Theme (Default) ---- */
[data-theme="dark"], :root {
    --bg-primary:#0F172A;--bg-secondary:#1E293B;--bg-tertiary:#334155;
    --surface-1:#1F2937;--surface-2:#374151;--surface-3:#4B5563;--surface-4:#6B7280;--surface-hover:#374151;
    --glass-bg:rgba(31,41,55,0.85);--glass-border:rgba(255,255,255,0.05);--glass-blur:blur(16px);--glass-shadow:0 4px 6px -1px rgba(0,0,0,0.3);
    --text-primary:#E5E7EB;--text-secondary:#9CA3AF;--text-tertiary:#6B7280;--text-muted:#4B5563;
    --text-link:#818CF8;--text-link-hover:#6366F1;
    --border-subtle:#374151;--border-default:#4B5563;--border-strong:#6B7280;--border-primary:#4F46E5;
    --shadow-sm:0 1px 2px 0 rgba(0,0,0,0.15);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.2);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.3);
    --shadow-xl:0 20px 25px -5px rgba(0,0,0,0.35);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,0.45);
    --shadow-glow:0 0 20px rgba(79,70,229,0.15);
    --primary-400:#818CF8;--primary-500:#6366F1;--primary-600:#4F46E5;
    color-scheme: dark;
}

/* ---- Light Theme ---- */
[data-theme="light"] {
    --bg-primary:#F8F9FB;--bg-secondary:#F3F4F6;--bg-tertiary:#E5E7EB;
    --surface-1:#FFFFFF;--surface-2:#F9FAFB;--surface-3:#F3F4F6;--surface-4:#E5E7EB;--surface-hover:#F9FAFB;
    --glass-bg:rgba(255,255,255,0.9);--glass-border:rgba(0,0,0,0.05);--glass-blur:blur(16px);--glass-shadow:0 4px 6px -1px rgba(0,0,0,0.05);
    --text-primary:#1A1A1A;--text-secondary:#4B5563;--text-tertiary:#6B7280;--text-muted:#9CA3AF;
    --text-link:#4F46E5;--text-link-hover:#4338CA;
    --border-subtle:#F3F4F6;--border-default:#E5E7EB;--border-strong:#D1D5DB;--border-primary:#818CF8;
    --shadow-sm:0 1px 2px 0 rgba(0,0,0,0.03);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.08);
    --shadow-xl:0 20px 25px -5px rgba(0,0,0,0.1);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,0.15);
    --shadow-glow:0 0 20px rgba(79,70,229,0.1);
    --primary-400:#4F46E5;--primary-500:#4338CA;--primary-600:#3730A3;
    color-scheme: light;
}

/* ============================================
   2. Reset & Base
   ============================================ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* ---- Theme Toggle Button ---- */
.theme-toggle{width:40px;height:40px;border-radius:var(--radius-md);background:var(--surface-2);border:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-tertiary);transition:all var(--transition-base);padding:0}
.theme-toggle:hover{background:var(--surface-3);color:var(--primary-400);transform:translateY(-2px)}
.theme-toggle svg{width:20px;height:20px}
[data-theme="light"] .sun-icon{display:none}
[data-theme="dark"] .moon-icon{display:none}

/* ---- Typography ---- */
body{font-family:var(--font-sans);font-size:var(--text-base);line-height:1.75;color:var(--text-secondary);background:var(--bg-primary);min-height:100vh;overflow-x:hidden;transition:background-color 0.4s ease, color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease}
body::before{content:'';position:fixed;inset:-25%;width:150%;height:150%;background:radial-gradient(circle at 20% 30%, rgba(108,99,255,0.12) 0%, transparent 40%),radial-gradient(circle at 80% 70%, rgba(0,212,255,0.1) 0%, transparent 40%),radial-gradient(circle at 50% 100%, rgba(251,113,133,0.08) 0%, transparent 40%);pointer-events:none;z-index:0;animation:bg-drift 20s ease-in-out infinite alternate}
body>*{position:relative;z-index:1}
a{color:var(--text-link);text-decoration:none;transition:color var(--transition-fast)}
a:hover{color:var(--text-link-hover)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
::selection{background:rgba(108,99,255,0.3);color:#fff}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--bg-secondary)}
::-webkit-scrollbar-thumb{background:var(--surface-4);border-radius:var(--radius-full)}
::-webkit-scrollbar-thumb:hover{background:var(--primary-400)}