/* ============================================================
   前台样式：纯白底 + 蓝紫主色 + 大气留白排版
   风格：白底 #FFFFFF / 主色 #4D6BFE / 大字标题 / 宽松留白
   PC 宽屏：≥1024px 加宽容器、会员横铺、项目双列
   动效：入场渐显 + 悬停微交互（克制轻盈）
   ============================================================ */
:root{
    --brand:#4D6BFE;
    --brand-2:#6366F1;
    --brand-light:#EEF1FF;
    --brand-border:#DCE2FF;
    --text:#1A1D29;
    --text-sub:#5B6172;
    --text-mute:#9CA3AF;
    --bg:#FFFFFF;
    --bg-soft:#F7F8FA;
    --line:#E8EAF0;
    --radius:16px;
    --shadow:0 1px 2px rgba(26,29,41,.03), 0 10px 30px rgba(77,107,254,.07);
}
*{box-sizing:border-box;margin:0;padding:0;}
svg{max-width:100%;max-height:100%;}
html{scroll-behavior:smooth;}
html,body{height:100%;}
body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
    background:var(--bg);
    color:var(--text);
    font-size:15px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    -webkit-text-size-adjust:100%;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}

/* 整体容器：居中，桌面稍宽更显大气 */
.app{
    max-width:760px;
    margin:0 auto;
    background:var(--bg);
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

/* ===== 顶部栏：返回键在左上角 ===== */
.topbar{
    position:sticky;top:0;z-index:20;
    display:flex;align-items:center;
    height:56px;
    padding:0 14px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line);
}
.back-btn{
    width:38px;height:38px;
    display:flex;align-items:center;justify-content:center;
    border-radius:50%;
    color:var(--text-sub);
    margin-left:-4px;
    flex:0 0 auto;
}
.back-btn:active{background:var(--brand-light);color:var(--brand);}
.back-btn svg{width:22px;height:22px;}
.brand{
    flex:1;min-width:0;
    display:flex;align-items:center;gap:9px;
    padding-left:6px;
}
.brand-logo{height:30px;width:auto;border-radius:6px;}
.brand-name{
    font-size:17px;font-weight:700;color:var(--text);
    letter-spacing:.5px;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.topbar-user{
    flex:0 0 auto;
    display:flex;align-items:center;gap:5px;
    font-size:13px;color:var(--brand);font-weight:600;
    padding:7px 12px;border-radius:16px;
    background:var(--brand-light);border:1px solid var(--brand-border);
}
.topbar-user:active{opacity:.85;}
.topbar-user svg{width:15px;height:15px;}

/* ===== 登录/注册卡片 ===== */
.auth-wrap{padding:40px 20px 60px;flex:1;}
.auth-card{
    background:#fff;border:1px solid var(--line);border-radius:18px;
    padding:30px 24px;box-shadow:var(--shadow);
    max-width:420px;margin:0 auto;
}
.auth-title{font-size:20px;font-weight:700;color:var(--text);text-align:center;}
.auth-sub{font-size:13px;color:var(--text-mute);text-align:center;margin:8px 0 24px;}
.auth-field{margin-bottom:16px;}
.auth-field label{display:block;font-size:13px;font-weight:600;color:var(--text-sub);margin-bottom:7px;}
.auth-input{
    width:100%;box-sizing:border-box;
    border:1px solid var(--line);border-radius:10px;
    padding:12px 14px;font-size:15px;color:var(--text);
    background:#FBFCFE;outline:none;
}
.auth-input:focus{border-color:var(--brand);background:#fff;}
.auth-err{
    display:none;background:#FFF3F0;color:#D14326;
    border:1px solid #FFD1C7;border-radius:10px;
    font-size:13px;padding:10px 14px;margin-bottom:16px;
}
.auth-err.show{display:block;}
.auth-btn{
    display:block;width:100%;box-sizing:border-box;text-align:center;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;border:none;border-radius:12px;
    padding:13px 0;font-size:16px;font-weight:600;letter-spacing:1px;
    cursor:pointer;box-shadow:0 6px 18px rgba(77,107,254,.28);
}
.auth-btn:active{opacity:.9;}
.auth-links{display:flex;justify-content:space-between;margin-top:16px;font-size:13px;}
.auth-links a{color:var(--brand);}
.auth-agree{display:flex;align-items:flex-start;gap:7px;font-size:12px;color:var(--text-mute);margin:4px 0 18px;line-height:1.6;}
.auth-agree input{margin-top:2px;flex:0 0 auto;}
.auth-agree a{color:var(--brand);}

/* ===== 会员中心 ===== */
.mc-card{
    background:#fff;border:1px solid var(--line);border-radius:16px;
    padding:20px;margin:16px;box-shadow:var(--shadow);
}
.mc-profile{display:flex;align-items:center;gap:14px;}
.mc-avatar{
    width:56px;height:56px;border-radius:50%;flex:0 0 auto;
    background:linear-gradient(135deg,var(--brand-light),#F5F6FF);
    border:1px solid var(--brand-border);
    display:flex;align-items:center;justify-content:center;
}
.mc-avatar svg{width:26px;height:26px;color:var(--brand);}
.mc-name{font-size:17px;font-weight:700;color:var(--text);}
.mc-meta{font-size:12px;color:var(--text-mute);margin-top:5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.mc-expire{font-size:12px;margin-top:10px;padding-top:12px;border-top:1px dashed var(--line);color:var(--text-sub);}
.mc-expire b{color:var(--text);}
.mc-expire .expired{color:#D14326;}
.mc-redeem{display:flex;gap:10px;margin-top:4px;}
.mc-redeem .auth-input{flex:1;}
.mc-redeem-btn{
    flex:0 0 auto;border:none;border-radius:10px;padding:0 20px;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;font-size:14px;font-weight:600;cursor:pointer;
}
.mc-msg{font-size:13px;border-radius:10px;padding:10px 14px;margin-bottom:12px;}
.mc-msg.ok{background:#E6F9F1;color:#059669;border:1px solid #BFF0DC;}
.mc-msg.err{background:#FFF3F0;color:#D14326;border:1px solid #FFD1C7;}
.mc-links{display:flex;flex-direction:column;}
.mc-link{
    display:flex;align-items:center;gap:10px;
    padding:14px 2px;font-size:14px;color:var(--text);
    border-bottom:1px solid var(--bg-soft);
}
.mc-link:last-child{border-bottom:none;}
.mc-link svg{width:18px;height:18px;color:var(--brand);flex:0 0 auto;}
.mc-link .arrow{margin-left:auto;color:#C6CAD6;}
.mc-section-title{font-size:15px;font-weight:700;color:var(--text);margin:22px 16px 4px;}
.mc-tip{font-size:12px;color:var(--text-mute);margin:0 16px 8px;}

/* ===== 详情页：会员专属内容 ===== */
.vip-box{
    border:1px solid var(--brand-border);
    background:linear-gradient(180deg,#FBFCFF,#F7F9FF);
    border-radius:14px;padding:16px 18px;margin-bottom:22px;
}
.vip-head{
    display:flex;align-items:center;gap:8px;
    font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px;
}
.vip-head svg{width:16px;height:16px;color:var(--brand);flex:0 0 auto;}
.vip-head .vip-badge{
    margin-left:auto;font-size:11px;font-weight:600;color:#059669;
    background:#E6F9F1;border:1px solid #BFF0DC;border-radius:10px;padding:2px 10px;
}
.vip-row{display:flex;align-items:center;gap:10px;padding:12px 0;font-size:14px;}
.vip-row + .vip-row{border-top:1px dashed var(--line);}
.vip-row .vip-label{font-weight:600;flex:0 0 auto;color:var(--text);}
.vip-row .vip-val{flex:1;min-width:0;color:var(--text-sub);word-break:break-all;font-size:13px;}
.vip-copy{
    flex:0 0 auto;font-size:12px;color:var(--brand);font-weight:600;
    border:1px solid var(--brand-border);background:#fff;
    border-radius:14px;padding:5px 12px;cursor:pointer;
}
.vip-open{
    display:inline-flex;align-items:center;gap:6px;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;font-size:13px;font-weight:600;
    border-radius:16px;padding:7px 16px;
}
.vip-open svg{width:14px;height:14px;}
/* 联系客服独立卡片（放在会员锁定框上方） */
.vip-contact-card{
    background:#fff;border:1px solid var(--line);
    border-radius:var(--radius);
    padding:20px 22px;margin-bottom:16px;
    box-shadow:0 4px 16px rgba(0,0,0,.04);
    position:relative;overflow:hidden;
}
.vip-contact-card::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,var(--brand),var(--brand-2));
}
.vcc-head{
    display:flex;align-items:center;gap:8px;
    font-size:15px;font-weight:700;color:var(--text);
    margin-bottom:6px;
}
.vcc-head svg{width:16px;height:16px;color:var(--brand);}
.vcc-name{
    font-size:13px;color:var(--text-sub);margin-bottom:16px;
}
.vcc-name span{color:var(--text-mute);font-weight:400;}
.vcc-qrcode{
    width:168px;height:168px;margin:0 auto 8px;
    border:1px solid var(--line);border-radius:12px;
    padding:8px;background:#fff;
}
.vcc-qrcode img{width:100%;height:100%;display:block;object-fit:contain;border-radius:6px;}
.vcc-qr-hint{
    text-align:center;font-size:12px;color:var(--text-mute);margin-bottom:14px;
}
.vcc-row{
    display:flex;align-items:center;gap:10px;
    padding:10px 14px;background:var(--brand-light);
    border:1px solid var(--brand-border);border-radius:10px;
    margin-bottom:8px;font-size:13px;
}
.vcc-label{flex:0 0 auto;color:var(--text-mute);font-weight:600;width:34px;}
.vcc-val{flex:1;min-width:0;color:var(--text);word-break:break-all;text-decoration:none;}
.vcc-copy{
    flex:0 0 auto;font-size:12px;color:var(--brand);font-weight:600;
    border:1px solid var(--brand-border);background:#fff;
    border-radius:12px;padding:4px 12px;cursor:pointer;
}
/* 未开通：锁定状态（高级卡片） */
.vip-box.locked{
    border:none;background:#fff;position:relative;overflow:hidden;
    padding:0;box-shadow:0 6px 30px rgba(77,107,254,.10);
}
.vip-box.locked::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,var(--brand),var(--brand-2));
}
.vip-lock{
    text-align:center;padding:38px 20px 32px;position:relative;
    background:
        radial-gradient(130px 130px at 8% 0%,rgba(77,107,254,.07),transparent 70%),
        radial-gradient(150px 150px at 96% 100%,rgba(99,102,241,.07),transparent 70%);
}
.vip-lock-icon{
    width:66px;height:66px;margin:0 auto 16px;border-radius:50%;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    box-shadow:0 10px 24px rgba(77,107,254,.32);
    display:flex;align-items:center;justify-content:center;
    position:relative;
}
.vip-lock-icon::after{
    content:'';position:absolute;inset:-8px;border-radius:50%;
    border:1px dashed var(--brand-border);
}
.vip-lock-icon svg{width:28px;height:28px;color:#fff;}
.vip-lock-badge{
    display:inline-flex;align-items:center;gap:5px;
    font-size:11px;font-weight:700;letter-spacing:1px;
    color:#A16207;background:linear-gradient(135deg,#FEF9E7,#FDF0C4);
    border:1px solid #F3E3A6;padding:3px 12px;border-radius:20px;
    margin-bottom:12px;
}
.vip-lock-badge svg{width:12px;height:12px;color:#D4A017;}
.vip-lock-title{font-size:17px;font-weight:700;color:var(--text);}
.vip-lock-desc{font-size:13px;color:var(--text-mute);margin:10px 0 22px;line-height:1.8;}
.vip-lock-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.vip-join-link{
    display:block;margin-top:14px;
    font-size:12.5px;color:var(--text-mute);
    text-decoration:none;text-align:center;
}
.vip-join-link b{color:var(--brand);font-weight:600;}
.vip-join-link:active b{opacity:.8;}
.vip-btn{
    display:inline-block;padding:12px 30px;border-radius:24px;
    font-size:14px;font-weight:600;transition:all .2s ease;
    text-decoration:none;
}
/* vip 区所有链接统一去下划线：优先级高于 .detail-content a，避免正文未闭合标签把 vip-box 吞进 detail-content 后出现下划线 */
.vip-box a, .vip-box .vip-btn, .vip-box .vip-join-link, .vip-box .vip-open,
.vip-contact-card .vcc-val{
    text-decoration:none;
}
.vip-btn.primary{
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;box-shadow:0 8px 20px rgba(77,107,254,.30);
}
.vip-btn.primary:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(77,107,254,.36);}
.vip-btn.ghost{border:1px solid var(--brand-border);color:var(--brand);background:#fff;}
.vip-btn.ghost:hover{background:var(--brand-light);}

/* ===== Hero 大标题区（大气感核心） ===== */
.hero{
    text-align:center;
    padding:52px 24px 40px;
    background:
        radial-gradient(55% 90% at 50% 0%, rgba(77,107,254,.10), transparent 72%),
        radial-gradient(35% 55% at 88% 14%, rgba(99,102,241,.07), transparent 70%);
}
.hero-badge{
    display:inline-block;
    font-size:12px;font-weight:600;letter-spacing:2px;
    color:var(--brand);
    background:var(--brand-light);
    border:1px solid var(--brand-border);
    padding:5px 16px;border-radius:20px;
    margin-bottom:18px;
}
.hero-title{
    font-size:34px;font-weight:800;
    letter-spacing:1px;line-height:1.3;
    background:linear-gradient(120deg,#1A1D29 20%,#4D6BFE 85%);
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:var(--text);
    margin-bottom:12px;
}
.hero-sub{
    font-size:15px;color:var(--text-sub);
    letter-spacing:3px;
}
.hero-line{
    width:56px;height:3px;border-radius:2px;
    background:linear-gradient(90deg,var(--brand),var(--brand-2));
    margin:22px auto 0;
}

/* ===== 滚动通知条 ===== */
.notice-sec{padding:0 20px;margin-top:-6px;}
/* 长期收购横幅：常驻不轮播，点击弹出联系客服 */
.buy-sec{padding:0 20px;margin-top:14px;}
.buy-banner{
    display:flex;align-items:center;gap:13px;
    background:linear-gradient(135deg,#F6F8FF 0%,#FDFDFF 100%);
    border:1px solid #DDE3FF;border-radius:14px;
    padding:12px 18px;cursor:pointer;
    transition:box-shadow .2s,transform .2s;
}
.buy-banner:hover{box-shadow:0 6px 18px rgba(77,107,254,.14);transform:translateY(-1px);}
.buy-banner:focus-visible{outline:2px solid var(--brand);outline-offset:2px;}
.buy-ico{
    flex:0 0 38px;width:38px;height:38px;border-radius:11px;
    display:flex;align-items:center;justify-content:center;
    background:var(--brand-light);color:var(--brand);
}
.buy-txt{min-width:0;}
.buy-txt strong{display:block;font-size:14.5px;font-weight:700;color:var(--text);line-height:1.45;}
.buy-txt span{display:block;font-size:12.5px;color:var(--text-mute);margin-top:2px;}
.buy-btn{
    flex:0 0 auto;margin-left:auto;
    background:var(--brand-light);color:var(--brand);
    border-radius:999px;padding:8px 17px;
    font-size:13px;font-weight:600;white-space:nowrap;
}
@media (max-width:720px){
    .buy-banner{padding:11px 14px;gap:11px;}
    .buy-ico{flex-basis:34px;width:34px;height:34px;border-radius:10px;}
    .buy-txt strong{font-size:13.5px;}
    .buy-txt span{font-size:11.5px;}
    .buy-btn{padding:7px 13px;font-size:12.5px;}
}
.notice-bar{
    display:flex;align-items:center;gap:10px;
    position:relative;overflow:hidden;
    background:linear-gradient(135deg,var(--brand) 0%,var(--brand-2) 100%);
    border-radius:var(--radius);
    padding:10px 12px;
    box-shadow:0 6px 18px rgba(77,107,254,.18);
}
.notice-bar::before{
    content:"";position:absolute;right:-24px;top:-24px;
    width:100px;height:100px;border-radius:50%;
    background:rgba(255,255,255,.10);
    pointer-events:none;
}
.notice-icon{
    width:28px;height:28px;flex:0 0 auto;border-radius:8px;
    background:rgba(255,255,255,.20);
    display:flex;align-items:center;justify-content:center;
    position:relative;z-index:1;
}
.notice-icon svg{width:15px;height:15px;color:#fff;}
.notice-track{
    flex:1;min-width:0;position:relative;z-index:1;
    height:20px;overflow:hidden;
}
/* 幻灯片式：一次一条，上滑淡出、下方滑入 */
.notice-slide{
    position:absolute;left:0;right:0;top:0;bottom:0;
    display:flex;align-items:center;
    opacity:0;transform:translateY(100%);
    transition:opacity .45s ease,transform .5s cubic-bezier(.22,.61,.36,1);
    pointer-events:none;
}
.notice-slide.active{opacity:1;transform:none;pointer-events:auto;}
.notice-slide.leaving{opacity:0;transform:translateY(-100%);}
.notice-item{
    font-size:13px;font-weight:600;color:#fff;
    letter-spacing:.3px;line-height:20px;
    text-decoration:none;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    max-width:100%;
}
.notice-item .hl{color:#FFE082;}
.notice-close{
    flex:0 0 auto;width:22px;height:22px;border-radius:50%;
    background:rgba(255,255,255,.18);
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;position:relative;z-index:1;
    transition:background .2s ease;
}
.notice-close:hover{background:rgba(255,255,255,.32);}
.notice-close svg{width:11px;height:11px;color:#fff;}

/* ===== 区块通用 ===== */
.section{padding:34px 20px 4px;scroll-margin-top:110px;}
.section-head{margin-bottom:18px;}
.section-title{
    font-size:22px;font-weight:700;color:var(--text);
    letter-spacing:.5px;
    display:flex;align-items:baseline;gap:10px;
    margin-bottom:18px;
}
.section-title .en{
    font-size:11px;color:var(--text-mute);font-weight:600;
    letter-spacing:2.5px;text-transform:uppercase;
}

/* 分类折叠 */
.fold-toggle{
    cursor:pointer;user-select:none;
    display:flex;align-items:center;gap:10px;
}
.fold-icon{
    width:18px;height:18px;color:var(--text-mute);
    flex:0 0 auto;margin-left:auto;
    transition:transform .2s;
}
.fold-toggle.collapsed .fold-icon{transform:rotate(-90deg);}
.fold-body{overflow:hidden;}

/* ===== 会员档位卡片（档位色明显区分） ===== */
.level-card{
    --lv1:#4D6BFE;--lv2:#6366F1;--lvtext:#fff;
    position:relative;overflow:hidden;
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:22px 20px;
    margin-bottom:14px;
    box-shadow:var(--shadow);
}
/* 顶部档位色带：颜色跟随后台档位设置 */
.level-card::before{
    content:"";position:absolute;top:0;left:0;right:0;height:4px;
    background:linear-gradient(90deg,var(--lv1),var(--lv2));
}
.level-card.lv-yellow{--lv1:#FFB800;--lv2:#FFD43B;--lvtext:#613400;}
.level-card.lv-blackgold{--lv1:#23273A;--lv2:#14161F;--lvtext:#FFD43B;}
.level-card.lv-purple{--lv1:#8B5CF6;--lv2:#6D3EE8;--lvtext:#fff;}
.level-card.lv-green{--lv1:#10B981;--lv2:#059669;--lvtext:#fff;}
.level-card.lv-orange{--lv1:#FF9F1C;--lv2:#F97316;--lvtext:#fff;}
.level-card.lv-red{--lv1:#F04438;--lv2:#DC2626;--lvtext:#fff;}
.level-head{
    display:flex;justify-content:space-between;align-items:center;
    margin-bottom:12px;gap:10px;
    padding-bottom:14px;
    border-bottom:1px dashed var(--line);
}
.level-name{
    font-size:19px;font-weight:700;color:var(--text);
    display:inline-flex;align-items:center;gap:8px;
}
.level-crown{width:19px;height:19px;color:var(--lv1);flex:0 0 auto;}
/* 档位圆点：颜色跟随档位设置 */
.lv-dot{
    display:inline-block;
    width:8px;height:8px;border-radius:50%;
    margin-right:10px;vertical-align:2px;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
}
.level-price{
    font-size:15px;font-weight:700;
    color:var(--lvtext);
    background:linear-gradient(135deg,var(--lv1),var(--lv2));
    padding:5px 16px;border-radius:18px;
    white-space:nowrap;
}
.level-benefits{
    list-style:none;
    font-size:14px;color:var(--text-sub);
}
.level-benefits li{
    display:flex;align-items:flex-start;gap:10px;
    padding:9px 0;
    border-bottom:1px dashed var(--line);
    line-height:1.55;
}
.level-benefits li:last-child{border-bottom:none;padding-bottom:0;}
.level-benefits li:first-child{padding-top:0;}
.level-benefits li svg{
    width:16px;height:16px;flex:0 0 auto;
    color:var(--brand);margin-top:2px;
}
.level-benefits li span{flex:1;word-break:break-all;}
/* 立即加入按钮：跟随档位色 */
.level-join-btn{
    display:flex;align-items:center;justify-content:center;gap:8px;
    width:100%;margin-top:16px;
    padding:12px 0;border:none;border-radius:24px;
    font-size:15px;font-weight:700;font-family:inherit;
    color:var(--lvtext);
    background:linear-gradient(135deg,var(--lv1),var(--lv2));
    box-shadow:0 8px 18px rgba(26,29,41,.14);
    cursor:pointer;transition:all .2s ease;
}
.level-join-btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(26,29,41,.20);}
.level-join-btn:active{transform:translateY(0);}
/* 加入须知弹窗：白色居中卡片 */
.join-modal{
    position:fixed;inset:0;z-index:70;
    display:none;
}
.join-modal.open{display:block;}
.join-modal-mask{
    position:absolute;inset:0;
    background:rgba(17,24,39,.45);
}
.join-modal-card{
    position:absolute;left:50%;top:50%;
    transform:translate(-50%,-50%);
    width:min(560px,92vw);max-height:82vh;
    display:flex;flex-direction:column;
    background:#fff;
    border-radius:16px;
    box-shadow:0 24px 60px rgba(17,24,39,.25);
    overflow:hidden;
}
.join-modal-head{
    display:flex;align-items:center;justify-content:space-between;
    font-size:16px;font-weight:700;color:var(--text);
    padding:16px 20px 14px;
    border-bottom:1px solid var(--line);
    flex:0 0 auto;
}
.join-modal-close{
    display:inline-flex;color:var(--text-mute);cursor:pointer;
}
.join-modal-body{
    padding:16px 20px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    font-size:14px;color:var(--text-sub);line-height:1.7;
}
.join-target{
    font-size:14px;color:var(--text);
    background:var(--brand-light);
    border:1px solid var(--brand-border);
    border-radius:12px;
    padding:10px 14px;margin-bottom:14px;
}
.join-target b{color:var(--brand);}
.join-target-price{margin-left:8px;font-weight:700;color:var(--brand);}
.join-modal-body h3{
    font-size:14px;font-weight:700;color:var(--text);
    margin:16px 0 8px;
    display:flex;align-items:center;gap:8px;
}
.join-modal-body h3::before{
    content:"";width:4px;height:14px;border-radius:2px;
    background:linear-gradient(180deg,var(--brand),var(--brand-2));
    flex:0 0 auto;
}
.join-modal-body ul{list-style:none;}
.join-modal-body li{
    position:relative;
    padding:4px 0 4px 16px;
    word-break:break-all;
}
.join-modal-body li::before{
    content:"";position:absolute;left:2px;top:14px;
    width:5px;height:5px;border-radius:50%;
    background:var(--brand);
}
.join-modal-body li b{color:var(--text);}
.join-modal-foot{
    display:flex;gap:10px;
    padding:14px 20px 18px;
    border-top:1px solid var(--line);
    flex:0 0 auto;
}
.join-btn{
    display:inline-flex;align-items:center;justify-content:center;
    padding:11px 18px;border-radius:22px;
    font-size:14px;font-weight:600;font-family:inherit;
    border:none;cursor:pointer;text-decoration:none;
    transition:all .2s ease;white-space:nowrap;
}
.join-btn.ghost{
    border:1px solid var(--brand-border);color:var(--brand);background:#fff;
}
.join-btn.ghost:hover{background:var(--brand-light);}
.join-btn.primary{
    flex:1;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;box-shadow:0 8px 20px rgba(77,107,254,.30);
}
.join-btn.primary:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(77,107,254,.36);}

/* ===== 分类导航：横向滚动标签 ===== */
.cats-wrap{
    position:sticky;top:56px;z-index:15;
    background:rgba(255,255,255,.95);
    border-bottom:1px solid var(--line);
}
.cats{
    display:flex;align-items:center;
    padding:12px 20px;
}
.cats-tags{
    display:flex;gap:8px;
    flex:1;min-width:0;
    overflow:hidden;
}
.cats-wrap.ofl .cats-tags{
    -webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);
    mask-image:linear-gradient(90deg,#000 82%,transparent);
}
.cats-more{
    display:none;
    flex:0 0 auto;
    margin-left:8px;
    padding:6px 14px;
    border-radius:16px;
    font-size:13px;color:var(--text-sub);
    background:var(--bg-soft);
    border:1px solid var(--line);
    cursor:pointer;
    font-family:inherit;
}
.cats-wrap.ofl .cats-more{display:inline-flex;}
/* 全部分类悬浮卡片 */
.cats-modal{
    position:fixed;inset:0;z-index:60;
    display:none;
}
.cats-modal.open{display:block;}
.cats-modal-mask{
    position:absolute;inset:0;
    background:rgba(17,24,39,.45);
}
.cats-modal-card{
    position:absolute;left:50%;top:50%;
    transform:translate(-50%,-50%);
    width:min(560px,86vw);max-height:70vh;overflow:auto;
    background:#fff;
    border-radius:16px;
    padding:20px 22px 24px;
    box-shadow:0 24px 60px rgba(17,24,39,.25);
}
.cats-modal-head{
    display:flex;align-items:center;justify-content:space-between;
    font-size:16px;font-weight:700;color:var(--text);
    margin-bottom:16px;
}
.cats-modal-close{
    display:inline-flex;color:var(--text-mute);cursor:pointer;
}
.cats-modal-close svg{width:20px;height:20px;}
.cats-modal-tags{display:flex;flex-wrap:wrap;gap:10px;}
.cat-tag{
    flex:0 0 auto;
    padding:7px 18px;
    border-radius:20px;
    font-size:14px;
    color:var(--text-sub);
    background:var(--bg-soft);
    border:1px solid var(--line);
    white-space:nowrap;
}
.cat-tag:active{background:var(--brand-light);color:var(--brand);}
.cat-tag.active{
    background:var(--brand);color:#fff;border-color:var(--brand);
    font-weight:600;
}

/* ===== 为什么选择会员模式（三种模式横向对比表） ===== */
.why-sec{padding-top:30px;}
.why-table-wrap{
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow);
    background:#fff;
}
.why-table{
    width:100%;
    border-collapse:collapse;
    font-size:13px;
    line-height:1.6;
}
.why-table th,.why-table td{
    padding:15px 16px;
    text-align:left;
    vertical-align:top;
}
.why-table thead th{
    font-size:13.5px;
    font-weight:700;
    white-space:nowrap;
}
.why-table tbody td{
    border-top:2px solid #fff;
    line-height:1.65;
}
/* 维度列：中性白底 */
.why-table th.dim,.why-table td.dim{
    width:116px;
    font-weight:700;
    font-size:13px;
    color:var(--text);
    background:#FBFCFD;
    white-space:nowrap;
}
.why-table thead th.dim{background:#F2F4F7;}
/* 三种模式：三条纵向色带（低饱和） */
.why-table thead th.old{background:#ECEEF2;color:#5B6172;}
.why-table tbody td:nth-child(2){background:#F4F5F8;color:#6B7080;}
.why-table thead th.free{background:#F4E7CE;color:#8A5E1B;}
.why-table tbody td:nth-child(3){background:#FCF6EA;color:#79613C;}
.why-table thead th.vip{background:#E2E8FF;color:var(--brand);}
.why-table tbody td:nth-child(4){background:#ECF0FF;color:var(--text);font-weight:600;}
/* 列间白缝，色带边界更清楚 */
.why-table th:nth-child(3),.why-table th:nth-child(4),
.why-table td:nth-child(3),.why-table td:nth-child(4){border-left:2px solid #fff;}
.why-th-ico{
    display:inline-flex;align-items:center;justify-content:center;
    width:24px;height:24px;border-radius:7px;
    vertical-align:-6px;margin-right:5px;
}
th.old .why-th-ico{background:#fff;color:#8A90A0;}
th.free .why-th-ico{background:#fff;color:#9A6B1F;}
th.vip .why-th-ico{background:var(--brand);color:#fff;}
/* 走心结束语 */
.why-heart{
    margin-top:14px;
    background:linear-gradient(135deg,#F6F8FF 0%,#FBF7FF 100%);
    border:1px solid var(--brand-border);
    border-radius:var(--radius);
    padding:18px 20px;
}
.why-heart-title{
    display:flex;align-items:center;gap:7px;
    font-size:14px;font-weight:700;color:var(--brand);
    margin-bottom:9px;
}
.why-heart p{
    font-size:13.5px;
    color:var(--text-sub);
    line-height:1.85;
}
.why-note{
    margin-top:12px;
    display:flex;align-items:flex-start;gap:8px;
    background:#FBFCFE;
    border:1px solid var(--line);
    border-radius:12px;
    padding:11px 14px;
    font-size:12.5px;color:var(--text-mute);
    line-height:1.6;
}
.why-note svg{flex:0 0 auto;margin-top:2px;color:var(--brand);}
/* 手机端：表格转为一行一个对比项的堆叠卡片 */
@media (max-width:720px){
    .why-table-wrap{
        border:none;background:transparent;box-shadow:none;
    }
    .why-table thead{display:none;}
    .why-table tr{
        display:block;
        background:#fff;
        border:1px solid var(--line);
        border-radius:14px;
        margin-bottom:12px;
        overflow:hidden;
        box-shadow:var(--shadow);
    }
    .why-table th.dim,.why-table td.dim{
        width:auto;
        display:block;
        background:var(--brand-light);
        color:var(--brand);
        font-size:13.5px;
        padding:11px 16px;
    }
    .why-table td{
        display:flex;
        gap:12px;
        padding:11px 16px;
        font-weight:400;
        border-top:none;
        border-left:none!important;
    }
    /* 三种模式在手机端也各带一层淡底色 */
    .why-table tbody td:nth-child(2){background:#F4F5F8;color:#6B7080;}
    .why-table tbody td:nth-child(3){background:#FCF6EA;color:#79613C;}
    .why-table tbody td:nth-child(4){background:#ECF0FF;color:var(--text);}
    .why-table td::before{
        content:attr(data-label);
        flex:0 0 64px;
        color:var(--text-mute);
        font-weight:600;
    }
    .why-table tbody td:nth-child(3)::before{color:#9A6B1F;}
    .why-table tbody td:nth-child(4)::before{color:var(--brand);}
    .why-table td.dim::before{content:none;}
}

/* ===== 会员档位筛选（只看某档位，位于会员档位介绍区底部） ===== */
.lvfilter{
    display:flex;align-items:center;justify-content:center;
    flex-wrap:wrap;gap:8px;
    padding:22px 0 0;
}
.lvfilter-label{
    display:inline-flex;align-items:center;gap:5px;
    font-size:13px;color:var(--text-mute);margin-right:2px;
}
.lvfilter-label svg{width:15px;height:15px;}
.lv-tag{
    --lv1:var(--brand);--lv2:var(--brand-2);--lvtext:#fff;
    padding:7px 18px;border-radius:20px;
    font-size:14px;color:var(--text-sub);
    background:var(--bg-soft);border:1px solid var(--line);
    cursor:pointer;white-space:nowrap;
}
.lv-tag:active{background:var(--brand-light);color:var(--brand);}
.lv-tag.lv-yellow{--lv1:#FFB800;--lv2:#FFD43B;--lvtext:#613400;}
.lv-tag.lv-blackgold{--lv1:#23273A;--lv2:#14161F;--lvtext:#FFD43B;}
.lv-tag.lv-purple{--lv1:#8B5CF6;--lv2:#6D3EE8;--lvtext:#fff;}
.lv-tag.lv-green{--lv1:#10B981;--lv2:#059669;--lvtext:#fff;}
.lv-tag.lv-orange{--lv1:#FF9F1C;--lv2:#F97316;--lvtext:#fff;}
.lv-tag.lv-red{--lv1:#F04438;--lv2:#DC2626;--lvtext:#fff;}
.lv-tag.active{
    background:linear-gradient(135deg,var(--lv1),var(--lv2));
    color:var(--lvtext);border-color:transparent;
    font-weight:600;
}
.lv-hide{display:none!important;}

/* ===== 项目卡片 ===== */
.project-card{
    display:block;
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    margin-bottom:14px;
    box-shadow:var(--shadow);
    overflow:hidden;
}
.project-card:active{background:#fff;}
.project-main{
    display:flex;align-items:center;gap:16px;
    padding:18px;
}
.project-icon{
    flex:0 0 auto;width:58px;height:58px;
    border-radius:14px;
    background:linear-gradient(135deg,var(--brand-light),#F5F6FF);
    border:1px solid var(--brand-border);
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;
}
.project-icon img{width:100%;height:100%;object-fit:cover;}
.project-icon svg{width:26px;height:26px;color:var(--brand);}
.project-body{flex:1;min-width:0;}
.project-title{
    font-size:16px;font-weight:600;color:var(--text);
    margin-bottom:5px;
    line-height:1.4;
    word-break:break-all;
    display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.project-title .tag.tested{
    display:inline-flex;align-items:center;gap:3px;
    background:#E6F9F1;color:#059669;
    border:1px solid #BFF0DC;
    font-size:11px;font-weight:600;
    padding:2px 8px;border-radius:10px;
    flex:0 0 auto;vertical-align:middle;
}
.project-title .tag.tested svg{width:11px;height:11px;}
/* 标题行统一单行：标题过长省略，置顶/已实测标签不缩不放，保证卡片等高 */
.project-title.nowrap{flex-wrap:nowrap;}
.project-title.nowrap .tag{flex:0 0 auto;}
.project-title .tt{
    flex:0 1 auto;min-width:0;
    overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
}
.project-summary{
    font-size:13px;color:var(--text-sub);
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
    overflow:hidden;
    word-break:break-all;
    line-height:1.55;
    min-height:calc(13px * 1.55 * 2); /* 短摘要也占满两行，卡片高度统一 */
}
.project-tags{margin-top:10px;display:flex;gap:6px;flex-wrap:wrap;}
.tag{
    font-size:11px;padding:3px 10px;border-radius:12px;
    background:var(--brand-light);color:var(--brand);
    line-height:1.6;font-weight:500;
}
.tag.gray{background:var(--bg-soft);color:var(--text-mute);}
.tag.level{--lv1:var(--brand);--lv2:var(--brand-2);background:linear-gradient(135deg,var(--lv1),var(--lv2));color:#fff;}

/* ===== 会员档位标签配色（后台可按档位选择） ===== */
.tag.lv-blue{background:#4D6BFE;color:#fff;}
.tag.lv-yellow{background:linear-gradient(135deg,#FFD43B,#FFB800);color:#613400;font-weight:600;}
.tag.lv-blackgold{background:linear-gradient(135deg,#23273A,#14161F);color:#FFD43B;font-weight:600;}
.tag.lv-purple{background:linear-gradient(135deg,#8B5CF6,#6D3EE8);color:#fff;font-weight:600;}
.tag.lv-green{background:#10B981;color:#fff;}
.tag.lv-orange{background:#FF9F1C;color:#fff;font-weight:500;}
.tag.lv-red{background:#F04438;color:#fff;}
/* 圆点同色（会员档位卡片用） */
.lv-dot.lv-blue{background:#4D6BFE;}
.lv-dot.lv-yellow{background:#FFB800;}
.lv-dot.lv-blackgold{background:#23273A;box-shadow:inset 0 0 0 2px #FFD43B;}
.lv-dot.lv-purple{background:#8B5CF6;}
.lv-dot.lv-green{background:#10B981;}
.lv-dot.lv-orange{background:#FF9F1C;}
.lv-dot.lv-red{background:#F04438;}

/* 额外费用标签 */
.tag.fee-teach{background:#FFF1DE;color:#C2620A;border:1px solid #FFE0B8;}
.tag.fee-soft{background:#F1EBFF;color:#6D3EE8;border:1px solid #E0D4FF;}
.tag.fee-after{background:#E8F0FF;color:#2B5FD9;border:1px solid #C9DBFF;}
.tag.fee-video{background:#FFECE8;color:#D14326;border:1px solid #FFD1C7;}
.tag.fee-free{background:#E6F9F1;color:#059669;border:1px solid #BFF0DC;}

/* 置顶标签：类目置顶（蓝）柔和，全站置顶（红）醒目 */
.tag.top-cat{background:#E8F0FF;color:#2B5FD9;border:1px solid #C9DBFF;font-weight:600;}
.tag.top-site{background:linear-gradient(135deg,#FF6B57,#F04438);color:#fff;border:none;font-weight:600;box-shadow:0 2px 6px rgba(240,68,56,.25);}
.detail-title .tag.top-cat,.detail-title .tag.top-site{
    font-size:12px;padding:3px 10px;border-radius:12px;
    flex:0 0 auto;letter-spacing:0;
}

/* 箭头指示 */
.project-arrow{
    flex:0 0 auto;color:#C6CAD6;
}
.project-arrow svg{width:18px;height:18px;display:block;}

/* ===== 卡片底部信息条：设备/费用摘要（左） + 学过人数（右） ===== */
.pc-foot{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:8px 18px;
    background:#F6F8FB;
    border-top:1px solid #EEF0F6;
    font-size:12px;color:var(--text-mute);
    line-height:1.5;
}
.pcf-l{display:flex;align-items:center;gap:9px;min-width:0;}
.pcf-l .pc-fee,.pcf-l .pc-free{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pcf-r{display:flex;align-items:center;gap:5px;flex:0 0 auto;color:#8A90A3;font-size:12px;}
.pcf-r svg{width:13px;height:13px;flex:0 0 auto;}
.pcf-shield{display:inline-flex;align-items:center;color:#10B981;flex:0 0 auto;}
.pc-dev{display:inline-flex;align-items:center;gap:4px;color:#9AA1B5;flex:0 0 auto;}
.pc-dev svg{display:block;}
.pc-free{color:#059669;font-weight:600;flex:0 1 auto;}
.pc-fee{color:#C2620A;flex:0 1 auto;}

/* 空状态 */
.empty-state{
    text-align:center;padding:70px 20px;color:var(--text-mute);font-size:14px;
}

/* ===== 联系方式卡片 ===== */
.contact{padding:34px 20px 8px;}
.contact-card{
    background:
        radial-gradient(80% 100% at 50% 0%, rgba(77,107,254,.08), transparent 70%),
        #fff;
    border:1px solid var(--brand-border);
    border-radius:20px;
    padding:30px 22px 26px;
    text-align:center;
    box-shadow:var(--shadow);
}
.contact-title{
    font-size:20px;font-weight:700;color:var(--text);
    margin-bottom:6px;
    display:flex;align-items:center;justify-content:center;gap:8px;
}
.contact-title svg{width:20px;height:20px;color:var(--brand);}
.contact-name{
    font-size:14px;color:var(--text-sub);margin-bottom:18px;
}
.contact-row{
    display:flex;align-items:center;justify-content:center;gap:8px;
    font-size:15px;color:var(--text);
    margin-bottom:12px;
    word-break:break-all;
}
.contact-row svg{width:17px;height:17px;color:var(--brand);flex:0 0 auto;}
.contact-row .val{font-weight:600;color:var(--brand);}
.qrcode-box{
    margin:18px auto 8px;
    width:210px;height:210px;
    padding:10px;
    background:#fff;
    border:1px solid var(--brand-border);
    border-radius:16px;
    box-shadow:var(--shadow);
}
.qrcode-box img{
    width:100%;height:100%;
    border-radius:10px;
    background:#fff;
    -webkit-user-select:none;user-select:none;
    -webkit-touch-callout:none;
    pointer-events:none;
}
.qrcode-hint{
    font-size:12px;color:var(--text-mute);
    margin-top:10px;letter-spacing:1px;
}
.contact-empty{
    font-size:14px;color:var(--text-sub);padding:10px 0 4px;
}

/* ===== 会员收益打卡与反馈评价 ===== */
.shows-sec{padding-bottom:8px;}
.shows-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
}
.show-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:15px 16px 13px;
    box-shadow:var(--shadow);
}
.show-head{display:flex;align-items:center;gap:10px;margin-bottom:9px;}
.show-avatar{
    width:34px;height:34px;flex:0 0 auto;border-radius:50%;
    background:linear-gradient(135deg,#EEF2FF,#E4E9FF);
    color:var(--brand);font-size:15px;font-weight:700;
    display:flex;align-items:center;justify-content:center;
}
.show-user{min-width:0;flex:1;}
.show-acc{
    font-size:13px;font-weight:600;color:var(--text);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.show-meta{display:flex;align-items:center;gap:7px;margin-top:3px;}
.show-badge{font-size:11px;padding:1px 8px;border-radius:20px;line-height:1.6;}
.show-badge.income{background:#E6F9F1;color:#059669;border:1px solid #BFF0DC;}
.show-badge.review{background:#EEF2FF;color:#4D6BFE;border:1px solid #D8E0FF;}
.show-amount{font-size:12.5px;font-weight:700;color:#059669;}
.show-date{font-size:11px;color:var(--text-mute);flex:0 0 auto;}
.show-text{
    font-size:13px;color:var(--text-sub);line-height:1.7;
    margin:0;padding:0;
}
.show-tags{margin-top:9px;}
.show-tags .tag{font-size:11px;}
@media (max-width:900px){
    .shows-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
    .shows-grid{grid-template-columns:1fr;}
}

/* ===== 会员中心 · 收益打卡 ===== */
.ck-field{margin-bottom:12px;}
.ck-field label{
    display:flex;align-items:center;gap:6px;
    font-size:12.5px;color:var(--text-sub);margin-bottom:6px;
}
.ck-field label i{
    font-style:normal;font-size:10.5px;color:#C2620A;
    background:#FFF1DE;border:1px solid #FFE0B8;
    padding:0 6px;border-radius:20px;line-height:1.7;
}
.ck-field textarea.auth-input{resize:none;line-height:1.6;}
.ck-shot-box{
    display:flex;align-items:center;justify-content:center;gap:8px;
    border:1.5px dashed var(--line);border-radius:10px;
    background:#FBFCFE;color:var(--text-mute);
    font-size:12.5px;padding:14px 10px;cursor:pointer;
    transition:border-color .15s,color .15s;
}
.ck-shot-box:active{border-color:var(--brand);color:var(--brand);}
.ck-submit{width:100%;margin-top:2px;}
.ck-done{font-size:13px;color:var(--text-mute);text-align:center;padding:8px 0;}
.ck-list{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);}
.ck-item{padding:10px 0;border-bottom:1px solid #F2F4F8;}
.ck-item:last-child{border-bottom:none;padding-bottom:2px;}
.ck-item-head{display:flex;align-items:center;gap:7px;}
.ck-item-date{font-size:12px;color:var(--text-mute);}
.ck-badge{font-size:10.5px;padding:1px 7px;border-radius:20px;line-height:1.7;}
.ck-badge.wait{background:#FFF7E6;color:#B37309;border:1px solid #FFE9BF;}
.ck-badge.yes{background:#E6F9F1;color:#059669;border:1px solid #BFF0DC;}
.ck-badge.no{background:#F4F5F7;color:var(--text-mute);border:1px solid var(--line);}
.ck-badge.lv{background:#E2E8FF;color:#3D56D6;border:1px solid #CBD5FF;}
.ck-reward{font-size:12px;font-weight:700;color:#E5533C;margin-left:auto;}
.ck-item-text{font-size:13px;color:var(--text-sub);line-height:1.65;margin-top:5px;}
.cp-reply{
    font-size:12.5px;color:var(--brand);line-height:1.65;margin-top:7px;
    background:#F0F4FF;border-radius:8px;padding:8px 10px;
}
/* 意见反馈弹窗（首页 / 项目详情页共用） */
.fb-submit{
    width:100%;margin-top:4px;padding:11px 0;
    border:none;border-radius:22px;cursor:pointer;
    background:linear-gradient(135deg,#5B7BFF,#4D6BFE);
    color:#fff;font-size:14px;font-weight:600;
    box-shadow:0 4px 14px rgba(77,107,254,.28);
}
.fb-submit:active{transform:translateY(1px);}
.fb-msg{font-size:12.5px;line-height:1.6;margin-top:10px;text-align:center;min-height:18px;}
.fb-msg.ok{color:#059669;}
.fb-msg.err{color:#E5533C;}
.fb-lock{text-align:center;padding:6px 0 2px;}
.ck-item-shot{
    width:64px;height:64px;object-fit:cover;border-radius:8px;
    border:1px solid var(--line);margin-top:7px;display:block;
}
.ck-claim-btn{
    display:inline-flex;align-items:center;gap:5px;
    margin-top:9px;padding:7px 16px;
    border:none;border-radius:20px;cursor:pointer;
    background:linear-gradient(135deg,#FF7A59,#F04438);
    color:#fff;font-size:12.5px;font-weight:600;
    box-shadow:0 3px 10px rgba(240,68,56,.25);
}
.ck-claimed{font-size:12px;color:var(--text-mute);margin-top:7px;}
.ck-shown{font-size:12px;color:#059669;margin-top:7px;}

/* ===== 底部 ===== */
.atmo-bar{
    margin:14px 20px 0;padding:10px 16px;
    display:flex;align-items:center;justify-content:center;gap:7px;
    background:#F6F8FF;border:1px solid #E3E9FF;border-radius:12px;
    font-size:12.5px;color:var(--text-sub);
}
.atmo-bar svg{color:var(--brand);flex:0 0 auto;}
.atmo-bar b{color:var(--brand);}
.detail-heat{
    display:flex;align-items:center;gap:6px;
    font-size:12.5px;color:var(--text-mute);
    margin:-6px 0 12px;
}
.detail-heat svg{color:var(--brand);flex:0 0 auto;}
.detail-heat b{color:var(--brand);font-weight:700;}

/* ===== 底部 ===== */
.footer{
    padding:30px 20px 40px;
    font-size:12px;color:var(--text-mute);
    text-align:center;
    margin-top:auto;
    line-height:1.8;
    letter-spacing:.5px;
}

/* ===== 全站品牌底部（大厂风格：简介 + 数据 + 链接分组 + 版权） ===== */
.site-footer{
    margin-top:48px;
    background:var(--bg-soft);
    border-top:1px solid var(--line);
    flex-shrink:0;
}
.sf-inner{
    max-width:1100px;margin:0 auto;
    padding:38px 40px 28px;
    display:flex;gap:48px;justify-content:space-between;align-items:flex-start;
}
.sf-brand{flex:1 1 auto;min-width:0;max-width:460px;}
.sf-logo{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.sf-logo img{height:34px;width:auto;border-radius:8px;}
.sf-mark{
    width:36px;height:36px;border-radius:10px;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;font-size:17px;font-weight:800;
    display:flex;align-items:center;justify-content:center;
}
.sf-name{font-size:17px;font-weight:800;color:var(--text);letter-spacing:.5px;}
.sf-desc{font-size:13px;line-height:1.95;color:var(--text-sub);margin-bottom:16px;}
.sf-stats{display:flex;gap:10px;flex-wrap:wrap;}
.sf-stat{
    display:inline-flex;align-items:baseline;gap:5px;
    background:#fff;border:1px solid var(--line);border-radius:999px;
    padding:7px 14px;font-size:12px;color:var(--text-mute);
    white-space:nowrap;
}
.sf-stat b{font-size:13px;color:var(--brand);font-weight:700;}
.sf-cols{display:flex;gap:56px;flex:0 0 auto;}
.sf-col h4{font-size:13.5px;font-weight:700;color:var(--text);margin-bottom:12px;letter-spacing:.5px;}
.sf-col a{display:block;font-size:13px;color:var(--text-sub);padding:5px 0;line-height:1.7;transition:color .15s;white-space:nowrap;}
.sf-col a:hover{color:var(--brand);}
.sf-bottom{
    border-top:1px solid var(--line);
    padding:16px 40px 24px;
    text-align:center;
    font-size:12px;color:var(--text-mute);line-height:1.9;
}
.sf-bottom p{margin:0;}
.sf-record{letter-spacing:.3px;}
@media (max-width:720px){
    .site-footer{margin-top:36px;}
    .sf-inner{flex-direction:column;gap:26px;padding:30px 24px 22px;}
    .sf-brand{max-width:none;}
    .sf-cols{width:100%;gap:0;justify-content:space-between;}
    .sf-col{flex:1;}
    .sf-col a{white-space:normal;}
    .sf-stat{padding:6px 12px;}
    .sf-bottom{padding:15px 24px 22px;}
}

/* ===== 关于沐光创客社群 ===== */
.about-wrap{
    width:100%;max-width:860px;margin:0 auto;
    padding:24px 20px 12px;flex:1;
}
.about-hero{
    border:1px solid var(--brand-border);
    border-radius:var(--radius);
    background:linear-gradient(180deg,#FBFCFF,#F5F8FF);
    padding:34px 24px 28px;
    text-align:center;
    box-shadow:var(--shadow);
}
.about-eyebrow{font-size:12px;letter-spacing:3px;color:var(--brand);font-weight:700;margin-bottom:10px;}
.about-h1{font-size:24px;font-weight:800;color:var(--text);margin-bottom:14px;letter-spacing:1px;}
.about-lead{font-size:14px;color:var(--text-sub);line-height:2;max-width:640px;margin:0 auto;text-align:left;}
.about-lead strong{color:var(--text);font-weight:700;}
.about-stats{display:flex;gap:12px;justify-content:center;margin-top:24px;flex-wrap:wrap;}
.about-stat{
    flex:1 1 0;min-width:150px;max-width:220px;
    background:#fff;border:1px solid var(--line);border-radius:14px;
    padding:16px 12px;
}
.about-stat b{display:block;font-size:22px;font-weight:800;color:var(--brand);line-height:1.2;margin-bottom:6px;}
.about-stat span{font-size:12px;color:var(--text-mute);}
.about-card{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:24px 22px;margin-top:16px;box-shadow:var(--shadow);
}
.about-title{
    display:flex;align-items:center;gap:8px;
    font-size:16.5px;font-weight:800;color:var(--text);
    margin-bottom:14px;
}
.about-title svg{color:var(--brand);flex:0 0 auto;}
.about-p{font-size:14px;color:var(--text-sub);line-height:2;}
.about-p strong{color:var(--text);font-weight:700;}
.about-list{list-style:none;display:flex;flex-direction:column;gap:16px;}
.about-list li{display:flex;gap:12px;align-items:flex-start;}
.al-ico{
    flex:0 0 auto;width:34px;height:34px;border-radius:10px;
    background:var(--brand-light);color:var(--brand);
    display:flex;align-items:center;justify-content:center;
}
.about-list b{font-size:14.5px;color:var(--text);font-weight:700;display:block;margin-bottom:3px;}
.about-list p{font-size:13px;color:var(--text-sub);line-height:1.85;}
.about-values{display:flex;flex-direction:column;gap:12px;}
.av-item{
    border:1px solid var(--line);border-radius:12px;
    padding:14px 16px;background:linear-gradient(180deg,#FCFCFF,#F7F9FE);
}
.av-item b{display:block;font-size:14px;color:var(--brand);font-weight:800;margin-bottom:4px;}
.av-item p{font-size:13px;color:var(--text-sub);line-height:1.85;}
.about-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;}
.ab-btn{
    display:inline-flex;align-items:center;justify-content:center;
    padding:10px 22px;border-radius:999px;
    border:1px solid var(--brand-border);background:#fff;color:var(--brand);
    font-size:13.5px;font-weight:600;
}
.ab-btn.primary{
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;border-color:transparent;
    box-shadow:0 6px 16px rgba(77,107,254,.25);
}
.ab-btn:active{opacity:.88;}
@media (max-width:720px){
    .about-wrap{padding:18px 16px 10px;}
    .about-hero{padding:28px 20px 24px;}
    .about-h1{font-size:21px;}
    .about-lead{text-align:left;}
    .about-card{padding:22px 18px;}
    .about-stat{min-width:calc(50% - 6px);max-width:none;}
    .about-cta .ab-btn{flex:1 1 auto;}
}

/* ===== 详情页 ===== */
.detail{padding:24px 20px 8px;}
.detail-title{
    font-size:26px;font-weight:800;color:var(--text);
    margin:0 -20px 16px;
    padding:12px 20px 14px;
    line-height:1.4;letter-spacing:.5px;
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;
    position:sticky;top:56px;z-index:10;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line);
}
.detail-title .tag.tested{
    display:inline-flex;align-items:center;gap:3px;
    background:#E6F9F1;color:#059669;
    border:1px solid #BFF0DC;
    font-size:12px;font-weight:600;
    padding:3px 10px;border-radius:12px;
    flex:0 0 auto;letter-spacing:0;
}
.detail-title .tag.tested svg{width:12px;height:12px;}
.breadcrumb{
    font-size:13px;color:var(--text-mute);
    margin-bottom:12px;
    display:flex;gap:6px;align-items:center;flex-wrap:wrap;
}
.breadcrumb .sep{color:#D0D3DC;}
.breadcrumb a{color:var(--brand);}
.detail-summary{
    position:relative;overflow:hidden;
    display:flex;align-items:center;gap:14px;
    background:
        radial-gradient(130px 130px at 100% -30%, rgba(77,107,254,.12), transparent 72%),
        linear-gradient(135deg,#F4F6FF,#EEF1FF);
    border:1px solid var(--brand-border);
    border-radius:14px;
    padding:15px 18px;
    margin-bottom:22px;
}
.detail-summary::after{
    content:"";position:absolute;right:-34px;bottom:-42px;
    width:110px;height:110px;border-radius:50%;
    border:1.5px solid rgba(77,107,254,.14);
    pointer-events:none;
}
.detail-summary .ds-icon{
    flex:0 0 auto;z-index:1;
    width:44px;height:44px;border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    background:#fff;color:var(--brand);
    border:1px solid var(--brand-border);
    box-shadow:0 3px 10px rgba(77,107,254,.14);
}
.detail-summary .ds-body{flex:1;min-width:0;z-index:1;}
.detail-summary .ds-label{
    display:block;
    font-size:11px;font-weight:600;letter-spacing:2px;
    color:var(--text-mute);
    margin-bottom:3px;
}
.detail-summary .ds-text{
    display:block;
    font-size:15px;font-weight:700;color:#2E3AA0;
    line-height:1.6;
}
/* 项目视频介绍卡片（tutorial_url 为视频直链时显示） */
.video-card{
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    overflow:hidden;
    margin-bottom:22px;
    box-shadow:0 4px 16px rgba(17,24,39,.05);
}
.video-card video{
    display:block;width:100%;
    aspect-ratio:16/9;background:#101426;
}
.video-cap{
    display:flex;align-items:center;gap:7px;
    padding:10px 16px;
    font-size:13px;font-weight:600;color:#475069;
    background:#F6F8FB;
    border-top:1px solid var(--line);
}
.video-cap svg{color:var(--brand);flex:0 0 auto;}
/* 所需设备：顶部快速说明卡片 */
.device-box{
    display:flex;align-items:center;gap:14px;
    background:#fff;
    border:1px solid var(--line);
    border-left:4px solid var(--dev-color);
    border-radius:12px;
    padding:14px 16px;
    margin-bottom:22px;
    box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.device-icon{
    flex:0 0 auto;
    width:44px;height:44px;border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    background:var(--dev-bg);
    color:var(--dev-color);
}
.device-body{flex:1;min-width:0;}
.device-title{
    font-size:15px;font-weight:700;color:var(--text);
    line-height:1.4;
}
.device-title span{color:var(--dev-color);}
.device-desc{
    font-size:13px;color:var(--text-mute);
    margin-top:3px;line-height:1.6;
}
.detail-content{
    font-size:15px;color:var(--text);line-height:1.9;
    word-break:break-word;
    margin-bottom:22px;
}
.detail-content img{
    max-width:100%;max-height:70vh;
    object-fit:contain;object-position:center top;
    border-radius:10px;margin:14px 0;
    cursor:zoom-in;background:var(--bg-soft,#f5f6fa);
}
/* 图片灯箱 */
.img-lightbox{
    position:fixed;inset:0;z-index:99999;
    background:rgba(0,0,0,.88);
    display:none;align-items:center;justify-content:center;
    padding:20px;cursor:zoom-out;
}
.img-lightbox.show{display:flex;}
.img-lightbox img{
    max-width:95%;max-height:95vh;
    object-fit:contain;border-radius:8px;
    box-shadow:0 8px 40px rgba(0,0,0,.5);
}
.img-lightbox .lb-close{
    position:absolute;top:16px;right:20px;
    width:36px;height:36px;border-radius:50%;
    background:rgba(255,255,255,.15);color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:20px;cursor:pointer;
}
.img-lightbox .lb-close:hover{background:rgba(255,255,255,.3);}
.detail-content h1,.detail-content h2,.detail-content h3{
    margin:22px 0 10px;color:var(--text);line-height:1.4;
}
.detail-content h1{font-size:21px;}
.detail-content h2{font-size:18px;}
.detail-content h3{font-size:16px;}
.detail-content p{margin:12px 0;}
.detail-content ul,.detail-content ol{margin:12px 0;padding-left:22px;}
.detail-content li{margin:6px 0;}
.detail-content a{color:var(--brand);text-decoration:underline;}
.detail-content table{width:100%;border-collapse:collapse;margin:14px 0;}
.detail-content td,.detail-content th{border:1px solid var(--line);padding:8px 10px;}
/* 迁移内容：小节卡片与温馨提示 */
.detail-content .sc-sec{
    background:#fff;border:1px solid var(--line);
    border-radius:var(--radius);padding:20px 22px;margin:16px 0;
    box-shadow:var(--shadow);
}
.detail-content .sc-sec h3{
    margin-top:0;font-size:17px;font-weight:700;
    padding-left:12px;border-left:4px solid var(--brand);
    margin-bottom:14px;
}
.detail-content .warn-text{
    color:#c2410c;background:#fff7ed;border:1px solid #fed7aa;
    border-radius:10px;padding:12px 14px;font-size:14px;
}
.detail-content .warn-text h3{
    border-left:none;padding-left:0;
}

/* 详情页底部联系按钮 */
.detail-contact-cta{
    margin:28px 20px 8px;
    text-align:center;
}
.cta-btn{
    display:inline-block;
    padding:14px 48px;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));
    color:#fff;
    border-radius:28px;
    font-size:16px;font-weight:600;letter-spacing:1px;
    box-shadow:0 8px 24px rgba(77,107,254,.30);
}
.cta-btn:active{opacity:.9;}

/* ===== 详情页：学习权限提示 ===== */
.unlock-box{
    display:flex;align-items:center;gap:12px;
    background:var(--bg-soft);
    border:1px solid var(--line);
    border-radius:14px;
    padding:14px 16px;
    margin-bottom:14px;
}
.unlock-box .unlock-label{
    font-size:12px;color:var(--text-mute);
    flex:0 0 auto;line-height:1.5;
}
.unlock-box .unlock-val{
    font-size:15px;font-weight:700;color:var(--text);
    display:flex;align-items:center;flex-wrap:wrap;gap:8px;
}
.unlock-box .unlock-note{
    font-size:12px;color:var(--text-mute);
    margin-left:auto;text-align:right;line-height:1.5;
    flex:0 0 auto;
}

/* ===== 详情页：费用说明 ===== */
.fee-box{
    border:1px solid var(--brand-border);
    background:linear-gradient(180deg,#FBFCFF,#F7F9FF);
    border-radius:14px;
    padding:6px 18px;
    margin-bottom:22px;
}
.fee-head{
    display:flex;align-items:center;gap:8px;
    font-size:14px;font-weight:700;color:var(--text);
    padding:14px 0 10px;
}
.fee-head svg{width:16px;height:16px;color:var(--brand);flex:0 0 auto;}
.fee-head .fee-head-note{margin-left:auto;font-size:11px;font-weight:400;color:var(--text-mute);}
.fee-head + .fee-row{border-top:1px dashed var(--line);}
.fee-row{
    display:flex;align-items:center;gap:10px;
    padding:12px 0;
    font-size:14px;color:var(--text);
}
.fee-row + .fee-row{border-top:1px dashed var(--line);}
.fee-row .fee-icon{width:18px;height:18px;color:var(--brand);flex:0 0 auto;}
.fee-row .fee-name{font-weight:600;flex:0 0 auto;}
.fee-row .fee-desc{font-size:12px;color:var(--text-mute);flex:1;min-width:0;}
.fee-row .fee-val{font-weight:700;flex:0 0 auto;}
.fee-row .fee-val.free{color:#10B981;}
.fee-row .fee-val.pay{color:#C2620A;}

/* ===== 详情页：风险提示（每个项目独立内容） ===== */
.risk-box{
    border:1px solid rgba(217,119,6,.28);
    background:linear-gradient(180deg,#FFFDF6,#FFF8EB);
    border-radius:14px;
    padding:0 18px 6px;
    margin-bottom:22px;
}
.risk-head{
    display:flex;align-items:center;gap:8px;
    font-size:14px;font-weight:700;color:#92600A;
    padding:14px 0 10px;
}
.risk-head svg{width:16px;height:16px;color:#D97706;flex:0 0 auto;}
.risk-head .risk-note{margin-left:auto;font-size:11px;font-weight:400;color:#C09A5E;}
.risk-list{margin:0;padding:0;list-style:none;}
.risk-list li{
    position:relative;
    padding:9px 0 9px 16px;
    font-size:13px;line-height:1.7;color:#8A6A33;
    border-top:1px dashed rgba(217,119,6,.2);
}
.risk-list li::before{
    content:'';
    position:absolute;left:1px;top:16px;
    width:6px;height:6px;border-radius:50%;
    background:#E8B25C;
}

/* ===== 详情页：项目展示图 ===== */
.detail-gallery{margin-bottom:22px;}
.detail-gallery .gallery-item{
    border-radius:14px;overflow:hidden;
    border:1px solid var(--line);
    background:var(--bg-soft);
    margin-bottom:12px;
}
.detail-gallery .gallery-item img{width:100%;display:block;cursor:zoom-in;}
.detail-content img{cursor:zoom-in;}

/* ===== 响应式：小屏收紧 ===== */
@media (max-width: 480px){
    .hero{padding:42px 20px 32px;}
    .hero-title{font-size:28px;}
    .hero-sub{font-size:13px;letter-spacing:2px;}
    .section{padding:28px 16px 4px;}
    .section-title{font-size:19px;}
    .detail-title{font-size:22px;}
    /* 分类标签单行 + 更多按钮，保持吸顶 */
    .cats{padding:10px 16px;}
    .cat-tag{padding:6px 14px;font-size:13px;}
}

/* ===== 轻动效：Hero 入场 + 滚动渐显 ===== */
.hero-badge,.hero-title,.hero-sub,.hero-line{
    animation:heroUp .7s cubic-bezier(.22,.61,.36,1) both;
}
.hero-title{animation-delay:.1s;}
.hero-sub{animation-delay:.2s;}
.hero-line{animation-delay:.3s;}
@keyframes heroUp{
    from{opacity:0;transform:translateY(20px);}
    to{opacity:1;transform:none;}
}
.reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .55s ease,transform .55s cubic-bezier(.22,.61,.36,1);
}
.reveal.in-view{opacity:1;transform:none;}
/* 渐显完成后恢复轻快过渡，避免悬停跟手变慢 */
.reveal.revealed{
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .2s ease;
}

/* 悬停微交互（仅鼠标设备生效） */
@media (hover:hover){
    .back-btn{transition:background .2s ease,color .2s ease;}
    .back-btn:hover{background:var(--brand-light);color:var(--brand);}
    .project-card:hover,.level-card:hover{
        transform:translateY(-4px);
        border-color:var(--brand-border);
        box-shadow:0 4px 12px rgba(26,29,41,.05),0 18px 44px rgba(77,107,254,.14);
    }
    .project-arrow{transition:color .2s ease,transform .2s ease;}
    .project-card:hover .project-arrow{color:var(--brand);transform:translateX(3px);}
    .cat-tag,.lv-tag{transition:color .2s ease,background .2s ease,border-color .2s ease;}
    .cat-tag:not(.active):hover,.lv-tag:not(.active):hover{color:var(--brand);background:var(--brand-light);border-color:var(--brand-border);}
    .cta-btn{transition:transform .25s ease,box-shadow .25s ease;}
    .cta-btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(77,107,254,.4);}
}

/* ===== PC 宽屏适配：≥1024px 更大气的排版 ===== */
@media (min-width: 1024px){
    .app{max-width:1200px;}
    .topbar{height:64px;padding:0 28px;}
    .brand-name{font-size:18px;}
    .cats-wrap{top:64px;}

    .hero{padding:96px 40px 72px;}
    .hero-badge{font-size:13px;letter-spacing:3px;padding:6px 20px;}
    .hero-title{font-size:52px;letter-spacing:2px;margin-bottom:14px;}
    .hero-sub{font-size:17px;letter-spacing:6px;}
    .hero-line{width:64px;margin-top:26px;}

    .section{padding:52px 40px 8px;}
    .section-title{font-size:24px;}
    .notice-sec{padding:0 40px;margin-top:-12px;}

    /* 会员档位横铺 */
    .level-grid{
        display:grid;
        grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
        gap:22px;
    }
    .level-card{margin-bottom:0;padding:30px 28px;}
    .level-name{font-size:21px;}

    /* 分类标签居中排布 */
    .cats{justify-content:center;padding:14px 40px;}
    .cats-tags{flex:0 1 auto;justify-content:center;}
    .lvfilter{padding:26px 0 0;}

    /* 项目卡片双列 */
    .fold-body{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:16px 18px;
    }
    .project-card{margin-bottom:0;}
    .project-main{padding:20px 22px;}
    .pc-foot{padding:8px 22px;}

    /* 联系方式横向大卡片 */
    .contact{padding:52px 40px 12px;}
    .contact-card{
        display:flex;align-items:center;justify-content:center;
        gap:90px;text-align:left;
        padding:46px 64px;
    }
    .contact-main{min-width:0;}
    .contact-main:only-child{text-align:center;}
    .contact-main:only-child .contact-row{justify-content:center;}
    .contact-main .contact-row{justify-content:flex-start;}
    .qrcode-side{flex:0 0 auto;text-align:center;}
    .qrcode-box{margin:0 auto 8px;}

    /* 详情页正文限宽，阅读舒适 */
    .detail{max-width:860px;width:100%;margin:0 auto;padding-top:40px;}
    .detail-title{font-size:32px;}
    .detail-contact-cta{max-width:860px;margin:28px auto 8px;}

    .footer{padding:36px 40px 48px;font-size:13px;}
}

/* 弱动效偏好：全部关闭 */
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    .hero-badge,.hero-title,.hero-sub,.hero-line{animation:none;}
    .reveal{opacity:1;transform:none;transition:none;}
    .join-bubble{transition:none;}
    .notice-slide{transition:none;}
}

/* ===== 首页：项目保证卡片 ===== */
.assurance{padding:0 20px;}
.assurance-card{
    border:1px solid var(--brand-border);
    border-radius:var(--radius);
    background:linear-gradient(180deg,#FBFCFF,#F7F9FF);
    padding:24px 20px;
    box-shadow:var(--shadow);
}
.assurance-head{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:12px;
}
.assurance-title{
    display:flex;align-items:center;gap:8px;
    font-size:16px;font-weight:700;color:var(--text);
}
.assurance-title svg{width:20px;height:20px;color:var(--brand);flex:0 0 auto;}
.assurance-en{font-size:11px;color:var(--text-mute);letter-spacing:1px;}
.assurance-lead{font-size:13px;color:var(--text-sub);margin-bottom:18px;line-height:1.6;}
.assurance-list{
    display:flex;gap:16px;flex-wrap:wrap;
}
.assurance-item{
    display:flex;align-items:center;gap:10px;flex:1;min-width:140px;
}
.assurance-ico{
    width:40px;height:40px;flex:0 0 auto;border-radius:12px;
    background:var(--brand-light);
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;
}
.assurance-ico svg{width:20px;height:20px;color:var(--brand);}
.assurance-text{min-width:0;}
.assurance-name{font-size:13px;font-weight:600;color:var(--text);}
.assurance-desc{font-size:12px;color:var(--text-mute);margin-top:2px;line-height:1.4;}

/* ===== 详情页：实测信任背书 ===== */
.assurance-tip{
    display:flex;align-items:center;gap:8px;
    background:var(--brand-light);
    border:1px solid var(--brand-border);
    border-radius:12px;padding:12px 16px;
    margin-bottom:22px;
}
.assurance-tip svg{width:18px;height:18px;color:var(--brand);flex:0 0 auto;}
.assurance-tip span{font-size:13px;color:var(--text-sub);line-height:1.5;}

/* ===== 详情页：费用明细图标 ===== */
.fee-icon{overflow:hidden;}

/* ===== 详情页：解锁权限框 ===== */
.unlock-box{overflow:hidden;}

/* ===== 详情页：左侧项目目录 + 右侧详情（PC 双栏） ===== */
.detail-layout{min-width:0;}
.detail-main{min-width:0;}
.pj-side{display:none;}

@media (min-width:1024px){
    .detail-layout{
        display:grid;
        grid-template-columns:300px minmax(0,1fr);
        gap:26px;
        align-items:start;
        padding:32px 40px 8px;
    }
    .pj-side{
        display:flex;flex-direction:column;
        position:sticky;top:88px;
        max-height:calc(100vh - 112px);
        background:#fff;
        border:1px solid var(--line);
        border-radius:var(--radius);
        box-shadow:var(--shadow);
        overflow:hidden;
    }
    .pj-side-head{
        flex:0 0 auto;
        display:flex;align-items:center;gap:8px;
        padding:16px 18px 13px;
        font-size:15px;font-weight:700;color:var(--text);
        border-bottom:1px solid var(--line);
    }
    .pj-side-head svg{width:17px;height:17px;color:var(--brand);flex:0 0 auto;}
    .pj-side-count{
        margin-left:auto;font-size:11px;font-weight:600;
        color:var(--brand);background:var(--brand-light);
        border-radius:10px;padding:2px 10px;white-space:nowrap;
    }
    .pj-lvfilter{
        flex:0 0 auto;
        display:flex;gap:6px;
        padding:10px 14px;
        overflow-x:auto;
        border-bottom:1px solid var(--line);
        -webkit-overflow-scrolling:touch;
    }
    .pj-lvfilter::-webkit-scrollbar{display:none;}
    .pj-lv-tag{
        --lv1:var(--brand);--lv2:var(--brand-2);--lvtext:#fff;
        flex:0 0 auto;
        padding:5px 13px;border-radius:14px;
        font-size:12px;color:var(--text-sub);
        background:var(--bg-soft);border:1px solid var(--line);
        cursor:pointer;white-space:nowrap;
    }
    .pj-lv-tag.lv-yellow{--lv1:#FFB800;--lv2:#FFD43B;--lvtext:#613400;}
    .pj-lv-tag.lv-blackgold{--lv1:#23273A;--lv2:#14161F;--lvtext:#FFD43B;}
    .pj-lv-tag.lv-purple{--lv1:#8B5CF6;--lv2:#6D3EE8;--lvtext:#fff;}
    .pj-lv-tag.lv-green{--lv1:#10B981;--lv2:#059669;--lvtext:#fff;}
    .pj-lv-tag.lv-orange{--lv1:#FF9F1C;--lv2:#F97316;--lvtext:#fff;}
    .pj-lv-tag.lv-red{--lv1:#F04438;--lv2:#DC2626;--lvtext:#fff;}
    .pj-lv-tag.active{
        background:linear-gradient(135deg,var(--lv1),var(--lv2));
        color:var(--lvtext);border-color:transparent;font-weight:600;
    }
    .pj-side-list{flex:1;min-height:0;overflow-y:auto;padding:8px 10px 14px;}
    .pj-side-list::-webkit-scrollbar{width:6px;}
    .pj-side-list::-webkit-scrollbar-thumb{background:#E3E6F0;border-radius:3px;}
    .pj-side-list::-webkit-scrollbar-track{background:transparent;}
    .pj-cat{
        position:relative;
        font-size:13px;font-weight:700;color:var(--text);
        letter-spacing:1px;padding:14px 10px 8px 18px;
    }
    .pj-cat::before{
        content:"";position:absolute;left:8px;top:50%;transform:translateY(-50%);
        width:3px;height:13px;border-radius:2px;
        background:linear-gradient(180deg,var(--brand),var(--brand-2));
    }
    .pj-side-empty{
        font-size:12px;color:var(--text-mute);
        text-align:center;padding:30px 0;
    }
    .pj-item{
        display:block;
        border-radius:12px;
        border:1px solid #EEF0F6;
        overflow:hidden;
        margin-bottom:8px;
        transition:background .15s ease,border-color .15s ease;
    }
    .pj-item:hover{background:var(--bg-soft);border-color:#E2E6EE;}
    .pj-item.active{background:var(--brand-light);border-color:var(--brand-border);}
    .pj-main{
        display:flex;align-items:flex-start;gap:10px;
        padding:10px 10px 8px;
    }
    .pj-ico{
        flex:0 0 auto;width:38px;height:38px;border-radius:10px;overflow:hidden;
        background:linear-gradient(135deg,var(--brand-light),#F5F6FF);
        border:1px solid var(--brand-border);
        display:flex;align-items:center;justify-content:center;
    }
    .pj-ico img{width:100%;height:100%;object-fit:cover;}
    .pj-ico svg{width:18px;height:18px;color:var(--brand);}
    .pj-body{flex:1;min-width:0;}
    .pj-name{
        font-size:13px;font-weight:600;color:var(--text);line-height:1.45;
        display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
        overflow:hidden;word-break:break-all;
    }
    .pj-item.active .pj-name{color:var(--brand);}
    .pj-tags{margin-top:5px;display:flex;gap:4px;flex-wrap:wrap;}
    .pj-tags .tag{font-size:10px;padding:1px 7px;border-radius:8px;}
    /* 侧栏目录底部信息条（小号版） */
    .pj-foot{
        display:flex;align-items:center;justify-content:space-between;gap:8px;
        margin:0 10px 8px;padding:5px 8px;
        background:#F6F8FB;border:1px solid #EEF0F6;border-radius:8px;
        font-size:11px;color:var(--text-mute);line-height:1.5;
    }
    .pj-item.active .pj-foot{background:#fff;}
    .pj-foot .pcf-r{font-size:11px;}
    /* 目录模式下右侧正文占满整栏，标题与正文左对齐，不做通栏吸顶，避免与侧栏卡片错位 */
    .detail-layout .detail{max-width:none;padding:0;}
    .detail-layout .breadcrumb{margin-bottom:10px;}
    .detail-layout .detail-title{
        position:static;
        top:auto;
        margin:0 0 20px;
        padding:0;
        font-size:26px;
        background:none;
        border-bottom:none;
        -webkit-backdrop-filter:none;
        backdrop-filter:none;
    }
    .detail-layout .detail-contact-cta{max-width:none;margin:28px 0 8px;}
}

/* ===== 会员档位：原价/现价对比 ===== */
.level-pricebox{
    display:inline-flex;align-items:center;gap:8px;
    white-space:nowrap;flex:0 0 auto;
}
.level-ori{
    font-size:12px;font-weight:500;
    color:var(--text-mute);
    text-decoration:line-through;
}

/* ===== 首页：开通播报漂浮气泡 ===== */
.join-bubble{
    position:fixed;left:50%;bottom:18px;z-index:80;
    display:flex;align-items:center;gap:10px;
    max-width:min(300px,calc(100vw - 118px));
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:10px 30px 10px 10px;
    box-shadow:0 6px 24px rgba(26,29,41,.10),0 14px 40px rgba(77,107,254,.10);
    opacity:0;visibility:hidden;pointer-events:none;
    transform:translate(-50%,14px);
    transition:opacity .4s ease,transform .45s cubic-bezier(.22,.61,.36,1),visibility .4s;
}
.join-bubble.show{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);}
@media (min-width:900px){
    .join-bubble{bottom:26px;}
}

/* ===== 右下角悬浮操作：微信 / 回顶部 ===== */
.float-actions{
    position:fixed;right:14px;bottom:16px;z-index:80;
    display:flex;flex-direction:column;gap:10px;
}
.fab{
    width:44px;height:44px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:#fff;border:1px solid var(--line);
    box-shadow:0 6px 18px rgba(26,29,41,.10),0 10px 28px rgba(77,107,254,.10);
    color:var(--brand);cursor:pointer;
    transition:transform .2s ease,box-shadow .2s ease;
}
.fab:active{transform:scale(.92);}
.fab-wechat{
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    border-color:transparent;color:#fff;
}
.fab-top{
    opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(10px);
    transition:opacity .3s ease,transform .3s ease,visibility .3s;
}
.fab-top.show{opacity:1;visibility:visible;pointer-events:auto;transform:none;}
@media (min-width:900px){
    /* 跟随 1100px 内容区右缘，窄屏时至少距边 24px */
    .float-actions{right:max(24px, calc(50% - 550px - 24px));bottom:24px;gap:12px;}
    .fab{width:48px;height:48px;}
    .fab:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(26,29,41,.14),0 16px 40px rgba(77,107,254,.16);}
}
.jb-avatar{
    flex:0 0 auto;width:34px;height:34px;border-radius:50%;
    background:var(--brand-light);border:1px solid var(--brand-border);
    display:flex;align-items:center;justify-content:center;
    color:var(--brand);
}
.jb-main{display:flex;flex-direction:column;min-width:0;}
.jb-text{
    font-size:12.5px;color:var(--text-sub);line-height:1.45;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.jb-text b{color:var(--text);font-weight:600;}
.jb-text em{font-style:normal;color:var(--brand);font-weight:600;}
.jb-time{font-size:11px;color:var(--text-mute);margin-top:1px;}
.jb-close{
    position:absolute;top:50%;right:8px;transform:translateY(-50%);
    width:22px;height:22px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    color:var(--text-mute);cursor:pointer;
}
.jb-close:hover{background:var(--bg-soft);color:var(--text-sub);}

/* ===== 详情页：分享项目（独立链接 + 二维码） ===== */
.share-btn{
    margin-left:auto;flex:0 0 auto;
    display:inline-flex;align-items:center;gap:5px;
    font-size:13px;font-weight:600;letter-spacing:0;
    color:var(--brand);background:#fff;
    border:1px solid var(--brand-border);
    border-radius:16px;padding:6px 14px;cursor:pointer;
    transition:background .2s ease;
}
.share-btn:active{background:var(--brand-light);}
/* 标题栏两个操作按钮紧挨在一起：首个按钮靠右，后续按钮不再平分剩余空间 */
.detail-title .share-btn ~ .share-btn{margin-left:0;}
.share-mask{
    position:fixed;inset:0;z-index:120;
    background:rgba(26,29,41,.45);
    display:flex;align-items:center;justify-content:center;
    padding:20px;
    opacity:0;visibility:hidden;
    transition:opacity .3s ease,visibility .3s;
}
.share-mask.show{opacity:1;visibility:visible;}
.share-modal{
    position:relative;
    width:min(340px,92vw);
    background:#fff;border-radius:20px;
    padding:24px 20px 20px;
    text-align:center;
    box-shadow:0 20px 60px rgba(26,29,41,.25);
    transform:translateY(16px) scale(.98);
    transition:transform .35s cubic-bezier(.22,.61,.36,1);
}
.share-mask.show .share-modal{transform:none;}
.share-modal-close{
    position:absolute;top:12px;right:12px;
    width:30px;height:30px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    color:var(--text-mute);cursor:pointer;
}
.share-modal-close:active{background:var(--bg-soft);}
.share-modal-title{font-size:17px;font-weight:700;color:var(--text);}
.share-modal-sub{
    font-size:13px;color:var(--text-mute);margin-top:4px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.share-qr-box{
    width:200px;height:200px;margin:16px auto 0;
    border:1px solid var(--line);border-radius:14px;
    padding:10px;background:#fff;
}
.share-qr-box img{display:block;width:100%;height:100%;object-fit:contain;}
.share-qr-hint{font-size:12.5px;color:var(--text-mute);margin-top:10px;}
.share-link-row{display:flex;gap:8px;margin-top:18px;}
.share-link-row input{
    flex:1;min-width:0;
    height:38px;border:1px solid var(--line);border-radius:10px;
    padding:0 12px;font-size:12px;color:var(--text-sub);
    background:var(--bg-soft);
}
.share-copy-btn{
    flex:0 0 auto;height:38px;padding:0 14px;
    border:none;border-radius:10px;
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;font-size:13px;font-weight:600;cursor:pointer;
}
.share-copy-btn:active{opacity:.88;}
.share-save-btn{
    display:block;margin-top:10px;
    height:40px;line-height:40px;
    border:1px solid var(--brand-border);border-radius:10px;
    color:var(--brand);font-size:13px;font-weight:600;
    text-decoration:none;
}
.share-save-btn:active{background:var(--brand-light);}
@media (min-width:900px){
    .share-btn:hover{background:var(--brand-light);}
    .share-modal-close:hover{background:var(--bg-soft);}
    .share-save-btn:hover{background:var(--brand-light);}
}

/* ===== 联系客服弹窗（二维码必展示，微信/电话选填） ===== */
.c-qr-empty{
    margin:16px auto 0;
    width:200px;height:150px;
    border:1.5px dashed rgba(77,107,254,.35);
    border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    font-size:12.5px;line-height:1.9;color:var(--text-mute);
    background:var(--bg-soft);
}
.c-row{
    display:flex;align-items:center;gap:8px;
    margin-top:12px;
    padding:10px 12px;
    border-radius:10px;
    background:var(--bg-soft);
    text-align:left;
}
.c-label{flex:0 0 auto;font-size:12.5px;color:var(--text-mute);}
.c-val{
    flex:1;min-width:0;
    font-size:14px;font-weight:600;color:var(--text);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    text-decoration:none;
}
.c-copy{
    flex:0 0 auto;
    height:30px;padding:0 12px;
    border:none;border-radius:8px;
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;font-size:12px;font-weight:600;cursor:pointer;
}
.c-copy:active{opacity:.88;}
.c-empty{
    margin-top:16px;
    padding:14px 12px;
    border-radius:10px;
    background:var(--bg-soft);
    font-size:13px;color:var(--text-mute);
}
@media (min-width:900px){
    .c-copy:hover{opacity:.92;}
}

/* ===== 首次到访见面礼弹窗（引导添加客服经理微信） ===== */
.gift-head{
    display:inline-flex;align-items:center;gap:6px;
    padding:7px 18px;
    border-radius:999px;
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;font-size:14px;font-weight:700;letter-spacing:1px;
}
.gift-text{
    margin-top:12px;
    padding:10px 12px;
    border-radius:10px;
    background:var(--brand-light);
    border:1px solid var(--brand-border);
    font-size:13.5px;font-weight:600;line-height:1.6;
    color:var(--brand);
}

/* ===== 新人必读·对话式引导弹窗（仿微信聊天） ===== */
.wc-mask{z-index:130;}
.wc-modal{
    position:relative;
    width:min(380px,94vw);
    height:70vh;
    max-height:640px;
    min-height:420px;
    display:flex;flex-direction:column;
    background:#ededed;border-radius:20px;
    overflow:hidden;
    box-shadow:0 24px 70px rgba(26,29,41,.3);
    transform:translateY(16px) scale(.98);
    transition:transform .35s cubic-bezier(.22,.61,.36,1);
}
.share-mask.show .wc-modal{transform:none;}
@media (min-width:768px){
    .wc-modal{
        width:min(460px,90vw);
        height:78vh;
        max-height:760px;
        min-height:520px;
    }
}
.wc-head{
    flex:0 0 auto;
    display:flex;align-items:center;gap:10px;
    padding:14px 16px;
    background:#fff;
    border-bottom:1px solid rgba(0,0,0,.05);
}
.wc-avatar{
    flex:0 0 auto;
    width:38px;height:38px;border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;font-size:17px;font-weight:700;
}
.wc-avatar.sm{width:32px;height:32px;border-radius:8px;font-size:14px;}
.wc-head-text{flex:1;min-width:0;}
.wc-name{font-size:14px;font-weight:700;color:var(--text);line-height:1.3;}
.wc-status{
    display:flex;align-items:center;gap:5px;
    font-size:11.5px;color:var(--text-mute);margin-top:2px;
}
.wc-dot{
    display:inline-block;width:7px;height:7px;border-radius:50%;
    background:#22c55e;
}
.wc-head .share-modal-close{top:14px;right:12px;}
.wc-body{
    flex:1;min-height:0;
    overflow-y:auto;
    padding:14px 12px;
    background:#ededed;
    -webkit-overflow-scrolling:touch;
}
.wc-day{
    text-align:center;
    font-size:11px;color:var(--text-mute);
    margin-bottom:12px;
}
.wc-row{
    display:flex;gap:8px;
    margin-bottom:10px;
    align-items:flex-start;
}
.wc-row.wc-right{justify-content:flex-end;}
.wc-bubble{
    max-width:74%;
    padding:9px 12px;
    border-radius:14px;
    font-size:14px;line-height:1.55;
    word-break:break-word;
}
.wc-bot{
    background:#fff;color:var(--text);
    border-top-left-radius:5px;
}
.wc-user{
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;
    border-top-right-radius:5px;
}
/* 打字动画 */
.wc-typing{
    display:inline-flex;align-items:center;gap:3px;
    padding:12px 14px;
}
.wc-typing span{
    width:6px;height:6px;border-radius:50%;
    background:var(--text-mute);
    animation:wcDot 1.2s infinite ease-in-out;
}
.wc-typing span:nth-child(2){animation-delay:.15s;}
.wc-typing span:nth-child(3){animation-delay:.3s;}
@keyframes wcDot{
    0%,60%,100%{transform:translateY(0);opacity:.4;}
    30%{transform:translateY(-4px);opacity:1;}
}
/* 快捷回复 */
.wc-choices{
    display:flex;flex-wrap:wrap;gap:8px;
    margin:4px 0 10px 40px;
}
.wc-choice{
    padding:8px 14px;
    border:1px solid var(--brand-border);
    border-radius:999px;
    background:#fff;
    color:var(--brand);
    font-size:13px;font-weight:500;
    cursor:pointer;
    transition:background .2s;
}
.wc-choice:active{background:var(--brand-light);}
/* 底部操作区 */
.wc-foot{
    flex:0 0 auto;
    padding:12px 16px 14px;
    background:#fff;
    border-top:1px solid rgba(0,0,0,.05);
    display:flex;flex-direction:column;gap:8px;
}
.wc-primary-btn{
    width:100%;height:42px;
    border:none;border-radius:12px;
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;font-size:14px;font-weight:600;cursor:pointer;
}
.wc-primary-btn:active{opacity:.88;}
.wc-ghost-btn{
    width:100%;height:42px;
    border:1px solid var(--brand-border);border-radius:12px;
    background:#fff;
    color:var(--brand);font-size:14px;font-weight:600;cursor:pointer;
}
.wc-ghost-btn:active{background:var(--brand-light);}
.wc-foot-hint{
    text-align:center;
    font-size:11.5px;color:var(--text-mute);
}
/* 免费项目卡片 */
.wc-card{
    max-width:78%;
    padding:12px 14px;
    border-radius:14px;
    background:linear-gradient(135deg,#fff8e6,#fef3c7);
    border:1px solid #fde68a;
}
.wc-card-tag{
    display:inline-block;
    padding:3px 10px;
    border-radius:999px;
    background:linear-gradient(135deg,#f59e0b,#f97316);
    color:#fff;font-size:11px;font-weight:700;
    letter-spacing:.5px;
}
.wc-card-title{
    font-size:15px;font-weight:700;color:#92400e;
    margin-top:8px;
}
.wc-card-desc{
    font-size:12.5px;color:#78350f;
    margin-top:4px;line-height:1.5;
}
@media (min-width:900px){
    .wc-choice:hover{background:var(--brand-light);}
    .wc-primary-btn:hover{opacity:.92;}
    .wc-ghost-btn:hover{background:var(--brand-light);}
}

/* ===== 会员服务协议确认弹层（开通会员后首次使用必须点击已同意） ===== */
.agree-gate{
    position:fixed;inset:0;z-index:300;
    background:rgba(26,29,41,.5);
    display:flex;align-items:center;justify-content:center;
    padding:24px 20px;
}
.agree-gate-card{
    width:min(360px,94vw);
    max-height:82vh;
    display:flex;flex-direction:column;
    background:#fff;border-radius:20px;
    padding:22px 18px 18px;
    box-shadow:0 20px 60px rgba(26,29,41,.25);
}
.agree-gate-title{font-size:17px;font-weight:700;color:var(--text);text-align:center;}
.agree-gate-sub{font-size:12.5px;color:var(--text-mute);text-align:center;margin-top:4px;}
.agree-gate-body{
    flex:1;min-height:0;overflow-y:auto;
    margin-top:14px;padding:0 4px;
    font-size:13px;color:var(--text-sub);line-height:1.9;
    white-space:pre-wrap;word-break:break-all;
    -webkit-overflow-scrolling:touch;
}
.agree-gate-btn{
    flex:0 0 auto;margin-top:14px;
    width:100%;height:44px;
    border:none;border-radius:12px;
    background:linear-gradient(135deg,#5B73FF,#7A5CFF);
    color:#fff;font-size:15px;font-weight:600;cursor:pointer;
}
.agree-gate-btn:active{opacity:.88;}
@media (min-width:900px){
    .agree-gate-btn:hover{opacity:.92;}
}