/* Isolated OTP preview. Reuses portal card, form, button, and brand tokens. */
.auth-card #loginForm[hidden], .auth-card .otp-signin[hidden], .auth-card .auth-alt[hidden] { display: none !important; }
.otp-signin { gap: 12px; }
.otp-signin-step { margin: 0; color: var(--yellow-deep); font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.otp-signin-step span { color: var(--red-primary); padding: 0 5px; }
.otp-signin-lead { margin: 0 0 4px; color: var(--text); font-size: 14px; line-height: 1.55; }
.otp-signin-lead strong { color: var(--ink); overflow-wrap: anywhere; }
.otp-signin #otpCode { width: 100%; box-sizing: border-box; font-size: 22px; font-weight: 700; letter-spacing: .32em; font-variant-numeric: tabular-nums; }
.otp-signin-expiry { margin: -2px 0 0; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.otp-signin-status { min-height: 1.3em; margin: 0; color: var(--red-primary); font-size: 13px; font-weight: 700; }
.otp-signin .form-error[hidden] { display: none !important; }
.otp-signin-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 15px; }
.otp-signin-actions button { border: 0; padding: 8px 0; background: none; color: var(--red-primary); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.otp-signin-actions button:disabled { color: var(--muted); cursor: default; }
.otp-signin-actions button:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; border-radius: 3px; }
.otp-signin-actions #otpCountdown { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; margin-right: auto; }
.auth-card .btn:disabled { opacity: .65; cursor: progress; }
@media (max-width: 520px) {
  .otp-signin-actions { gap: 4px 12px; }
  .otp-signin-actions #otpBack { width: 100%; text-align: left; }
  .otp-signin #otpCode { font-size: 20px; }
}