#app.login-page{display:block;height:100%}:root{--brand: #4cafef;--accent: #6a67ce;--bg: #f4f6f8;--ink: #111827;--muted: #6b7280;--card: #ffffff;--border: #e5e7eb;--success: #10b981;--danger: #ef4444}*{box-sizing:border-box}html,body{height:100%;margin:0;padding:0;overflow:hidden}body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}#app{height:100%;display:flex;position:relative}#app.login-page{display:block;height:100%;overflow:hidden}.muted{color:var(--muted)}.btn{background:var(--brand);border:none;color:#fff;padding:10px 14px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:500}.btn:hover{filter:brightness(.95)}.btn.secondary{background:var(--accent)}.btn.ghost{background:#eef6ff;color:#075985}.btn.danger{background:var(--danger)}.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;box-shadow:0 1px 2px #0000000a}.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}@media (max-width: 1024px){.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width: 768px){.grid{grid-template-columns:1fr;gap:12px}.card{padding:14px}.btn{padding:8px 12px;font-size:13px}}@media (max-width: 480px){.grid{gap:10px}.card{padding:12px}.btn{padding:8px 10px;font-size:12px}}