:root{--ink:#14213d;--muted:#4a5568;--line:#cbd5e0;--brand:#0b4f8a;--brand-ink:#ffffff;--bg:#f4f6fa;--card:#ffffff;--warn-bg:#fff4d6;--warn-ink:#5c4400;--err:#a4161a;--ok:#1b5e20;--focus:#ffbf47}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.auth-shell{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:0 16px 32px}
.banner{width:100%;max-width:none;margin:0 -16px 32px;padding:10px 16px;background:var(--warn-bg);color:var(--warn-ink);font-weight:600;text-align:center}
.card{width:100%;max-width:400px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:24px}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.brand{margin:0;font-size:.95rem;letter-spacing:.02em}
.brand strong{color:var(--brand)}
h1{font-size:1.5rem;margin:16px 0 8px}
.msg{min-height:1.5em;margin:0 0 8px}
.msg.error{color:var(--err);font-weight:600}
.msg.ok{color:var(--ok);font-weight:600}
.field{margin:0 0 16px}
label{display:block;font-weight:600;margin-bottom:4px}
.input-row{display:flex;gap:8px}
input,select{font:inherit;color:inherit;border:1px solid #718096;border-radius:8px;padding:10px 12px;background:#fff;min-height:44px}
input{flex:1;min-width:0}
.hint{margin:-8px 0 16px;color:var(--muted);font-size:.9rem}
button{font:inherit;min-height:44px;border-radius:8px;cursor:pointer}
.reveal{border:1px solid #718096;background:#fff;color:var(--ink);padding:0 12px}
.primary{width:100%;border:0;background:var(--brand);color:var(--brand-ink);font-weight:700;padding:10px 16px}
.primary:disabled{opacity:.55;cursor:not-allowed}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}