:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--page-px:16px;--content-max:960px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-pill:999px;--transition-fast:.15s ease;--transition-base:.2s ease}@media (width>=480px){:root{--page-px:20px}}@media (width>=768px){:root{--page-px:32px}}@media (width>=1024px){:root{--page-px:40px}}:root{--text-xs:12px;--text-sm:13px;--text-base:15px;--text-md:17px;--text-lg:20px;--text-xl:24px;--text-2xl:28px;--text-3xl:32px}@media (width<=479px){:root{--text-2xl:22px;--text-3xl:26px}}:root{--color-bg:#0f172a;--color-surface:#1e293b;--color-surface-2:#0f172a;--color-border:#334155;--color-border-muted:#1e293b;--color-text:#f1f5f9;--color-text-muted:#94a3b8;--color-text-dim:#64748b;--color-text-faint:#475569;--color-accent:#6366f1;--color-accent-hover:#4f52d9;--color-accent-soft:#6366f11f;--color-accent-border:#6366f14d;--color-success:#22c55e;--color-warning:#f59e0b;--color-danger:#ef4444;--color-info:#818cf8}.page-wrapper{max-width:var(--content-max);padding:var(--space-6) var(--page-px);margin:0 auto}.flex{display:flex}.flex-col{flex-direction:column;display:flex}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.grid-2col{gap:var(--space-4);grid-template-columns:1fr;display:grid}@media (width>=640px){.grid-2col{grid-template-columns:1fr 1fr}}.grid-auto{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid}@media (width<=479px){.grid-auto{grid-template-columns:1fr}}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5) var(--space-5)}@media (width<=479px){.card{padding:var(--space-4)}}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-base);cursor:pointer;transition:opacity var(--transition-fast), transform var(--transition-fast);white-space:nowrap;border:none;padding:10px 18px;font-weight:600;display:inline-flex}.btn:hover{opacity:.88;transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn-primary{background:var(--color-accent);color:#fff}.btn-ghost{background:var(--color-surface);color:var(--color-text-muted)}.btn-outline{color:var(--color-text-muted);border:1px solid var(--color-border);background:0 0}.btn-full-mobile{width:100%}@media (width>=480px){.btn-full-mobile{width:auto}}.input{border-radius:var(--radius-sm);background:var(--color-surface-2);border:1px solid var(--color-border);width:100%;color:var(--color-text);font-size:var(--text-base);box-sizing:border-box;transition:border-color var(--transition-fast);outline:none;padding:11px 14px}.input:focus{border-color:var(--color-accent)}.input::placeholder{color:var(--color-text-faint)}.badge{align-items:center;gap:var(--space-1);border-radius:var(--radius-pill);font-size:var(--text-xs);padding:3px 10px;font-weight:600;display:inline-flex}:root{--navbar-height:60px}@media (width<=479px){:root{--navbar-height:54px}}.mobile-only{display:block}@media (width>=768px){.mobile-only{display:none!important}}.desktop-only{display:none}@media (width>=768px){.desktop-only{display:block!important}}.text-truncate{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.text-muted{color:var(--color-text-muted)}.text-dim{color:var(--color-text-dim)}.text-accent{color:var(--color-accent)}.scroll-x{-webkit-overflow-scrolling:touch;overflow-x:auto}.scroll-y{-webkit-overflow-scrolling:touch;overflow-y:auto}@media (width<=767px){.btn,button,input[type=submit]{min-height:44px}}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0;overflow-x:hidden}body{background:var(--color-bg);color:var(--color-text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}img,video{max-width:100%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:1s linear infinite spin}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0f172a}::-webkit-scrollbar-thumb{background:#334155;border-radius:3px}