.dialog-full-size.two-factor-dialog {
    box-sizing: border-box;
    width: min(32rem, calc(100vw - 2rem));
    min-width: 0;
    padding: 1.25rem;
    border-radius: 1.2rem;
    box-shadow: 0 24px 80px rgba(15, 23, 42, .22);
}
.two-factor-dialog .dialog-header { font-size: .85rem; color: #64748b; font-weight: 600; }
.two-factor-dialog .dialog-close { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; box-shadow: none; }
.two-factor-dialog .dialog-close:hover { background: #e2e8f0; color: #172033; }
.two-factor-dialog .dialog-content { padding: .25rem .5rem .5rem; }
.two-factor-form { display: grid; gap: 1.1rem; margin: 0; color: #172033; }
.two-factor-form [hidden] { display: none !important; }
.two-factor-intro { display: grid; justify-items: center; gap: .65rem; text-align: center; }
.two-factor-emblem { display: grid; place-items: center; width: 3.7rem; height: 3.7rem; border-radius: 1.15rem; background: #eff6ff; color: #2563eb; font-size: 1.65rem; border: 1px solid #dbeafe; }
.two-factor-eyebrow { color: #2563eb; font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.two-factor-intro h2 { margin: 0; font-size: 1.4rem; line-height: 1.25; letter-spacing: -.025em; color: inherit; }
.two-factor-intro p { margin: 0; color: #64748b; font-size: .9rem; line-height: 1.6; overflow-wrap: anywhere; }
.two-factor-recipient { display: flex; align-items: center; gap: .8rem; padding: .8rem 1rem; border: 1px solid #e2e8f0; border-radius: .8rem; background: #f8fafc; }
.two-factor-recipient > i { color: #2563eb; font-size: 1.15rem; }
.two-factor-recipient span { min-width: 0; display: grid; gap: .2rem; }
.two-factor-recipient small { color: #64748b; font-size: .75rem; }
.two-factor-recipient strong { font-size: .9rem; overflow-wrap: anywhere; }
.two-factor-code-label { display: grid; gap: .55rem; font-size: .82rem; font-weight: 700; }
.two-factor-dialog .dialog-content input.two-factor-code {
    width: 100%; min-width: 0; height: 3.7rem; margin: 0; padding: .6rem .4rem .6rem .8rem;
    border: 1.5px solid #cbd5e1; border-radius: .8rem; background: #fff; color: #172033;
    font: 600 1.8rem ui-monospace, SFMono-Regular, Consolas, monospace;
    letter-spacing: .4em; text-align: center; box-shadow: 0 2px 4px rgba(15,23,42,.03);
}
.two-factor-dialog .dialog-content input.two-factor-code::placeholder { color: #94a3b8; opacity: .65; }
.two-factor-dialog .dialog-content input.two-factor-code:focus { outline: 3px solid rgba(37,99,235,.15); outline-offset: 2px; border-color: #2563eb; }
.two-factor-expiry { display: flex; justify-content: center; align-items: center; gap: .4rem; margin: -.4rem 0 0; font-size: .75rem; color: #64748b; }
.two-factor-error { margin: 0; padding: .75rem; border: 1px solid #fecaca; border-radius: .65rem; background: #fef2f2; color: #b91c1c; font-size: .85rem; line-height: 1.5; }
.two-factor-error:empty { display: none; }
.two-factor-actions { display: grid; gap: .4rem; }
.two-factor-dialog .two-factor-actions button { box-sizing: border-box; width: 100%; min-height: 2.8rem; margin: 0; padding: .7rem 1rem; border-radius: .7rem; font-size: .9rem; font-weight: 700; display: flex; justify-content: center; align-items: center; gap: .55rem; cursor: pointer; }
.two-factor-dialog button.two-factor-submit { color: #fff; background: #2563eb; border: 1px solid #2563eb; box-shadow: 0 4px 10px rgba(37,99,235,.16); }
.two-factor-dialog button.two-factor-submit:hover { background: #1d4ed8; }
.two-factor-dialog button.two-factor-cancel { color: #64748b; background: transparent; border: 1px solid transparent; box-shadow: none; }
.two-factor-dialog button.two-factor-cancel:hover { background: #f1f5f9; color: #172033; }
.two-factor-dialog .two-factor-actions button:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
.two-factor-dialog button.two-factor-submit:disabled { opacity: .65; cursor: wait; }
.two-factor-help { padding-top: .9rem; margin: 0; border-top: 1px solid #e2e8f0; font-size: .75rem; color: #64748b; line-height: 1.55; text-align: center; }
body.darkmode .two-factor-form { color: var(--darkmode-text-color, #e2e8f0); }
body.darkmode .two-factor-intro p, body.darkmode .two-factor-help, body.darkmode .two-factor-expiry,
body.darkmode .two-factor-recipient small, body.darkmode .two-factor-dialog .dialog-header,
body.darkmode .two-factor-dialog button.two-factor-cancel { color: #a8b5ca; }
body.darkmode .two-factor-emblem { background: #172b4d; border-color: #29466f; color: #93c5fd; }
body.darkmode .two-factor-eyebrow, body.darkmode .two-factor-recipient > i { color: #93c5fd; }
body.darkmode .two-factor-recipient { background: var(--darkmode-surface-color-soft, #1e293b); border-color: #334155; }
body.darkmode .two-factor-dialog .dialog-content input.two-factor-code { background: var(--darkmode-surface-color-soft, #1e293b); border-color: #52637b; color: #f1f5f9; }
body.darkmode .two-factor-dialog .dialog-content input.two-factor-code:focus { border-color: #60a5fa; }
body.darkmode .two-factor-dialog .dialog-close { background: #334155; border-color: #475569; color: #cbd5e1; }
body.darkmode .two-factor-help { border-color: #334155; }
body.darkmode .two-factor-error { background: #3a2029; border-color: #7f3547; color: #fda4af; }
body.darkmode .two-factor-dialog button.two-factor-cancel:hover { background: #334155; }
@media (max-width: 650px) {
    .dialog-full-size.two-factor-dialog { left: .5rem; right: .5rem; width: auto; padding: 1rem; height: auto !important; max-height: calc(100dvh - 4.5rem) !important; }
    .two-factor-dialog .dialog-content { padding: .2rem .15rem .3rem; }
    .two-factor-intro h2 { font-size: 1.25rem; }
    .two-factor-form { gap: .9rem; }
}