/* [POPUP-SYSTEM] First-load popup queue chrome — mobile lobby.
   Colours come from the admin theme tokens only (--theme-*); the white
   circled X below the card and the dark blurred mask are the platform
   census pattern (same mask treatment as the existing language dialog). */
.cxpop-overlay {
    position: fixed; inset: 0; z-index: 5000;
    background: rgba(0, 0, 0, .55);
    -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
    display: flex; align-items: center; justify-content: center;
    animation: cxpopFade .3s ease;
}
.cxpop-wrap { display: flex; flex-direction: column; align-items: center; width: 6.9rem; max-width: 92vw; }
.cxpop-card {
    width: 100%; border-radius: .24rem; overflow: hidden;
    background: var(--theme-main-bg-color); color: var(--theme-text-color);
    box-shadow: 0 .1rem .4rem rgba(0, 0, 0, .35);
    animation: cxpopZoom .3s cubic-bezier(.08, .82, .17, 1);
}
.cxpop-tabs {
    display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch;
    background: var(--theme-main-bg-color); border-bottom: 1px solid var(--theme-color-line);
}
.cxpop-tab {
    position: relative; flex: 1 0 auto; border: 0; background: transparent;
    color: var(--theme-text-color); font-size: .26rem; padding: .22rem .18rem;
    cursor: pointer; white-space: nowrap; opacity: .75;
}
.cxpop-tab-on { opacity: 1; color: var(--theme-primary-color); box-shadow: inset 0 -3px 0 var(--theme-primary-color); }
.cxpop-dot {
    position: absolute; top: .12rem; right: .1rem; width: .14rem; height: .14rem;
    border-radius: 50%; background: var(--theme-primary-color);
    border: 2px solid var(--theme-main-bg-color);
}
.cxpop-stage { position: relative; }
.cxpop-img { width: 100%; height: 5.4rem; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; }
.cxpop-nav {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
    width: .56rem; height: .56rem; border-radius: 50%; border: 0; cursor: pointer;
    background: var(--theme-primary-color); color: var(--theme-primary-font-color);
    font-size: .4rem; line-height: .56rem; text-align: center; opacity: .92;
}
.cxpop-prev { left: .14rem; }
.cxpop-next { right: .14rem; }
.cxpop-findus-title {
    font-size: .34rem; font-weight: 600; text-align: center;
    padding: .3rem .2rem .1rem; color: var(--theme-text-color);
}
.cxpop-links { padding: .14rem .3rem; }
.cxpop-link-row {
    display: flex; align-items: center; justify-content: space-between; gap: .2rem;
    padding: .16rem 0; border-bottom: 1px solid var(--theme-color-line);
}
.cxpop-link-label { font-size: .26rem; word-break: break-all; color: var(--theme-text-color); }
.cxpop-copy, .cxpop-copyall {
    border: 0; cursor: pointer; border-radius: .12rem;
    background: var(--theme-primary-color); color: var(--theme-primary-font-color);
    font-size: .24rem; padding: .12rem .24rem; flex: 0 0 auto;
}
.cxpop-copyall { display: block; margin: .2rem auto .3rem; }
.cxpop-toast {
    text-align: center; font-size: .24rem; padding: 0 0 .24rem;
    color: var(--theme-primary-color);
}
.cxpop-dsa {
    margin-top: .26rem; display: inline-flex; align-items: center; gap: .12rem;
    background: rgba(255, 255, 255, .16); color: #fff;
    font-size: .24rem; padding: .12rem .26rem; border-radius: 999px; cursor: pointer;
}
.cxpop-dsa-box { width: .3rem; height: .3rem; accent-color: var(--theme-primary-color); }
.cxpop-x {
    margin-top: .3rem; width: .62rem; height: .62rem; border-radius: 50%;
    border: 2px solid #fff; background: transparent; color: #fff;
    font-size: .4rem; line-height: 1; cursor: pointer;
    display: flex; align-items: center; justify-content: center; padding: 0;
}
@keyframes cxpopFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes cxpopZoom { from { opacity: 0; transform: scale(.92); } to { opacity: 1; transform: scale(1); } }
