/* ============================================
   VIP 会员等级扩展样式 (3/4/5 级)
   三级殿堂(深蓝宝石) / 四级典藏(深祖母绿) / 五级至尊(赤金)
   放置于 panda 子主题，zibll 升级不会丢失
   ============================================ */

/* ---------- 三级会员：殿堂炼丹师（深蓝宝石） ---------- */
.vip-theme3 {
    background: linear-gradient(132deg, #5b8db8 0%, #1c3a5e 35%, #2a5580 70%, #1e3d63 100%) rgba(107, 106, 102, 0.3);
    color: #d8e8f7;
}

.vip-theme3 .vip-baicon {
    color: #2a3a4a;
}

.vip-theme3 .payvip-button {
    background: linear-gradient(270deg, #9fb6cc, #d6e4f2 45%, #eaf2fa);
    color: #123253;
    --this-color: #123253;
}

/* ---------- 四级会员：典藏炼丹师（深祖母绿） ---------- */
.vip-theme4 {
    background: linear-gradient(132deg, #3f8f70 0%, #144434 35%, #1f6350 70%, #164a3b 100%) rgba(107, 106, 102, 0.3);
    color: #d5efe3;
}

.vip-theme4 .vip-baicon {
    color: #24382f;
}

.vip-theme4 .payvip-button {
    background: linear-gradient(270deg, #9fc2b2, #d4e8de 45%, #e9f4ef);
    color: #0f3d2e;
    --this-color: #0f3d2e;
}

/* ---------- 五级会员：至尊炼丹师（赤金） ---------- */
.vip-theme5 {
    background: linear-gradient(132deg, #f2927a 0%, #b32b2b 30%, #c93a30 80%, #b52c26) rgba(107, 106, 102, 0.3);
    color: #ffeeee;
}

.vip-theme5 .vip-baicon {
    color: #6b3a3a;
}

.vip-theme5 .payvip-button {
    background: linear-gradient(270deg, #d8b08a, #f5e2c8 45%, #fdf2e2);
    color: #6b2418;
    --this-color: #6b2418;
}

/* ============================================
   用户中心(/user/) VIP tab：多等级卡片自适应排版
   原本只放 2 个(各50%)，扩到 5 级后需自动换行
   ============================================ */
.vip-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
}

.vip-cards-grid > .pay-vip-info {
    min-width: 0; /* 防止内容撑破网格 */
}

@media (max-width: 768px) {
    .vip-cards-grid {
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
        gap: 10px;
    }
}

/* ===== VIP ICON SIZE x2 =====
   开通界面(会员卡片) + 个人中心(VIP卡片) 图标放大一倍
   原尺寸：.v-iconbox .v-icon 40px / .vip-card .vip-img 70px / .vip-cardmini .vip-icon 2em
   ============================ */

/* 个人中心 VIP 卡片图标：40px -> 150px */
.pay-vip-info .v-iconbox .v-icon {
    font-size: 150px;
}

/* 开通界面 会员卡片图标：70px -> 250px */
.vip-card .vip-img {
    font-size: 250px;
}

/* 开通弹窗 小卡片图标：2em -> 7em */
.vip-cardmini .vip-icon {
    font-size: 7em;
}

/* 移动端(<=640px)适度收敛，避免撑破窄屏 */
@media (max-width: 640px) {
    .pay-vip-info .v-iconbox .v-icon {
        font-size: 115px;
    }
    .vip-card .vip-img {
        font-size: 170px;
    }
}

/* ===== PAY-VIP-INFO LEVEL COLOR =====
   用户中心 VIP 卡片配色：原主题只有 level-1(橙)/level-2(紫)，
   补 3/4/5 级，与会员卡片(vip-theme3/4/5)保持同色系
   ==================================== */
.pay-vip-info.level-3 {
    background-image: radial-gradient(ellipse 105% 65% at 92% 8%, rgba(46, 117, 200, 0.20) 0, transparent 52%);
    border-color: rgba(46, 117, 200, 0.25);
    color: #1c3a5e;
}

.pay-vip-info.level-4 {
    background-image: radial-gradient(ellipse 105% 65% at 92% 8%, rgba(22, 100, 78, 0.20) 0, transparent 52%);
    border-color: rgba(22, 100, 78, 0.25);
    color: #144434;
}

.pay-vip-info.level-5 {
    background-image: radial-gradient(ellipse 105% 65% at 92% 8%, rgba(181, 44, 38, 0.20) 0, transparent 52%);
    border-color: rgba(181, 44, 38, 0.25);
    color: #b52c26;
}

/* 卡片内名称/按钮跟随等级色 */
.pay-vip-info.level-3 .v-name { color: #1c3a5e; }
.pay-vip-info.level-4 .v-name { color: #144434; }
.pay-vip-info.level-5 .v-name { color: #b52c26; }

/* ===== MODAL CARD MINI FIX =====
   弹窗内等级小卡片：5 级时换行，并恢复小尺寸(不受放大规则影响)
   =====================================*/

/* 等级小卡片容器：允许换行，每行 3 个 */
.vip-cardminis {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
}

.vip-cardminis > li {
    flex: 0 0 calc(33.333% - 8px);
    max-width: calc(33.333% - 8px);
}

/* 小卡片内部：恢复紧凑尺寸 */
.vip-cardmini .v-iconbox .v-icon {
    font-size: 88px;
}

.vip-cardmini .v-name {
    font-size: 13px;
    line-height: 1.25;
}

.vip-cardmini .v-desc {
    font-size: 11px;
}

@media (max-width: 640px) {
    .vip-cardminis > li {
        flex: 0 0 calc(50% - 6px);
        max-width: calc(50% - 6px);
    }
    .vip-cardmini .v-iconbox .v-icon {
        font-size: 60px;
    }
}

/* ===== PAYVIP MODAL WIDER =====
   开通会员弹窗(#modal_pay_uservip)加宽，容纳 5 个等级卡片与更大图标
   =================================*/

@media (min-width: 768px) {
    #modal_pay_uservip .modal-dialog {
        max-width: 880px;
        width: 92%;
    }
}

/* 弹窗内留白更舒展 */
#modal_pay_uservip .payvip-modal {
    padding: 4px;
}

/* 等级小卡片：图标放大后给足内边距 */
.vip-cardmini .v-iconbox {
    gap: 8px;
}

.vip-cardmini .v-name {
    font-size: 14px;
    line-height: 1.3;
}

.vip-cardmini .v-desc {
    font-size: 11.5px;
}

/* ===== VIP PRODUCT LAYOUT REDESIGN =====
   开通会员弹窗 · 会员套餐卡片重设计
   =================================*/

/* 套餐容器：横向卡片网格 */
.payvip-modal .charge-box {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 10px;
    margin-left: 0;
    margin-right: 0;
}

.payvip-modal .charge-box > label {
    display: block;
    margin: 0;
    cursor: pointer;
}

/* 套餐卡片本体 */
.vip-product {
    border: 2px solid var(--main-border-color, #e8e8ec);
    border-radius: 10px;
    padding: 16px 10px 12px;
    background: #fff;
    transition: all .2s ease;
    min-height: 96px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    position: relative;
}

/* 悬停 */
.vip-product:hover {
    border-color: #ffb08a;
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(241, 67, 21, .13);
}

/* 选中态：橙红描边 + 淡橙底 + 右上对勾 */
.vip-product-input:checked + .vip-product {
    border-color: #f14315;
    background: linear-gradient(180deg, #fff5f0, #ffffff);
    box-shadow: 0 0 0 3px rgba(241, 67, 21, .13);
}

.vip-product-input:checked + .vip-product::after {
    content: "\2713";
    position: absolute;
    top: -9px;
    right: -9px;
    width: 22px;
    height: 22px;
    background: #f14315;
    color: #fff;
    border-radius: 50%;
    font-size: 13px;
    line-height: 22px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(241, 67, 21, .4);
}

/* 价格突出、原价删除线 */
.vip-product .product-price {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.15;
}

.vip-product .original-price {
    text-decoration: line-through;
    opacity: .55;
    font-size: 12px;
}

/* 时长徽标：胶囊化 */
.vip-product .badg.radius {
    background: rgba(66, 133, 244, .1);
    border-radius: 20px;
    padding: 2px 10px;
    margin-top: 2px;
}

/* 促销标签：移到顶部居中，避免与对勾重叠 */
.vip-product .vip-tag {
    right: auto;
    left: 50%;
    top: -10px;
    bottom: auto;
    transform: translateX(-50%);
    white-space: nowrap;
    font-size: 10px;
    padding: 1px 8px;
    z-index: 2;
}

/* 窄屏：单列 */
@media (max-width: 640px) {
    .payvip-modal .charge-box {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .vip-product {
        min-height: 84px;
        padding: 12px 6px 10px;
    }
    .vip-product .product-price {
        font-size: 18px;
    }
}

/* ===== MODAL CARD VISUAL UPGRADE (2026-09-01) =====
   弹窗等级卡片：前景图标置顶 + 悬停/发光增强
   ================================================*/

/* 前景图标置于最顶层(背景装饰 .vip-baicon 为 z-index:0) */
.vip-cardmini .v-iconbox {
    position: relative;
    z-index: 2;
    gap: 10px;
}

.vip-cardmini .v-iconbox .v-icon img {
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .22));
}

/* 卡片留白、圆角、过渡 */
.payvip-modal .vip-cardmini {
    padding: 14px 10px;
    border-radius: 12px;
    transition: all .22s ease;
}

.payvip-modal .vip-cardmini:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .14);
}

.vip-cardmini .v-desc {
    font-size: 12px;
    opacity: .85;
}

/* ===== VIP PRODUCT-BOX LEVEL COLOR BINDING (2026-09-01) =====
   套餐价格框按等级绑主题色(描边/hover/选中)
   复用 vip-theme1~5 主色，与卡片配色一致
   ============================================================ */

.payvip-modal .charge-box .product-box-level-1 {
    border-color: #cf7f1733;  /* 20% alpha */
}
.payvip-modal .charge-box .product-box-level-2 {
    border-color: #6d60de33;  /* 20% alpha */
}
.payvip-modal .charge-box .product-box-level-3 {
    border-color: #1c3a5e33;  /* 20% alpha */
}
.payvip-modal .charge-box .product-box-level-4 {
    border-color: #14443433;  /* 20% alpha */
}
.payvip-modal .charge-box .product-box-level-5 {
    border-color: #b52c2633;  /* 20% alpha */
}

.payvip-modal .charge-box .product-box-level-1:hover {
    border-color: #cf7f17;
    box-shadow: 0 4px 14px rgba(207, 127, 23, .18);
    transform: translateY(-2px);
}
.payvip-modal .charge-box .product-box-level-2:hover {
    border-color: #6d60de;
    box-shadow: 0 4px 14px rgba(109, 96, 222, .20);
    transform: translateY(-2px);
}
.payvip-modal .charge-box .product-box-level-3:hover {
    border-color: #1c3a5e;
    box-shadow: 0 4px 14px rgba(28, 58, 94, .22);
    transform: translateY(-2px);
}
.payvip-modal .charge-box .product-box-level-4:hover {
    border-color: #144434;
    box-shadow: 0 4px 14px rgba(20, 68, 52, .20);
    transform: translateY(-2px);
}
.payvip-modal .charge-box .product-box-level-5:hover {
    border-color: #b52c26;
    box-shadow: 0 4px 14px rgba(181, 44, 38, .22);
    transform: translateY(-2px);
}

.payvip-modal .charge-box .product-box-level-1.active,
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) {
    border-color: #cf7f17;
    background: linear-gradient(180deg, #fff5e8, #ffffff);
    box-shadow: 0 0 0 3px #cf7f1726;  /* 15% alpha outer */
}
.payvip-modal .charge-box .product-box-level-2.active,
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked) {
    border-color: #6d60de;
    background: linear-gradient(180deg, #f1efff, #ffffff);
    box-shadow: 0 0 0 3px #6d60de26;  /* 15% alpha outer */
}
.payvip-modal .charge-box .product-box-level-3.active,
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked) {
    border-color: #1c3a5e;
    background: linear-gradient(180deg, #e6eef7, #ffffff);
    box-shadow: 0 0 0 3px #1c3a5e26;  /* 15% alpha outer */
}
.payvip-modal .charge-box .product-box-level-4.active,
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked) {
    border-color: #144434;
    background: linear-gradient(180deg, #e0eee7, #ffffff);
    box-shadow: 0 0 0 3px #14443426;  /* 15% alpha outer */
}
.payvip-modal .charge-box .product-box-level-5.active,
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked) {
    border-color: #b52c26;
    background: linear-gradient(180deg, #fce8e6, #ffffff);
    box-shadow: 0 0 0 3px #b52c2626;  /* 15% alpha outer */
}

.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) .product-price {
    color: #cf7f17;
}
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked) .product-price {
    color: #6d60de;
}
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked) .product-price {
    color: #1c3a5e;
}
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked) .product-price {
    color: #144434;
}
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked) .product-price {
    color: #b52c26;
}


/* ===== MODAL BEAUTIFY & FIT (2026-09-01) =====
   VIP 开通弹窗：修复内容显示不全(限高+内部滚动) + 视觉美化
   ==============================================*/

/* -- 1. 弹窗容器: 限高 + 内部滚动(修复显示不全) -- */
#modal_pay_uservip .modal-dialog {
    display: flex;
    align-items: flex-start;
    max-height: calc(100vh - 40px);
    margin: 20px auto;
}
#modal_pay_uservip .modal-content {
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    overscroll-behavior: contain;
    border: none;
    border-radius: 18px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, .28);
}
#modal_pay_uservip .modal-content::-webkit-scrollbar { width: 6px; }
#modal_pay_uservip .modal-content::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, .18); border-radius: 3px; }
#modal_pay_uservip .modal-content::-webkit-scrollbar-track { background: transparent; }

/* -- 2. 等级选择区(tab): 图标收敛 + 悬浮/选中高亮 -- */
.payvip-modal .vip-cardminis { gap: 10px; }
.payvip-modal .vip-cardmini {
    cursor: pointer;
    border: 2px solid transparent;
    transition: all .22s ease;
}
.payvip-modal .vip-cardmini:hover { transform: translateY(-2px); }
.payvip-modal .vip-cardmini .v-iconbox .v-icon { font-size: 64px; }

/* 选中 tab: 各等级主题色描边 */
.payvip-modal .vip-cardminis > li.active .vip-cardmini.level-1 {
    border-color: #cf7f17;
    box-shadow: 0 0 0 3px rgba(207, 127, 23, .18);
}
.payvip-modal .vip-cardminis > li.active .vip-cardmini.level-2 {
    border-color: #6d60de;
    box-shadow: 0 0 0 3px rgba(109, 96, 222, .20);
}
.payvip-modal .vip-cardminis > li.active .vip-cardmini.level-3 {
    border-color: #1c3a5e;
    box-shadow: 0 0 0 3px rgba(28, 58, 94, .22);
}
.payvip-modal .vip-cardminis > li.active .vip-cardmini.level-4 {
    border-color: #144434;
    box-shadow: 0 0 0 3px rgba(20, 68, 52, .20);
}
.payvip-modal .vip-cardminis > li.active .vip-cardmini.level-5 {
    border-color: #b52c26;
    box-shadow: 0 0 0 3px rgba(181, 44, 38, .22);
}

