.login-page { margin: 0; background: #f4f6fb; color: #18243c; }
.login-shell { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.login-card { width: 100%; max-width: 480px; padding: 40px; background: #fff; border: 1px solid #e2e7f0; border-radius: 24px; box-shadow: 0 16px 60px #18243c0c; }
.login-card .login-form { width: 100%; max-width: none; margin: 0; }
.login-brand { display: block; width: 160px; max-width: 65%; height: auto; margin-bottom: 36px; }
.login-environment { display: inline-block; margin-bottom: 12px; padding: 4px 10px; border-radius: 6px; background: #fff2d6; color: #795300; font-size: 12px; font-weight: 600; }
.login-card h1 { margin: 0 0 10px; font-size: 32px; line-height: 1.2; font-weight: 700; letter-spacing: -.7px; }
.login-intro { margin: 0 0 28px; color: #627087; font-size: 16px; line-height: 1.5; }
.login-field { margin-bottom: 22px; }
.login-card .form-label { margin-bottom: 9px; font-size: 16px; font-weight: 600; }
.login-card .form-control { min-height: 56px; padding: 14px 16px; border: 1px solid #b8c3d4; border-radius: 10px; font-size: 17px; line-height: 1.4; }
.login-card .form-control:focus { border-color: #2444b8; box-shadow: 0 0 0 3px #2444b81a; }
.login-password { position: relative; }
.login-password .form-control { padding-right: 58px; }
.login-password-toggle { position: absolute; top: 4px; right: 4px; bottom: 4px; width: 48px; border: 0; border-radius: 7px; background: transparent; color: #4b5e7a; font-size: 21px; }
.login-password-toggle:hover { background: #f0f3fa; }
.login-password-toggle:focus-visible, .login-back:focus-visible { outline: 3px solid #2444b8; outline-offset: 2px; }
.login-remember { display: flex; align-items: center; gap: 12px; min-height: 48px; margin: 0 0 14px; font-size: 16px; cursor: pointer; }
.login-remember .form-check-input { float: none; flex: 0 0 24px; width: 24px !important; height: 24px !important; margin: 0; cursor: pointer; }
.login-card .login-submit { min-height: 56px; border-radius: 10px; font-size: 18px; font-weight: 600; }
.login-card .login-code { text-align: center; font-size: 26px; letter-spacing: .25em; }
.login-back { display: block; margin-top: 18px; padding: 10px; color: #2444b8; text-align: center; font-size: 16px; }
.login-card .alert { font-size: 15px; line-height: 1.5; }
@media (max-width: 575.98px) {
    .login-page { background: #fff; }
    .login-shell { align-items: flex-start; padding: max(28px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom)); }
    .login-card { max-width: 440px; padding: 16px 0; border: 0; border-radius: 0; box-shadow: none; }
    .login-brand { margin-bottom: 32px; }
}