:root{--primary:#2563eb;--primary-hover:#1d4ed8;--primary-light:#eff6ff;--text-primary:#111827;--text-secondary:#4b5563;--text-muted:#6b7280;--bg-page:#f5f7fb;--bg-card:#ffffff;--border-default:#e5e7eb;--border-light:#f3f4f6;--success:#059669;--error:#dc2626;--warning:#d97706;--gold:#d4a535;--gold-hover:#b8942d}*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg-page);color:var(--text-primary);min-height:100vh}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}.page-wrapper{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1 0 auto}.topbar{justify-content:space-between;padding:0 2rem;height:56px;background:var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.08)}.topbar,.topbar-left{display:flex;align-items:center}.topbar-left{gap:2rem}.topbar-brand{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.1rem;color:#ffffff;text-decoration:none}.topbar-brand:hover{text-decoration:none;opacity:.9}.topbar-logo{width:22px;height:22px;stroke:#ffffff}.topbar-nav{display:flex;gap:.25rem}.nav-link{font-size:.875rem;color:rgba(255,255,255,.8);text-decoration:none;padding:.4rem .75rem;border-radius:6px;transition:background .15s,color .15s}.nav-link:hover{background:rgba(255,255,255,.1);color:#ffffff;text-decoration:none}.nav-link.nav-active{background:rgba(255,255,255,.2);color:#ffffff;font-weight:500}.topbar-right{gap:1rem}.topbar-quota,.topbar-right{display:flex;align-items:center}.topbar-quota{gap:.35rem;font-size:.8rem;color:#a5f3fc;background:rgba(0,0,0,.15);padding:.3rem .65rem;border-radius:999px;white-space:nowrap}.topbar-quota:empty{display:none}.topbar-user{display:flex;align-items:center;gap:.6rem}.topbar-user-label{font-size:.85rem;color:rgba(255,255,255,.9);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-auth-btn{display:inline-flex;align-items:center;justify-content:center;padding:.35rem .85rem;border-radius:6px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#ffffff;font-size:.8rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s}.topbar-auth-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.4rem .85rem;border-radius:6px;border:none;font-size:.85rem;font-weight:500;cursor:pointer;transition:background .15s}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:#64748b;color:#fff}.btn-secondary:hover{background:#475569}.btn-muted{background:var(--border-default);color:var(--text-primary)}.btn-disabled{opacity:.6;cursor:not-allowed}@media (max-width:768px){.desktop-only{display:none!important}.btn{min-height:44px;padding:.5rem 1rem;font-size:.9rem}.btn-primary{border-radius:12px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInRight{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slideOutRight{0%{transform:translateX(0)}to{transform:translateX(100%)}}@media (max-width:768px){main{animation:fadeInUp .3s ease-out}.btn:active{transform:scale(.97)}.card:active{transform:scale(.98)}}