:root{
  /* 沉稳绿 + 暖橙点缀（教育培训）—— 主色更有质感，价格/重点用暖橙跳出来 */
  --green:#2E8B6B; --green-deep:#237A5B; --green-soft:#E8F4EE;
  --accent:#D98A3D;                                   /* 暖橙：价格、重点、未读 */
  --pink:#D98A3D; --violet:#2E8B6B; --amber:#DFA24A;  /* 旧变量名沿用 */
  --blue:#2E8B6B; --indigo:#237A5B; --slate:#586A60; --sky:#4FA997;
  --ink:#20302A; --grey:#6C7B72; --line:#E7EDE9; --bg:#F6F9F5;
  --ugrad:linear-gradient(135deg,#3BA07B,#2E8B6B);
  --ugrad2:linear-gradient(135deg,#F0CB83,#E2AC5A);
  --bgrad:linear-gradient(135deg,#349079,#26805F);
  --shadow:0 10px 26px rgba(28,80,60,.10);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased;}
body{font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);}
button{font-family:inherit;cursor:pointer;}
img{max-width:100%;}
input,select,textarea{font-family:inherit;}

/* top bar */
.topnav{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:12px 18px;}
.topnav .brand{font-weight:800;font-size:18px;display:flex;align-items:center;gap:8px;}
.topnav .brand .sq{width:46px;height:46px;border-radius:50%;background:#fff center/cover no-repeat url('/logo.png?v=2');border:1px solid var(--line);}
.topnav .sp{margin-left:auto;}
.topnav .pts{background:#FFF3E0;color:#C77700;font-size:12px;font-weight:800;padding:6px 11px;border-radius:20px;}
.topnav .lnk{font-size:13px;font-weight:700;color:var(--violet);background:none;border:none;}

/* generic */
.wrap{max-width:460px;margin:0 auto;padding:14px 16px 90px;}
.wrap.wide{max-width:1080px;}
.muted{color:var(--grey);}
.center{text-align:center;}
.empty{text-align:center;color:var(--grey);font-size:13px;padding:36px 10px;}
.hidden{display:none!important;}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--ugrad);color:#fff;border:none;border-radius:14px;padding:14px;font-size:15px;font-weight:700;width:100%;box-shadow:0 8px 18px rgba(46,139,107,.24);}
.btn:disabled{opacity:.5;box-shadow:none;}
.btn.sm{padding:10px 18px;width:auto;font-size:14px;}
.btn.ghost{background:#fff;color:var(--violet);border:1.5px solid var(--violet);box-shadow:none;}
.btn.blue{background:var(--bgrad);box-shadow:0 8px 18px rgba(46,139,107,.22);}

.chip{display:inline-flex;align-items:center;gap:5px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:8px 15px;font-size:13px;font-weight:600;color:var(--grey);white-space:nowrap;}
.chip.on{background:var(--ugrad);color:#fff;border-color:transparent;}
.seg{display:inline-flex;background:#EDF1EC;border-radius:12px;padding:4px;}
.seg button{border:none;background:transparent;font-size:12.5px;font-weight:700;color:#7C8A81;padding:8px 12px;border-radius:9px;white-space:nowrap;}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.08);}

.searchbar{display:flex;align-items:center;gap:8px;background:#EDF1EC;border-radius:14px;padding:11px 14px;}
.searchbar input{border:none;background:transparent;outline:none;flex:1;font-size:14px;}

.field{margin-bottom:14px;}
.field label{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px;}
.field input,.field select,.field textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;font-size:14px;background:#fff;outline:none;}
.field input:focus,.field select:focus{border-color:var(--blue);}

/* service card */
.scard{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-bottom:14px;box-shadow:var(--shadow);}
.scard .ph{aspect-ratio:3/2;width:100%;position:relative;display:flex;align-items:flex-end;padding:10px;background-position:center;background-repeat:no-repeat;background-size:cover;}
.scard .ph .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.30);display:flex;align-items:center;justify-content:center;font-size:17px;color:#fff;border:1.5px solid rgba(255,255,255,.7);}
.scard .ph .tag{background:rgba(0,0,0,.36);color:#fff;font-size:11px;font-weight:700;padding:4px 9px;border-radius:20px;}
.scard .bd{padding:12px 14px 14px;}
.scard .bd h4{font-size:15px;margin-bottom:7px;}
.scard .meta{display:flex;align-items:center;justify-content:space-between;}
.scard .price{color:var(--pink);font-weight:800;font-size:16px;}
.scard .price small{font-size:11px;color:var(--grey);font-weight:600;}
.scard .stars{font-size:12px;color:var(--grey);font-weight:600;}
.scard .biz{font-size:12px;color:var(--grey);margin-top:8px;display:flex;align-items:center;gap:6px;}
.scard .av{width:17px;height:17px;border-radius:50%;background:var(--ugrad2);display:inline-block;}
.vbadge{font-size:10px;font-weight:700;padding:3px 8px;border-radius:6px;white-space:nowrap;display:inline-block;}
.v-public{background:#E8F1EC;color:#2E8B63;}.v-login{background:#FBF0DE;color:#B57A22;}.v-customer{background:#E7F1EA;color:#1F7D54;}

.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:14px;}
.back{width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:12px;}

.hero{height:340px;border-radius:0;position:relative;display:flex;align-items:center;justify-content:center;color:#fff;background-color:#F4F8F5;background-position:center;background-repeat:no-repeat;background-size:contain;}
@media(max-width:720px){.hero{height:280px;}}
.lock{position:absolute;inset:0;background:rgba(20,18,31,.6);backdrop-filter:blur(3px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#fff;text-align:center;padding:26px;}
.rev{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);}
.rev .av{width:34px;height:34px;border-radius:50%;background:var(--ugrad2);flex:none;}
.rev .nm{font-size:13px;font-weight:700;}.rev .sr{font-size:12px;color:var(--amber);}
.rev .tx{font-size:12.5px;color:#55605A;line-height:1.55;margin-top:4px;}
.rev .rp{font-size:11.5px;color:var(--violet);font-weight:700;margin-top:6px;background:var(--green-soft);padding:7px 10px;border-radius:8px;}

/* bottom tab —— 轻盈：激活用柔和绿底 + 绿色图标/文字，而非整块大药丸 */
.tabbar{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;width:min(390px,88vw);height:62px;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:24px;display:flex;padding:7px;gap:6px;box-shadow:0 14px 30px rgba(28,80,60,.14);backdrop-filter:saturate(1.2) blur(6px);z-index:30;}
.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:700;color:#9AA69D;border-radius:17px;transition:.18s;}
.tabbar a .ic{font-size:20px;line-height:0;display:block;transition:.18s;}
.tabbar a .ic svg{width:23px;height:23px;display:block;}
.tabbar a.on{background:var(--green-soft);color:var(--green-deep);}
.tabbar a.on .ic{transform:translateY(-1px);}
/* 顶栏里的导航（首页/我的）——手机端隐藏，用底部悬浮条；电脑端显示，取代底部条 */
.topnav-tabs{display:none;}

#map{height:60vh;min-height:380px;border-radius:16px;overflow:hidden;border:1px solid var(--line);}
.leaflet-container{font-family:inherit;}

/* console (merchant/admin) */
.console{display:flex;min-height:calc(100vh - 57px);}
.side{width:210px;flex:none;background:var(--green-soft);color:var(--slate);padding:20px 14px;border-right:1px solid var(--line);display:flex;flex-direction:column;}
.side.admin{background:#EAF3EE;}
.side .logo{display:flex;align-items:center;gap:9px;font-weight:800;color:var(--green-deep);font-size:15px;margin-bottom:22px;}
.side .logo .sq{width:50px;height:50px;border-radius:50%;background:#fff center/cover no-repeat url('/logo.png?v=2');border:1px solid rgba(255,255,255,.5);}
.side nav a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;color:#61716A;font-size:13.5px;font-weight:600;margin-bottom:3px;}
.side nav a.on{background:var(--green);color:#fff;box-shadow:0 6px 14px rgba(30,132,121,.28);}
.side nav a.on .ic{color:#fff;}
.side nav a .ic{line-height:0;display:block;color:#7E8D86;}
.side nav a .ic svg{width:20px;height:20px;display:block;}
.main{flex:1;min-width:0;}
.chead{height:58px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:#fff;}
.chead h3{font-size:17px;}
.content{padding:20px 22px;}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:18px;}
.stat{border-radius:14px;padding:16px;color:#fff;}
.stat:nth-child(1){background:var(--bgrad);}.stat:nth-child(2){background:linear-gradient(135deg,#5FA98C,#4A9174);}
.stat:nth-child(3){background:linear-gradient(135deg,#57B3A6,#3F9C90);}.stat:nth-child(4){background:linear-gradient(135deg,#E6B26A,#D5943F);}
.stat .k{font-size:12px;opacity:.92;font-weight:600;}.stat .v{font-size:26px;font-weight:800;margin-top:4px;}
table{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff;}
th{text-align:left;color:var(--grey);font-weight:700;font-size:11px;text-transform:uppercase;padding:10px;border-bottom:1px solid var(--line);}
td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle;}
.thumb{width:42px;height:32px;border-radius:7px;display:inline-block;vertical-align:middle;margin-right:9px;}
.st{font-size:11px;font-weight:700;padding:4px 10px;border-radius:20px;white-space:nowrap;display:inline-block;}
.st.up{background:#E7F8EF;color:#0E9F6E;}.st.down{background:#F1F0F8;color:#9893AC;}.st.pend{background:#FFF3E0;color:#C77700;}
.bbtn{background:var(--bgrad);color:#fff;border:none;font-size:13px;font-weight:700;padding:9px 14px;border-radius:9px;white-space:nowrap;}
.bbtn.sec{background:#fff;color:var(--blue);border:1.5px solid var(--blue);}
.tg{width:42px;height:23px;border-radius:20px;background:#16A34A;position:relative;display:inline-block;vertical-align:middle;}
.tg.off{background:#CFCBDD;}
.tg::after{content:"";position:absolute;top:2px;width:19px;height:19px;border-radius:50%;background:#fff;right:2px;}
.tg.off::after{right:auto;left:2px;}

#toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);background:#14121F;color:#fff;padding:13px 22px;border-radius:30px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:.25s;z-index:99;}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

@media(max-width:720px){.console{flex-direction:column;min-height:auto;}.side{width:auto;padding:14px 12px;}
  /* 手机上后台菜单改成网格铺开：所有入口一屏全见，不用左右滑 */
  .side .logo{margin-bottom:12px;font-size:14px;}
  .side .logo .sq{width:34px;height:34px;}
  .side nav{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;}
  .side nav a{flex-direction:column;align-items:center;justify-content:center;gap:3px;text-align:center;padding:10px 4px;margin:0;font-size:11.5px;line-height:1.25;background:rgba(255,255,255,.55);border-radius:12px;white-space:normal;word-break:keep-all;min-height:60px;}
  .side nav a .ic svg{width:22px;height:22px;}
  .side nav a.on{background:var(--green);color:#fff;box-shadow:0 6px 14px rgba(30,132,121,.28);font-weight:800;}
  .side nav a.on .ic{color:#fff;}
  .stats{grid-template-columns:repeat(2,1fr);}
  /* 手机上后台内容区可整体左右滑动，表格列不再被挤压、标签一行显示 */
  .content{padding:14px;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .content table{min-width:600px;}
  .content td,.content th{padding:10px 8px;}
  /* 手机上：把「商家名+退出登录+版本号」这个块从顶部搬到页面最下端，浮在底部方便点 */
  .side{padding-bottom:8px;}
  .side .foot{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:80;
    background:#fff;border:1px solid var(--line);border-radius:14px;
    padding:10px 14px;box-shadow:0 6px 18px rgba(0,0,0,.10);
    margin-top:0;border-top:0;
    display:flex;align-items:center;gap:10px;}
  .side .foot > div{flex:1;min-width:0;margin:0;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .side .foot > button{flex:none!important;width:auto!important;padding:9px 16px!important;font-size:13px!important;margin:0!important;}
  .side .foot > div{flex:1!important;text-align:left;}
  .side .foot .foot-tier,.side .foot .foot-ver{display:none!important;}  /* 手机浮底：不显示档位徽章 / 版本号（页面上有其他显示位置） */
  .main{padding-bottom:88px;}
}

/* ================= 直播模块 ================= */
.livedot{display:inline-flex;align-items:center;gap:4px;background:#DB5A3C;color:#fff;font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:20px;white-space:nowrap}
.livedot.big{font-size:11.5px;padding:5px 11px;animation:lvpulse 1.8s ease-in-out infinite}
.tag.live{background:#DB5A3C!important;color:#fff;font-weight:800}
@keyframes lvpulse{0%,100%{opacity:1}50%{opacity:.62}}

.livebanner{display:flex;align-items:center;gap:11px;background:linear-gradient(135deg,#E1693F,#CB4E2F);color:#fff;
  border-radius:14px;padding:13px 15px;margin-bottom:14px;cursor:pointer;box-shadow:0 6px 18px rgba(203,78,47,.26)}
.livebanner .pulse{width:10px;height:10px;border-radius:50%;background:#fff;flex:none;animation:lvpulse 1.2s ease-in-out infinite}

.lvstage{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden}
.lvstage video{width:100%;height:100%;object-fit:contain;background:#000;display:block}

.livecount{margin-top:11px;background:#EEF5F0;border:1px solid #CFE4D8;color:#2A6B4E;
  font-size:12px;padding:9px 13px;border-radius:11px;line-height:1.6}
.livecount.ok{background:#E7F8EF;border-color:#B7E9CE;color:#0B6B47}
.livecount b{font-variant-numeric:tabular-nums}

.camgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:9px}
.camtile{border:1.5px solid var(--line);border-radius:12px;padding:11px 10px;background:#fff;cursor:pointer;transition:.15s}
.camtile .cn{font-size:12.5px;font-weight:800;line-height:1.35}
.camtile .cd{font-size:10.5px;color:var(--grey);margin-top:3px;line-height:1.35}
.camtile.on{border-color:var(--green);background:var(--green-soft);box-shadow:0 0 0 3px rgba(46,139,99,.12)}
.camtile.locked{background:#F7F6FA;border-style:dashed;opacity:.75;cursor:not-allowed}
.camtile.locked .cn{color:var(--grey)}

.vis{font-size:10px;font-weight:800;padding:2px 7px;border-radius:6px;margin-left:5px;white-space:nowrap}
.vis.v-public{background:#E8F1EC;color:#2E8B63}
.vis.v-customer{background:#E7F1EA;color:#1F7D54}

/* ================= 在线聊天 ================= */
.chatbox{height:60vh;min-height:300px;overflow-y:auto;background:#F4F3FA;border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px;}
.cbrow{display:flex;}
.cbrow.me{justify-content:flex-end;}
.cbrow.them{justify-content:flex-start;}
.cbub{max-width:78%;padding:9px 13px;border-radius:14px;font-size:14px;line-height:1.5;word-break:break-word;box-shadow:0 1px 3px rgba(30,15,60,.06);}
.cbrow.them .cbub{background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px;}
.cbrow.me .cbub{background:var(--ugrad);color:#fff;border-bottom-right-radius:4px;}
.chatinput{position:fixed;left:50%;transform:translateX(-50%);bottom:84px;width:min(430px,92vw);display:flex;gap:8px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:6px 6px 6px 16px;box-shadow:0 8px 22px rgba(30,15,60,.12);z-index:20;}
.chatinput input{flex:1;border:none;outline:none;font-size:14px;background:transparent;}
.chatinput .btn.sm{border-radius:22px;}
.cbadge{display:inline-block;min-width:18px;height:18px;line-height:18px;text-align:center;background:var(--pink);color:#fff;font-size:11px;font-weight:800;border-radius:20px;padding:0 5px;margin-left:4px;}
/* 商家端聊天输入框不固定在底部（在控制台内） */
.console .chatinput{position:static;transform:none;width:100%;margin-top:12px;box-shadow:none;}
.console .chatinput .bbtn{border-radius:22px;}

/* ===== 电脑端（宽屏）：首页做成多列网格，不再是手机窄条 ===== */
.sgrid{display:block;}
@media(min-width:860px){
  .wrap.home{max-width:1120px;padding-left:30px;padding-right:30px;padding-bottom:40px;}
  .wrap.home .searchbar{max-width:560px;}
  .home .sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;align-items:start;}
  .home .sgrid .scard{margin-bottom:0;}
  /* 电脑端首页卡片图片：保持 3:2 横长方形（跟手机一致），铺满整个卡片宽度 */
  .home .scard .ph{height:auto;aspect-ratio:3/2;width:100%;}
  /* 宽屏：导航移到顶栏，做成网站式横向标签，隐藏底部悬浮条 */
  .topnav-tabs{display:flex;gap:4px;margin-left:22px;}
  .topnav-tabs a{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:#8A968E;padding:7px 15px;border-radius:11px;transition:.15s;cursor:pointer;}
  .topnav-tabs a .ic{line-height:0;display:block;}
  .topnav-tabs a .ic svg{width:18px;height:18px;display:block;}
  .topnav-tabs a:hover{background:#F0F5F2;color:var(--green-deep);}
  .topnav-tabs a.on{background:var(--green-soft);color:var(--green-deep);}
  .tabbar{display:none;}
  .wrap{padding-bottom:40px;}
}

/* 详情页：手机单栏，电脑两栏（左信息 / 右预约框） */
.detailgrid{display:block;}
.bookpanel{background:#fff;}
@media(min-width:860px){
  .detailwrap{max-width:1040px;margin:0 auto;}
  .wrap.detail{max-width:1040px;padding-left:26px;padding-right:26px;padding-bottom:120px;}
  .detailgrid{display:grid;grid-template-columns:1fr 360px;gap:30px;align-items:start;}
  .dcol-side{position:sticky;top:78px;}
}
/* 确认弹窗 */
.mov{position:fixed;inset:0;background:rgba(20,25,22,.45);z-index:90;display:flex;align-items:flex-end;justify-content:center;}
.mbox{background:#fff;width:100%;max-width:440px;border-radius:20px 20px 0 0;padding:20px 20px 26px;box-shadow:0 -8px 30px rgba(0,0,0,.18);max-height:85vh;overflow-y:auto;-webkit-overflow-scrolling:touch;}
@media(min-width:600px){.mov{align-items:center;}.mbox{border-radius:20px;}}
/* 电脑端「扫码去手机注册」的两个二维码：跟着卡片宽度自适应缩放，窄栏里也能并排放下 */
.regqr canvas,.regqr img{max-width:100%;height:auto;display:block;margin:0 auto;}

/* 密码显示切换（眼睛） */
.pwwrap{position:relative;}
.pwwrap input{width:100%;padding-right:44px;}
.pweye{position:absolute;right:10px;top:50%;transform:translateY(-50%);cursor:pointer;font-size:18px;user-select:none;opacity:.7;}
.pweye:hover{opacity:1;}

/* ===== 学员端 · 多路同屏（监控墙） ===== */
.livegrid{display:grid;gap:8px;grid-template-columns:repeat(2,1fr);margin-top:4px;}
.livegrid[data-n="1"]{grid-template-columns:1fr;}
.gtile{position:relative;aspect-ratio:4/3;background:#0c0c0f;border-radius:12px;overflow:hidden;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.12);}
.gtile video{width:100%;height:100%;object-fit:cover;display:block;background:#0c0c0f;}
.gtile .gt-badge{position:absolute;left:7px;top:7px;font-size:11px;color:#fff;background:rgba(0,0,0,.5);padding:2px 8px;border-radius:14px;max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gtile .gt-dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:12px;color:#cfcfd6;}
.gtile .gt-tap{position:absolute;right:7px;bottom:7px;font-size:10.5px;color:#fff;background:rgba(30,132,121,.85);padding:2px 8px;border-radius:14px;}
.gtile.locked{background:#EEEDF4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px;cursor:pointer;}
.gtile.locked .gt-lock{font-size:26px;opacity:.55;}
.gtile.locked .gt-name{font-size:13px;font-weight:800;color:#3a3550;margin-top:4px;}
.gtile.locked .gt-sub{font-size:11px;color:#7a5cff;margin-top:3px;line-height:1.4;}
/* 点开放大 · 占满屏幕 */
.lvfocus{position:fixed;inset:0;z-index:9000;background:#000;display:flex;align-items:center;justify-content:center;}
.lvfocus video{width:100%;height:100%;object-fit:contain;background:#000;}
.lvfocus-back{position:absolute;left:14px;top:calc(12px + env(safe-area-inset-top));z-index:2;background:rgba(0,0,0,.55);color:#fff;border:0;border-radius:22px;padding:9px 16px;font-size:14px;font-weight:700;cursor:pointer;}
.lvfocus-name{position:absolute;right:14px;top:calc(14px + env(safe-area-inset-top));z-index:2;color:#fff;background:rgba(0,0,0,.5);padding:6px 12px;border-radius:16px;font-size:13px;}
.lvfocus-tip{position:absolute;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:2;color:#eee;font-size:12px;background:rgba(0,0,0,.45);padding:5px 12px;border-radius:14px;}

/* ===== 自定义弹窗（替代浏览器自带 confirm/prompt） ===== */
.mdlmask{position:fixed;inset:0;z-index:99998;background:rgba(20,24,22,.45);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;padding:20px 16px;animation:mdlFade .16s ease-out;overflow-y:auto;-webkit-overflow-scrolling:touch;}
@keyframes mdlFade{from{opacity:0}to{opacity:1}}
@keyframes mdlPop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.mdlbox{background:#fff;border-radius:20px;max-width:340px;width:100%;padding:20px 18px 14px;box-shadow:0 20px 60px rgba(0,0,0,.28);animation:mdlPop .18s ease-out;margin:auto;}
@media (min-height: 620px){ .mdlmask{align-items:center;} }
.mdlbox .mdl-ico{font-size:30px;text-align:center;line-height:1;margin-bottom:10px;}
.mdlbox .mdl-title{font-size:16.5px;font-weight:800;text-align:center;color:#1b1b1b;margin-bottom:6px;}
.mdlbox .mdl-msg{font-size:13.5px;line-height:1.75;color:#6b6b78;text-align:center;white-space:pre-wrap;}
/* 内嵌 HTML 时不用 pre-wrap（否则源码里的换行/缩进会变成可见空行） */
.mdlbox .mdl-msg > div{white-space:normal;}
.mdlbox .mdl-input{width:100%;margin-top:14px;padding:11px 13px;border:1.5px solid var(--line);border-radius:12px;font-size:15px;outline:none;box-sizing:border-box;}
.mdlbox .mdl-input:focus{border-color:var(--green);}
.mdlbox .mdl-btns{display:flex;gap:10px;margin-top:18px;}
.mdlbox .mdl-btns button{flex:1;border:0;border-radius:13px;padding:12px 10px;font-size:14.5px;font-weight:800;cursor:pointer;font-family:inherit;}
.mdlbox .mdl-cancel{background:#F1F1F5;color:#5b5b66;}
.mdlbox .mdl-ok{background:var(--green);color:#fff;}
.mdlbox .mdl-ok.danger{background:#E5484D;}

/* ===== 图片轮播（详情页） ===== */
.carousel{position:relative;overflow:hidden;}
.carousel .track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.carousel .track::-webkit-scrollbar{display:none;}
.carousel{background:#F4F8F5;}
.carousel .slide{flex:0 0 100%;scroll-snap-align:center;height:340px;background-color:#F4F8F5;background-position:center;background-repeat:no-repeat;background-size:contain;}
@media(max-width:720px){.carousel .slide{height:280px;}}
.carousel .dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:6px;pointer-events:none;}
.carousel .dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 1px 3px rgba(0,0,0,.35);transition:width .2s;}
.carousel .dots i.on{width:18px;border-radius:4px;background:#fff;}
.carousel .cnt{position:absolute;right:12px;bottom:10px;background:rgba(0,0,0,.45);color:#fff;font-size:11.5px;padding:3px 9px;border-radius:14px;pointer-events:none;}
/* ===== 一键美化 ===== */
.fxbar{display:flex;gap:8px;overflow-x:auto;padding:4px 0 2px;scrollbar-width:none;}
.fxbar::-webkit-scrollbar{display:none;}
.fxbar button{flex:none;border:1.5px solid var(--line);background:#fff;border-radius:11px;padding:8px 13px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;color:#5b5b66;}
.fxbar button.on{border-color:var(--green);background:var(--green-soft);color:var(--green-deep);}

/* 圆形按钮里的矢量图标（分享等） */
.back svg{width:18px;height:18px;display:block;color:var(--ink);}

/* 商家侧栏未读徽章：红点小数字 */
.side nav a{position:relative;}
.side .nbadge{position:absolute;top:8px;right:10px;background:#D6494A;color:#fff;font-size:10.5px;font-weight:800;line-height:1;padding:3px 6px;border-radius:11px;min-width:18px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.18);}
.side nav a.on .nbadge{background:#fff;color:#D6494A;}
@media(max-width:720px){
  .side .nbadge{top:4px;right:4px;font-size:9.5px;padding:2px 5px;}
}