/* Private opt-in authentication only; existing global colors and typography. */
.passwordless-entry[hidden], #login-form[hidden] { display: none !important; }
.passwordless-active .login-card > .login-card__title,
.passwordless-active .login-card > .login-card__subtitle { display: none; }
.passwordless-entry .login-card__title { margin-bottom: 8px; }
.passwordless-entry .login-card__subtitle { margin-bottom: 24px; }
.passwordless-entry .google-auth { width: 100%; }
.passwordless-terms { margin: 20px 0 0; font-size: 12px; line-height: 1.6; color: var(--text-secondary); }
.passwordless-terms a { color: var(--text-primary); text-decoration: underline; text-underline-offset: 2px; }
.passwordless-entry button[type="submit"] { min-height: 46px; }
.passwordless-entry button:disabled { opacity: .7; cursor: wait; }
.passwordless-page { min-height: 70vh; display: flex; align-items: center; }
.passwordless-page .container { width: 100%; }
.passwordless-logo { display: block; text-align: center; margin: 0 auto 24px; }
.passwordless-logo img { width: 148px; height: auto; display: inline-block; }
.passwordless-error { font-size: 14px; margin-top: 14px; color: var(--danger); min-height: 22px; }
.passwordless-back { display: block; text-align: center; margin-top: 16px; color: var(--text-secondary); text-decoration: underline; }

.auth-flow-booting #login-form, .auth-flow-booting #register-form { visibility:hidden; }

.passwordless-active #account-page .account-password-section { display:none; }

/* Single accessible OTP field, native SMS/email autofill, never six detached inputs. */
.passwordless-code-form[hidden], #passwordless-email-form[hidden] { display:none !important; }
.passwordless-code-caption { font-size:14px; line-height:1.5; color:var(--text-secondary); overflow-wrap:anywhere; }
.passwordless-code-hint { font-size:12px; line-height:1.5; color:var(--text-secondary); margin:8px 0 12px; }
#passwordless-code { font-variant-numeric:tabular-nums; letter-spacing:.23em; font-size:22px; font-weight:600; text-align:center; }
.passwordless-code-controls { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:14px; }
.passwordless-code-controls button { border:0; background:transparent; padding:10px 0; min-height:44px; text-decoration:underline; color:var(--text-primary); cursor:pointer; }
.passwordless-code-controls button:disabled { color:var(--text-secondary); text-decoration:none; cursor:default; }

.passwordless-terms { max-width:38ch; margin:18px auto 0; text-align:center; text-wrap:pretty; line-height:1.65; }

/* Center the entry card in the available screen, keeping short screens scrollable. */
.auth-entry-page { position:relative; isolation:isolate; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; background:var(--bg); }
/* Move only the decorative layers, keeping the card and controls steady. */
.auth-entry-page::before,
.auth-entry-page::after {
  content:"";
  position:fixed;
  z-index:-1;
  left:-10vw;
  width:120vw;
  height:88vh;
  pointer-events:none;
  background:radial-gradient(ellipse at center,rgb(255 106 0 / 8%),rgb(255 106 0 / 3%) 42%,transparent 72%);
}
.auth-entry-page::before { top:-28vh; animation:auth-glow-top 28s ease-in-out infinite alternate; }
.auth-entry-page::after { bottom:-30vh; animation:auth-glow-bottom 34s ease-in-out infinite alternate; }
@keyframes auth-glow-top {
  from { transform:translate3d(-3vw,-1vh,0) scale(1); }
  to { transform:translate3d(3vw,3vh,0) scale(1.04); }
}
@keyframes auth-glow-bottom {
  from { transform:translate3d(3vw,2vh,0) scale(1.03); }
  to { transform:translate3d(-3vw,-2vh,0) scale(1); }
}
@media (prefers-reduced-motion:reduce) {
  .auth-entry-page::before,
  .auth-entry-page::after { animation:none; }
}
.auth-entry-page > .header { flex-shrink:0; }
.auth-entry-page > .main { flex:1; min-height:0; display:flex; align-items:center; padding:24px 0 max(24px, env(safe-area-inset-bottom)); }
.auth-entry-page > .main > .container { flex-shrink:0; }
.auth-entry-page .login-card { max-width:400px; padding:32px; border:1px solid #e8e7e4; border-radius:24px; box-shadow:0 14px 48px rgb(41 32 23 / 5%); }
.auth-entry-page .login-card__title { margin-bottom:24px; font-size:27px; line-height:1.2; letter-spacing:-.035em; font-weight:650; }
.auth-entry-page .google-auth { min-height:40px; }
.auth-entry-page .auth-divider { margin-block:20px; color:#81878e; font-size:12px; }
.auth-entry-page .form-label { margin-bottom:8px; font-size:13px; font-weight:500; }
.auth-entry-page .form-input { min-height:48px; border-radius:12px; border-color:#dedfe1; }
.auth-entry-page .form-input:focus { border-color:#d78242; box-shadow:0 0 0 3px rgb(255 106 0 / 10%); }
.auth-entry-page .passwordless-entry button[type=submit] { min-height:48px; border-radius:12px; font-size:14px; font-weight:600; }
.auth-entry-page.auth-flow-booting .login-card { visibility:hidden; }
.auth-entry-page .passwordless-terms { max-width:none; margin:18px 0 0; line-height:1.5; text-wrap:balance; }
.auth-entry-page .passwordless-terms a { white-space:nowrap; text-decoration-thickness:1px; text-underline-offset:3px; }

@media (max-width:480px) {
  .auth-entry-page .login-card { padding:26px 22px; border-radius:22px; }
  .auth-entry-page .passwordless-terms { font-size:11.5px; line-height:1.6; }
}
