/* ============================================================
 * VIP 会员中心样式 · 独立文件（vips.css）
 * 内容：样式2（尊享特权）页面+弹窗样式 + VIP 定价卡片样式
 * 2026-10-18 从 header.css 抽取，全局加载（弹窗依赖）
 * ============================================================ */

/* ============================================================
 * VIP 会员中心 · 样式2（尊享特权）—— 后台用户设置-基本设置 ji_vip_style
 * ============================================================ */
.jitheme-vip-modal-box.jitheme-vip2-mode {
    padding: 0;
    border-radius: 18px;
    overflow: hidden;
}
.jitheme-vip2-mode .jitheme-vip-close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 60;
    width: 34px;
    height: 34px;
    line-height: 32px;
    text-align: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    color: var(--text-primary);
    font-size: var(--fs-lg);
    cursor: pointer;
    border: 1px solid var(--border-color);
    box-shadow: none;
}
[data-theme="dark"] .jitheme-vip2-mode .jitheme-vip-close,
body.dark .jitheme-vip2-mode .jitheme-vip-close {
    background: rgba(31, 34, 40, 0.9);
    color: #e8eaf0;
    border-color: rgba(255, 255, 255, 0.1);
}
.jitheme-vip2 {
    --jv2-primary: #4F46E5;
    --jv2-primary-hover: #4338CA;
    --jv2-accent: var(--gold);
    --jv2-success: #10B981;
    --jv2-text: #111827;
    --jv2-sub: #6B7280;
    --jv2-border: #E5E7EB;
    --jv2-bg: #F9FAFB;
    --jv2-card: #FFFFFF;
    --jv2-soft: #F3F4F6;
    color: var(--jv2-text);
    line-height: 1.55;
    background: var(--jv2-bg);
}
/* ================= 顶部宣传区 ================= */
.jitheme-vip2-hero {
    background: linear-gradient(135deg, #EEF2FF 0%, #F3E8FF 50%, #FFF1F2 100%);
    border-bottom: 1px solid var(--border-color);
    padding: 3.2rem 1.5rem 3rem;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.jitheme-vip2-hero::before {
    content: '';
    position: absolute;
    top: -80px;
    left: 15%;
    width: 320px;
    height: 320px;
    background: radial-gradient(circle, rgba(79, 70, 229, 0.08) 0%, transparent 70%);
    border-radius: 50%;
}
.jitheme-vip2-hero::after {
    content: '';
    position: absolute;
    bottom: -100px;
    right: 10%;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(245, 158, 11, 0.06) 0%, transparent 70%);
    border-radius: 50%;
}
.jitheme-vip2-hero > * { position: relative; z-index: 1; }
.jitheme-vip2-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(79, 70, 229, 0.08);
    border: 1px solid rgba(79, 70, 229, 0.18);
    padding: 0.4rem 1.2rem;
    border-radius: 40px;
    font-size: var(--fs-sm);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--jv2-primary);
    margin-bottom: 1.2rem;
    text-transform: uppercase;
}
.jitheme-vip2-hero__badge i { color: var(--jv2-accent); font-size: var(--fs-sm); }
.jitheme-vip2-hero__title {
    font-size: 2.1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.25;
    margin-bottom: 0.7rem;
    color: var(--text-primary);
}
.jitheme-vip2-hero__title .jitheme-vip2-hero__accent {
    background: linear-gradient(135deg, var(--jv2-primary), #7C3AED);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.jitheme-vip2-hero__sub {
    font-size: var(--fs-md);
    color: var(--jv2-sub);
    max-width: 620px;
    margin: 0 auto 1.5rem;
}
.jitheme-vip2-hero__tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.6rem 1.6rem;
    font-size: var(--fs-base);
    font-weight: 500;
    color: var(--text-secondary);
}
.jitheme-vip2-hero__tags span { display: flex; align-items: center; gap: 0.4rem; }
.jitheme-vip2-hero__tags i { color: var(--jv2-primary); font-size: var(--fs-sm); }
/* ================= 用户状态栏 ================= */
.jitheme-vip2-status-wrap {
    margin-top: -22px;
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: center;
    padding: 0 1.5rem;
}
.jitheme-vip2-status-card {
    background: var(--jv2-card);
    padding: 13px 28px;
    border-radius: 50px;
    box-shadow: none;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--fs-base);
    font-weight: 500;
    border: 1px solid var(--jv2-border);
    flex-wrap: wrap;
    justify-content: center;
    color: var(--jv2-text);
}
.jitheme-vip2-status-tag {
    background: linear-gradient(135deg, #8B5CF6 0%, #6D28D9 100%);
    color: #fff;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: var(--fs-sm);
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.jitheme-vip2-status-time { color: var(--jv2-primary); font-weight: 700; }
/* ================= 会员人数统计 ================= */
.jitheme-vip2-stats-section { padding: 2.6rem 1.5rem 1.8rem; background: var(--jv2-card); }
.jitheme-vip2-stats-header { text-align: center; margin-bottom: 1.5rem; }
.jitheme-vip2-stats-header h3 { font-size: var(--fs-lg); font-weight: 800; color: var(--jv2-text); letter-spacing: -0.02em; margin-bottom: 0.25rem; }
.jitheme-vip2-stats-header p { font-size: var(--fs-base); color: var(--jv2-sub); }
.jitheme-vip2-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.2rem;
}
.jitheme-vip2-stat-card {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAFAFB 100%);
    border: 1px solid var(--jv2-border);
    border-radius: 1.1rem;
    padding: 1.5rem 1rem 1.3rem;
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    box-shadow: none;
    position: relative;
    overflow: hidden;
}
.jitheme-vip2-stat-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    opacity: 0.85;
}
.jitheme-vip2-stat-card:nth-child(4n+1)::before { background: linear-gradient(90deg, #3B82F6, #60A5FA); }
.jitheme-vip2-stat-card:nth-child(4n+2)::before { background: linear-gradient(90deg, #22C55E, #4ADE80); }
.jitheme-vip2-stat-card:nth-child(4n+3)::before { background: linear-gradient(90deg, #EF4444, #F87171); }
.jitheme-vip2-stat-card:nth-child(4n+4)::before { background: linear-gradient(90deg, #8B5CF6, #A78BFA); }
.jitheme-vip2-stat-card:hover {
    transform: translateY(-4px);
    box-shadow: none;
    border-color: var(--border-light);
}
.jitheme-vip2-stat-name { font-size: var(--fs-md); font-weight: 700; margin-bottom: 0.7rem; letter-spacing: -0.01em; }
.jitheme-vip2-stat-card:nth-child(4n+1) .jitheme-vip2-stat-name { color: var(--primary); }
.jitheme-vip2-stat-card:nth-child(4n+2) .jitheme-vip2-stat-name { color: #16A34A; }
.jitheme-vip2-stat-card:nth-child(4n+3) .jitheme-vip2-stat-name { color: #DC2626; }
.jitheme-vip2-stat-card:nth-child(4n+4) .jitheme-vip2-stat-name { color: #7C3AED; }
.jitheme-vip2-stat-num { font-size: 2rem; font-weight: 800; color: var(--jv2-text); letter-spacing: -0.03em; line-height: 1.1; margin-bottom: 0.15rem; }
.jitheme-vip2-stat-num small { font-size: var(--fs-base); font-weight: 600; color: var(--jv2-sub); margin-left: 0.2rem; }
.jitheme-vip2-stat-label { font-size: var(--fs-sm); color: var(--jv2-sub); font-weight: 500; margin-bottom: 1rem; }
.jitheme-vip2-stat-btn {
    display: inline-block;
    padding: 0.45rem 1.4rem;
    border-radius: 0.6rem;
    border: 1px solid #EF4444;
    background: var(--bg-card);
    color: #EF4444;
    font-weight: 600;
    font-size: var(--fs-sm);
    cursor: pointer;
    transition: 0.2s;
    letter-spacing: 0.2px;
    border: none;
    background: #FEF2F2;
}
.jitheme-vip2-stat-btn:hover { background: #FEE2E2; }
.jitheme-vip2-stat-card:nth-child(4n+1) .jitheme-vip2-stat-btn { border-color: var(--primary); color: var(--primary); background: #EFF6FF; }
.jitheme-vip2-stat-card:nth-child(4n+1) .jitheme-vip2-stat-btn:hover { background: var(--bg-primary-soft); }
.jitheme-vip2-stat-card:nth-child(4n+2) .jitheme-vip2-stat-btn { border-color: #22C55E; color: #16A34A; background: #F0FDF4; }
.jitheme-vip2-stat-card:nth-child(4n+2) .jitheme-vip2-stat-btn:hover { background: #DCFCE7; }
.jitheme-vip2-stat-card:nth-child(4n+3) .jitheme-vip2-stat-btn { border-color: #EF4444; color: #DC2626; background: #FEF2F2; }
.jitheme-vip2-stat-card:nth-child(4n+3) .jitheme-vip2-stat-btn:hover { background: #FEE2E2; }
.jitheme-vip2-stat-card:nth-child(4n+4) .jitheme-vip2-stat-btn { border-color: #8B5CF6; color: #7C3AED; background: #F5F3FF; }
.jitheme-vip2-stat-card:nth-child(4n+4) .jitheme-vip2-stat-btn:hover { background: #EDE9FE; }
/* ================= 会员等级卡片 ================= */
.jitheme-vip2-levels-section { padding: 2rem 1.5rem 2rem; background: var(--jv2-card); border-top: 1px solid var(--jv2-border); }
.jitheme-vip2-levels-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.2rem;
    align-items: stretch;
}
.jitheme-vip2-level-card {
    background: var(--jv2-card);
    border-radius: 1.1rem;
    padding: 0 0 1.3rem;
    display: flex;
    flex-direction: column;
    position: relative;
    box-shadow: none;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    border: 1px solid var(--jv2-border);
    overflow: hidden;
}
.jitheme-vip2-level-card:hover {
    transform: translateY(-5px);
    box-shadow: none;
    border-color: var(--border-light);
}
.jitheme-vip2-level-card.jitheme-vip2-level-recommend {
    border: 1px solid var(--jv2-primary);
    box-shadow: none;
}
.jitheme-vip2-level-card.jitheme-vip2-level-recommend:hover {
    box-shadow: none;
}
.jitheme-vip2-level-card.jitheme-vip2-level-recommend .jitheme-vip2-level-btn {
    background: var(--jv2-primary);
    color: #fff;
    border-color: var(--jv2-primary);
    box-shadow: none;
}
.jitheme-vip2-level-card.jitheme-vip2-level-recommend .jitheme-vip2-level-btn:hover {
    background: var(--jv2-primary-hover);
}
.jitheme-vip2-level-card-top {
    position: relative;
    text-align: center;
    padding: 1.4rem 1rem 0.9rem;
    background: linear-gradient(180deg, #F9FAFB 0%, #FFFFFF 80%);
    margin-bottom: 0.8rem;
}
.jitheme-vip2-level-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 0.7rem;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--fs-lg);
    color: #fff;
    box-shadow: none;
}
.jitheme-vip2-level-card.jitheme-vip2-tier-0 .jitheme-vip2-level-icon { background: linear-gradient(135deg, #3B82F6, #2563EB); }
.jitheme-vip2-level-card.jitheme-vip2-tier-1 .jitheme-vip2-level-icon { background: linear-gradient(135deg, #22C55E, #16A34A); }
.jitheme-vip2-level-card.jitheme-vip2-tier-2 .jitheme-vip2-level-icon { background: linear-gradient(135deg, var(--gold-deep), #B45309); }
.jitheme-vip2-level-card.jitheme-vip2-tier-3 .jitheme-vip2-level-icon { background: linear-gradient(135deg, #8B5CF6, #6D28D9); }
.jitheme-vip2-level-name { font-size: var(--fs-lg); font-weight: 800; color: var(--jv2-text); letter-spacing: -0.01em; margin-bottom: 0.15rem; }
.jitheme-vip2-level-desc { font-size: var(--fs-sm); color: var(--jv2-sub); font-weight: 500; display: flex; align-items: center; justify-content: center; gap: 0.3rem; margin-bottom: 0.5rem; }
.jitheme-vip2-level-desc i { font-size: var(--fs-xs); color: var(--text-muted); }
.jitheme-vip2-price-box { display: flex; align-items: baseline; justify-content: center; gap: 0.2rem; margin: 0.4rem 0 0.15rem; }
.jitheme-vip2-price-num { font-size: 1.7rem; font-weight: 800; color: var(--jv2-primary); letter-spacing: -0.03em; line-height: 1; }
.jitheme-vip2-level-recommend .jitheme-vip2-price-num { color: var(--jv2-accent); }
.jitheme-vip2-price-suffix { font-size: var(--fs-sm); font-weight: 600; color: var(--jv2-sub); margin-left: 0.15rem; }
.jitheme-vip2-level-btn {
    margin: 0.7rem 1.3rem 0.15rem;
    padding: 0.68rem 0;
    border-radius: 0.6rem;
    font-weight: 700;
    font-size: var(--fs-base);
    text-align: center;
    background: var(--bg-card);
    color: var(--jv2-text);
    letter-spacing: 0.3px;
    border: 1px solid var(--jv2-border);
    cursor: pointer;
    transition: 0.2s;
    display: block;
    width: calc(100% - 2.6rem);
    font-family: inherit;
}
.jitheme-vip2-level-btn:hover { background: var(--jv2-soft); border-color: #D1D5DB; }
.jitheme-vip2-level-btn.jitheme-vip2-buy-disabled,
.jitheme-vip2-level-btn[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
    background: var(--jv2-soft);
    color: var(--jv2-sub);
    border-color: var(--jv2-border);
}
.jitheme-vip2-benefits-list {
    list-style: none;
    padding: 0 1.2rem;
    margin: 0.85rem 0 0.4rem;
    flex-grow: 1;
}
.jitheme-vip2-benefits-list li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--fs-sm);
    padding: 0.42rem 0;
    color: #374151;
    font-weight: 500;
    border-bottom: 1px solid var(--border-color);
}
.jitheme-vip2-benefits-list li:last-child { border-bottom: none; }
.jitheme-vip2-benefits-list li.jitheme-vip2-benefit-no { color: var(--text-muted); }
.jitheme-vip2-benefits-list i { font-size: var(--fs-sm); width: 15px; flex-shrink: 0; }
.jitheme-vip2-benefit-ok { color: var(--jv2-success); }
.jitheme-vip2-benefit-no { color: var(--text-muted); }
.jitheme-vip2-pop-tag {
    position: absolute;
    top: 12px;
    right: -30px;
    background: var(--jv2-primary);
    color: #fff;
    font-size: 0.62rem;
    font-weight: 800;
    padding: 0.3rem 2.3rem;
    transform: rotate(45deg);
    letter-spacing: 0.5px;
    box-shadow: none;
    z-index: 5;
    white-space: nowrap;
}
/* ================= 会员特权 ================= */
.jitheme-vip2-perks-section { padding: 2.2rem 1.5rem 2.4rem; background: var(--jv2-bg); border-top: 1px solid var(--jv2-border); }
.jitheme-vip2-perks-title { font-size: var(--fs-lg); font-weight: 800; color: var(--jv2-text); letter-spacing: -0.02em; text-align: center; margin-bottom: 0.3rem; }
.jitheme-vip2-perks-sub { font-size: var(--fs-base); color: var(--jv2-sub); text-align: center; margin-bottom: 1.6rem; }
.jitheme-vip2-perks-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.jitheme-vip2-perk-item {
    background: var(--jv2-card);
    border-radius: 0.9rem;
    padding: 1.5rem 1rem 1.3rem;
    box-shadow: none;
    border: 1px solid var(--jv2-border);
    transition: 0.2s;
    text-align: center;
}
.jitheme-vip2-perk-item:hover {
    transform: translateY(-4px);
    box-shadow: none;
    border-color: var(--border-light);
}
.jitheme-vip2-perk-icon { font-size: 1.7rem; color: var(--jv2-primary); margin-bottom: 0.7rem; }
.jitheme-vip2-perk-item h4 { font-size: var(--fs-md); font-weight: 700; color: var(--jv2-text); margin-bottom: 0.25rem; }
.jitheme-vip2-perk-item p { font-size: var(--fs-sm); color: var(--jv2-sub); }
/* ================= 常见问题 ================= */
.jitheme-vip2-faq-section { padding: 2.2rem 1.5rem 2.4rem; background: var(--jv2-card); border-top: 1px solid var(--jv2-border); }
.jitheme-vip2-faq-header { text-align: center; margin-bottom: 1.6rem; }
.jitheme-vip2-faq-header h3 { font-size: var(--fs-lg); font-weight: 800; color: var(--jv2-text); letter-spacing: -0.02em; margin-bottom: 0.25rem; }
.jitheme-vip2-faq-header p { font-size: var(--fs-base); color: var(--jv2-sub); }
.jitheme-vip2-faq-list { max-width: 860px; margin: 0 auto; background: var(--jv2-card); border-radius: 1rem; padding: 0.4rem 1.5rem; box-shadow: none; border: 1px solid var(--jv2-border); }
.jitheme-vip2-faq-item { border-bottom: 1px solid #F3F4F6; }
.jitheme-vip2-faq-item:last-child { border-bottom: none; }
.jitheme-vip2-faq-question {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1rem 0;
    font-weight: 600;
    color: var(--jv2-text);
    font-size: var(--fs-base);
    cursor: pointer;
    transition: 0.15s;
    list-style: none;
    font-family: inherit;
}
.jitheme-vip2-faq-question::-webkit-details-marker { display: none; }
.jitheme-vip2-faq-question::marker { display: none; }
.jitheme-vip2-faq-question:hover { color: var(--jv2-primary); }
.jitheme-vip2-faq-question i.jitheme-vip2-faq-icon { color: var(--jv2-primary); font-size: var(--fs-md); width: 20px; text-align: center; flex-shrink: 0; }
.jitheme-vip2-faq-question span { flex: 1; }
.jitheme-vip2-faq-question .jitheme-vip2-faq-chevron { color: var(--text-muted); font-size: var(--fs-sm); transition: transform 0.25s ease; }
.jitheme-vip2-faq-item[open] .jitheme-vip2-faq-question .jitheme-vip2-faq-chevron { transform: rotate(180deg); }
.jitheme-vip2-faq-answer {
    padding: 0 0 1rem 2.6rem;
    font-size: var(--fs-base);
    color: var(--jv2-sub);
    line-height: 1.65;
    display: flex;
    gap: 0.6rem;
    animation: jithemeVip2FadeSlide 0.2s ease;
}
@keyframes jithemeVip2FadeSlide {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}
.jitheme-vip2-faq-answer i { color: var(--jv2-success); font-size: var(--fs-sm); margin-top: 0.2rem; flex-shrink: 0; }
/* ================= 数据统计条 ================= */
.jitheme-vip2-statbar {
    background: linear-gradient(135deg, #1F2937, #111827);
    padding: 1.7rem 1.5rem;
}
.jitheme-vip2-statbar-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
    gap: 1.1rem;
    color: #F9FAFB;
}
.jitheme-vip2-statbar-item { text-align: center; }
.jitheme-vip2-statbar-num { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; color: #A5B4FC; line-height: 1.2; }
.jitheme-vip2-statbar-label { font-size: var(--fs-sm); color: var(--text-muted); font-weight: 500; letter-spacing: 0.3px; }
/* ================= 底部版权 ================= */
.jitheme-vip2-footer {
    background: var(--jv2-bg);
    text-align: center;
    font-size: var(--fs-xs);
    color: var(--jv2-sub);
    padding: 1.4rem 1rem;
    border-top: 1px solid var(--jv2-border);
}
.jitheme-vip2-footer i { color: var(--jv2-primary); margin-right: 0.3rem; }
/* ================= 样式2 暗夜适配 ================= */
[data-theme="dark"] .jitheme-vip2,
body.dark .jitheme-vip2 {
    --jv2-text: #e8eaf0;
    --jv2-sub: #a4a8b1;
    --jv2-border: #2f3238;
    --jv2-bg: #1b1d22;
    --jv2-card: #24262c;
    --jv2-soft: #2a2d33;
    background: var(--jv2-bg);
    color: var(--jv2-text);
}
[data-theme="dark"] .jitheme-vip2-hero,
body.dark .jitheme-vip2-hero {
    background: linear-gradient(135deg, #171a2e 0%, #1e1a33 50%, #251a22 100%);
    border-bottom-color: rgba(255, 255, 255, 0.04);
}
[data-theme="dark"] .jitheme-vip2-hero__title,
body.dark .jitheme-vip2-hero__title { color: #e8eaf0; }
[data-theme="dark"] .jitheme-vip2-hero__tags,
body.dark .jitheme-vip2-hero__tags { color: #a4a8b1; }
[data-theme="dark"] .jitheme-vip2-hero__badge,
body.dark .jitheme-vip2-hero__badge {
    background: rgba(99, 102, 241, 0.16);
    border-color: rgba(99, 102, 241, 0.3);
    color: #a5b4fc;
}
[data-theme="dark"] .jitheme-vip2-stat-card,
body.dark .jitheme-vip2-stat-card {
    background: linear-gradient(180deg, #262931 0%, #23252b 100%);
    border-color: var(--jv2-border);
}
[data-theme="dark"] .jitheme-vip2-stat-num,
body.dark .jitheme-vip2-stat-num { color: #e8eaf0; }
[data-theme="dark"] .jitheme-vip2-level-card-top,
body.dark .jitheme-vip2-level-card-top { background: linear-gradient(180deg, #2a2d33 0%, #24262c 80%); }
[data-theme="dark"] .jitheme-vip2-benefits-list li,
body.dark .jitheme-vip2-benefits-list li { color: #a4a8b1; border-bottom-color: #2c3038; }
[data-theme="dark"] .jitheme-vip2-faq-item,
body.dark .jitheme-vip2-faq-item { border-bottom-color: #2c3038; }
[data-theme="dark"] .jitheme-vip2-stat-btn,
body.dark .jitheme-vip2-stat-btn { background: #2a2d33; color: #a4a8b1; }
[data-theme="dark"] .jitheme-vip2-level-btn,
body.dark .jitheme-vip2-level-btn { color: #e8eaf0; }
/* ================= 样式2 响应式 ================= */
@media (max-width: 1024px) {
    .jitheme-vip2-levels-grid { grid-template-columns: repeat(2, 1fr); }
    .jitheme-vip2-perks-grid { grid-template-columns: repeat(2, 1fr); }
    .jitheme-vip2-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .jitheme-vip2-hero__title { font-size: 1.8rem; }
}
@media (max-width: 640px) {
    .jitheme-vip2-levels-grid { grid-template-columns: 1fr; }
    .jitheme-vip2-perks-grid { grid-template-columns: 1fr 1fr; }
    .jitheme-vip2-stats-grid { grid-template-columns: 1fr 1fr; }
    .jitheme-vip2-hero { padding: 2rem 1rem 1.8rem; }
    .jitheme-vip2-hero__title { font-size: var(--fs-lg); }
    .jitheme-vip2-hero__tags { font-size: var(--fs-sm); gap: 0.5rem 0.9rem; }
    .jitheme-vip2-statbar-grid { flex-direction: column; gap: 0.7rem; }
    .jitheme-vip2-statbar-num { font-size: var(--fs-lg); }
    .jitheme-vip2-faq-list { padding: 0.4rem 1rem; }
    .jitheme-vip2-faq-question { font-size: var(--fs-base); }
    .jitheme-vip2-faq-answer { padding-left: 2.2rem; font-size: var(--fs-sm); }
    .jitheme-vip2-status-card { flex-direction: column; text-align: center; gap: 7px; padding: 14px; border-radius: 16px; }
    .jitheme-vip2-stat-num { font-size: 1.8rem; }
}
@media (max-width: 420px) {
    .jitheme-vip2-stats-grid { grid-template-columns: 1fr; }
}
/* ================= /vips 页面（样式2 服务端渲染） ================= */
/* 宽度统一交给主题 .wrapper，不指定任何宽度 */
.jitheme-vip2-page .jitheme-vip2-status-wrap {
    padding: 0 1.5rem;
}
@media (max-width: 640px) {
    .jitheme-vip2-page .jitheme-vip2-status-wrap { padding: 0 1rem; }
}


/* ============================================================
 * VIP 定价卡片样式（2026-10-18 按用户提供代码适配）
 * 原内联于 ji_functions.php，现独立于此文件
 * ============================================================ */
.ji-vip-pricing-container{display:flex;gap:20px;max-width:1200px;width:100%;align-items:flex-start;flex-wrap:wrap;justify-content:center;margin:0 auto}
.ji-vip-pricing-col{background:#fff;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.05);flex:1;min-width:260px;max-width:300px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:transform .2s}
.ji-vip-pricing-col:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgba(0,0,0,.1)}
.ji-vip-ribbon{position:absolute;top:0;right:0;width:80px;height:80px;overflow:hidden;z-index:10}
.ji-vip-ribbon-text{position:absolute;top:15px;right:-30px;width:120px;background-color:#e53935;color:#fff;text-align:center;font-size:12px;font-weight:700;transform:rotate(45deg);padding:5px 0;box-shadow:0 2px 4px rgba(0,0,0,.1)}
.ji-vip-card-header{padding:30px 20px 20px;text-align:center;border-bottom:1px solid #f0f0f0}
.ji-vip-plan-name{font-size:20px;font-weight:700;margin-bottom:8px}
.ji-vip-tag{display:inline-block;background-color:#fff3e0;color:#ff9800;font-size:12px;padding:4px 10px;border-radius:12px;margin-bottom:20px;font-weight:500}
.ji-vip-price-box{margin-bottom:20px;display:flex;align-items:baseline;justify-content:center;color:#ff5722}
.ji-vip-price-currency{font-size:20px;font-weight:700}
.ji-vip-price-amount{font-size:42px;font-weight:700;line-height:1}
.ji-vip-price-duration{font-size:14px;color:#666;margin-left:5px}
.ji-vip-btn-join{width:100%;padding:12px 0;border:none;border-radius:4px;background:linear-gradient(to right,#ffccbc,#ffab91);color:#5d4037;font-size:16px;font-weight:700;cursor:pointer;transition:opacity .2s}
.ji-vip-btn-join:hover{opacity:.9}
.ji-vip-btn-join.disabled{opacity:.5;cursor:not-allowed}
.ji-vip-features-list{width:100%}
.ji-vip-feature-item{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid #f5f5f5;font-size:13px;color:#333}
.ji-vip-feature-item:nth-child(even){background-color:#fafafa}
.ji-vip-feature-item:last-child{border-bottom:none}
.ji-vip-feature-name{flex:1}
.ji-vip-icon-ok{color:#00c853;font-weight:700;font-size:16px}
.ji-vip-icon-no{color:#cfd8dc;font-weight:700;font-size:16px}
.ji-vip-feature-no{color:#bbb}
@media (max-width:768px){.ji-vip-pricing-container{flex-direction:column;align-items:center}.ji-vip-pricing-col{width:100%;max-width:100%}}