.login-page{min-height:100svh;display:flex;flex-direction:column;background:#f2f2f7;color:var(--ink,#20232a)}
.login-header{width:100%;max-width:1200px;margin:0 auto;padding:30px 36px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.login-header .brand{font-size:20px;gap:10px}.login-header .brand-mark{width:32px;height:32px;font-size:23px}
.login-header-note{font-size:13px;color:#686c77}
.login-main{flex:1;display:grid;place-items:center;padding:35px 20px 48px}
.login-card{width:100%;max-width:428px;padding:36px 36px 0;background:#fff;border:1px solid #e6e8ed;border-radius:24px;box-shadow:0 12px 42px #29334c08}
.login-emblem{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:#edf5ff;color:#0071e3;margin-bottom:24px}.login-emblem svg{width:30px;height:30px}
.login-card h1{font-size:30px;line-height:1.3;letter-spacing:-1px;font-weight:700}
.login-intro{font-size:14px;line-height:1.75;color:#666b77;margin-top:9px;margin-bottom:28px}
.login-field{margin-bottom:19px}.login-field label{display:block;font-size:14px;font-weight:600;margin-bottom:9px}
.login-field input{width:100%;height:50px;padding:0 14px;border:1px solid #d8dce5;border-radius:11px;background:#fdfdfe;color:#20232a;font:inherit;font-size:16px;transition:border-color .18s,box-shadow .18s}
.login-field input::placeholder{color:#8b8f99;font-size:14px}.login-field input:focus{border-color:#0071e3;outline:0;box-shadow:0 0 0 3px #0071e319}.login-field input[aria-invalid=true]{border-color:#c44343}
.password-field{position:relative}.password-field input{padding-right:52px}.password-toggle{position:absolute;right:3px;top:3px;width:44px;height:44px;padding:11px;border-radius:9px;color:#666f7d;display:grid;place-items:center}.password-toggle:hover{color:#0071e3;background:#edf5ff}.password-toggle svg{width:22px;height:22px}.eye-slash{display:none}.password-toggle[aria-pressed=true] .eye-slash{display:block}
.remember-login{display:flex;align-items:center;gap:9px;min-height:44px;width:fit-content;font-size:13px;color:#5f6672;cursor:pointer;margin-top:-5px;margin-bottom:15px}.remember-login input{width:17px;height:17px;accent-color:#0071e3;cursor:pointer}
.login-submit{width:100%;min-height:50px;display:flex;justify-content:center;gap:10px;border-radius:12px;font-size:15px;font-weight:600;background:#0071e3}.login-submit svg{width:19px;height:19px}.login-submit:disabled{cursor:wait;opacity:.65}
.login-notice,.login-error{padding:11px 13px;border-radius:10px;font-size:13px;line-height:1.65;margin-bottom:18px}.login-notice{background:#edf5ff;color:#235c94}.login-error{background:#fff1f1;color:#a82e36}
.login-card-foot{display:flex;align-items:center;justify-content:center;gap:7px;border-top:1px solid #eff0f4;margin-top:28px;padding:20px 0;color:#727782;font-size:12px}.login-status-dot{width:5px;height:5px;border-radius:50%;background:#8b96a5}
.login-footer{text-align:center;padding:0 20px calc(24px + env(safe-area-inset-bottom));font-size:12px;color:#7b808b}.login-footer span{margin:0 8px}
.login-page :focus-visible{outline:3px solid #0071e3;outline-offset:3px}
@media(max-width:480px){.login-header{padding:23px 22px}.login-header-note{display:none}.login-main{padding:22px 18px 36px}.login-card{padding:28px 24px 0;border-radius:21px}.login-card h1{font-size:28px}.login-intro{font-size:13px}.login-emblem{margin-bottom:21px}}
@media(max-height:640px){.login-main{padding-top:8px}.login-header{padding-top:20px;padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){.login-page *{transition:none!important}}