.modal-open {
    overflow: hidden;
}

.modal-open .main-content {
    filter: blur(8px);
    transition: filter 0.3s ease;
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.modal-content {
    animation: modalFadeIn 0.3s ease-out forwards;
}

.modal-backdrop {
    backdrop-filter: blur(4px);
    transition: opacity 0.3s ease;
}

.modal-hidden {
    opacity: 0;
    pointer-events: none;
}

.modal-visible {
    opacity: 1;
    pointer-events: auto;
}

.main-content {
    transition: filter 0.3s ease;
    filter: blur(0);
}