.login-input { font-size: 16px; min-height: 48px; }
.login-pw-wrap { position: relative; }
.login-pw-wrap .login-input { padding-right: 48px; }
.login-pw-toggle { position: absolute; top: 0; right: 0; width: 48px; height: 48px; display: inline-flex;
  align-items: center; justify-content: center; color: #6b7280; border-radius: 0 .5rem .5rem 0; }
.login-pw-toggle:focus-visible, .login-forgot summary:focus-visible { outline: 2px solid var(--color-gold, #c9a227); outline-offset: 2px; }
.login-forgot summary { min-height: 44px; display: flex; align-items: center; }
.login-submit { min-height: 48px; transition: transform 120ms ease-out, opacity 120ms ease-out; }
.login-submit:active:not(:disabled) { transform: scale(.97); }
.login-submit:disabled { opacity: .75; cursor: progress; }
[data-login-error] { animation: login-fade 200ms ease-out; }
@keyframes login-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .login-submit { transition: opacity 120ms linear; }
  .login-submit:active:not(:disabled) { transform: none; }
}

/* LOGIN-UI-02: two-side layout (photo + form), per approved mock 2026-09-26 */
body { background: #fff; }
.login-wrap { display: grid; grid-template-columns: 1fr; min-height: 100dvh; }
.login-photo { position: relative; height: 24vh; min-height: 170px; background: #0B1F3A center / cover no-repeat; }
.login-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,31,58,0) 45%, rgba(11,31,58,.7)); }
.login-cap { position: absolute; inset-inline-start: 20px; bottom: 14px; z-index: 1; color: #fff; font-size: 13px; line-height: 1.3; letter-spacing: .02em; }
.login-cap b { display: block; font-size: 15px; font-weight: 600; }
.login-pane { display: flex; justify-content: center; padding: 28px 20px 32px; }
.login-form { max-width: 400px; }
.login-logo { display: block; width: 170px; height: auto; margin: 0 auto 20px; }
.login-form .login-title { font-size: 22px; font-weight: 700; line-height: 1.25; margin: 0 0 4px; text-align: center; color: #0B1F3A; }
.login-form .login-sub { margin: 0 0 24px; text-align: center; color: #5B6878; font-size: 14px; line-height: 1.4; }
.login-foot { margin-top: 28px; text-align: center; font-size: 12px; color: #5B6878; }
.login-form label { font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.login-form .login-input { border-color: #D9DEE5; border-radius: 10px; }
.login-form form > * + * { margin-top: 16px; }
.login-form [data-login-error] { margin-bottom: 18px; }
.login-form [data-login-error], .login-form [role="status"]:not(.ui-kit-loader) { margin-top: -4px; padding: 12px 14px; font-size: 14px; line-height: normal; border-radius: 10px; }
.login-form [data-login-error] + form, .login-form [role="status"] + form { margin-top: -3px; }
.login-form .login-forgot { display: flex; flex-direction: column; align-items: flex-end; margin: -6px 0 14px; }
.login-form .login-forgot summary { font-weight: 500; color: #063B87; min-height: 44px; }
.login-form .login-submit { width: 100%; height: 48px; min-height: 48px; margin-top: 0; border-radius: 10px; background: #CDA250; color: #0B1F3A; font-weight: 700; font-size: 16px; display: flex; align-items: center; justify-content: center; }
.login-submit:hover:not(:disabled) { background: #B88F3E; }
@media (min-width: 1024px) {
  .login-wrap { grid-template-columns: minmax(0, 1.15fr) minmax(460px, 1fr); }
  .login-photo { height: auto; min-height: 100dvh; }
  .login-cap { inset-inline-start: 40px; bottom: 36px; font-size: 14px; }
  .login-cap b { font-size: 20px; }
  .login-pane { align-items: center; padding: 48px; }
  .login-logo { width: 220px; margin-bottom: 28px; }
  .login-form .login-title { font-size: 26px; }
}