:root{--color-primary:#8b5cf6;--color-primary-light:#a78bfa;--color-primary-dark:#7c3aed;--color-secondary:#06b6d4;--color-secondary-light:#22d3ee;--color-secondary-dark:#0891b2;--color-accent:#f59e0b;--color-accent-light:#fbbf24;--color-accent-dark:#d97706;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:#3b82f6;--color-surface:#0f172a;--color-surface-light:#1e293b;--color-surface-lighter:#334155;--color-text-primary:#f8fafc;--color-text-secondary:#cbd5e1;--color-text-muted:#64748b;--color-text-disabled:#475569;--bg-primary:var(--color-surface);--bg-secondary:var(--color-surface-light);--bg-tertiary:var(--color-surface-lighter);--bg-overlay:#ffffff14;--bg-overlay-light:#ffffff1f;--bg-overlay-dark:#0000004d;--border-color:#ffffff1a;--border-color-light:#ffffff26;--border-radius-sm:6px;--border-radius:8px;--border-radius-lg:12px;--border-radius-xl:16px;--border-radius-2xl:20px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-md:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-lg:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;--shadow-xl:0 25px 50px -12px #00000040;--shadow-glow:0 0 20px #8b5cf64d;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.35s cubic-bezier(.4, 0, .2, 1);--button-height:44px;--button-padding:.75rem 1.25rem;--button-min-width:100px}.gradient-primary{background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%)}.gradient-secondary{background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-primary) 100%)}.gradient-surface{background:linear-gradient(135deg, var(--color-surface) 0%, var(--color-surface-light) 100%)}.gradient-glow{background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 50%, var(--color-accent) 100%);background-size:200% 200%;animation:8s infinite gradientShift}.gradient-dark{background:linear-gradient(135deg,#0f172a 0%,#1e293b 50%,#334155 100%)}@keyframes gradientShift{0%,to{background-position:0%}50%{background-position:100%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes pulse-glow{0%,to{box-shadow:var(--shadow-glow)}50%{box-shadow:0 0 30px #8b5cf680}}.glass{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff14;border:1px solid #ffffff1a}.glass-light{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff1f;border:1px solid #ffffff26}.btn{justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--button-padding);border-radius:var(--border-radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-normal);min-height:var(--button-height);border:none;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.btn:before{content:"";width:100%;height:100%;transition:left var(--transition-slow);background:linear-gradient(90deg,#0000,#fff3,#0000);position:absolute;top:0;left:-100%}.btn:hover:before{left:100%}.btn-primary{background:var(--color-primary);color:#fff;box-shadow:var(--shadow-md)}.btn-primary:hover{background:var(--color-primary-dark);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn-secondary{background:var(--color-secondary);color:#fff;box-shadow:var(--shadow-md)}.btn-secondary:hover{background:var(--color-secondary-dark);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn-accent{background:var(--color-accent);color:#fff;box-shadow:var(--shadow-md)}.btn-accent:hover{background:var(--color-accent-dark);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn-outline{color:var(--color-text-primary);border:2px solid var(--border-color-light);background:0 0}.btn-outline:hover{background:var(--bg-overlay);border-color:var(--color-primary);transform:translateY(-2px)}.card{background:var(--bg-secondary);border-radius:var(--border-radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-md);transition:all var(--transition-normal)}.card:hover{box-shadow:var(--shadow-xl);border-color:var(--border-color-light);transform:translateY(-4px)}.card-glass{composes:glass;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md)}.input{background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--border-radius);color:var(--color-text-primary);font-size:var(--font-size-base);transition:all var(--transition-fast);padding:.75rem 1rem}.input:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #8b5cf61a}.input::placeholder{color:var(--color-text-muted)}*{box-sizing:border-box;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body,#app{background:var(--bg-primary);width:100vw;height:100vh;color:var(--text-primary);touch-action:none;overscroll-behavior:none;-webkit-overflow-scrolling:touch;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}
