:root {
    --hq-overlay-bg: rgba(0, 0, 0, 0.45);
    --hq-overlay-transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.modal-overlay:not(.friendlink-modal .modal-overlay),
.popup-overlay,
.search-modal-overlay,
.lightbox-overlay,
.mobile-menu-overlay,
.notice-modal,
.icon-selector-modal-overlay,
.purchase-modal-overlay,
.recharge-modal-overlay,
.points-purchase-modal-overlay,
.friendlink-modal-overlay,
.zoom-modal,
.add-feature-modal-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: var(--hq-overlay-bg) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 1000 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: var(--hq-overlay-transition) !important;
    cursor: pointer !important;
}

.dialog-overlay,
.hq-login-overlay,
.friendlink-modal .modal-overlay,
.purchase-modal .purchase-modal-overlay,
.recharge-modal .recharge-modal-overlay,
.points-purchase-modal .points-purchase-modal-overlay,
.checkin-modal-overlay,
.huoqiao-slider-captcha-overlay,
.hq-s-overlay {
    background-color: var(--hq-overlay-bg) !important;
}

.modal-overlay.active,
.popup-overlay.active,
.search-modal-overlay.active,
.lightbox-overlay.active,
.mobile-menu-overlay.active,
.menu-overlay.active,
.notice-modal.active,
.icon-selector-modal.active,
.purchase-modal.active,
.recharge-modal.active,
.points-purchase-modal.active,
.friendlink-modal.active,
.modal-overlay.is-open,
.popup-overlay.is-open,
.zoom-modal.active,
.add-feature-modal-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
}

.purchase-modal.show .purchase-modal-overlay,
.recharge-modal.active .recharge-modal-overlay,
.points-purchase-modal.show .points-purchase-modal-overlay,
.checkin-modal.active .checkin-modal-overlay,
.huoqiao-slider-captcha-modal.active .huoqiao-slider-captcha-overlay,
.hq-s-overlay.active,
.hq-login-modal.active .hq-login-overlay {
    opacity: 1 !important;
    visibility: visible !important;
}

.modal-overlay:not(.active):not(.is-open),
.popup-overlay:not(.active):not(.is-open),
.search-modal-overlay:not(.active):not(.is-open),
.lightbox-overlay:not(.active):not(.is-open),
.mobile-menu-overlay:not(.active):not(.is-open),
.menu-overlay:not(.active):not(.is-open),
.notice-modal:not(.active),
.icon-selector-modal:not(.active):not(.is-open),
.purchase-modal:not(.active):not(.is-open),
.recharge-modal:not(.active):not(.is-open),
.points-purchase-modal:not(.active):not(.is-open),
.friendlink-modal:not(.active):not(.is-open),
.zoom-modal:not(.active),
.points-purchase-modal:not(.show):not(.active),
.add-feature-modal-overlay:not(.active):not(.show),
.checkin-modal:not(.active),
.huoqiao-slider-captcha-modal:not(.active),
.hq-s-overlay:not(.active) {
    pointer-events: none !important;
}

.modal-container,
.modal-content,
.popup-content,
.dialog-content,
.lightbox-content,
.notice-modal-content,
.icon-selector-modal-content,
.purchase-modal-content,
.recharge-modal .modal-content,
.points-purchase-modal-content,
.friendlink-modal-content,
.add-feature-modal,
.checkin-modal-container,
.huoqiao-slider-captcha-container {
    position: relative !important;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(var(--hq-container-blur)) !important;
    -webkit-backdrop-filter: blur(var(--hq-container-blur)) !important;
    border: 1px solid rgba(var(--hq-container-border-rgb), 0.3) !important;
    border-radius: 16px !important;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15), 0 8px 20px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(20px) scale(0.96) !important;
    opacity: 0 !important;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    cursor: default !important;
    max-height: 90vh !important;
    overflow: hidden !important;
}

.modal-overlay.active .modal-container,
.modal-overlay.active .modal-content,
.popup-overlay.active .popup-content,
.dialog-overlay.active .dialog-content,
.lightbox-overlay.active .lightbox-content,
.notice-modal.active .notice-modal-content,
.icon-selector-modal.active .icon-selector-modal-content,
.purchase-modal.show .purchase-modal-content,
.recharge-modal.active .modal-content,
.points-purchase-modal.show .points-purchase-modal-content,
.friendlink-modal.active .modal-content,
.modal-overlay.is-open .modal-container,
.modal-overlay.is-open .modal-content,
.popup-overlay.is-open .popup-content,
.add-feature-modal-overlay.active .add-feature-modal,
.checkin-modal.active .checkin-modal-container,
.huoqiao-slider-captcha-modal.active .huoqiao-slider-captcha-container {
    transform: translateY(0) scale(1) !important;
    opacity: 1 !important;
}

.hq-search-overlay {
    background-color: var(--hq-overlay-bg) !important;
}

.new-mobile-menu-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: var(--hq-overlay-bg) !important;
    z-index: 87 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: var(--hq-overlay-transition) !important;
    pointer-events: none !important;
}

.new-mobile-menu-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.menu-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: var(--hq-overlay-bg) !important;
    z-index: 80 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: var(--hq-overlay-transition) !important;
}

.menu-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
}