.musiveo-two-factor-open { overflow:hidden; }
dialog.musiveo-two-factor {
    position:fixed; inset:0; width:min(520px, calc(100% - 32px)); max-width:520px;
    max-height:calc(100dvh - 32px); margin:auto; padding:0; border:1px solid #303034;
    border-radius:24px; background:var(--musiveo-dark-bg,#101010); color:var(--text-color,#f5f5f5);
    box-shadow:0 28px 90px #0009; overflow:auto; overscroll-behavior:contain;
}
dialog.musiveo-two-factor::backdrop { background:#000c; }
.musiveo-2fa-panel { position:relative; padding:44px 32px 28px; }
.musiveo-2fa-panel h2 { font-size:clamp(1.45rem,5vw,1.85rem); line-height:1.2; margin:20px 0 12px; font-weight:650; letter-spacing:-.025em; }
.musiveo-2fa-description,.musiveo-2fa-help { color:#b7b7bf; font-size:.95rem; line-height:1.6; overflow-wrap:anywhere; }
.musiveo-2fa-mark { display:grid; place-items:center; width:64px; height:64px; border-radius:20px; background:color-mix(in srgb,var(--color-primary,#fff) 12%,transparent); color:var(--color-primary,#fff); }
.musiveo-2fa-mark svg { width:36px; height:36px; }
.musiveo-2fa-panel .musiveo-2fa-close { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:44px; height:44px; min-width:44px; padding:0; border:0; border-radius:50%; background:transparent; color:inherit; font:30px/1 system-ui; cursor:pointer; }
.musiveo-2fa-close:hover { background:#ffffff12; }
.musiveo-2fa-code-label { display:block; font-weight:600; margin:26px 0 10px; }
.musiveo-2fa-digits { position:relative; display:grid; direction:ltr; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; width:100%; }
.musiveo-2fa-digits span { display:grid; place-items:center; height:62px; min-width:0; border:1px solid #45454c; border-radius:12px; background:#ffffff05; font:600 27px/1 ui-monospace,monospace; color:#6c6c76; }
.musiveo-2fa-digits span.has-digit { color:inherit; }
.musiveo-2fa-digits:focus-within span.is-current,.musiveo-2fa-digits:focus-within span:first-child:not(.has-digit) { border-color:var(--color-primary,#fff); outline:1px solid var(--color-primary,#fff); }
.musiveo-2fa-digits input[type=text] { position:absolute; inset:0; z-index:1; width:100% !important; height:100% !important; min-height:0 !important; max-width:none !important; opacity:0 !important; margin:0 !important; padding:0 !important; cursor:text; }
.musiveo-2fa-help { margin:14px 0 10px; font-size:.82rem; }
.musiveo-2fa-panel .musiveo-2fa-resend { display:block; min-height:40px; padding:0; border:0; background:none; color:var(--color-primary,#fff); font-size:.9rem; cursor:pointer; }
.musiveo-2fa-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:12px; margin-top:26px; }
.musiveo-2fa-panel .musiveo-2fa-actions > button {
    box-sizing:border-box; width:100% !important; max-width:none !important;
    min-width:0 !important; min-height:48px !important; height:auto !important;
    margin:0 !important; padding:12px 16px !important; border-radius:12px !important;
    align-self:stretch; font-size:14px !important; line-height:1.35 !important;
}
.musiveo-2fa-panel .musiveo-2fa-primary,.musiveo-2fa-panel .musiveo-2fa-secondary,.musiveo-2fa-settings button { display:inline-flex; align-items:center; justify-content:center; flex:1; min-width:0; min-height:48px; padding:12px 16px; border:1px solid #48484e; border-radius:12px; background:transparent; color:inherit; font-weight:600; line-height:1.35; white-space:normal; overflow-wrap:anywhere; cursor:pointer; }
.musiveo-2fa-panel button.musiveo-2fa-primary,
.musiveo-2fa-settings button[data-musiveo-2fa-start] {
    background:#fff !important; border-color:#fff !important; color:#080808 !important;
    -webkit-text-fill-color:#080808 !important; box-shadow:none !important;
}
.musiveo-2fa-panel button.musiveo-2fa-primary:hover,
.musiveo-2fa-settings button[data-musiveo-2fa-start]:hover { background:#e7e7e7 !important; }
.musiveo-2fa-panel button.musiveo-2fa-secondary,
.musiveo-2fa-panel button.musiveo-2fa-close { background:transparent !important; color:#f5f5f5 !important; -webkit-text-fill-color:#f5f5f5 !important; }
.musiveo-2fa-panel button.musiveo-2fa-resend { background:transparent !important; color:var(--color-primary,#fff) !important; -webkit-text-fill-color:currentColor !important; }
.musiveo-2fa-panel button:disabled { opacity:.55; cursor:default; }
.musiveo-2fa-panel button:focus-visible,.musiveo-2fa-settings button:focus-visible { outline:2px solid var(--color-primary,#fff); outline-offset:3px; }
.musiveo-2fa-feedback { min-height:1.5em; margin:16px 0 0; color:#b7b7bf; font-size:.9rem; }
.musiveo-2fa-feedback.is-error { color:#ffacb5; }
.musiveo-2fa-settings { max-width:42rem; padding:24px; border:1px solid #303034; border-radius:16px; background:var(--musiveo-dark-bg,#101010); color:var(--text-color,#f5f5f5); }
.musiveo-2fa-settings h2 { margin:0 0 12px; font-size:1.35rem; }
.musiveo-2fa-settings p { line-height:1.6; }
@media(max-width:600px) {
    dialog.musiveo-two-factor { width:100%; max-width:none; height:100%; height:100dvh; max-height:none; margin:0; border:0; border-radius:0; }
    .musiveo-2fa-panel { box-sizing:border-box; min-height:100%; padding:calc(76px + env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px)); }
    .musiveo-2fa-panel .musiveo-2fa-close { position:fixed; top:calc(12px + env(safe-area-inset-top,0px)); right:calc(12px + env(safe-area-inset-right,0px)); }
    .musiveo-2fa-digits { gap:6px; } .musiveo-2fa-digits span { height:56px; }
}