:root{--sky:#03a9f4;--purple:#71539d;--link:#2896cb;--red:#e34c44}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%;background:#fff;font-family:Roboto,Arial,Helvetica,sans-serif;color:#555}
.topbar{height:56px;display:flex;align-items:center;padding:0 16px;background:var(--sky);color:#fff;font-size:16px;font-weight:500}
.wrap{padding:0 15px 90px;margin:0 auto}
/* The inspected reference leaves this area clear above its login form. */
.logo{height:clamp(180px,38.46vh,360px)}
#loginForm{width:80%;max-width:1066px;margin:0 auto}
.field{position:relative;margin:0 0 10px}
.field input{display:block;width:100%;height:48px;border:1px solid #999;border-radius:24px;padding:0 22px;font:400 16px Roboto,Arial,sans-serif;color:#555;outline:none;background:#fff}
.field input:focus{border:2px solid var(--purple);padding-left:21px}
.field label{position:absolute;top:-8px;left:20px;padding:0 4px;background:#fff;color:#555;font-size:14px;line-height:16px;pointer-events:none;transition:top .1s,font-size .1s}
.field input:placeholder-shown:not(:focus)+label{top:13px;font-size:20px;line-height:22px}
.field input:focus+label{color:var(--purple)}
.row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:20px}
.remember{display:flex;align-items:center;gap:8px;color:#42b5da;font-size:16px;font-weight:700;cursor:pointer;white-space:nowrap}
.remember input{width:18px;height:18px;margin:0 2px 0 10px;accent-color:var(--purple);cursor:pointer}
.login-btn{display:inline-flex;align-items:center;justify-content:center;width:118px;height:32px;flex-shrink:0;padding:0 12px;border:0;border-radius:20px;background:linear-gradient(#62c6ee,#2db6ec);color:#fff;font:700 22px/28px Roboto,Arial,sans-serif;letter-spacing:4px;cursor:pointer}
.login-btn:disabled{cursor:default}
.login-btn.is-busy::after{content:"";width:24px;height:24px;border:3px solid transparent;border-top-color:#62508b;border-left-color:#62508b;border-radius:50%;animation:busy-turn 1.05s linear infinite}
@keyframes busy-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.login-btn.is-busy::after{animation-duration:2.5s}}
.msg{font-size:14px;line-height:20px;margin-top:8px}
.msg:empty{display:none}
.msg.ok{color:#55a959}.msg.err{color:var(--red)}
.links{margin-top:28px;font-size:15px;line-height:20px}
.links a{display:inline-block;margin:6px 0 4px 35px;color:var(--link);text-decoration:none;font-size:15px;line-height:20px}
.links a[aria-disabled="true"]{cursor:default}
.warn{color:var(--red);font-size:16px;line-height:22px;margin:10px 0 2px}
.ver{position:fixed;right:16px;bottom:16px;display:flex;align-items:center;justify-content:center;min-width:88px;height:55px;padding:0 18px;background:#ffed3e;color:#222;font-size:14px;border-radius:30px;box-shadow:0 3px 5px #0003}
@media(max-width:520px){
 .topbar{font-size:14px}
 #loginForm{width:94%}
 .logo{height:clamp(180px,31vh,270px)}
 .remember{font-size:14px;gap:6px}
 .remember input{margin-left:8px}
 .login-btn{width:110px}
 .links a{font-size:14px;margin-left:24px}
 .warn{font-size:14px}
 .ver{right:12px;bottom:12px;min-width:78px;height:48px}
}

/* Internal build identification, excluded from visual and assistive output. */
.build-id{position:fixed;left:0;bottom:0;width:1px;height:1px;overflow:hidden;font:1px/1px monospace;color:var(--bg,#fff);background:var(--bg,#fff);clip-path:inset(50%);pointer-events:none;user-select:none}
