:root{
  --bg:#eef2f7;
  --line:#d9e1eb;
  --ink:#172033;
  --muted:#64748b;
  --primary:#2454d6;
  --primary-hover:#193fac;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:var(--bg)}
button,input{font:inherit}
[hidden],.hidden{display:none!important}
.primary-btn{height:39px;border:0;border-radius:8px;padding:0 16px;cursor:pointer;font-weight:750;white-space:nowrap;background:var(--primary);color:#fff}
.primary-btn:hover{background:var(--primary-hover)}
.primary-btn:disabled{opacity:.65;cursor:wait}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:28px;background:#d9dee5}
.login-card{width:min(940px,100%);display:grid;grid-template-columns:360px minmax(0,1fr);border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 24px 70px rgba(15,23,42,.18);border:1px solid rgba(15,23,42,.12);position:relative}
.login-brand{background:#111827;min-height:520px;padding:54px 42px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center}
.login-brand img{width:255px;max-width:100%;height:auto;margin-bottom:34px}
.login-brand>div{min-height:34px}
.login-brand>div span{display:block;margin-top:0;color:#f8fafc;text-transform:uppercase;letter-spacing:.18em;font-size:15px;font-weight:700}
.login-panel{padding:48px 52px 62px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.login-heading{display:flex;align-items:center;gap:16px;margin-bottom:26px}
.login-heading h1{margin:0;font-size:30px}
.login-heading p{margin:5px 0 0;color:var(--muted);font-size:14px}
.login-lock{width:48px;height:48px;border-radius:14px;background:#eaf0ff;color:var(--primary);display:grid;place-items:center;font-size:27px;font-weight:900;transform:rotate(-12deg)}
.login-form{display:grid;gap:16px}
.login-form label{display:grid;gap:7px}
.login-form label>span:first-child,.login-step-copy strong{font-size:12px;font-weight:850;color:#475569;text-transform:uppercase;letter-spacing:.05em}
.login-form input{width:100%;height:46px;border:1px solid #c9d4e2;border-radius:9px;background:#fff;padding:10px 12px;outline:none;color:var(--ink)}
.login-form input:focus{border-color:#7293f1;box-shadow:0 0 0 3px rgba(36,84,214,.12)}
.login-submit{height:46px;margin-top:2px}
.password-wrap{position:relative;display:block}
.password-wrap input{padding-right:48px}
.password-eye{position:absolute;right:5px;top:5px;width:36px;height:36px;border:0;border-radius:7px;background:#edf2f7;color:#334155;cursor:pointer}
.password-eye:hover{background:#dfe7f0}
.login-step{display:grid;gap:18px}
.login-step-copy{display:grid;gap:5px}
.login-step-copy span{font-size:13px;color:var(--muted);line-height:1.5}
.login-back{border:0;background:transparent;color:#475569;text-decoration:underline;cursor:pointer;font-size:12px;font-weight:700}
.totp-input{text-align:center;font-size:24px!important;font-weight:850;letter-spacing:.28em;font-variant-numeric:tabular-nums;padding-left:calc(.28em + 12px)!important}
.login-message{min-height:20px;margin-top:16px;font-size:13px;font-weight:700}
.login-message.error{color:#b91c1c}.login-message.success{color:#166534}.login-message.loading{color:#1d4ed8}
.login-footer{position:absolute;bottom:17px;right:30px;color:#94a3b8;font-size:10px}
.login-setup-grid{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px;align-items:center}
.auth-qr-box{min-height:180px;border:1px solid var(--line);border-radius:13px;background:#fff;display:grid;place-items:center;padding:10px}
.auth-qr-box img{display:block;width:168px;height:168px;object-fit:contain}
.auth-secret-box{display:grid;gap:9px;min-width:0}
.auth-secret-box>span{font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:#475569}
.auth-secret-box code{display:block;padding:11px;border-radius:8px;background:#eef2f7;color:#172033;font-size:13px;font-weight:800;letter-spacing:.08em;word-break:break-all}
.auth-secret-box small{color:var(--muted);font-size:11px;line-height:1.45}
.qr-unavailable{padding:12px;color:#9a3412;background:#fff7ed;border:1px solid #fed7aa;border-radius:8px;font-size:11px;font-weight:700;text-align:center}
.secret-copy-row{display:grid;grid-template-columns:minmax(0,1fr) 40px;gap:7px;align-items:stretch;min-width:0}
.secret-copy-row code{min-width:0;margin:0}
.secret-copy-button{width:40px;min-width:40px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#334155;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.secret-copy-button:hover{background:#eef2f7;border-color:#94a3b8}
.secret-copy-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.local-qr-renderer{position:fixed;left:-10000px;top:-10000px;width:1px;height:1px;overflow:hidden;pointer-events:none}
@media(max-width:1050px){.login-card{grid-template-columns:300px minmax(0,1fr)}.login-brand{padding:40px 28px}.login-panel{padding:40px 36px 58px}}
@media(max-width:760px){.login-shell{padding:0;background:#111827}.login-card{min-height:100vh;border-radius:0;grid-template-columns:1fr;border:0}.login-brand{min-height:auto;padding:30px 24px}.login-brand img{width:210px;margin:0}.login-brand>div{display:none}.login-panel{padding:34px 24px 70px;justify-content:flex-start}.login-footer{left:24px;right:24px;text-align:center}.login-setup-grid{grid-template-columns:1fr}.auth-qr-box{width:190px;justify-self:center}}
