.cofia-mfa { width: min(420px, calc(100vw - 48px)); padding: 28px; border: 1px solid #d6dce5; border-radius: 12px; background: white; color: #172235; font: 15px/1.5 system-ui, sans-serif; box-shadow: 0 16px 60px #0004; }
.cofia-mfa::backdrop { background: #0b152ac9; }
.cofia-mfa h2 { margin: 0 0 12px; font-size: 22px; }
.cofia-mfa label { display: block; margin-top: 18px; }
.cofia-mfa input { display: block; width: 100%; box-sizing: border-box; margin-top: 6px; padding: 12px; font-size: 22px; letter-spacing: 5px; border: 1px solid #78879a; border-radius: 6px; }
.cofia-mfa-key { display: block; overflow-wrap: anywhere; padding: 12px; background: #f0f3f8; user-select: all; }
.cofia-mfa-key[hidden] { display: none; }
.cofia-mfa-actions { display: flex; gap: 10px; }
.cofia-mfa button { padding: 10px 18px; border-radius: 6px; cursor: pointer; }
.cofia-mfa button[type=submit] { background: #1745bd; color: white; border: 1px solid #1745bd; }
.cofia-mfa button:disabled { opacity: .6; cursor: wait; }

.cofia-mfa { box-sizing: border-box; max-height: calc(100dvh - 48px); overflow-y: auto; }
.cofia-mfa-qr svg { display: block; width: 232px; max-width: 100%; height: auto; margin: 18px auto; background: white; }
.cofia-mfa-qr[hidden] { display: none; }
.cofia-mfa-manual { margin: 14px 0; font-size: 13px; }
.cofia-mfa-manual summary { cursor: pointer; }
.cofia-mfa-account { overflow-wrap: anywhere; }
.cofia-mfa-actions { flex-wrap: wrap; }
.cofia-mfa-actions[hidden], .cofia-mfa-recovery-codes[hidden] { display: none; }
.cofia-mfa-help { color: #526174; font-size: 13px; }
.cofia-mfa-link { margin-top: 12px; background: none; border: 0; text-decoration: underline; }
.cofia-mfa-recovery-codes { padding: 12px; list-style: none; background: #f0f3f8; border-radius: 6px; }
.cofia-mfa-recovery-codes li { padding: 4px 0; overflow-wrap: anywhere; font-size: 12px; }
