/* 云岫山 · 青绿山水 / 宣纸风 */
/* 中文段落避免末行孤字 */
body{text-wrap-style:pretty}
.intro h1{text-wrap-style:balance}
:root{
  --brand:#2F6B5B;--brand-d:#1F4D41;--brand-soft:#E4EEE8;--ver:#C8452F;--gold:#C9962E;--danger:#C8452F;
  --ink:#2B2A26;--ink2:#5B574D;--muted:#9A907C;--line:rgba(110,90,50,.12);--page-bg:#F6F0E4;--card:#FFFCF6;
  --serif:"Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC","Noto Serif SC",serif;
  --kai:"STKaiti","KaiTi","Kaiti SC","Songti SC",serif;
  --backdrop:#EFE7D6;--blob1:#CFE0D3;--blob2:#F0D9C4;
}
.stage{background:radial-gradient(900px 500px at 15% 0%,#E4EDE3,transparent),linear-gradient(160deg,#F4EEE2,#EDE3D0)}
.intro h1{font-family:var(--serif);font-size:32px;letter-spacing:2px}
.intro .logo .mark{background:linear-gradient(145deg,#3E7E6C,#1F4D41)}
.intro .eyebrow{color:var(--ver);background:rgba(200,69,47,.08)}
.intro .jumps a{background:rgba(255,252,246,.85);border-radius:4px}
.device-inner{background:#26241F}

/* ---------- 通用 ---------- */
.price{color:var(--ver);font-weight:700;font-family:"DIN Alternate","Helvetica Neue",Arial,sans-serif;font-size:17px;white-space:nowrap}
.price small{font-size:.68em;margin-right:1px}
.price i{font-style:normal;font-size:11px;color:var(--muted);font-weight:400;margin-left:2px;font-family:-apple-system,"PingFang SC",sans-serif}
.price.lg{font-size:26px}
.mu{color:#C3B89F}
.spin{display:inline-block;width:15px;height:15px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite;vertical-align:-2px;margin-right:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:40px;padding:0 20px;border-radius:6px;font-size:15px;font-weight:600;white-space:nowrap;transition:transform .12s}
.btn:active{transform:scale(.96)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn.primary{background:var(--brand);color:#FFFBF2;box-shadow:0 8px 16px -10px rgba(31,77,65,.9)}
.btn.ghost{border:1px solid #DCCFB4;background:var(--card);color:var(--ink2);font-weight:500}
.btn.sm{height:30px;padding:0 12px;font-size:13px}
.btn.xs{height:28px;padding:0 11px;font-size:12.5px;font-weight:500}
.btn.lg{height:46px;padding:0 22px;font-size:16px}
.btn.full{width:100%}
.btn.grow{flex:1}
.card{margin:10px 12px 0;padding:14px;border-radius:10px;background:var(--card);border:1px solid rgba(160,130,80,.12)}
.cd-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.cd-h h3{margin:0;font-size:16px;font-family:var(--serif);font-weight:700;letter-spacing:.5px}
.cd-h small{font-size:12px;color:var(--muted)}
.cd-h.mt{margin-top:18px}
.bottom-space{height:24px}
.list-end{text-align:center;font-size:11.5px;color:#B8AC92;padding:16px 20px 26px}
.err{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--ver);margin-top:8px}
.tg{display:flex;flex-wrap:wrap;gap:5px}
.tg i{font-style:normal;font-size:11px;color:var(--brand);border:1px solid rgba(47,107,91,.35);padding:0 6px;border-radius:3px;line-height:17px}
.navbar.paper{background:var(--page-bg)}
.navbar.clear{background:transparent}
.navbar.abs{position:absolute;left:0;right:0;top:0}
.navbar.abs .nb-back{background:rgba(255,252,246,.85);box-shadow:0 1px 4px rgba(0,0,0,.1)}
.navbar .nb-title{font-family:var(--serif);letter-spacing:1px}
.tabbar{background:rgba(255,252,246,.96);border-top-color:rgba(110,90,50,.12)}
.tabbar a{color:#A79A7E}
.tabbar .badge{background:var(--ver);border-color:#FFFCF6}
.sheet{background:var(--card);overflow-y:auto}
.dialog{background:var(--card)}
.sh-title{font-size:17px;font-weight:700;padding:18px;text-align:center;font-family:var(--serif)}
.sh-foot{padding:12px 16px 4px}
.stepper{display:flex;align-items:center;border:1px solid #DCCFB4;border-radius:6px;overflow:hidden;flex:none}
.stepper button{width:30px;height:28px;display:grid;place-items:center;color:var(--ink2)}
.stepper button:disabled{color:#D8CDB6}
.stepper b{width:32px;text-align:center;font-size:15px;border-left:1px solid #DCCFB4;border-right:1px solid #DCCFB4;line-height:28px;justify-content:center;align-items:center}
.empty svg.art.big{width:180px;height:112px;border-radius:8px;opacity:.8}

/* ---------- 首页 ---------- */
.hm-body{padding-bottom:10px}
.hero{position:relative;height:300px;margin-top:calc(var(--sb) * -1)}
.hero>svg{position:absolute;inset:0;width:100%;height:100%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,40,34,.35),transparent 35%,transparent 70%,var(--page-bg))}
.hero .navbar{position:absolute;left:0;right:0;top:0;padding-top:var(--sb);height:calc(var(--sb) + 44px)}
.hm-body .hero{margin-top:0}
.hero-t{position:absolute;left:22px;top:calc(var(--sb) + 58px);color:#fff}
.hero-t h1{margin:0;font-family:var(--kai);font-size:44px;letter-spacing:8px;text-shadow:0 2px 12px rgba(0,0,0,.25);font-weight:700}
.hero-t p{margin:4px 0 12px;font-family:var(--serif);font-size:14px;letter-spacing:4px;opacity:.95}
.hero-t span{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:3px 8px;border:1px solid rgba(255,255,255,.6);border-radius:3px;background:rgba(0,0,0,.12)}
.stat{margin-top:-58px;position:relative;box-shadow:0 10px 30px -18px rgba(80,60,20,.45)}
.st-row{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px dashed var(--line);padding-bottom:12px}
.st-row>div{display:grid;gap:2px}
.st-row>div+div{padding-left:14px;border-left:1px solid var(--line)}
.st-row small{font-size:11.5px;color:var(--muted)}
.st-row b{font-size:17px;display:flex;align-items:center;gap:4px}
.st-row b .ic{color:var(--gold)}
.st-row b span{font-size:16px}
.st-row em{font-style:normal;font-size:11.5px;color:var(--muted)}
.flow-h{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:13px}
.flow-h b{font-size:18px;color:var(--brand)}
.lvl{font-style:normal;font-size:11px;padding:0 6px;border-radius:3px;line-height:18px}
.lvl.ok{background:var(--brand-soft);color:var(--brand)}
.flow-h small{margin-left:auto;font-size:11px;color:var(--muted)}
.capbar{position:relative;height:6px;border-radius:3px;background:#EFE6D2;margin-top:8px}
.capbar i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:linear-gradient(90deg,#6FA38A,#2F6B5B)}
.capbar s{position:absolute;top:-2px;width:1px;height:10px;background:#C9BDA2}
.flow-ch{height:130px;margin:8px -4px -6px}
.up{display:flex;align-items:center;gap:10px;cursor:pointer;background:linear-gradient(100deg,#FFFCF6,#F4EBDA);border-left:3px solid var(--ver)}
.up-l{flex:1;display:grid;gap:2px;min-width:0}
.up-l small{font-size:11.5px;color:var(--ver);font-weight:600}
.up-l b{font-size:15px;font-family:var(--serif)}
.up-l span{font-size:12px;color:var(--muted)}
.qk{display:grid;grid-template-columns:repeat(4,1fr);margin:12px 12px 0;padding:14px 0;border-radius:10px;background:var(--card);border:1px solid rgba(160,130,80,.12)}
.qk a{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12.5px;color:var(--ink2);cursor:pointer}
.qk span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--brand);background:radial-gradient(circle at 30% 30%,#fff,#E4EEE8);border:1px solid rgba(47,107,91,.2)}
.qk a:nth-child(2) span{color:var(--ver);background:radial-gradient(circle at 30% 30%,#fff,#F6E3DC);border-color:rgba(200,69,47,.2)}
.qk a:nth-child(4) span{color:var(--gold);background:radial-gradient(circle at 30% 30%,#fff,#F5EAD2);border-color:rgba(201,150,46,.25)}
.notice{margin:10px 12px 0;display:flex;align-items:center;gap:8px;padding:0 12px;height:36px;border-radius:8px;background:#F7EBDD;color:#9A5A32;font-size:12.5px;overflow:hidden}
.notice .ic{flex:none;color:var(--ver)}
.nt-s{flex:1;height:36px;overflow:hidden;position:relative}
.nt-s span{display:block;height:36px;line-height:36px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:ntk 12s infinite}
@keyframes ntk{0%,28%{transform:translateY(0)}33%,61%{transform:translateY(-100%)}66%,95%{transform:translateY(-200%)}100%{transform:translateY(0)}}
.sec{padding-top:18px}
.sec-h{display:flex;align-items:center;justify-content:space-between;padding:0 16px 10px}
.sec-h h3{margin:0;font-size:18px;font-family:var(--serif);letter-spacing:1px;position:relative;padding-left:12px}
.sec-h h3::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:4px;background:var(--ver);border-radius:1px}
.sec-h a{font-size:12.5px;color:var(--muted);display:flex;align-items:center;cursor:pointer}
.slot-tb{margin:0 12px;padding:6px 12px;border-radius:10px;background:var(--card);border:1px solid rgba(160,130,80,.12)}
.sl-r{display:grid;grid-template-columns:62px repeat(4,1fr);gap:6px;align-items:center;padding:7px 0}
.sl-r+.sl-r{border-top:1px dashed var(--line)}
.sl-r>b{font-size:13.5px;display:grid;font-family:var(--serif)}
.sl-r>b small{font-size:10.5px;color:var(--muted);font-weight:400;font-family:-apple-system,sans-serif}
.sl-r span{display:grid;text-align:center;font-size:12.5px;font-weight:600;padding:5px 0;border-radius:5px;background:var(--brand-soft);color:var(--brand);font-family:"DIN Alternate",Arial,sans-serif}
.sl-r span i{font-style:normal;font-size:10px;font-weight:400;font-family:-apple-system,"PingFang SC",sans-serif}
.sl-r span.low{background:#FBEBD6;color:#B8741E}
.sl-r span.out{background:#F6E1DC;color:var(--ver)}
.sl-r span.past{background:#F1EDE4;color:#C3B89F}
.hs{display:flex;gap:10px;overflow-x:auto;padding:0 12px 4px;scrollbar-width:none}
.hs::-webkit-scrollbar{display:none}
.sp{flex:none;width:150px;cursor:pointer}
.sp-art{position:relative;height:100px;border-radius:8px;overflow:hidden;border:1px solid rgba(160,130,80,.15)}
.sp-art svg{width:100%;height:100%;display:block}
.sp-pl{position:absolute;right:8px;bottom:8px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:rgba(255,252,246,.92);color:var(--ver);box-shadow:0 2px 8px rgba(0,0,0,.15)}
.sp-pl.on{background:var(--ver);color:#fff}
.sp-pl .ic{fill:currentColor}
.sp b{display:block;font-size:14.5px;margin-top:8px;font-family:var(--serif)}
.sp small{display:flex;align-items:center;gap:3px;font-size:11.5px;color:var(--muted);margin-top:2px}
.pk{display:flex;gap:12px;margin:0 12px 10px;padding:10px;border-radius:10px;background:var(--card);border:1px solid rgba(160,130,80,.12);cursor:pointer}
.pk-art{width:104px;height:80px;border-radius:6px;overflow:hidden;flex:none}
.pk-art svg{width:100%;height:100%;display:block}
.pk-m{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.pk-m b{font-size:14.5px;font-family:var(--serif);line-height:1.35}
.pk-f{margin-top:auto;display:flex;align-items:baseline;gap:6px}
.pk-f s{font-size:11.5px;color:#B8AC92}
.pk-f em{margin-left:auto;font-style:normal;font-size:11px;color:#B8AC92}
.ft{display:flex;align-items:center;justify-content:center;gap:6px;padding:18px 20px 24px;font-size:11px;color:#B8AC92;text-align:center}

/* 迷你播放器 */
.minipl{position:absolute;left:10px;right:10px;bottom:8px;z-index:25;display:flex;align-items:center;gap:10px;padding:8px 8px 8px 8px;border-radius:12px;background:rgba(43,42,38,.94);color:#F6F0E4;backdrop-filter:blur(10px);box-shadow:0 10px 26px -10px rgba(0,0,0,.5);transform:translateY(140%);transition:transform .3s cubic-bezier(.3,.8,.3,1);cursor:pointer}
.minipl.show{transform:none}
.mp-art{width:40px;height:40px;border-radius:6px;overflow:hidden;flex:none}
.mp-art svg{width:100%;height:100%;display:block}
.mp-m{flex:1;min-width:0;display:grid;gap:6px}
.mp-n{font-size:13.5px;font-family:var(--serif)}
.mp-bar{height:3px;border-radius:2px;background:rgba(255,255,255,.18);overflow:hidden}
.mp-bar i{display:block;height:100%;width:0;background:#E7B563;transition:width 1s linear}
.mp-btn{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#F6F0E4;color:var(--ink)}
.mp-btn .ic{fill:currentColor}
.mp-x{color:rgba(255,255,255,.55);width:26px}

/* ---------- 购票 ---------- */
.buy-body{padding-bottom:0}
.dates{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -2px;padding:2px}
.dates::-webkit-scrollbar{display:none}
.dates button{flex:none;width:58px;padding:7px 0;border-radius:6px;display:grid;gap:1px;background:#F5EEDF;border:1px solid transparent}
.dates button small{font-size:11px;color:var(--muted)}
.dates button b{font-size:15px}
.dates button i{font-style:normal;font-size:10.5px;color:var(--brand)}
.dates button.low i{color:#B8741E}
.dates button.out{opacity:.5}
.dates button.out i{color:var(--ver)}
.dates button.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.dates button.on small,.dates button.on i{color:rgba(255,255,255,.85)}
.slots{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sl{display:grid;gap:3px;text-align:left;padding:10px 12px;border-radius:8px;background:#F5EEDF;border:1.5px solid transparent}
.sl b{font-size:15px}
.sl small{font-size:11.5px;color:var(--muted)}
.sl-bar{height:4px;border-radius:2px;background:rgba(0,0,0,.06);overflow:hidden;margin-top:3px}
.sl-bar i{display:block;height:100%;background:#8FB9A4}
.sl-bar i.hot{background:#E09A50}
.sl.on{border-color:var(--brand);background:var(--brand-soft)}
.sl.on b{color:var(--brand-d)}
.sl.dis{opacity:.45}
.vis{display:flex;flex-wrap:wrap;gap:8px}
.vc{display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 14px;border-radius:16px;border:1px solid #DCCFB4;background:var(--card);font-size:13.5px}
.vc.on{border-color:var(--brand);background:var(--brand);color:#fff}
.vc.add{border-style:dashed;color:var(--brand)}
.vr{margin-top:12px;padding:12px;border-radius:8px;background:#F8F2E6}
.vr-h{display:flex;align-items:center;gap:8px}
.vr-h b{font-size:15px;font-family:var(--serif)}
.vr-h small{flex:1;font-size:12px;color:var(--muted)}
.vr-h button{color:#B8AC92}
.tps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.tps button{display:grid;gap:1px;padding:6px 0;border-radius:5px;background:var(--card);border:1px solid #E6DAC0;font-size:12.5px}
.tps button i{font-style:normal;font-size:11px;color:var(--muted)}
.tps button.on{border-color:var(--ver);color:var(--ver);font-weight:600;background:#FDF3EF}
.tps button.on i{color:var(--ver)}
.vr-empty{margin-top:12px;padding:16px;border-radius:8px;border:1px dashed #DCCFB4;text-align:center;font-size:13px;color:var(--muted)}
.ad-r{display:flex;align-items:center;gap:10px;padding:10px 0}
.ad-r+.ad-r{border-top:1px dashed var(--line)}
.ad-r>div:first-child{flex:1;display:grid;gap:3px}
.ad-r b{font-size:14.5px;display:flex;align-items:baseline;gap:8px}
.ad-r b .price{font-size:14px}
.ad-r small{font-size:12px;color:var(--muted)}
.ipt{width:100%;height:42px;border-radius:6px;border:1px solid #E6DAC0;background:#FDF9F1;padding:0 12px;font-size:15px;outline:0}
.ipt:focus{border-color:var(--brand)}
.ipt.bad{border-color:var(--ver)}
.rules h4{margin:0 0 8px;font-size:14.5px;font-family:var(--serif)}
.rules ul{margin:0;padding-left:18px;display:grid;gap:6px;font-size:12.5px;color:var(--ink2);line-height:1.55}
.rules li::marker{color:var(--ver)}
.bbar{flex:none;position:relative;z-index:10;display:flex;align-items:center;gap:10px;padding:10px 14px calc(10px + var(--safe-b));background:var(--card);border-top:1px solid var(--line)}
.bbar.right{justify-content:flex-end}
.bb-l{flex:1;display:grid;gap:1px;min-width:0}
.bb-l small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay{padding:22px 18px 6px;text-align:center}
.pay-h{font-size:14px;color:var(--muted)}
.pay-amt{margin:8px 0 18px;font-family:"DIN Alternate",Arial,sans-serif}
.pay-amt small{font-size:22px;font-weight:700}
.pay-amt b{font-size:40px}
.pay-m{text-align:left;border-top:1px solid var(--line);margin-bottom:18px}
.pm{display:flex;align-items:center;gap:10px;padding:14px 2px;border-bottom:1px solid var(--line);font-size:14.5px}
.pm span{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:#fff;background:#1AAD5B}
.pm .ck{margin-left:auto;color:#1AAD5B}
.pay-tip{font-size:11.5px;color:#B8AC92;margin:10px 0 0}
.vf{padding:0 18px}
.ff{position:relative;display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line)}
.ff label{width:78px;flex:none;font-size:14.5px}
.ff input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:14.5px;height:50px}
.ff input::placeholder{color:#C3B89F}
.ff span{font-size:14.5px;color:var(--ink2)}
.ff em{position:absolute;right:0;bottom:2px;font-style:normal;font-size:11px;color:var(--ver)}
.ff.bad label{color:var(--ver)}
.vf-tip{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);margin:12px 0 0}
.vl-body{padding-bottom:10px}
.vl{display:flex;align-items:center;gap:12px}
.vl-av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff;font-family:var(--kai);font-size:19px;flex:none}
.vl>div:nth-child(2){flex:1;display:grid;gap:3px}
.vl b{font-size:15px}
.vl b em{font-style:normal;font-size:10.5px;color:var(--ver);border:1px solid var(--ver);border-radius:3px;padding:0 4px;margin-left:6px;vertical-align:1px}
.vl small{font-size:12px;color:var(--muted)}
.vl button{width:32px;height:32px;display:grid;place-items:center;color:var(--muted)}

/* ---------- 导览地图 ---------- */
.mf{flex:none;display:flex;gap:6px;padding:0 12px 8px;background:var(--page-bg);overflow-x:auto;scrollbar-width:none;position:relative;z-index:6}
.mf button{flex:none;display:inline-flex;align-items:center;gap:3px;height:28px;padding:0 11px;border-radius:14px;background:var(--card);border:1px solid #E6DAC0;font-size:12.5px;color:var(--ink2)}
.mf button.on{background:var(--ink);border-color:var(--ink);color:#F6F0E4}
.mapv{position:relative;flex:1;min-height:0;overflow:hidden;background:#EFE5CF;touch-action:none;cursor:grab}
.mapv:active{cursor:grabbing}
.layer{position:absolute;left:0;top:0;width:800px;height:1000px;transform-origin:0 0;will-change:transform}
.layer>svg{position:absolute;inset:0;width:800px;height:1000px;display:block}
.rt-ov{pointer-events:none}
.rt-line{animation:dash 1.2s linear infinite}
@keyframes dash{to{stroke-dashoffset:-36}}
.mk{position:absolute;width:0;height:0;z-index:2}
.mk>span{position:absolute;left:0;bottom:0;transform:translate(-50%,0) scale(calc(1 / var(--z)));transform-origin:50% 100%;display:flex;align-items:center;gap:4px;white-space:nowrap;padding:3px 9px 3px 3px;border-radius:14px;background:#FFFCF6;border:1.5px solid var(--brand);box-shadow:0 3px 8px rgba(60,40,10,.2);font-size:12px;color:var(--ink);transition:background .2s}
.mk>span::after{content:"";position:absolute;left:50%;bottom:-7px;margin-left:-5px;border:5px solid transparent;border-top-color:var(--brand)}
.mk.spot>span i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff}
.mk.spot>span b{font-family:var(--serif);font-weight:700}
.mk.spot.on>span{background:var(--ver);border-color:var(--ver);color:#fff;z-index:3}
.mk.spot.on>span::after{border-top-color:var(--ver)}
.mk.spot.on>span i{background:#fff;color:var(--ver)}
.mk.on{z-index:4}
.mk.dim{opacity:.35}
.mk.sound>span{background:var(--ver);border-color:var(--ver);color:#fff}
.mk.sound>span::before{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;box-shadow:0 0 0 0 rgba(200,69,47,.6);animation:ring 1.4s ease-out infinite}
@keyframes ring{to{box-shadow:0 0 0 16px rgba(200,69,47,0)}}
.mk.fac>span{padding:0;width:24px;height:24px;justify-content:center;border-radius:50%;border-width:1.5px}
.mk.fac>span::after{display:none}
.mk.fac>span{transform:translate(-50%,50%) scale(calc(1 / var(--z)))}
.mk.fac.wc>span{border-color:#3E7E8C;color:#3E7E8C}
.mk.fac.food>span{border-color:#C9962E;color:#C9962E}
.mk.fac.traffic>span{border-color:#5B574D;color:#5B574D}
.mk.fac.service>span{border-color:var(--ver);color:var(--ver)}
.mk.fac.on>span{background:var(--ink);color:#fff;border-color:var(--ink)}
.mk.hide{display:none}
.me{position:absolute;width:0;height:0;z-index:1}
.me i{position:absolute;left:0;top:0;width:16px;height:16px;transform:translate(-50%,-50%) scale(calc(1 / var(--z)));border-radius:50%;background:#3B82F6;border:3px solid #fff;box-shadow:0 0 0 0 rgba(59,130,246,.5);animation:me 1.8s infinite}
@keyframes me{0%{box-shadow:0 0 0 0 rgba(59,130,246,.5)}100%{box-shadow:0 0 0 22px rgba(59,130,246,0)}}
.m-ctl{position:absolute;right:10px;top:10px;display:grid;border-radius:8px;overflow:hidden;background:var(--card);box-shadow:0 4px 12px rgba(60,40,10,.18);z-index:5}
.m-ctl button{width:36px;height:36px;display:grid;place-items:center;color:var(--ink2)}
.m-ctl button+button{border-top:1px solid var(--line)}
.m-rt{position:absolute;left:10px;top:10px;display:grid;gap:6px;z-index:5}
.m-rt button{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 10px;border-radius:14px;background:rgba(255,252,246,.94);font-size:12px;color:var(--ink2);box-shadow:0 3px 10px rgba(60,40,10,.15)}
.m-rt button.on{background:var(--ver);color:#fff}
.m-card{position:absolute;left:10px;right:10px;bottom:10px;z-index:6}
.minipl.show~.m-card,.m-card:has(~.minipl.show){bottom:72px}
.mc{position:relative;display:flex;gap:10px;padding:10px;border-radius:12px;background:var(--card);box-shadow:0 10px 28px -10px rgba(60,40,10,.4);border:1px solid rgba(160,130,80,.15);animation:mcIn .3s cubic-bezier(.3,.8,.3,1)}
@keyframes mcIn{from{transform:translateY(20px);opacity:0}}
.mc.hint{align-items:center;gap:6px;font-size:12.5px;color:var(--muted);padding:12px}
.mc-art{width:88px;height:110px;border-radius:8px;overflow:hidden;flex:none;cursor:pointer}
.mc-art svg{width:100%;height:100%;display:block}
.mc-m{flex:1;min-width:0;display:grid;gap:5px;align-content:start}
.mc-t{display:flex;align-items:center;gap:6px;padding-right:22px}
.mc-t b{font-size:16px;font-family:var(--serif)}
.mc-t em{font-style:normal;font-size:10.5px;color:var(--brand);border:1px solid rgba(47,107,91,.35);padding:0 5px;border-radius:3px}
.mc-m>small{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:3px;line-height:1.4;flex-wrap:wrap}
.mc-pl{display:flex;align-items:center;gap:8px}
.mc-pl .wave{flex:1;height:22px}
.mc-pl span{font-size:12px;color:var(--ver);font-weight:600}
.mc-pl small{font-size:11px;color:var(--muted);margin-left:-6px}
.mc-b{display:flex;gap:8px;justify-content:flex-end}
.mc-x{position:absolute;right:6px;top:6px;width:26px;height:26px;display:grid;place-items:center;color:#B8AC92}
.mc.fac{align-items:center}
.mc.fac .mc-m b{font-size:15px}
.fc-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff;background:#3E7E8C}
.fc-ic.food{background:#C9962E}.fc-ic.traffic{background:#5B574D}.fc-ic.service{background:var(--ver)}
.mc.route{flex-direction:column}
.mc-h{display:grid;gap:3px;padding-right:26px}
.mc-h b{font-size:16px;font-family:var(--serif)}
.mc-h small{font-size:12px;color:var(--muted)}
.rt-stops{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.rt-stops button{flex:none;display:flex;align-items:center;gap:4px;font-size:12px;padding:4px 9px 4px 4px;border-radius:12px;background:#F5EEDF}
.rt-stops i{font-style:normal;width:17px;height:17px;border-radius:50%;background:var(--ver);color:#fff;font-size:10.5px;display:grid;place-items:center;font-weight:700}
.pl-btn{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ver);color:#fff;flex:none;box-shadow:0 4px 10px -4px rgba(200,69,47,.8)}
.pl-btn .ic,.big .ic{fill:currentColor}
.pl-btn.on{background:var(--ink)}
.wave{display:flex;align-items:center;gap:2px;height:44px}
.wave i{flex:1;height:var(--h);min-width:2px;border-radius:2px;background:#DCCFB4;transition:background .3s}
.wave i.done{background:var(--ver)}
.wave.play i{animation:wv .9s ease-in-out infinite alternate;animation-delay:var(--d)}
@keyframes wv{from{transform:scaleY(.45)}to{transform:scaleY(1)}}

/* 讲解列表与景点 */
.spl-body{padding-bottom:80px}
.spl-h{margin:6px 12px 6px;padding:16px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(120deg,#2F6B5B,#1F4D41);color:#F6F0E4}
.spl-h div{display:grid;gap:4px}
.spl-h b{font-size:17px;font-family:var(--serif);letter-spacing:1px}
.spl-h small{font-size:12px;opacity:.8}
.spl-h .ic{opacity:.7}
.spl{display:flex;align-items:center;gap:10px;margin:8px 12px 0;padding:10px;border-radius:10px;background:var(--card);border:1px solid rgba(160,130,80,.12);cursor:pointer}
.spl-n{font-size:13px;color:#C3B89F;width:20px}
.spl-art{width:64px;height:48px;border-radius:5px;overflow:hidden;flex:none}
.spl-art svg{width:100%;height:100%;display:block}
.spl-m{flex:1;min-width:0;display:grid;gap:4px}
.spl-m b{font-size:14.5px;font-family:var(--serif)}
.spl-m small{font-size:11.5px;color:var(--muted)}
.spl-bar{height:2px;background:#EFE6D2;border-radius:1px;overflow:hidden}
.spl-bar i{display:block;height:100%;width:0;background:var(--ver);transition:width 1s linear}
.sd-body{padding-bottom:0}
.sd-hero{position:relative;height:280px}
.sd-hero>svg{position:absolute;inset:0;width:100%;height:100%}
.sd-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(20,30,25,.55))}
.sd-t{position:absolute;left:18px;right:18px;bottom:16px;color:#fff}
.sd-t em{font-style:normal;font-size:11px;padding:1px 7px;border-radius:3px;background:var(--ver)}
.sd-t h1{margin:8px 0 4px;font-family:var(--serif);font-size:26px;letter-spacing:2px}
.sd-t p{margin:0;font-size:12.5px;display:flex;align-items:center;gap:4px;opacity:.92;line-height:1.5}
.player{margin-top:-6px;position:relative}
.pl-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.pl-top>div:first-child{display:grid;gap:2px}
.pl-top b{font-size:16px;font-family:var(--serif)}
.pl-top small{font-size:11.5px;color:var(--muted)}
.voices,.rates{display:flex;background:#F2EADA;border-radius:6px;padding:2px}
.voices button,.rates button{font-size:12px;padding:3px 9px;border-radius:5px;color:var(--ink2)}
.voices button.on,.rates button.on{background:var(--card);color:var(--ver);font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.seek{position:relative;height:4px;border-radius:2px;background:#EFE6D2;margin-top:8px;cursor:pointer}
.seek::before{content:"";position:absolute;inset:-10px 0}
.seek i{position:absolute;left:0;top:0;bottom:0;background:var(--ver);border-radius:2px;transition:width 1s linear}
.seek i::after{content:"";position:absolute;right:-6px;top:-4px;width:12px;height:12px;border-radius:50%;background:var(--ver);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.pl-tm{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);margin-top:6px}
.pl-ctl{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.pl-ctl .big{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--ver);color:#fff;box-shadow:0 8px 18px -8px rgba(200,69,47,.9)}
.pl-ctl .big.on{background:var(--ink)}
.pl-ctl .sk{position:relative;width:40px;height:40px;display:grid;place-items:center;color:var(--ink2)}
.pl-ctl .sk small{position:absolute;font-size:8px;font-weight:700;top:15px}
.pl-ctl .fv{width:40px;height:40px;display:grid;place-items:center;color:#C3B89F}
.pl-ctl .fv.on{color:var(--ver)}
.pl-ctl .fv.on .ic{fill:var(--ver)}
.para{margin:0 0 10px;font-size:14px;line-height:1.85;color:var(--ink2);padding:6px 10px;border-radius:6px;transition:background .3s,color .3s;font-family:var(--serif)}
.para.cur{background:#FBEFE6;color:var(--ink);box-shadow:inset 3px 0 0 var(--ver)}
.nf{display:flex;align-items:center;gap:10px;padding:8px 0;cursor:pointer}
.nf+.nf{border-top:1px dashed var(--line)}
.nf .fc-ic{width:32px;height:32px}
.nf b{flex:1;font-size:14px;font-weight:500}
.nf small{font-size:12px;color:var(--muted)}

/* ---------- 订单 ---------- */
.otabs{flex:none;display:flex;background:var(--page-bg);border-bottom:1px solid var(--line)}
.otabs button{flex:1;height:42px;font-size:14px;color:var(--ink2);position:relative;font-family:var(--serif)}
.otabs button.on{color:var(--ink);font-weight:700}
.otabs button.on::after{content:"";position:absolute;left:50%;bottom:0;width:22px;height:3px;margin-left:-11px;background:var(--ver)}
.ol-body{padding:10px 12px}
.tk{position:relative;display:flex;align-items:stretch;margin-bottom:12px;border-radius:10px;background:var(--card);border:1px solid rgba(160,130,80,.14);cursor:pointer;overflow:hidden}
.tk::before,.tk::after{content:"";position:absolute;right:66px;width:14px;height:14px;border-radius:50%;background:var(--page-bg);border:1px solid rgba(160,130,80,.14)}
.tk::before{top:-8px}.tk::after{bottom:-8px}
.tk:not(.unused)::before,.tk:not(.unused)::after{display:none}
.tk-l{padding:10px 0 10px 10px}
.tk-art{width:70px;height:88px;border-radius:6px;overflow:hidden}
.tk-art svg{width:100%;height:100%;display:block}
.tk-m{flex:1;min-width:0;padding:10px;display:flex;flex-direction:column;gap:3px}
.tk-m b{font-size:15px;font-family:var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-m small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-f{margin-top:auto;display:flex;align-items:center;justify-content:space-between}
.tk-f em{font-style:normal;font-size:12px;color:var(--brand);font-weight:600}
.tk.used .tk-f em,.tk.refund .tk-f em{color:#B8AC92}
.tk.used,.tk.refund{opacity:.85}
.tk-qr{width:74px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ver);border-left:1.5px dashed #E6DAC0}
.tk-qr small{font-size:11px}
.od-body{padding:4px 0 0}
.ticket{margin:6px 14px 0;border-radius:14px;background:var(--card);box-shadow:0 10px 30px -16px rgba(80,60,20,.4);overflow:hidden;border:1px solid rgba(160,130,80,.14)}
.tt-h{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(110deg,#2F6B5B,#1F4D41);color:#F6F0E4}
.tt-h div{display:flex;align-items:center;gap:8px}
.tt-h b{font-family:var(--kai);font-size:18px;letter-spacing:3px}
.tt-h em{font-style:normal;font-size:12px;padding:1px 8px;border-radius:3px;background:rgba(255,255,255,.18)}
.ticket.used .tt-h,.ticket.refund .tt-h{background:linear-gradient(110deg,#8F887A,#6E685C)}
.tt-b{padding:16px 18px 14px;text-align:center}
.tt-b h2{margin:0 0 12px;font-size:18px;font-family:var(--serif)}
.tt-kv{display:grid;grid-template-columns:1fr 1fr;text-align:left;padding:10px 12px;border-radius:8px;background:#F8F2E6}
.tt-kv div{display:grid;gap:2px}
.tt-kv div+div{padding-left:12px;border-left:1px solid var(--line)}
.tt-kv small{font-size:11px;color:var(--muted)}
.tt-kv b{font-size:14px}
.qr-wrap{position:relative;width:190px;height:190px;margin:16px auto 0;padding:12px;border-radius:12px;border:1px solid #E6DAC0;background:#fff}
.qrb{width:100%;height:100%}
.qrb svg{width:100%;height:100%;display:block}
.qrb.flip{animation:qrf .5s ease}
@keyframes qrf{from{transform:rotateY(90deg);opacity:.3}}
.qr-wrap.used .qrb{opacity:.18;filter:grayscale(1)}
.stamp{position:absolute;left:50%;top:50%;width:130px;height:130px;margin:-65px 0 0 -65px;animation:stamp .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes stamp{from{transform:scale(2.2);opacity:0}}
.code{margin-top:12px;font-size:22px;letter-spacing:3px;font-weight:700;color:var(--ink)}
.qr-tip{display:flex;align-items:center;justify-content:center;gap:4px;margin:6px 0 0;font-size:11.5px;color:var(--muted)}
.qr-tip span{color:var(--ver);font-weight:600}
.tt-refund{display:grid;justify-items:center;gap:6px;padding:26px 0 10px;color:var(--muted)}
.tt-refund b{font-size:18px;color:var(--ink)}
.tt-refund small{font-size:12px}
.tt-cut{position:relative;height:16px;display:flex;align-items:center}
.tt-cut i{width:16px;height:16px;border-radius:50%;background:var(--page-bg);flex:none}
.tt-cut i:first-child{margin-left:-8px}.tt-cut i:last-child{margin-right:-8px}
.tt-cut s{flex:1;border-top:1.5px dashed #E0D3B8;margin:0 6px}
.tt-l{padding:6px 18px 14px}
.ln{display:flex;align-items:center;gap:10px;padding:8px 0}
.ln+.ln{border-top:1px solid var(--line)}
.ln div{flex:1;display:grid;gap:2px}
.ln b{font-size:14px}
.ln small{font-size:11.5px;color:var(--muted)}
.ln span{font-size:12px;color:#B8741E}
.ln span.ok{color:var(--brand)}
.demo-ctl{margin:12px 14px 0;display:flex;align-items:center;gap:6px;padding:9px 12px;border-radius:8px;border:1px dashed rgba(47,107,91,.5);background:rgba(228,238,232,.6);font-size:12.5px;color:var(--brand-d)}
.demo-ctl span{flex:1}
.kv{display:flex;justify-content:space-between;font-size:13.5px;padding:5px 0}
.kv span{color:var(--muted)}
.kv b{font-weight:500}
.kv b.price{font-size:16px}

/* 套票 */
.pl-body{padding-bottom:10px}
.pk-hero{margin:6px 12px 12px;padding:16px;border-radius:10px;background:linear-gradient(110deg,#C8452F,#A6362A);color:#FFF6EA;display:grid;gap:4px}
.pk-hero b{font-size:18px;font-family:var(--serif);letter-spacing:2px}
.pk-hero small{font-size:12px;opacity:.85}
.pp{margin-top:-6px;position:relative}
.pp-p{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.pp-p s{font-size:12.5px;color:#B8AC92}
.pp-p em{font-style:normal;font-size:11.5px;color:#fff;background:var(--ver);padding:1px 6px;border-radius:3px}
.inc-r{display:flex;align-items:center;gap:8px;padding:8px 0}
.inc-r+.inc-r{border-top:1px dashed var(--line)}
.inc-r span{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand)}
.inc-r b{flex:1;font-size:14px;font-weight:500}
.inc-r small{font-size:12px;color:var(--muted)}
.dates.sm button{width:62px}
.dates.sm button i{color:var(--ver)}

/* 我的 */
.mi-body{padding-bottom:10px}
.mi-hero{position:relative;height:230px}
.mi-hero>svg{position:absolute;inset:0;width:100%;height:100%}
.mi-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,40,34,.25),rgba(20,40,34,.1) 50%,var(--page-bg))}
.mi-hero .navbar{position:absolute;left:0;right:0;top:0}
.mi-u{position:absolute;left:18px;right:18px;top:calc(var(--sb) + 58px);display:flex;align-items:center;gap:12px;color:#fff}
.mi-av{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:var(--ver);font-family:var(--kai);font-size:26px;border:3px solid rgba(255,255,255,.8)}
.mi-u h2{margin:0 0 4px;font-family:var(--serif);font-size:21px;letter-spacing:1px;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.mi-u small{font-size:12px;opacity:.9}
.mi-num{margin-top:-40px;position:relative;display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.mi-num div{display:grid;gap:2px;cursor:pointer}
.mi-num b{font-size:19px}
.mi-num small{font-size:11.5px;color:var(--muted)}
.card.yk{display:flex;align-items:center;gap:10px;background:linear-gradient(110deg,#2B2A26,#45413A);color:#F2E6CC;border:0}
.yk div{flex:1;display:grid;gap:4px}
.yk b{font-family:var(--kai);font-size:17px;letter-spacing:2px;color:#E7C98A}
.yk small{font-size:11.5px;opacity:.8}
.yk .btn.primary{background:linear-gradient(90deg,#E7C98A,#C9962E);color:#2B2A26}
.card.menu{padding:2px 14px}
.mi{display:flex;align-items:center;gap:12px;padding:14px 0;font-size:14.5px;cursor:pointer}
.mi+.mi{border-top:1px solid var(--line)}
.mi>.ic:first-child{color:var(--brand)}
.mi span{flex:1}
.ver{text-align:center;font-size:11.5px;color:#B8AC92;padding:20px 0}
.mc-m>small{display:block}
.mc-m>small .ic{vertical-align:-2px;margin-right:2px}
.dates.sm button.on i{color:#fff}
.sd-hero::before{content:"";position:absolute;left:0;right:0;top:0;height:110px;background:linear-gradient(180deg,rgba(246,240,228,.75),transparent);z-index:1;pointer-events:none}
.page:has(.minipl.show) .m-card{bottom:72px}
.pk-hol{display:flex;align-items:center;gap:6px;font-size:12px;color:#9C8B6A;margin:10px 0 14px}

/* ============ 商家后台（Web 视图，演示数据） ============ */
.ba{min-height:100vh;background:var(--ba-bg);color:#1f2328;font-size:14px;line-height:1.5}
.ba *{box-sizing:border-box}
.ba button{font:inherit;cursor:pointer}
.ba-top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:22px;height:58px;padding:0 24px;background:var(--ba-top);color:#fff}
.ba-brand{display:flex;align-items:center;gap:10px;flex:none}
.ba-brand b{font-size:16px;letter-spacing:.5px}.ba-brand small{display:block;font-size:11px;opacity:.65;line-height:1.2}
.ba-logo{width:30px;height:30px;border-radius:8px;background:var(--ba-brand);display:grid;place-items:center;color:#fff}
.ba-nav{display:flex;gap:4px;flex:1;min-width:0}
.ba-nav a{display:flex;align-items:center;gap:6px;height:34px;padding:0 13px;border-radius:8px;color:rgba(255,255,255,.72);text-decoration:none;font-size:13.5px;white-space:nowrap}
.ba-nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.ba-nav a.on{color:#fff;background:rgba(255,255,255,.16)}
.ba-r{display:flex;align-items:center;gap:12px;flex:none;font-size:12.5px}
.ba-r a{color:#fff;text-decoration:none;display:flex;align-items:center;gap:4px;height:32px;padding:0 12px;border:1px solid rgba(255,255,255,.25);border-radius:8px}
.ba-u{display:flex;align-items:center;gap:8px}.ba-u i{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-style:normal;font-size:13px}
.ba-u small{display:block;opacity:.65;font-size:11px;line-height:1.2}
.ba-main{max-width:1400px;margin:0 auto;padding:22px 24px 64px}
.ba-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.ba-head h1{margin:0;font-size:22px}.ba-head p{margin:4px 0 0;color:#6b7280;font-size:12.5px}
.ba-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.ba-kpi{background:#fff;border:1px solid #e8eaed;border-radius:12px;padding:14px 16px;min-width:0}
.ba-kpi small{display:block;color:#6b7280;font-size:12.5px}
.ba-kpi b{display:block;font-size:24px;margin:4px 0 2px;font-variant-numeric:tabular-nums}.ba-kpi b em{font-style:normal;font-size:13px;font-weight:400;color:#6b7280;margin-left:3px}
.ba-kpi span{font-size:12px;color:#6b7280}.ba-kpi span.w{color:#c2410c}.ba-kpi span.g{color:#15803d}
.ba-card{background:#fff;border:1px solid #e8eaed;border-radius:12px;padding:16px 18px;margin-bottom:16px;min-width:0}
.ba-ch{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.ba-ch h3{margin:0;font-size:15.5px}.ba-ch small{color:#6b7280;font-size:12px;font-weight:400;margin-left:6px}
.ba-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ba-tools select,.ba-in{height:32px;border:1px solid #dfe3e8;border-radius:8px;padding:0 10px;background:#fff;font-size:13px;outline:0;color:inherit;font-family:inherit}
.ba-in:focus,.ba-tools select:focus{border-color:var(--ba-brand)}
.ba-seg{display:flex;flex-wrap:wrap;gap:4px;background:#f1f3f5;border-radius:9px;padding:3px}
.ba-seg button{height:28px;padding:0 11px;border:0;border-radius:7px;background:none;font-size:13px;color:#4b5563;white-space:nowrap}
.ba-seg button.on{background:#fff;color:var(--ba-brand);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.ba-seg em{font-style:normal;font-size:11.5px;margin-left:3px;color:#9ca3af}
.ba-btn{height:32px;padding:0 14px;border-radius:8px;border:1px solid #dfe3e8;background:#fff;font-size:13px;color:#1f2328;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.ba-btn.pri{background:var(--ba-brand);border-color:var(--ba-brand);color:#fff}
.ba-btn.sm{height:28px;padding:0 10px;font-size:12.5px}
.ba-btn.lnk{border:0;background:none;color:var(--ba-brand);padding:0 4px}
.ba-btn:disabled{opacity:.45;cursor:not-allowed}
.ba-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:16px}
.ba-tw{overflow-x:auto}
.ba-t{width:100%;border-collapse:collapse;font-size:13px}
.ba-t th{text-align:left;font-weight:500;color:#6b7280;background:#f8f9fa;padding:9px 10px;white-space:nowrap;font-size:12.5px}
.ba-t td{padding:10px;border-top:1px solid #f0f1f3;vertical-align:middle}
.ba-t td small{display:block;color:#8b929b;font-size:11.5px}
.ba-t .r{text-align:right}.ba-t .num,.ba-num{font-variant-numeric:tabular-nums}
.ba-t tr.clk{cursor:pointer}.ba-t tr.clk:hover td{background:#fafbfc}
.ba-t .none{text-align:center;color:#9ca3af;padding:36px}
.ba-tag{display:inline-block;padding:1px 8px;border-radius:99px;font-size:12px;white-space:nowrap;background:#f1f3f5;color:#4b5563}
.ba-tag.b{background:var(--ba-soft);color:var(--ba-brand)}.ba-tag.o{background:#fff4e5;color:#c2410c}.ba-tag.g{background:#e9f7ef;color:#15803d}.ba-tag.r{background:#fdecec;color:#c62828}.ba-tag.gr{background:#f1f3f5;color:#9ca3af}
.ba-bar{display:inline-block;width:80px;height:6px;border-radius:3px;background:#eef0f2;vertical-align:middle;margin-right:6px;overflow:hidden}.ba-bar i{display:block;height:100%;background:var(--ba-brand);border-radius:3px}
.ba-pg{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;font-size:12.5px;color:#6b7280;flex-wrap:wrap}
.ba-pg div{display:flex;gap:4px}.ba-pg button{min-width:30px;height:28px;border:1px solid #dfe3e8;background:#fff;border-radius:7px;font-size:12.5px}
.ba-pg button.on{background:var(--ba-brand);border-color:var(--ba-brand);color:#fff}.ba-pg button:disabled{opacity:.4}
.ba-chart{height:260px}
.ba-mask{position:fixed;inset:0;background:rgba(15,20,25,.38);z-index:90;opacity:0;transition:opacity .2s}
.ba-mask.show{opacity:1}
.ba-dr{position:fixed;top:0;right:0;bottom:0;width:min(480px,100%);background:#fff;z-index:91;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .25s;box-shadow:-8px 0 24px rgba(0,0,0,.12)}
.ba-dr.show{transform:none}
.ba-md{position:fixed;left:50%;top:50%;width:min(460px,calc(100% - 32px));max-height:calc(100% - 48px);background:#fff;border-radius:14px;z-index:91;display:flex;flex-direction:column;transform:translate(-50%,-46%);opacity:0;transition:all .2s}
.ba-md.show{transform:translate(-50%,-50%);opacity:1}
.ba-dh{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid #f0f1f3}
.ba-dh b{font-size:15.5px}.ba-dh button{border:0;background:none;color:#6b7280;width:30px;height:30px;border-radius:8px}
.ba-db{flex:1;overflow:auto;padding:16px 18px}
.ba-df{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px;border-top:1px solid #f0f1f3}
.ba-kv{display:grid;grid-template-columns:96px 1fr;gap:8px 12px;font-size:13px;margin-bottom:14px}.ba-kv dt{color:#6b7280}.ba-kv dd{margin:0}
.ba-sec{font-size:13px;font-weight:600;margin:14px 0 8px}
.ba-opt{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #e8eaed;border-radius:10px;margin-bottom:8px;cursor:pointer}
.ba-opt.on{border-color:var(--ba-brand);background:var(--ba-soft)}.ba-opt.off{opacity:.5;cursor:not-allowed}
.ba-opt b{font-size:13.5px}.ba-opt small{display:block;color:#6b7280;font-size:12px}.ba-opt .grow{flex:1;min-width:0}
.ba-sw{width:36px;height:20px;border-radius:99px;background:#d1d5db;position:relative;border:0;flex:none;transition:background .15s}
.ba-sw::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s}
.ba-sw.on{background:var(--ba-brand)}.ba-sw.on::after{left:18px}
.ba-note{font-size:12px;color:#6b7280;margin-top:8px}
.ba-f{display:block;margin-bottom:12px;font-size:13px}.ba-f span{display:block;color:#6b7280;margin-bottom:4px}
.ba-f input,.ba-f textarea{width:100%;border:1px solid #dfe3e8;border-radius:8px;padding:7px 10px;font:inherit;outline:0}
.ba-f input:focus,.ba-f textarea:focus{border-color:var(--ba-brand)}
.ba-f .err{color:#c62828;font-size:12px;margin-top:3px}
.ba-toast{position:fixed;left:50%;top:76px;transform:translate(-50%,-8px);background:rgba(20,24,28,.88);color:#fff;padding:8px 16px;border-radius:99px;font-size:13px;z-index:120;opacity:0;transition:all .2s;pointer-events:none;max-width:calc(100% - 32px)}
.ba-toast.show{opacity:1;transform:translate(-50%,0)}
.ba-hbar{display:flex;align-items:center;gap:10px;margin:7px 0;font-size:13px}.ba-hbar span{width:92px;flex:none;color:#4b5563;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ba-hbar .ba-bar{flex:1;width:auto;height:8px}.ba-hbar b{width:70px;text-align:right;font-weight:500;font-variant-numeric:tabular-nums}
@media (max-width:1100px){.ba-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ba-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .ba-top{flex-wrap:wrap;height:auto;padding:10px 14px 0;gap:8px 12px}
  .ba-brand{flex:1}.ba-u{display:none}
  .ba-nav{order:3;flex:1 0 100%;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
  .ba-main{padding:14px 12px 72px}
  .ba-head h1{font-size:19px}
  .ba-kpis{gap:10px}.ba-kpi{padding:12px}.ba-kpi b{font-size:20px}
  .ba-card{padding:14px 12px}
}
/* 后台表格：手机端按卡片显示 */
@media (max-width:640px){
  .ba-tw{overflow:visible}
  .ba-t,.ba-t tbody{display:block}
  .ba-t thead{display:none}
  .ba-t tbody>tr{display:block;border:1px solid #e8eaed;border-radius:12px;padding:10px 12px;margin-bottom:10px;background:#fff}
  .ba-t tbody>tr>td{display:block;border:0;padding:4px 0;text-align:right;overflow:hidden}
  .ba-t tbody>tr>td[data-l]::before{content:attr(data-l);float:left;margin-right:12px;color:#8b929b;font-size:12px}
  .ba-t tbody>tr>td.c-first{text-align:left;padding:2px 0 8px;margin-bottom:4px;border-bottom:1px dashed #e8eaed}
  .ba-t tbody>tr>td.c-op{padding-top:8px}
  .ba-t tbody>tr.c-x>td{text-align:center}
  .ba-t td small{display:block}
  .ba-tools{width:100%}.ba-tools .ba-in{flex:1;min-width:0}
}
body.web-mode{background:#F4F1EA}
/* 手机上在线体验版标记固定在右下角：抽屉底部按钮留出位置，避免被遮挡 */
@media (max-width:640px){.ba-dr .ba-df{padding-bottom:40px}}

/* 手机：分段筛选横向滚动，不折行 */
@media (max-width:640px){.ba-seg{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none;-webkit-overflow-scrolling:touch}.ba-seg::-webkit-scrollbar{display:none}.ba-seg button{flex:none}}
.pm{cursor:pointer}.pm[data-m="card"] span{background:#B8862F}.pay-err{min-height:18px;margin:6px 2px 6px;font-size:12.5px;color:#C8452F}

/* 手机全屏：可读性与触控区（仅 ≤600px，桌面手机框不变） */
@media (max-width:600px){
  :root{--muted:#736B5C}
  .tabbar a{color:#7C725D}
  .list-end,.pk-f s,.pk-f em,.ft,.pay-tip,.vr-h button,.tk.used .tk-f em,.tk.refund .tk-f em,.pp-p s,.ver,.pk-hol{color:#736B5C}
  .ln span{color:#A2661A}.sl-r span.low{color:#955E18}.sl small{color:#70685A}
  .pl-ctl .sk small{font-size:10px;top:14px}
  .list-end,.st-row small,.st-row em,.flow-h small,.sp small,.sl small,.bb-l small,.pay-tip,.mc-m>small,.spl-m small,.pl-top small,.qr-tip,.ln small,.mi-num small,.ver,.ft,.tt-kv small{font-size:12px}
  .voices button,.rates button,.nb-back,.mf>button,.fv,.pl-btn,.vl>button,.m-ctl>button,.vc,.m-rt>button,.stepper>button,.mi-num>div,.btn.sm,.mp-btn,.mp-x,.sec-h>a,.mc-b .btn{position:relative}
  .voices button::after,.rates button::after{content:"";position:absolute;inset:-11px -2px}
  .nb-back::after,.m-ctl>button::after,.pl-btn::after,.mp-btn::after{content:"";position:absolute;inset:-5px}
  .fv::after,.sk::after{content:"";position:absolute;inset:-2px}
  .vl>button::after{content:"";position:absolute;inset:-6px}
  .mf>button::after,.m-rt>button::after,.btn.sm::after,.mc-b .btn::after{content:"";position:absolute;inset:-8px 0}
  .vc::after{content:"";position:absolute;inset:-6px 0}
  .stepper>button::after{content:"";position:absolute;inset:-8px -7px}
  .mi-num>div::after{content:"";position:absolute;inset:-3px 0}
  .mp-x::after{content:"";position:absolute;inset:-13px -9px}
  .sec-h>a::after{content:"";position:absolute;inset:-13px -4px}
  .mc-x::after{content:"";position:absolute;inset:-9px}
  .seek::before{inset:-16px 0}
  .bbar .btn{position:relative}.bbar .btn::after{content:"";position:absolute;inset:-2px 0}
}
