main { padding-bottom: env(safe-area-inset-bottom); }
.login-hero, .hero { padding: 132px 24px 36px; }
.login-hero h1, .hero h1 { line-height: 1.15; text-wrap: balance; }
.login-card, .card { width: calc(100% - 32px); margin: 0 auto 64px; }
.form-row input, .form-row select, #twofa-code { min-height: 48px; font-size: 16px !important; }
.form-meta { flex-wrap: wrap; gap: 8px 20px; }
.form-meta > span { flex-wrap: wrap; }
.form-meta a, .checkbox { display: inline-flex; align-items: center; min-height: 44px; }
.primary-btn, .secondary-btn { min-height: 48px; font-family: inherit; line-height: 1.4; }
.primary-btn { background: #0b806e; border-color: #0b806e; }
.primary-btn:hover { background: #086b5c; border-color: #086b5c; }
.form-meta a, .alt-actions a, .terms-copy a { color: #0b806e; }
.primary-btn:disabled, .secondary-btn:disabled { cursor: wait; opacity: .65; transform: none; }
main a:focus-visible, main button:focus-visible, main input:focus-visible, main select:focus-visible {
  outline: 3px solid var(--primary-dark); outline-offset: 3px;
}
.terms-row { min-height: 48px; align-items: flex-start; }
.terms-row input { flex: 0 0 22px; width: 22px; height: 22px; margin-top: 2px; }
.terms-copy { padding: 2px 0 12px; font-size: 13px; }
#login-status, #signup-status { line-height: 1.6; overflow-wrap: anywhere; }
.login-card .status-box { font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.login-card .status-box.err { color: #b42318; }
.login-card .status-box.ok { color: #0b806e; }
.login-card a.primary-btn { text-decoration: none; text-align: center; }
.login-card [hidden] { display: none !important; }
.google-button { width: 100%; min-height: 44px; display: flex; justify-content: center; }
.auth-divider { display: flex; align-items: center; gap: 16px; margin: 24px 0; color: var(--body); font-size: 13px; text-align: center; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; background: var(--sand); flex: 1; }
.google-status { margin: 12px 0; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.google-status:empty { display: none; }
#google-registration h2 { font-size: 24px; line-height: 1.3; margin-bottom: 16px; }
.google-identity, .google-password-hint { font-size: 13px; line-height: 1.6; margin-bottom: 20px; overflow-wrap: anywhere; color: var(--body); }
#google-country { width: 100%; padding: 12px; border: 1.5px solid var(--sand); border-radius: 12px; background: #fff; color: var(--ink); font-family: inherit; }
@media (max-width: 600px) {
  .login-hero, .hero { padding: 112px 24px 28px; }
  .login-hero h1, .hero h1 { font-size: clamp(26px, 7vw, 32px); letter-spacing: -.7px; }
  .login-hero p, .hero p { font-size: 15px; }
  .login-card, .card { padding: 24px; border-radius: 20px; }
  .form-meta { align-items: flex-start; flex-direction: column; gap: 0; }
}
@media (max-width: 360px) {
  .login-card, .card { padding: 20px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  main *, main *::before, main *::after { transition: none !important; scroll-behavior: auto !important; }
}