:root{
  --bg:#F4F2EC;
  --side:#EFEDE6;
  --panel:#FFFFFF;
  --chatbg:#F7F5F0;
  --line:#E4E1D7;
  --line2:#EDEAE1;
  --ink:#1E1D1A;
  --ink2:#6C6B64;
  --ink3:#9E9C93;
  --accent:#0F6E56;
  --accent-d:#0B5844;
  --soft:#E3F2EB;
  --me:#D3EFC3;
  --me-ink:#1C3A12;
  --danger:#C0392B;
  --r:12px;
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none !important}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow:hidden;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,textarea{font-family:inherit;font-size:14px;color:var(--ink)}
input:focus,textarea:focus{outline:none}
::selection{background:#CDE8DC}

/* ---------- 登录 ---------- */

.login-wrap{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  padding:24px;background:var(--bg);
}
.login-wrap::before{
  content:"";position:absolute;width:520px;height:520px;border-radius:50%;
  background:#E8F1EA;top:-220px;right:-180px;opacity:.7;
}
.login-wrap::after{
  content:"";position:absolute;width:380px;height:380px;border-radius:50%;
  background:#EFE8DC;bottom:-200px;left:-140px;opacity:.6;
}
.login-card{
  position:relative;z-index:1;width:100%;max-width:380px;background:var(--panel);
  border:1px solid var(--line);border-radius:20px;padding:34px 30px 26px;
  box-shadow:0 18px 40px -24px rgba(30,29,26,.28);
}
.login-mark{
  width:52px;height:52px;border-radius:15px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:17px;font-weight:600;letter-spacing:.5px;
}
.login-title{margin:18px 0 4px;font-size:21px;font-weight:600;letter-spacing:-.3px}
.login-sub{margin:0 0 24px;color:var(--ink3);font-size:13px}
.field{margin-bottom:13px}
.field label{display:block;font-size:12.5px;color:var(--ink2);margin-bottom:6px}
.field input{
  width:100%;height:44px;border:1px solid var(--line);border-radius:10px;
  background:#FBFAF7;padding:0 13px;transition:border-color .15s,background .15s;
}
.field input:focus{border-color:var(--accent);background:#fff}
.login-btn{
  width:100%;height:44px;border-radius:10px;background:var(--accent);color:#fff;
  font-size:15px;font-weight:500;margin-top:10px;transition:background .15s;
}
.login-btn:hover{background:var(--accent-d)}
.login-btn:disabled{opacity:.6;cursor:default}
.login-err{color:var(--danger);font-size:13px;min-height:20px;margin-top:10px}
.login-hint{
  margin-top:18px;padding-top:16px;border-top:1px solid var(--line2);
  font-size:12px;color:var(--ink3);line-height:1.9;
}
.login-hint b{color:var(--ink2);font-weight:500}
.login-ver{margin-top:10px;font-size:10.5px;color:#C2BFB6;text-align:center;letter-spacing:.2px}

/* ---------- 主界面 ---------- */

/* 高度基线用 100%（任何浏览器都认），dvh 只在支持的浏览器上加成；
   万一某浏览器把 dvh 算错，JS 里的 ensureFit() 还会按可视高度硬兜一层 */
.app{display:flex;height:100%;max-height:100%;overflow:hidden}
@supports (height:100dvh){.app{height:100dvh;max-height:100dvh}}
.app[hidden]{display:none}

.side{
  width:296px;flex:0 0 296px;background:var(--side);border-right:1px solid var(--line);
  display:flex;flex-direction:column;min-height:0;
}
.side-head{
  height:62px;flex:0 0 62px;display:flex;align-items:center;justify-content:space-between;
  padding:0 14px 0 16px;position:relative;
}

/* 我的 / 用户菜单 */
.btn-me{
  width:28px;height:28px;border-radius:50%;color:#fff;font-size:12px;font-weight:500;
  display:flex;align-items:center;justify-content:center;flex:0 0 28px;
  transition:opacity .15s;
}
.btn-me:hover{opacity:.85}
.umenu{
  position:fixed;left:0;top:0;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:0 14px 30px -16px rgba(0,0,0,.4);padding:4px;z-index:900;min-width:132px;
}
.umenu button{
  display:block;width:100%;text-align:left;padding:8px 10px;border-radius:7px;
  font-size:13px;color:var(--ink);
}
.umenu button:hover{background:rgba(0,0,0,.05)}
.umenu hr.usep{border:0;border-top:1px solid var(--line2);margin:4px 2px}
/* 只给 JS 当代理用的按钮，不进视野 */
.proxy{display:none !important}

/* 通用弹窗 */
.modal{
  position:fixed;inset:0;background:rgba(24,23,20,.44);z-index:90;
  display:flex;align-items:center;justify-content:center;padding:22px;
}
.modal-card{background:#fff;border-radius:16px;padding:20px;width:100%;max-width:380px}
.modal-title{font-size:15px;font-weight:600;margin-bottom:14px}
.brand{display:flex;align-items:center;gap:9px}
.mark{
  width:30px;height:30px;border-radius:9px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;
}
.brand-name{font-size:15px;font-weight:600;letter-spacing:-.2px}
.icon-btn{
  width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  color:var(--ink2);transition:background .15s;
}
.icon-btn:hover{background:rgba(0,0,0,.05)}

.search-wrap{padding:0 12px 10px}
.search{
  display:flex;align-items:center;gap:7px;height:34px;padding:0 10px;
  background:#E6E3DA;border-radius:9px;
}
.search svg{flex:0 0 14px;color:var(--ink3)}
.search input{
  flex:1;background:none;border:none;font-size:13px;min-width:0;
}
.search input::placeholder{color:var(--ink3)}

.conv-list{flex:1;overflow-y:auto;padding:2px 8px 8px}
.conv{
  display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:10px;
  cursor:pointer;transition:background .12s;position:relative;
}
.conv:hover{background:rgba(0,0,0,.035)}
.conv.active{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.conv-body{flex:1;min-width:0}
.conv-top{display:flex;align-items:baseline;gap:6px}
.conv-name{
  font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;flex:0 1 auto;
}
.conv-dept{font-size:11px;color:var(--ink3);flex:0 0 auto}
.crole{
  font-size:10.5px;line-height:1.5;padding:1px 6px;border-radius:5px;
  background:#EDEAE1;color:#8B8A84;flex:0 0 auto;white-space:nowrap;
}
.crole.role-admin{background:#E1F5EE;color:#0F6E56}
.crole.role-super{background:#FAC775;color:#412402;font-weight:500}
.crole.role-daren{background:#EEEDFE;color:#3C3489}
.crole.role-bot{background:#E4F7EC;color:#0B7A3E;font-weight:500}
.conv-prev{
  font-size:12.5px;color:var(--ink3);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;margin-top:1px;min-height:19px;
}
.conv-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:0 0 auto}
.conv-time{font-size:11px;color:var(--ink3)}
.badge{
  min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:#D9534F;color:#fff;
  font-size:11px;line-height:17px;text-align:center;font-weight:500;
}
.side-foot{
  flex:0 0 38px;border-top:1px solid var(--line);display:flex;align-items:center;
  gap:6px;padding:0 16px;font-size:11.5px;color:var(--ink3);
}
.dot{width:6px;height:6px;border-radius:50%;background:#3E9B6D;flex:0 0 6px}
.dot.off{background:#C0392B}
/* 版本号：让人一眼确认自己用的是不是最新页面 */
.ver{margin-left:auto;font-size:10.5px;color:#B4B2A9;font-variant-numeric:tabular-nums;cursor:default}

/* 头像 */
.avatar{
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:500;flex:0 0 auto;user-select:none;
}
.a-38{width:38px;height:38px;font-size:15px;flex-basis:38px}
.a-30{width:30px;height:30px;font-size:12.5px;flex-basis:30px}

/* ---------- 左侧图标栏（2026-10-22） ---------- */
.rail{
  width:70px;flex:0 0 70px;background:#fff;border-right:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;padding:12px 0 10px;
  position:relative;z-index:30;
}
.rail-me{
  width:34px;height:34px;border-radius:50%;color:#fff;font-size:13px;font-weight:500;
  display:flex;align-items:center;justify-content:center;flex:0 0 34px;margin-bottom:12px;
  transition:opacity .15s;
}
.rail-me:hover{opacity:.85}
.rail-group{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;width:100%}
.rail-foot{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%}
.ritem{
  width:54px;padding:7px 0 6px;border-radius:10px;border:none;background:none;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:3px;
  color:#8C8880;font-size:9.5px;line-height:1;letter-spacing:.2px;
  transition:background .15s,color .15s;
}
.ritem svg{width:19px;height:19px;display:block}
.ritem .eq{width:23px;height:23px}
.ritem:hover{color:var(--ink);background:rgba(0,0,0,.04)}
.ritem.on{background:#E3F2EB;color:var(--accent)}
.ritem.on span{font-weight:500}
/* 手机上进竖栏太占地方，入口挪回侧栏顶部 */
.head-acts{display:none;gap:4px;align-items:center}
.app.mobile .rail{display:none}
.app.mobile .head-acts{display:flex}

/* ---------- 机器人在线状态（2026-10-19） ---------- */

/* 头像右下角的状态点：绿=在线、灰=离线 */
.avwrap{position:relative;flex:0 0 auto;display:flex}
.avwrap.a-38{width:38px;height:38px;flex-basis:38px}
.avwrap.a-30{width:30px;height:30px;flex-basis:30px}
.pdot{
  position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;
  background:#A9A59C;border:2px solid #fff;box-sizing:content-box;
  transition:background .18s,box-shadow .18s;
}
.avwrap.a-30 .pdot{width:8px;height:8px}
.pdot.on{background:#22B45E;box-shadow:0 0 0 2px rgba(34,180,94,.22)}
.avatar.bot-on{box-shadow:0 0 0 2px #fff,0 0 0 3.5px #22B45E}

/* 「在线 / 离线」胶囊：比灰色小字显眼，扫一眼就知道机器人在不在干活 */
.botpill{
  display:inline-flex;align-items:center;gap:4px;
  font-size:10.5px;line-height:1;padding:3.5px 8px;border-radius:20px;
  border:1px solid transparent;vertical-align:middle;white-space:nowrap;
  font-weight:500;letter-spacing:.2px;
}
.botpill i{width:6px;height:6px;border-radius:50%;display:block;background:currentColor;flex:0 0 auto}
.botpill em{font-style:normal}
.botpill.on{background:#E4F7EC;color:#0B7A3E;border-color:#A9E2C1}
.botpill.on i{background:#22B45E;box-shadow:0 0 0 2px rgba(34,180,94,.2)}
.botpill.off{background:#F1F0ED;color:#8C8880;border-color:#E1DFD9}
/* 2026-10-22：在线不再是两态。绿=真能干活，黄=快到点，红=干不了活 */
.botpill.ok{background:#E4F7EC;color:#0B7A3E;border-color:#A9E2C1}
.botpill.ok i{background:#22B45E;box-shadow:0 0 0 2px rgba(34,180,94,.2)}
.botpill.warn{background:#FFF4E5;color:#8A5A00;border-color:#F0C87A}
.botpill.warn i{background:#D9930C;box-shadow:0 0 0 2px rgba(217,147,12,.2)}
.botpill.down{background:#FCEBEB;color:#A32D2D;border-color:#F09595}
.botpill.down i{background:#D93F3F;box-shadow:0 0 0 2px rgba(217,63,63,.18)}
.botpill.offline{background:#F1F0ED;color:#8C8880;border-color:#E1DFD9}
.botpill[data-bot]{cursor:pointer}
.botpill.in-sender{margin-left:6px;vertical-align:1px}
.botpill.in-list{font-size:10px;padding:2px 6px;gap:3px}
.botpill.head{margin-right:2px}
.peer-sub{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.botpill-name{font-size:11.5px;color:var(--ink3)}

/* 顶部提示条：发送失败 / 登录过期这类必须让人看见的事 */
#toast{
  position:fixed;left:50%;top:14px;transform:translateX(-50%);z-index:9999;
  max-width:calc(100vw - 32px);padding:9px 16px;border-radius:10px;
  background:#A32D2D;color:#fff;font-size:13px;line-height:1.5;
  box-shadow:0 8px 24px -10px rgba(0,0,0,.45);text-align:center;
}

/* ---------- 聊天区 ---------- */

.chat{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--chatbg);position:relative}
.chat.empty .chat-head,.chat.empty .msgs,.chat.empty .composer{display:none}
.chat-empty{
  position:absolute;inset:0;display:none;flex-direction:column;align-items:center;
  justify-content:center;color:var(--ink3);gap:10px;
}
.chat.empty .chat-empty{display:flex}
.chat-empty .mark{width:46px;height:46px;border-radius:14px;font-size:16px;opacity:.9}
.chat-empty p{margin:0;font-size:13px}

.chat-head{
  height:62px;flex:0 0 62px;display:flex;align-items:center;gap:10px;
  padding:0 18px;border-bottom:1px solid var(--line);background:rgba(247,245,240,.92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.chat-head .back{display:none}
.peer{display:flex;align-items:center;gap:10px;min-width:0}
.peer-name{font-size:15px;font-weight:500;line-height:1.3}
.peer-sub{font-size:11.5px;color:var(--ink3);line-height:1.3}
.peer-sub.on{color:var(--accent)}

.msgs{
  flex:1;min-height:0;overflow-y:auto;padding:18px 20px 10px;display:flex;flex-direction:column;gap:2px;
}
/* 原来这里有 scroll-behavior:smooth —— 打开会话时会从第一条一路"滑"下来，
   而且滚动动画途中会让贴底判断失效，导致停在半路。2026-10-21 去掉。 */
/* .msgs 是 flex column，子元素默认 flex-shrink:1 会被压扁重叠（消息一多就叠在一起） */
.msgs>*{flex:0 0 auto}
.divider{text-align:center;margin:14px 0 8px}
.divider span{font-size:11px;color:#B4B2A9}
.divider.sub{margin:8px 0 6px}
.divider.sub span{font-size:10.5px;color:#C2BFB6}
.divider .dfold{
  margin-left:7px;font-size:11px;color:var(--ink3);
  padding:1px 6px;border-radius:6px;transition:background .15s,color .15s;
}
.divider .dfold:hover{color:var(--ink2);background:rgba(0,0,0,.05)}
.row{display:flex;gap:9px;margin-bottom:10px;align-items:flex-start}
.row.me{flex-direction:row-reverse}
.content{min-width:0;max-width:520px}
.bubble{
  max-width:100%;padding:8px 13px;border-radius:10px;font-size:14px;
  line-height:1.62;word-break:break-word;white-space:pre-wrap;
  background:#fff;border:1px solid var(--line2);
}
.row.me .bubble{background:var(--me);border-color:#C1E4AE;color:var(--me-ink)}
.bubble.plain{background:transparent;border:none;padding:0;max-width:min(62%,520px)}
.sys{
  align-self:center;font-size:11.5px;color:var(--ink3);background:rgba(0,0,0,.045);
  padding:4px 11px;border-radius:8px;margin:10px 0;max-width:80%;text-align:center;
}

/* ---------- 历史消息折叠（2026-10-20） ---------- */

/* 手机侧栏顶部那两个副本按钮，跳动动画跟竖栏里的完全一致（2026-10-22） */
.head-acts .eq rect{transform-box:fill-box;transform-origin:50% 100%}
[data-clone="btnMetrics"] .eq{animation:a8GlowRed 2.6s ease-in-out infinite}
[data-clone="btnMetrics"] .eq .b1{animation:eqA 1.1s ease-in-out infinite}
[data-clone="btnMetrics"] .eq .b2{animation:eqB 1.6s ease-in-out infinite .18s}
[data-clone="btnMetrics"] .eq .b3{animation:eqC .85s ease-in-out infinite .36s}
[data-clone="btnBill"] .eq{animation:a8GlowTeal 2.6s ease-in-out infinite}
[data-clone="btnBill"] .eq .b1{animation:eqB 1.35s ease-in-out infinite .1s}
[data-clone="btnBill"] .eq .b2{animation:eqA .95s ease-in-out infinite .25s}
[data-clone="btnBill"] .eq .b3{animation:eqC 1.15s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){
  .head-acts .eq,[data-clone] .eq rect{animation:none!important}
}

/* 折叠条：更早的某一天，收成一行人话（2026-10-21 加深：原来太淡，一眼看不见） */
.foldbar{
  align-self:flex-start;display:flex;align-items:center;gap:7px;
  padding:4px 13px 4px 5px;margin:9px 0 7px;border-radius:10px;
  background:#EDEAE1;border:1px solid #DFDACD;
  color:var(--ink2);font-size:12.5px;cursor:pointer;
  transition:background .15s,border-color .15s,color .15s;
}
.foldbar:hover{background:#E4E0D3;border-color:#CEC9B9}
.foldbar svg{
  width:19px;height:19px;flex:0 0 19px;padding:4px;box-sizing:border-box;
  color:#3D3D38;background:#D8D3C4;border-radius:50%;stroke-width:3.2;
  transition:background .15s,color .15s;
}
.foldbar:hover svg{background:var(--accent);color:#fff}
.foldbar b{font-weight:500;color:var(--ink)}
.foldbar .cnt{font-size:11.5px;color:#8B8A84}

/* 紧凑行：前天（以及手动展开的更早日期）每条压成一行 */
.crow{
  display:flex;align-items:center;gap:0;min-height:26px;padding:1px 6px;
  border-radius:8px;max-width:620px;
}
.crow:hover{background:rgba(0,0,0,.03)}
.crow .cnm{
  font-size:13px;color:#8C8880;flex:0 0 auto;max-width:78px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.crow .ctx{
  font-size:13px;color:var(--ink2);flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.crow .ctm{
  font-size:10.5px;color:#C2BFB6;margin-left:8px;flex:0 0 auto;
  font-variant-numeric:tabular-nums;
}
.crow.withimg{align-items:flex-start;gap:8px;padding:3px 6px}

/* 缩略图：48px。点图片看大图，点右下角 ↓ 直接下载 */
.thumb{
  position:relative;width:48px;height:48px;flex:0 0 48px;border-radius:7px;overflow:hidden;
  background:#fff;border:1px solid #DED9CB;
}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.tdl{
  position:absolute;right:2px;bottom:2px;width:17px;height:17px;border-radius:5px;padding:0;
  background:rgba(20,20,18,.62);color:#fff;display:flex;align-items:center;justify-content:center;
}
.tdl svg{width:10px;height:10px}
.tdl:hover{background:rgba(20,20,18,.85)}
.crow .cmeta{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px;padding-top:3px}
.crow .ct1{font-size:13px;color:var(--ink2)}
.crow .ct2{font-size:10.5px;color:#B4B2A9}

/* 图片消息 */
.msg-img{padding:4px;background:#fff;border:1px solid var(--line2);border-radius:11px;width:fit-content;max-width:min(320px,100%)}
.row.me .msg-img{background:var(--me);border-color:#C1E4AE}
.msg-img img{display:block;max-width:100%;max-height:340px;border-radius:8px;cursor:zoom-in}

/* 视频消息 */
.msg-video{padding:4px;background:#fff;border:1px solid var(--line2);border-radius:11px;width:fit-content;max-width:min(320px,100%)}
.row.me .msg-video{background:var(--me);border-color:#C1E4AE}
.msg-video video{display:block;max-width:100%;max-height:340px;border-radius:8px;background:#000}

/* 文件卡片 */
.file-card{
  display:flex;gap:11px;align-items:center;padding:11px 13px;min-width:200px;max-width:300px;
  background:#fff;border:1px solid var(--line2);border-radius:11px;cursor:pointer;
  transition:border-color .15s;
}
.file-card:hover{border-color:#C9C4B6}
.row.me .file-card{background:var(--me);border-color:#C1E4AE}
.fi{
  width:34px;height:38px;border-radius:6px;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:11px;font-weight:600;flex:0 0 34px;letter-spacing:.3px;
}
.fc-name{font-size:13.5px;font-weight:500;word-break:break-all;line-height:1.4}
.fc-meta{font-size:11.5px;color:var(--ink3);margin-top:2px}
.row.me .fc-meta{color:#4C7A3A}

/* 上传中 */
.uploading{padding:10px 13px;min-width:200px;max-width:300px;background:#fff;border:1px solid var(--line2);border-radius:11px}
.row.me .uploading{background:var(--me);border-color:#C1E4AE}
.up-name{font-size:13px;font-weight:500;word-break:break-all}
.up-bar{height:4px;background:rgba(0,0,0,.08);border-radius:2px;margin-top:8px;overflow:hidden}
.up-bar i{display:block;height:100%;background:var(--accent);width:0;transition:width .2s;border-radius:2px}
.up-meta{font-size:11px;color:var(--ink3);margin-top:5px;display:flex;justify-content:space-between}

/* 输入区 */
.composer{
  flex:0 0 auto;border-top:1px solid var(--line);background:rgba(247,245,240,.96);
  padding:11px 20px 16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}

/* 拖动条：上下拉可调整输入框高度（2026-10-19 用户要求） */
.drag-h{
  height:12px;margin:-9px 0 3px;display:flex;align-items:center;justify-content:center;gap:6px;
  cursor:ns-resize;touch-action:none;user-select:none;-webkit-user-select:none;border-radius:6px;
}
.drag-h svg{width:20px;height:9px;color:#C6C3BA;transition:color .15s}
.drag-h span{width:34px;height:3px;border-radius:2px;background:#DCD9D0;transition:background .15s}
.drag-h:hover svg,.drag-h.active svg{color:var(--accent)}
.drag-h:hover span,.drag-h.active span{background:var(--accent);opacity:.5}
.tools{display:flex;gap:6px;margin-bottom:8px}
.tool{
  display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:8px;
  font-size:13px;color:var(--ink2);transition:background .15s,color .15s;
}
.tool:hover{background:rgba(0,0,0,.05);color:var(--ink)}
.tool svg{width:16px;height:16px}
.input-row{display:flex;gap:12px;align-items:flex-end}
.input-box{
  flex:1;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:12px 15px;transition:border-color .15s;min-width:0;min-height:50px;
  display:flex;align-items:center;
}
.input-box:focus-within{border-color:#BFD9CD}
#input{
  width:100%;border:none;background:none;resize:none;max-height:60vh;
  line-height:1.6;padding:0;display:block;font-size:15px;min-height:24px;
}
#input::placeholder{color:var(--ink3)}
.send-btn{
  flex:0 0 auto;height:50px;padding:0 26px;border-radius:11px;background:var(--accent);
  color:#fff;font-size:14.5px;font-weight:500;transition:background .15s,opacity .15s;
}
.send-btn:hover{background:var(--accent-d)}
.send-btn:disabled{opacity:.45;cursor:default}

/* 拖拽层 */
.drop{
  position:absolute;inset:10px;border:2px dashed #A9CDBC;border-radius:16px;
  background:rgba(227,242,235,.9);display:none;align-items:center;justify-content:center;
  font-size:14px;color:var(--accent);z-index:20;pointer-events:none;
}
.app.dragging .drop{display:flex}

/* 灯箱 */
.lightbox{
  position:fixed;inset:0;background:rgba(18,18,16,.9);z-index:99;
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.lightbox[hidden]{display:none}
.lightbox img,.lightbox video{max-width:100%;max-height:100%;border-radius:8px}
.lb-close{
  position:absolute;top:18px;right:22px;color:#fff;font-size:26px;line-height:1;
  width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.14);
}

/* ---------- 管理面板 ---------- */

.admin{
  position:fixed;inset:0;background:rgba(24,23,20,.44);z-index:80;
  display:flex;align-items:center;justify-content:center;padding:22px;
}
.admin[hidden]{display:none}
.admin-card{
  width:100%;max-width:640px;max-height:86vh;background:#fff;border-radius:16px;
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.42);
}
.admin-head{display:flex;justify-content:space-between;align-items:flex-start;padding:18px 20px 12px}
.admin-title{font-size:16px;font-weight:600}
.admin-sub{font-size:12px;color:var(--ink3);margin-top:3px}
.admin-tabs{display:flex;gap:2px;padding:0 18px;border-bottom:1px solid var(--line)}
.atab{padding:8px 12px;font-size:13px;color:var(--ink2);border-bottom:2px solid transparent;margin-bottom:-1px}
.atab.on{color:var(--accent);border-bottom-color:var(--accent);font-weight:500}
.admin-body{overflow-y:auto;padding:14px 20px 22px;flex:1}

.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.stat{background:#F7F5F0;border-radius:10px;padding:9px 11px}
.stat b{display:block;font-size:15px;font-weight:600;line-height:1.4}
.stat span{font-size:11px;color:var(--ink3)}

.urow{display:flex;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px solid var(--line2)}
.urow:last-child{border-bottom:none}
.uinfo{flex:1;min-width:0}
.uname{font-size:13.5px;font-weight:500;display:flex;align-items:center;gap:6px}
.umeta{font-size:11.5px;color:var(--ink3);margin-top:1px}
.pill{font-size:10.5px;padding:1px 6px;border-radius:5px;background:var(--soft);color:var(--accent);font-weight:500}
.pill.gray{background:#EDEAE1;color:var(--ink3)}
.pill.red{background:#FCEBEB;color:#A32D2D}
.pill.daren{background:#EEEDFE;color:#3C3489}
.pill.sup{background:#FAC775;color:#412402}
.pill.adm{background:#E1F5EE;color:#0F6E56}
.pill.owner{background:#F1EFE8;color:#6C6B64}
.ubtn{font-size:12px;color:var(--accent);padding:5px 9px;border-radius:6px;white-space:nowrap}
.ubtn:hover{background:var(--soft)}
.ubtn.gray{color:var(--ink2)}
.ubtn.gray:hover{background:rgba(0,0,0,.05)}

.uform{background:#F7F5F0;border-radius:11px;padding:13px;margin:8px 0 12px}
.ftitle{font-size:12.5px;font-weight:500;color:var(--ink2);margin-bottom:9px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.fgrid .full{grid-column:1 / -1}
.fgrid label{font-size:11.5px;color:var(--ink2);display:block;margin-bottom:4px}
.fgrid input,.fgrid select{
  width:100%;height:35px;border:1px solid var(--line);border-radius:8px;
  padding:0 10px;background:#fff;font-size:13px;
}
.fgrid input:focus,.fgrid select:focus{border-color:var(--accent);outline:none}
.factions{display:flex;gap:8px;margin-top:11px;align-items:center;flex-wrap:wrap}
.btn-primary{background:var(--accent);color:#fff;font-size:13px;padding:7px 16px;border-radius:8px}
.btn-primary:hover{background:var(--accent-d)}
.btn-ghost{font-size:13px;color:var(--ink2);padding:7px 12px;border-radius:8px}
.btn-ghost:hover{background:rgba(0,0,0,.05)}
.btn-danger{font-size:13px;color:#A32D2D;padding:7px 12px;border-radius:8px;margin-left:auto}
.btn-danger:hover{background:#FCEBEB}
.chk{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink2);padding:4px 0;cursor:pointer}
.chk input{width:14px;height:14px;accent-color:var(--accent)}
.chk-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;max-height:190px;overflow-y:auto;margin-top:6px}
.hint{font-size:11.5px;color:var(--ink3);margin-top:8px;line-height:1.7}

@media (max-width:600px){
  .admin{padding:0;align-items:flex-end}
  .admin-card{max-height:92vh;border-radius:16px 16px 0 0}
  .stat-row{grid-template-columns:1fr 1fr}
  .fgrid{grid-template-columns:1fr}
  .chk-grid{grid-template-columns:1fr}
  .admin-body{padding:12px 14px 22px}
}

/* 发送者姓名 */
.sender{font-size:11.5px;color:var(--ink3);margin:0 0 3px 2px;line-height:1.3}
.row.me .sender{text-align:right;margin:0 2px 3px 0}

/* 引用块 */
.quote-in{
  background:rgba(0,0,0,.05);border-left:3px solid #C6C1B2;border-radius:6px;
  padding:5px 8px;margin-bottom:5px;font-size:12px;color:var(--ink2);
  line-height:1.45;cursor:pointer;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.quote-in b{font-weight:500;color:var(--ink)}
.row.me .quote-in{background:rgba(255,255,255,.6);border-left-color:#9CCB85}

/* 消息悬停操作 */
.row-act{
  opacity:0;transition:opacity .15s;font-size:11.5px;color:var(--ink3);
  padding:4px 8px;border-radius:6px;align-self:center;white-space:nowrap;
}
.row:hover .row-act{opacity:1}
.row-act:hover{background:rgba(0,0,0,.06);color:var(--ink2)}

/* 引用条 */
.quote-bar{
  display:flex;gap:8px;align-items:center;background:#EAE7DE;border-radius:9px;
  padding:8px 12px;margin-bottom:8px;font-size:12.5px;
}
.quote-bar .qb-name{color:var(--accent);font-weight:500;flex:0 0 auto}
.quote-bar .qb-text{flex:1;min-width:0;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quote-bar button{color:var(--ink3);font-size:17px;line-height:1;padding:0 3px;flex:0 0 auto}

/* 定位高亮 */
.flash .bubble,.flash .file-card,.flash .msg-img,.flash .msg-video{
  animation:flashbg 1.7s ease;
}
@keyframes flashbg{
  0%,100%{box-shadow:0 0 0 0 rgba(239,159,39,0)}
  22%,62%{box-shadow:0 0 0 3px rgba(239,159,39,.55)}
}

/* 搜索结果 */
.sres-head{font-size:11.5px;color:var(--ink3);padding:6px 10px 4px}
.sres{padding:9px 10px;border-radius:9px;cursor:pointer}
.sres:hover{background:rgba(0,0,0,.04)}
.sres-top{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--ink3);margin-bottom:2px}
.sres-name{color:var(--ink2);font-weight:500}
.sres-text{
  font-size:12.5px;color:var(--ink2);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  word-break:break-word;
}
.sres-text mark{background:#FFEBA8;color:inherit;border-radius:2px;padding:0 1px}

/* 同事搜索结果 */
.person{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:9px;cursor:pointer}
.person:hover{background:rgba(0,0,0,.04)}
.person-name{font-size:13.5px;font-weight:500}
.person-meta{font-size:11.5px;color:var(--ink3);margin-top:1px}
.person-go{margin-left:auto;font-size:12px;color:var(--accent);padding:4px 9px;border-radius:6px;background:var(--soft)}

::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(0,0,0,.14);border-radius:5px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.24);background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}

/* ---------- 手机端 ---------- */

@media (max-width:820px){
  .side{width:100%;flex:1 1 100%;border-right:none}
  .app.mobile .side{display:flex}
  .app.mobile .chat{display:none}
  .app.mobile[data-view="chat"] .side{display:none}
  .app.mobile[data-view="chat"] .chat{display:flex}
  .chat-head .back{display:flex}
  .msgs{padding:14px 12px 8px}
  .content{max-width:76vw}
  .msg-img,.msg-video{max-width:70vw}
  .composer{padding:6px 12px calc(10px + env(safe-area-inset-bottom))}
  .conv-list{padding-bottom:12px}
  .login-card{padding:28px 22px 22px}
  .row-act{display:none}
  .drag-h{height:16px;margin:-12px 0 1px}
  .drag-h svg{width:22px;height:10px}
  .quote-in{font-size:11.5px}
}

/* ---------- 经营数据看板 ---------- */
.metrics{
  position:fixed;inset:0;z-index:60;background:var(--bg);
  display:flex;flex-direction:column;
}
.metrics[hidden]{display:none}
.mhead{
  display:flex;align-items:center;gap:10px;padding:14px 22px;
  border-bottom:1px solid var(--line);background:rgba(247,245,240,.97);
  flex-wrap:nowrap;
}
.mtitle{font-size:16px;font-weight:600;letter-spacing:.3px;white-space:nowrap;flex:0 0 auto}
.mhead-right{margin-left:auto;display:flex;gap:8px;align-items:center;min-width:0}
.mhead-right .btn-ghost{flex:0 0 auto;white-space:nowrap}
.mupd{font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbody{padding:18px 22px 28px;overflow:auto}
.mstat{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
.mstat .s{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;
}
.mstat .s b{display:block;font-size:22px;font-weight:600;letter-spacing:-.3px}
.mstat .s span{font-size:12px;color:var(--ink3);display:block;margin-top:4px}
.mcols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mcard{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.mcard-t{padding:12px 16px;font-size:13px;font-weight:600;border-bottom:1px solid var(--line);background:#FCFBF8}
.mlist{padding:6px 0;max-height:52vh;overflow:auto}
.mrow{display:flex;align-items:center;gap:10px;padding:8px 16px;font-size:13px}
.mrow:hover{background:#FAF9F5}
.mrank{width:20px;color:var(--ink3);font-size:12px;text-align:right;flex:0 0 auto}
.mname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mval{font-variant-numeric:tabular-nums;color:var(--ink);flex:0 0 auto}
.msub{font-size:11.5px;color:var(--ink3)}
@media (max-width:760px){
  .mstat{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mcols{grid-template-columns:1fr}
  .mhead{padding:12px 14px;gap:8px}
  .mbody{padding:14px 14px 24px}
  .mcard-t{padding:10px 12px}
  .mtable th,.mtable td{padding:6px 8px;font-size:12px}
  .mtable td:first-child,.mtable th:first-child{max-width:96px}
}

/* 多维度表格 */
.mwrap{overflow:auto;max-height:56vh}
.mtable{width:100%;border-collapse:collapse;font-size:12.5px}
.mtable th,.mtable td{padding:7px 10px;text-align:right;white-space:nowrap}
.mtable th{font-weight:500;color:var(--ink3);font-size:11.5px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#FCFBF8}
.mtable td:first-child,.mtable th:first-child{text-align:left;max-width:130px;overflow:hidden;text-overflow:ellipsis}
.mtable tbody tr:hover{background:#FAF9F5}
.mtable .g{color:var(--ink3);font-size:11px}
.mtable .n{font-variant-numeric:tabular-nums}
.mtable th.sk{cursor:pointer;user-select:none;-webkit-user-select:none}
.mtable th.sk:hover{color:var(--ink)}
.mtable th.sk.on{color:var(--ink);font-weight:600}
.mtable th .ar{font-style:normal;font-size:9px;opacity:.35;margin-left:2px}
.mtable th.sk.on .ar{opacity:1}
.r-high{color:#A32D2D;font-weight:600}
.r-mid{color:#854F0B}
.r-low{color:#0F6E56}

/* 异常提示条 */
.malerts{display:flex;flex-wrap:nowrap;gap:8px;margin-bottom:14px;overflow-x:auto;overflow-y:hidden;padding-bottom:2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.malerts::-webkit-scrollbar{display:none}
.malerts:empty{display:none}

/* 导航：时间 / 维度 */
.mtabs{display:flex;gap:6px;margin-bottom:8px;overflow-x:auto;scrollbar-width:none}
.mtabs::-webkit-scrollbar{display:none}
.mtabs button{
  flex:0 0 auto;border:1px solid var(--line);background:#fff;color:var(--ink2);
  font-size:12.5px;padding:6px 14px;border-radius:8px;cursor:pointer;
  font-family:inherit;line-height:1.2;transition:background .12s,color .12s;
}
.mtabs button:hover{border-color:var(--ink3)}
.mtabs button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.mtabs2{margin-bottom:12px}
.mtabs2 button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.alert{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;white-space:nowrap;
  font-size:12px;padding:5px 10px;border-radius:8px;
  background:#FDF1EF;color:#A32D2D;border:1px solid #F5D6D1;
}
.alert.warn{background:#FDF6EC;color:#854F0B;border-color:#F3E2C7}
.alert.good{background:#EEF7F2;color:#0F6E56;border-color:#D3EADF}
.alert.more{background:#fff;color:#5F5E5A;border-color:#E3E1DA;cursor:pointer}

/* ===== 看板 v2：一屏概览 ===== */
#metricsPanel .mbody{background:#F7F6F2}
.mstat .kpi{background:#fff;border:1px solid #E9E6DC;border-radius:14px;padding:14px 16px}
.mstat .kpi.hot{border-color:#CFE6DC}
.kpi-h{font-size:12px;color:var(--ink3)}
.kpi-n{font-size:28px;font-weight:600;line-height:1.15;margin:4px 0 8px;letter-spacing:-.6px;font-variant-numeric:tabular-nums}
.kpi-n span{font-size:12px;font-weight:400;color:var(--ink3);margin-left:3px;letter-spacing:0}
.kpi-m{font-size:12px;color:var(--ink2);line-height:1.55}
.kpi-r{font-size:12px;color:var(--ink3);margin-top:5px}
.kpi-r i{font-style:normal;font-weight:600}

.mbar{display:flex;align-items:center;gap:12px;margin:4px 0 14px;flex-wrap:wrap}
.seg{display:inline-flex;flex-wrap:wrap;background:#fff;border:1px solid #E9E6DC;border-radius:11px;padding:3px;gap:2px}
.seg button{border:0;background:transparent;color:var(--ink2);font-size:12.5px;padding:6px 15px;border-radius:9px;cursor:pointer;font-family:inherit;line-height:1.2}
.seg button.on{background:var(--accent);color:#fff}
.mbar-tip{font-size:12px;color:var(--ink3)}

.panel{background:#fff;border:1px solid #E9E6DC;border-radius:14px;padding:14px 16px}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.panel-h b{font-size:14px;font-weight:600}
.panel-h span{font-size:11.5px;color:var(--ink3)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}

.ovrow{position:relative;display:flex;align-items:center;gap:8px;height:32px;padding:0 9px;border-radius:7px;font-size:12.5px;overflow:hidden}
.ovrow + .ovrow{margin-top:2px}
.ovrow .fill{position:absolute;left:0;top:0;bottom:0;background:#EAF4EF;border-radius:7px}
.ovrow .nm{position:relative;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ovrow .vv{position:relative;font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
.ovrow .vs{position:relative;font-size:11.5px;color:var(--ink3);white-space:nowrap;min-width:92px;text-align:right;font-variant-numeric:tabular-nums}
.ovempty{font-size:12px;color:var(--ink3);padding:10px 2px}

.trend{display:flex;align-items:flex-end;gap:8px;height:150px;padding:0 2px}
.tr-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px;height:100%}
.tr-v{font-size:11px;color:var(--ink2);font-variant-numeric:tabular-nums}
.tr-b{width:100%;max-width:46px;background:#CFE6DC;border-radius:6px 6px 2px 2px;min-height:4px}
.tr-b.now{background:var(--accent)}
.tr-d{font-size:11px;color:var(--ink3);white-space:nowrap}

.mdetail{margin-top:12px;background:#fff;border:1px solid #E9E6DC;border-radius:14px;overflow:hidden}
.mdetail summary{cursor:pointer;list-style:none;padding:13px 16px;font-size:13px;font-weight:500;color:var(--ink2)}
.mdetail summary::-webkit-details-marker{display:none}
.mdetail summary:before{content:"▸";display:inline-block;margin-right:8px;color:var(--ink3);transition:transform .15s}
.mdetail[open] summary:before{transform:rotate(90deg)}
.mdetail[open] summary{border-bottom:1px solid #E9E6DC}
.mdetail .mtabs2{margin:12px 16px 10px}
.mdetail .mcard{border:0;border-radius:0}

@media (max-width:760px){
  .grid2{grid-template-columns:1fr}
  .kpi-n{font-size:20px;letter-spacing:-.4px}   /* 5 张卡挤 2 列，数字要缩一号，否则会被截断 */
  .ovrow .vs{min-width:80px}
  .trend{height:126px;gap:5px}
}

/* 修正：长名字把单元格撑破 → 允许收缩 */
.grid2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.grid2 > .panel{min-width:0;overflow:hidden}
.ovrow{min-width:0}
@media (max-width:760px){
  .grid2{grid-template-columns:minmax(0,1fr)}
  /* 窄屏放不下 主出商品 + 退款三档：允许换行，别把字裁掉 */
  .ovrow .pp{margin-right:0}
  .ovrow.tall .vs{flex-wrap:wrap;row-gap:2px}
  .ovrow.tall .rf{white-space:normal}
}

/* ===== 桌面端版式（定宽居中）===== */
#metricsPanel .mbody{display:flex;flex-direction:column;align-items:center;padding:22px 28px 44px}
#metricsPanel .mbody > *{width:100%;max-width:1240px}
.kpi-d{font-size:11.5px;color:var(--ink3);margin:-2px 0 8px}
.ovrow .rk{position:relative;flex:0 0 auto;width:15px;font-size:11px;color:var(--ink3);text-align:center;font-variant-numeric:tabular-nums}
.ovrow .nm{padding-left:2px}
.mstat{gap:14px}
.panel{padding:16px 18px}
.panel-h{margin-bottom:12px}
@media (min-width:1101px){
  .grid2{gap:14px}
  .trend{height:168px}
}

/* 修正：纵向 flex 容器里子块被压缩 */
#metricsPanel .mbody > *{flex:0 0 auto}
#metricsPanel .malerts{height:auto}

/* 30 天趋势：更紧凑 */
.trend{gap:5px}
.tr-v{font-size:11px;white-space:nowrap;min-height:15px}
.tr-d{font-size:11px}

/* ===== 概览行：栅格化 + 分色 ===== */
.ovrow{
  display:grid;grid-template-columns:16px minmax(0,1fr) auto 156px;
  align-items:center;gap:10px;height:34px;padding:0 10px;
  border-radius:8px;font-size:13px;overflow:hidden;
}
.ovrow .fill{background:var(--fill,#EAF4EF)}
.ovrow .rk{width:auto;text-align:left}
.ovrow .nm{padding-left:0;font-size:13px}
.ovrow .vv{font-size:13px;font-weight:600;text-align:right;letter-spacing:-.1px}
.ovrow .vs{display:flex;justify-content:flex-end;align-items:center;gap:6px;min-width:0;text-align:right}
.ovrow .sh{font-size:11.5px;color:var(--ink3);white-space:nowrap;font-variant-numeric:tabular-nums}

.panel-h b{display:flex;align-items:center;gap:7px}
.panel-h b:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--pc,#0F6E56);flex:0 0 auto}
.panel-h span{font-variant-numeric:tabular-nums}

.rr{font-size:11px;padding:2px 7px;border-radius:6px;white-space:nowrap;font-variant-numeric:tabular-nums}
.rr.low{background:#EAF4EF;color:#0F6E56}
.rr.mid{background:#FBF0DF;color:#854F0B}
.rr.high{background:#FBEAE8;color:#A32D2D}

.kpi.hot{background:#FBFEFC}

/* 第一名加深 + 每块主色更明显 */
.ovrow.top .fill{background:var(--fill2,#DCEFE5)}
.ovrow.top .vv{color:var(--pc,#0F6E56)}

/* 每块顶部色条：区分四个维度 */
.grid2 > .panel{position:relative;overflow:hidden;padding-top:19px}
.grid2 > .panel:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--pc,#0F6E56)}

/* 导航吸顶 + 日期区间 */
.mbar{
  position:sticky;top:-22px;z-index:20;background:#F7F6F2;
  padding:10px 0 10px;margin:0 0 12px;border-bottom:1px solid #ECE9DF;
}
.mrange{display:flex;align-items:center;gap:6px;margin-left:auto}
.mrange input[type=date]{
  border:1px solid #E9E6DC;border-radius:9px;padding:5px 8px;background:#fff;
  font-size:12.5px;font-family:inherit;color:var(--ink);outline:none;
}
.mrange input[type=date]:focus{border-color:var(--accent)}
.mrange-sep{font-size:12px;color:var(--ink3)}
.mgo{border:0;border-radius:9px;background:var(--ink);color:#fff;padding:7px 14px;font-size:12.5px;cursor:pointer;font-family:inherit}
.mclear{border:1px solid #E9E6DC;border-radius:9px;background:#fff;color:var(--ink2);padding:7px 12px;font-size:12.5px;cursor:pointer;font-family:inherit}
.mgo:hover{background:#000}
.mclear:hover{border-color:var(--ink3)}

/* KPI：销售额优先 */
.kpi-n{font-size:24px;letter-spacing:-.8px;margin:6px 0 2px}
.kpi-sub{font-size:12.5px;color:var(--ink3);margin-bottom:8px;font-variant-numeric:tabular-nums}
.kpi-sub b{color:var(--ink);font-size:13.5px;font-weight:600}

/* 趋势图：等宽网格 + 独立坐标轴 */
.trend{display:grid;align-items:end;gap:4px;height:150px;padding:0}
.tr-col{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:0;height:100%}
.tr-v{font-size:11px;color:var(--ink2);white-space:nowrap;margin-bottom:4px;font-variant-numeric:tabular-nums}
.tr-b{width:100%;max-width:none;border-radius:5px 5px 2px 2px;margin:0 auto}
.tr-b.zero{background:#EFEDE6}
.tr-axis{display:grid;gap:4px;margin-top:7px;border-top:1px solid #EDEAE1;padding-top:6px}
.tr-axis div{font-size:11px;color:var(--ink3);text-align:center;white-space:nowrap;overflow:visible}
.kpi-rr{display:block;font-size:11px;color:var(--ink3);margin-top:1px}

/* 数据面板入口：跳动音柱（颜色交给 .rail/.icon-btn 统一管，别在这写死） */
#btnMetrics .eq rect{transform-box:fill-box;transform-origin:50% 100%}
#btnMetrics .eq .b1{animation:eqA 1.1s ease-in-out infinite}
#btnMetrics .eq .b2{animation:eqB 1.6s ease-in-out infinite .18s}
#btnMetrics .eq .b3{animation:eqC .85s ease-in-out infinite .36s}
@keyframes eqA{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes eqB{0%,100%{transform:scaleY(1)}45%{transform:scaleY(.28)}}
@keyframes eqC{0%,100%{transform:scaleY(.45)}60%{transform:scaleY(1)}}
@media (prefers-reduced-motion: reduce){
  #btnMetrics .eq rect{animation:none}
}

/* 账单数据入口：同样跳动，节奏跟经营数据错开（颜色同上，交给外层） */
#btnBill .eq rect{transform-box:fill-box;transform-origin:50% 100%}
#btnBill .eq .b1{animation:eqB 1.35s ease-in-out infinite .1s}
#btnBill .eq .b2{animation:eqA .95s ease-in-out infinite .25s}
#btnBill .eq .b3{animation:eqC 1.15s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){
  #btnBill .eq rect{animation:none}
}
.pmore{margin-left:10px;border:0;background:transparent;color:var(--accent);font-size:11.5px;cursor:pointer;font-family:inherit;padding:0}
.pmore:hover{text-decoration:underline}

/* 达人两块：两行展示退款三档 */
.ovrow.tall{
  height:auto;padding:7px 10px;
  grid-template-columns:16px minmax(0,1fr) auto;
  grid-template-rows:auto auto;row-gap:1px;
}
.ovrow.tall .rk{grid-column:1;grid-row:1 / span 2;align-self:center}
.ovrow.tall .nm{grid-column:2;grid-row:1}
.ovrow.tall .vv{grid-column:3;grid-row:1}
.ovrow.tall .vs{grid-column:2 / span 2;grid-row:2;justify-content:flex-start}
.ovrow.tall .rf{font-size:11px;color:var(--ink3);white-space:nowrap}
.ovrow.tall .rf i{font-style:normal;margin:0 4px;color:#D9D6CB}
.ovrow.tall .rf b{font-weight:600}
.ovrow.tall .vs{gap:8px;flex-wrap:nowrap;overflow:hidden}
.ovrow.tall .sep{width:1px;height:10px;background:#E4E1D7;flex:0 0 auto}
.ovrow.tall .sh{font-size:11px}

/* 主播·金额：主出商品小标签（靠左，退款三档被推到右边对齐） */
.ovrow .pp{
  display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;margin-right:auto;
  max-width:236px;padding:1px 6px 1px 5px;border-radius:5px;
  background:rgba(255,255,255,.72);border:1px solid rgba(15,110,86,.12);
  font-size:10.5px;line-height:14px;white-space:nowrap;overflow:hidden
}
.ovrow .pp i{font-style:normal;color:#93A09A;font-size:9.5px;letter-spacing:.2px;flex:0 0 auto}
.ovrow .pp b{font-weight:600;color:#0F6E56;max-width:152px;overflow:hidden;text-overflow:ellipsis}
.ovrow .pp em{font-style:normal;color:#1D9E75;font-size:10px;font-variant-numeric:tabular-nums;flex:0 0 auto}

/* 面板内最多展示 8 行，可下滑到 30 行 */
.ovlist{max-height:392px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#D9D6CB transparent;padding-right:2px}
.ovlist::-webkit-scrollbar{width:6px}
.ovlist::-webkit-scrollbar-thumb{background:#E0DDD2;border-radius:3px}
.ovlist::-webkit-scrollbar-track{background:transparent}
.ovlist{max-height:448px}

/* 走势图：可点击选中 */
.tr-col{cursor:pointer}
.tr-col .tr-b{transition:outline-color .12s}
.tr-col.sel .tr-b{outline:2px solid var(--ink);outline-offset:1px}
.tr-v{font-size:10.5px}
.tr-info{display:flex;align-items:center;gap:12px;margin-top:10px;padding-top:8px;border-top:1px dashed #EDEAE1;font-size:12px;color:var(--ink3)}
.tr-info b{font-size:13px;color:var(--ink);font-weight:600}
.tr-info em{margin-left:auto;font-style:normal;font-size:11px;color:#B5B2A9}

/* 主播搜索 */
.msearch{display:flex;align-items:center;gap:6px}
.msearch input{
  width:220px;border:1px solid #E9E6DC;border-radius:9px;padding:6px 10px;
  font-size:12.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none;
}
.msearch input:focus{border-color:var(--accent)}
.mgo2{border:1px solid #E9E6DC;background:#fff;color:var(--ink);border-radius:9px;padding:6px 12px;font-size:12.5px;cursor:pointer;font-family:inherit}
.mgo2:hover{border-color:var(--ink3)}

/* 主播全维度详情卡 */
.detailcard{grid-column:1 / -1;margin-bottom:0}
.detailcard .mtable{font-size:12.5px}
.detailcard .mtable th,.detailcard .mtable td{padding:8px 10px}
.ovrow .uid{font-style:normal;font-size:10.5px;color:#B5B2A9;margin-left:8px;font-variant-numeric:tabular-nums;letter-spacing:0}
.kpi-m + .kpi-m{margin-top:1px}

/* 五张卡：累计卡用深色锚定 */
.mstat{grid-template-columns:repeat(5,minmax(0,1fr))}
.kpi.total{background:var(--ink);border-color:var(--ink)}
.kpi.total .kpi-h{color:rgba(255,255,255,.6)}
.kpi.total .kpi-n{color:#fff}
.kpi.total .kpi-sub{color:rgba(255,255,255,.55)}
.kpi.total .kpi-sub b{color:#fff}
.kpi.total .kpi-m{color:rgba(255,255,255,.75)}
.kpi.total .kpi-r{color:rgba(255,255,255,.55)}
.kpi.total .kpi-rr{color:rgba(255,255,255,.4)}
.kpi.total .kpi-r i{color:#7FD8B4}
@media (max-width:1100px){
  .mstat{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.kpi.total .kpi-r i.r-high{color:#FF9B95}
.kpi.total .kpi-r i.r-mid{color:#F5C36B}
.kpi.total .kpi-r i.r-low{color:#7FD8B4}

/* 累计卡改为与其它卡一致（用户不喜欢黑底） */
.kpi.total{background:#fff;border-color:#E9E6DC}
.kpi.total .kpi-h{color:var(--ink3)}
.kpi.total .kpi-n{color:var(--ink)}
.kpi.total .kpi-sub{color:var(--ink3)}
.kpi.total .kpi-sub b{color:var(--ink)}
.kpi.total .kpi-m{color:var(--ink2)}
.kpi.total .kpi-r{color:var(--ink3)}
.kpi.total .kpi-rr{color:var(--ink3)}
.kpi.total .kpi-r i.r-high{color:#A32D2D}
.kpi.total .kpi-r i.r-mid{color:#854F0B}
.kpi.total .kpi-r i.r-low{color:#0F6E56}

/* 窄屏：主出商品 + 退款三档放不下一行，允许折行，别把字裁掉 */
@media (max-width:760px){
  .ovrow.tall .vs{flex-wrap:wrap;row-gap:2px}
  .ovrow.tall .rf{white-space:normal}
  .ovrow .pp{margin-right:0;max-width:100%}
}
@media (max-width:760px){
  .ovrow .pp + .sep{display:none}
}

/* ===== 区间总览（自定义 / 近90 / 近180） ===== */
#mRange{margin-top:12px}
#mRange:empty{display:none}
.ov{padding:14px 18px 12px}
.ov-h{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.ov-h b{font-size:14px;font-weight:600;display:flex;align-items:center;gap:7px}
.ov-h b:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent,#0F6E56);flex:0 0 auto}
.ov-h span{font-size:11.5px;color:var(--ink3)}
.ov-h i{font-style:normal;margin-left:auto;font-size:11px;color:#B5B2A9}
.ovg{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.ovg .cell{padding:0 14px;border-left:1px solid #F0EDE4;min-width:0}
.ovg .cell:first-child{border-left:0;padding-left:0}
.ovg .lb{font-size:11px;color:var(--ink3)}
.ovg .nm{font-size:21px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.4px;
  margin-top:1px;white-space:nowrap}
.ovg .nm small{font-size:11.5px;font-weight:400;color:var(--ink3);margin-left:3px;letter-spacing:0}
.ovg .nm em{font-style:normal;font-size:11px;margin-left:5px;letter-spacing:0;vertical-align:2px;white-space:nowrap}
.ovg .dl.up{color:#C7443E}
.ovg .dl.down{color:#1D9E75}
.ovg .sub{font-size:10.5px;color:var(--ink3);margin-top:2px;font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov .foot{margin-top:10px;padding-top:8px;border-top:1px dashed #F0EDE4;font-size:10.5px;
  color:var(--ink3);display:flex;gap:16px;flex-wrap:wrap}
@media (max-width:1100px){
  .ovg{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:14px}
  .ovg .cell{padding-left:0;border-left:0}
}
@media (max-width:560px){
  .ovg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ovg .nm{font-size:18px}
  .ov-h{flex-wrap:wrap;gap:4px}
  .ov-h i{margin-left:0}
}
.ovload{font-size:12px;color:var(--ink3);padding:10px 0 6px}

/* ===== 近1小时出单明细（只在今日显示） ===== */
#mLive{margin-top:12px}
#mLive:empty{display:none}
#mLive .live{padding:0;overflow:hidden}
.lv-h{display:flex;align-items:center;gap:8px;padding:8px 16px 7px;border-bottom:1px solid #F3F0E7}
.lv-h .dot{width:6px;height:6px;border-radius:50%;background:#1D9E75;box-shadow:0 0 0 3px rgba(29,158,117,.15);flex:0 0 auto}
.lv-h b{font-size:13.5px;font-weight:600}
.lv-h .cnt{font-size:13.5px;font-weight:600;color:#0F6E56;font-variant-numeric:tabular-nums}
.lv-h .unit{font-size:11.5px;color:var(--ink3);margin-left:-4px}
.lv-h em{margin-left:auto;font-style:normal;font-size:11.5px;color:#B5B2A9}

.lv-head,.lv-row{display:grid;gap:10px;align-items:center;padding:0 16px;
  grid-template-columns:minmax(0,1.25fr) minmax(0,1.1fr) minmax(0,.65fr) 84px 98px}
.lv-head{height:24px;font-size:11px;color:#B5B2A9;letter-spacing:.3px;border-bottom:1px solid #F7F4EC}
.lv-head span:nth-child(4),.lv-head span:nth-child(5){text-align:right}
.lv-body{position:relative;height:120px;overflow:hidden}
.lv-row{height:30px;font-size:13.5px;border-bottom:1px solid #FAF8F1}
.lv-row:last-child{border-bottom:0}
.lv-row .p{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-row .s{color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-row .u{color:var(--ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-row .a{text-align:right;color:#0F6E56;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.lv-row .t{text-align:right;color:#A8A499;font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:760px){
  .lv-head,.lv-row{grid-template-columns:minmax(0,1.6fr) minmax(0,.75fr) 62px 72px;gap:6px;padding:0 12px}
  .lv-head span:nth-child(2),.lv-row .s{display:none}
  .lv-row{font-size:12.5px}
  .lv-row .p{font-size:13px}
  .lv-row .a,.lv-row .t{font-size:12px}
  .lv-h em{display:none}
}

/* ===== 顶部：今日实时大卡（深红渐变） ===== */
#mStats.mstat,#bStats.mstat{display:block}
.khero{position:relative;border-radius:18px;padding:18px 22px 16px;color:#fff;overflow:hidden;
  background:linear-gradient(118deg,#8C0A1F 0%,#B30F33 48%,#D61E4A 100%);
  box-shadow:0 12px 30px rgba(140,10,31,.20), inset 0 1px 0 rgba(255,255,255,.14)}
.khero:after{content:"";position:absolute;right:-60px;top:-90px;width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.16),rgba(255,255,255,0) 65%)}
.kh-top{position:relative;display:flex;align-items:center;gap:10px;font-size:12.5px;
  color:rgba(255,255,255,.82);margin-bottom:10px}
.kh-top b{font-size:13px;color:#fff;font-weight:600}
.kh-top .rt{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:#fff;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);border-radius:999px;
  padding:1px 8px 1px 6px}
.kh-top .rt i{width:6px;height:6px;border-radius:50%;background:#7CFAC0;animation:kpulse 1.6s infinite}
@keyframes kpulse{0%{box-shadow:0 0 0 0 rgba(124,250,192,.7)}70%{box-shadow:0 0 0 7px rgba(124,250,192,0)}100%{box-shadow:0 0 0 0 rgba(124,250,192,0)}}
.kh-top em{margin-left:auto;font-style:normal;font-size:11px;color:rgba(255,255,255,.62)}

.kh-spark{position:absolute;right:22px;top:44px;width:236px;height:74px;display:flex;align-items:flex-end;gap:6px;opacity:.9}
.kh-spark .kh-bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.kh-spark .kh-bar-fill{background:rgba(255,255,255,.42);border-radius:3px 3px 0 0}
.kh-spark .kh-bar:last-child .kh-bar-fill{background:rgba(255,255,255,.82)}
.kh-spark .kh-bar span{font-size:9px;color:rgba(255,255,255,.55);text-align:center;margin-top:3px;white-space:nowrap}

.kh-nums{position:relative;display:flex;align-items:flex-end;gap:52px;margin-bottom:14px}
.kh-nums .nl{font-size:11.5px;color:rgba(255,255,255,.72);margin-bottom:1px}
.kh-nums .num{font-size:46px;font-weight:600;letter-spacing:-1.5px;line-height:1.05;
  font-variant-numeric:tabular-nums;text-shadow:0 2px 12px rgba(0,0,0,.12)}
.kh-nums .num small{font-size:24px;font-weight:500;margin-right:2px;letter-spacing:0}
.kh-nums .num2{font-size:26px;font-weight:600;letter-spacing:-.6px;font-variant-numeric:tabular-nums;
  color:rgba(255,255,255,.9)}
.kh-nums .dlt{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;
  background:rgba(0,0,0,.16);border-radius:7px;padding:2px 9px;margin-bottom:6px;white-space:nowrap}

.kh-sub{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid rgba(255,255,255,.18);padding-top:11px}
.kh-sub .kh-cell{padding:0 18px;border-left:1px solid rgba(255,255,255,.14)}
.kh-sub .kh-cell:first-child{padding-left:0;border-left:0}
.kh-sub .kh-lab{font-size:11px;color:rgba(255,255,255,.68)}
.kh-sub .kh-val{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.kh-sub .kh-val small{font-size:11px;font-weight:400;opacity:.72;margin-left:2px}
.kh-sub .kh-note{font-size:10.5px;color:rgba(255,255,255,.6)}

.kstrip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:#fff;
  border:1px solid var(--line);border-radius:14px;margin-top:12px;padding:12px 0}
.kstrip .ks-it{padding:0 18px;border-left:1px solid #F3F0E7;min-width:0}
.kstrip .ks-it:first-child{border-left:0}
.kstrip .ks-lab{font-size:11px;color:var(--ink3)}
.kstrip .ks-val{font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:1px;white-space:nowrap}
.kstrip .ks-val small{font-size:11px;font-weight:400;color:var(--ink3);margin-left:2px}

.k4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}
.k4 .km{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px 16px;min-width:0}
.k4 .km-h{font-size:11.5px;color:var(--ink3)}
.k4 .km-n{font-size:21px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.4px;margin:1px 0 3px}
.k4 .km-s{font-size:11px;color:var(--ink3);font-variant-numeric:tabular-nums;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.k4 .km-s b{color:var(--ink2);font-weight:600}
.k4 .km-s i{font-style:normal}

@media (max-width:560px){
  .k4 .km-comm{display:none}
}
@media (max-width:980px){
  .kh-spark{display:none}
  .kh-nums{gap:26px;flex-wrap:wrap}
  .kh-nums .num{font-size:38px}
  .kh-sub{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}
  .kh-sub .kh-cell:nth-child(3){padding-left:0;border-left:0}
  .kstrip{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}
  .k4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* 经营数据面板：主播的渠道运营归属小胶囊（2026-10-20） */
.optag{display:inline-block;margin-left:6px;font-size:10.5px;line-height:1;padding:3px 7px;
 border-radius:999px;background:#EAF4EF;color:#0F6E56;border:1px solid #C9E4D6;
 font-weight:500;white-space:nowrap;vertical-align:1px}
.optag.none{background:#F3F1E9;color:#9E9C93;border-color:#E7E4D8}

/* 时间页签变多后，窄屏改成横向滑动，别把字挤成竖排 */
@media (max-width:820px){
  #mTimeTabs{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;max-width:100%}
  #mTimeTabs::-webkit-scrollbar{display:none}
  #mTimeTabs button{flex:0 0 auto;white-space:nowrap;padding:5px 10px}
}

/* ===== 经营数据 · 玻璃拟态（G 版，只作用于 .metrics） ===== */
.metrics{background:
  radial-gradient(680px 420px at 12% 0%, #FFD9E4 0%, rgba(255,217,228,0) 62%),
  radial-gradient(620px 400px at 88% 8%, #D6E4FF 0%, rgba(214,228,255,0) 60%),
  radial-gradient(760px 520px at 62% 92%, #DDF7EA 0%, rgba(221,247,234,0) 62%),
  #F2F3F9 !important;}
.metrics .mhead{background:transparent;border:0}
.metrics .mtitle{font-size:20px;font-weight:600;letter-spacing:-.4px}
.metrics .mupd{color:#8A8A9A}
.metrics .metrics-panel,.metrics .mbody{background:transparent}

/* 卡片统一玻璃 */
.metrics .kstrip,
.metrics .k4 .km,
.metrics .panel,
.metrics .malerts,
.metrics .mrange,
.metrics .msearch input,
.metrics .mgo,.metrics .mgo2,.metrics .mclear{}

.metrics .kstrip{background:rgba(255,255,255,.62);backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);border:1px solid rgba(255,255,255,.9);
  border-radius:18px;box-shadow:0 12px 30px -22px rgba(27,27,34,.35)}
.metrics .k4 .km{background:rgba(255,255,255,.62);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.9);border-radius:16px;
  box-shadow:0 10px 26px -20px rgba(27,27,34,.4)}
.metrics .panel{background:rgba(255,255,255,.62);backdrop-filter:blur(18px) saturate(1.15);
  -webkit-backdrop-filter:blur(18px) saturate(1.15);border:1px solid rgba(255,255,255,.9);
  border-radius:18px;box-shadow:0 12px 30px -24px rgba(27,27,34,.35)}
.metrics .malerts{background:rgba(255,246,244,.86);backdrop-filter:blur(14px);
  border:1px solid rgba(255,214,205,.9);border-radius:14px}

/* 今日卡 */
.metrics .khero{border-radius:22px;box-shadow:0 20px 44px -18px rgba(142,18,48,.55)}
.metrics .kh-sub{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 0}
.metrics .kh-cell{padding:10px 18px}
.metrics .kh-cell:nth-child(4){padding-left:0;border-left:0}
.metrics .kh-val{font-size:19px}
.metrics .kh-lab{font-size:10.5px;color:rgba(255,255,255,.7)}
.metrics .kh-note{font-size:10px;color:rgba(255,255,255,.55)}

/* 页签 */
.metrics .mbar .seg{background:rgba(255,255,255,.55);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.9);border-radius:14px;padding:4px}
.metrics .mbar .seg button{border-radius:10px;color:#5B5B6B}
.metrics .mbar .seg button.on{background:#fff;color:#1B1B22;box-shadow:0 2px 8px rgba(27,27,34,.10)}
.metrics .mgo,.metrics .mgo2,.metrics .mclear,.metrics .mrange input,.metrics .msearch input{
  background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.9);border-radius:10px}

/* 四块行：归属徽章 + 退款拆分 */
.metrics .optag{display:inline-block;font-size:10px;padding:0 6px;border-radius:6px;
  background:rgba(29,158,117,.12);color:#12694C;margin-left:6px;font-weight:500;vertical-align:1px}
.metrics .optag.none{background:rgba(140,140,155,.12);color:#7A7A8A}
.metrics .ovrow .rf b{font-variant-numeric:tabular-nums}
.metrics .ovrow{--fill:rgba(193,26,68,.10)}

/* 价位表：占比小条 */
.metrics .mtable .pbar{display:inline-block;width:42px;height:5px;border-radius:3px;
  background:rgba(27,27,34,.08);margin-right:6px;vertical-align:1px;overflow:hidden}
.metrics .mtable .pbar i{display:block;height:100%;border-radius:3px;background:#C11A44}

/* 价位表：按商品合并单元格 + 分组线 */
.metrics .mtable.mtier .tprod{vertical-align:top;font-weight:500;line-height:1.5;padding-top:9px;
  border-right:1px solid rgba(27,27,34,.06)}
.metrics .mtable.mtier .tprod i{display:block;font-style:normal;font-size:10px;font-weight:400;
  color:#9A9AA2;margin-top:2px}
.metrics .mtable.mtier tr.gfirst td{border-top:1px solid rgba(27,27,34,.16)}
.metrics .mtable.mtier tbody tr:first-child td{border-top:0}

/* 账单数据 KPI 区（沿用经营数据设计，2026-10-20） */
#billPanel .bsub{grid-template-columns:repeat(4,minmax(0,1fr))}
.bk4{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
@media (max-width:980px){ .bk4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:560px){
  .bk4{grid-template-columns:1fr}
  #billPanel .bsub{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:10px}
  #billPanel .bsub .kh-cell{padding:6px 12px}
  #billPanel .bsub .kh-cell:nth-child(3){padding-left:0;border-left:0}
  .khero .kh-nums{gap:16px}
  .khero .kh-nums .num{font-size:30px;letter-spacing:-.8px}
  .khero .kh-nums .num small{font-size:16px}
  .khero .kh-nums .num2{font-size:18px}
}

/* 账单数据 · 今日大卡配色（用户 2026-10-20 选定 F 青蓝，只作用于账单面板） */
#billPanel .khero{
  background:linear-gradient(118deg,#07384A 0%,#0C6480 48%,#1691B4 100%);
  box-shadow:0 20px 44px -18px rgba(7,56,74,.55), inset 0 1px 0 rgba(255,255,255,.14)
}

/* 顶部两个入口图标：渐变流动 + 呼吸光晕 */
@keyframes a8GlowRed{0%,100%{filter:drop-shadow(0 0 0 rgba(214,30,74,0))}
  50%{filter:drop-shadow(0 1px 6px rgba(214,30,74,.55))}}
@keyframes a8GlowTeal{0%,100%{filter:drop-shadow(0 0 0 rgba(22,145,180,0))}
  50%{filter:drop-shadow(0 1px 6px rgba(22,145,180,.55))}}
#btnMetrics .eq{animation:a8GlowRed 2.6s ease-in-out infinite}
#btnBill .eq{animation:a8GlowTeal 2.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){
  #btnMetrics .eq,#btnBill .eq{animation:none}
  #btnMetrics .eq rect,#btnBill .eq rect{animation:none!important}
}

/* 顶部图标：自定义悬停提示（比系统原生 title 快、样式统一） */
.icon-btn[data-tip]{position:relative}
.icon-btn[data-tip]::after{
  content:attr(data-tip);
  position:absolute;top:calc(100% + 7px);right:-4px;
  background:rgba(28,28,30,.93);color:#fff;
  font-size:11.5px;line-height:1;letter-spacing:.2px;
  padding:6px 9px;border-radius:7px;white-space:nowrap;
  opacity:0;visibility:hidden;transform:translateY(-3px);
  transition:opacity .13s ease,transform .13s ease,visibility .13s;
  pointer-events:none;z-index:80;
}
.icon-btn[data-tip]::before{
  content:"";position:absolute;top:calc(100% + 2px);right:9px;
  border:4px solid transparent;border-bottom-color:rgba(28,28,30,.93);
  opacity:0;visibility:hidden;transition:opacity .13s ease,visibility .13s;
  pointer-events:none;z-index:80;
}
.icon-btn[data-tip]:hover::after{opacity:1;visibility:visible;transform:translateY(0)}
.icon-btn[data-tip]:hover::before{opacity:1;visibility:visible}

/* 暂停刷新按钮的「已暂停」状态 */
.metrics .mhead .btn-ghost.paused{color:#8A5A12;border-color:#E8C98A;background:#FDF6E7}

/* 没有 UID 时的灰色说明 */
.metrics .ovrow .uid.none{color:#B0AEA6;font-style:normal}

/* 直播中 / 已下播 + 预估时长 */
.metrics .lvbadge{display:inline-flex;align-items:center;gap:5px;margin-left:7px;padding:1px 8px 1px 7px;
  border-radius:20px;font-size:10px;font-weight:500;vertical-align:1px;white-space:nowrap}
.metrics .lvbadge.on{background:#E7F8EF;color:#0E7B52}
.metrics .lvbadge.off{background:#F2F3F5;color:#8A8F99}
.metrics .lvbadge .dot{width:5px;height:5px;border-radius:50%;background:#12B76A;
  box-shadow:0 0 0 0 rgba(18,183,106,.6);animation:a8pulse 1.6s infinite}
.metrics .lvbadge.off .dot{background:#B4B8C0;animation:none}
@keyframes a8pulse{0%{box-shadow:0 0 0 0 rgba(18,183,106,.55)}
  70%{box-shadow:0 0 0 5px rgba(18,183,106,0)}100%{box-shadow:0 0 0 0 rgba(18,183,106,0)}}
.metrics .lv-hours{display:inline-block;font-size:11px;font-weight:600;color:#0E7B52;margin-left:4px;
  font-variant-numeric:tabular-nums;white-space:nowrap;vertical-align:1px}
.metrics .lvbadge.off + .lv-hours{color:#8A8F99;font-weight:500}

/* 实测标记（百应数据参谋） */
.metrics .lvbadge.real{background:#EEF1F5;color:#5F6672}
.metrics .lv-hours.real{color:#5F6672}

/* 视频数日增标记 */
.metrics .mtable .vdl{font-style:normal;font-size:10px;margin-left:5px;color:#8A8F99}
.metrics .mtable .vdl.up{color:#C0392B}
.metrics .mtable .vdl.dn{color:#0E7B52}
.metrics .mtable .na{color:#C4C8CE}
.metrics .kstrip .ks-note{font-size:9.5px;color:#9AA0A9;margin-top:1px}

/* ===== 页头样式预览（切换条 + 五种版式） ===== */
.mh-switch{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:200;
  display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:14px;
  background:rgba(20,22,26,.88);backdrop-filter:blur(12px);box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.mh-switch b{font-size:10.5px;color:#9AA0A9;font-weight:500;margin-right:2px}
.mh-switch button{font-family:inherit;font-size:11px;color:#C9CED6;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:4px 9px;cursor:pointer}
.mh-switch button:hover{background:rgba(255,255,255,.14);color:#fff}
.mh-switch button.on{background:#fff;color:#14161A;border-color:#fff;font-weight:600}

.metrics .mhead{display:flex;align-items:flex-end;justify-content:space-between}
.metrics .mh-l{display:flex;align-items:center;gap:14px}
.metrics .mh-txt{display:flex;flex-direction:column}
.metrics .mh-mark{display:none}
.metrics .mh-en{display:none}

/* 现状（默认） */
.metrics .mhead .mtitle{font-size:20px;font-weight:600;letter-spacing:-.4px}

/* P 衬线刊头 */
.metrics .mhead.mh-P{align-items:flex-end}
.metrics .mh-P .mh-mark{display:block;width:22px;height:2px;background:#A8102B;align-self:flex-start;margin-top:14px}
.metrics .mh-P .mtitle{font-family:"Songti SC","Times New Roman",serif;font-size:23px;font-weight:600;
  letter-spacing:2.4px;color:#17181C}
.metrics .mh-P .mh-en{display:block;font-family:Georgia,"Times New Roman",serif;font-style:italic;
  font-size:10.5px;color:#A9AFB8;margin-top:7px;letter-spacing:.5px}

/* Q 品牌锁定 */
.metrics .mh-Q .mh-mark{display:grid;place-items:center;width:26px;height:26px;border-radius:6px;
  background:#8C0A1F;color:#fff;font-size:10px;font-weight:600;letter-spacing:.5px}
.metrics .mh-Q .mtitle{font-size:15px;font-weight:500;letter-spacing:1.8px;color:#17181C}
.metrics .mh-Q .mh-en{display:block;font-size:7.5px;letter-spacing:3.2px;color:#AEB4BD;margin-top:3px}

/* R 留白 */
.metrics .mh-R .mh-mark{display:none}
.metrics .mh-R .mtitle{font-size:27px;font-weight:300;letter-spacing:3.4px;color:#1A1B1F}
.metrics .mh-R .mh-en{display:block;font-size:8px;letter-spacing:5.2px;color:#B7BDC6;margin-top:10px}

/* S 细框 */
.metrics .mhead.mh-S{border:1px solid rgba(20,22,26,.13);background:rgba(255,255,255,.5);
  padding:14px 20px;border-radius:0}
.metrics .mh-S .mtitle{font-size:15px;font-weight:500;letter-spacing:2.6px;color:#17181C}
.metrics .mh-S .mh-en{display:block;font-size:7.5px;letter-spacing:2.8px;color:#ACB2BB;margin-top:4px}

/* T 一枚红点 */
.metrics .mh-T .mh-mark{display:block;width:6px;height:6px;border-radius:50%;background:#A8102B;
  align-self:flex-start;margin-top:11px}
.metrics .mh-T .mtitle{font-size:20px;font-weight:500;letter-spacing:1.2px;color:#17181C}
.metrics .mh-T .mh-en{display:inline;font-size:8px;letter-spacing:3.6px;color:#B2B8C1;margin-left:11px}
.metrics .mh-T .mh-txt{flex-direction:row;align-items:baseline}

/* 修：标记元素里的 A8 文字不要漏出来（除 Q 版） */
.metrics .mh-mark{font-size:0;line-height:0;color:transparent;overflow:hidden}
.metrics .mh-Q .mh-mark{font-size:10px;line-height:1;color:#fff}

/* 主播行里的视频数 */
.metrics .ovrow .sh.vid{color:#8A8F99}
.metrics .ovrow .sh.vid .vdl{font-style:normal;font-weight:600;font-size:10.5px}
.metrics .ovrow .sh.vid .vdl.up{color:#C0392B}
.metrics .ovrow .sh.vid .vdl.dn{color:#0E7B52}

/* 视频数：做成小胶囊，比退款率那串更醒目一点 */
.metrics .ovrow .sh.vid{display:inline-flex;align-items:center;gap:2px;height:17px;padding:0 7px;
  border-radius:9px;background:#EDF2F8;color:#4A5462;font-size:10.5px;font-weight:500;
  border:1px solid #DFE7F1}
.metrics .ovrow .sh.vid b{font-weight:700;color:#1B2028;font-size:11px;font-variant-numeric:tabular-nums}
.metrics .ovrow .sh.vid .vdl{font-size:10px;margin-left:3px}

/* 手机：今日卡六格改两列，避免「¥6,375.74」和「9.31%」挤在一起 */
@media (max-width:740px){
  .metrics .kh-sub{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 0}
  .metrics .kh-sub .kh-cell{padding:0 12px;border-left:1px solid rgba(255,255,255,.14)}
  .metrics .kh-sub .kh-cell:nth-child(odd){padding-left:0;border-left:0}
  .metrics .kh-sub .kh-val{font-size:19px}
}

/* ===== 时间导航：选中态用深绿实底，明显凸起（两个中心统一） ===== */
.seg button.on,
.metrics .mbar .seg button.on{
  background:#0F6E56;color:#fff;font-weight:600;
  box-shadow:0 6px 14px -4px rgba(15,110,86,.45);
  transform:translateY(-1px);
}
/* 触摸设备上 :hover 会粘住，看起来像「没切走」→ 只在有鼠标的设备上启用 */
@media (hover:hover) and (pointer:fine){
  .seg button:hover:not(.on){background:rgba(15,110,86,.07);color:#0F6E56}
}
/* 点过的按钮别留焦点框 */
.seg button:focus,.seg button:focus-visible{outline:none}

/* ===== 页面底部：数据来源说明（两个面板共用） ===== */
.src-wrap{margin:22px 0 4px;padding:16px 20px 14px;border-top:1px solid rgba(20,22,26,.1)}
.src-t{font-size:11px;font-weight:600;letter-spacing:1.6px;color:#8B9099;margin-bottom:10px}
.src-box dl{display:grid;grid-template-columns:76px 1fr;gap:6px 14px;margin:0;font-size:11.5px;line-height:1.65}
.src-box dt{color:#9AA0A9;white-space:nowrap}
.src-box dd{margin:0;color:#5F6672}
.src-box dd b{color:#A03A2C;font-weight:600}
.src-f{margin-top:10px;font-size:10.5px;color:#B2B8C1}
@media (max-width:640px){
  .src-wrap{padding:14px 14px 12px}
  .src-box dl{grid-template-columns:1fr;gap:2px 0}
  .src-box dt{margin-top:6px}
}

/* ===== 字段问号：悬停 / 点一下显示说明 ===== */
.q{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;
  margin-left:4px;border-radius:50%;background:rgba(120,128,140,.18);color:#7A828D;
  font-size:9.5px;font-weight:700;line-height:1;cursor:help;position:relative;
  vertical-align:super;font-style:normal;user-select:none}
.q:hover,.q:focus{background:#B01230;color:#fff;outline:none}

/* ===== 数据来源：固定悬浮按钮 + 弹层 ===== */
.src-fab{position:fixed;right:20px;bottom:22px;z-index:120;display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px 8px 10px;border:1px solid rgba(20,22,26,.12);border-radius:22px;background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);box-shadow:0 8px 22px -10px rgba(0,0,0,.28);cursor:pointer;
  font-family:inherit;font-size:12px;color:#4A5158;letter-spacing:.2px}
.src-fab:hover{background:#fff;box-shadow:0 10px 26px -10px rgba(0,0,0,.34);color:#1B1B22}
.src-fab span{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;
  background:#B01230;color:#fff;font-size:10px;font-weight:700}
.src-mask{position:fixed;inset:0;z-index:200;background:rgba(18,20,24,.42);display:flex;align-items:flex-end;
  justify-content:center;opacity:0;visibility:hidden;transition:opacity .18s}
.src-mask.on{opacity:1;visibility:visible}
.src-modal{width:min(680px,100%);max-height:82vh;overflow:auto;background:#fff;border-radius:18px 18px 0 0;
  padding:18px 22px 20px;box-shadow:0 -10px 40px -18px rgba(0,0,0,.4)}
.src-mh{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.src-mh b{font-size:13.5px;color:#1B1B22;letter-spacing:.4px}
.src-mh button{border:0;background:transparent;font-size:22px;line-height:1;color:#9AA0A9;cursor:pointer;padding:0 4px}
.src-modal dl{display:grid;grid-template-columns:88px 1fr;gap:9px 16px;margin:0;font-size:12.5px;line-height:1.7}
.src-modal dt{color:#9AA0A9;white-space:nowrap}
.src-modal dd{margin:0;color:#4A5158}
.src-modal dd b{color:#A03A2C}
.src-mf{margin-top:14px;padding-top:12px;border-top:1px solid #EEF0F3;font-size:11.5px;color:#8B9099}
@media (max-width:640px){
  .src-fab{right:14px;bottom:14px;font-size:11.5px;padding:7px 12px 7px 9px}
  .src-modal dl{grid-template-columns:1fr;gap:2px}
  .src-modal dt{margin-top:8px}
}

/* 字段说明浮层：用 fixed 挂在 body 上，避免被 .khero 的 overflow:hidden 裁掉 */
.tip-float{position:fixed;z-index:400;max-width:196px;padding:7px 10px;border-radius:8px;
  background:rgba(16,18,22,.97);color:#E8EAEE;font-size:10px;line-height:1.5;letter-spacing:0;
  white-space:pre-line;border:1px solid rgba(255,255,255,.16);
  box-shadow:0 10px 24px -10px rgba(0,0,0,.65);pointer-events:none;
  opacity:0;transition:opacity .12s}
.tip-float.on{opacity:1}
.tip-float::after{content:'';position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);
  width:9px;height:9px;background:rgba(22,24,29,.96);rotate:45deg;border-radius:1px}

/* ===== 小屏手机适配（≤430px：iPhone SE/8、13/14、Mini 等） =====
 * 目标：一屏能看清重点，不用横向滚，字号不被挤破
 */
@media (max-width:430px){
  /* 页头：标题缩小，更新时间换成极简，按钮省地方 */
  .metrics .mhead{padding:12px 14px 10px;align-items:center}
  .metrics .mhead .mtitle{font-size:17px;letter-spacing:-.2px}
  .metrics .mhead .mupd{display:none}
  .metrics .mhead-right{gap:6px}
  .metrics .mhead-right .btn-ghost{padding:5px 9px;font-size:11px}

  /* 设计预览用的页头切换条：手机上不显示（会挡住内容） */
  .mh-switch{display:none !important}

  /* 主体边距收窄 */
  .metrics .mbody{padding:10px 12px 16px}

  /* 今日大卡：内边距与数字都收一点，一屏能看到 6 格 */
  .khero{padding:15px 16px 14px;border-radius:16px}
  .khero .kh-top b{font-size:13px}
  .khero .kh-nums .num{font-size:31px;letter-spacing:-1px}
  .khero .kh-nums .num2{font-size:19px}
  .khero .kh-sub{padding-top:9px;margin-top:2px}
  .khero .kh-sub .kh-val{font-size:16.5px}
  .khero .kh-sub .kh-lab{font-size:10.5px}
  .khero .kh-sub .kh-note{font-size:9.5px}

  /* 四格统计条：两列，字号收 */
  .kstrip{padding:12px 14px;gap:10px 0}
  .kstrip .ks-lab{font-size:10.5px}
  .kstrip .ks-val{font-size:16px}

  /* 时间导航：可以横向滑，不换行堆高 */
  .metrics .mbar{padding:10px 12px}
  #mTimeTabs{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #mTimeTabs::-webkit-scrollbar{display:none}
  #mTimeTabs button{flex:0 0 auto;padding:6px 11px;font-size:12px}

  /* 四块榜单：行内元素缩一号，避免挤压 */
  .metrics .ovrow .nm{font-size:13px}
  .metrics .ovrow .vv{font-size:13.5px}
  .metrics .ovrow .vs{font-size:10px;line-height:1.5}
  .metrics .ovrow .uid{display:none}          /* UID 太长，手机先藏，明细里能看 */
  .metrics .ovrow .sh.vid{font-size:9.5px;height:15px;padding:0 5px}

  /* 账单中心 */
  .metrics .km-h{font-size:11.5px}
  .metrics .km-n{font-size:21px}
  .metrics .km-s{font-size:10.5px}
  .src-fab{font-size:11px;padding:6px 11px 6px 8px;right:12px;bottom:12px}
}

/* 底部留白：别让「数据来源」浮动按钮压住最后一张卡 */
@media (max-width:430px){
  .metrics .mbody{padding-bottom:72px}
}

/* 小屏：数据来源按钮缩成圆形，尽量不挡内容 */
@media (max-width:430px){
  .src-fab{right:12px;bottom:14px;width:40px;height:40px;border-radius:50%;padding:0;
    justify-content:center;font-size:0;letter-spacing:0;gap:0}
  .src-fab span{width:17px;height:17px;font-size:10.5px}
}

/* ===== 运营 → 主播明细（2026-10-21） ===== */
.opd-wrap{margin-top:14px}
.opd-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px;padding:0 2px}
.opd-h b{font-size:13px;color:#1B1B22;letter-spacing:.3px}
.opd-h span{font-size:11px;color:#9AA0A9}
.opd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.opd-card{background:#fff;border:1px solid #EEF0F3;border-radius:12px;padding:12px 14px 10px}
.opd-ch{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:4px}
.opd-nm{font-size:13.5px;font-weight:600;color:#1B1B22}
.opd-sum{font-size:11.5px;color:#4A5158;font-variant-numeric:tabular-nums}
.opd-cs{font-size:10.5px;color:#9AA0A9;margin-bottom:8px}
.opd-rows{display:flex;flex-direction:column;gap:1px}
.opd-row{position:relative;display:grid;grid-template-columns:16px minmax(0,1fr) 62px auto;gap:6px;
  align-items:center;padding:5px 6px;border-radius:6px;overflow:hidden}
.opd-row .fill{position:absolute;left:0;top:0;bottom:0;background:rgba(15,110,86,.07);border-radius:6px;z-index:0}
.opd-row.top .fill{background:rgba(176,18,48,.09)}
.opd-row.low .fill{background:rgba(120,128,140,.07)}
.opd-row>*:not(.fill){position:relative;z-index:1}
.opd-row .rk{font-size:10px;color:#B2B8C1;text-align:center;font-variant-numeric:tabular-nums}
.opd-row .nm{font-size:12px;color:#2F333A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opd-row .vv{font-size:12px;font-weight:600;color:#1B1B22;text-align:right;font-variant-numeric:tabular-nums}
.opd-row .vs{font-size:10px;color:#8B9099;white-space:nowrap}
.opd-row.top .nm{font-weight:600}
.opd-more{font-size:10.5px;color:#B2B8C1;padding:4px 6px}
@media (max-width:640px){
  .opd-grid{grid-template-columns:1fr}
  .opd-row{grid-template-columns:14px minmax(0,1fr) 56px auto}
}

/* 运营→主播：固定 6 行、可滚动、带商品占比（2026-10-21 最终版） */
.opd-rows{max-height:264px;overflow-y:auto;overscroll-behavior:contain;padding-right:2px;
  scrollbar-width:thin;scrollbar-color:#D5D9DF transparent}
.opd-rows::-webkit-scrollbar{width:5px}
.opd-rows::-webkit-scrollbar-thumb{background:#D5D9DF;border-radius:3px}
.opd-row{height:44px;padding:0 7px;border-bottom:1px solid #F6F7F9}
.opd-row:last-child{border-bottom:0}
.opd-row .mid{height:32px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.opd-row .dn{display:block;font-size:12.5px;line-height:1.35}
.opd-row .gd{display:block;font-size:9.5px;color:#9AA0A9;line-height:1.3;margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opd-row .gd em{font-style:normal;color:#BFC5CC;font-size:9px;font-variant-numeric:tabular-nums;margin-left:3px}
.opd-row .gd u{text-decoration:none;color:#CFD4DA;margin:0 4px}
.opd-more{font-size:10px;color:#B2B8C1;padding:7px 7px 3px;text-align:center;border-top:1px solid #F6F7F9}

/* 修正：.opd-rows 是 flex 容器，子项默认 flex-shrink:1 会被压扁导致滚不动 */
.opd-rows{display:block}
.opd-row{flex:none;box-sizing:border-box}

/* 运营→主播：一键隐藏名字的小眼睛 */
.opd-hr{display:inline-flex;align-items:center;gap:8px}
.opd-eye{border:1px solid #E3E8F0;background:#fff;border-radius:14px;padding:2px 9px;
  font-size:10.5px;color:#6B7280;cursor:pointer;font-family:inherit;line-height:1.6;white-space:nowrap}
.opd-eye:hover{border-color:#C9CFD8;color:#1B1B22;background:#FBFCFD}
@media (max-width:430px){ .opd-eye{font-size:10px;padding:2px 8px} }

/* ===== 百应登录横幅 + 弹窗（2026-10-22） ===== */
.buyin-ban{display:flex;align-items:center;gap:12px;padding:11px 14px;margin:10px 12px;border-radius:10px;
  background:#FDECEE;border:1px solid #F3C9CE;border-left:3px solid #C02A32}
.buyin-ban .bb-ic{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:#C02A32;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.buyin-ban .bb-tx{flex:1;min-width:0}
.buyin-ban .bb-t1{font-size:13px;font-weight:600;color:#8F1D24;line-height:1.45}
.buyin-ban .bb-t2{font-size:11px;color:#A8444A;margin-top:2px;line-height:1.5}
.buyin-ban .bb-act{flex:0 0 auto;display:flex;gap:6px;align-items:center}
.bb-btn{border:0;border-radius:7px;padding:6px 13px;font-size:12px;font-family:inherit;cursor:pointer;white-space:nowrap}
.bb-btn.bb-p{background:#C02A32;color:#fff}
.bb-btn.bb-p:disabled{opacity:.55;cursor:default}
.bb-btn.bb-g{background:transparent;color:#A8444A;text-decoration:underline;text-underline-offset:2px;padding:6px 4px}
.buyin-ban.warn{background:#FFF7E6;border-color:#F2DFB4;border-left-color:#B07B15}
.buyin-ban.warn .bb-ic{background:#B07B15}
.buyin-ban.warn .bb-t1{color:#7A5410}
.buyin-ban.warn .bb-t2{color:#8E6A25}
.buyin-ban.warn .bb-btn.bb-p{background:#B07B15}
.buyin-ban.warn .bb-btn.bb-g{color:#8E6A25}
@media (max-width:640px){
  .buyin-ban{flex-wrap:wrap;margin:8px 10px;padding:10px 12px;gap:9px}
  .buyin-ban .bb-act{width:100%;justify-content:flex-end}
}
/* 弹窗 */
.bb-mask{position:fixed;inset:0;z-index:300;background:rgba(18,20,24,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.bb-dlg{width:min(380px,100%);background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 24px 60px -20px rgba(0,0,0,.45)}
.bb-dh{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px}
.bb-dh b{font-size:14px}
.bb-dh button{border:0;background:transparent;font-size:22px;line-height:1;color:#9AA0A9;cursor:pointer}
.bb-db{padding:4px 18px 18px}
.bb-lb{display:block;font-size:11px;color:#8B9099;margin:10px 0 5px}
.bb-in{width:100%;height:38px;border:1px solid #E0E4EA;border-radius:8px;padding:0 11px;font-size:13px;
  font-family:inherit;color:#1B1B22;box-sizing:border-box}
.bb-in:focus{outline:none;border-color:#C02A32}
.bb-row{display:flex;gap:8px}
.bb-row .bb-in{flex:1}
.bb-tip{font-size:11px;color:#8B9099;margin-top:10px;line-height:1.55;min-height:16px}
.bb-tip.ok{color:#0E5C3F}
.bb-tip.err{color:#A03A2C}
.bb-full{width:100%;margin-top:14px;padding:9px 0;font-size:13px}

/* 修正：横幅在 flex 面板里被压成 0 宽 */
.buyin-ban{flex:0 0 auto;width:100%;max-width:100%;box-sizing:border-box;align-self:stretch}
#metricsPanel>.buyin-ban{margin:10px 12px;width:auto}

/* 绑定助手登录横幅：挂在「私聊框」里 —— 会话标题下面、消息列表上面（2026-10-22 用户指定位置）
   注意 .chat 是 flex column，宽度必须 auto + align-self:stretch，
   用 width:100% 再加左右 margin 会横向溢出 */
.chat>.buyin-ban{width:auto;margin:10px 14px 0;max-width:calc(100% - 28px)}
.chat.empty>.buyin-ban{display:none}
@media (max-width:640px){
  .chat>.buyin-ban{margin:8px 10px 0;max-width:calc(100% - 20px)}
}

/* ===== 区间总览（账单中心，2026-10-22） ===== */
.rov{margin:12px 0 0;background:#fff;border:1px solid #EFEAD9;border-radius:14px;padding:13px 16px 10px;
  box-shadow:0 1px 2px rgba(16,24,40,.04)}
.rov-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:11px}
.rov-h b{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#1B1B22;letter-spacing:.3px}
.rov-h b i{width:7px;height:7px;border-radius:50%;background:#0F6E56;display:inline-block}
.rov-h span{font-size:11px;color:#9AA0A9}
.rov-g{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0}
.rov-c{padding:2px 14px 6px;border-left:1px solid #F2F4F7}
.rov-c:first-child{border-left:0;padding-left:2px}
.rov-l{font-size:11px;color:#8B9099;margin-bottom:4px}
.rov-v{font-size:20px;font-weight:600;color:#1B1B22;letter-spacing:-.3px;font-variant-numeric:tabular-nums;line-height:1.2}
.rov-v small{font-size:11px;font-weight:500;color:#6B7280;letter-spacing:0}
.rov-s{font-size:10px;color:#9AA0A9;margin-top:4px;line-height:1.5}
.rov-f{display:flex;gap:16px;flex-wrap:wrap;border-top:1px dashed #F0F2F5;margin-top:8px;padding-top:8px;
  font-size:10.5px;color:#8B9099}
@media (max-width:1100px){
  .rov-g{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:12px}
  .rov-c:nth-child(4){border-left:0;padding-left:2px}
}
@media (max-width:640px){
  .rov{padding:12px 13px 9px;margin-top:10px}
  .rov-g{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}
  .rov-v{font-size:17px}
  .rov-c:nth-child(odd){border-left:0;padding-left:2px}
  .rov-c:nth-child(even){border-left:1px solid #F2F4F7}
  .rov-v{font-size:18px}
  .rov-f{gap:10px;font-size:10px}
}

/* 修复：查询按钮被「玻璃白」规则覆盖成白底白字，看不见（2026-10-22 用户反馈） */
.metrics .mgo,.metrics .mgo2{
  background:var(--ink,#1B1B22);color:#fff;border:1px solid var(--ink,#1B1B22);
  font-weight:500;box-shadow:0 2px 8px rgba(27,27,34,.16)}
.metrics .mgo:hover,.metrics .mgo2:hover{background:#000;border-color:#000}
.metrics .mclear{background:rgba(255,255,255,.85);color:var(--ink2,#5B5B6B);border:1px solid rgba(27,27,34,.10)}
.metrics .mclear:hover{background:#fff;border-color:rgba(27,27,34,.18)}

/* ===== 侧栏分组小标题 + 分隔线（2026-10-22 加竞品/货盘/素材） ===== */
.rail-label{font-size:8.5px;color:#B0B5BD;letter-spacing:1.2px;text-align:center;
  margin:6px 0 2px;user-select:none}
.rail-sep{width:26px;height:1px;background:#E7E4DC;margin:8px auto 4px}

/* 空白占位面板（竞品 / 货盘 / 素材 三个入口共用） */
.stub{position:fixed;top:0;right:0;bottom:0;left:70px;z-index:50;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(680px 420px at 12% 0%,#FFF6F7 0%,rgba(255,246,247,0) 62%),
             radial-gradient(620px 400px at 88% 8%,#F2F6FF 0%,rgba(242,246,255,0) 60%),#FBFAF7}
.stub[hidden]{display:none}
.stub-in{text-align:center;padding:30px 24px;max-width:420px}
.stub-ic{width:46px;height:46px;margin:0 auto 14px;border-radius:14px;background:#F1F3F7;
  display:flex;align-items:center;justify-content:center;color:#9AA0A9}
.stub-ic svg{width:24px;height:24px}
.stub-t{font-size:15px;font-weight:600;color:#1B1B22;margin-bottom:6px}
.stub-s{font-size:12px;color:#8B9099;margin-bottom:14px}
.stub-hint{font-size:11.5px;color:#A6ACB5;line-height:1.75;
  border:1px dashed #E0E4EA;border-radius:10px;padding:14px 16px;background:#fff}
@media (max-width:640px){ .rail-label{font-size:8px} }

@media (max-width:720px){ .stub{left:0} }

/* 系统/人员面板在手机上：少留白，多给内容（2026-10-23） */
@media (max-width: 820px){
  .admin{padding:10px}
  .admin-card{max-height:92vh;border-radius:14px}
  .admin-head{padding:14px 14px 10px}
  .admin-tabs{padding:0 12px}
  .admin-body{padding:0 12px 14px}
}

/* ===== 即时聊天：发送失败 / 附件预览（2026-10-23） ===== */
.av-spacer{width:30px;flex:0 0 30px}
.row.cont{margin-top:-4px}          /* 同一人的后续消息，跟上面更紧凑 */
.row.fail .bubble,.row.fail .file-card,.row.fail .fc-prev{opacity:.72}
.failmark{
  width:18px;height:18px;border-radius:50%;background:#D93F3F;color:#fff;
  font-size:12px;font-weight:700;line-height:18px;text-align:center;flex:0 0 18px;
  margin-top:7px;user-select:none;
}
.failtip{font-size:11px;color:#C0392B;margin-top:5px;padding-left:2px}
.row.me .failtip{text-align:right;padding-right:2px}
.failtip u{text-decoration:none;border-bottom:1px solid rgba(192,57,43,.45);cursor:pointer;margin-left:2px}
.failtip u:hover{color:#A32D2D;border-bottom-color:#A32D2D}

/* 文件卡片下面的表格预览 */
.fc-prev{margin-top:8px;background:#fff;border:1px solid var(--line2);border-radius:10px;overflow:hidden}
.fc-loading{padding:12px;font-size:11.5px;color:var(--ink3)}
.fc-table{width:100%;border-collapse:collapse;font-size:11.5px}
.fc-table th{background:#F7F5F0;color:var(--ink2);font-weight:500;text-align:left;
  padding:6px 10px;border-bottom:1px solid var(--line2);white-space:nowrap}
.fc-table td{padding:5px 10px;border-bottom:1px solid #F4F2EC;color:var(--ink);white-space:nowrap}
.fc-table td.num{text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.fc-table tr:last-child td{border-bottom:none}
.fc-foot{display:flex;align-items:center;gap:12px;padding:7px 10px;background:#FCFBF8;
  border-top:1px solid var(--line2);font-size:11.5px}
.fc-foot u{color:var(--accent);text-decoration:none;cursor:pointer}
.fc-foot u:hover{text-decoration:underline}
.fc-foot span{margin-left:auto;color:var(--ink3);font-size:11px}

/* 展开全部：表格铺在灯箱里 */
.csv-full{background:#fff;border-radius:12px;max-height:86vh;overflow:auto;max-width:92vw}
.csv-full table{border-collapse:collapse;font-size:12px}
.csv-full th{position:sticky;top:0;background:#F7F5F0;color:var(--ink2);font-weight:500;
  text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.csv-full td{padding:6px 12px;border-bottom:1px solid #F4F2EC;white-space:nowrap}
.csv-full td.num{text-align:right;font-variant-numeric:tabular-nums}
.csv-more{padding:10px 12px;font-size:11.5px;color:var(--ink3)}

/* 会话列表：机器人今日产出小徽章（2026-10-23） */
.done-badge{
  flex:0 0 auto;font-size:9.5px;line-height:1;padding:3px 6px;border-radius:20px;
  background:#E1F5EE;color:#085041;border:1px solid #A9E2C1;white-space:nowrap;
}
.done-badge.ret{background:#EAF1FB;color:#1B4C8C;border-color:#BFD5F2}
.conv-top .conv-name{min-width:4.5em;overflow:hidden;text-overflow:ellipsis}
/* 徽章在窄屏可以让步，别把名字挤没（2026-10-24） */
.conv-top .done-badge{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}

/* ===== 机器人干活进度条（2026-10-23） ===== */
.stepbar{
  display:flex;align-items:center;gap:9px;padding:8px 16px;background:#F3F8F5;
  border-bottom:1px solid #DDEBE3;flex:0 0 auto;
}
.stepbar .spin{
  width:11px;height:11px;border-radius:50%;border:1.5px solid #C9E2D5;
  border-top-color:var(--accent);flex:0 0 11px;animation:stepspin 1s linear infinite;
}
.stepbar .spin.stop{animation:none;border-color:#E8C07A;border-top-color:#D9930C}
@keyframes stepspin{to{transform:rotate(360deg)}}
.step-tx{font-size:11.5px;color:#085041;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.step-tx b{font-weight:600}
.step-tx.stuck{color:#8A5A00}
.step-track{flex:0 0 86px;height:4px;border-radius:2px;background:#D8E9E0;overflow:hidden}
.step-track i{display:block;height:100%;background:var(--accent);border-radius:2px;transition:width .3s}
.step-n{font-size:10.5px;color:#4A7A66;margin-left:auto;font-variant-numeric:tabular-nums;flex:0 0 auto}
/* 收尾态：进度跑完了就说「谁 已完成」，不转圈、不算秒（2026-10-27） */
.step-ok{font-size:11.5px;font-weight:600;color:#1E8E5A;display:flex;align-items:center;gap:6px}
.step-ok::before{content:"✓";display:inline-flex;align-items:center;justify-content:center;
width:15px;height:15px;border-radius:50%;background:#1E8E5A;color:#fff;font-size:10px;font-weight:700}
.step-track.ok{flex:0 0 86px}
.step-track.ok i{background:#1E8E5A}
@media (max-width:820px){
  .stepbar{padding:7px 12px;gap:7px}
  .step-track{flex:0 0 52px}
  .step-tx{font-size:11px}
}

/* ===== 我的（外部达人，2026-10-23） ===== */
.my-card{background:#fff;border:1px solid var(--line2);border-radius:12px;padding:14px 16px;margin-bottom:10px}
.my-name{font-size:16px;font-weight:600}
.my-dept{font-size:12px;color:var(--ink3);margin-top:3px}
.my-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid #F4F2EC}
.my-row:last-child{border-bottom:0}
.my-k{font-size:12.5px;color:var(--ink2);flex:0 0 auto}
.my-v{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;text-align:right;word-break:break-all}
.my-s{margin-left:6px;font-size:11.5px;color:var(--ink3);font-weight:400}
.my-ok{color:#0B7A3E}
.my-wait{color:#8A5A00}
.my-h{font-size:12px;font-weight:600;color:var(--ink2);margin-bottom:8px}
.my-tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.my-tbl th{font-weight:500;color:var(--ink3);text-align:right;padding:3px 0;font-size:11.5px}
.my-tbl th:first-child{text-align:left}
.my-tbl td{padding:7px 0;border-top:1px solid #F4F2EC}
.my-tbl td.num{text-align:right;font-variant-numeric:tabular-nums}
.my-tbl tbody tr:first-child td{border-top:0}
.my-note{background:#FFF9EC;border:1px solid #F0D48A;border-radius:10px;padding:10px 12px;
  font-size:12px;color:#8A5A00;margin-bottom:10px;line-height:1.7}

/* 我的达人：汇总条 + 表格（2026-10-23） */
.my-sum{display:flex;gap:8px;margin-bottom:10px}
.my-sum-i{flex:1;background:#fff;border:1px solid var(--line2);border-radius:10px;padding:10px 8px;text-align:center;min-width:0}
.my-sum-i b{display:block;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-sum-i span{display:block;font-size:10.5px;color:var(--ink3);margin-top:3px}
.my-list th{padding:9px 10px;border-bottom:1px solid var(--line2);background:#FCFBF8;white-space:nowrap}
.my-list td{padding:9px 10px;border-top:1px solid #F4F2EC;white-space:nowrap;font-size:12px}
.my-list th:first-child,.my-list td:first-child{text-align:left;white-space:normal}
.my-name-cell{max-width:150px}
.my-dn{font-size:12.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-du{font-size:10px;color:var(--ink3);font-variant-numeric:tabular-nums}
.my-foot{font-size:11.5px;color:var(--ink3);text-align:center;margin-top:10px;line-height:1.7}
.my-date{font-size:12px;padding:4px 8px;border:1px solid var(--line2);border-radius:8px;
  background:#fff;color:var(--ink2);margin-right:8px;max-width:130px}
/* 手机上不横滚：表格藏起来，改用卡片（用户明确不要横向滚动） */
.my-cards{display:none}
@media (max-width:820px){
  .my-sum{flex-wrap:wrap}
  .my-sum-i{flex:0 0 calc(50% - 4px)}
  .my-list{display:none}
  .my-cards{display:block;background:#fff;border:1px solid var(--line2);border-radius:12px;overflow:hidden}
  .my-c{padding:11px 12px;border-top:1px solid #F4F2EC}
  .my-c:first-child{border-top:0}
  .my-c-t{display:flex;align-items:baseline;gap:8px}
  .my-c-t b{font-size:13px;font-weight:500;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .my-c-t em{font-style:normal;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;flex:0 0 auto}
  .my-c-s{font-size:10.5px;color:var(--ink3);margin-top:3px;font-variant-numeric:tabular-nums}
  .my-c-m{font-size:11px;color:var(--ink2);margin-top:5px;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
}

.my-todo{font-size:10.5px;color:#8A5A00;background:#FFF4E5;border:0.5px solid #F0C87A;
  border-radius:20px;padding:2px 6px;white-space:nowrap}

/* 下载原始明细 / 生成中（2026-10-23） */
.my-dl{display:flex;align-items:center;gap:10px;background:#E1F5EE;border:1px solid #A9E2C1;
  border-radius:10px;padding:10px 12px;margin-bottom:10px}
.my-dl-t{font-size:12px;color:#085041;flex:1;min-width:0}
.btn-dl{flex:0 0 auto;background:var(--accent);color:#fff;border:0;border-radius:8px;
  padding:7px 14px;font-size:12.5px;font-weight:500;cursor:pointer;white-space:nowrap}
.btn-dl:hover{background:#0C5A47}
.btn-dl:active{transform:scale(.97)}
.my-gen{background:#FFF9EC;border:1px solid #F0D48A;border-radius:10px;padding:11px 12px;
  margin-bottom:10px;font-size:12.5px;color:#8A5A00;line-height:1.7}
.my-gen b{font-weight:600}

/* 超过预计时间但还没到「卡住」：轻微变黄提醒，不吓人（2026-10-23） */
.step-n.over{color:#8A5A00}

/* ===== 右下角「有新版本」提示条（2026-10-23 替代强制刷新） ===== */
.upd-tip{position:fixed;right:18px;bottom:18px;z-index:200;display:flex;align-items:center;gap:10px;
  background:#fff;border:1px solid #E5E8EF;border-radius:12px;padding:10px 12px 10px 14px;
  box-shadow:0 10px 30px -12px rgba(16,24,40,.28);font-size:12.5px;color:#1B1B22;
  transition:opacity .5s,transform .5s}
.upd-tip b{font-weight:600}
.upd-tip span{color:#8B9099;font-size:11.5px}
.upd-tip button{border:0;border-radius:7px;background:#0F6E56;color:#fff;padding:5px 12px;
  font-size:12px;font-family:inherit;cursor:pointer}
.upd-tip button:hover{background:#0B5643}
.upd-tip i{font-style:normal;color:#B7BCC4;cursor:pointer;font-size:16px;line-height:1;padding:0 2px}
.upd-tip.out{opacity:0;transform:translateY(8px)}
@media (max-width:640px){ .upd-tip{right:12px;bottom:12px;left:12px;justify-content:space-between} }

/* ── 备案号（2026-10-28 ICP 备案通过）──────────────────────── */
.beian {
  text-align: center;
  font-size: 11px;
  color: #9E9C93;
  padding: 12px 8px 6px;
  letter-spacing: .2px;
}
.beian a {
  color: #9E9C93;
  text-decoration: none;
  border-bottom: 0.5px solid transparent;
  transition: color .15s, border-color .15s;
}
.beian a:hover { color: #5F5E5A; border-bottom-color: #C9C6BC; }

/* 侧栏里的更小一号，不抢眼 */
.beian-side { font-size: 10px; padding: 2px 6px 8px; opacity: .8; }

@media (max-width: 720px) {
  .beian { font-size: 10px; padding: 10px 8px 14px; }
}