yhm-shop-data/store-ops/frontend/style.css

/* 门店检测工作台 —— 视觉系统
   香槟金画布 + 白卡片 + 金描边；金色渐变主操作 + 暖棕文字；数据色保留语义可读性 */
:root{
  --bg:#f8f4ea;
  --surface:#ffffff;
  --line:#ecdfc2;
  --line-soft:#f6efe0;
  --ink:#211a10;
  --ink-2:#5c5241;
  --ink-3:#93876f;
  --ink-4:#bcb09a;
  --gold:#c8952c;
  --gold-deep:#a4761c;
  --gold-soft:#f1e2bc;
  --gold-bg:#fbf4e2;
  --grad-gold:linear-gradient(135deg,#eab94e 0%,#d29a29 48%,#b57e15 100%);
  --brass:#a4761c;
  --brass-bg:#fbf1da;
  --accent:#c08f22;
  --ok:#5f8d72;
  --r-sm:8px; --r-md:12px; --r-lg:16px;
  --shadow-1:0 1px 2px rgba(120,90,20,.05);
  --shadow-2:0 10px 30px rgba(120,90,20,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
body{color:var(--ink);
  background:
    radial-gradient(1100px 400px at 12% -140px,rgba(234,185,78,.20),transparent 68%),
    radial-gradient(900px 360px at 88% -80px,rgba(234,185,78,.13),transparent 66%),
    radial-gradient(700px 500px at 50% 108%,rgba(234,185,78,.07),transparent 70%),
    var(--bg);
  background-attachment:fixed;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.wrap{max-width:1400px;margin:0 auto;padding:40px 36px 88px 72px}

/* ---------- 顶部 ---------- */
header{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:nowrap;
  padding-bottom:20px;border-bottom:1px solid var(--line)}
header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1.5px;
  background:linear-gradient(90deg,var(--gold) 0%,rgba(200,149,44,.35) 26%,rgba(200,149,44,0) 62%)}
.hleft{min-width:0;flex:1 1 auto}
.htop{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hsub{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px;color:var(--ink-3);font-size:13px;letter-spacing:.1px}
.hsub span+span::before{content:"·";margin-right:10px;color:#d8c9a2}
h1{font-size:21px;font-weight:600;letter-spacing:-.2px;line-height:1.3}
.brand{background:var(--grad-gold);color:#fff;font-weight:600;font-size:12.5px;padding:4px 12px;
  border-radius:6px;letter-spacing:.8px;white-space:nowrap;
  box-shadow:0 2px 8px rgba(180,126,21,.28),inset 0 1px 0 rgba(255,255,255,.35)}
.sub{color:var(--ink-3);font-size:13px;letter-spacing:.1px}
.period{appearance:none;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-sm);
  padding:7px 30px 7px 12px;font-size:14px;font-family:inherit;color:var(--ink);outline:none;cursor:pointer;
  font-weight:500;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23a4761c' stroke-width='1.5'/></svg>");
  background-repeat:no-repeat;background-position:right 11px center;transition:border-color .15s,box-shadow .15s}
.period:hover{border-color:var(--gold)}
.period:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,149,44,.14)}

/* ---------- KPI ---------- */
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:26px 0 14px}
.kpi{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 17px 14px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s;
  box-shadow:var(--shadow-1)}
.kpi::before{content:"";position:absolute;top:0;left:0;right:0;height:2.5px;background:var(--grad-gold);
  opacity:.5;transition:opacity .18s}
.kpi:hover{border-color:#e2cfa3;box-shadow:var(--shadow-2);transform:translateY(-1px)}
.kpi:hover::before{opacity:1}
.kpi .v{font-size:26px;font-weight:600;letter-spacing:-.6px;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1.25}
.kpi .v .u{font-size:13.5px;font-weight:500;color:var(--ink-3);letter-spacing:0;margin-left:4px}
.kpi .l{color:var(--ink-3);font-size:13px;margin-top:3px;letter-spacing:.1px}
.kpi.hot .v{color:#ab4a26}
.kpi.on{border-color:var(--gold-deep);background:var(--gold-bg);box-shadow:inset 0 0 0 1px var(--gold-deep)}
.kpi.on::before{opacity:1}
.kpi.on .v{color:#8a5f0c}
.kpi.hot.on{border-color:#ab4a26;box-shadow:inset 0 0 0 1px #ab4a26}
.kpi.hot.on .v{color:#ab4a26}

/* ---------- 图表 ---------- */
.charts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:12px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px;box-shadow:var(--shadow-1)}
.panel h3{font-size:13.5px;font-weight:500;color:var(--ink-2);letter-spacing:.3px;margin-bottom:8px;
  display:flex;align-items:center;gap:7px}
.panel h3::before{content:"";width:3px;height:11px;border-radius:2px;background:var(--grad-gold)}
.chart{height:290px}

/* ---------- 筛选栏 ---------- */
.bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:20px 0 12px}
.bar input,.bar select{background:var(--surface);border:1px solid var(--line);color:var(--ink);border-radius:var(--r-sm);
  padding:8px 12px;font-size:14px;outline:none;font-family:inherit;transition:border-color .15s,box-shadow .15s}
.bar input::placeholder{color:var(--ink-4)}
.bar input:hover,.bar select:hover{border-color:#e0caa0}
.bar input:focus,.bar select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,149,44,.13)}
.bar input{width:230px}
.bar select{max-width:190px;appearance:none;padding-right:28px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23a4761c' stroke-width='1.5'/></svg>");
  background-repeat:no-repeat;background-position:right 11px center;background-color:var(--surface)}
.bar .sub{margin-left:auto;font-variant-numeric:tabular-nums}

/* ---------- 表格 ---------- */
table{width:100%;border-collapse:collapse;font-size:14.5px}
th{color:#8a7548;font-weight:600;font-size:13px;letter-spacing:.4px;padding:12px 8px;
  background:#fdf9ee;border-bottom:1px solid #e8d8b2;text-align:left;white-space:nowrap;user-select:none}
th:first-child{border-top-left-radius:8px}
th:last-child{border-top-right-radius:8px}
th.num,td.num{text-align:right;font-variant-numeric:tabular-nums}
td{padding:13px 8px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.tablewrap{overflow-x:auto}
td.num,th.num{white-space:nowrap}
.cl-name{min-width:150px}
.cl-city{white-space:nowrap;color:var(--ink-3);font-size:12.5px;padding-left:6px;padding-right:6px}
.cl-tags{max-width:320px;min-width:200px}
.muted{color:var(--ink-4);font-size:12px;font-weight:400}
.cl-rank{white-space:nowrap}
.good-text{color:#3f6d55;font-weight:600}
.warn-text{color:#8a6a2f}
.rankbox{margin:12px 0;padding:10px 12px;background:#fdfaf2;border:1px solid var(--line-soft);
  border-left:3px solid var(--gold);border-radius:0 8px 8px 0;font-size:12.5px;line-height:1.7;color:var(--ink-2)}
.rankbox .rk{display:inline-block;font-size:11px;color:var(--gold-deep);background:var(--gold-bg);
  border-radius:4px;padding:0 6px;margin-right:8px}
tr.row{transition:background .12s}
tr.row:hover td{background:#fdf9f0;cursor:pointer}
tr.row:last-child td{border-bottom:0}
.nm{font-weight:500;color:var(--ink);letter-spacing:-.1px}
.sid{color:var(--ink-4);font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.2px}
.tag{display:inline-block;padding:1px 6px;border-radius:5px;font-size:11.5px;margin:1.5px 3px 1.5px 0;
  white-space:nowrap;letter-spacing:.1px;font-weight:500}
.t-R3{background:#f7e0d7;color:#93401f}
.t-R2{background:#fae3c4;color:#7d4d0c}
.t-R1{background:#f7ecbe;color:#6f5610}
.t-B{background:#f0e6d0;color:#5f4b28}
.t-T{background:#efeade;color:#6b6150}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;vertical-align:1px}
.pager{display:flex;gap:8px;align-items:center;justify-content:flex-end;color:var(--ink-3);font-size:13px;padding:14px 4px 4px}
.pager button{background:var(--surface);border:1px solid var(--line);color:var(--ink-2);border-radius:var(--r-sm);
  padding:5px 14px;cursor:pointer;font-family:inherit;font-size:13.5px;transition:border-color .15s,color .15s,background .15s}
.pager button:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--gold-bg)}
.pager button:disabled{opacity:.35;cursor:default;border-color:var(--line);background:var(--surface)}

/* ---------- 空态 ---------- */
.empty{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:72px 24px;text-align:center;box-shadow:var(--shadow-1)}
.empty-ic{font-size:32px;opacity:.55}
.empty-t{font-size:16px;font-weight:600;margin-top:12px;letter-spacing:-.2px}
.empty-d{color:var(--ink-3);font-size:14px;margin:8px auto 20px;max-width:520px;line-height:1.9}
.empty code{background:var(--gold-bg);padding:1.5px 6px;border-radius:5px;font-size:13px;color:var(--gold-deep)}
.primary{background:var(--grad-gold);border:1px solid #b57e15;color:#fff;font-weight:600;border-radius:var(--r-sm);
  padding:9px 18px;font-size:14px;cursor:pointer;font-family:inherit;letter-spacing:.2px;
  box-shadow:0 2px 9px rgba(181,126,21,.26),inset 0 1px 0 rgba(255,255,255,.3);transition:filter .15s,box-shadow .15s}
.primary:hover{filter:brightness(1.05);box-shadow:0 4px 14px rgba(181,126,21,.34),inset 0 1px 0 rgba(255,255,255,.3)}
.primary:disabled{opacity:.45;cursor:default;box-shadow:none}

/* ---------- 左侧菜单 ---------- */
.rail{position:fixed;left:14px;top:50%;transform:translateY(-50%);z-index:8;display:flex;flex-direction:column;gap:2px;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px 5px;
  box-shadow:0 10px 30px rgba(150,110,20,.13)}
.railitem{position:relative;background:none;border:0;cursor:pointer;font-family:inherit;font-size:13.5px;color:var(--ink-3);
  writing-mode:vertical-rl;letter-spacing:2.5px;padding:15px 6px;border-radius:9px;transition:background .15s,color .15s}
.railitem:hover{background:var(--gold-bg);color:var(--gold-deep)}
.railitem.on{background:var(--grad-gold);color:#fff;font-weight:600;box-shadow:0 2px 8px rgba(181,126,21,.28)}
.railitem .rdot{position:absolute;top:7px;left:50%;margin-left:-2.5px;width:5px;height:5px;border-radius:50%;background:#ab4a26;display:none}
.railitem.mod .rdot{display:block}

.hright{display:flex;align-items:center;gap:12px;flex:0 0 auto;flex-wrap:nowrap}
.huser{display:flex;align-items:center;gap:8px;padding:5px 6px 5px 5px;background:var(--surface);
  border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-1)}
.uavatar{width:26px;height:26px;border-radius:8px;background:var(--grad-gold);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600;flex:0 0 auto}
.uinfo2{display:flex;flex-direction:column;line-height:1.25;margin-right:2px}
.uinfo2 b{font-size:12.5px;font-weight:600;color:var(--ink-2)}
.uinfo2 i{font-size:11px;font-style:normal;color:var(--ink-4)}
.ubtn2{font-family:inherit;font-size:12.5px;padding:6px 11px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line);background:#fff;color:var(--ink-2);transition:.15s;white-space:nowrap}
.ubtn2:hover{border-color:var(--gold);background:var(--gold-bg);color:var(--gold-deep)}
.ubtn2.danger{color:#a4462a}
.ubtn2.danger:hover{border-color:#d98b74;background:#fdf0ea;color:#a4462a}

/* ---------- 账号管理 ---------- */
.urow{padding:12px 0;border-bottom:1px solid var(--line-soft)}
.urow.off{opacity:.55}
.uinfo{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.uinfo b{font-weight:600;color:var(--ink);font-size:13.5px}
.uname{color:var(--ink-4);font-size:12px}
.uoff{font-size:11px;color:#a4462a;background:#fdf0ea;border-radius:4px;padding:0 6px}
.ume{font-size:11px;color:var(--gold-deep);background:var(--gold-bg);border-radius:4px;padding:0 6px}
.uctl{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.urole{font-family:inherit;font-size:12.5px;padding:5px 8px;border:1px solid var(--line);
  border-radius:7px;background:#fff;color:var(--ink-2);cursor:pointer}
.ubtn{font-family:inherit;font-size:12.5px;padding:5px 10px;border:1px solid var(--line);
  border-radius:7px;background:#fff;color:var(--ink-2);cursor:pointer;transition:.15s}
.ubtn:hover{border-color:var(--gold);background:var(--gold-bg);color:var(--gold-deep)}
.ubtn.danger:hover{border-color:#d98b74;background:#fdf0ea;color:#a4462a}
.ubadge{font-size:11.5px;color:var(--ink-4);background:#f6f2e8;border:1px solid var(--line-soft);
  border-radius:7px;padding:4px 9px;line-height:1.4}
.umeta{font-size:11.5px;color:var(--ink-4);margin-top:6px}
.pwinput{width:100%;padding:8px 10px;font-family:inherit;font-size:13.5px;border:1px solid var(--line);
  border-radius:8px;outline:none;color:var(--ink)}
.fmfield{margin-bottom:14px}
.fmlabel{display:block;font-size:12.5px;color:var(--ink-3);margin-bottom:6px}
.fmreq{color:#c0603c;margin-left:3px}
.fmhint{font-size:11.5px;color:var(--ink-4);margin-top:5px;line-height:1.6}
select.pwinput{appearance:none;-webkit-appearance:none;background:#fff
  url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2393876f'/%3E%3C/svg%3E")
  no-repeat right 11px center;padding-right:30px;cursor:pointer}
.pwinput:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(234,185,78,.16)}

/* ---------- 侧面板 ---------- */
.sidepanel{position:fixed;top:0;right:0;width:430px;max-width:94vw;height:100%;background:var(--surface);
  border-left:1px solid var(--line);z-index:12;transform:translateX(102%);transition:transform .26s cubic-bezier(.32,.72,.28,1);
  display:flex;flex-direction:column;box-shadow:-16px 0 48px rgba(150,110,20,.13)}
.sidepanel.on{transform:translateX(0)}
.sphead{padding:26px 26px 16px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#fdf7e8 0%,#ffffff 100%)}
.sphead h4{font-size:16px;font-weight:600;display:flex;align-items:center;gap:9px;letter-spacing:-.1px}
.sphead .pill{background:var(--grad-gold);color:#fff;font-size:12px;font-weight:600;padding:2.5px 9px;border-radius:999px;
  box-shadow:0 1px 5px rgba(181,126,21,.25)}
.spclose{margin-left:auto;cursor:pointer;color:var(--ink-4);font-size:21px;line-height:1;transition:color .15s}
.spclose:hover{color:var(--gold-deep)}
.sphead p{color:var(--ink-3);font-size:13px;margin-top:8px;line-height:1.75}
.spbody{flex:1;overflow-y:auto;padding:4px 26px 20px}
.spbody::-webkit-scrollbar,.drawer::-webkit-scrollbar,.txprev::-webkit-scrollbar{width:8px}
.spbody::-webkit-scrollbar-thumb,.drawer::-webkit-scrollbar-thumb,.txprev::-webkit-scrollbar-thumb{background:#e8d9b8;border-radius:4px}
.spfoot{padding:16px 26px 20px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:center;
  background:linear-gradient(0deg,#fdf7e8 0%,#ffffff 100%)}
.spfoot button{font-family:inherit;font-size:14px;border-radius:var(--r-sm);padding:9px 15px;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-2);transition:border-color .15s,color .15s,background .15s}
.spfoot button:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--gold-bg)}
.spfoot .primary{flex:1;background:var(--grad-gold);border-color:#b57e15;color:#fff;font-weight:600;
  box-shadow:0 2px 9px rgba(181,126,21,.26),inset 0 1px 0 rgba(255,255,255,.3)}
.spfoot .primary:hover{filter:brightness(1.05);border-color:#b57e15;color:#fff}

/* 指标/文案字段 */
.thgroup{padding:16px 0;border-bottom:1px solid var(--line-soft)}
.thgroup:last-child{border-bottom:0}
.thgroup .gt{font-size:14px;font-weight:600;letter-spacing:-.1px;display:flex;align-items:center;gap:7px}
.thgroup .gt::before{content:"";width:3px;height:11px;border-radius:2px;background:var(--grad-gold)}
.thgroup .gh{color:var(--ink-3);font-size:12.5px;margin-top:4px;line-height:1.7;padding-left:10px}
.throw{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:10px}
.throw.one{grid-template-columns:1fr 1fr}
.throw.single{grid-template-columns:1fr}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.thfield{display:flex;flex-direction:column;gap:4px}
.thfield label{font-size:12.5px;color:var(--ink-3);letter-spacing:.1px}
.thfield .inp{display:flex;align-items:center;background:#fdfaf2;border:1px solid var(--line);border-radius:var(--r-sm);padding:0 10px;
  transition:border-color .15s,background .15s,box-shadow .15s}
.thfield .inp:focus-within{border-color:var(--gold);background:var(--surface);box-shadow:0 0 0 3px rgba(200,149,44,.13)}
.thfield input{width:100%;border:0;background:none;outline:none;font-family:inherit;font-size:14.5px;font-weight:500;
  color:var(--ink);padding:8px 0;font-variant-numeric:tabular-nums}
.thfield .u{font-size:12.5px;color:var(--ink-4);padding-left:4px}
.thfield.chg .inp{border-color:var(--gold);background:var(--gold-bg);box-shadow:inset 2px 0 0 var(--gold)}
.thfield textarea{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);background:#fdfaf2;outline:none;
  font-family:inherit;font-size:13.5px;line-height:1.8;color:var(--ink);padding:10px 12px;resize:vertical;
  transition:border-color .15s,background .15s,box-shadow .15s}
.thfield textarea:focus{border-color:var(--gold);background:var(--surface);box-shadow:0 0 0 3px rgba(200,149,44,.13)}
.txprev{margin-top:10px;background:#fdf8ec;border:1px solid #efe1c2;border-left:3px solid var(--gold);
  border-radius:var(--r-sm);padding:14px 16px;font-size:13.5px;line-height:1.95;color:var(--ink-2);
  white-space:pre-wrap;word-break:break-word;max-height:280px;overflow-y:auto}
.badvar{background:#fbe0d6;color:#a8402a;border-radius:3px;padding:0 3px;font-weight:600}
.txbad{display:none;margin-top:10px;background:#fdf0ea;border:1px solid #f0cfc2;color:#a8402a;
  border-radius:var(--r-sm);padding:9px 12px;font-size:13px;line-height:1.7}
.thfield label{display:flex;align-items:center;gap:6px}
.varbtn{margin-left:auto;border:1px solid var(--line);background:#fff;color:var(--gold-deep);
  font-family:inherit;font-size:12px;line-height:1;padding:3px 7px;border-radius:5px;cursor:pointer;transition:all .15s}
.varbtn:hover{background:var(--gold-bg);border-color:var(--gold)}
.varchips{display:none;flex-wrap:wrap;gap:5px;margin-top:7px}
.varchips.on{display:flex}
.varchips b{font-weight:400;font-size:12px;line-height:1;padding:4px 7px;border-radius:999px;cursor:pointer;
  background:#fbf6ea;border:1px solid #ecd9ae;color:#8a6a2f;transition:all .15s}
.varchips b:hover{background:var(--grad-gold);border-color:#b57e15;color:#fff}
.varwarn{display:none;color:#a8402a;font-size:12px;line-height:1.6;margin-top:4px}
.thfield.bad .varwarn{display:block}
.thfield.bad .inp{border-color:#d98b74;background:#fdf3ee}
.thfield.bad textarea{border-color:#d98b74;background:#fdf3ee}

/* ---------- 导入 ---------- */
.drop{display:block;border:1px dashed #e0cda3;border-radius:var(--r-md);padding:30px 16px;text-align:center;
  color:var(--ink-3);font-size:14px;cursor:pointer;background:#fdfaf2;transition:all .15s}
.drop:hover,.drop.over{border-color:var(--gold);background:var(--gold-bg);color:var(--gold-deep)}
.imresult{margin-top:14px;font-size:13.5px}
.imresult .ok{background:#f2f8f4;border:1px solid #d6e8dc;color:#3f6d55;border-radius:var(--r-sm);padding:11px 13px;line-height:1.9}
.imresult .bad{background:#fcf0ec;border:1px solid #f1d6cd;color:#9c4530;border-radius:var(--r-sm);padding:11px 13px}
.history{font-size:13px;color:var(--ink-3)}
.history .hrow{padding:8px 0;border-bottom:1px solid var(--line-soft);display:flex;gap:10px;align-items:center}
.history .hmain{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.history .hmeta{white-space:nowrap;color:var(--ink-4);font-size:12px}
.history .hrow b{color:var(--ink-2);font-weight:500}
.hbtn{flex:0 0 auto;font-family:inherit;font-size:12px;padding:4px 11px;border-radius:6px;cursor:pointer;
  border:1px solid var(--line);background:#fff;color:var(--gold-deep);transition:.15s;white-space:nowrap}
.hbtn:hover{border-color:var(--gold);background:var(--gold-bg)}
.hbtn:disabled{opacity:.4;cursor:default;border-color:var(--line);background:#fff;color:var(--ink-4)}

/* ---------- 门店详情 ---------- */
.overlay{position:fixed;inset:0;background:rgba(52,38,10,.30);opacity:0;pointer-events:none;transition:opacity .2s;z-index:9;backdrop-filter:blur(1.5px)}
.overlay.on{opacity:1;pointer-events:auto}
.overlay.hi{z-index:11}
.drawer{position:fixed;top:0;right:-520px;width:500px;max-width:94vw;height:100%;background:var(--surface);
  border-left:1px solid var(--line);z-index:10;transition:right .26s cubic-bezier(.32,.72,.28,1);overflow-y:auto;
  box-shadow:-16px 0 48px rgba(150,110,20,.15)}
.drawer.on{right:0}
.dwhead{position:sticky;top:0;z-index:2;padding:26px 28px 15px;border-bottom:1px solid var(--line-soft);
  background:linear-gradient(180deg,#fdf7e8 0%,#ffffff 92%)}
.dwhead::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-gold)}
.dwbody{padding:16px 28px 44px}
.dwclose{position:absolute;top:24px;right:24px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border-radius:8px;color:var(--ink-4);font-size:22px;line-height:1;cursor:pointer;transition:background .15s,color .15s}
.dwclose:hover{background:var(--gold-bg);color:var(--gold-deep)}
.drawer h2{font-size:18.5px;font-weight:600;display:flex;gap:10px;align-items:center;flex-wrap:wrap;letter-spacing:-.3px;padding-right:34px}
.drawer .sid{margin:5px 0 0}
.drawer .sid,.drawer .tag + .tag{margin-left:0}
.mrow{margin:15px 0}
.mrow .lab{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-3);letter-spacing:.1px}
.mrow .lab span:last-child{color:var(--ink-2);font-variant-numeric:tabular-nums;font-weight:500}
.mrow .track{position:relative;height:6px;background:#f5ecda;border-radius:4px;margin-top:7px}
.mrow .fill{height:100%;border-radius:4px;transition:width .3s}
.mrow .mk{position:absolute;top:-3px;width:1.5px;height:12px;background:#c6b48c;opacity:.9}
/* ---------- 诊断结论（v2）---------- */
.dxhead{margin:2px 0 16px;padding:13px 15px;border-radius:10px;background:var(--gold-bg);border:1px solid #f0e2c2}
.dxhead.t-R{background:#fdf4f0;border-color:#f0d5ca}
.dxhead.t-B{background:#fdf8ee;border-color:#efe0bd}
.dxhead.t-T{background:#f7f7f4;border-color:#e8e4d8}
.dxhead.t-OK{background:#f2f7f3;border-color:#d9e8dd}
.dxhd{font-size:14px;line-height:1.7;color:var(--ink);font-weight:500}
.dxmeta{margin-top:6px;font-size:12px;color:var(--ink-3)}
.dxsec{margin-bottom:4px}
.dxt{font-size:12px;color:var(--ink-3);letter-spacing:.4px;margin:0 0 7px}
.dxrow{margin:0 0 9px}
.dxrow .dxact{margin-top:4px;font-size:12.5px;line-height:1.7;color:var(--ok);padding-left:2px}
.dxrow.small{margin-bottom:6px}
.dxnone{font-size:13.5px;color:var(--ok);padding:2px 0 10px}
.dxmore{margin:14px 0 4px;border-top:1px solid var(--line-soft);padding-top:10px}
.dxmore summary{cursor:pointer;font-size:12px;color:var(--ink-3);outline:none;user-select:none}
.dxmore summary:hover{color:var(--gold-deep)}
.dxmore .dxrow{margin-top:9px}
.flag{margin:9px 0;font-size:14px;display:flex;gap:8px;align-items:flex-start}
.flag .act{color:var(--ok);font-size:13px;line-height:1.7}
.copybtn{margin-top:22px;width:100%;background:var(--grad-gold);border:1px solid #b57e15;color:#fff;font-weight:600;
  border-radius:var(--r-sm);padding:11px;font-size:14px;cursor:pointer;font-family:inherit;letter-spacing:.4px;
  box-shadow:0 3px 12px rgba(181,126,21,.28),inset 0 1px 0 rgba(255,255,255,.3);transition:filter .15s,box-shadow .15s}
.copybtn:hover{filter:brightness(1.05);box-shadow:0 6px 18px rgba(181,126,21,.34),inset 0 1px 0 rgba(255,255,255,.3)}
.dwbrow{display:flex;gap:10px;margin-top:22px}
.dwbrow .copybtn{margin-top:0;flex:1 1 auto}
.rpentry{flex:0 0 auto;background:var(--surface);border:1px solid var(--line);color:var(--ink-2);font-weight:600;
  border-radius:var(--r-sm);padding:11px 18px;font-size:14px;cursor:pointer;font-family:inherit;letter-spacing:.4px;
  transition:border-color .15s,color .15s,box-shadow .15s}
.rpentry:hover{border-color:var(--gold);color:var(--gold-deep);box-shadow:var(--shadow-1)}
.hint{color:var(--ink-4);font-size:12.5px;margin-top:9px;line-height:1.75}

/* ---------- 预览弹窗 ---------- */
.pvwrap{position:fixed;inset:0;background:rgba(52,38,10,.40);z-index:15;display:none;align-items:center;
  justify-content:center;padding:32px;backdrop-filter:blur(2px)}
.pvwrap.on{display:flex}
.pvcard{background:var(--surface);border-radius:var(--r-lg);width:min(980px,84vw);height:min(760px,84vh);
  max-height:88vh;display:flex;flex-direction:column;box-shadow:0 28px 70px rgba(80,55,5,.32);overflow:hidden;
  border:1px solid var(--line)}
.pvhead{display:flex;align-items:center;gap:8px;padding:20px 28px;font-size:16px;font-weight:600;letter-spacing:-.1px;
  border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fdf7e8,#fff)}
.pvhead::before{content:"";width:3px;height:14px;border-radius:2px;background:var(--grad-gold)}
.pvclose{margin-left:auto;cursor:pointer;color:var(--ink-4);font-size:22px;line-height:1;font-weight:400}
.pvclose:hover{color:var(--gold-deep)}
.pvcard textarea{flex:1;border:0;outline:none;resize:none;padding:22px 28px;font-family:inherit;
  font-size:14.5px;line-height:2.05;color:var(--ink-2);background:var(--surface);min-height:240px}
.pvfoot{display:flex;gap:10px;padding:16px 28px 20px;border-top:1px solid var(--line);background:linear-gradient(0deg,#fdf7e8,#fff)}
.pvfoot button{font-family:inherit;font-size:14px;border-radius:var(--r-sm);padding:10px 18px;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-2);transition:border-color .15s,color .15s,background .15s}
.pvfoot button:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--gold-bg)}
.pvfoot .primary{flex:1;background:var(--grad-gold);border-color:#b57e15;color:#fff;font-weight:600;
  box-shadow:0 2px 9px rgba(181,126,21,.26),inset 0 1px 0 rgba(255,255,255,.3)}
.pvfoot .primary:hover{filter:brightness(1.05);color:#fff;border-color:#b57e15}

.cfwrap{position:fixed;inset:0;background:rgba(52,38,10,.40);z-index:30;display:flex;align-items:center;
  justify-content:center;padding:24px;backdrop-filter:blur(2px);opacity:0;transition:opacity .18s}
.cfwrap.on{opacity:1}
.cfcard{background:var(--surface);border-radius:var(--r-lg);width:min(480px,92vw);
  box-shadow:0 28px 70px rgba(80,55,5,.32);border:1px solid var(--line);overflow:hidden;
  transform:translateY(8px);transition:transform .2s}
.cfwrap.on .cfcard{transform:none}
.cfhead{display:flex;align-items:center;padding:18px 22px;font-size:15.5px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#fdf7e8,#fff)}
.cfhead::before{content:"";width:3px;height:14px;border-radius:2px;background:var(--grad-gold);margin-right:9px}
.cfhead b{flex:1;font-weight:600}
.cfbody{padding:18px 22px 8px}
.cfrow{display:flex;gap:12px;padding:6px 0;font-size:13.5px}
.cfrow .k{flex:0 0 68px;color:var(--ink-3)}
.cfrow .v{flex:1;color:var(--ink-2)}
.cfnote{margin-top:12px;padding:10px 12px;background:#fdfaf2;border:1px solid var(--line-soft);
  border-radius:var(--r-sm);font-size:12.5px;line-height:1.75;color:var(--ink-3)}
.cfnote b{color:var(--ink-2);font-weight:600}
.cffoot{display:flex;gap:10px;padding:16px 22px 20px;justify-content:flex-end}
.cffoot button{font-family:inherit;font-size:14px;border-radius:var(--r-sm);padding:9px 20px;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-2);transition:.15s}
.cffoot button:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--gold-bg)}
.cffoot .primary{background:var(--grad-gold);border-color:#b57e15;color:#fff;font-weight:600;
  box-shadow:0 2px 9px rgba(181,126,21,.26),inset 0 1px 0 rgba(255,255,255,.3)}
.cffoot .primary:hover{filter:brightness(1.05);color:#fff}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,12px);background:#3a2c10;color:#fdf7e8;font-size:14px;
  padding:10px 20px;border-radius:999px;opacity:0;pointer-events:none;transition:all .24s;z-index:20;
  box-shadow:0 12px 32px rgba(70,48,5,.30);letter-spacing:.2px;border:1px solid rgba(234,185,78,.28)}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media(max-width:1100px){.wrap{padding:24px 18px 56px 62px}.kpis{grid-template-columns:repeat(2,1fr)}
  header{flex-wrap:wrap}.hright{width:100%;justify-content:flex-start}}
@media(max-width:960px){.charts{grid-template-columns:1fr}}