/* -- 3. 信息区: 权益列表美化(对勾图标) -- */
.payvip-modal .pay-vip-info .v-equity {
    text-align: left;
    list-style: none;
    margin: 0;
    padding-left: 0;
}
.payvip-modal .pay-vip-info .v-equity li {
    position: relative;
    padding: 3px 0 3px 22px;
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
}
.payvip-modal .pay-vip-info .v-equity li::before {
    content: "\2713";
    position: absolute;
    left: 2px;
    top: 5px;
    width: 15px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: #34b37f;
    border-radius: 50%;
}

/* -- 4. 套餐时长徽标跟随等级色 -- */
.payvip-modal .charge-box .product-box-level-1 .badg { color: #cf7f17; background: rgba(207, 127, 23, .08); }
.payvip-modal .charge-box .product-box-level-2 .badg { color: #6d60de; background: rgba(109, 96, 222, .08); }
.payvip-modal .charge-box .product-box-level-3 .badg { color: #1c3a5e; background: rgba(28, 58, 94, .08); }
.payvip-modal .charge-box .product-box-level-4 .badg { color: #144434; background: rgba(20, 68, 52, .08); }
.payvip-modal .charge-box .product-box-level-5 .badg { color: #b52c26; background: rgba(181, 44, 38, .08); }

/* -- 5. 支付按钮更突出 -- */
#modal_pay_uservip .initiate-pay,
#modal_pay_uservip .payvip-button {
    border-radius: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    box-shadow: 0 6px 16px rgba(241, 67, 21, .30);
    transition: all .22s ease;
}
#modal_pay_uservip .initiate-pay:hover,
#modal_pay_uservip .payvip-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(241, 67, 21, .38);
}

/* -- 6. 移动端 -- */
@media (max-width: 640px) {
    #modal_pay_uservip .modal-dialog {
        margin: 8px;
        width: calc(100% - 16px);
        max-height: calc(100vh - 16px);
    }
    #modal_pay_uservip .modal-content {
        max-height: calc(100vh - 16px);
        border-radius: 14px;
    }
    .payvip-modal .vip-cardmini .v-iconbox .v-icon { font-size: 44px; }
}


/* ===== NAV HOVER VIP PANEL (2026-09-01) =====
   导航「开通会员」hover 悬浮面板：5 级卡片布局 + 防溢出
   ==============================================*/
.sub-vip-card.hover-show-con {
    width: max-content;
    max-width: calc(100vw - 24px);
    padding: 10px !important;
    text-align: center;
}
.sub-vip-card .vip-card {
    width: 240px;
    margin: 6px;
    border-radius: 14px;
    text-align: left;
    overflow: hidden;
}
@media (max-width: 640px) {
    .sub-vip-card .vip-card { width: calc(50vw - 30px); min-width: 200px; }
}


/* ===== NAV PANEL BUTTON COLORS (2026-09-01) =====
   悬浮面板会员卡「开通」按钮：3/4/5 级改为深色鲜明渐变,
   视觉强度与 1/2 级一致(原浅色系在白卡上太淡)
   ==============================================*/
.vip-theme3 .payvip-button {
    background: linear-gradient(135deg, #4f7fae 0%, #1c3a5e 100%) !important;
    color: #fff !important;
    border: none;
    box-shadow: 0 4px 12px rgba(28, 58, 94, .35);
}
.vip-theme4 .payvip-button {
    background: linear-gradient(135deg, #2f8a68 0%, #144434 100%) !important;
    color: #fff !important;
    border: none;
    box-shadow: 0 4px 12px rgba(20, 68, 52, .35);
}
.vip-theme5 .payvip-button {
    background: linear-gradient(135deg, #e0564a 0%, #b32b2b 100%) !important;
    color: #fff !important;
    border: none;
    box-shadow: 0 4px 12px rgba(181, 44, 38, .35);
}
.vip-theme3 .payvip-button:hover,
.vip-theme4 .payvip-button:hover,
.vip-theme5 .payvip-button:hover {
    transform: translateY(-2px);
    filter: brightness(1.08);
}


/* ===== MODAL DESIGN POLISH (2026-09-01) =====
   开通会员弹窗整体设计升级: VIP 氛围横幅/关闭钮/tab白字/切换动效
   ==============================================*/

/* -- 1. 顶部横幅: 用户条改为 VIP 渐变氛围条 -- */
.payvip-modal .user-box {
    margin: -4px -4px 16px !important;
    padding: 16px 20px !important;
    background: linear-gradient(120deg, #ff9633 0%, #f14315 55%, #d63384 100%);
    border-radius: 17px 17px 0 0;
}
.payvip-modal .user-box .avatar {
    border: 2px solid rgba(255, 255, 255, .75);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}
.payvip-modal .user-box b { color: #fff !important; }
.payvip-modal .user-box .muted-2-color { color: rgba(255, 255, 255, .92) !important; }

/* -- 2. 关闭按钮: 圆形白钮 + hover 旋转 -- */
#modal_pay_uservip .payvip-modal > .close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    margin: 0;
    background: rgba(255, 255, 255, .28);
    border-radius: 50%;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: all .2s ease;
}
#modal_pay_uservip .payvip-modal > .close:hover {
    background: rgba(255, 255, 255, .45);
    transform: rotate(90deg);
}
#modal_pay_uservip .payvip-modal > .close .ic-close {
    width: 13px;
    height: 13px;
    fill: #fff;
}

/* -- 3. tab 等级小卡片: 统一高度/阴影/白字对比 -- */
.payvip-modal .vip-cardmini {
    min-height: 96px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .10);
}
.payvip-modal .vip-cardmini .v-name {
    color: #fff !important;
    font-weight: 700;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}
.payvip-modal .vip-cardmini .v-desc {
    color: rgba(255, 255, 255, .88) !important;
}

/* -- 4. 信息区: 白卡精修 -- */
.payvip-modal .pay-vip-info {
    background-color: #fff;
    border-radius: 14px;
    padding: 16px 14px;
}

/* -- 5. tab 切换动效 -- */
.payvip-modal .tab-pane.fade.in { animation: pvFadeUp .28s ease; }
@keyframes pvFadeUp {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
}

/* -- 6. 套餐卡片层次 + 支付按钮加大 -- */
.payvip-modal .vip-product { box-shadow: 0 2px 8px rgba(0, 0, 0, .05); }
#modal_pay_uservip .initiate-pay {
    font-size: 16px;
    padding: 12px 0;
    letter-spacing: 2px;
}

/* -- 7. 移动端横幅收窄 -- */
@media (max-width: 640px) {
    .payvip-modal .user-box { padding: 12px 14px !important; }
    .payvip-modal .user-box .muted-2-color { display: none; }
}


/* ===== PRICE BG FOLLOW THEME (2026-09-01) =====
   弹窗价格卡片背景跟随会员等级主题:
   默认=等级色淡渐变+主题色文字 / 选中=完整主题渐变+白字+主题色对勾
   ==============================================*/

/* ---------- 默认态: 淡渐变 + 主题色文字 ---------- */
.payvip-modal .charge-box .product-box-level-1 {
    background: linear-gradient(150deg, #cf7f1712, #f1431522) !important;
}
.payvip-modal .charge-box .product-box-level-1 .product-price { color: #a35c0d !important; }
.payvip-modal .charge-box .product-box-level-1 .badg { color: #cf7f17; background: #cf7f171a !important; }

.payvip-modal .charge-box .product-box-level-2 {
    background: linear-gradient(150deg, #6d60de12, #4f48b822) !important;
}
.payvip-modal .charge-box .product-box-level-2 .product-price { color: #4f48b8 !important; }
.payvip-modal .charge-box .product-box-level-2 .badg { color: #6d60de; background: #6d60de1a !important; }

.payvip-modal .charge-box .product-box-level-3 {
    background: linear-gradient(150deg, #1c3a5e10, #5b8db822) !important;
}
.payvip-modal .charge-box .product-box-level-3 .product-price { color: #1c3a5e !important; }
.payvip-modal .charge-box .product-box-level-3 .badg { color: #1c3a5e; background: #1c3a5e1a !important; }

.payvip-modal .charge-box .product-box-level-4 {
    background: linear-gradient(150deg, #14443410, #3f8f7022) !important;
}
.payvip-modal .charge-box .product-box-level-4 .product-price { color: #144434 !important; }
.payvip-modal .charge-box .product-box-level-4 .badg { color: #144434; background: #1444341a !important; }

.payvip-modal .charge-box .product-box-level-5 {
    background: linear-gradient(150deg, #b32b2b10, #e0564a22) !important;
}
.payvip-modal .charge-box .product-box-level-5 .product-price { color: #b32b2b !important; }
.payvip-modal .charge-box .product-box-level-5 .badg { color: #b32b2b; background: #b32b2b1a !important; }

/* ---------- 选中态: 完整主题渐变 + 白字 ---------- */
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) {
    background: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 20px rgba(241, 67, 21, .38);
    color: #fff;
}
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked) {
    background: linear-gradient(135deg, #9b7de4 0%, #4f48b8 100%) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 20px rgba(79, 72, 184, .38);
    color: #fff;
}
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked) {
    background: linear-gradient(135deg, #5b8db8 0%, #1c3a5e 100%) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 20px rgba(28, 58, 94, .40);
    color: #fff;
}
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked) {
    background: linear-gradient(135deg, #3f8f70 0%, #144434 100%) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 20px rgba(20, 68, 52, .38);
    color: #fff;
}
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked) {
    background: linear-gradient(135deg, #f2927a 0%, #b32b2b 100%) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 20px rgba(179, 43, 43, .40);
    color: #fff;
}

/* 选中态: 子元素白字化 */
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) .product-price,
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked) .product-price,
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked) .product-price,
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked) .product-price,
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked) .product-price {
    color: #fff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) .original-price,
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked) .original-price,
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked) .original-price,
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked) .original-price,
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked) .original-price {
    color: rgba(255, 255, 255, .75) !important;
}
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) .badg,
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked) .badg,
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked) .badg,
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked) .badg,
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked) .badg {
    color: #fff !important;
    background: rgba(255, 255, 255, .20) !important;
}

/* 选中态: 对勾圆点跟随主题色 */
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked) + .vip-product::after,
.payvip-modal .charge-box .product-box-level-1:has(.vip-product-input:checked)::after { background: #cf7f17; }
.payvip-modal .charge-box .product-box-level-2:has(.vip-product-input:checked)::after { background: #6d60de; }
.payvip-modal .charge-box .product-box-level-3:has(.vip-product-input:checked)::after { background: #1c3a5e; }
.payvip-modal .charge-box .product-box-level-4:has(.vip-product-input:checked)::after { background: #144434; }
.payvip-modal .charge-box .product-box-level-5:has(.vip-product-input:checked)::after { background: #b32b2b; }


/* ===== INFO PANEL THEME SYNC (2026-09-01) =====
   弹窗加宽 + 左侧特权信息面板整块跟随等级主题渐变(白字),
   用户中心会员卡(.pay-vip-info.level-N)同步统一视觉
   ==============================================*/

/* -- 弹窗加宽 880 -> 1080 -- */
@media (min-width: 768px) {
    #modal_pay_uservip .modal-dialog {
        max-width: 1080px !important;
        width: 96% !important;
    }
}

/* -- 5 级主题渐变 -- */
.pay-vip-info.level-1 { background-image: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important; }
.pay-vip-info.level-2 { background-image: linear-gradient(135deg, #9b7de4 0%, #4f48b8 100%) !important; }
.pay-vip-info.level-3 { background-image: linear-gradient(135deg, #5b8db8 0%, #1c3a5e 100%) !important; }
.pay-vip-info.level-4 { background-image: linear-gradient(135deg, #3f8f70 0%, #144434 100%) !important; }
.pay-vip-info.level-5 { background-image: linear-gradient(135deg, #f2927a 0%, #b32b2b 100%) !important; }

/* -- 面板容器统一 -- */
.pay-vip-info.level-1,
.pay-vip-info.level-2,
.pay-vip-info.level-3,
.pay-vip-info.level-4,
.pay-vip-info.level-5 {
    color: #fff !important;
    border-color: transparent !important;
    border-radius: 14px !important;
    padding: 18px 14px !important;
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .16);
}

/* -- 白字化: 名称/描述/权益 -- */
.pay-vip-info .v-name { color: #fff !important; font-weight: 700; }
.pay-vip-info .v-desc { color: rgba(255, 255, 255, .9) !important; }
.pay-vip-info .v-equity li { color: #fff !important; }
.pay-vip-info .v-equity li::before {
    background: rgba(255, 255, 255, .30) !important;
    color: #fff !important;
}

/* -- 图标轻投影 -- */
.pay-vip-info .v-iconbox .v-icon img {
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .25));
}


/* ===== PV THEME BG (2026-09-01) =====
   整个弹窗背景跟随当前选中等级(淡色 tint, 由 pv_theme_follow JS 打 class)
   ==============================================*/
.payvip-modal { transition: background .3s ease; }
.payvip-modal.pv-theme-1 { background: linear-gradient(180deg, #fff3ea 0%, #ffffff 55%) !important; }
.payvip-modal.pv-theme-2 { background: linear-gradient(180deg, #f4f0ff 0%, #ffffff 55%) !important; }
.payvip-modal.pv-theme-3 { background: linear-gradient(180deg, #ecf3f9 0%, #ffffff 55%) !important; }
.payvip-modal.pv-theme-4 { background: linear-gradient(180deg, #eaf6f0 0%, #ffffff 55%) !important; }
.payvip-modal.pv-theme-5 { background: linear-gradient(180deg, #fff0ee 0%, #ffffff 55%) !important; }

/* ===== PRODUCT BOX CLEAN & COMPAT (2026-09-01) =====
   1) 左上主题原生勾隐藏(与右上等级勾重复)
   2) 默认态改纯白底(替换淡渐变)
   3) 选中态改 input 级别类+相邻选择器(不依赖 :has, 全浏览器)
   ==============================================*/

/* 左上勾隐藏 */
.payvip-modal .vip-product::before { display: none !important; }

/* 默认态: 纯白底 */
.payvip-modal .charge-box .product-box-level-1,
.payvip-modal .charge-box .product-box-level-2,
.payvip-modal .charge-box .product-box-level-3,
.payvip-modal .charge-box .product-box-level-4,
.payvip-modal .charge-box .product-box-level-5 {
    background: #fff !important;
}

/* 选中: 主题渐变整卡点亮 */
.payvip-modal .charge-box .pb-level-1:checked + .vip-product { background: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important; border-color: transparent !important; box-shadow: 0 8px 20px rgba(241, 67, 21, .38); color: #fff; }
.payvip-modal .charge-box .pb-level-2:checked + .vip-product { background: linear-gradient(135deg, #9b7de4 0%, #4f48b8 100%) !important; border-color: transparent !important; box-shadow: 0 8px 20px rgba(79, 72, 184, .38); color: #fff; }
.payvip-modal .charge-box .pb-level-3:checked + .vip-product { background: linear-gradient(135deg, #5b8db8 0%, #1c3a5e 100%) !important; border-color: transparent !important; box-shadow: 0 8px 20px rgba(28, 58, 94, .40); color: #fff; }
.payvip-modal .charge-box .pb-level-4:checked + .vip-product { background: linear-gradient(135deg, #3f8f70 0%, #144434 100%) !important; border-color: transparent !important; box-shadow: 0 8px 20px rgba(20, 68, 52, .38); color: #fff; }
.payvip-modal .charge-box .pb-level-5:checked + .vip-product { background: linear-gradient(135deg, #f2927a 0%, #b32b2b 100%) !important; border-color: transparent !important; box-shadow: 0 8px 20px rgba(179, 43, 43, .40); color: #fff; }

/* 选中: 子元素白字 */
.payvip-modal .charge-box .pb-level-1:checked + .vip-product .product-price,
.payvip-modal .charge-box .pb-level-2:checked + .vip-product .product-price,
.payvip-modal .charge-box .pb-level-3:checked + .vip-product .product-price,
.payvip-modal .charge-box .pb-level-4:checked + .vip-product .product-price,
.payvip-modal .charge-box .pb-level-5:checked + .vip-product .product-price {
    color: #fff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}
.payvip-modal .charge-box .pb-level-1:checked + .vip-product .original-price,
.payvip-modal .charge-box .pb-level-2:checked + .vip-product .original-price,
.payvip-modal .charge-box .pb-level-3:checked + .vip-product .original-price,
.payvip-modal .charge-box .pb-level-4:checked + .vip-product .original-price,
.payvip-modal .charge-box .pb-level-5:checked + .vip-product .original-price {
    color: rgba(255, 255, 255, .75) !important;
}
.payvip-modal .charge-box .pb-level-1:checked + .vip-product .badg,
.payvip-modal .charge-box .pb-level-2:checked + .vip-product .badg,
.payvip-modal .charge-box .pb-level-3:checked + .vip-product .badg,
.payvip-modal .charge-box .pb-level-4:checked + .vip-product .badg,
.payvip-modal .charge-box .pb-level-5:checked + .vip-product .badg {
    color: #fff !important;
    background: rgba(255, 255, 255, .20) !important;
}

/* 右上对勾跟随等级色(相邻选择器版) */
.payvip-modal .charge-box .pb-level-1:checked + .vip-product::after { background: #cf7f17; }
.payvip-modal .charge-box .pb-level-2:checked + .vip-product::after { background: #6d60de; }
.payvip-modal .charge-box .pb-level-3:checked + .vip-product::after { background: #1c3a5e; }
.payvip-modal .charge-box .pb-level-4:checked + .vip-product::after { background: #144434; }
.payvip-modal .charge-box .pb-level-5:checked + .vip-product::after { background: #b32b2b; }

/* ==================================================
   MODAL REDESIGN (2026-09-01) —— 弹窗整体重设计
   统一: 一行5个等宽等级卡 / 内容区卡片化 / 节奏化间距
   ==================================================*/

/* -- 骨架 -- */
#modal_pay_uservip .modal-content { border-radius: 20px !important; }
.payvip-modal { padding: 0 !important; }

/* 顶部横幅: 贴满上沿, 只留上圆角 */
.payvip-modal .user-box {
    margin: 0 0 0 !important;
    padding: 14px 52px 14px 18px !important;
    border-radius: 20px 20px 0 0 !important;
}
#modal_pay_uservip .payvip-modal > .close { top: 10px; right: 10px; }

/* -- 等级选择: 一行 5 个等宽 -- */
.payvip-modal .vip-cardminis {
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 14px 16px 4px !important;
    margin: 0 !important;
    list-style: none;
}
.payvip-modal .vip-cardminis > li {
    flex: 1 1 0 !important;
    max-width: none !important;
    min-width: 0 !important;
}
.payvip-modal .vip-cardmini {
    min-height: 92px !important;
    padding: 10px 6px !important;
    border-radius: 12px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.payvip-modal .vip-cardmini .v-iconbox {
    gap: 0 !important;
    margin-bottom: 4px;
    justify-content: center;
}
.payvip-modal .vip-cardmini .v-iconbox .v-icon { font-size: 42px !important; }
.payvip-modal .vip-cardmini .v-name { font-size: 13px !important; }
.payvip-modal .vip-cardmini .v-desc { display: none; }   /* 窄卡里收起副标题 */

/* -- 内容区: 统一内边距 -- */
.payvip-modal .tab-content { padding: 6px 16px 18px; }

/* -- 左右两栏等高 + 间距 -- */
.payvip-modal .pay-vip-form-row {
    gap: 14px !important;
    align-items: stretch !important;
}

/* -- 左侧特权面板: 收紧内边距, 贴合新骨架 -- */
.payvip-modal .pay-vip-info {
    border-radius: 14px !important;
    padding: 16px 14px !important;
    margin: 0;
}

/* -- 右侧套餐+支付: 卡片节奏 -- */
.payvip-modal .charge-box {
    gap: 10px !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
}
.payvip-modal .vip-product {
    border-radius: 12px !important;
    padding: 18px 10px 12px !important;
    min-height: 108px !important;
}
.payvip-modal .vip-product .product-price { font-size: 24px !important; }

/* -- 支付按钮: 全宽大圆角 -- */
#modal_pay_uservip .initiate-pay,
#modal_pay_uservip .dependency-box .initiate-pay {
    border-radius: 12px !important;
    font-size: 16px !important;
    padding: 13px 0 !important;
    letter-spacing: 3px;
}

/* -- 移动端: 等级卡允许换行, 左右栏转单列 -- */
@media (max-width: 860px) {
    .payvip-modal .vip-cardminis { flex-wrap: wrap !important; }
    .payvip-modal .vip-cardminis > li { flex: 0 0 calc(33.333% - 7px) !important; }
    .payvip-modal .vip-cardmini { min-height: 84px !important; }
}
@media (max-width: 640px) {
    .payvip-modal .vip-cardminis > li { flex: 0 0 calc(50% - 6px) !important; }
    .payvip-modal .vip-cardmini .v-iconbox .v-icon { font-size: 36px !important; }
}

/* ===== VIP PAGE: topbg 防挡 + 套餐卡主题化 (2026-09-01) ===== */

/* -- 权益区不再上移 200px 压住 topbg 大图 -- */
.vip-page-container .equities-wrapper {
    margin: 24px auto 0 !important;
}

/* -- 套餐卡: 完整主题渐变 + 白字 (高权重防 vip.css 覆盖) -- */
.vip-page-container .plan-card.plan-level-1 {
    background: linear-gradient(150deg, #ff9633 0%, #f14315 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(241, 67, 21, .30) !important;
}
.vip-page-container .plan-card.plan-level-2 {
    background: linear-gradient(150deg, #9b7de4 0%, #4f48b8 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(79, 72, 184, .30) !important;
}
.vip-page-container .plan-card.plan-level-3 {
    background: linear-gradient(150deg, #5b8db8 0%, #1c3a5e 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(28, 58, 94, .32) !important;
}
.vip-page-container .plan-card.plan-level-4 {
    background: linear-gradient(150deg, #3f8f70 0%, #144434 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(20, 68, 52, .30) !important;
}
.vip-page-container .plan-card.plan-level-5 {
    background: linear-gradient(150deg, #f2927a 0%, #b32b2b 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(179, 43, 43, .32) !important;
}

/* 套餐卡内元素白字化 */
.vip-page-container .plan-card.plan-level-1 h3,
.vip-page-container .plan-card.plan-level-2 h3,
.vip-page-container .plan-card.plan-level-3 h3,
.vip-page-container .plan-card.plan-level-4 h3,
.vip-page-container .plan-card.plan-level-5 h3 {
    color: #fff !important;
}
.vip-page-container .plan-card.plan-level-1 .price,
.vip-page-container .plan-card.plan-level-2 .price,
.vip-page-container .plan-card.plan-level-3 .price,
.vip-page-container .plan-card.plan-level-4 .price,
.vip-page-container .plan-card.plan-level-5 .price {
    color: #fff !important;
}
.vip-page-container .plan-card.plan-level-1 .original-price,
.vip-page-container .plan-card.plan-level-2 .original-price,
.vip-page-container .plan-card.plan-level-3 .original-price,
.vip-page-container .plan-card.plan-level-4 .original-price,
.vip-page-container .plan-card.plan-level-5 .original-price {
    color: rgba(255, 255, 255, .75) !important;
}
.vip-page-container .plan-card.plan-level-1 .tag,
.vip-page-container .plan-card.plan-level-2 .tag,
.vip-page-container .plan-card.plan-level-3 .tag,
.vip-page-container .plan-card.plan-level-4 .tag,
.vip-page-container .plan-card.plan-level-5 .tag {
    background: rgba(255, 255, 255, .22) !important;
    color: #fff !important;
}
.vip-page-container .plan-card.plan-level-1 .buy-btn,
.vip-page-container .plan-card.plan-level-2 .buy-btn,
.vip-page-container .plan-card.plan-level-3 .buy-btn,
.vip-page-container .plan-card.plan-level-4 .buy-btn,
.vip-page-container .plan-card.plan-level-5 .buy-btn {
    background: rgba(255, 255, 255, .92) !important;
    color: #1f2937 !important;
    font-weight: 700;
}
.vip-page-container .plan-card.plan-level-1 .buy-btn:hover,
.vip-page-container .plan-card.plan-level-2 .buy-btn:hover,
.vip-page-container .plan-card.plan-level-3 .buy-btn:hover,
.vip-page-container .plan-card.plan-level-4 .buy-btn:hover,
.vip-page-container .plan-card.plan-level-5 .buy-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.03);
}

/* ===== VIP PAGE UNIFIED GOLD (2026-09-01) =====
   /vip/ 套餐卡不再按等级分色, 统一跟随 topbg 相片/弹窗横幅的暖金橙色调
   ==============================================*/
.vip-page-container .plan-card.plan-level-1,
.vip-page-container .plan-card.plan-level-2,
.vip-page-container .plan-card.plan-level-3,
.vip-page-container .plan-card.plan-level-4,
.vip-page-container .plan-card.plan-level-5 {
    background: linear-gradient(150deg, #f7b267 0%, #ef6c3f 55%, #f14315 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(241, 67, 21, .26) !important;
}
.vip-page-container .plan-card.plan-level-1:hover,
.vip-page-container .plan-card.plan-level-2:hover,
.vip-page-container .plan-card.plan-level-3:hover,
.vip-page-container .plan-card.plan-level-4:hover,
.vip-page-container .plan-card.plan-level-5:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 34px rgba(241, 67, 21, .34) !important;
}

/* ===== PLAN FOLLOW HOVERCARD (2026-09-01) =====
   /vip/ 套餐卡渐变 = 悬浮窗面板同等级卡片背景(vip-theme1..5 同款)
   ==============================================*/

/* 初级: 悬浮窗金橙基础款(浅底深棕字) */
.vip-page-container .plan-card.plan-level-1 {
    background: linear-gradient(25deg, #e6aa4f 10%, #f1d7ad 70%, #f5b97b 100%) !important;
    color: #866127 !important;
    box-shadow: 0 10px 26px rgba(230, 170, 79, .38) !important;
}
.vip-page-container .plan-card.plan-level-1 h3,
.vip-page-container .plan-card.plan-level-1 .price { color: #866127 !important; }
.vip-page-container .plan-card.plan-level-1 .original-price { color: rgba(134, 97, 39, .55) !important; }
.vip-page-container .plan-card.plan-level-1 .tag {
    background: rgba(134, 97, 39, .14) !important;
    color: #866127 !important;
}

/* 高级: 紫 */
.vip-page-container .plan-card.plan-level-2 {
    background: linear-gradient(132deg, #9b7de4 0%, #4f48b8 30%, #624fba 80%, #574dba 100%) !important;
    box-shadow: 0 10px 26px rgba(79, 72, 184, .32) !important;
}

/* 殿堂: 深蓝宝石 */
.vip-page-container .plan-card.plan-level-3 {
    background: linear-gradient(132deg, #5b8db8 0%, #1c3a5e 35%, #2a5580 70%, #1e3d63 100%) !important;
    box-shadow: 0 10px 26px rgba(28, 58, 94, .34) !important;
}

/* 典藏: 深祖母绿 */
.vip-page-container .plan-card.plan-level-4 {
    background: linear-gradient(132deg, #3f8f70 0%, #144434 35%, #1f6350 70%, #164a3b 100%) !important;
    box-shadow: 0 10px 26px rgba(20, 68, 52, .32) !important;
}

/* 至尊: 赤红 */
.vip-page-container .plan-card.plan-level-5 {
    background: linear-gradient(132deg, #f2927a 0%, #b32b2b 30%, #c93a30 80%, #b52c26 100%) !important;
    box-shadow: 0 10px 26px rgba(179, 43, 43, .34) !important;
}

/* ===== PERM TAG CLEAR (2026-09-01) =====
   套餐卡「永久会员」标签: 从卡片外沿移入卡内顶部(往下), 实底更清晰
   ==============================================*/

/* 标签移入卡内顶部居中 + 实底醒目 */
.payvip-modal .vip-product .vip-tag {
    top: 8px !important;
    bottom: auto !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 3px 12px !important;
    border-radius: 11px !important;
    background: #f14315 !important;
    color: #fff !important;
    box-shadow: 0 2px 7px rgba(241, 67, 21, .35) !important;
    z-index: 3 !important;
    white-space: nowrap;
}

/* 卡片顶部留出标签空间 */
.payvip-modal .vip-product {
    padding-top: 30px !important;
}

/* 时长徽标(永久)更清晰 */
.payvip-modal .vip-product .badg {
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 3px 12px !important;
    margin-top: 6px !important;
}

/* ===== HIDE CHECK CIRCLES (2026-09-01) =====
   隐藏套餐卡上的两个圆形对勾(都把按钮位置遮住了):
     - 左上::before  = main.css 原生 FontAwesome 对勾
     - 右上::after   = extend.css 选中的等级色对勾
   保留选中态的其他视觉反馈(描边+白字+背景+对勾徽章由 UI 接管)
   ==============================================*/
.payvip-modal .vip-product::before { display: none !important; }
.payvip-modal .vip-product::after { display: none !important; }

/* ===== ORDER VIP THUMB (2026-09-01) =====
   待支付订单卡里的会员图标放大
   ==============================================*/
.order-item .order-thumb { width: 92px !important; height: 92px !important; }
.order-item .order-thumb .vip-card { width: 100% !important; height: 100% !important; object-fit: contain !important; padding: 4px; border-radius: 10px; background: var(--main-bg-color, #fff); }
.paid-modal-lists-box .order-item .order-thumb { width: 60px !important; height: 60px !important; }
.float-btn .order-thumb { width: 56px !important; height: 56px !important; }

/* ===== USER CENTER BUTTON UNIFIED (2026-09-01) =====
   /user/ VIP tab 卡片「开通XX炼丹师」按钮统一弹窗同款橙红渐变
   ==============================================*/
.user-content-myvip .but.jb-vip1,
.user-content-myvip .but.jb-vip2,
.user-content-myvip .but.jb-vip3,
.user-content-myvip .but.jb-vip4,
.user-content-myvip .but.jb-vip5 {
    background: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(241, 67, 21, .30) !important;
}
.user-content-myvip .but.jb-vip1:hover,
.user-content-myvip .but.jb-vip2:hover,
.user-content-myvip .but.jb-vip3:hover,
.user-content-myvip .but.jb-vip4:hover,
.user-content-myvip .but.jb-vip5:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 8px 18px rgba(241, 67, 21, .38) !important;
    opacity: .98;
}

/* ===== USER CENTER BUTTON UNIFIED V2 (2026-09-01) =====
   修正: 等级卡片在 .vip-cards-grid 容器内(与 .user-content-myvip 并列,非嵌套)
   统一「开通XX炼丹师」按钮为弹窗同款橙红渐变
   ==============================================*/
.user-content-myvip .but.jb-vip1,
.user-content-myvip .but.jb-vip2,
.user-content-myvip .but.jb-vip3,
.user-content-myvip .but.jb-vip4,
.user-content-myvip .but.jb-vip5,
.vip-cards-grid .but.jb-vip1,
.vip-cards-grid .but.jb-vip2,
.vip-cards-grid .but.jb-vip3,
.vip-cards-grid .but.jb-vip4,
.vip-cards-grid .but.jb-vip5 {
    background: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(241, 67, 21, .30) !important;
}
.user-content-myvip .but.jb-vip1:hover,
.user-content-myvip .but.jb-vip2:hover,
.user-content-myvip .but.jb-vip3:hover,
.user-content-myvip .but.jb-vip4:hover,
.user-content-myvip .but.jb-vip5:hover,
.vip-cards-grid .but.jb-vip1:hover,
.vip-cards-grid .but.jb-vip2:hover,
.vip-cards-grid .but.jb-vip3:hover,
.vip-cards-grid .but.jb-vip4:hover,
.vip-cards-grid .but.jb-vip5:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 8px 18px rgba(241, 67, 21, .38) !important;
}

/* ===== USER CENTER BUTTON PER-LEVEL (2026-09-01) =====
   /user/ 卡片「开通XX炼丹师」按钮 = 各等级主题色(与悬浮面板/弹窗一致)
   覆盖上一版误做的"统一橙红"
   ==============================================*/
.vip-cards-grid .but.jb-vip1,
.user-content-myvip .but.jb-vip1 {
    background: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(241, 67, 21, .30) !important;
}
.vip-cards-grid .but.jb-vip2,
.user-content-myvip .but.jb-vip2 {
    background: linear-gradient(135deg, #9b7de4 0%, #4f48b8 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(79, 72, 184, .30) !important;
}
.vip-cards-grid .but.jb-vip3,
.user-content-myvip .but.jb-vip3 {
    background: linear-gradient(135deg, #5b8db8 0%, #1c3a5e 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(28, 58, 94, .32) !important;
}
.vip-cards-grid .but.jb-vip4,
.user-content-myvip .but.jb-vip4 {
    background: linear-gradient(135deg, #3f8f70 0%, #144434 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(20, 68, 52, .30) !important;
}
.vip-cards-grid .but.jb-vip5,
.user-content-myvip .but.jb-vip5 {
    background: linear-gradient(135deg, #f2927a 0%, #b32b2b 100%) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(179, 43, 43, .32) !important;
}
.vip-cards-grid .but.jb-vip1:hover, .vip-cards-grid .but.jb-vip2:hover,
.vip-cards-grid .but.jb-vip3:hover, .vip-cards-grid .but.jb-vip4:hover, .vip-cards-grid .but.jb-vip5:hover,
.user-content-myvip .but.jb-vip1:hover, .user-content-myvip .but.jb-vip2:hover,
.user-content-myvip .but.jb-vip3:hover, .user-content-myvip .but.jb-vip4:hover, .user-content-myvip .but.jb-vip5:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
}

/* ===== 会员弹窗: 福利清单(权益列表) 显示与优化 2026-09-03 ===== */
/* zibll main.css 在 @media (max-width:640px) 里把 .payvip-modal .pay-vip-info 设为 display:none，
   这里覆盖为显示，让手机端也能看到福利清单。 */
@media (max-width: 640px) {
    .payvip-modal .pay-vip-info { display: block !important; }
}
/* 权益列表区整体: 收紧, 左对齐 */
.payvip-modal .pay-vip-info .v-equity {
    text-align: left !important;
    list-style: none !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
}
/* 每条权益: 对勾 + 行距 + 分隔线 */
.payvip-modal .pay-vip-info .v-equity li {
    position: relative !important;
    padding: 6px 0 6px 26px !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    text-align: left !important;
    border-bottom: 1px dashed rgba(255, 255, 255, .16) !important;
}
.payvip-modal .pay-vip-info .v-equity li:last-child { border-bottom: none !important; }
/* 绿色圆形对勾 */
.payvip-modal .pay-vip-info .v-equity li::before {
    content: "\2713" !important;
    position: absolute !important;
    left: 0 !important;
    top: 8px !important;
    width: 17px !important;
    height: 17px !important;
    line-height: 17px !important;
    text-align: center !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .25) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}
/* 图标 + 等级名: 更醒目 */
.payvip-modal .pay-vip-info .v-iconbox { margin-bottom: 6px !important; }
.payvip-modal .pay-vip-info .v-name {
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}
.payvip-modal .pay-vip-info .v-desc {
    font-size: 12.5px !important;
    opacity: .92 !important;
}
/* 等级背景色: 兜底(函数已输出 level-N, 此处再确保渐变可见) */
.payvip-modal .pay-vip-info.level-1 { background-image: linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important; }
.payvip-modal .pay-vip-info.level-2 { background-image: linear-gradient(135deg, #9b7de4 0%, #4f48b8 100%) !important; }
.payvip-modal .pay-vip-info.level-3 { background-image: linear-gradient(135deg, #5b8db8 0%, #1c3a5e 100%) !important; }
.payvip-modal .pay-vip-info.level-4 { background-image: linear-gradient(135deg, #3f8f70 0%, #144434 100%) !important; }
.payvip-modal .pay-vip-info.level-5 { background-image: linear-gradient(135deg, #f2927a 0%, #b32b2b 100%) !important; }
.payvip-modal .pay-vip-info.level-1,
.payvip-modal .pay-vip-info.level-2,
.payvip-modal .pay-vip-info.level-3,
.payvip-modal .pay-vip-info.level-4,
.payvip-modal .pay-vip-info.level-5 { color: #fff !important; }
.payvip-modal .pay-vip-info .v-name { color: #fff !important; }
.payvip-modal .pay-vip-info .v-desc { color: rgba(255, 255, 255, .9) !important; }
.payvip-modal .pay-vip-info .v-equity li { color: #fff !important; }


/* ============================================
   文章标题字号 +1 号（2026-09-04）
   覆盖：列表卡片 / 详情页 H1（移动端同步）
   ============================================ */

/* 列表：18 -> 20 */
.posts-item .item-heading { font-size: 20px; }

/* 小卡片 / 侧栏 mini 列表：14 -> 16 */
.posts-mini-con .item-heading,
.posts-item.card .item-heading { font-size: 16px; }

.panda-resource-card .item-heading,
.panda-resource-card .panda-resource-title { font-size: 17px !important; }

/* 首页资源卡 v1：15 -> 17 */
body.panda-resource-cards-v1 .panda-resource-card-v1 .item-heading { font-size: 17px !important; }

/* 详情页 zibll 正文标题：22 -> 24 */
.article-header .article-title { font-size: 24px; }

/* 详情页 panda 大头部 H1：2.3rem -> 2.5rem */
.panda-head_info_post_title { font-size: 2.5rem; }

@media (max-width: 767px) {
    .posts-item .item-heading { font-size: 17px; }
    body.panda-resource-cards-v1 .panda-resource-card-v1 .item-heading { font-size: 16px !important; }
    .article-header .article-title { font-size: 20px; }
    .panda-head_info_post_title { font-size: 2rem; }
}


/* ============================================
   文章标题字号 v2（2026-09-04）
   实测：首页/列表卡片 = posts.posts-item.card .item-heading（基础 14px）
   body 的 panda-resource-cards-v1 类存在但卡片元素本身不带该类，
   故 v1 资源卡选择器不命中，以 .posts-item.card 为准
   ============================================ */

/* 列表/卡片标题：14 -> 18 */
.posts-item .item-heading,
.posts-item.card .item-heading { font-size: 18px !important; }

/* 侧栏 / mini 小列表：14 -> 16 */
.posts-mini-con .item-heading,
.posts-mini .item-heading { font-size: 16px !important; }

/* 详情页 zibll 正文标题：22 -> 26 */
.article-header .article-title { font-size: 26px !important; }

/* 详情页 panda 大头部 H1：2.3rem -> 2.7rem */
.panda-head_info_post_title { font-size: 2.7rem !important; }

@media (max-width: 767px) {
    .posts-item .item-heading,
    .posts-item.card .item-heading { font-size: 16px !important; }
    .posts-mini-con .item-heading,
    .posts-mini .item-heading { font-size: 15px !important; }
    .article-header .article-title { font-size: 21px !important; }
    .panda-head_info_post_title { font-size: 2.1rem !important; }
}


/* ============================================
   文章标题字号 v3（2026-09-04）——按实测命中链修正
   1) 分类/搜索页卡片 = posts-item.list.panda-resource-card.panda-resource-card-v1，
      特异度最高的 v1 规则会压过 .posts-item 规则，必须一并统一
   2) 详情页第三种模板 = .single-cover-con .article-title（封面头图，18px）
   ============================================ */

/* 列表标题统一 18px（含 v1 资源卡，覆盖 v1/v2 的 17px） */
.panda-resource-card .item-heading,
.panda-resource-card .panda-resource-title,
body.panda-resource-cards-v1 .panda-resource-card-v1 .item-heading { font-size: 18px !important; }

/* 详情页封面头图模板：18 -> 22 */
.single-cover-con .article-title,
.single-video .article-title { font-size: 22px !important; }

@media (max-width: 767px) {
    .panda-resource-card .item-heading,
    .panda-resource-card .panda-resource-title,
    body.panda-resource-cards-v1 .panda-resource-card-v1 .item-heading { font-size: 16px !important; }
    .single-cover-con .article-title,
    .single-video .article-title { font-size: 19px !important; }
}

/* ============================================
   「我的会员」卡片图标放大 (2026-09-09 用户反馈太小)
   1) 会员名前的等级徽章 (.img-icon)：原约 1.1em(~22px) -> 46px
   2) 卡片头像右下角会员角标 (.avatar-badge)：原约 头像1/2.5(22px) -> 34px
   仅作用于个人中心「我的会员」区域，不影响其它页面
   ============================================ */
.user-content-myvip .flex4 .em16.flex.ac .img-icon {
    height: 46px;
    width: 46px;
}

.user-content-myvip .avatar-md .avatar-badge {
    width: 34px;
    height: 34px;
    max-width: 34px;
    max-height: 34px;
}

/* 窄屏适度收敛，避免拥挤换行 */
@media (max-width: 640px) {
    .user-content-myvip .flex4 .em16.flex.ac .img-icon {
        height: 40px;
        width: 40px;
    }
}


/* ===== VIP 套餐卡片版式重排 v2 =====
   卡片渐变背景【完全不动】；改为徽标置顶在渐变带上，
   名称/价格/权益/按钮进白色面板，文字用本档深色 → 可读性不靠改背景解决
   所有配色实测：正文 ≥5.6:1，按钮/勾 白字对深底 ≥8.4:1
   ============================================ */
.vip-cards-grid > .pay-vip-info {
    display: flex;
    flex-direction: column;
    padding: 16px 13px 13px !important;
    text-align: left;
}

/* -- 渐变带上的徽标（原来 150px 图标把卡片顶出一大块空白） -- */
.pay-vip-info .v-crest {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 88px;
    position: relative;
    z-index: 1;
}
.pay-vip-info .v-crest img {
    height: 84px;
    width: auto;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .3));
}

/* -- 白色内容面板 -- */
.pay-vip-info .v-panel {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 10px;
    padding: 13px 13px 13px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .14);
    position: relative;
    z-index: 1;
}
.pay-vip-info .v-head { text-align: center; margin-bottom: 6px; }
.pay-vip-info .v-panel .v-name { font-size: 16px !important; font-weight: 800 !important; letter-spacing: -0.01em; }
.pay-vip-info .v-panel .v-desc {
    display: inline-block;
    margin-top: 5px;
    padding: 1px 9px;
    border-radius: 999px;
    font-size: 11.5px !important;
    font-weight: 700 !important;
}

/* -- 价格 -- */
.pay-vip-info .v-price { display: flex; align-items: baseline; justify-content: center; gap: 3px; }
.pay-vip-info .v-panel .v-sym { font-size: 16px; font-weight: 700; }
.pay-vip-info .v-panel .v-num { font-size: 31px; font-weight: 800; line-height: 1.06; letter-spacing: -0.02em; }
.pay-vip-info .v-panel .v-was { font-size: 12.5px; font-weight: 600; margin-left: 5px; text-decoration: line-through; }
.pay-vip-info .v-panel .v-term { text-align: center; font-size: 12px; font-weight: 600; margin: 1px 0 10px; }

/* -- 权益：占满剩余高度，行间细分隔线，勾在悬挂位 -- */
.pay-vip-info .v-equity {
    flex: 1 1 auto;
    margin: 0 0 12px !important;
    padding: 6px 0 0 !important;
    list-style: none;
}
.pay-vip-info .v-panel .v-equity li {
    position: relative;
    padding: 6px 0 6px 21px;
    font-size: 13px;
    line-height: 1.58;
    border-bottom: 1px solid var(--v-line);
}
.pay-vip-info .v-panel .v-equity li:last-child { border-bottom: 0; }
.pay-vip-info .v-panel .v-equity li strong { font-weight: 700; }
.pay-vip-info .v-panel .v-equity li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    top: 7px;
    width: 15px;
    height: 15px;
    font-size: 10px;
    line-height: 15px;
    text-align: center;
    border-radius: 50%;
}

/* -- CTA：三态恒占底部，深底白字 -- */
.pay-vip-info .mt20 { margin-top: auto !important; }
.pay-vip-info .v-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 9px 12px;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none !important;
    transition: filter .16s ease-out, transform .16s ease-out;
}
.pay-vip-info .v-btn:hover { filter: brightness(1.1); transform: translateY(-1px); }
.pay-vip-info .v-btn.is-cur,
.pay-vip-info .v-btn.is-off { background: #f2f3f5 !important; box-shadow: none; transform: none; filter: none; }

/* -- 每档配色：文字/按钮/勾/分隔线 -- */
.pay-vip-info.level-1 { --v-ink: #8f2a0e; --v-soft: #a4400f; --v-chip: #fbe7dc; --v-line: #f2ded2; }
.pay-vip-info.level-2 { --v-ink: #3d3794; --v-soft: #4a3f9e; --v-chip: #eae7fb; --v-line: #e0ddf6; }
.pay-vip-info.level-3 { --v-ink: #16304d; --v-soft: #2a5578; --v-chip: #e0edf7; --v-line: #d9e6f0; }
.pay-vip-info.level-4 { --v-ink: #0f3a2c; --v-soft: #1d5f49; --v-chip: #dff2ea; --v-line: #d6ece4; }
.pay-vip-info.level-5 { --v-ink: #8c2220; --v-soft: #9c3a33; --v-chip: #fbe4e2; --v-line: #f3dcd9; }

.pay-vip-info .v-panel .v-name,
.pay-vip-info .v-panel .v-sym,
.pay-vip-info .v-panel .v-num,
.pay-vip-info .v-panel .v-equity li,
.pay-vip-info .v-panel .v-equity li strong { color: var(--v-ink) !important; }
.pay-vip-info .v-panel .v-desc { background: var(--v-chip); color: var(--v-ink) !important; }
.pay-vip-info .v-panel .v-was,
.pay-vip-info .v-panel .v-term { color: var(--v-soft) !important; }
.pay-vip-info .v-panel .v-equity li::before { background: var(--v-ink) !important; color: #fff !important; }
.pay-vip-info a.v-btn { background: var(--v-ink) !important; color: #fff !important; }
.pay-vip-info .v-btn.is-cur,
.pay-vip-info .v-btn.is-off { color: var(--v-soft) !important; border: 1px solid var(--v-line); }

@media (prefers-reduced-motion: reduce) {
    .pay-vip-info .v-btn, .pay-vip-info .v-btn:hover { transition: none; transform: none; filter: none; }
}
@media (max-width: 560px) {
    .vip-cards-grid { grid-template-columns: 1fr !important; }
    .pay-vip-info .v-crest { height: 72px; }
    .pay-vip-info .v-crest img { height: 68px; }
    .pay-vip-info .v-panel .v-num { font-size: 27px; }
}


/* ===== VIP 卡片背景纵深 v3 =====
   渐变底色不动、水印仍占原位置；把本档套餐徽标放大→高斯模糊成背景光晕，
   再叠一层顶部受光 + 底部压暗，做出纵深。白色面板不透明，文字对比度不受影响
   ============================================================ */
.pay-vip-info .vip-baicon {
    opacity: 1 !important;
    z-index: 0;
    pointer-events: none;
}
.pay-vip-info .vip-baicon.abs-center { font-size: 17em !important; }
.pay-vip-info .vip-baicon img {
    opacity: .55;
    filter: blur(24px) saturate(1.4);
    transform: scale(1.18);
}

/* 顶部受光 + 底部压暗（纯叠加层，不改底色） */
.pay-vip-info::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    pointer-events: none;
    background:
        radial-gradient(120% 54% at 50% -8%, rgba(255, 255, 255, .26) 0, rgba(255, 255, 255, 0) 62%),
        linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, .22) 100%);
}

/* 置顶徽标与背景光晕呼应：更实的落影 + 一圈本档色柔光 */
.pay-vip-info .v-crest { height: 104px; }
.pay-vip-info .v-crest img {
    height: 96px;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .34)) drop-shadow(0 0 22px var(--v-glow));
}
.pay-vip-info.level-1 { --v-glow: rgba(255, 190, 130, .55); }
.pay-vip-info.level-2 { --v-glow: rgba(190, 175, 255, .55); }
.pay-vip-info.level-3 { --v-glow: rgba(150, 200, 235, .5); }
.pay-vip-info.level-4 { --v-glow: rgba(140, 225, 195, .5); }
.pay-vip-info.level-5 { --v-glow: rgba(255, 175, 160, .55); }

@media (max-width: 560px) {
    .pay-vip-info .vip-baicon.abs-center { font-size: 14em !important; }
    .pay-vip-info .vip-baicon img { filter: blur(18px) saturate(1.35); }
    .pay-vip-info .v-crest { height: 84px; }
    .pay-vip-info .v-crest img { height: 78px; }
}

/* SEO: 列表页/封面标题改用 h1 语义标签，保留原视觉字号 */
.page-cover h1.title-h-left,
.page-cover h1.title-h-center {
    font-size: inherit;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
}

/* ===== 用户中心 · 会员套餐卡片 v5.1（2026-09-28 方卡重设计）=====
   需求：1:1 方形、整卡即套餐渐变色（无白底面板）、权益可展开更多
   实现：flex 换行居中 + aspect-ratio 1/1；面板透明全白字；>3 项折叠 +
        「展开更多」document 级委托切换（PHP wp_footer 输出脚本）
   列数：宽屏 4 张（280px 方卡）/ 中屏 3 张 / 窄屏 2 张 / 极窄 1 张，行内居中
   作用域：.vip-cards-grid（开通弹窗 .payvip-modal 不受影响） */
.vip-cards-grid {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 16px !important;           /* 主题旧规则 gap:20px 会让三列卡死换行 */
}
.vip-cards-grid > .pay-vip-info {
    flex: 0 0 auto !important;      /* 卡片 HTML 带 .flex1(flex:1 1 0%)，不覆盖它 width 会失效、5 卡平分一行 */
    aspect-ratio: 1 / 1;
    min-width: 0;
    margin: 0 !important;           /* .zib-widget 自带 margin-bottom:20px，会撑大行距 */
    overflow: visible !important;   /* 内容超高时撑大卡片而不是裁掉 CTA */
}
/* 中大屏 3 张一行（3+2 居中）；窄屏 2 张；极窄 1 张 */
@media (min-width: 1000px) {
    .vip-cards-grid > .pay-vip-info { width: calc(33.333% - 13px); }
}
@media (min-width: 480px) and (max-width: 999px) {
    .vip-cards-grid > .pay-vip-info { width: calc(50% - 8px); }
}
@media (max-width: 479px) {
    .vip-cards-grid > .pay-vip-info { width: 100%; }
}

/* 卡身：聚焦渐变；模糊水印在透明面板下影响可读性，移除 */
.vip-cards-grid .pay-vip-info {
    padding: 10px 10px 9px !important;
}
.vip-cards-grid .pay-vip-info .vip-baicon { display: none !important; }

/* 徽标 */
.vip-cards-grid .pay-vip-info .v-crest { height: 30px; }
.vip-cards-grid .pay-vip-info .v-crest img {
    height: 27px;
    filter: drop-shadow(0 3px 7px rgba(0, 0, 0, .35)) drop-shadow(0 0 10px var(--v-glow, rgba(255, 255, 255, .4)));
}

/* 面板：透明，无白底 */
.vip-cards-grid .pay-vip-info .v-panel {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0;
}

/* 名称与徽标 chip */
.vip-cards-grid .pay-vip-info .v-head { margin-bottom: 1px; }
.vip-cards-grid .pay-vip-info .v-panel .v-name {
    font-size: 13.5px !important;
    color: #fff !important;
    text-shadow: 0 1px 5px rgba(0, 0, 0, .3);
}
.vip-cards-grid .pay-vip-info .v-panel .v-desc {
    margin-top: 2px;
    padding: 1px 8px;
    font-size: 10px !important;
    background: rgba(255, 255, 255, .18) !important;
    color: #fff !important;
}

/* 价格 */
.vip-cards-grid .pay-vip-info .v-panel .v-sym { font-size: 12px; color: #fff !important; }
.vip-cards-grid .pay-vip-info .v-panel .v-num { font-size: 23px; color: #fff !important; }
.vip-cards-grid .pay-vip-info .v-panel .v-was { font-size: 10.5px; color: rgba(255, 255, 255, .72) !important; }
.vip-cards-grid .pay-vip-info .v-panel .v-term {
    font-size: 10px;
    color: rgba(255, 255, 255, .82) !important;
    margin: 0 0 4px;
}

/* 权益：白字白勾；默认 1 行省略、只显前 3 项；flex 撑满并均匀分布，消除中部空洞 */
.vip-cards-grid .pay-vip-info .v-equity {
    flex: 1 1 auto !important;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    margin: 0 0 4px !important;
    padding: 2px 0 0 !important;
}
.vip-cards-grid .pay-vip-info .v-panel .v-equity li {
    padding: 3px 0 3px 18px;
    font-size: 11.5px;
    line-height: 1.4;
    color: #fff !important;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.vip-cards-grid .pay-vip-info .v-panel .v-equity li strong { color: #fff !important; }
.vip-cards-grid .pay-vip-info .v-panel .v-equity li::before {
    background: rgba(255, 255, 255, .24) !important;
    color: #fff !important;
    top: 4px;
    width: 13px;
    height: 13px;
    line-height: 13px;
    font-size: 8.5px;
}
.vip-cards-grid .pay-vip-info .v-panel .v-equity li:last-child { border-bottom: 0; }

/* 折叠：第 4 项起隐藏；展开后逐项最多 2 行 */
.vip-cards-grid .pay-vip-info .v-equity li:nth-child(n+4) { display: none; }
.vip-cards-grid .pay-vip-info.v-expanded .v-equity li {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
    word-break: break-word;
}
.vip-cards-grid .pay-vip-info.v-expanded .v-equity li:nth-child(n+4) { display: -webkit-box; }

/* 展开按钮 */
.vip-cards-grid .pay-vip-info .v-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    align-self: center;
    margin: 0 0 7px;
    padding: 2px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    user-select: none;
    transition: background .15s ease-out;
}
.vip-cards-grid .pay-vip-info .v-more:hover { background: rgba(255, 255, 255, .3); }
.vip-cards-grid .pay-vip-info .v-more .fa { font-size: 10px; transition: transform .18s ease-out; }
.vip-cards-grid .pay-vip-info.v-expanded .v-more .fa { transform: rotate(180deg); }
.vip-cards-grid .pay-vip-info.v-expanded .v-more .v-more-n { display: none; }

/* CTA：贴底。当前档=白色实底；已含=白描边；升级=白底深字 */
.vip-cards-grid .pay-vip-info .mt20 { margin-top: auto !important; }
.vip-cards-grid .pay-vip-info .v-btn {
    padding: 7px 9px;
    font-size: 12.5px;
    border-radius: 8px;
    gap: 5px;
}
.vip-cards-grid .pay-vip-info .v-btn .fa { font-size: 11px; }
.vip-cards-grid .pay-vip-info .v-btn.is-cur {
    background: rgba(255, 255, 255, .94) !important;
    border: 0;
    color: var(--v-ink) !important;
    font-weight: 800;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}
.vip-cards-grid .pay-vip-info .v-btn.is-off {
    background: transparent !important;
    border: 1.5px solid rgba(255, 255, 255, .75);
    color: #fff !important;
    font-weight: 700;
}
.vip-cards-grid .pay-vip-info a.v-btn {
    background: #fff !important;
    color: var(--v-ink) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .22);
}
.vip-cards-grid .pay-vip-info a.v-btn:hover { filter: none; transform: translateY(-1px); }

/* 窄卡微调（<1000px） */
@media (max-width: 999px) {
    .vip-cards-grid .pay-vip-info .v-crest { height: 34px; }
    .vip-cards-grid .pay-vip-info .v-crest img { height: 30px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-num { font-size: 22px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-equity li { font-size: 11.5px; padding: 3.5px 0 3.5px 18px; }
    .vip-cards-grid .pay-vip-info .v-btn { padding: 7px 8px; font-size: 12.5px; }
}

/* 大方卡（≥1000px）：字号放大一档，填满 382px 卡面（置于末尾确保覆盖基础紧凑值） */
@media (min-width: 1000px) {
    .vip-cards-grid .pay-vip-info .v-crest { height: 40px; }
    .vip-cards-grid .pay-vip-info .v-crest img { height: 36px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-name { font-size: 15px !important; }
    .vip-cards-grid .pay-vip-info .v-panel .v-desc { font-size: 11px !important; }
    .vip-cards-grid .pay-vip-info .v-panel .v-sym { font-size: 13px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-num { font-size: 27px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-was { font-size: 11.5px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-term { font-size: 11px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-equity li { font-size: 12.5px; padding: 4px 0 4px 19px; }
    .vip-cards-grid .pay-vip-info .v-panel .v-equity li::before { top: 5px; width: 14px; height: 14px; line-height: 14px; font-size: 9px; }
    .vip-cards-grid .pay-vip-info .v-more { font-size: 12px; padding: 3px 13px; }
    .vip-cards-grid .pay-vip-info .v-btn { padding: 9px 10px; font-size: 13.5px; }
}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · 会员套餐界面重设计 v7：暗黑沉浸「舞台」
   参考用户提供的大视觉风格：整幅暗色舞台 + 渐变色头带卡 +
   深色权益列表 + 渐变 CTA；至尊档右侧通高。
   只作用于 .mxy-vip-stage（由 mu-plugin mxy-vip-stage.php 注入容器），
   不影响开通会员弹窗等其它位置的卡片。
   ════════════════════════════════════════════════════════════ */
.mxy-vip-stage{position:relative;border-radius:24px;padding:24px 22px 18px;overflow:hidden;
  background:linear-gradient(165deg,#2a1f48 0%,#1a1330 42%,#100b1f 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 28px 70px -40px rgba(20,10,40,.9)}
.mxy-vip-stage::before{content:"";position:absolute;right:-60px;top:-40px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(168,85,247,.28) 0%,rgba(168,85,247,0) 70%);pointer-events:none;z-index:0}
.mxy-vip-stage::after{content:"";position:absolute;left:-40px;bottom:-80px;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(56,189,248,.16) 0%,rgba(56,189,248,0) 70%);pointer-events:none;z-index:0}
.mxy-vip-stage-art{position:absolute;right:0;top:0;bottom:0;width:46%;opacity:.1;z-index:0;
  background-image:url('/wp-content/uploads/gzh/gzh-bg.webp');background-size:cover;background-position:center;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%);pointer-events:none}

/* ── 我的会员 ── */
.mxy-vip-stage .user-content-myvip{position:relative;z-index:1;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:16px 18px;margin:0 0 18px;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff}
.mxy-vip-stage .user-content-myvip .vip-img.abs-right{opacity:.07;filter:grayscale(1)}
.mxy-vip-stage .user-content-myvip .flex2{color:#fff}
.mxy-vip-stage .user-content-myvip .flex2 .name{color:#fff;font-weight:800}
.mxy-vip-stage .user-content-myvip .flex2 .desc{color:#a79ecb !important}
.mxy-vip-stage .user-content-myvip .flex4{color:#fff}
.mxy-vip-stage .user-content-myvip .flex4 .muted-2-color,
.mxy-vip-stage .user-content-myvip .flex4 .muted-color{color:#a79ecb !important}
.mxy-vip-stage .user-content-myvip .flex4 .em16.font-bold{color:#fff}
.mxy-vip-stage .user-content-myvip .flex4 .badg{background:rgba(255,255,255,.12);color:#e6dcff;border:1px solid rgba(255,255,255,.14)}

/* ── 网格：2×2 + 至尊右侧通高 ── */
.mxy-vip-stage .vip-cards-grid{position:relative;z-index:1;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr)) minmax(0,1.12fr);gap:14px;align-items:stretch}
.mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-row:span 2}
@media (max-width:1180px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-row:auto;grid-column:span 2}
}
@media (max-width:760px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:1fr}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-column:auto}
}

/* ── 卡片本体 ── */
.mxy-vip-stage .pay-vip-info{position:relative;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,rgba(43,32,72,.92),rgba(26,19,46,.94));
  border:1px solid rgba(255,255,255,.09);box-shadow:0 18px 40px -26px rgba(0,0,0,.85);
  transition:transform .18s ease-out,box-shadow .18s ease-out,border-color .18s ease-out;text-align:center;color:#fff}
.mxy-vip-stage .pay-vip-info:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.18);box-shadow:0 26px 52px -26px rgba(0,0,0,.9)}
.mxy-vip-stage .pay-vip-info .abs-center{display:none}
.mxy-vip-stage .pay-vip-info .v-crest{display:flex;align-items:center;justify-content:center;gap:8px;
  height:52px !important;margin:14px 0 0;position:relative;z-index:2}
.mxy-vip-stage .pay-vip-info .v-crest img{height:28px;width:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.mxy-vip-stage .pay-vip-info .v-panel{flex:1 1 auto;display:flex;flex-direction:column;padding:0 0 16px;background:transparent !important}

/* 渐变头带 */
.mxy-vip-stage .pay-vip-info .v-head{position:relative;margin:6px 14px 0;padding:10px 12px;border-radius:14px;
  background:var(--v-grad);box-shadow:0 12px 24px -14px var(--v-soft),inset 0 1px 0 rgba(255,255,255,.28)}
.mxy-vip-stage .pay-vip-info .v-panel .v-name{font-size:15.5px !important;font-weight:800 !important;color:#fff !important;
  letter-spacing:.02em;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.mxy-vip-stage .pay-vip-info .v-panel .v-desc{display:inline-block;margin-top:5px;padding:2px 10px;border-radius:999px;
  font-size:10.5px !important;font-weight:700 !important;color:rgba(255,255,255,.9) !important;background:rgba(0,0,0,.22)}

/* 价格 */
.mxy-vip-stage .pay-vip-info .v-price{display:flex;align-items:baseline;justify-content:center;gap:3px;margin:16px 0 4px}
.mxy-vip-stage .pay-vip-info .v-panel .v-sym{font-size:17px;font-weight:800;color:#fff}
.mxy-vip-stage .pay-vip-info .v-panel .v-num{font-size:37px !important;font-weight:800;line-height:1;letter-spacing:-.03em;
  color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 4px 18px rgba(0,0,0,.45)}
.mxy-vip-stage .pay-vip-info .v-panel .v-was{font-size:13px;font-weight:600;margin-left:7px;text-decoration:line-through;color:rgba(255,255,255,.38)}
.mxy-vip-stage .pay-vip-info .v-panel .v-term{text-align:center;font-size:11.5px;font-weight:600;color:#a79ecb;margin:0 0 14px}

/* 权益：全部展开 */
.mxy-vip-stage .pay-vip-info .v-equity{flex:1 1 auto;list-style:none;margin:0 0 16px !important;padding:0 16px !important;text-align:left}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li{position:relative;padding:7px 0 7px 15px;font-size:12.6px;line-height:1.62;
  color:#d3cde6;border-bottom:1px dashed rgba(255,255,255,.08);display:list-item !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li:last-child{border-bottom:0}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li::before{content:"";position:absolute;left:0;top:12px;width:6px;height:6px;
  border-radius:2px;background:var(--v-soft);box-shadow:0 0 8px var(--v-soft)}
.mxy-vip-stage .pay-vip-info .v-more{display:none !important}

/* CTA */
.mxy-vip-stage .pay-vip-info .mt20{margin-top:auto !important;padding:0 14px}
.mxy-vip-stage .pay-vip-info .v-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:46px;
  border:0;border-radius:13px;font-size:14px;font-weight:800;color:#fff;text-decoration:none !important;
  background:var(--v-grad);box-shadow:0 14px 26px -14px var(--v-soft);
  transition:transform .16s ease-out,box-shadow .16s ease-out,filter .16s ease-out}
.mxy-vip-stage .pay-vip-info a.v-btn:hover{transform:translateY(-2px);box-shadow:0 20px 32px -14px var(--v-soft);filter:brightness(1.07)}
.mxy-vip-stage .pay-vip-info .v-btn.is-cur{background:rgba(255,255,255,.09) !important;color:rgba(255,255,255,.55) !important;box-shadow:none}
.mxy-vip-stage .pay-vip-info .v-btn.is-off{background:rgba(255,255,255,.04) !important;color:rgba(255,255,255,.42) !important;
  border:1px dashed rgba(255,255,255,.18);box-shadow:none}

/* 殿堂级：推荐角标 */
.mxy-vip-stage .pay-vip-info.level-3 .v-head::after{content:"最多人选择";position:absolute;top:-9px;right:10px;font-size:10px;
  font-weight:800;letter-spacing:.06em;color:#fff;background:linear-gradient(135deg,#f59e0b,#f0652a);
  padding:3px 9px;border-radius:999px;box-shadow:0 8px 16px -8px rgba(240,101,42,.95)}

/* 至尊：通高、更亮 */
.mxy-vip-stage .pay-vip-info.level-5{border-color:rgba(233,120,90,.35);
  box-shadow:0 24px 56px -30px rgba(0,0,0,.95),inset 0 0 60px -30px rgba(233,120,90,.5)}
.mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-num{font-size:44px !important}
.mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity li{font-size:13.2px;padding:8px 0 8px 16px}

/* 每档配色 */
.mxy-vip-stage .pay-vip-info.level-1{--v-grad:linear-gradient(135deg,#f0a35c,#e0722a 55%,#c25315);--v-soft:#e0722a}
.mxy-vip-stage .pay-vip-info.level-2{--v-grad:linear-gradient(135deg,#a88bf5,#7b5bd6 55%,#5f45bd);--v-soft:#7b5bd6}
.mxy-vip-stage .pay-vip-info.level-3{--v-grad:linear-gradient(135deg,#6c9fd0,#2f5f92 55%,#1c3a5e);--v-soft:#4d84bd}
.mxy-vip-stage .pay-vip-info.level-4{--v-grad:linear-gradient(135deg,#5cb894,#1f6b50 55%,#144434);--v-soft:#1f6b50}
.mxy-vip-stage .pay-vip-info.level-5{--v-grad:linear-gradient(135deg,#f2917a,#c93a30 55%,#a5221d);--v-soft:#c93a30}

/* 舞台底部信息条 */
.mxy-vip-foot{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin:18px 0 0;padding:14px 18px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07)}
.mxy-vip-foot .t{font-size:14px;font-weight:800;color:#fff}
.mxy-vip-foot .s{font-size:11.5px;color:#a79ecb;margin-top:3px}
.mxy-vip-foot .k{font-size:11.5px;color:#cbbdf3}

@media (max-width:760px){
  .mxy-vip-stage{padding:16px 14px 14px;border-radius:18px}
  .mxy-vip-stage .pay-vip-info .v-panel .v-num{font-size:38px !important}
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-num{font-size:40px !important}
  .mxy-vip-stage .user-content-myvip{flex-wrap:wrap}
}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · 用户中心 VIP 页布局 v8：侧栏 → 顶部横排
   左栏（统计/会员 pill/余额/推广/我的服务/功能设置）拆成顶部一排卡片，
   会员套餐（我的会员 + 5 张卡）整体放到下面全宽。
   仅作用于 vip 页（由 mxy-vip-stage.php 给 .user-center 加 .mxy-vip-topnav）
   ════════════════════════════════════════════════════════════ */
.user-center.mxy-vip-topnav{display:flex !important;flex-direction:column;gap:16px}
.user-center.mxy-vip-topnav .user-center-sidebar{
  width:100% !important;max-width:none !important;float:none !important;position:static !important;
  order:-1;display:flex;flex-wrap:wrap;gap:12px;align-items:stretch;margin:0 !important}
.user-center.mxy-vip-topnav .user-center-content{
  width:100% !important;max-width:none !important;float:none !important;padding-left:0 !important}
.user-center.mxy-vip-topnav .user-center-sidebar>.sidebar-user,
.user-center.mxy-vip-topnav .user-center-sidebar>.hide{display:none !important}
.user-center.mxy-vip-topnav .drawer-toggle,
.user-center.mxy-vip-topnav .user-sidebar-toggle,
.user-center.mxy-vip-topnav .user-center-sidebar-toggle{display:none !important}

/* 各块在横排中的占位（子元素顺序固定：0空 1统计 2会员pill 3余额 4推广 5服务 6设置 7空 8隐藏导航） */
.user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(2){flex:1 1 320px;margin:0 !important}
.user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(3){flex:1 1 240px;margin:0 !important}
.user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(4){flex:1 1 170px;margin:0 !important}
.user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(5){flex:1 1 190px;margin:0 !important}
.user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(6),
.user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(7){flex:1 1 300px;margin:0 !important}

/* 统一观感：圆角卡片 */
.user-center.mxy-vip-topnav .user-center-sidebar>.zib-widget{border-radius:14px;box-shadow:0 8px 22px -16px rgba(40,30,70,.3)}
.user-center.mxy-vip-topnav .user-center-sidebar>.zib-widget.padding-6{padding:12px 14px !important}
.user-center.mxy-vip-topnav .user-center-sidebar>.zib-widget.padding-10{padding:12px 16px !important}

/* 余额/推广的外层是「左右两栏」结构，横排 chips 里改成整块 */
.user-center.mxy-vip-topnav .user-center-sidebar>.flex.ab.jsb{display:block}
.user-center.mxy-vip-topnav .user-center-sidebar>.flex.ab.jsb>.zib-widget{width:100%;height:100%;margin:0 0 10px !important}
.user-center.mxy-vip-topnav .user-center-sidebar>.flex.ab.jsb>.zib-widget:last-child{margin-bottom:0 !important}

/* 会员 pill：稍大一点，撑满 chip */
.user-center.mxy-vip-topnav .user-center-sidebar>.payvip-icon{display:flex;align-items:center;justify-content:center;gap:8px;min-height:62px;font-size:14px}

/* 我的服务 / 功能设置：图标+文字排一行，允许换行 */
.user-center.mxy-vip-topnav .user-icon-but-box{flex-wrap:wrap;gap:10px 16px !important;justify-content:flex-start}

/* 统计行：数字大一点 */
.user-center.mxy-vip-topnav .user-statistics-item{flex:1 1 auto}

@media (max-width:640px){
  .user-center.mxy-vip-topnav{gap:12px}
  .user-center.mxy-vip-topnav .user-center-sidebar{gap:10px}
  .user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(n){flex:1 1 100%}
  .user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(2){flex:1 1 100%}
}

/* ═══ v8b 修正：移动端抽屉模式下 content 为 fixed 脱流，强制回流 ═══ */
.user-center.mxy-vip-topnav .user-center-content{
  position:static !important;inset:auto !important;transform:none !important;
  height:auto !important;min-height:0 !important;overflow:visible !important;
  width:100% !important;max-width:none !important;padding-left:0 !important;margin:0 !important}
.user-center.mxy-vip-topnav .user-center-sidebar{
  position:static !important;transform:none !important;height:auto !important;overflow:visible !important;width:100% !important}
@media (max-width:640px){
  .user-center.mxy-vip-topnav .user-center-sidebar>*:nth-child(n){flex:1 1 100%}
}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · v9：① 舞台背景恢复原来的浅色（去掉暗黑面板/插画暗纹/光晕）
                  ② 套餐卡背景 = 各档 logo 高斯模糊预渲染图
                     （uploads/vipcard/vip-N-blur.webp，由 logo 放大 2.6 倍 +
                      高斯半径 90 预渲染）+ 白色蒙版保证可读性
   ════════════════════════════════════════════════════════════ */

/* ① 舞台恢复浅色：透明背景、无投影、无装饰层 */
.mxy-vip-stage{background:none !important;box-shadow:none !important;padding:0 !important}
.mxy-vip-stage::before,.mxy-vip-stage::after{display:none !important}
.mxy-vip-stage-art{display:none !important}

/* 「我的会员」恢复主题原来的浅色卡片 */
.mxy-vip-stage .user-content-myvip{background:#fff !important;border:1px solid rgba(0,0,0,.06) !important;
  -webkit-backdrop-filter:none;backdrop-filter:none;color:#333 !important}
.mxy-vip-stage .user-content-myvip .flex2 .name{color:#333 !important}
.mxy-vip-stage .user-content-myvip .flex2 .desc{color:#999 !important}
.mxy-vip-stage .user-content-myvip .flex4{color:#333 !important}
.mxy-vip-stage .user-content-myvip .flex4 .muted-2-color,
.mxy-vip-stage .user-content-myvip .flex4 .muted-color{color:#999 !important}
.mxy-vip-stage .user-content-myvip .flex4 .em16.font-bold{color:#333 !important}
.mxy-vip-stage .user-content-myvip .flex4 .badg{background:#f2f3f5 !important;color:#666 !important;border:0 !important}

/* 底部信息条恢复浅色 */
.mxy-vip-foot{background:#fff !important;border:1px solid rgba(0,0,0,.06) !important;box-shadow:0 6px 18px -14px rgba(40,30,70,.22)}
.mxy-vip-foot .t{color:#2b2145 !important}
.mxy-vip-foot .s{color:#8d84a6 !important}
.mxy-vip-foot .k{color:#a49bbd !important}

/* ② 套餐卡：白底 + logo 高斯模糊背景 + 白蒙版 */
.mxy-vip-stage .pay-vip-info{
  background:#fff !important;
  border:1px solid #eae8f1;
  box-shadow:0 14px 34px -22px rgba(40,30,70,.35)}
.mxy-vip-stage .pay-vip-info:hover{box-shadow:0 22px 44px -22px rgba(40,30,70,.45);border-color:var(--v-line,#e2dcf8)}
.mxy-vip-stage .pay-vip-info.level-1{background-image:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.92)),url('/wp-content/uploads/vipcard/vip-1-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-2{background-image:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.92)),url('/wp-content/uploads/vipcard/vip-2-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-3{background-image:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.92)),url('/wp-content/uploads/vipcard/vip-3-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-4{background-image:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.92)),url('/wp-content/uploads/vipcard/vip-4-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-5{background-image:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.92)),url('/wp-content/uploads/vipcard/vip-5-blur.webp')}
.mxy-vip-stage .pay-vip-info{background-size:cover,cover;background-position:center,center;background-repeat:no-repeat,no-repeat}

/* 至尊档：描边/投影按等级色收敛 */
.mxy-vip-stage .pay-vip-info.level-5{border-color:rgba(233,120,90,.3);box-shadow:0 18px 44px -24px rgba(233,120,90,.4)}

/* 文字回深色 */
.mxy-vip-stage .pay-vip-info{color:#2b2145}
.mxy-vip-stage .pay-vip-info .v-panel .v-num{color:var(--v-ink) !important;text-shadow:none}
.mxy-vip-stage .pay-vip-info .v-panel .v-sym{color:var(--v-ink)}
.mxy-vip-stage .pay-vip-info .v-panel .v-was{color:#a9a4b8}
.mxy-vip-stage .pay-vip-info .v-panel .v-term{color:#7c7195}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li{color:#4c4663}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li::before{box-shadow:none}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li{border-bottom:1px dashed rgba(43,33,69,.10)}
/* 头带保持等级渐变+白字；CTA 保持等级渐变 */
.mxy-vip-stage .pay-vip-info .v-btn.is-cur{background:#f2f3f5 !important;color:#8b84a3 !important}
.mxy-vip-stage .pay-vip-info .v-btn.is-off{background:#fbfbfd !important;color:#a9a4b8 !important;border:1px dashed #ddd9e8}

/* 图标下加一点等级色柔光，让 crest 和糊化背景呼应 */
.mxy-vip-stage .pay-vip-info .v-crest img{filter:drop-shadow(0 6px 14px rgba(0,0,0,.18))}

/* ═══ v9b：白蒙版降不透明度，让 logo 高斯模糊的色晕透出来 ═══ */
.mxy-vip-stage .pay-vip-info.level-1{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-1-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-2{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-2-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-3{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-3-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-4{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-4-blur.webp')}
.mxy-vip-stage .pay-vip-info.level-5{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-5-blur.webp')}
/* 权益区/价格区再压一层轻纱，保证长文可读 */
.mxy-vip-stage .pay-vip-info .v-panel{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.30)) !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-num{text-shadow:0 2px 10px rgba(255,255,255,.65)}

/* ═══ v9c：修正 background 简写把背景图清掉的问题（改 background-color + 背景图 !important） ═══ */
.mxy-vip-stage .pay-vip-info{background-color:#fff !important}
.mxy-vip-stage .pay-vip-info.level-1{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-1-blur.webp') !important}
.mxy-vip-stage .pay-vip-info.level-2{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-2-blur.webp') !important}
.mxy-vip-stage .pay-vip-info.level-3{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-3-blur.webp') !important}
.mxy-vip-stage .pay-vip-info.level-4{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-4-blur.webp') !important}
.mxy-vip-stage .pay-vip-info.level-5{background-image:linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,.58)),url('/wp-content/uploads/vipcard/vip-5-blur.webp') !important}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · v10：套餐卡改为「顶部导航悬浮菜单」同款渐变卡
   取色/按钮/文字均来自主题 .vip-card.vip-themeN 的实测计算值，
   保证会员页与导航悬浮菜单、开通弹窗三处视觉一致。
   ════════════════════════════════════════════════════════════ */
.mxy-vip-stage .pay-vip-info{
  border:0 !important;
  box-shadow:0 16px 34px -20px rgba(40,30,70,.5) !important}
.mxy-vip-stage .pay-vip-info:hover{transform:translateY(-3px);box-shadow:0 24px 46px -22px rgba(40,30,70,.6) !important}
.mxy-vip-stage .pay-vip-info .v-panel{background:transparent !important}

/* 头带改为「无渐变带」：直接落在卡片渐变上 */
.mxy-vip-stage .pay-vip-info .v-head{background:none !important;box-shadow:none !important;margin:12px 16px 0 !important;padding:0 !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-name{color:var(--v-txt) !important;text-shadow:0 1px 6px rgba(0,0,0,.12) !important;font-size:16px !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-desc{background:rgba(255,255,255,.22) !important;color:var(--v-txt) !important;backdrop-filter:blur(2px)}

/* 价格 / 说明 / 权益：跟随该档文字色 */
.mxy-vip-stage .pay-vip-info{color:var(--v-txt)}
.mxy-vip-stage .pay-vip-info .v-panel .v-num,
.mxy-vip-stage .pay-vip-info .v-panel .v-sym{color:var(--v-txt) !important;text-shadow:0 2px 12px rgba(0,0,0,.18)}
.mxy-vip-stage .pay-vip-info .v-panel .v-was{color:var(--v-txt) !important;opacity:.55;text-decoration:line-through}
.mxy-vip-stage .pay-vip-info .v-panel .v-term{color:var(--v-txt) !important;opacity:.85}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li{color:var(--v-txt) !important;border-bottom:1px dashed rgba(255,255,255,.22)}
.mxy-vip-stage .pay-vip-info.level-1 .v-panel .v-equity li{border-bottom-color:rgba(120,70,20,.18)}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li::before{background:currentColor;box-shadow:none;opacity:.9}

/* CTA：胶囊 + 该档按钮渐变（与悬浮菜单一致） */
.mxy-vip-stage .pay-vip-info .v-btn{background:var(--v-cta) !important;color:var(--v-cta-txt) !important;
  border:0;border-radius:999px;height:42px;font-size:13.5px;font-weight:700;
  box-shadow:0 12px 22px -12px rgba(0,0,0,.45) !important}
.mxy-vip-stage .pay-vip-info .v-btn.is-cur{background:rgba(255,255,255,.25) !important;color:var(--v-txt) !important;box-shadow:none !important}
.mxy-vip-stage .pay-vip-info .v-btn.is-off{background:rgba(255,255,255,.12) !important;color:var(--v-txt) !important;opacity:.75;border:0;box-shadow:none !important}
.mxy-vip-stage .pay-vip-info .mt20{padding:0 16px}

/* 「最多人选择」角标：挪到头带左上，浅底深字更醒目 */
.mxy-vip-stage .pay-vip-info.level-3 .v-head::after{top:-13px;right:auto;left:0;
  background:linear-gradient(135deg,#ffd76e,#ff9f43);color:#5a3200;text-shadow:none}

/* ── 每档：背景渐变 + 文字色 + 按钮渐变（数值取自悬浮菜单实测） ── */
.mxy-vip-stage .pay-vip-info.level-1{--v-txt:#866127;--v-cta:linear-gradient(135deg,#ff9633 10%,#f14315 100%);--v-cta-txt:#fff;
  background-image:linear-gradient(135deg,rgba(255,127,175,.57) 10%,#43b2ff 100%) !important}
.mxy-vip-stage .pay-vip-info.level-2{--v-txt:#f2f0ff;--v-cta:linear-gradient(270deg,#ada48a,#eae5b7 45%,#f5efd6);--v-cta-txt:#72511d;
  background-image:linear-gradient(43deg,#ff6ac3 0%,#465dff 46%,#72e699 100%) !important}
.mxy-vip-stage .pay-vip-info.level-3{--v-txt:#d8e8f7;--v-cta:linear-gradient(135deg,#4f7fae 0%,#1c3a5e 100%);--v-cta-txt:#fff;
  background-image:linear-gradient(132deg,#5b8db8 0%,#1c3a5e 35%,#2a5580 70%,#1e3d63 100%) !important}
.mxy-vip-stage .pay-vip-info.level-4{--v-txt:#d5efe3;--v-cta:linear-gradient(135deg,#2f8a68 0%,#144434 100%);--v-cta-txt:#fff;
  background-image:linear-gradient(132deg,#3f8f70 0%,#144434 35%,#1f6350 70%,#164a3b 100%) !important}
.mxy-vip-stage .pay-vip-info.level-5{--v-txt:#ffeeee;--v-cta:linear-gradient(135deg,#e0564a 0%,#b32b2b 100%);--v-cta-txt:#fff;
  background-image:linear-gradient(132deg,#f2927a 0%,#b32b2b 30%,#c93a30 80%,#b52c26 100%) !important;
  box-shadow:0 20px 46px -22px rgba(179,43,43,.55) !important}

/* 图标：白描边提高在渐变上的辨识度 */
.mxy-vip-stage .pay-vip-info .v-crest img{filter:drop-shadow(0 6px 14px rgba(0,0,0,.35)) drop-shadow(0 0 2px rgba(255,255,255,.35))}

/* ═══ v10b：网格显式定位 —— 2×2 + 至尊右侧通高（自动排布会变成 3+2） ═══ */
.mxy-vip-stage .vip-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr)) minmax(0,1.12fr) !important}
.mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-1{grid-area:1/1/2/2}
.mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-2{grid-area:1/2/2/3}
.mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-3{grid-area:2/1/3/2}
.mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-4{grid-area:2/2/3/3}
.mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-area:1/3/3/4}
@media (max-width:1180px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-1{grid-area:auto}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-2{grid-area:auto}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-3{grid-area:auto}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-4{grid-area:auto}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-area:auto;grid-column:span 2}
}
@media (max-width:760px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:1fr !important}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-column:auto}
}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · v11：套餐卡尺寸整体收紧（原 457×537 / 至尊 603 偏高）
   目标：卡片高度降到 ~430，页面纵向更紧凑，比例更接近悬浮菜单卡片
   ════════════════════════════════════════════════════════════ */
/* 顶部图标区：52 → 42 */
.mxy-vip-stage .pay-vip-info .v-crest{height:44px !important;margin:10px 0 0 !important}
.mxy-vip-stage .pay-vip-info .v-crest img{height:32px}
/* 头带更薄 */
.mxy-vip-stage .pay-vip-info .v-head{margin:6px 14px 0 !important;padding:7px 10px !important;border-radius:12px !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-name{font-size:14.5px !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-desc{margin-top:3px !important;padding:1px 9px !important;font-size:10px !important}
/* 价格：37 → 31，间距收紧 */
.mxy-vip-stage .pay-vip-info .v-price{margin:12px 0 2px !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-num{font-size:32px !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-sym{font-size:15px}
.mxy-vip-stage .pay-vip-info .v-panel .v-was{font-size:12px}
.mxy-vip-stage .pay-vip-info .v-panel .v-term{margin:0 0 10px !important;font-size:11px}
/* 权益列表：行距/字号/内边距收紧 */
.mxy-vip-stage .pay-vip-info .v-equity{margin:0 0 12px !important;padding:0 14px !important}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li{font-size:12px;padding:5px 0 5px 14px !important;line-height:1.52}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li::before{top:10px;width:5px;height:5px}
/* CTA：46 → 40 */
.mxy-vip-stage .pay-vip-info .v-btn{height:40px !important;font-size:13px !important}
.mxy-vip-stage .pay-vip-info .mt20{padding:0 14px}
.mxy-vip-stage .pay-vip-info .v-panel{padding:0 0 14px !important}

/* 至尊：号码/字号同步收敛，清单两列并排（横向空间够，省一半高度） */
.mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-num{font-size:34px !important}
.mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity{column-count:2;column-gap:16px;padding:0 14px !important}
.mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity li{font-size:11.6px !important;padding:5px 0 5px 13px !important;break-inside:avoid;border-bottom:0}
.mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity li::before{width:4px;height:4px;top:10px}
@media (max-width:1180px){
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity{column-count:1}
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity li{border-bottom:1px dashed rgba(255,255,255,.18)}
}

/* 舞台/底部条间距也收一点，整页更紧凑 */
.mxy-vip-stage .user-content-myvip{margin:0 0 14px !important;padding:14px 16px !important}
.mxy-vip-foot{margin:14px 0 0 !important;padding:12px 16px !important}
.mxy-vip-stage .vip-cards-grid{gap:12px !important}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · v12：尺寸重排
   ① 根因修正：.vip-cards-grid 实际是 flex（主题 .flex 类带 !important），
      之前的 grid-template 全部没生效 → 强制 display:grid
   ② 宽屏(≥1300px) 5 张一排（对齐顶部悬浮菜单的形态），卡片尺寸收紧；
      至尊自然更高（清单最长），底边参差与悬浮菜单一致
   ③ 1300px 以下回到 2 列 / 1 列
   ════════════════════════════════════════════════════════════ */
.mxy-vip-stage .vip-cards-grid{display:grid !important;justify-content:initial !important;flex-wrap:nowrap !important}

@media (min-width:1300px){
  .mxy-vip-stage .vip-cards-grid{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;gap:12px !important;align-items:start !important}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info{grid-area:auto !important}
  /* 卡片内部尺寸：按 270px 宽重新配平 */
  .mxy-vip-stage .pay-vip-info .v-crest{height:38px !important;margin:9px 0 0 !important}
  .mxy-vip-stage .pay-vip-info .v-crest img{height:26px}
  .mxy-vip-stage .pay-vip-info .v-head{margin:5px 10px 0 !important;padding:6px 8px !important;border-radius:11px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-name{font-size:13.5px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-desc{margin-top:3px !important;padding:1px 8px !important;font-size:9.5px !important}
  .mxy-vip-stage .pay-vip-info .v-price{margin:10px 0 2px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-num{font-size:28px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-sym{font-size:14px}
  .mxy-vip-stage .pay-vip-info .v-panel .v-was{font-size:11px;margin-left:4px}
  .mxy-vip-stage .pay-vip-info .v-panel .v-term{margin:0 0 9px !important;font-size:10.5px}
  .mxy-vip-stage .pay-vip-info .v-equity{margin:0 0 11px !important;padding:0 10px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-equity li{font-size:11.4px;padding:4px 0 4px 12px !important;line-height:1.5}
  .mxy-vip-stage .pay-vip-info .v-panel .v-equity li::before{top:9px;width:4px;height:4px}
  .mxy-vip-stage .pay-vip-info .v-btn{height:36px !important;font-size:12.5px !important}
  .mxy-vip-stage .pay-vip-info .mt20{padding:0 10px}
  .mxy-vip-stage .pay-vip-info .v-panel{padding:0 0 12px !important}
  /* 至尊：窄卡里清单回单列，字号略收 */
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity{column-count:1;padding:0 10px !important}
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity li{font-size:11.4px !important;border-bottom:1px dashed rgba(255,255,255,.18)}
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-num{font-size:30px !important}
}

/* 1300 以下：2 列均分（不再出现"3 上 2 下 居中"的空档） */
@media (max-width:1299px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info{grid-area:auto !important}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-column:span 2 !important}
}
@media (max-width:760px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:1fr !important}
  .mxy-vip-stage .vip-cards-grid>.pay-vip-info.level-5{grid-column:auto !important}
}

/* ═══ v12b：修正卡片在 grid 里不拉伸（79px 宽）——强制 auto 宽度 + stretch ═══ */
.mxy-vip-stage .vip-cards-grid>.pay-vip-info{
  width:auto !important;max-width:none !important;justify-self:stretch !important;align-self:stretch !important;
  flex:initial !important;float:none !important}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · v13：套餐卡图标放大（用户反馈"图标太小了"）
   26px → 66px（宽屏 5 连），并同步配平上下间距，避免卡片高度失控
   ════════════════════════════════════════════════════════════ */
/* 宽屏（5 连 272px 卡） */
@media (min-width:1300px){
  .mxy-vip-stage .pay-vip-info .v-crest{height:76px !important;margin:14px 0 0 !important}
  .mxy-vip-stage .pay-vip-info .v-crest img{height:66px;width:auto}
  .mxy-vip-stage .pay-vip-info .v-head{margin:10px 10px 0 !important}
  .mxy-vip-stage .pay-vip-info .v-price{margin:14px 0 2px !important}
  .mxy-vip-stage .pay-vip-info .v-head{border-radius:12px !important;padding:7px 9px !important}
}
/* 中屏（2 列）与手机（1 列）：同步放大，卡片更宽可以更大一些 */
@media (max-width:1299px){
  .mxy-vip-stage .pay-vip-info .v-crest{height:84px !important;margin:16px 0 0 !important}
  .mxy-vip-stage .pay-vip-info .v-crest img{height:72px}
  .mxy-vip-stage .pay-vip-info .v-price{margin:14px 0 2px !important}
}
/* 图标加一点光晕，在渐变底上更立体、辨识度更高 */
.mxy-vip-stage .pay-vip-info .v-crest img{
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.38)) drop-shadow(0 0 6px rgba(255,255,255,.28))}

/* ════════════════════════════════════════════════════════════
   2026-09-28 · v14：
   ① 权益文字被主题的 white-space:nowrap + overflow:hidden 截成一行
      → 强制换行、显示全文（不再出现"…"）
   ② 夜间模式适配：上一版把"我的会员/底部条"强制白底，
      主题夜间模式文字是浅色 → 白底浅字看不见。这里按 dark-theme 给深色底
   ════════════════════════════════════════════════════════════ */
/* ① 权益全文显示 */
.mxy-vip-stage .pay-vip-info .v-panel .v-equity li{
  white-space:normal !important;overflow:visible !important;text-overflow:clip !important;
  display:list-item !important;max-height:none !important;
  -webkit-line-clamp:none !important;-webkit-box-orient:initial !important;
  word-break:break-word;overflow-wrap:anywhere}
.mxy-vip-stage .pay-vip-info .v-panel .v-equity{overflow:visible !important}

/* ② 夜间模式：我的会员 / 底部信息条 用半透明深底 + 浅色字 */
body.dark-theme .mxy-vip-stage .user-content-myvip{
  background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.10) !important;color:#e5eef7 !important}
body.dark-theme .mxy-vip-stage .user-content-myvip .flex2 .name,
body.dark-theme .mxy-vip-stage .user-content-myvip .flex4 .em16.font-bold{color:#e5eef7 !important}
body.dark-theme .mxy-vip-stage .user-content-myvip .flex2 .desc,
body.dark-theme .mxy-vip-stage .user-content-myvip .flex4 .muted-2-color,
body.dark-theme .mxy-vip-stage .user-content-myvip .flex4 .muted-color{color:#a9a2c4 !important}
body.dark-theme .mxy-vip-stage .user-content-myvip .flex4 .badg{
  background:rgba(255,255,255,.12) !important;color:#e8defc !important;border:1px solid rgba(255,255,255,.14) !important}
body.dark-theme .mxy-vip-stage .user-content-myvip .vip-img.abs-right{opacity:.10 !important}

body.dark-theme .mxy-vip-foot{
  background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.08) !important;box-shadow:none !important}
body.dark-theme .mxy-vip-foot .t{color:#e5eef7 !important}
body.dark-theme .mxy-vip-foot .s{color:#a9a2c4 !important}
body.dark-theme .mxy-vip-foot .k{color:#9d95b5 !important}

/* 夜间模式：卡片阴影收敛（暗底上重影很脏） */
body.dark-theme .mxy-vip-stage .pay-vip-info{box-shadow:0 16px 34px -22px rgba(0,0,0,.85) !important}

/* v15：宽屏 4 张等宽 + 至尊加宽 1.45 倍；列表排版收紧，抵消全文换行的高度 */
@media (min-width:1300px){
  .mxy-vip-stage .vip-cards-grid{grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.45fr) !important}
  .mxy-vip-stage .pay-vip-info .v-equity{margin:0 0 10px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-equity li{font-size:11.2px;line-height:1.45;padding:3.5px 0 3.5px 11px !important}
  .mxy-vip-stage .pay-vip-info .v-panel .v-equity li::before{top:8px;width:4px;height:4px}
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity li{font-size:11.2px !important}
  .mxy-vip-stage .pay-vip-info.level-5 .v-panel .v-equity{padding:0 12px !important}
}

/* ════════════════════════════════════════════════════════════
   v16 · 2026-09-29：「我的会员」横条背景同步当前会员等级
   ────────────────────────────────────────────────────────────
   卡片封面 = .pay-vip-info.level-N 上的等级渐变（实测 computed：
     L1 135deg,rgba(255,127,175,.57) 10%,#43b2ff ／ L2 43deg,#ff6ac3,#465dff 46%,#72e699
     L3 132deg,#5b8db8,#1c3a5e 35%,#2a5580 70%,#1e3d63 ／ L4 祖母绿 ／ L5 赤红）
   而「我的会员」横条背景是固定色（2098 行 #fff、2370 行 dark-theme 半透明深底），
   等级色从没同步过来。

   做法：用 :has() 找出 5 张卡里带 .v-btn.is-cur 的那张（= 当前等级，
        PHP 侧 $vip_level === $_cur_lv 时输出「当前等级」按钮），在舞台容器上
        定义 --mxy-cur-grad；自定义属性沿 DOM 继承，横条是舞台后代可直接 var()。

   v16b 修正两处冲突（用户实测反馈）：
   ① 白天模式字体是黑的 —— 2098-2106 段在为「白底横条」写死 #333/#999，背景换成
      深色封面后必须把文字改回浅色，故本段所有规则都加了 body 前缀 + !important
      压过 (0,4,0)。
   ② 夜间模式不生效 —— 2370 段 body.dark-theme … .user-content-myvip (0,3,1)
      带 !important，特异性高于原来的 (0,2,0)，把等级渐变背景重置了；本段补齐
      body.dark-theme 变体 (0,5,1) 并置于文件末尾。

   未开通会员时没有 .is-cur → 变量不定义 → var(--mxy-cur-grad,none) = none，
   横条保持原样（白天白底深字 / 夜间半透明深底浅字，均不受影响）。
   回滚：删除本段；整文件回滚见 vip-theme-extend.css.bak.topbarcover-20260929
   ════════════════════════════════════════════════════════════ */

/* ① 等级色变量（定义在舞台容器 → 横条继承） */
.mxy-vip-stage:has(.pay-vip-info.level-1 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(135deg,rgba(255,127,175,.57) 10%,#43b2ff)}
.mxy-vip-stage:has(.pay-vip-info.level-2 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(43deg,#ff6ac3,#465dff 46%,#72e699)}
.mxy-vip-stage:has(.pay-vip-info.level-3 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(132deg,#5b8db8,#1c3a5e 35%,#2a5580 70%,#1e3d63)}
.mxy-vip-stage:has(.pay-vip-info.level-4 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(132deg,#3f8f70,#144434 35%,#1f6350 70%,#164a3b)}
.mxy-vip-stage:has(.pay-vip-info.level-5 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(132deg,#f2927a,#b32b2b 30%,#c93a30 80%,#b52c26)}

/* ② 横条背景 = 当前等级渐变（白天 + 夜间双写，压过 2098 / 2370） */
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip{
  background-image:var(--mxy-cur-grad,none) !important;
  background-size:cover !important;
  background-position:center !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 18px 36px -24px rgba(0,0,0,.55) !important;
}

/* ③ 横条内文字统一浅色（深色封面上 #333 看不见） */
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex2,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex2 .name,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .em16,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .em16.font-bold,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex2 .name,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .em16.font-bold{color:#fff !important}

body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex2 .desc,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .muted-color,
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .muted-2-color,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex2 .desc,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .muted-2-color{color:rgba(255,255,255,.78) !important}

/* 「永久会员」徽章：浅灰底深字在白底上成立，深色封面上要改半透明浅底 + 白字 */
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .badg,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .flex4 .badg{
  background:rgba(255,255,255,.18) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.22) !important}

/* ④ 装饰花纹（主题内置图标，与等级无关）淡化 + 灰度，避免在彩色封面上撞色 */
body .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .vip-img.abs-right,
body.dark-theme .mxy-vip-stage:has(.v-btn.is-cur) .user-content-myvip .vip-img.abs-right{
  opacity:.09 !important;filter:grayscale(1)}


/* ============================================
   卡片标题字号 v4（2026-10-05 用户要求：首页/列表卡片标题再小一点）
   18 -> 15（移动端 16 -> 14）。覆盖 v2 / v3 的 18px 规则
   仅改卡片标题，不动详情页 H1
   ============================================ */
.posts-item .item-heading,
.posts-item.card .item-heading { font-size: 15px !important; }

.panda-resource-card .item-heading,
.panda-resource-card .panda-resource-title,
body.panda-resource-cards-v1 .panda-resource-card-v1 .item-heading { font-size: 15px !important; }

@media (max-width: 767px) {
    .posts-item .item-heading,
    .posts-item.card .item-heading { font-size: 14px !important; }
    .panda-resource-card .item-heading,
    .panda-resource-card .panda-resource-title,
    body.panda-resource-cards-v1 .panda-resource-card-v1 .item-heading { font-size: 14px !important; }
}

/* ===== mxy-vip-tone-20261013 START ===== */
/* 2026-10-13：会员套餐卡 /「我的会员」横条配色改为跟「档位语义」(殿堂=3 典藏=4 至尊=5)，不再跟 level 序号。
   背景=3 周年庆把「殿堂」排到第 1 档导致按序号取色错位的修复；取值全部来自原 level-K 的实测生效值，
   与导航悬浮菜单、开通弹窗三处视觉一致。PHP 侧由 zibpay_get_vip_theme() 输出 .vip-themeN 语义类。
   回滚：删除本块 + 还原 vip-theme-extend.css.bak_20261013_bgcolor 与 mxy-vip-level1-white.php.bak_20261013_bgcolor。 */
.mxy-vip-stage .pay-vip-info.vip-theme1{border:0 !important;box-shadow:0 16px 34px -20px rgba(40,30,70,.5) !important;color:var(--v-txt);--v-grad:linear-gradient(135deg,#f0a35c,#e0722a 55%,#c25315);--v-soft:#e0722a;background-image:linear-gradient(135deg,rgba(255,127,175,.57) 10%,#43b2ff 100%) !important;background-color:#fff !important;--v-txt:#866127;--v-cta:linear-gradient(135deg,#ff9633 10%,#f14315 100%);--v-cta-txt:#fff}
.mxy-vip-stage .pay-vip-info.vip-theme2{border:0 !important;box-shadow:0 16px 34px -20px rgba(40,30,70,.5) !important;color:var(--v-txt);--v-grad:linear-gradient(135deg,#a88bf5,#7b5bd6 55%,#5f45bd);--v-soft:#7b5bd6;background-image:linear-gradient(43deg,#ff6ac3 0%,#465dff 46%,#72e699 100%) !important;background-color:#fff !important;--v-txt:#f2f0ff;--v-cta:linear-gradient(270deg,#ada48a,#eae5b7 45%,#f5efd6);--v-cta-txt:#72511d}
.mxy-vip-stage .pay-vip-info.vip-theme3{border:0 !important;box-shadow:0 16px 34px -20px rgba(40,30,70,.5) !important;color:var(--v-txt);--v-grad:linear-gradient(135deg,#6c9fd0,#2f5f92 55%,#1c3a5e);--v-soft:#4d84bd;background-image:linear-gradient(132deg,#5b8db8 0%,#1c3a5e 35%,#2a5580 70%,#1e3d63 100%) !important;background-color:#fff !important;--v-txt:#d8e8f7;--v-cta:linear-gradient(135deg,#4f7fae 0%,#1c3a5e 100%);--v-cta-txt:#fff}
.mxy-vip-stage .pay-vip-info.vip-theme4{border:0 !important;box-shadow:0 16px 34px -20px rgba(40,30,70,.5) !important;color:var(--v-txt);--v-grad:linear-gradient(135deg,#5cb894,#1f6b50 55%,#144434);--v-soft:#1f6b50;background-image:linear-gradient(132deg,#3f8f70 0%,#144434 35%,#1f6350 70%,#164a3b 100%) !important;background-color:#fff !important;--v-txt:#d5efe3;--v-cta:linear-gradient(135deg,#2f8a68 0%,#144434 100%);--v-cta-txt:#fff}
.mxy-vip-stage .pay-vip-info.vip-theme5{border:0 !important;box-shadow:0 20px 46px -22px rgba(179,43,43,.55) !important;color:var(--v-txt);border-color:rgba(233,120,90,.3) !important;--v-grad:linear-gradient(135deg,#f2917a,#c93a30 55%,#a5221d);--v-soft:#c93a30;background-image:linear-gradient(132deg,#f2927a 0%,#b32b2b 30%,#c93a30 80%,#b52c26 100%) !important;background-color:#fff !important;--v-txt:#ffeeee;--v-cta:linear-gradient(135deg,#e0564a 0%,#b32b2b 100%);--v-cta-txt:#fff}
.payvip-modal .pay-vip-info.vip-theme1{background-color:#fff !important;background-image:linear-gradient(135deg, #ff9633 0%, #f14315 100%) !important}
.payvip-modal .pay-vip-info.vip-theme2{background-color:#fff !important;background-image:linear-gradient(135deg, #9b7de4 0%, #4f48b8 100%) !important}
.payvip-modal .pay-vip-info.vip-theme3{background-color:#fff !important;background-image:linear-gradient(135deg, #5b8db8 0%, #1c3a5e 100%) !important}
.payvip-modal .pay-vip-info.vip-theme4{background-color:#fff !important;background-image:linear-gradient(135deg, #3f8f70 0%, #144434 100%) !important}
.payvip-modal .pay-vip-info.vip-theme5{background-color:#fff !important;background-image:linear-gradient(135deg, #f2927a 0%, #b32b2b 100%) !important}
/* 「我的会员」横条：跟随当前等级（原按序号取色） */
.mxy-vip-stage:has(.pay-vip-info.vip-theme1 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(135deg,rgba(255,127,175,.57) 10%,#43b2ff)}
.mxy-vip-stage:has(.pay-vip-info.vip-theme2 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(43deg,#ff6ac3,#465dff 46%,#72e699)}
.mxy-vip-stage:has(.pay-vip-info.vip-theme3 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(132deg,#5b8db8,#1c3a5e 35%,#2a5580 70%,#1e3d63)}
.mxy-vip-stage:has(.pay-vip-info.vip-theme4 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(132deg,#3f8f70,#144434 35%,#1f6350 70%,#164a3b)}
.mxy-vip-stage:has(.pay-vip-info.vip-theme5 .v-btn.is-cur){--mxy-cur-grad:linear-gradient(132deg,#f2927a,#b32b2b 30%,#c93a30 80%,#b52c26)}
/* 「最多人选择」角标：原按序号挂 level-3（当时=殿堂），3 周年庆殿堂挪到第 1 档后错位 */
.mxy-vip-stage .pay-vip-info.vip-theme3 .v-head::after{content:"最多人选择";position:absolute;top:-9px;right:10px;font-size:10px;font-weight:800;letter-spacing:.06em;color:#fff;background:linear-gradient(135deg,#f59e0b,#f0652a);padding:3px 9px;border-radius:999px;box-shadow:0 8px 16px -8px rgba(240,101,42,.95)}
.mxy-vip-stage .pay-vip-info:not(.vip-theme3) .v-head::after{content:none !important;display:none !important}
/* ===== mxy-vip-tone-20261013 END ===== */
