.dx-ssp-area {
    box-sizing: border-box;
    width: 100%;
}

[data-ssp-slot-shell][hidden] {
    display: none !important;
}

.dx-ssp-slot {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    overflow: visible;
    border-radius: 0;
    background: transparent;
}

.dx-ssp-slot a {
    color: inherit;
    border: 0;
}

.dx-ssp-slot img,
.dx-ssp-slot video {
    display: block;
    max-width: 100%;
}

/* 横幅恢复旧版 950×110 的展示比例，平台素材比例不同时直接拉伸铺满。 */
.horizontal-banner .dx-ssp-slot--banner {
    width: 100%;
    max-width: none;
    margin: 0;
}

/* 懒挂载前先按旧比例占位，否则空容器在长列表底部不会进入 IntersectionObserver。 */
.horizontal-banner .dx-ssp-slot--banner:not([data-ssp-filled="1"]) {
    aspect-ratio: 950 / 110;
}

.horizontal-banner .dx-ssp-slot--banner [data-ssp-render-root] > a,
.horizontal-banner .dx-ssp-slot--banner [data-ssp-banner-item],
.horizontal-banner .dx-ssp-slot--banner [data-ssp-feed-media],
.horizontal-banner .dx-ssp-slot--banner [data-ssp-render-root] > [data-ssp-media-wrap] {
    position: relative !important;
    box-sizing: border-box;
    width: 100% !important;
    height: auto !important;
    padding-top: 0 !important;
    aspect-ratio: 950 / 110 !important;
    overflow: hidden !important;
}

.horizontal-banner .dx-ssp-slot--banner [data-ssp-render-root],
.horizontal-banner .dx-ssp-slot--banner [data-ssp-banner-list] {
    width: 100% !important;
    max-width: none !important;
}

.horizontal-banner .dx-ssp-slot--banner [data-ssp-banner-item] > div,
.horizontal-banner .dx-ssp-slot--banner [data-ssp-feed-media] > div,
.horizontal-banner .dx-ssp-slot--banner [data-ssp-media-wrap] > div,
.horizontal-banner .dx-ssp-slot--banner a > [data-ssp-media-wrap] {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.horizontal-banner .dx-ssp-slot--banner img,
.horizontal-banner .dx-ssp-slot--banner video {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: fill !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* 图标广告沿用旧版十列/移动端五列布局及旧标题样式。 */
.dx-ssp-area--icon,
.dx-ssp-slot--icon {
    margin: 0;
    padding: 0;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid] {
    display: grid !important;
    grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
    gap: 0 !important;
    width: 100% !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-item] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    margin-bottom: 1rem !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-item] > a {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    align-items: center !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-media] {
    position: relative !important;
    width: 55% !important;
    height: auto !important;
    padding-top: 0 !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 auto .3rem !important;
    overflow: hidden !important;
    border-radius: .625rem !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-media] > div {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-media] img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    object-fit: fill !important;
    border-radius: .625rem !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-caption] {
    width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #bcbcbc !important;
    font-size: .65rem !important;
    line-height: 1.3 !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.article-bottom-apps .dx-ssp-slot--icon [data-ssp-description],
.article-bottom-apps .dx-ssp-slot--icon [data-ssp-cta] {
    display: none !important;
}

.dx-ssp-icon-group {
    margin: 1rem 0;
}

.dx-ssp-icon-group .article-bottom-apps,
.dx-ssp-icon-group .dx-ssp-slot {
    display: block;
    width: 100%;
}

/* 文字广告恢复旧版四列按钮样式。 */
.txt-apps.dx-ssp-area--text {
    display: block;
    margin-bottom: 1rem;
}

.txt-apps .dx-ssp-slot--text {
    padding: 0;
}

.txt-apps .dx-ssp-slot--text [data-ssp-grid] {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    column-gap: .75rem !important;
    row-gap: 1rem !important;
    width: 100% !important;
}

.txt-apps .dx-ssp-slot--text [data-ssp-grid-item] {
    min-width: 0 !important;
}

.txt-apps .dx-ssp-slot--text [data-ssp-grid-text] {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: .5rem 0 !important;
    overflow: hidden !important;
    color: #bcbcbc !important;
    font-size: inherit !important;
    line-height: normal !important;
    text-align: center !important;
    text-decoration: none !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    border: 1px solid #5e5c5c !important;
    border-radius: 4px !important;
}

.txt-apps .dx-ssp-slot--text [data-ssp-grid-text]:hover {
    color: #1abc9c !important;
    border-color: #1abc9c !important;
}

/* 悬浮广告保留旧版位置及 80×80/100×100 的实际页面尺寸。 */
#adFloat.xqbj-component-adfloat.dx-ssp-area {
    position: fixed;
    right: 1.875rem;
    bottom: 3.9375rem;
    left: auto;
    z-index: 9999;
    display: none;
    width: auto;
}

#adFloat.xqbj-component-adfloat .banner-swiper,
#adFloat.xqbj-component-adfloat .banner-swiper .swiper-wrapper {
    position: relative;
    box-sizing: border-box;
    width: 5rem;
    height: 5rem;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#adFloat.xqbj-component-adfloat .dx-ssp-slot,
#adFloat.xqbj-component-adfloat [data-ssp-render-root],
#adFloat.xqbj-component-adfloat [data-ssp-grid],
#adFloat.xqbj-component-adfloat [data-ssp-grid-item],
#adFloat.xqbj-component-adfloat [data-ssp-grid-item] > a,
#adFloat.xqbj-component-adfloat [data-ssp-grid-media] {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
}

