/* Final modal safety layer: load after page-level CSS. */
.modal,
.custom-modal,
.confirm-modal,
.progress-modal,
.query-modal,
.export-modal,
.seed-confirm-modal,
.puzzle-captcha-dialog,
.register-success-modal,
dialog {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: clamp(12px, 3vw, 28px) !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    box-sizing: border-box !important;
    transform: none !important;
    contain: layout style;
    z-index: 12000 !important;
}

.modal.show,
.modal.is-open,
.modal.open,
.modal.active,
.modal[style*="display: flex"],
.modal[style*="display:flex"],
.modal[style*="display: block"],
.modal[style*="display:block"],
.custom-modal.show,
.custom-modal.is-open,
.custom-modal.open,
.custom-modal.active,
.custom-modal[style*="display: flex"],
.custom-modal[style*="display:flex"],
.custom-modal[style*="display: block"],
.custom-modal[style*="display:block"],
.confirm-modal.show,
.confirm-modal.is-open,
.confirm-modal.open,
.confirm-modal.active,
.confirm-modal[style*="display: flex"],
.confirm-modal[style*="display:flex"],
.confirm-modal[style*="display: block"],
.confirm-modal[style*="display:block"],
.progress-modal.show,
.progress-modal.is-open,
.progress-modal.open,
.progress-modal.active,
.progress-modal[style*="display: flex"],
.progress-modal[style*="display:flex"],
.progress-modal[style*="display: block"],
.progress-modal[style*="display:block"],
.query-modal.show,
.query-modal.is-open,
.query-modal.open,
.query-modal.active,
.query-modal[style*="display: flex"],
.query-modal[style*="display:flex"],
.query-modal[style*="display: block"],
.query-modal[style*="display:block"],
.export-modal.show,
.export-modal.is-open,
.export-modal.open,
.export-modal.active,
.export-modal[style*="display: flex"],
.export-modal[style*="display:flex"],
.export-modal[style*="display: block"],
.export-modal[style*="display:block"],
.seed-confirm-modal.show,
.seed-confirm-modal.is-open,
.seed-confirm-modal.open,
.seed-confirm-modal.active,
.puzzle-captcha-dialog.show,
.puzzle-captcha-dialog.is-open,
.puzzle-captcha-dialog.open,
.puzzle-captcha-dialog.active,
.register-success-modal.show,
.register-success-modal.is-open,
.register-success-modal.open,
.register-success-modal.active,
.register-success-modal[style*="display: flex"],
.register-success-modal[style*="display:flex"],
.register-success-modal[style*="display: block"],
.register-success-modal[style*="display:block"],
dialog[open] {
    display: flex !important;
}

.modal > .modal-content,
.custom-modal > .custom-modal-content,
.confirm-modal > .modal-content,
.confirm-modal > .confirm-content,
.progress-modal > .modal-content,
.progress-modal > .progress-content,
.query-modal > .modal-content,
.query-modal > .query-content,
.export-modal > .export-modal-content,
.seed-confirm-modal > .seed-confirm-dialog,
.puzzle-captcha-dialog > .puzzle-captcha-panel,
.register-success-modal > .success-content,
dialog > :first-child {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: auto !important;
    width: min(94vw, 520px);
    max-height: calc(100dvh - 32px) !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    transform: none !important;
    overscroll-behavior: contain;
}

.modal.modal-managed > :first-child,
.custom-modal.modal-managed > :first-child,
.confirm-modal.modal-managed > :first-child,
.progress-modal.modal-managed > :first-child,
.query-modal.modal-managed > :first-child,
.export-modal.modal-managed > :first-child,
.seed-confirm-modal.modal-managed > :first-child,
.puzzle-captcha-dialog.modal-managed > :first-child,
.register-success-modal.modal-managed > :first-child,
dialog.modal-managed > :first-child {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: auto !important;
    max-height: calc(100dvh - 32px) !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    transform: none !important;
}

.modal > .modal-content.query-result-modal,
.modal > .modal-content[style*="max-width: 900px"],
.modal > .modal-content[style*="max-width:900px"],
.custom-modal > .refresh-shared-modal-content,
.custom-modal > .lock-options-modal-content {
    width: min(94vw, 900px) !important;
}

.puzzle-captcha-dialog > .puzzle-captcha-panel {
    width: min(94vw, 430px) !important;
}

body.modal-open {
    overflow: hidden !important;
    touch-action: none;
}

@media (max-width: 768px) {
    .modal,
    .custom-modal,
    .confirm-modal,
    .progress-modal,
    .query-modal,
    .export-modal,
    .seed-confirm-modal,
    .puzzle-captcha-dialog,
    .register-success-modal,
    dialog {
        padding: calc(10px + env(safe-area-inset-top, 0px)) 10px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .modal > .modal-content,
    .custom-modal > .custom-modal-content,
    .confirm-modal > .modal-content,
    .confirm-modal > .confirm-content,
    .progress-modal > .modal-content,
    .progress-modal > .progress-content,
    .query-modal > .modal-content,
    .query-modal > .query-content,
    .export-modal > .export-modal-content,
    .seed-confirm-modal > .seed-confirm-dialog,
    .puzzle-captcha-dialog > .puzzle-captcha-panel,
    .register-success-modal > .success-content,
    dialog > :first-child {
        width: min(94vw, 520px) !important;
        max-height: calc(100dvh - 28px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    }
}