.staff-mfa[hidden], .staff-mfa [hidden] { display: none !important; }
.staff-mfa { color: #15255e; max-width: 100%; overflow-wrap: anywhere; text-align: left; }
.staff-mfa h2 { font-size: clamp(1.35rem, 4vw, 1.75rem); margin: 10px 0; }
.staff-mfa p { line-height: 1.55; font-size: 0.95rem; }
.staff-mfa-badge { color: #3459c9; font-weight: 800; letter-spacing: 0.1em; font-size: 0.75rem !important; }
.staff-mfa img { display: block; width: min(224px, 100%); height: auto; margin: 16px auto; background: white; }
.staff-mfa form { display: grid; gap: 12px; margin-top: 18px; }
.staff-mfa label { font-weight: 700; }
.staff-mfa input, .staff-mfa select { box-sizing: border-box; width: 100%; min-height: 48px; border: 1px solid #bdc9e8; border-radius: 12px; background: white; padding: 12px; font-size: 18px; color: #15255e; }
.staff-mfa input { letter-spacing: 0.22em; }
.staff-mfa button { min-height: 48px; width: 100%; padding: 12px 18px; border: 0; border-radius: 12px; background: #182967; color: white; font: inherit; font-weight: 700; cursor: pointer; }
.staff-mfa button:disabled { opacity: 0.6; cursor: wait; }
.staff-mfa .staff-mfa-secondary { background: #edf1fb; color: #182967; margin-top: 8px; }
.staff-mfa code { display: block; padding: 14px; margin: 10px 0; background: #edf1fb; user-select: all; font-size: 16px; }
.staff-mfa details { border: 1px solid #dbe2f3; border-radius: 12px; padding: 12px; }
.staff-mfa summary { cursor: pointer; font-weight: 700; line-height: 1.5; }
.staff-mfa-warning, .staff-mfa-help { color: #657292; font-size: 0.85rem !important; }
#staff-mfa-message { color: #ac3535; }
.staff-security-button { border: 1px solid #c9d3ec; border-radius: 10px; background: white; color: #182967; padding: 10px 14px; min-height: 44px; font: inherit; cursor: pointer; }
@media (max-width: 600px) {
  .staff-mfa { padding-bottom: env(safe-area-inset-bottom, 12px); }
  .login-panel:has(.staff-mfa:not([hidden])), .login-card:has(.staff-mfa:not([hidden])) { padding: 22px 18px; width: 100%; box-sizing: border-box; }
}