:root{font-family:Inter,"Segoe UI",system-ui,sans-serif;color:#010937;background:#f4f6fc;font-synthesis:none}
*{box-sizing:border-box}
body{min-height:100dvh;margin:0;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at top left,#d9e2ff,transparent 65%),#f4f6fc}
.login-card{width:min(100%,440px);padding:36px;background:white;border:1px solid #dce2f3;border-radius:24px;box-shadow:0 24px 70px #020f5914}
.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:28px}
.login-brand-icon{flex-shrink:0;width:52px;height:52px;display:grid;place-items:center;background:#101f78;border-radius:14px}
.login-brand-icon img{object-fit:contain;filter:brightness(0) invert(1)}
.brand{font-weight:750;letter-spacing:.01em;font-size:clamp(16px,4vw,18px);line-height:1.3;color:#1c31a5;margin:0;white-space:nowrap}
label{display:block;margin:18px 0 8px;font-size:14px;font-weight:600}
input{width:100%;min-width:0;min-height:46px;padding:12px 14px;border:1px solid #cbd3e8;border-radius:10px;color:inherit;font:inherit;font-size:16px;background:#fbfcff}
input:focus{outline:3px solid #1c31a522;border-color:#1c31a5}
button{width:100%;border:0;border-radius:10px;padding:13px;background:#101f78;color:white;font:inherit;font-weight:650;cursor:pointer}
button:focus-visible{outline:3px solid #1c31a54d;outline-offset:3px}
button:disabled{opacity:.65;cursor:wait}
.login-password{position:relative}
.login-password input{padding-right:56px}
.password-toggle{position:absolute;top:50%;right:3px;transform:translateY(-50%);width:44px;height:40px;display:grid;place-items:center;padding:0;border-radius:8px;background:transparent;color:#65708b}
.password-toggle:hover,.password-toggle[aria-pressed="true"]{color:#101f78;background:#eaf0ff}
.password-toggle svg{width:21px;height:21px}
.password-toggle-slash{display:none}
.password-toggle[aria-pressed="true"] .password-toggle-slash{display:block}
#error{min-height:20px;color:#b91c1c;font-size:14px;line-height:1.4}
@media(max-width:480px){.login-card{padding:26px}}