:root{--primary:#3157d5;--primary-dark:#203d9b;--ink:#172033;--muted:#718096;--line:#e6eaf2;--surface:#fff;--red:#c0392b;--red-soft:#fdecea;--blue-soft:#eaf0ff}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;font-size:15px;color:var(--ink);-webkit-text-size-adjust:100%}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 15% 10%,#dce6ff,transparent 38%),radial-gradient(circle at 90% 90%,#e3e9ff,transparent 40%),linear-gradient(135deg,#f6f8ff,#eef2fb)}
.login-card{background:var(--surface);width:min(420px,100%);padding:36px 34px 28px;border:1px solid var(--line);border-radius:22px;box-shadow:0 22px 60px #243b7122}
.login-logo{width:54px;height:54px;border-radius:16px;background:linear-gradient(135deg,#4a72f0,var(--primary-dark));display:grid;place-items:center;font-size:27px;margin-bottom:16px;box-shadow:0 8px 20px #3157d544}
.eyebrow{margin:0 0 6px;color:var(--primary);font-size:10.5px;letter-spacing:2px;font-weight:800}
h1{margin:0 0 6px;font-size:27px;color:var(--primary-dark);line-height:1.2}
.lead{margin:0 0 22px;color:var(--muted)}
.field{margin-bottom:16px}
label{display:block;margin-bottom:6px;font-size:13px;font-weight:700;color:#3d4a63}
input{width:100%;padding:12px 14px;font:inherit;color:var(--ink);background:#fff;border:1px solid #cdd6e6;border-radius:11px;min-height:46px}
input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #3157d526}
.pw{position:relative}
.pw input{padding-right:70px}
#togglePw{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--primary-dark);font:inherit;font-size:13px;font-weight:700;padding:8px 10px;border-radius:8px;cursor:pointer}
#togglePw:hover{background:var(--blue-soft)}
#togglePw:focus-visible,.submit:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.caps{margin-top:6px;font-size:12.5px;color:#9a5b00;font-weight:600}
.error{margin:0 0 14px;padding:11px 14px;border-radius:10px;background:var(--red-soft);color:var(--red);font-weight:600;font-size:14px;border:1px solid #f3c4bd}
.notice{margin:0 0 18px;padding:11px 14px;border-radius:10px;background:var(--blue-soft);color:var(--primary-dark);font-weight:600;font-size:14px;border:1px solid #cfdcff}
.submit{width:100%;min-height:48px;border:0;border-radius:12px;background:var(--primary);color:#fff;font:inherit;font-weight:800;font-size:15.5px;cursor:pointer;transition:background .15s}
.submit:hover{background:var(--primary-dark)}
.submit:disabled{opacity:.7;cursor:progress}
.help{margin:20px 0 0;padding-top:16px;border-top:1px solid var(--line);color:var(--muted);font-size:12.5px;line-height:1.55;text-align:center}
@media(max-width:480px){.login-card{padding:28px 22px 22px;border-radius:18px}h1{font-size:24px}}