/* ==========================================================================
   鹊百龄 QUEBAILING · 门店分布系统
   品牌主色：墨绿 #004b36  /  品牌金 #d4ab44
   ========================================================================== */

:root{
  --green:#004b36;
  --green-900:#00251b;
  --green-800:#00311f;
  --green-700:#004b36;
  --green-600:#0a6349;
  --green-500:#12805e;
  --green-400:#1d9d74;
  --green-300:#3fb98d;
  --green-200:#72d0ac;

  --gold:#d4ab44;
  --gold-300:#e6c775;
  --gold-600:#ab8629;
  --gold-soft:rgba(212,171,68,.16);

  --font:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans CN","Noto Sans CJK SC",system-ui,sans-serif;
  --mono:"DIN Alternate","Bahnschrift","SF Mono",Consolas,"PingFang SC",monospace;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ==========================================================================
   前台 · 地图大屏
   ========================================================================== */

body.front{
  --bg:#02150f;
  --panel:rgba(4,40,29,.74);
  --line:rgba(212,171,68,.16);
  --line2:rgba(212,171,68,.32);
  --txt:#e9f5ef;
  --dim:#8fb0a2;
  --dim2:#5f8172;

  --c0:#0b241b;
  --c1:#0f3a2d;
  --c2:#15503c;
  --c3:#1b6a4e;
  --c4:#248b66;
  --c5:#3db488;
  background:var(--bg); color:var(--txt); overflow:hidden;
}

#app{
  height:100vh;width:100vw;display:flex;flex-direction:column;position:relative;
  background:
    radial-gradient(1100px 620px at 50% 46%, rgba(18,128,94,.20), transparent 62%),
    radial-gradient(820px 460px at 82% 6%, rgba(212,171,68,.08), transparent 60%),
    linear-gradient(180deg,#02150f 0%,#031a13 55%,#02120d 100%);
}
#app::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;
  background-image:linear-gradient(rgba(63,185,141,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(63,185,141,.06) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 46%,#000 30%,transparent 78%);
  mask-image:radial-gradient(ellipse at 50% 46%,#000 30%,transparent 78%);
}
#app:fullscreen,#app:-webkit-full-screen{width:100%;height:100%}
#app.focus .kpis,#app.focus .panel{display:none}
#app.focus .stage{grid-template-columns:1fr;padding:12px 16px 16px}

/* ---- 顶栏：左 logo / 中标题 / 右工具 ---- */
.topbar{
  flex:0 0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:16px;padding:13px 22px 12px;border-bottom:1px solid var(--line);
  position:relative;z-index:5;
  background:linear-gradient(180deg,rgba(0,37,27,.94),rgba(0,37,27,.30));
}
.topbar .lead{display:flex;align-items:center;gap:13px;min-width:0}
.topbar .lead img{height:38px;width:auto;flex:0 0 auto}
.topbar .lead .sub{font-size:11px;color:var(--dim2);letter-spacing:2.2px;white-space:nowrap}
.title{text-align:center;min-width:0}
.title h1{
  font-size:21px;font-weight:700;letter-spacing:3px;color:#fff;white-space:nowrap;
  text-shadow:0 0 22px rgba(212,171,68,.28);
}
.title .rule{
  display:flex;align-items:center;justify-content:center;gap:9px;margin-top:5px;
  font-size:10.5px;letter-spacing:3.4px;color:var(--gold);opacity:.85;
}
.title .rule::before,.title .rule::after{
  content:"";height:1px;width:34px;
  background:linear-gradient(90deg,transparent,var(--gold));
}
.title .rule::after{background:linear-gradient(90deg,var(--gold),transparent)}
.tools{display:flex;gap:8px;justify-content:flex-end;flex-wrap:nowrap}

.btn{
  display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:9px;cursor:pointer;
  background:rgba(10,99,73,.30);border:1px solid var(--line2);color:var(--dim);
  font-size:12.5px;font-family:var(--font);transition:.18s;white-space:nowrap;user-select:none;
}
.btn:hover{color:#fff;border-color:var(--gold);background:rgba(212,171,68,.14)}
.btn.on{color:#04241a;background:linear-gradient(145deg,var(--gold-300),var(--gold));
  border-color:transparent;font-weight:600}
.btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}

/* ---- KPI ---- */
.kpis{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  padding:12px 22px 4px;position:relative;z-index:4}
.kpi{padding:11px 14px;border-radius:12px;background:var(--panel);
  border:1px solid var(--line);position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--c5);opacity:.85}
.kpi:nth-child(1)::after{background:var(--gold)}
.kpi .lb{font-size:11.5px;color:var(--dim2);letter-spacing:.6px}
.kpi .vl{font-family:var(--mono);font-size:25px;font-weight:700;margin-top:3px;line-height:1}
.kpi .un{font-size:12px;color:var(--dim2);font-family:var(--font);margin-left:4px;font-weight:400}
.kpi:nth-child(1) .vl{color:var(--gold)}

/* ---- 主体三栏 ---- */
.stage{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:232px 1fr 300px;
  gap:12px;padding:12px 22px 16px;position:relative;z-index:3}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  display:flex;flex-direction:column;min-height:0;overflow:hidden}
.phd{flex:0 0 auto;padding:12px 14px 9px;font-size:12.5px;font-weight:600;letter-spacing:1px;
  color:var(--dim);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px}
.phd b{width:3px;height:12px;border-radius:2px;background:var(--gold);display:inline-block}
.phd .more{margin-left:auto;font-size:11px;color:var(--dim2);font-weight:400;letter-spacing:0}
.pbd{flex:1 1 auto;min-height:0;overflow-y:auto;padding:10px 12px 14px}
.pbd::-webkit-scrollbar{width:5px}
.pbd::-webkit-scrollbar-thumb{background:rgba(212,171,68,.28);border-radius:3px}
.pbd::-webkit-scrollbar-track{background:transparent}

/* 排行 */
.rk{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:8px;cursor:pointer;transition:.15s}
.rk:hover,.rk.sel{background:rgba(212,171,68,.12)}
.rk .no{font-family:var(--mono);font-size:12px;color:var(--dim2);width:17px;text-align:center;flex:0 0 auto}
.rk:nth-child(-n+3) .no{color:var(--gold)}
.rk .nm{font-size:12.5px;width:58px;flex:0 0 auto;color:#cfe4d9;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.rk .bw{flex:1 1 auto;height:5px;border-radius:3px;background:rgba(120,210,170,.12);overflow:hidden}
.rk .bw i{display:block;height:100%;border-radius:3px;
  background:linear-gradient(90deg,#1b6a4e,#3db488);width:0;
  transition:width .8s cubic-bezier(.2,.8,.2,1)}
.rk:nth-child(-n+3) .bw i{background:linear-gradient(90deg,var(--gold-600),var(--gold-300))}
.rk .vv{font-family:var(--mono);font-size:12.5px;width:32px;text-align:right;flex:0 0 auto;color:#7fd1ae}
.rk:nth-child(-n+3) .vv{color:var(--gold)}

/* 图例 */
.lg{display:flex;flex-direction:column;gap:7px}
.lgi{display:flex;align-items:center;gap:9px;font-size:11.5px;color:var(--dim)}
.lgi u{width:22px;height:11px;border-radius:3px;display:block;flex:0 0 auto;
  border:1px solid rgba(255,255,255,.07)}
.lgi b{margin-left:auto;font-family:var(--mono);color:var(--dim2);font-weight:400;font-size:11px}

/* 店铺列表 */
.slist{display:flex;flex-direction:column;gap:7px}
.sitem{padding:9px 11px;border-radius:10px;background:rgba(0,37,27,.5);
  border:1px solid rgba(212,171,68,.13)}
.sitem .n{font-size:13px;font-weight:600;color:#eaf6f0;display:flex;align-items:center;gap:7px}
.sitem .n::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold);flex:0 0 auto}
.sitem .sc{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:11px;
  letter-spacing:.4px;color:var(--gold);background:var(--gold-soft);
  border:1px solid rgba(212,171,68,.26);border-radius:5px;padding:1px 6px;flex:0 0 auto}
.sitem .a{font-size:11.5px;color:var(--dim);line-height:1.6;margin-top:4px;padding-left:12px}
.empty{padding:26px 10px;text-align:center;color:var(--dim2);font-size:12.5px;line-height:1.9}
.pager{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 0 2px;
  font-size:12px;color:var(--dim)}
.pager span{cursor:pointer;padding:3px 9px;border-radius:6px;border:1px solid var(--line)}
.pager span:hover{border-color:var(--gold);color:var(--gold)}
.pager span.off{opacity:.3;pointer-events:none}

/* ---- 地图 ---- */
.mapwrap{position:relative;border-radius:14px;border:1px solid var(--line);overflow:hidden;
  background:radial-gradient(760px 470px at 50% 48%,rgba(10,99,73,.18),rgba(2,18,13,.60) 70%);
  min-height:0}
#map{width:100%;height:100%;display:block;cursor:grab;touch-action:none}
#map.drag{cursor:grabbing}
/* 外轮廓：米色描边 + 光晕（gEdge 在省份下层，只露出最外一圈） */
.edge{filter:url(#edgeGlow);pointer-events:none}
.edge path{fill:#efe1bd;stroke:#f3e6c4;stroke-width:1.8px;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.prov path{fill:var(--c0);stroke:rgba(130,210,170,.2);stroke-width:1.8;stroke-linejoin:round;
  vector-effect:non-scaling-stroke;transition:fill .5s ease,stroke .2s,opacity .3s;cursor:pointer}
.prov.lit path{stroke:rgba(150,225,190,.28)}
/* 悬停 / 选中只换颜色，线宽和未选中一致 */
.prov:hover path{stroke:var(--gold-300)}
.prov.sel path{stroke:var(--gold)}
.prov.drillable:hover path{stroke:var(--gold)}
.plabel{font-size:10.5px;fill:#b6cec3;pointer-events:none;text-anchor:middle;
  paint-order:stroke;stroke:rgba(2,16,11,.86);stroke-width:2.6px;stroke-linejoin:round;
  transition:opacity .3s,fill .3s}
.plabel.lit{fill:#dff0e7}
.plabel.big{fill:var(--gold);font-weight:700;font-size:11.5px}
.plead{stroke:rgba(150,200,180,.35);stroke-width:.6;fill:none;vector-effect:non-scaling-stroke}
.dot{fill:var(--gold);stroke:rgba(2,16,11,.7);stroke-width:.5;
  vector-effect:non-scaling-stroke;transition:opacity .3s}
/* 自定义区域（开发区）标记：金色菱形，与正式行政区的圆点区分开 */
.cmark path{fill:var(--gold);stroke:#02150f;stroke-width:1.1;vector-effect:non-scaling-stroke;
  cursor:pointer;transition:filter .2s}
.cmark:hover path,.cmark.sel path{filter:drop-shadow(0 0 6px rgba(212,171,68,.95))}
.cmark.sel path{stroke:#fff;stroke-width:1.4}
.plabel.cmarkL{fill:var(--gold-300);font-size:10px;font-weight:600}
.pulse{fill:none;stroke:var(--gold);stroke-width:1.2;vector-effect:non-scaling-stroke;opacity:0;
  transform-box:fill-box;transform-origin:center}
.pulse.a{animation:pulse 2.6s ease-out infinite}
.pulse.b{animation:pulse 2.6s ease-out infinite .87s}
@keyframes pulse{0%{transform:scale(.35);opacity:.9}100%{transform:scale(3.6);opacity:0}}
.hqdot{fill:var(--gold);filter:url(#glow)}
.inset rect{fill:rgba(0,37,27,.5);stroke:var(--line2);stroke-width:1;vector-effect:non-scaling-stroke}
.inset text{font-size:9px;fill:var(--dim2);text-anchor:middle}
.inset path{fill:rgba(114,208,172,.32);stroke:rgba(243,230,196,.75);stroke-width:1.1;
  stroke-linejoin:round;vector-effect:non-scaling-stroke}
.flash path{filter:drop-shadow(0 0 7px rgba(61,180,136,.95))}

.crumb{position:absolute;left:14px;top:12px;z-index:6;display:flex;align-items:center;gap:6px;
  font-size:12px;background:rgba(0,30,22,.78);padding:6px 11px;border-radius:9px;
  border:1px solid var(--line)}
.crumb a{color:var(--dim);cursor:pointer;transition:.15s}
.crumb a:hover{color:var(--gold)}
.crumb .cur{color:var(--gold);font-weight:600}
.crumb i{color:var(--dim2);font-style:normal}
.mtools{position:absolute;right:12px;top:12px;display:flex;flex-direction:column;gap:6px;z-index:6}
.mbtn{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;cursor:pointer;
  background:rgba(0,30,22,.85);border:1px solid var(--line2);color:var(--dim);font-size:15px;
  transition:.15s;font-family:var(--mono);user-select:none}
.mbtn:hover{color:var(--gold);border-color:var(--gold)}
.mhint{position:absolute;left:14px;bottom:12px;font-size:10.5px;color:var(--dim2);letter-spacing:.5px;
  z-index:6;background:rgba(2,18,13,.6);padding:4px 9px;border-radius:7px;border:1px solid var(--line)}
.loading{position:absolute;inset:0;display:grid;place-items:center;z-index:8;
  background:rgba(2,18,13,.55);font-size:13px;color:var(--gold);letter-spacing:2px;
  opacity:0;pointer-events:none;transition:opacity .2s}
.loading.on{opacity:1}

.tip{position:absolute;pointer-events:none;z-index:20;opacity:0;transform:translate(-50%,-100%);
  transition:opacity .12s;min-width:140px;background:rgba(0,28,20,.96);
  border:1px solid var(--line2);border-radius:10px;padding:9px 11px;
  box-shadow:0 12px 34px rgba(0,0,0,.6)}
.tip.on{opacity:1}
.tip .th{font-size:13px;font-weight:700;margin-bottom:5px;color:#fff}
.tip .tr{display:flex;justify-content:space-between;gap:16px;font-size:11.5px;
  color:var(--dim);line-height:1.75}
.tip .tr b{font-family:var(--mono);font-weight:600;color:var(--gold)}
.tip .hintline{font-size:10.5px;color:var(--dim2);margin-top:5px;padding-top:5px;
  border-top:1px solid rgba(212,171,68,.15)}

@media (max-width:1240px){
  .stage{grid-template-columns:1fr 280px}
  .panel.left{display:none}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .title h1{font-size:17px;letter-spacing:2px}
}
@media (max-width:900px){
  .stage{grid-template-columns:1fr}
  .panel.right{display:none}
  .topbar{grid-template-columns:auto 1fr auto}
  .topbar .lead .sub{display:none}
}
.mhint .m{display:none}

/* ---- 手机：整页可滚动，地图按宽度等比，门店列表 / 排行 / 图例依次排在地图下面 ---- */
@media (max-width:640px){
  html,body.front{height:auto}
  body.front{overflow-x:hidden;overflow-y:auto}
  #app{height:auto;min-height:100vh;min-height:100dvh;width:100%}
  #app::before{background-size:32px 32px}

  .topbar{grid-template-columns:auto 1fr;gap:10px;padding:10px 14px 10px}
  .topbar .lead img{height:28px}
  .title{text-align:right}
  .title h1{font-size:16px;letter-spacing:1.5px}
  .title .rule{display:none}
  .tools{grid-column:1 / -1;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
  .btn{justify-content:center;gap:4px;padding:7px 2px;font-size:12px;border-radius:8px}
  .btn svg{width:13px;height:13px}

  .kpis{grid-template-columns:repeat(2,1fr);gap:8px;padding:10px 14px 0}
  .kpi{padding:9px 11px;border-radius:10px}
  .kpi .lb{font-size:11px}
  .kpi .vl{font-size:20px}

  .stage{display:flex;flex-direction:column;gap:10px;padding:10px 14px 18px}
  .mapwrap{flex:none;order:1;width:100%;height:calc((100vw - 28px) * .86 + 34px);border-radius:12px;
    display:flex;flex-direction:column}
  #map{flex:1 1 auto;min-height:0;height:auto}
  .panel.right{order:2}
  .panel.left{order:3}
  .panel.left,.panel.right{display:flex;border-radius:12px}
  .panel.left .pbd{overflow:visible}
  .panel.right .pbd{max-height:62vh;overflow-y:auto;-webkit-overflow-scrolling:touch}

  #map{touch-action:pan-x pan-y}
  .plabel{font-size:21px}
  .plabel.big{font-size:23px}
  .plabel.cmarkL{font-size:20px}
  .crumb{left:8px;top:8px;font-size:11px;padding:4px 8px}
  .mtools{right:8px;top:8px;gap:5px}
  .mbtn{width:28px;height:28px;font-size:14px}
  .mhint{position:static;flex:0 0 auto;margin:0 8px 8px;font-size:10px;text-align:center;padding:3px 6px}
  .mhint .pc{display:none}
  .mhint .m{display:inline}
}
/* 触屏不显示悬浮提示（点一下就会下钻，提示框会残留） */
@media (hover:none){
  .tip{display:none}
}

/* ==========================================================================
   后台 · 管理端
   ========================================================================== */

body.adm{background:#f4f7f5;color:#20302a;overflow:auto}

/* ---- 整体骨架：左侧固定导航 + 右侧内容 ---- */
.adm-shell{display:grid;grid-template-columns:216px 1fr;min-height:100vh}

/* ---- 左侧导航 ---- */
.side{
  background:linear-gradient(175deg,var(--green-900) 0%,var(--green-700) 62%,#003324 100%);
  color:#fff;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
  box-shadow:2px 0 16px rgba(0,45,32,.16);z-index:40
}
/* logo 图内已含「鹊百龄 + QUEBAILING」，整幅占一行；系统名单独一行且不换行 */
.side-brand{display:block;padding:16px 14px 14px;
  border-bottom:1px solid rgba(255,255,255,.10);flex:0 0 auto}
.side-brand img{width:100%;max-width:158px;height:auto;display:block}
.side-brand .sys{display:block;margin-top:9px;font-size:13px;font-weight:600;
  letter-spacing:2.6px;padding-left:2.6px;text-align:center;color:#fff;white-space:nowrap}

.side-nav{flex:1 1 auto;overflow-y:auto;padding:12px 10px 18px}
.side-nav::-webkit-scrollbar{width:4px}
.side-nav::-webkit-scrollbar-thumb{background:rgba(212,171,68,.35);border-radius:2px}
.nav-g{font-size:10.5px;letter-spacing:1.6px;color:rgba(255,255,255,.40);
  padding:14px 10px 7px;font-weight:600}
.nav-g:first-child{padding-top:4px}
.nav-i{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;
  font-size:13.5px;color:rgba(255,255,255,.76);transition:.15s;margin-bottom:2px}
.nav-i:hover{background:rgba(255,255,255,.09);color:#fff}
.nav-i.on{background:var(--gold);color:#2a2005;font-weight:600;
  box-shadow:0 3px 12px rgba(212,171,68,.32)}
.nav-i svg{width:16px;height:16px;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nav-i.on svg{stroke-width:2}
.nav-sub{margin:2px 0 6px 0;padding-left:12px;border-left:1px solid rgba(212,171,68,.28);
  margin-left:20px;display:flex;flex-direction:column;gap:1px}
.nav-sub a{padding:6px 10px;border-radius:7px;font-size:12.5px;color:rgba(255,255,255,.58);transition:.15s}
.nav-sub a:hover{color:#fff;background:rgba(255,255,255,.07)}
.nav-sub a.on{color:var(--gold);font-weight:600}

.side-foot{flex:0 0 auto;padding:12px 14px 16px;border-top:1px solid rgba(255,255,255,.10)}
.side-foot a{display:flex;align-items:center;gap:8px;font-size:12.5px;color:rgba(255,255,255,.62);
  padding:8px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.16);transition:.15s}
.side-foot a:hover{color:#fff;border-color:var(--gold);background:rgba(212,171,68,.14)}
.side-foot svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* ---- 地图选点 ---- */
.mp{border:1px solid #dde7e2;border-radius:10px;overflow:hidden;background:#fff}
.mp-bar{display:flex;align-items:center;gap:8px;padding:9px 11px;background:#f6f9f7;
  border-bottom:1px solid #e6eeea;flex-wrap:wrap}
.mp-readout{margin-left:auto;font-family:var(--mono);font-size:12px;color:#8a9c94;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-readout.on{color:var(--green-700);font-weight:600}
.mp-map{width:100%;background:#eef3f0}

/* ---- 右侧 ---- */
.main{min-width:0;display:flex;flex-direction:column}
.adm-top{
  height:54px;flex:0 0 auto;display:flex;align-items:center;gap:14px;padding:0 22px;
  background:#fff;border-bottom:1px solid #e2eae6;position:sticky;top:0;z-index:30
}
.crumbs{font-size:13px;color:#6b7f76;letter-spacing:.3px}
.adm-top .right{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:12.5px;color:#6b7f76}
.adm-top .who{padding:4px 10px;border-radius:999px;background:#eef5f1;color:var(--green-700);font-weight:600}
.adm-top .right a{padding:6px 12px;border-radius:7px;border:1px solid #dde7e2;transition:.15s}
.adm-top .right a:hover{border-color:var(--green-500);color:var(--green-700)}
.side-toggle{display:none;background:none;border:0;cursor:pointer;color:var(--green-700);padding:4px}
.side-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}

.wrap{flex:1 1 auto;max-width:1280px;width:100%;padding:22px 22px 60px}
.page-h{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.page-h h2{font-size:19px;font-weight:700;color:var(--green-700)}
.page-h .desc{font-size:12.5px;color:#6b7f76}
.page-h .sp{margin-left:auto;display:flex;gap:8px}

.card{background:#fff;border:1px solid #e2eae6;border-radius:12px;
  box-shadow:0 1px 3px rgba(0,60,42,.05);margin-bottom:16px}
.card > h3{font-size:14px;font-weight:600;color:var(--green-700);padding:13px 16px;
  border-bottom:1px solid #eef3f0;display:flex;align-items:center;gap:8px}
.card > h3::before{content:"";width:3px;height:13px;border-radius:2px;background:var(--gold)}
.card > h3 .tail{margin-left:auto;font-size:12px;font-weight:400;color:#7b8e85}
.card .bd{padding:16px}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.stat{background:#fff;border:1px solid #e2eae6;border-radius:12px;padding:15px 17px;position:relative;
  overflow:hidden}
.stat::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--green-500)}
.stat:nth-child(1)::after{background:var(--gold)}
.stat .l{font-size:12px;color:#7b8e85}
.stat .v{font-family:var(--mono);font-size:27px;font-weight:700;color:var(--green-700);
  margin-top:4px;line-height:1}
.stat:nth-child(1) .v{color:var(--gold-600)}
.stat .v s{text-decoration:none;font-size:12px;color:#8fa199;font-family:var(--font);
  margin-left:4px;font-weight:400}

label{display:block;font-size:12.5px;color:#5c7168;margin-bottom:5px}
label .req{color:#c0392b}
input[type=text],input[type=password],input[type=number],input[type=file],select,textarea{
  width:100%;padding:9px 11px;border:1px solid #d5e0da;border-radius:8px;font-size:13.5px;
  font-family:var(--font);background:#fff;color:#20302a;transition:.15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--green-500);
  box-shadow:0 0 0 3px rgba(18,128,94,.10)}
input[readonly]{background:#f6f9f7;color:#6b7f76}
textarea{resize:vertical;min-height:70px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.fld{min-width:0}
.hint{font-size:11.5px;color:#8a9c94;margin-top:5px;line-height:1.6}

.bt{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 17px;
  border-radius:8px;border:1px solid transparent;font-size:13.5px;font-family:var(--font);
  cursor:pointer;transition:.15s;background:var(--green-700);color:#fff;font-weight:500}
.bt:hover{background:var(--green-600)}
.bt.gold{background:var(--gold);color:#2a2005}
.bt.gold:hover{background:var(--gold-300)}
.bt.ghost{background:#fff;color:var(--green-700);border-color:#cfded7}
.bt.ghost:hover{border-color:var(--green-500);background:#f2f9f6}
.bt.danger{background:#fff;color:#c0392b;border-color:#eccac5}
.bt.danger:hover{background:#fdf2f1}
.bt.sm{padding:6px 12px;font-size:12.5px}
.bt[disabled]{opacity:.5;cursor:not-allowed}

table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-weight:600;color:#5c7168;background:#f6f9f7;padding:10px 12px;
  border-bottom:1px solid #e2eae6;white-space:nowrap;font-size:12.5px}
td{padding:10px 12px;border-bottom:1px solid #f0f5f2;vertical-align:middle}
tr:hover td{background:#fafcfb}
.tbl-wrap{overflow-x:auto}
.code-badge{font-family:var(--mono);font-size:12px;background:var(--gold-soft);
  color:var(--gold-600);padding:2px 7px;border-radius:5px;font-weight:600}
.muted{color:#8a9c94}
.pill{display:inline-block;font-size:11px;padding:2px 8px;border-radius:999px;
  background:#e8f3ee;color:var(--green-700)}
.pill.warn{background:#fdf3e0;color:#9a6b12}
.pill.bad{background:#fdecea;color:#c0392b}

.alert{padding:11px 14px;border-radius:9px;font-size:13px;margin-bottom:14px;line-height:1.7}
.alert.ok{background:#e9f6f0;border:1px solid #bfe3d3;color:#14624a}
.alert.err{background:#fdecea;border:1px solid #f3c9c4;color:#a8342a}
.alert.warn{background:#fdf6e6;border:1px solid #efdcaf;color:#8a6410}
.alert b{font-weight:600}

.pagination{display:flex;gap:6px;align-items:center;justify-content:center;padding:16px 0 4px;
  font-size:13px}
.pagination a,.pagination span{padding:6px 12px;border-radius:7px;border:1px solid #dde7e2;color:#5c7168}
.pagination a:hover{border-color:var(--green-500);color:var(--green-700)}
.pagination .cur{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.pagination .dis{opacity:.4}

.login-page{display:grid;place-items:center;min-height:100vh;
  background:linear-gradient(140deg,var(--green-900),#063d2b 55%,#02150f)}
.login-box{width:370px;background:#fff;border-radius:16px;padding:32px 30px;
  box-shadow:0 20px 60px rgba(0,30,20,.4)}
.login-box img{height:44px;margin:0 auto 6px}
.login-box .ttl{text-align:center;font-size:14px;color:#6b7f76;letter-spacing:2px;margin-bottom:22px}
.login-box .fld{margin-bottom:14px}
.login-box .bt{width:100%;padding:11px}

.modal{position:fixed;inset:0;background:rgba(0,25,17,.5);display:none;place-items:center;z-index:60}
.modal.on{display:grid}
.modal .box{background:#fff;border-radius:14px;width:min(560px,92vw);max-height:86vh;overflow:auto}
.modal .box h3{padding:15px 18px;border-bottom:1px solid #eef3f0;font-size:15px;
  color:var(--green-700);font-weight:600}
.modal .box .bd{padding:18px}
.modal .box .ft{padding:14px 18px;border-top:1px solid #eef3f0;display:flex;gap:9px;
  justify-content:flex-end}

@media (max-width:1100px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .g3,.g4{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .adm-shell{grid-template-columns:1fr}
  .side{position:fixed;left:0;top:0;bottom:0;width:216px;transform:translateX(-100%);
    transition:transform .22s ease}
  .side.open{transform:translateX(0)}
  .side-toggle{display:block}
  .wrap{padding:16px 14px 50px}
}
@media (max-width:620px){
  .g2,.g3,.g4{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
}

/* ---- 后台提示：toast（成功，自动消失）+ 对话框（警告/错误/确认，需手动关闭） ---- */
.toasts{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:1000;
  display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}
.toast{display:flex;align-items:center;gap:9px;max-width:min(520px,calc(100vw - 32px));
  padding:10px 16px;border-radius:10px;background:#fff;color:#20302a;font-size:13.5px;line-height:1.6;
  box-shadow:0 8px 28px rgba(0,40,28,.16),0 1px 3px rgba(0,40,28,.08);border:1px solid #e2eae6;
  pointer-events:auto;opacity:0;transform:translateY(-10px);transition:opacity .22s,transform .22s}
.toast.on{opacity:1;transform:none}
.toast i{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  font-style:normal;font-size:12px;font-weight:700;color:#fff;background:#1f8a64}
.toast.warn i{background:#c9941c}
.toast.err i{background:#c9463a}

.dlg-mask{position:fixed;inset:0;z-index:1001;background:rgba(10,30,22,.38);display:grid;place-items:center;
  padding:16px;opacity:0;transition:opacity .18s}
.dlg-mask.on{opacity:1}
.dlg{width:400px;max-width:100%;background:#fff;border-radius:14px;padding:24px 24px 18px;
  box-shadow:0 20px 60px rgba(0,40,28,.25);transform:scale(.96);transition:transform .18s}
.dlg-mask.on .dlg{transform:none}
.dlg .hd{display:flex;align-items:center;gap:10px;font-size:15.5px;font-weight:600;color:#20302a;margin-bottom:10px}
.dlg .hd i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;
  font-size:13px;font-weight:700;color:#fff;background:#1f8a64}
.dlg.warn .hd i{background:#c9941c}
.dlg.err .hd i,.dlg.danger .hd i{background:#c9463a}
.dlg .bd{font-size:13.5px;line-height:1.75;color:#4a5d55;padding-left:34px;word-break:break-word}
.dlg .ft{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
.dlg .bt.red{background:#c9463a;border-color:#c9463a;color:#fff}
.dlg .bt.red:hover{background:#b23a2f}

.mp-search{flex:1 1 260px;min-width:0;padding:6px 10px;font-size:13px;border:1px solid #cfded7;border-radius:7px;
  background:#fff;outline:none}
.mp-search:focus{border-color:var(--green-500)}
.mp-bar .mp-readout{flex:1 1 100%;margin-left:0}

/* 地图全屏 */
.mp.fs{position:fixed;inset:0;z-index:900;border-radius:0;border:0;display:flex;flex-direction:column}
.mp.fs .mp-map{flex:1 1 auto;height:auto!important}
.mp.fs > .hint{display:none}
body.mp-fs-on{overflow:hidden}
/* 选址评估：范围内门店标注 */
.st-pin{width:24px;height:24px;border-radius:50%;background:#c9463a;color:#fff;font:700 11px/20px var(--mono);
  text-align:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:pointer}
.st-pin.far{background:#7b8e85}
.st-pin.flash{animation:stflash .9s ease 2}
@keyframes stflash{50%{transform:scale(1.6);box-shadow:0 0 0 6px rgba(201,70,58,.3)}}
.mp .amap-marker-label{border:0;background:transparent;padding:0}
.st-lbl{background:rgba(255,255,255,.95);border-radius:5px;padding:2px 7px;font-size:11.5px;color:#20302a;
  white-space:nowrap;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.st-lbl b{color:#c9463a;font-weight:600;margin-left:3px}
.st-no{display:inline-block;min-width:20px;height:20px;border-radius:50%;background:#c9463a;color:#fff;
  font:700 11px/20px var(--mono);text-align:center}
.hit-row{cursor:pointer}
.hit-row:hover td{background:#fdf2f1}

/* 地图选点：两种定位方式分两行 */
.mp-bar.steps{row-gap:10px}
.mp-step{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#20302a;min-width:120px}
.mp-step i{font-style:normal;font-size:11px;font-weight:600;color:#fff;background:var(--green-700);border-radius:4px;padding:1px 6px}
.mp-br{flex-basis:100%;height:0}
.mp-steptip{flex:1 1 200px;font-size:12.5px;color:#6b7f76}
.amap-sug-result{z-index:1002!important}

/* 选址评估：评估点 + 开始评估 */
.site-sel{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:10px 14px;border-radius:9px;
  background:#f4f6f5;border:1px dashed #cfd9d4;color:#8a9c94;font-size:13px}
.site-sel .lbl{flex:0 0 auto;font-size:12px;font-weight:600;color:#fff;background:#a9b7b0;border-radius:4px;padding:1px 7px}
.site-sel .mp-readout{margin:0;white-space:normal;font-family:inherit;font-size:13px;color:inherit}
.site-sel.on{background:#eef7f2;border:1px solid #bfe3d3;color:#14624a}
.site-sel.on .lbl{background:var(--green-700)}
.site-sel.on .mp-readout{color:#14624a;font-weight:600}
#siteGo[disabled],#siteGo[disabled]:hover{background:#c5cfca;border-color:#c5cfca;color:#fff;opacity:1;cursor:not-allowed}

/* 门店表单：定位状态 */
.loc-state{margin:14px 0 12px;padding:9px 13px;border-radius:9px;font-size:13px;line-height:1.7}
.loc-state b{margin-right:8px}
.loc-state.ok{background:#eef7f2;border:1px solid #bfe3d3;color:#14624a}
.loc-state.auto{background:#fdf6e6;border:1px solid #efdcaf;color:#8a6410}

/* 自定义区域：其他已登记区域 */
.ar-dia{width:14px;height:14px;background:var(--gold);border:2px solid #fff;transform:rotate(45deg);
  box-shadow:0 1px 4px rgba(0,0,0,.35)}
.ar-lbl{background:rgba(255,255,255,.95);border-radius:4px;padding:1px 6px;font-size:11.5px;color:#7a5a12;
  font-weight:600;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.grid.g1{grid-template-columns:1fr}