*{box-sizing:border-box;padding:0;margin:0}:root{--primary:#3b82f6;--secondary:#8b5cf6;--danger:#ef4444;--success:#10b981;--warning:#f59e0b;--background:#0f172a;--surface:#1e293b;--surface-light:#334155;--border:#475569;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#94a3b8;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--space-12:3rem;--space-16:4rem;--breakpoint-sm:640px;--breakpoint-md:768px;--breakpoint-lg:1024px;--breakpoint-xl:1280px;--breakpoint-2xl:1536px;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 rgba(0,0,0,.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.1);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,.25)}body,html{max-width:100vw;min-height:100vh;background:var(--background);color:var(--text-primary);font-family:system-ui,-apple-system,sans-serif}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font-size:1rem;font-family:inherit}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-4)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.w-full{width:100%}.max-w-md{max-width:28rem}.max-w-2xl{max-width:42rem}.mx-auto{margin-left:auto;margin-right:auto}.p-4{padding:var(--space-4)}.p-8{padding:var(--space-8)}.mb-4{margin-bottom:var(--space-4)}.mb-8{margin-bottom:var(--space-8)}.space-y-4>*+*{margin-top:var(--space-4)}.space-x-4>*+*{margin-left:var(--space-4)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-full{border-radius:var(--radius-full)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.shadow-2xl{box-shadow:var(--shadow-2xl)}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.rotate-45{transform:rotate(45deg)}.-rotate-45{transform:rotate(-45deg)}.translate-y-1{transform:translateY(.25rem)}.-translate-y-1{transform:translateY(-.25rem)}.opacity-0{opacity:0}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.bg-danger{background-color:var(--danger)}.bg-success{background-color:var(--success)}.bg-warning{background-color:var(--warning)}.bg-surface{background-color:var(--surface)}.bg-surface-light{background-color:var(--surface-light)}.border-border{border-color:var(--border)}.border-surface-light{border-color:var(--surface-light)}.text-primary{color:var(--primary)}.text-secondary{color:var(--secondary)}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-surface{color:var(--surface)}.text-white{color:var(--text-primary)}.text-gray-300{color:var(--text-secondary)}.text-gray-500{color:var(--text-muted)}.whitespace-nowrap{white-space:nowrap}.w-12{width:3rem}.h-12{height:3rem}.mr-4{margin-right:var(--space-4)}.card{background-color:hsla(0,0%,100%,.95);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:var(--space-6);color:#333}.card-dark{background-color:rgba(26,26,46,.9)}.card-dark,.card-modern{color:var(--text-primary)}.card-modern{background-color:var(--surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:var(--space-6);border:1px solid var(--border);transition:transform .2s ease,box-shadow .2s ease}.card-modern:hover{transform:translateY(-4px);box-shadow:var(--shadow-2xl)}.btn{padding:var(--space-3) var(--space-6);border-radius:var(--radius-lg);border:none;font-weight:600;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center}.btn-primary{background:linear-gradient(90deg,var(--primary),var(--secondary));color:#fff}.btn-primary:hover{background:linear-gradient(90deg,#2563eb,#7c3aed);transform:translateY(-2px);box-shadow:0 4px 12px rgba(59,130,246,.4)}.btn-secondary{background:linear-gradient(90deg,var(--success),var(--primary));color:#fff}.btn-secondary:hover{background:linear-gradient(90deg,#0da271,#2563eb);transform:translateY(-2px)}.btn-danger{background:linear-gradient(90deg,var(--danger),#f97316);color:#fff}.btn-danger:hover{background:linear-gradient(90deg,#dc2626,#ea580c)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.input{padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-lg);background-color:var(--surface);color:var(--text-primary);transition:border-color .2s,box-shadow .2s}.input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,.5)}.input-dark{background-color:#1a1a2e;border-color:#0f3460;color:var(--text-primary)}.input-dark:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,.5)}.header{background-color:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);padding:var(--space-4) var(--space-8);display:flex;justify-content:space-between;align-items:center;color:var(--text-primary)}.main-content{padding:var(--space-8);max-width:1200px;margin:0 auto}.grid{display:grid;grid-gap:var(--space-6);gap:var(--space-6)}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}@media (min-width:640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.sm\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}}@media (min-width:768px){.md\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.lg\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.lg\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media (max-width:768px){.grid-cols-2,.grid-cols-3,.grid-cols-4{grid-template-columns:repeat(1,1fr)}}.loading-spinner{border-radius:50%;border:4px solid hsla(0,0%,100%,.3);border-top:4px solid var(--primary);width:40px;height:40px;animation:spin 1s linear infinite;margin:2rem auto}@keyframes spin{to{transform:rotate(1turn)}}h1,h2,h3,h4,h5,h6{color:var(--text-primary);margin-bottom:var(--space-2)}p{line-height:1.6;margin-bottom:var(--space-4)}.gradient-text{background:linear-gradient(90deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.alert{padding:var(--space-4);border-radius:var(--radius-lg);margin-bottom:var(--space-4)}.alert-error{background-color:rgba(239,68,68,.2);border:1px solid var(--danger);color:#fee}.alert-success{background-color:rgba(34,197,94,.2);border:1px solid var(--success);color:#cfc}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:8px;background:var(--surface-light);border-radius:4px;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--primary);cursor:pointer}.slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--primary);cursor:pointer;border:none}@media (max-width:768px){.header{flex-direction:column;gap:var(--space-4)}.header,.main-content{padding:var(--space-4)}}