/* ============================================================
   WorkBuddy + HR 半天课程 · 讲师课件
   暗色体系 · WorkBuddy 官网基因（纯黑 / 翠绿 / 大圆角卡片）
   ============================================================ */
:root{
  --bg:#050506;
  --surface:#17171B;
  --card:#1D1D21;
  --tile:#262626;
  --green:#34D399;
  --green-cta:#2EBD83;
  --green-ink:#06281C;
  --green-soft:rgba(46,189,131,.14);
  --text:#FFFFFF;
  --sub:#A6A6AD;
  --faint:#7B7B84;
  --hair:rgba(255,255,255,.085);
  --hair-strong:rgba(255,255,255,.18);
  --track:#3A3A46;
  --type-display:120px;
  --type-title:64px;
  --type-subtitle:36px;
  --type-body:30px;
  --type-small:26px;
  --type-min:24px;
  --leading-title:1.15;
  --leading-body:1.45;
  --pad-top:84px;
  --pad-bottom:60px;
  --pad-x:96px;
  --r-lg:20px;
  --r-md:12px;
  --r-chip:10px;
  --font-cn:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-en:"Manrope","Noto Sans SC",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:#000000;font-family:var(--font-cn);-webkit-font-smoothing:antialiased}

/* ============ 幻灯片公共 ============ */
.slide{height:100%;display:flex;flex-direction:column;padding:var(--pad-top) var(--pad-x) var(--pad-bottom);background:var(--bg);overflow:hidden}
.eyebrow{font-size:var(--type-min);font-weight:700;letter-spacing:.28em;color:var(--green)}
.title{font-size:var(--type-title);font-weight:900;color:var(--text);line-height:var(--leading-title);letter-spacing:.01em}
.subtitle{font-size:var(--type-body);color:var(--sub);font-weight:500;line-height:1.4}
.header{display:flex;flex-direction:column;gap:16px;flex:none}
.body{flex:1;display:flex;flex-direction:column;justify-content:center;gap:26px;min-height:0;margin-top:14px}

/* 分步出现（基态 = 完全显现，通过内联自定义属性隐藏） */
.frag{opacity:var(--frag-op,1);translate:0 var(--frag-ty,0px);transition:opacity .55s cubic-bezier(.22,.61,.36,1),translate .55s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform}
@media (prefers-reduced-motion:reduce){.frag{transition:none}}
@media print{.frag{--frag-op:1!important;--frag-ty:0px!important}}

/* 页脚 · 三 LOGO（JS 统一注入，勿手写） */
.slide-footer{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:22px;flex:none}
.logos{display:flex;align-items:center;gap:18px}
.chip{background:#FFFFFF;border-radius:var(--r-chip);padding:5px 12px;display:flex;align-items:center;height:40px;flex:none}
.chip img{display:block;height:100%;object-fit:contain}
.chip.big{height:60px;padding:8px 20px}
.chip.mid{height:48px;padding:7px 16px}
.chip.sm{height:36px;padding:5px 12px}
.logo-x{font-family:var(--font-en);font-weight:500;font-size:var(--type-min);color:#5A5A64;letter-spacing:.1em}
.logo-wb{display:flex;align-items:center;gap:10px;color:var(--text)}
.logo-wb .l-name{font-family:var(--font-en);font-weight:800;font-size:28px;letter-spacing:.01em}
.foot-note{font-size:var(--type-min);color:var(--faint);letter-spacing:.06em}
.wb-spark{fill:#2EBD83}

/* 通用标签 pill */
.pill{font-size:var(--type-min);font-weight:700;padding:8px 24px;border-radius:999px;letter-spacing:.1em;white-space:nowrap}
.pill.hands{background:var(--green-cta);color:var(--green-ink)}
.pill.demo{background:transparent;color:#B8B8C2;border:2px solid rgba(255,255,255,.26)}
.pill.next{background:transparent;color:var(--faint);border:2px solid rgba(255,255,255,.16)}
.pill.beisen{background:transparent;color:var(--sub);border:2px solid rgba(255,255,255,.26)}

/* 通用提示条 */
.note-bar{display:flex;align-items:center;gap:16px;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);padding:18px 28px;font-size:var(--type-min);color:var(--sub);line-height:1.45}
.note-bar .n-ic{color:var(--green);flex:none;display:flex}
.note-bar b{color:var(--text);font-weight:700}

/* ============ 封面 ============ */
.slide.cover{justify-content:center;align-items:center;text-align:center;gap:34px}
.cover-eyebrow{font-size:28px;font-weight:700;letter-spacing:.42em;color:var(--green);padding-left:.42em}
.cover-title{font-family:var(--font-en);font-size:150px;font-weight:800;color:var(--text);line-height:1;letter-spacing:.01em}
.cover-title .cx{color:var(--green);font-weight:500;margin:0 18px}
.cover-sub{font-size:40px;font-weight:500;color:#D8D8DE;letter-spacing:.14em;padding-left:.14em}
.cover-meta{display:flex;align-items:center;gap:18px}
.c-pill{border:1px solid var(--hair-strong);border-radius:999px;padding:12px 30px;font-size:var(--type-min);color:var(--sub)}
.c-pill b{font-family:var(--font-en);color:var(--green);font-weight:800;margin-right:8px}
.cover-logos{display:flex;align-items:center;gap:22px;margin-top:26px}
.cover-logos .logo-x{font-size:32px}

/* ============ 横向流程 ============ */
.flow{display:flex;align-items:center;justify-content:center;gap:0}
.f-node{width:352px;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:26px 30px;display:flex;flex-direction:column;gap:12px;text-align:left;flex:none}
.f-node .f-ic{width:56px;height:56px;border-radius:14px;background:var(--tile);display:flex;align-items:center;justify-content:center;color:var(--green)}
.f-node .f-tag{font-size:var(--type-min);font-weight:700;color:var(--green);letter-spacing:.14em}
.f-node .f-txt{font-size:30px;font-weight:700;color:var(--text);line-height:1.4}
.f-node .f-sub{font-size:var(--type-min);color:var(--sub);line-height:1.4}
.f-arrow{color:var(--green);flex:none;display:flex;padding:0 10px}
.f-arrow svg{width:44px;height:44px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* ============ 概念瓦片 ============ */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.tile{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:26px 30px;display:flex;flex-direction:column;gap:12px}
.tile .t-en{font-family:var(--font-en);font-size:var(--type-min);font-weight:800;color:var(--faint);letter-spacing:.14em}
.tile .t-name{font-size:32px;font-weight:800;color:var(--text)}
.tile .t-def{font-size:var(--type-min);color:var(--sub);line-height:1.5;flex:1}
.tile .t-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.t-loc{font-size:var(--type-min);color:var(--faint);font-weight:600;white-space:nowrap}

/* ============ 六卡举牌 ============ */
.qgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.qcard{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:24px 30px;display:flex;flex-direction:column;gap:14px}
.q-no{font-family:var(--font-en);font-size:var(--type-min);font-weight:800;color:var(--green);letter-spacing:.14em}
.q-txt{font-size:30px;font-weight:700;color:var(--text);line-height:1.35;flex:1}
.q-ans{font-size:var(--type-min);font-weight:700;padding:8px 20px;border-radius:999px;align-self:flex-start;letter-spacing:.06em}
.q-ans.hands{background:var(--green-cta);color:var(--green-ink)}
.q-ans.outline{background:transparent;color:#B8B8C2;border:2px solid rgba(255,255,255,.26)}
.q-ans.noai{background:transparent;color:var(--faint);border:2px dashed rgba(255,255,255,.3)}

/* ============ 三问过滤 + 粒度纠偏 ============ */
.filter-wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:34px;align-items:stretch}
.gates{display:flex;flex-direction:column;gap:18px}
.gate{display:flex;align-items:center;gap:22px;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-md);padding:24px 30px;flex:1}
.g-no{width:52px;height:52px;border-radius:50%;background:var(--tile);color:var(--green);font-family:var(--font-en);font-weight:800;font-size:26px;display:flex;align-items:center;justify-content:center;flex:none}
.g-txt{font-size:30px;font-weight:700;color:var(--text);line-height:1.3}
.g-sub{font-size:var(--type-min);color:var(--faint);margin-top:4px}
.grain{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:28px 34px;display:flex;flex-direction:column;gap:20px}
.grain-title{font-size:var(--type-min);font-weight:700;color:var(--green);letter-spacing:.2em}
.grain-row{display:flex;align-items:center;gap:22px;flex:1}
.g-bad{font-size:34px;font-weight:800;color:var(--faint);border:2px dashed rgba(255,255,255,.3);border-radius:var(--r-md);padding:18px 34px;flex:none}
.g-good{font-size:34px;font-weight:800;color:var(--green-ink);background:var(--green-cta);border-radius:var(--r-md);padding:18px 34px;flex:none}
.g-cap{font-size:var(--type-min);color:var(--faint)}
.g-chips{display:flex;flex-wrap:wrap;gap:12px}
.g-chip{font-size:var(--type-min);color:var(--sub);border:1px solid var(--hair-strong);border-radius:999px;padding:8px 20px;white-space:nowrap}

/* ============ 带做步骤 ============ */
.steps{display:flex;flex-direction:column;gap:13px}
.s-row{display:flex;align-items:center;gap:22px;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-md);padding:15px 26px}
.s-no{font-family:var(--font-en);font-size:28px;font-weight:800;color:var(--green);width:40px;flex:none}
.s-txt{font-size:28px;font-weight:600;color:var(--text);line-height:1.35;flex:1}
.s-txt em{font-style:normal;color:var(--sub);font-weight:500}
.s-row.pit{background:transparent;border-style:dashed;border-color:rgba(255,255,255,.24)}
.s-row.fix{background:var(--green-soft);border-color:rgba(46,189,131,.45)}
.s-tag{font-size:var(--type-min);font-weight:700;padding:6px 18px;border-radius:999px;white-space:nowrap}
.s-tag.bad{color:var(--faint);border:2px dashed rgba(255,255,255,.3)}
.s-tag.good{background:var(--green-cta);color:var(--green-ink)}

/* ============ 五段式模板卡 ============ */
.tmpl{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:32px 44px;display:flex;flex-direction:column;gap:16px}
.tm-row{display:flex;gap:22px;align-items:baseline}
.tm-key{flex:none;width:172px;font-size:28px;font-weight:800;color:var(--green)}
.tm-val{font-size:28px;color:var(--text);line-height:1.5}
.tm-val.fixed{color:var(--sub)}
.blank{display:inline-block;min-width:110px;border-bottom:3px solid rgba(52,211,153,.55);transform:translateY(-3px)}
.tm-head{display:flex;justify-content:space-between;align-items:baseline;padding:0 2px}

/* ============ 双面板 ============ */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.dpanel{border:1px solid var(--hair);border-radius:var(--r-lg);padding:26px 34px;display:flex;flex-direction:column;gap:20px;background:var(--surface)}
.dpanel.hl{background:#12211A;border-color:rgba(46,189,131,.32)}
.d-head{display:flex;align-items:center;justify-content:space-between;gap:20px}
.d-name{font-size:34px;font-weight:800;color:var(--text)}
.d-time{font-family:var(--font-en);font-size:var(--type-min);font-weight:700;color:var(--green);white-space:nowrap}
.d-list{display:flex;flex-direction:column;gap:14px;flex:1}
.d-item{display:flex;align-items:baseline;gap:14px;font-size:28px;color:var(--text);font-weight:500;line-height:1.4}
.d-item .dot{width:8px;height:8px;border-radius:2px;background:var(--green);flex:none;transform:translateY(-3px)}
.dpanel:not(.hl) .d-item .dot{background:#6E6E78}
.d-note{font-size:var(--type-min);color:var(--faint);border-top:1px solid var(--hair);padding-top:16px;line-height:1.45}
.d-note b{color:var(--sub)}

/* ============ 三句话卡 ============ */
.sent3{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.sent{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:30px 34px;display:flex;flex-direction:column;gap:18px;min-height:230px}
.sent .s-mark{font-family:var(--font-en);font-size:56px;font-weight:800;color:var(--green);line-height:1}
.sent .s-txt{font-size:30px;font-weight:700;color:var(--text);line-height:1.45}
.sent .s-cap{font-size:var(--type-min);color:var(--faint);margin-top:auto}

/* ============ 连接器地图 ============ */
.cgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.ctile{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-md);padding:20px 22px;display:flex;flex-direction:column;gap:8px;min-height:128px}
.ctile .c-name{font-size:26px;font-weight:700;color:var(--text);line-height:1.25}
.ctile .c-use{font-size:var(--type-min);color:var(--sub);line-height:1.4}
.ctile.hl{border:1.5px solid rgba(46,189,131,.5);background:var(--green-soft)}
.ctile.hl .c-name{color:var(--green)}
.ctile .c-flag{margin-top:auto;font-size:var(--type-min);font-weight:700;color:var(--green);letter-spacing:.08em}
.cr-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cr-item{display:flex;align-items:center;gap:12px;font-size:var(--type-min);color:var(--sub);background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);padding:12px 22px}
.cr-item b{color:var(--text);font-weight:700}

/* ============ 迷你逻辑链（总收页） ============ */
.mini-chain{display:flex;align-items:center;gap:8px;justify-content:center}
.m-ring{width:76px;height:76px;border-radius:50%;background:var(--card);border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:var(--text);flex:none}
.m-arrow{color:var(--green);font-size:24px;font-weight:500}
.chain-card{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:30px 36px;display:flex;flex-direction:column;gap:24px;align-items:center}
.chain-card .cc-cap{font-size:var(--type-min);color:var(--sub);text-align:center;line-height:1.5}
.chain-card .cc-cap b{color:var(--text)}

/* ============ 目标核对行 ============ */
.goal-row{display:flex;align-items:stretch;border-top:1px solid var(--hair);padding-top:26px}
.goal{flex:1;display:flex;flex-direction:column;gap:8px;padding:0 34px;border-left:1px solid var(--hair)}
.goal:first-child{border-left:none;padding-left:0}
.goal .gk{display:flex;align-items:center;gap:10px}
.goal .g-ic{color:var(--green);display:flex;flex:none}
.goal .g-name{font-size:28px;font-weight:800;color:var(--text)}
.goal .g-cap{font-size:var(--type-min);color:var(--sub);line-height:1.4}

/* ============ 结尾页 ============ */
.slide.fin{justify-content:center;align-items:center;text-align:center;gap:40px}
.fin-formula{display:flex;align-items:center;gap:26px;font-size:56px;font-weight:900;color:var(--text);letter-spacing:.06em}
.fin-formula .f-arrow{color:var(--green);font-weight:500;font-size:44px}
.fin-slogan{font-size:76px;font-weight:900;color:var(--green);letter-spacing:.2em;padding-left:.2em}
.fin-next{display:flex;align-items:center;gap:18px}
.fin-logos{display:flex;align-items:center;gap:20px}

/* ============ 全屏按钮 ============ */
#fsBtn{position:fixed;top:22px;right:22px;z-index:999;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#FFFFFF;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}
#fsBtn:hover{background:rgba(255,255,255,.18)}
#fsBtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ============ 既有三页组件（逻辑链 / 时间轴 / 协同） ============ */
.formula{display:flex;align-items:center;gap:20px;font-size:var(--type-subtitle);font-weight:700;color:var(--text)}
.formula .f-arrow{color:var(--green);font-weight:500}
.chain-wrap{flex:1;display:flex;align-items:center;justify-content:center}
.chain{display:flex;align-items:flex-start;justify-content:center;position:relative}
.ring{display:flex;flex-direction:column;align-items:center;gap:20px;width:296px;position:relative}
.ring-circle{width:222px;height:222px;border-radius:50%;background:var(--card);border:1px solid var(--hair);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.ring-circle .r-no{font-family:var(--font-en);font-size:var(--type-min);font-weight:500;color:var(--faint);letter-spacing:.3em}
.ring-circle .r-word{font-size:60px;font-weight:900;color:var(--text);letter-spacing:.06em;line-height:1}
.ring.demo .ring-circle{background:transparent;border:2px dashed #4A4A55}
.ring.demo .ring-circle .r-no{color:#5E5E6A}
.ring.demo .ring-circle .r-word{color:#C2C2CC}
.ring-tag{font-size:var(--type-min);font-weight:700;padding:8px 26px;border-radius:999px;letter-spacing:.12em}
.ring-tag.hands{background:var(--green-cta);color:var(--green-ink)}
.ring-tag.show{background:transparent;color:#B8B8C2;border:2px solid rgba(255,255,255,.26)}
.ring-cap{font-size:var(--type-small);color:var(--sub);line-height:1.5;text-align:center;max-width:270px}
.link{width:64px;height:2px;background:var(--track);margin-top:111px;position:relative;flex:none}
.link::after{content:"";position:absolute;right:-2px;top:50%;transform:translateY(-50%);border-left:10px solid var(--track);border-top:7px solid transparent;border-bottom:7px solid transparent}
.chain-legend{display:flex;align-items:center;justify-content:center;gap:48px;padding-top:6px}
.legend-item{display:flex;align-items:center;gap:14px;font-size:var(--type-min);color:var(--sub)}
.legend-pill{font-size:var(--type-min);font-weight:700;padding:6px 20px;border-radius:999px;letter-spacing:.1em}
.legend-pill.hands{background:var(--green-cta);color:var(--green-ink)}
.legend-pill.show{background:transparent;color:#B8B8C2;border:2px solid rgba(255,255,255,.26)}
.legend-plain{font-size:var(--type-min);color:var(--faint)}
.tl-body{flex:1;display:flex;flex-direction:column;justify-content:center;margin-top:20px}
.tl{position:relative;width:100%}
.tl-ticks{position:relative;height:40px}
.tl-tick{position:absolute;top:0;transform:translateX(-50%);font-family:var(--font-en);font-size:var(--type-min);font-weight:600;color:var(--faint);letter-spacing:.02em}
.tl-gridline{position:absolute;top:40px;bottom:0;width:1px;background:var(--hair)}
.tl-bands{position:relative;height:124px}
.band{position:absolute;top:8px;bottom:8px;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-md);display:flex;align-items:center;gap:20px;padding:0 22px;overflow:hidden}
.band .b-char{font-size:56px;font-weight:900;color:var(--green);line-height:1}
.band .b-info{display:flex;flex-direction:column;gap:6px}
.band .b-name{font-size:26px;font-weight:700;color:var(--text);letter-spacing:.02em;line-height:1.2;white-space:nowrap}
.band .b-time{font-family:var(--font-en);font-size:var(--type-min);font-weight:600;color:var(--faint)}
.band.break{background:repeating-linear-gradient(135deg,var(--bg) 0 10px,var(--card) 10px 20px);justify-content:center;padding:0}
.band.break .b-name{color:var(--faint);letter-spacing:.36em;font-weight:500}
.band-layer{position:absolute;inset:0}
.tl-bar{position:relative;height:72px;margin-top:18px}
.seg{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.seg span{font-size:var(--type-min);font-weight:700;white-space:nowrap;padding:0 6px}
.seg.teach{background:#2E2E36}
.seg.teach span{color:#D9D9E0}
.seg.hands{background:var(--green-cta)}
.seg.hands span{color:var(--green-ink)}
.seg.show{background:#D7D7DE}
.seg.show span{color:#17171B}
.seg.break{background:repeating-linear-gradient(135deg,var(--bg) 0 8px,var(--tile) 8px 16px);border:1px dashed rgba(255,255,255,.18)}
.tl-legend{display:flex;align-items:center;justify-content:flex-end;gap:32px;margin-top:20px}
.sw{width:24px;height:14px;border-radius:4px;flex:none}
.sw.teach{background:#2E2E36;border:1px solid rgba(255,255,255,.1)}
.sw.hands{background:var(--green-cta)}
.sw.show{background:#D7D7DE}
.sw.break{background:repeating-linear-gradient(135deg,var(--bg) 0 5px,var(--tile) 5px 10px);border:1px solid rgba(255,255,255,.15)}
.legend-item .lw{font-size:var(--type-min);color:var(--sub)}
.tl-stats{display:flex;align-items:stretch;margin-top:38px;border-top:1px solid var(--hair);padding-top:30px}
.stat{flex:1;display:flex;flex-direction:column;gap:10px;padding:0 40px;border-left:1px solid var(--hair)}
.stat:first-child{border-left:none;padding-left:0}
.stat .s-num{font-family:var(--font-en);font-size:56px;font-weight:800;color:var(--green);line-height:1}
.stat .s-num .s-unit{font-size:30px;font-weight:700;color:var(--sub);margin-left:6px}
.stat .s-label{font-size:var(--type-min);color:var(--sub);line-height:1.4}
.lockup{display:flex;align-items:center;gap:30px;margin-top:18px}
.lock-end{display:flex;flex-direction:column;gap:10px;min-width:260px}
.lock-end.right{align-items:flex-end}
.lock-stack{display:flex;flex-direction:column;gap:8px}
.lock-stack.right{align-items:flex-end}
.lock-wb-mark{display:flex;align-items:center;gap:12px}
.lock-wb-mark .l-name{font-family:var(--font-en);font-size:52px;font-weight:800;color:var(--text);line-height:1;letter-spacing:.01em}
.lock-line{flex:1;height:2px;background:var(--track);position:relative}
.lock-line::before,.lock-line::after{content:"";position:absolute;top:50%;transform:translateY(-50%);width:9px;height:9px;border-radius:50%;background:var(--track)}
.lock-line::before{left:-3px}
.lock-line::after{right:-3px}
.lock-bridge{display:flex;flex-direction:column;align-items:center;gap:10px;flex:none}
.bridge-chip{font-size:var(--type-min);font-weight:700;color:var(--green);border:1.5px solid rgba(46,189,131,.45);background:var(--green-soft);border-radius:999px;padding:12px 28px;letter-spacing:.08em}
.bridge-cap{font-size:var(--type-min);color:var(--faint)}
.panels{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:28px}
.panel{border:1px solid var(--hair);border-radius:var(--r-lg);padding:28px 36px;display:flex;flex-direction:column;gap:20px;background:var(--surface)}
.panel.ours{background:#12211A;border-color:rgba(46,189,131,.32)}
.p-head{display:flex;align-items:center;justify-content:space-between;gap:20px}
.p-name{font-family:var(--font-en);font-size:38px;font-weight:800;color:var(--text);letter-spacing:.01em}
.p-tag{font-size:var(--type-min);font-weight:700;border-radius:999px;padding:8px 22px;letter-spacing:.1em;white-space:nowrap}
.p-tag.mavens{background:transparent;color:#B8B8C2;border:2px solid rgba(255,255,255,.22)}
.p-tag.ours{background:var(--green-cta);color:var(--green-ink)}
.p-sub{font-size:var(--type-min);color:var(--faint)}
.p-list{display:flex;flex-direction:column;gap:14px}
.p-item{display:flex;align-items:baseline;gap:14px;font-size:28px;color:var(--text);font-weight:500;line-height:1.4}
.p-item .dot{width:8px;height:8px;border-radius:2px;background:var(--green);flex:none;transform:translateY(-3px)}
.panel.mavens-panel .p-item .dot{background:#6E6E78}
.p-note{font-size:var(--type-min);color:var(--faint);border-top:1px solid var(--hair);padding-top:16px}
.quote{margin-top:22px;background:var(--green-cta);border-radius:var(--r-lg);padding:24px 44px;display:flex;align-items:center;gap:28px}
.quote .q-mark{font-size:60px;font-weight:900;color:var(--green-ink);line-height:.6;flex:none;opacity:.55}
.quote .q-text{font-size:30px;font-weight:500;color:var(--green-ink);line-height:1.55}
.quote .q-text .q-em{font-weight:800}

/* ============ 课程结构 · 四模块卡（整改新增） ============ */
.mods{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.mod{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:28px 30px;display:flex;flex-direction:column;gap:14px;min-height:320px}
.mod .m-char{font-size:72px;font-weight:900;color:var(--green);line-height:1}
.mod .m-name{font-size:28px;font-weight:800;color:var(--text)}
.mod .m-cap{font-size:var(--type-min);color:var(--sub);line-height:1.55;flex:1}
.mod .m-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--hair);padding-top:14px;margin-top:auto}
.mod .m-time{font-family:var(--font-en);font-size:var(--type-min);font-weight:600;color:var(--faint)}
.s-tag.outline{color:#B8B8C2;border:2px solid rgba(255,255,255,.26)}

/* ============ 界面导览（整改新增） ============ */
.ui-wrap{display:grid;grid-template-columns:1.08fr 1fr;gap:40px;align-items:stretch}
.uiwin{background:var(--card);border:1px solid var(--hair-strong);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column}
.ui-top{display:flex;align-items:center;gap:8px;padding:14px 20px;background:var(--surface);border-bottom:1px solid var(--hair)}
.ui-dot{width:12px;height:12px;border-radius:50%;background:var(--tile);flex:none}
.ui-url{margin-left:14px;font-family:var(--font-en);font-size:var(--type-min);color:var(--faint);letter-spacing:.06em}
.ui-main{flex:1;display:flex;min-height:0}
.ui-side{width:236px;background:var(--surface);border-right:1px solid var(--hair);padding:16px;display:flex;flex-direction:column;gap:10px}
.ui-sitem{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:var(--r-md);font-size:22px;font-weight:600;color:var(--sub)}
.ui-sitem svg{width:22px;height:22px;flex:none}
.ui-sitem.on{background:var(--green-soft);color:var(--green)}
.ui-sitem.dim{color:var(--faint)}
.ui-no{width:26px;height:26px;border-radius:50%;background:var(--tile);color:var(--green);font-family:var(--font-en);font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.ui-sitem.on .ui-no{background:var(--green-cta);color:var(--green-ink)}
.ui-sitem.dim .ui-no{color:var(--faint)}
.ui-chat{flex:1;padding:22px;display:flex;flex-direction:column;gap:14px;justify-content:center}
.ub{border-radius:14px;padding:14px 18px;font-size:22px;line-height:1.55;max-width:88%}
.ub.user{align-self:flex-end;background:var(--green-cta);color:var(--green-ink);font-weight:600}
.ub.ai{align-self:flex-start;background:var(--surface);border:1px solid var(--hair);color:var(--sub)}
.ub.ai b{color:var(--green)}

/* ============ 扫码连接页（19） ============ */
.qr-fin{gap:34px}
.qr-headline{font-size:60px;font-weight:900;color:var(--text);letter-spacing:.06em}
.qr-headline em{font-style:normal;color:var(--green)}
.qr-wrap{display:flex;align-items:center;gap:72px;text-align:left}
.qr-card{background:#FFFFFF;border-radius:24px;padding:24px 24px 20px;display:flex;flex-direction:column;align-items:center;gap:14px;box-shadow:0 24px 90px rgba(52,211,153,.16),0 4px 18px rgba(0,0,0,.5)}
.qr-card img{width:296px;height:296px;object-fit:contain;display:block}
.qr-hint{color:#0B0B0C;font-size:21px;font-weight:800;letter-spacing:.1em}
.qr-offer{display:flex;flex-direction:column;gap:30px;max-width:780px}
.q-item{display:flex;gap:22px;align-items:flex-start}
.q-ic{flex:0 0 auto;width:48px;height:48px;border-radius:14px;background:var(--green-soft);color:var(--green);font:800 19px/48px var(--font-en);text-align:center}
.q-item b{display:block;font-size:33px;color:var(--text);font-weight:900;letter-spacing:.02em}
.q-item i{display:block;font-style:normal;font-size:22px;color:var(--sub);margin-top:8px;line-height:1.4}
.qr-cta{display:flex;align-items:center;gap:16px}
.qr-cta .dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 6px var(--green-soft)}
.qr-cta .say{font-size:24px;color:var(--sub);letter-spacing:.04em}