:root { color-scheme:dark; font-family:"Segoe UI",Arial,sans-serif; color:#edf6fa; background:#021f30; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; min-height:100vh; min-height:100svh; display:flex; align-items:center; justify-content:center; padding:32px 16px; background:#021f30; }
.login-shell { width:min(545px,100%); transform:translateY(-14px); }
.brand { display:flex; align-items:center; justify-content:center; gap:14px; height:40px; margin-bottom:28px; font-size:32px; font-weight:700; line-height:40px; }
.brand-wave { width:54px; height:40px; flex:none; }
.login-card { width:100%; min-height:495px; padding:38px; border:1px solid #236272; border-radius:12px; background:#032232; }
h1 { margin:0 0 22px; font-size:36px; font-weight:700; line-height:45px; letter-spacing:-.02em; }
.field + .field { margin-top:30px; }
label { display:block; font-size:20px; line-height:24px; font-weight:600; color:#a9c7d6; margin-bottom:6px; }
input { display:block; width:100%; height:62px; border:1px solid #2a7787; border-radius:9px; background:#021f30; color:#edf6fa; padding:12px 16px; font:20px/1.3 "Segoe UI",Arial,sans-serif; }
.password-wrap { position:relative; }
.password-wrap input { padding-right:60px; }
.password-toggle { position:absolute; right:9px; top:9px; width:44px; height:44px; display:grid; place-items:center; padding:10px; color:#9bc1d2; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.password-toggle svg { width:24px; height:24px; }
.login-submit { width:100%; height:63px; margin-top:24px; padding:12px; border:0; border-radius:9px; color:#062538; background:linear-gradient(90deg,#06d4df,#e0ff58); font:700 24px/1.3 "Segoe UI",Arial,sans-serif; cursor:pointer; }
.login-submit:disabled { cursor:wait; }
.access-note { margin:26px 0 0; text-align:center; font-size:20px; line-height:23px; color:#9fbfd0; }
.recovery-link { display:flex; align-items:center; justify-content:center; min-height:44px; margin-top:12px; color:#9fbfd0; font-size:18px; text-underline-offset:4px; }
.recovery-link:hover { color:#e0ff58; }
.login-error { margin:16px 0 0; color:#ffadb2; font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
input:focus-visible,button:focus-visible,a:focus-visible { outline:2px solid #e0ff58; outline-offset:3px; }
@media(max-width:600px) {
  body { padding:24px 16px; }
  .login-shell { transform:none; }
  .login-card { padding:24px; min-height:0; }
  .brand { font-size:28px; gap:10px; margin-bottom:24px; }
  h1 { font-size:30px; line-height:38px; margin-bottom:22px; }
  .field + .field { margin-top:24px; }
  .access-note { font-size:18px; margin-top:26px; }
}