.page-login .site-main { display: grid; min-height: calc(100vh - 160px); }
.login-shell { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .7fr); align-items: stretch; gap: 20px; padding-block: clamp(36px, 7vw, 92px); }
.login-card, .login-aside { border: 1px solid var(--color-border-strong); background: var(--color-surface); }
.login-card { padding: clamp(24px, 5vw, 48px); }
.login-card__head { display: flex; align-items: center; gap: 16px; margin-bottom: 32px; }
.login-card__head h1, .login-card__head p { margin-bottom: 0; }
.login-card__icon { display: grid; place-items: center; width: 52px; height: 52px; flex: 0 0 52px; background: var(--color-primary-soft); color: var(--color-primary-dark); font-size: 1.2rem; }
.login-notice { margin-bottom: 20px; padding: 13px 15px; border-left: 3px solid var(--color-primary); background: var(--color-primary-soft); }
.login-notice--error { border-left-color: var(--color-danger); background: var(--color-danger-soft); }
.login-form { display: grid; gap: 12px; }
.login-form label { display: grid; gap: 3px; }
.login-form label span { font-weight: 600; }
.login-input-wrap { display: grid; grid-template-columns: 46px 1fr; align-items: center; min-height: 58px; border: 1px solid var(--color-border-strong); background: var(--color-surface-muted); }
.login-input-wrap:focus-within { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); }
.login-input-wrap i { justify-self: center; color: var(--color-ink-faint); }
.login-input-wrap input { width: 100%; min-height: 56px; padding: 12px 14px 12px 0; border: 0; outline: 0; background: transparent; font-family: var(--font-mono); font-size: 1.08rem; }
.login-input-wrap--code input { font-size: 1.45rem; letter-spacing: .26em; }
.login-submit { display: inline-flex; align-items: center; justify-content: space-between; min-height: 52px; margin-top: 6px; padding: 11px 16px; border: 1px solid var(--color-primary); background: var(--color-primary); color: var(--color-on-primary); font-weight: 600; cursor: pointer; }
.login-submit:hover { filter: brightness(1.08); }
.login-submit:disabled { cursor: not-allowed; filter: grayscale(1); opacity: .5; }
.login-resend { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--color-border); }
.login-resend label { display: block; margin-bottom: 8px; color: var(--color-ink-muted); font-size: .8rem; }
.login-resend div { display: grid; grid-template-columns: 1fr auto; }
.login-resend input, .login-resend button { min-height: 42px; padding: 8px 11px; border: 1px solid var(--color-border-strong); background: var(--color-surface-muted); }
.login-resend button { border-left: 0; color: var(--color-primary-dark); cursor: pointer; }
.login-security-note { display: flex; align-items: flex-start; gap: 11px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--color-border); color: var(--color-ink-muted); }
.login-security-note i { margin-top: 3px; color: var(--color-time); }
.login-security-note p { margin-bottom: 0; font-size: .82rem; }
.login-aside { display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 4vw, 38px); background: var(--color-surface-muted); }
.login-aside h2 { max-width: 290px; margin: 8px 0 26px; font-size: clamp(1.35rem, 3vw, 1.8rem); }
.login-aside > div { display: grid; grid-template-columns: 38px 1fr; gap: 12px; padding: 18px 0; border-top: 1px solid var(--color-border); }
.login-aside > div > span { font-family: var(--font-mono); color: var(--color-time-ink); }
.login-aside p { display: grid; gap: 3px; margin-bottom: 0; }
@media (max-width: 800px) { .login-shell { grid-template-columns: 1fr; } .login-aside { display: none; } }
@media (max-width: 520px) { .login-shell { width: 100%; padding-block: 0; } .login-card { border-inline: 0; } .login-card__head { align-items: flex-start; } }