:root{
  --cream:#FBF7F1; --paper:#FFFDF9; --ink:#221A14; --muted:#5C4F44; --faint:#8A7B6E;
  --orange:#EE5F27; --line:rgba(34,26,20,.12); --line2:rgba(34,26,20,.07);
  --wx:#07C160; --wxb:#95EC69; --wxbg:#EDEDED; --wxbar:#F7F7F7;
  --wecom:#0082EF; --rose:#E6337A; --rose-soft:#FCE7F0;
  --serif:"Noto Serif SC","Songti SC","SimSun",serif;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:#E7E3DD;font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;overflow:hidden}
.stagewrap{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center}
.stage{width:1600px;height:960px;background:var(--cream);display:flex;flex-direction:column;transform-origin:center center;box-shadow:0 24px 70px -30px rgba(0,0,0,.45);position:relative;overflow:hidden}

/* ---------- 顶栏 ---------- */
.hd{height:84px;flex:none;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:20px;padding:0 34px;background:var(--paper)}
.hd .brand{font-family:var(--serif);font-size:20px;font-weight:900;white-space:nowrap}
.hd .brand em{font-style:normal;color:var(--orange)}
.hd .sub{font-size:11.5px;color:var(--faint);white-space:nowrap}
.acts{display:flex;gap:6px;margin-left:auto;align-items:center}
.acts button{font-size:11.5px;font-weight:700;border:1px solid var(--line);background:#fff;border-radius:6px;padding:6px 11px;color:var(--muted);cursor:pointer;font-family:var(--font)}
.acts button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.actnav{display:flex;gap:5px;align-items:center}
.actnav button{font-size:11.5px;font-weight:800;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 13px;color:var(--muted);cursor:pointer;font-family:var(--font)}
.actnav button.on{background:#FDEAE0;border-color:var(--orange);color:var(--orange)}

/* ---------- 幻灯片 ---------- */
.slides{flex:1;position:relative;min-height:0}
.slide{position:absolute;inset:0;display:none;grid-template-columns:585px 1fr;gap:28px;padding:30px 34px 24px}
.slide.on{display:grid}
.copy{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.kicker{font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--orange);margin-bottom:12px}
.copy h2{font-family:var(--serif);font-size:31px;font-weight:900;line-height:1.36;text-wrap:pretty;margin-bottom:12px}
.copy .lead{font-size:13.5px;color:var(--muted);line-height:1.8;text-wrap:pretty}
.flow{list-style:none;display:flex;gap:7px;margin:16px 0;flex-wrap:wrap}
.flow li{font-size:11px;font-weight:800;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 11px;color:var(--muted)}
.flow li b{color:var(--orange);margin-right:5px}
.trio{margin-top:auto;border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:9px}
.trio div{display:flex;gap:10px;align-items:baseline}
.trio span{font-size:10px;font-weight:900;letter-spacing:.06em;color:var(--faint);min-width:86px;flex:none}
.trio p{font-size:12px;color:var(--ink);line-height:1.6;text-wrap:pretty}
.stamp{font-size:10.5px;color:var(--faint);margin-top:12px}
.visual{display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden;background:#F3EFE9;border:1px solid var(--line);border-radius:14px}
.device{flex:none;transform-origin:center center}
.device.wx{width:430px;height:932px;transform:scale(.88)}
.device.wb{width:1200px;height:1010px;transform:scale(.78)}
.device.wx .screen,.device.wx .wscreen{width:430px;height:932px}

/* ---------- 页脚 ---------- */
.ft{height:66px;flex:none;border-top:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 34px;background:var(--paper)}
.ft .prog{flex:1;height:4px;background:#EFE8DE;border-radius:4px;overflow:hidden}
.ft .prog i{display:block;height:100%;background:var(--orange);width:5.9%}
.ft .cnt{font-family:var(--serif);font-size:16px;font-weight:900;min-width:62px}
.ft .nx{font-size:11.5px;color:var(--faint);min-width:190px;text-align:right}
.ft button{font-size:12px;font-weight:800;border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 15px;cursor:pointer;font-family:var(--font)}
.ft button.pri{background:var(--orange);color:#fff;border-color:var(--orange)}

/* ---------- 目录弹窗 ---------- */
.mask{position:absolute;inset:0;background:rgba(34,26,20,.55);display:none;align-items:center;justify-content:center;z-index:20}
.mask.on{display:flex}
.dlg{width:960px;max-height:780px;overflow:auto;background:var(--paper);border-radius:16px;padding:26px 30px}
.dlg h3{font-family:var(--serif);font-size:22px;font-weight:900;margin-bottom:4px}
.dlg .hint{font-size:11.5px;color:var(--faint);margin-bottom:18px}
.dlg .grp{margin-bottom:16px}
.dlg .grp b{font-size:11px;letter-spacing:.08em;color:var(--orange);display:block;margin-bottom:8px}
.dlg .grp div{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.dlg button{text-align:left;font-size:12px;border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 11px;cursor:pointer;color:var(--muted);font-family:var(--font)}
.dlg button.cur{border-color:var(--orange);color:var(--orange);font-weight:900}
.dlg .close{float:right;background:var(--ink);color:#fff;border:0;border-radius:7px;padding:7px 14px;font-size:12px;cursor:pointer}

/* ============ 微信通用 ============ */
.wscreen{background:#fff;display:flex;flex-direction:column;overflow:hidden;position:relative}
.status{height:48px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 26px 0 30px;background:var(--wxbar);font-size:16px;font-weight:700}
.status .right{display:flex;align-items:center;gap:7px}
.mute{width:14px;height:14px;position:relative;display:inline-block}
.mute:before{content:"";position:absolute;left:2.5px;top:1px;width:9px;height:10px;border:1.5px solid #191919;border-radius:5px 5px 2px 2px}
.mute:after{content:"";position:absolute;left:-1px;top:5.5px;width:16px;height:1.6px;background:#191919;transform:rotate(-45deg);border-radius:1px}
.signal{display:flex;align-items:flex-end;gap:1.6px;height:12px}
.signal i{width:3px;background:#191919;border-radius:1px;display:block}
.signal i:nth-child(1){height:4px}.signal i:nth-child(2){height:6px}.signal i:nth-child(3){height:9px}.signal i:nth-child(4){height:12px}
.wifi{width:16px;height:12px;position:relative;overflow:hidden}
.wifi:before{content:"";position:absolute;left:1px;top:0;width:14px;height:14px;border:2.4px solid #191919;border-radius:50%;clip-path:polygon(0 0,100% 0,100% 45%,0 45%)}
.wifi:after{content:"";position:absolute;left:6px;top:7px;width:4px;height:4px;background:#191919;border-radius:50%}
.battery{display:flex;align-items:center;gap:2px}
.battery .shell{width:25px;height:13px;border:1.5px solid rgba(25,25,25,.55);border-radius:4px;padding:1.5px}
.battery .shell i{display:block;height:100%;width:76%;background:#191919;border-radius:2px}
.battery .tip{width:2px;height:5px;background:rgba(25,25,25,.4);border-radius:0 2px 2px 0}
.battery .pct{font-size:14px;font-weight:600}
.nav{height:48px;flex:none;background:var(--wxbar);display:flex;align-items:center;justify-content:center;position:relative;border-bottom:.5px solid rgba(0,0,0,.06)}
.nav .title{font-size:17px;font-weight:600}
.nav .back{position:absolute;left:20px;top:12px;width:13px;height:13px;border-left:2px solid #191919;border-bottom:2px solid #191919;transform:rotate(45deg);border-radius:1px}
.nav .tools{position:absolute;right:18px;top:12px;display:flex;gap:15px;align-items:center;height:24px}
.search{width:17px;height:17px;border:2px solid #191919;border-radius:50%;position:relative;display:block}
.search:after{content:"";position:absolute;right:-5px;bottom:-3px;width:8px;height:2px;background:#191919;transform:rotate(45deg);border-radius:2px}
.plus{width:19px;height:19px;border:2px solid #191919;border-radius:50%;position:relative;display:block}
.plus:before,.plus:after{content:"";position:absolute;background:#191919;border-radius:1px}
.plus:before{left:7px;top:2.5px;width:2px;height:10px}
.plus:after{left:2.5px;top:7px;width:10px;height:2px}
.dots{font-size:19px;font-weight:700;letter-spacing:1px;line-height:1}
.person{width:19px;height:19px;position:relative;display:block}
.person:before{content:"";position:absolute;left:6px;top:1px;width:7px;height:7px;border:1.8px solid #191919;border-radius:50%}
.person:after{content:"";position:absolute;left:2px;top:10px;width:15px;height:9px;border:1.8px solid #191919;border-radius:8px 8px 3px 3px}
.homebar{position:absolute;left:0;right:0;bottom:0;height:5px;width:134px;margin:0 auto;background:#000;opacity:.75;border-radius:3px 3px 0 0}

/* 服务号资料页 */
.profile{flex:1;background:#fff;display:flex;flex-direction:column;overflow:hidden}
.pbody{padding:22px 24px 0;flex:none}
.prow{display:flex;gap:14px;align-items:flex-start}
.plogo{width:68px;height:68px;border-radius:13px;flex:none;background:linear-gradient(135deg,#FF8A4C 0%,#EE5F27 45%,#D94E86 100%);position:relative;overflow:hidden}
.plogo:before{content:"叶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--serif);font-size:34px;font-weight:900}
.pname{font-size:22px;font-weight:700;line-height:1.35;display:flex;align-items:center;gap:7px}
.vblue{width:16px;height:16px;background:#4A90D9;border-radius:50%;position:relative;display:inline-block;flex:none}
.vblue:after{content:"";position:absolute;left:4.5px;top:4.5px;width:6px;height:3.5px;border-left:1.6px solid #fff;border-bottom:1.6px solid #fff;transform:rotate(-45deg)}
.pcompany{font-size:14px;color:#4A4A4A;margin-top:5px;display:flex;align-items:center;gap:6px}
.pregion{font-size:13px;color:#9A9A9A;margin-top:5px}
.pintro{font-size:15px;line-height:1.68;color:#2B2B2B;margin-top:20px;text-wrap:pretty}
.pintro .b{color:#5B7FBD}
.pfriends{font-size:13px;color:#9A9A9A;margin-top:10px}
.pbtns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.pbtns div{height:48px;background:#F2F2F2;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:16px;color:#2B2B2B;font-weight:500}
.ptabs{height:50px;display:flex;gap:26px;align-items:center;padding:0 24px;border-bottom:.5px solid #E5E5E5;margin-top:18px;flex:none}
.ptabs b{font-size:16px;font-weight:600;position:relative;padding-bottom:12px}
.ptabs b.on:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.5px;background:#191919;border-radius:2px}
.ptabs span{font-size:16px;color:#9A9A9A}
.pfeed{flex:1;background:#F5F5F7;padding:14px 16px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.pfeed .fi{background:#fff;border-radius:8px;padding:12px 13px;display:flex;gap:10px;align-items:center}
.pfeed .fi .ic{width:46px;height:46px;border-radius:7px;background:linear-gradient(135deg,#F6E7D6,#EAD8C3);flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:17px;color:#8A5A2B}
.pfeed .fi b{font-size:14px;font-weight:600;display:block;line-height:1.5}
.pfeed .fi span{font-size:11.5px;color:#9A9A9A;display:block;margin-top:3px}

/* 服务号会话 */
.convo{flex:1;background:var(--wxbg);padding:18px 14px;display:flex;flex-direction:column;gap:15px;overflow:hidden}
.ctime{align-self:center;font-size:12px;color:#A8A8A8;flex:none}
.crow{display:flex;gap:10px;align-items:flex-start;flex:none}
.crow.me{flex-direction:row-reverse}
.cav{width:42px;height:42px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:18px;font-weight:900;color:#fff;background:linear-gradient(135deg,#FF8A4C,#D94E86)}
.cav.usr{background:#C9C2B8;color:#5C554E;font-family:var(--font);font-size:14px}
.cbub{max-width:290px;position:relative;font-size:15px;line-height:1.62;padding:11px 13px;border-radius:6px;background:#fff;color:#191919;text-wrap:pretty}
.cbub:after{content:"";position:absolute;left:-5px;top:14px;border:5px solid transparent;border-right-color:#fff;border-left:0}
.crow.me .cbub{background:var(--wxb)}
.crow.me .cbub:after{left:auto;right:-5px;border:5px solid transparent;border-left-color:var(--wxb);border-right:0}
.cbub b{color:#0B7A43}
.cbub .q{color:#5B7FBD}
.article{background:#fff;border-radius:6px;overflow:hidden;flex:none}
.article .a1{padding:10px 12px;font-size:14px;font-weight:600;line-height:1.55}
.article .a2{display:flex;gap:9px;padding:0 12px 10px;align-items:center}
.article .a2 .tx{font-size:12px;color:#9A9A9A;line-height:1.6;flex:1}
.article .a2 .im{width:52px;height:52px;border-radius:5px;background:linear-gradient(135deg,#F6E7D6,#EAD8C3);flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:19px;color:#8A5A2B}
.article .af{border-top:.5px solid #F0F0F0;padding:6px 12px;font-size:11px;color:#A0A0A0}
.notice{background:#fff;border-radius:6px;padding:12px 13px;font-size:13.5px;line-height:1.6;flex:none}
.notice .nt{font-size:14px;font-weight:600;padding-bottom:8px;border-bottom:.5px solid #EEE;margin-bottom:8px}
.notice .nl{display:flex;justify-content:space-between;color:#8A8A8A;padding:3px 0}
.notice .nl b{color:#4A4A4A;font-weight:500}
.notice .nf{border-top:.5px solid #EEE;margin-top:8px;padding-top:8px;color:var(--wx);font-weight:500;display:flex;justify-content:space-between}
.cfoot{height:92px;flex:none;background:var(--wxbar);border-top:.5px solid #DDD;display:flex}
.ckey{width:64px;flex:none;display:flex;align-items:center;justify-content:center}
.ckey i{width:29px;height:29px;border:1.8px solid #4A4A4A;border-radius:50%;display:flex;align-items:center;justify-content:center}
.ckey i:before{content:"";width:13px;height:11px;background:radial-gradient(circle at 2px 2px,#4A4A4A 1.3px,transparent 1.6px) 0 0/4px 4px;display:block}
.cmenu{flex:1;display:grid;grid-template-columns:repeat(3,1fr)}
.cmenu div{display:flex;align-items:center;justify-content:center;gap:6px;font-size:15px;color:#2B2B2B;border-left:.5px solid #E0E0E0}
.cmenu .lnk{width:13px;height:13px;border:1.4px solid #9A9A9A;border-radius:3px;position:relative;display:block}
.cmenu .lnk:after{content:"";position:absolute;right:-3px;top:-3px;width:6px;height:6px;border-top:1.4px solid #9A9A9A;border-right:1.4px solid #9A9A9A;transform:rotate(45deg)}
.cmenu .bars{display:flex;flex-direction:column;gap:2px}
.cmenu .bars i{width:12px;height:1.4px;background:#9A9A9A;display:block}
.wxinput{height:44px;flex:none;background:var(--wxbar);display:flex;align-items:center;gap:9px;padding:0 11px;border-top:.5px solid #E3E3E3}
.wxinput .ico{width:22px;height:22px;border:1.5px solid #5A5A5A;border-radius:50%;flex:none}
.wxinput .field{flex:1;height:30px;background:#fff;border-radius:5px;border:1px solid #E6E6E6}
.wxinput .pl{font-size:22px;color:#5A5A5A;line-height:1}
.wxmenu{height:40px;flex:none;background:var(--wxbar);border-top:.5px solid #E3E3E3;display:grid;grid-template-columns:repeat(3,1fr)}
.wxmenu div{display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:600;color:#3A3A3A;border-right:.5px solid #E3E3E3}
.wxmenu div:last-child{border-right:0}
.wxmenu div i{width:11px;height:11px;border:1.3px solid #6A625A;border-radius:2px;display:block}

/* 聊天列表 */
.list{flex:1;background:#fff;display:flex;flex-direction:column;overflow:hidden}
.lrow{height:78px;flex:none;display:flex;align-items:center;gap:12px;padding:0 16px 0 14px;position:relative}
.lrow:after{content:"";position:absolute;left:84px;right:0;bottom:0;height:.5px;background:#E5E5E5}
.lrow .ava{width:54px;height:54px;border-radius:7px;flex:none;display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:700;color:#fff;position:relative}
.lrow .ava i{position:absolute;right:-3px;top:-3px;width:9px;height:9px;background:#FA5151;border-radius:50%;border:1.5px solid #fff;z-index:2}
.lrow .mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.lrow .mid b{font-size:16px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrow .mid span{font-size:14px;color:#9A9A9A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrow .rt{width:74px;flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.lrow .rt em{font-size:12px;font-style:normal;color:#B7B7B7}
.bell{width:11px;height:11px;border:1.3px solid #C4C4C4;border-radius:50%;display:block}
.tabbar{height:82px;flex:none;background:linear-gradient(180deg,#F7F7F7 60%,#E8F3EC 100%);border-top:.5px solid #DEDEDE;display:grid;grid-template-columns:repeat(4,1fr);padding-bottom:22px;position:relative}
.tabbar .tb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;color:#7A7A7A;position:relative}
.tabbar .tb.on{color:var(--wx)}
.tabbar .tb i{width:24px;height:24px;display:block;position:relative}
.tabbar .tb i:before,.tabbar .tb i:after{content:"";position:absolute;display:block}
.tabbar .tb i.wxchat:before{left:0;top:1px;width:18px;height:14px;border:2px solid #7A7A7A;border-radius:9px 9px 9px 3px}
.tabbar .tb i.wxchat:after{right:0;bottom:1px;width:15px;height:12px;border:2px solid #7A7A7A;border-radius:7px 7px 3px 7px;background:#F7F7F7}
.tabbar .tb.on i.wxchat:before,.tabbar .tb.on i.wxchat:after{border-color:var(--wx);background:var(--wx)}
.tabbar .tb i.human:before{left:8px;top:2px;width:8px;height:8px;border:1.8px solid #7A7A7A;border-radius:50%}
.tabbar .tb i.human:after{left:3px;top:12px;width:18px;height:10px;border:1.8px solid #7A7A7A;border-radius:9px 9px 3px 3px}
.tabbar .tb i.compass:before{left:1px;top:1px;width:20px;height:20px;border:1.8px solid #7A7A7A;border-radius:50%}
.tabbar .tb i.compass:after{left:10px;top:5px;width:4px;height:12px;border:1.6px solid #7A7A7A;transform:rotate(45deg);border-radius:2px}
.tabbar .tb .rd{position:absolute;right:24px;top:8px;width:7px;height:7px;background:#FA5151;border-radius:50%}

/* 小程序 */
.minibar{height:48px;flex:none;background:#fff;display:flex;align-items:center;justify-content:center;position:relative;border-bottom:.5px solid #F0F0F0}
.minibar .mt{font-size:16px;font-weight:600}
.capsule{position:absolute;right:10px;top:10px;width:78px;height:29px;border:1px solid rgba(0,0,0,.1);border-radius:16px;background:#fff;display:flex;align-items:center;justify-content:space-around;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.capsule .dots{font-size:13px;font-weight:900;letter-spacing:1px;line-height:1}
.capsule .sep{width:1px;height:15px;background:rgba(0,0,0,.12)}
.capsule .ring{width:13px;height:13px;border:1.5px solid #191919;border-radius:50%;position:relative}
.capsule .ring:after{content:"";position:absolute;inset:3px;border-radius:50%;background:#191919}
.minibody{flex:1;background:#F6F7F9;padding:12px;display:flex;flex-direction:column;gap:9px;overflow:hidden}
.mcard{background:#fff;border-radius:10px;padding:12px 13px;flex:none}
.mcard h4{font-size:14px;font-weight:700;line-height:1.5;margin-bottom:6px}
.mcard p{font-size:12px;color:#8A8A8A;line-height:1.65;text-wrap:pretty}
.mrow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-bottom:.5px solid #F2F2F2;font-size:12.5px}
.mrow:last-child{border-bottom:0}
.mtag{font-size:10px;font-weight:800;color:var(--orange);background:#FDEAE0;border-radius:4px;padding:2px 7px;white-space:nowrap}
.mbtn{background:var(--wx);color:#fff;font-size:14px;font-weight:600;text-align:center;border-radius:8px;padding:11px;flex:none}
.mbtn.o{background:var(--orange)}
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;flex:none}
.mgrid div{background:#fff;border-radius:9px;padding:11px 9px;font-size:12.5px;font-weight:600;text-align:center;line-height:1.45}
.mgrid div small{display:block;font-size:10.5px;color:#9A9A9A;font-weight:400;margin-top:3px}
.mgrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;flex:none}
.mgrid3 div{background:#fff;border-radius:9px;padding:11px 5px;font-size:11.5px;font-weight:600;text-align:center;line-height:1.45}
.step{display:flex;gap:6px;flex:none}
.step span{flex:1;background:#fff;border-radius:8px;padding:9px 4px;text-align:center;font-size:11px;font-weight:600;line-height:1.4}
.step span.on{background:#E8F8EE;color:#087A3F}
.price{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid #EEE;border-radius:8px;padding:9px 11px;font-size:13px;flex:none}
.price b{color:var(--orange);font-size:15px}
.price.rec{border-color:var(--orange);background:#FFF7F1}
.minitab{height:54px;flex:none;background:#fff;border-top:.5px solid #EEE;display:grid;grid-template-columns:repeat(4,1fr)}
.minitab div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;color:#9A9A9A}
.minitab div i{width:15px;height:15px;border:1.5px solid #9A9A9A;border-radius:4px;display:block}
.minitab div.on{color:var(--wx);font-weight:700}
.minitab div.on i{border-color:var(--wx);background:var(--wx)}
.mhero{background:linear-gradient(120deg,#FFF1DE,#FDE9E3);border-radius:10px;padding:14px;flex:none}
.mhero b{font-size:16px;font-weight:700;display:block}
.mhero span{font-size:12px;color:#8A7B6E;display:block;margin-top:4px}

/* 企业微信 */
.wcbar{height:48px;flex:none;background:#fff;border-bottom:.5px solid #E9EDF2;display:flex;align-items:center;padding:0 14px}
.wcbar .cn{font-size:16px;font-weight:600;flex:1}
.wcbar .ci{font-size:18px;color:var(--wecom);font-weight:700}
.wcbody{flex:1;background:#F4F6F9;padding:12px;display:flex;flex-direction:column;gap:9px;overflow:hidden}
.wctitle{font-size:11px;font-weight:800;color:#8A929B;letter-spacing:.04em;flex:none}
.wcitem{background:#fff;border-radius:9px;padding:11px 12px;display:flex;gap:10px;align-items:flex-start;flex:none}
.wcitem .ca{width:30px;height:30px;border-radius:7px;background:#E8F2FE;color:var(--wecom);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex:none}
.wcitem .ct{flex:1}
.wcitem .ct b{font-size:13px;font-weight:700;display:block;line-height:1.5}
.wcitem .ct span{font-size:11.5px;color:#8A929B;line-height:1.6;display:block;text-wrap:pretty}
.wcitem .ct em{font-style:normal;font-size:11px;color:var(--wecom);font-weight:700}
.wcgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:none}
.wcgrid div{background:#fff;border-radius:9px;padding:11px 5px;text-align:center;font-size:11.5px;font-weight:700;color:#4A5560}
.wcgrid div i{width:20px;height:20px;border-radius:5px;background:#E8F2FE;display:block;margin:0 auto 6px}
.wctab{height:54px;flex:none;background:#fff;border-top:.5px solid #E9EDF2;display:grid;grid-template-columns:repeat(4,1fr)}
.wctab div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;color:#9AA3AC}
.wctab div i{width:14px;height:14px;border:1.5px solid #9AA3AC;border-radius:4px;display:block}
.wctab div.on{color:var(--wecom);font-weight:700}
.wctab div.on i{border-color:var(--wecom);background:var(--wecom)}

/* ============ 万相大师后台（对标 4 张实图） ============ */
.wb{background:#FBF8F3;display:flex;overflow:hidden;font-family:var(--font)}
.wbicon{width:52px;flex:none;background:#fff;border-right:1px solid #EDE7DE;display:flex;flex-direction:column;align-items:center;padding:14px 0;gap:22px}
.wblogo{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#FF8A4C,#E6337A);position:relative;flex:none}
.wblogo:before{content:"";position:absolute;left:8px;top:9px;width:9px;height:15px;background:rgba(255,255,255,.92);transform:skewY(-18deg)}
.wblogo:after{content:"";position:absolute;right:8px;top:9px;width:9px;height:15px;background:rgba(255,255,255,.75);transform:skewY(18deg)}
.wblogo small{position:absolute;left:4px;bottom:-13px;font-size:7px;color:#8A7B6E;letter-spacing:.05em}
.wbicon .ic{width:18px;height:18px;border:1.6px solid #9A8E80;border-radius:4px;display:block}
.wbicon .ic.rd{border-radius:50%}
.wbicon .sp{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:12px}
.wbicon .usr{width:28px;height:28px;border-radius:50%;background:#E9DFD2}
.wbicon .gear{width:18px;height:18px;border:1.6px solid #9A8E80;border-radius:50%}
.wbmenu{width:212px;flex:none;background:#FBF8F3;border-right:1px solid #EDE7DE;padding:18px 12px;display:flex;flex-direction:column;gap:3px}
.wbmenu .h{font-size:15px;font-weight:800;padding:0 10px 2px}
.wbmenu .hs{font-size:10.5px;color:#A0958A;padding:0 10px 14px}
.wbmenu .mi{font-size:12.5px;color:#5C5146;padding:9px 10px;border-radius:7px;display:flex;align-items:center;gap:8px}
.wbmenu .mi.on{background:#FCE7F0;color:var(--rose);font-weight:800}
.wbmenu .mi i{width:14px;height:14px;border:1.4px solid currentColor;border-radius:3px;flex:none;opacity:.65}
.wbmenu .mi b{margin-left:auto;font-size:10.5px;background:#EFE8DE;border-radius:999px;padding:1px 6px;color:#8A7B6E}
.wbmain{flex:1;padding:20px 26px;overflow:hidden;display:flex;flex-direction:column;gap:14px;min-width:0}
.wbtop{display:flex;align-items:flex-start;gap:10px}
.wbtop h3{font-size:19px;font-weight:800;line-height:1.35}
.wbtop p{font-size:11px;color:#A0958A;margin-top:3px}
.wbtop .right{margin-left:auto;font-size:12px;color:var(--rose);font-weight:700}
.wbsec{font-size:9.5px;letter-spacing:.1em;color:#B0A498;font-weight:800}
.wbsec b{display:block;font-size:18px;font-weight:800;color:#2B231C;letter-spacing:0;margin-top:3px}
.wbdesc{font-size:11px;color:#8A7F73;line-height:1.6}
.wbcards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.wbcards.two{grid-template-columns:repeat(2,1fr)}
.wbcard{background:#fff;border:1px solid #EDE7DE;border-radius:9px;padding:13px 14px}
.wbcard .lb{font-size:11px;color:#7A6E62;display:flex;align-items:center;gap:6px}
.wbcard .lb i{width:14px;height:14px;border:1.4px solid var(--rose);border-radius:3px;display:block}
.wbcard .vl{font-family:var(--font);font-size:24px;font-weight:800;letter-spacing:-.3px;color:#2B231C;margin:7px 0 4px;line-height:1.2}
.wbcard .sb{font-size:10px;color:#A0958A;line-height:1.5}
.wbcard .bar{height:5px;background:#EFE8DE;border-radius:4px;margin-top:9px;overflow:hidden}
.wbcard .bar i{display:block;height:100%;background:var(--rose);width:12%}
.wbassets{background:#fff;border:1px solid #EDE7DE;border-radius:9px;display:grid;grid-template-columns:repeat(4,1fr)}
.wbassets div{padding:13px 14px;border-right:1px solid #F0EBE4;font-size:11.5px;color:#7A6E62;display:flex;justify-content:space-between;align-items:center}
.wbassets div:last-child{border-right:0}
.wbassets div b{font-size:16px;color:#2B231C}
.wbtable{background:#fff;border:1px solid #EDE7DE;border-radius:9px;overflow:hidden;flex:none}
.wbtr{display:grid;border-bottom:1px solid #F2EDE6;align-items:center}
.wbtr:last-child{border-bottom:0}
.wbtr.hd{background:#F7F2EA;font-size:10.5px;color:#8A7F73;font-weight:800}
.wbtr span{padding:9px 11px;font-size:11.5px;color:#5C5146;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wbtr .op{color:var(--rose);font-weight:700}
.wbtr .nm{display:flex;align-items:center;gap:8px}
.wbtr .nm i{width:26px;height:26px;border-radius:6px;background:linear-gradient(135deg,#FF8A4C,#E6337A);flex:none}
.wbtr .nm em{font-style:normal;font-size:9.5px;color:#A0958A;display:block}
.wbtr .st{font-size:10.5px;color:#5B8F6B}
.wbtr .st.off{color:#B0A498}
.wbfoot{font-size:10.5px;color:#A0958A;line-height:1.6}
.wbbtn{background:var(--rose);color:#fff;font-size:12px;font-weight:700;border-radius:6px;padding:8px 14px;white-space:nowrap}
.wbbtn.gh{background:#fff;color:#5C5146;border:1px solid #E5DED4}
.wbrow{display:flex;gap:9px;align-items:center}
.wbsearch{flex:1;height:34px;background:#fff;border:1px solid #E5DED4;border-radius:6px;padding:0 11px;font-size:11.5px;color:#A0958A;display:flex;align-items:center}
.wbnote{font-size:10.5px;color:#8A7F73;background:#FFF6EC;border-left:2px solid var(--orange);padding:8px 11px;border-radius:0 6px 6px 0;line-height:1.6}
.wbsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;border-top:1px solid #EDE7DE;padding-top:12px;margin-top:auto}
.wbsteps div{font-size:11px;color:#A0958A;text-align:center}
.wbsteps div.on{color:var(--rose);font-weight:800}
.wbhero{display:grid;grid-template-columns:1fr 1fr;gap:20px;flex:1;align-items:center}
.wbhero .big{font-family:var(--serif);font-size:34px;font-weight:900;line-height:1.35}
.wbhero .k{font-size:11px;font-weight:800;color:var(--rose);letter-spacing:.08em;margin-bottom:12px}
.wbhero .d{font-size:12.5px;color:#6B6055;line-height:1.75;margin-top:12px;text-wrap:pretty}
.wbhero .ck{font-size:12px;color:#4A423A;margin-top:9px;display:flex;gap:7px;align-items:center}
.wbhero .ck i{color:var(--rose);font-style:normal}
.wbhero .btns{display:flex;gap:9px;margin-top:18px}
.wbillus{height:230px;border-radius:14px;background:linear-gradient(135deg,#F3EDE4,#FCE7F0);position:relative;overflow:hidden}
.wbillus .p1{position:absolute;left:14%;top:20%;width:52%;height:58%;background:#fff;border-radius:10px;box-shadow:0 12px 30px -18px rgba(0,0,0,.3);padding:14px;display:flex;flex-direction:column;gap:8px}
.wbillus .p1 i{height:9px;background:#EFE8DE;border-radius:3px;display:block}
.wbillus .p1 i:nth-child(2){width:70%}.wbillus .p1 i:nth-child(3){width:85%}
.wbillus .p2{position:absolute;right:10%;bottom:12%;width:24%;height:56%;background:#fff;border:5px solid #E9E0D4;border-radius:14px;box-shadow:0 12px 30px -18px rgba(0,0,0,.3)}

/* ============ 单页导出 ============ */
body.export{background:#fff;overflow:visible}
body.export .stagewrap{width:auto;height:auto;display:block}
body.export .stage{width:auto;height:auto;transform:none!important;box-shadow:none;overflow:visible}
body.export .hd,body.export .ft,body.export .actnav,body.export .copy,body.export .mask{display:none!important}
body.export .slides{position:static;height:auto}
body.export .slide{display:none!important}
body.export .slide.on{display:block!important;position:static;padding:0}
body.export .visual{width:auto;height:auto;border:0;border-radius:0;background:#fff;overflow:visible;display:block}
body.export .device{transform:none!important}


/* ===== V4 增补：按 showcase 案例开发指导 ===== */
:root{--sage:#6E9C83;--sky:#7E9CB8;--gold:#C68B2C}
.copy h2{font-size:29px}
.cap{font-size:11.5px;color:var(--faint);border-top:1px solid var(--line);padding-top:11px;margin-top:12px;line-height:1.7;text-wrap:pretty}
.cap b{color:var(--ink);font-weight:800}
.point{margin-top:auto;background:#FFF6EC;border-left:3px solid var(--orange);padding:11px 14px;border-radius:0 10px 10px 0;font-size:12px;line-height:1.7;color:var(--muted)}
.point b{color:var(--ink)}
.stamp{margin-top:9px !important}
.visual.hero{padding:0;position:relative;overflow:hidden;background:#F6EFE4}
.visual.hero img{width:100%;height:100%;object-fit:cover;display:block}
.visual.hero .ov{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,rgba(34,26,20,.72),transparent);color:#fff;padding:26px 28px 20px}
.visual.hero .ov b{font-family:var(--serif);font-size:22px;font-weight:900;display:block;line-height:1.4}
.visual.hero .ov span{font-size:12px;opacity:.9}
.visual.plain{background:#FFFDF9;padding:24px;display:block;overflow:auto}
.visual.plain::-webkit-scrollbar{width:6px}.visual.plain::-webkit-scrollbar-thumb{background:#DDD3C6;border-radius:3px}
.icrow{display:flex;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.ic{width:54px;height:54px;flex:none}
.path{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:16px 0 20px}
.path .pn{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-size:12px;font-weight:800;display:flex;align-items:center;gap:8px}
.path .pn svg{width:22px;height:22px}
.path .ar{color:var(--orange);font-weight:900}
.tbl4{width:100%;border-collapse:collapse;font-size:12px;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.tbl4 th{background:#F7F1E9;font-size:10.5px;letter-spacing:.04em;padding:9px 10px;text-align:left;color:var(--faint)}
.tbl4 td{padding:9px 10px;border-top:1px solid var(--line2);vertical-align:top;line-height:1.6;color:var(--muted)}
.tbl4 td b{color:var(--ink)}
.tbl4 tr.hl td{background:#FFF6EC}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0}
.c3{background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 16px}
.c3 .k{font-size:10px;font-weight:900;letter-spacing:.08em;color:var(--orange)}
.c3 h4{font-size:15px;margin:7px 0;font-family:var(--serif);font-weight:900}
.c3 p{font-size:11.5px;line-height:1.7}
.c3 .pr{font-family:var(--font);font-size:20px;font-weight:800;color:var(--orange-d);margin-top:9px}
.c3 .pr small{font-size:10px;color:var(--faint);font-weight:500}
.cpn{background:#fff;border:1px dashed var(--orange);border-radius:12px;padding:16px;display:flex;justify-content:space-between;align-items:center;gap:14px;margin:14px 0}
.cpn .l b{font-family:var(--serif);font-size:19px;font-weight:900;display:block}
.cpn .l span{font-size:11.5px;color:var(--muted)}
.cpn .r{text-align:right;flex:none}
.cpn .r b{font-family:var(--font);font-size:26px;font-weight:800;color:var(--orange-d)}
.cpn .r span{font-size:10.5px;color:var(--faint);display:block}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.cmp div{background:#fff;border:1px solid var(--line);border-radius:10px;padding:13px 15px}
.cmp div small{font-size:10.5px;color:var(--faint);display:block}
.cmp div b{font-family:var(--font);font-size:22px;font-weight:800;display:block;margin-top:4px}
.cmp div.after{border-color:var(--orange);background:#FFF7F1}
.cmp div.after b{color:var(--orange-d)}
.act{display:inline-block;background:var(--ink);color:#fff;border:0;border-radius:8px;padding:9px 16px;font-size:12px;font-weight:800;cursor:pointer;font-family:var(--font);margin-top:8px}
.act.o{background:var(--orange)}
.act:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.steps{display:flex;gap:8px;margin:14px 0;flex-wrap:wrap}
.steps span{font-size:11px;font-weight:800;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px;color:var(--muted)}
.steps span.on{background:#FDEAE0;border-color:var(--orange);color:var(--orange-d)}
.ev{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}
.ev div{background:#fff;border:1px solid var(--line);border-radius:9px;padding:11px 9px;text-align:center;font-size:11px;font-weight:800;line-height:1.5}
.ev div small{display:block;font-size:10px;color:var(--faint);font-weight:500;margin-top:4px}
.calc{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0}
.calc label{font-size:10.5px;color:var(--faint);font-weight:800;display:flex;flex-direction:column;gap:5px}
.calc input{font-family:var(--font);font-size:14px;font-weight:800;border:1px solid var(--line);border-radius:7px;padding:8px 10px;color:var(--ink);background:#fff}
.out{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:14px 0}
.out div{background:#fff;border:1px solid var(--line);border-radius:9px;padding:12px}
.out div small{font-size:10px;color:var(--faint);display:block}
.out div b{font-family:var(--font);font-size:19px;font-weight:800;display:block;margin-top:4px}
.out div.hi{background:#FFF6EC;border-color:var(--orange)}
.out div.hi b{color:var(--orange-d)}
.note4{font-size:11px;color:var(--muted);background:#F7F1E9;border-radius:9px;padding:11px 13px;line-height:1.7;margin:12px 0;text-wrap:pretty}
.note4 b{color:var(--ink)}
.zoom{position:fixed;inset:0;background:rgba(34,26,20,.85);z-index:90;display:none;align-items:center;justify-content:center;padding:36px}
.zoom.on{display:flex}
.zoom img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.zoom button{position:absolute;right:26px;top:22px;background:#fff;border:0;border-radius:8px;padding:9px 16px;font-size:13px;font-weight:800;cursor:pointer}
/* 微信小程序页面外壳（V7 载体口径） */
.xapp{width:430px;height:932px;background:#fff;display:flex;flex-direction:column;overflow:hidden;position:relative}
.xbar{height:48px;flex:none;background:var(--wxbar);display:flex;align-items:center;justify-content:center;position:relative;border-bottom:.5px solid rgba(0,0,0,.06)}
.xbar .t{font-size:16px;font-weight:600}
.xbar .bk{position:absolute;left:20px;top:12px;width:13px;height:13px;border-left:2px solid #191919;border-bottom:2px solid #191919;transform:rotate(45deg);border-radius:1px}
.xbar .dot{position:absolute;right:18px;font-size:19px;font-weight:700;letter-spacing:1px}
.xbody{flex:1;background:#F6F7F9;padding:14px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.xbanner{background:linear-gradient(120deg,#FFF1DE,#FDE9E3);border-radius:11px;padding:14px 15px}
.xbanner b{font-family:var(--serif);font-size:17px;font-weight:900;display:block;line-height:1.45}
.xbanner span{font-size:11.5px;color:#8A7B6E;display:block;margin-top:4px;line-height:1.6}
.xcard{background:#fff;border-radius:10px;padding:13px 14px}
.xcard h4{font-size:13.5px;font-weight:800;margin-bottom:6px;line-height:1.5}
.xcard p{font-size:11.5px;color:#6B6055;line-height:1.7;text-wrap:pretty}
.xcard .src{font-size:10px;color:var(--orange);font-weight:800;display:block;margin-top:6px}
.xopt{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.xopt button{font-family:var(--font);font-size:12px;font-weight:700;background:#fff;border:1px solid var(--line);border-radius:9px;padding:11px 9px;cursor:pointer;color:var(--muted);text-align:center;line-height:1.5}
.xopt button.sel{background:#FDEAE0;border-color:var(--orange);color:var(--orange-d)}
.xopt button:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.xfoot{height:56px;flex:none;background:#fff;border-top:.5px solid #EEE;display:flex;align-items:center;justify-content:center;font-size:11px;color:#A0958A}
/* 完整显示设备，不裁掉微信输入区与后台底部（指导 §7.8） */
.device.wx{transform:scale(.79)}
.device.wb{transform:scale(.72)}

/* ===== V6 家长端产品展示 ===== */
.visual.pshow{background:#E8EDF6;padding:12px;display:flex;align-items:center;justify-content:center}
.visual.pshow img{height:100%;width:auto;max-width:100%;object-fit:contain;border-radius:14px;
  box-shadow:0 16px 40px -22px rgba(20,30,60,.75);display:block}
.copy .steps span{font-size:10.5px}
.two-layer{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:13px 0}
.two-layer div{background:#fff;border:1px solid var(--line);border-radius:11px;padding:11px 12px}
.two-layer b{font-size:11.5px;font-weight:900;display:block;margin-bottom:5px}
.two-layer span{font-size:10.5px;color:var(--muted);line-height:1.6;display:block}

/* ===== V7：微信服务号 + 微信小程序 双载体 ===== */
.carrier{display:flex;align-items:center;gap:7px;flex-wrap:wrap;background:#FFF6EC;
 border:1px solid rgba(238,95,39,.25);border-radius:9px;padding:8px 11px;margin:12px 0;
 font-size:10.5px;font-weight:800;color:var(--muted);line-height:1.6}
.carrier b{color:var(--orange-d)}
.carrier .arw{color:var(--orange);font-weight:900}
.dual{display:grid;grid-template-columns:1fr 34px 1fr;gap:8px;align-items:center;margin:13px 0}
.dual .node{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px}
.dual .node b{font-size:12px;font-weight:900;display:block;margin-bottom:5px;color:var(--ink)}
.dual .node span{font-size:10.5px;color:var(--muted);line-height:1.6;display:block}
.dual .mid{text-align:center;color:var(--orange);font-size:18px;font-weight:900}
.expert{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);
 border-radius:12px;padding:9px 12px;margin:11px 0}
.expert img{width:50px;height:50px;border-radius:50%;object-fit:cover;object-position:center 22%;flex:none}
.expert b{font-size:12.5px;font-weight:900;display:block}
.expert span{font-size:10.5px;color:var(--muted);line-height:1.55;display:block;margin-top:3px}

/* ===== V7 首屏：服务号 + 小程序并列展示（借鉴洪老师案例卡） ===== */
.visual.pair{background:linear-gradient(135deg,#F2EDE5 0%,#E9EEF7 100%);padding:16px 18px 14px;
 display:flex;flex-direction:column;gap:11px;position:relative}
.pair .rail{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:13px}
.pair .shot{height:100%;width:auto;max-width:42%;object-fit:contain;border-radius:13px;
 border:1px solid rgba(255,255,255,.9);box-shadow:0 20px 44px -24px rgba(20,30,60,.85)}
.pair .mid{display:flex;flex-direction:column;align-items:center;gap:9px;flex:none}
.pair .mid .a{font-size:23px;font-weight:900;color:var(--orange)}
.pair .mid .t{font-size:10px;font-weight:800;color:var(--muted);writing-mode:vertical-rl;letter-spacing:.12em;line-height:1.4}
.pair .caps{display:flex;justify-content:center;gap:22px;flex:none}
.pair .caps span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 14px;
 font-size:10.5px;font-weight:900;color:var(--ink);white-space:nowrap}
.pair .avmark{position:absolute;right:16px;bottom:14px;width:50px;height:50px;border-radius:50%;
 border:3px solid #fff;object-fit:cover;object-position:center 22%;box-shadow:0 8px 20px -9px rgba(0,0,0,.5)}

/* 上线版：返回案例演示入口（2026-11-06） */
.acts .back-link{font-size:11.5px;font-weight:700;border:1px solid var(--line);background:#fff;
 border-radius:6px;padding:6px 11px;color:var(--muted);text-decoration:none;cursor:pointer}
.acts .back-link:hover{color:var(--orange-d);border-color:var(--orange)}

/* 上线版：移动端改为纵向阅读（2026-11-06） */
@media(max-width:760px){
  body{overflow:auto}
  .stagewrap{display:block;width:100%;height:auto;min-height:100vh}
  .stage{width:100%!important;height:auto!important;min-height:100vh;transform:none!important;box-shadow:none}
  .hd{height:auto;flex-wrap:wrap;gap:8px;padding:10px 12px}
  .hd .brand{font-size:15px;white-space:normal}
  .hd .sub{display:none}
  .actnav{order:3;width:100%;overflow-x:auto;flex-wrap:nowrap}
  .actnav button{white-space:nowrap;font-size:10px;padding:5px 9px}
  .acts{margin-left:auto}
  .acts button,.acts .back-link{font-size:10px;padding:5px 8px}
  .slides{position:static;height:auto}
  .slide{position:relative;inset:auto;display:none;grid-template-columns:1fr;gap:12px;padding:16px 14px 22px}
  .slide.on{display:grid}
  .copy{overflow:visible;min-height:0}
  .copy h2{font-size:22px;margin-bottom:8px}
  .copy .lead{font-size:12.5px;line-height:1.7}
  .flow{gap:5px;margin:10px 0}
  .flow li{font-size:10px;padding:4px 8px}
  .trio{margin-top:10px;gap:6px;flex-direction:column}
  .trio div{gap:6px}
  .trio span{min-width:66px;font-size:9.5px}
  .trio p{font-size:11px}
  .carrier{font-size:9.5px;padding:7px 9px;margin:8px 0}
  .point{margin-top:10px;font-size:11px;padding:9px 11px}
  .cap{font-size:10.5px;padding-top:8px;margin-top:8px}
  .stamp{font-size:9.5px}
  .visual{height:390px;min-height:0}
  .visual.pshow{padding:8px}
  .visual.plain{padding:12px;overflow:auto}
  .visual.pair{padding:10px}
  .pair .caps{gap:5px;flex-wrap:wrap}
  .pair .caps span{font-size:9px;padding:4px 8px}
  .pair .mid .t{font-size:9px}
  .ft{height:auto;padding:10px 12px;gap:8px;flex-wrap:wrap}
  .ft .nx{display:none}
  .ft .cnt{font-size:13px;min-width:52px}
  .ft button{font-size:10.5px;padding:7px 10px}
  .dlg{width:94vw;max-height:80vh}
}