.auth-shell { min-height: 100svh; display: grid; place-items: center; padding: 32px 20px; }
.auth-login-shell { min-height: 100dvh; display: flex; flex-direction: column; gap: 32px; padding-top: max(32px, env(safe-area-inset-top), var(--tg-content-safe-area-inset-top, 0px)); padding-bottom: calc(16px + max(env(safe-area-inset-bottom), var(--tg-content-safe-area-inset-bottom, 0px))); }
.auth-entry { flex: 1; display: grid; place-items: center; width: 100%; }
.auth-card-stack { width: min(100%, 440px); }
.auth-verification { margin: 0 !important; text-align: center; color: #dce4ff; font-size: 12px; line-height: 1.5; }
.auth-legal-footer { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; min-height: 44px; width: 100%; color: #e3e9ff; font-size: 12px; line-height: 1.5; }
.auth-legal-links { display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 12px; white-space: nowrap; color: #e3e9ff; font-size: 12px; line-height: 1.5; }
.auth-legal-links a { text-decoration: none; text-underline-offset: 3px; }
.auth-legal-links a:hover { text-decoration: underline; }
.auth-legal-links a:focus-visible { outline-color: var(--lime); border-radius: 3px; }
.auth-card { width: min(100%, 440px); padding: 34px; background: var(--paper); border-radius: 24px; animation: shin-enter 400ms both; }
.auth-brand { display: block; margin-bottom: 30px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.auth-card h1:not(.sr-only) { font: 700 23px/1.25 var(--display); letter-spacing: -.045em; margin-bottom: 10px; }
.auth-hint { color: var(--muted); font-size: 15px; margin-bottom: 24px !important; }
.auth-form { display: grid; gap: 20px; }
.auth-form label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 8px; }
.auth-form input { display: block; width: 100%; min-height: 58px; padding: 16px; border: 1px solid #bbc5db; border-radius: 12px; background: white; color: var(--ink); font-size: 17px !important; transition: border-color 180ms; }
.auth-form input::placeholder { color: #788298; }
.auth-form input:focus { border-color: var(--blue); }
.auth-form input[aria-invalid=true] { border-color: var(--danger); }
.auth-form input[aria-invalid=true]:focus-visible { outline-color: var(--danger); }
.auth-link { display: inline-flex; align-items: center; justify-self: start; min-height: 44px; margin-block: -10px; font-size: 14px; text-underline-offset: 4px; }
.password-field { position: relative; }
.password-field input { padding-right: 96px; }
.password-toggle { position: absolute; right: 6px; top: 7px; min-height: 44px; min-width: 80px; border: 0; background: transparent; color: var(--blue); font-size: 13px !important; border-radius: 8px; }
.tma-auth-state { min-height: 100dvh; display: flex; gap: 14px; align-items: center; justify-content: center; padding: 24px; background: var(--blue); color: white; font: 16px/1.5 var(--text); }
.tma-auth-state::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--lime); }
@media (max-width: 480px) {
  .auth-shell { padding: 24px 16px; }
  .auth-login-shell { padding-top: max(24px, env(safe-area-inset-top), var(--tg-content-safe-area-inset-top, 0px)); padding-bottom: calc(16px + max(env(safe-area-inset-bottom), var(--tg-content-safe-area-inset-bottom, 0px))); }
  .auth-card { padding: 28px 24px; border-radius: 22px; }
  .auth-legal-footer { min-height: 56px; font-size: 11px; line-height: 1.6; }
  .auth-legal-links { font-size: 11px; line-height: 1.6; }
}
@media (max-width: 360px) {
  .auth-legal-links { width: calc(100% + 16px); margin-inline: -8px; font-size: 9.5px; gap: 5px; }
}