#adFloat.xqbj-component-adfloat .dx-ssp-slot--icon-float.swiper-wrapper,
#adFloat.xqbj-component-adfloat .dx-ssp-slot--icon-float .swiper-slide,
#adFloat.xqbj-component-adfloat .dx-ssp-slot--icon-float .swiper-slide > a,
#adFloat.xqbj-component-adfloat .dx-ssp-slot--icon-float .swiper-slide > div {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

#adFloat.xqbj-component-adfloat .dx-ssp-float-rotator {
    position: relative !important;
    display: block !important;
    transform: none !important;
    transition: none !important;
}

#adFloat.xqbj-component-adfloat .dx-ssp-slot--icon-float .swiper-slide {
    position: absolute !important;
    inset: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
}

#adFloat.xqbj-component-adfloat [data-ssp-grid] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}

#adFloat.xqbj-component-adfloat [data-ssp-grid-media] > div {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

#adFloat.xqbj-component-adfloat img,
#adFloat.xqbj-component-adfloat video {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    object-fit: cover !important;
}

#adFloat.xqbj-component-adfloat [data-ssp-grid-caption],
#adFloat.xqbj-component-adfloat [data-ssp-description],
#adFloat.xqbj-component-adfloat [data-ssp-cta] {
    display: none !important;
}

/* 首页图标弹窗复用旧版自营弹窗的响应式尺寸，服务端素材按可用区域缩放。 */
.dx-ssp-icon-popup .popup-container .popup-content {
    display: flex;
    width: 100%;
    max-width: 80vw;
    max-height: 80vh;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.dx-ssp-icon-popup .popup-container .popup-picture {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-align: center;
}

.dx-ssp-icon-popup .popup-container .popup-picture img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 50vw;
    max-height: 70vh;
    margin: 0 auto;
    object-fit: fill;
    border-radius: 0;
}

.dx-ssp-icon-popup .popup-container .popup-close {
    position: relative;
    z-index: 9;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    margin-bottom: -20px;
    padding: 0;
    cursor: pointer;
    background: transparent url('../../images/ads-close.png') center / 100% 100% no-repeat;
    border: 0;
}

@media screen and (min-width: 750px) and (max-width: 960px) {
    .dx-ssp-icon-popup .popup-container .popup-picture {
        width: 60%;
    }
}

@media screen and (min-width: 960px) {
    .dx-ssp-icon-popup .popup-container .popup-picture {
        width: 40%;
    }
}

@media screen and (max-width: 768px) {
    .dx-ssp-icon-popup .popup-container .popup-picture {
        width: 100%;
    }

    .dx-ssp-icon-popup .popup-container .popup-picture img {
        width: 100%;
        height: auto;
        max-width: 80vw;
    }
}

.dx-ssp-popup-backdrop > div:first-child > div:first-child {
    width: min(var(--dx-ssp-popup-width, 270px), 80vw) !important;
    height: min(var(--dx-ssp-popup-height, 480px), 70vh) !important;
    max-width: 80vw !important;
    max-height: 70vh !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    border-radius: 0 !important;
}

.dx-ssp-popup-backdrop > div:first-child > div:first-child > div:first-child {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
}

.dx-ssp-popup-backdrop > div:first-child > div:first-child > div:first-child > div {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.dx-ssp-popup-backdrop > div:first-child > div:first-child img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: fill !important;
    border-radius: 0 !important;
}

.dx-ssp-popup-backdrop > div:first-child > div:first-child > div:nth-child(2),
.dx-ssp-popup-backdrop > div:first-child > p {
    display: none !important;
}

.dx-ssp-popup-backdrop > div:first-child > button {
    top: -21px !important;
    right: calc(50% - 21px) !important;
    width: 42px !important;
    height: 42px !important;
    overflow: hidden !important;
    color: transparent !important;
    font-size: 0 !important;
    background: transparent url('../../images/ads-close.png') center / 100% 100% no-repeat !important;
    border: 0 !important;
}

@media (min-width: 960px) {
    #adFloat.xqbj-component-adfloat.dx-ssp-area {
        right: auto;
        bottom: 4.4375rem;
        left: 50%;
    }

    #adFloat.xqbj-component-adfloat .banner-swiper,
    #adFloat.xqbj-component-adfloat .banner-swiper .swiper-wrapper {
        width: 6.25rem;
        height: 6.25rem;
    }
}

@media (max-width: 767px) {
    .article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid] {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }

    .article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-media] {
        width: 70% !important;
    }

    .txt-apps .dx-ssp-slot--text [data-ssp-grid-text] {
        font-size: .9rem !important;
    }
}

@media (max-width: 414px) {
    .article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-caption] {
        font-size: .725rem !important;
    }

    .txt-apps .dx-ssp-slot--text [data-ssp-grid-text] {
        font-size: .75rem !important;
    }
}

@media (max-width: 390px) {
    .article-bottom-apps .dx-ssp-slot--icon [data-ssp-grid-caption] {
        font-size: .625rem !important;
    }
}

@media (max-width: 375px) {
    .txt-apps .dx-ssp-slot--text [data-ssp-grid-text] {
        font-size: .65rem !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1301px) {
    #adFloat.xqbj-component-adfloat { transform: translateX(-50%) translateX(1.875rem) translateX(24.25rem); }
}

@media screen and (min-width: 1302px) and (max-width: 1599px) {
    #adFloat.xqbj-component-adfloat { transform: translateX(-50%) translateX(1.875rem) translateX(30rem); }
}

@media screen and (min-width: 1600px) and (max-width: 1999px) {
    #adFloat.xqbj-component-adfloat { transform: translateX(-50%) translateX(1.875rem) translateX(32rem); }
}

@media screen and (min-width: 2000px) {
    #adFloat.xqbj-component-adfloat { transform: translateX(-50%) translateX(1.875rem) translateX(32.5rem); }
}
