:root {
  --bg: #f2f4f7;
  --panel: #ffffff;
  --cell: #ffffff;
  --head: #f8fafc;
  --hover: #f9fbfe;
  --line: #e3e7ee;
  --line-soft: #eff2f6;
  --text: #1b1f26;
  --sub: #6b7280;
  --muted: #9aa1ac;
  --red: #d3302b;
  --green: #0f9d58;
  --blue: #2f6bff;
  --radius: 10px;
  --shadow: 0 1px 2px rgba(20, 26, 38, .05), 0 10px 26px -18px rgba(20, 26, 38, .22);
  /* 列色系（参考截图：柔和的色块区分指标） */
  --t-green-bg: #e6f5ee; --t-green-bd: #c9e9d9; --t-green-fg: #17795a;
  --t-teal-bg: #e4f3f3; --t-teal-bd: #c6e6e5; --t-teal-fg: #0f7068;
  --t-blue-bg: #e6effc; --t-blue-bd: #cbdcf7; --t-blue-fg: #24589f;
  --t-blue2-bg: #edf1fa; --t-blue2-bd: #d8e0f2; --t-blue2-fg: #3d558c;
  --t-purple-bg: #eceafb; --t-purple-bd: #dad5f5; --t-purple-fg: #5b46a8;
  --t-violet-bg: #f3eefb; --t-violet-bd: #e3d8f5; --t-violet-fg: #6b4fa0;
  --t-orange-bg: #fdf0e3; --t-orange-bd: #f5ddc4; --t-orange-fg: #a4631a;
  --t-yellow-bg: #fdf7df; --t-yellow-bd: #f3e8b9; --t-yellow-fg: #9a7c12;
  --t-pink-bg: #fdeef1; --t-pink-bd: #f6d6dd; --t-pink-fg: #ad3d58;
  --t-red-bg: #fdeceb; --t-red-bd: #f6d3d1; --t-red-fg: #b02b26;
  --t-gray-bg: #f2f4f7; --t-gray-bd: #e3e7ee; --t-gray-fg: #4d5663;
  /* 字体大小缩放（V2.3.15）：main=主要文字 sub=次要文字 muted=淡文字 all=全局 ai=AI解读（相乘） */
  --fz-main: 1;
  --fz-sub: 1;
  --fz-muted: 1;
  --fz-all: 1;
  --fz-ai: 1;
}

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0; background: var(--bg); color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-size: 13px; -webkit-font-smoothing: antialiased;
}
button, input, select { font-family: inherit; font-size: 13px; color: inherit; }

/* ---------- 顶栏 ---------- */
.topbar {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 20px;
  background: color-mix(in srgb, var(--panel) 88%, transparent); backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.logo {
  width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center;
  background: #14203a; color: #fff; font-weight: 700; font-size: 16px; overflow: hidden;
  box-shadow: 0 4px 12px -4px rgba(20,32,58,.6);
}
.logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.brand-text h1 { margin: 0; font-size: 15px; font-weight: 650; }
.brand-text p { margin: 2px 0 0; font-size: 12px; color: var(--sub); }
.brand-text b { color: var(--text); font-weight: 600; }
.dot { margin: 0 6px; color: var(--muted); }
.top-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.btn {
  height: 32px; padding: 0 13px; border-radius: 8px; cursor: pointer; border: 1px solid var(--line);
  background: #fff; transition: .15s; display: inline-flex; align-items: center; gap: 6px;
  white-space: nowrap; text-decoration: none; color: var(--text);
}
.btn:hover { border-color: #cfd5de; background: #fafbfc; }
.btn.primary { background: var(--red); border-color: var(--red); color: #fff; }
.btn.primary:hover { background: #bf2823; }
.btn.ghost { color: var(--sub); }

.page { padding: 14px 18px 30px; }

/* ---------- 工具栏 ---------- */
.toolbar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 9px 11px; margin-bottom: 10px; box-shadow: var(--shadow);
}
.seg { display: inline-flex; background: #f2f4f7; border-radius: 8px; padding: 3px; gap: 2px; }
.seg button {
  border: 0; background: transparent; padding: 0 12px; height: 27px; border-radius: 6px;
  cursor: pointer; color: var(--sub); font-weight: 500; transition: .15s; white-space: nowrap;
}
.seg button.active { background: #fff; color: var(--text); font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.08); }

/* V2.4.1：左侧多了一列功能，工具栏要腾地方 —— 搜索框不再拉伸，宽度刚好放下整句提示 */
.search { position: relative; flex: 0 0 322px; min-width: 0; }
.search svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; fill: none; stroke: #9aa1ac; stroke-width: 2; stroke-linecap: round; }
.search input {
  width: 100%; height: 33px; border-radius: 8px; border: 1px solid var(--line); background: #fbfcfd;
  padding: 0 10px 0 32px; outline: none; transition: .15s;
}
.search input:focus { border-color: #c3cddd; background: #fff; box-shadow: 0 0 0 3px rgba(47,107,255,.08); }

select {
  height: 33px; border-radius: 8px; border: 1px solid var(--line); background: #fbfcfd;
  padding: 0 26px 0 10px; outline: none; cursor: pointer; max-width: 180px; appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239aa1ac' stroke-width='2.4'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat: no-repeat; background-position: right 8px center;
}
.switch { display: inline-flex; align-items: center; gap: 6px; color: var(--sub); cursor: pointer; user-select: none; white-space: nowrap; }
.switch input { accent-color: var(--red); width: 14px; height: 14px; cursor: pointer; }
.spacer { flex: 1 1 auto; }
.count { color: var(--sub); font-size: 12px; white-space: nowrap; }
.count b { color: var(--text); }

.colbtn {
  height: 33px; padding: 0 11px; border-radius: 8px; border: 1px solid var(--line); background: #fff;
  cursor: pointer; color: var(--sub); display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
}
.colbtn:hover { border-color: #cfd5de; color: var(--text); }

/* 合计条 */
.sumbar {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 8px 12px; margin-bottom: 10px; box-shadow: var(--shadow);
}
.sumbar .s { display: flex; align-items: baseline; gap: 5px; padding: 0 12px 0 0; border-right: 1px solid var(--line-soft); }
.sumbar .s:last-child { border-right: 0; }
.sumbar .s .l { font-size: 11.5px; color: var(--sub); }
.sumbar .s .v { font-size: 14px; font-weight: 650; font-variant-numeric: tabular-nums; }
.sumbar .s .v.red { color: var(--red); }
.sumbar .s .v.green { color: var(--green); }
.sumbar .tip { margin-left: auto; font-size: 11.5px; color: var(--muted); }
/* V2.4.20（用户要求）：汇总条右侧恢复「自定义」按钮，文字说明撤掉，按钮永远贴末端 */
.sumbar .sum-cfg { margin-left: auto; flex: 0 0 auto; white-space: nowrap; }
/* V2.4.22（用户要求）：汇总条上的每项指标都能直接按住左右拖动换位置，视觉与表头拖拽保持一致 */
.sumbar .s[draggable="true"] { cursor: grab; user-select: none; }
.sumbar .s[draggable="true"]:active { cursor: grabbing; }
.sumbar .s.dragging { opacity: .4; }
.sumbar .s.drop-left { box-shadow: inset 2px 0 0 var(--blue); }
.sumbar .s.drop-right { box-shadow: inset -2px 0 0 var(--blue); }

/* ---------- 表格 ---------- */
.tablewrap {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: auto; max-height: calc(100vh - 215px); position: relative;
}
table#grid { border-collapse: separate; border-spacing: 0; }

#grid thead th {
  position: sticky; top: 0; z-index: 30; background: var(--head);
  border-bottom: 1px solid var(--line); padding: 8px 8px;
  font-size: 11.5px; font-weight: 600; color: var(--sub); text-align: center;
  white-space: nowrap; user-select: none; transition: background .12s;
}
#grid thead th.sortable { cursor: pointer; }
#grid thead th.sortable:hover { background: #eef2f7; color: var(--text); }
#grid thead th.drag { cursor: grab; }
#grid thead th.dragging { opacity: .4; }
#grid thead th.drop-left { box-shadow: inset 2px 0 0 var(--blue); }
#grid thead th.drop-right { box-shadow: inset -2px 0 0 var(--blue); }
#grid thead th.sorted { color: #b3251c; background: #fff8b8; }
#grid thead th .ar { font-size: 9px; margin-left: 3px; opacity: .45; }
#grid thead th.sorted .ar { color: #d3302b; opacity: 1; }
#grid thead th .grip { color: #c6ccd6; margin-right: 3px; font-size: 10px; cursor: grab; }

/* 列宽拖拽手柄（表头右边缘） */
#grid thead th .rz {
  position: absolute; top: 0; right: -4px; width: 8px; height: 100%;
  cursor: col-resize; z-index: 8;
}
#grid thead th .rz:hover { background: rgba(47, 107, 255, .3); }

#grid { --w-idx: 42px; --w-prod: 300px; }
#grid thead th.m-idx, #grid tbody td.m-idx {
  position: sticky; left: 0; z-index: 34; width: var(--w-idx); min-width: var(--w-idx); max-width: var(--w-idx);
  text-align: center; background: var(--head); color: var(--muted); font-size: 11.5px;
}
#grid tbody td.m-idx { background: var(--cell); z-index: 24; }
#grid thead th.m-prod, #grid tbody td.m-prod {
  position: sticky; left: var(--w-idx); z-index: 33; width: var(--w-prod); min-width: var(--w-prod); max-width: var(--w-prod);
  background: var(--head); box-shadow: 1px 0 0 var(--line);
}
#grid thead th.m-prod { text-align: center; }   /* 表头文字一律居中（用户要求） */
#grid tbody td.m-prod { text-align: left; background: var(--cell); z-index: 23; }

#grid tbody td {
  background: var(--cell);
  padding: 6px 8px; border-bottom: 1px solid var(--line-soft);
  vertical-align: top; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums;
}
#grid tbody tr.row { cursor: pointer; }
#grid tbody tr.row:hover td { background: var(--hover); }
#grid tbody tr.row:hover td.m-idx, #grid tbody tr.row:hover td.m-prod { background: #f4f8fd; }
#grid tbody tr.row.sel td { background: #f4f8fd; }
#grid tbody tr.row.sel td.m-prod { box-shadow: inset 3px 0 0 var(--blue), 1px 0 0 var(--line); }

/* 拖拽多选（任意列按住往下拉） */
#gridBody { user-select: none; -webkit-user-select: none; }
#grid tbody tr.row.rsel td { background: #e8f1ff; box-shadow: inset 0 1px 0 #cfe0ff, inset 0 -1px 0 #cfe0ff; }
#grid tbody tr.row.rsel td.m-idx { color: #2f6bff; font-weight: 650; }
#grid tbody tr.row.rsel td.m-prod { box-shadow: inset 3px 0 0 var(--blue), inset 0 1px 0 #cfe0ff, inset 0 -1px 0 #cfe0ff; }
#grid tbody tr.row.rsel:hover td { background: #dceaff; }
#gridBody.dragging, #gridBody.dragging * { cursor: cell !important; }

/* 选中提示条 */
#selChip {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 90;
  display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-radius: 999px;
  background: rgba(24,32,46,.94); color: #fff; font-size: 12.5px; box-shadow: 0 12px 30px -10px rgba(0,0,0,.45);
  white-space: nowrap;
}
#selChip[hidden] { display: none; }
#selChip b { color: #ffd166; font-weight: 700; }
#selChip kbd {
  background: rgba(255,255,255,.16); border-radius: 4px; padding: 1px 5px; font-family: inherit; font-size: 11.5px;
  border: 1px solid rgba(255,255,255,.2);
}
#selChip button {
  height: 24px; padding: 0 10px; border-radius: 999px; border: 0; cursor: pointer;
  background: #2f6bff; color: #fff; font-size: 12px;
}
#selChip button:hover { background: #1f57dd; }
#selChip .x { background: transparent; color: #b9c1cc; border: 1px solid rgba(255,255,255,.22); }
#selChip .x:hover { background: rgba(255,255,255,.12); color: #fff; }

/* 商品格：左图右信息；图片全局锁定尺寸（按 7 天格子高度计算，--pimg-h 由 JS 统一设置，
   所有款式图片绝对一样大，不再逐行自适应） */
.pcell { display: flex; gap: 9px; align-items: center; }
.pimg {
  flex: 0 0 auto;
  width: var(--pimg-h, 159px); height: var(--pimg-h, 159px);   /* 锁定边长，等比例正方形 */
  border-radius: 6px; object-fit: cover; background: #f1f3f6; border: 1px solid var(--line);
}
.pimg.ph { display: grid; place-items: center; color: #c3c9d2; font-size: 10px; }
.pmeta { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
/* 商品信息：标签+内容 一行一行摆放（商家编码/标题/类目/商品ID/上架时间） */
.pl { display: flex; align-items: baseline; gap: 2px; font-size: 11.5px; line-height: 1.6; color: var(--text); min-width: 0; }
.pl .k { color: var(--muted); flex: 0 0 auto; white-space: nowrap; }
/* 内容自动换行：列拉多窄都能完整显示（不再截断省略） */
.pl .pv { min-width: 0; white-space: normal; overflow-wrap: anywhere; word-break: break-all; }
.pl .pv.strong { font-weight: 650; font-size: 12.5px; }
.pl .tag { flex: 0 0 auto; margin-left: 6px; font-size: 10px; font-weight: 500; color: var(--sub); background: #f1f3f6; border-radius: 4px; padding: 1px 5px; }
/* V2.4.52：主图新里已创建、数据总表还没数据的款式 → 打个「无数据」灰标（一眼看出是新品还没数据） */
.pl .tag.tag-zero { background: #f6f7f9; color: #9aa1ac; border: 1px dashed #dfe3e9; }

/* 元信息列 */
td.meta { text-align: left !important; font-size: 11.5px; color: #4b5563; max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
td.meta .dim { color: #c8ced6; }

/* 堆叠日数据 */
.stack { display: flex; flex-direction: column; align-items: stretch; gap: 2px; min-width: 54px; }
.box {
  height: 19px; line-height: 19px; border-radius: 3px; padding: 0 5px;
  font-size: 11px; text-align: right; border: 1px solid transparent;
  font-variant-numeric: tabular-nums; overflow: hidden; white-space: nowrap;
  text-overflow: ellipsis; letter-spacing: -.1px;
}
/* V2.4.46：时间列（每个日格显示对应日期） */
td.datescol { text-align: center !important; padding-left: 2px; padding-right: 2px; }
td.datescol .box.datebox { display: flex; align-items: center; justify-content: center; font-size: 10px; color: var(--sub); background: var(--head); border-color: var(--line-soft); text-align: center; padding: 0 2px; }
td.datescol .box.datepad { background: transparent; border-color: transparent; }
.box.sum {
  background: #f1f3f6; border-color: #dfe4eb; color: #39424f; font-weight: 700;
  display: flex; justify-content: space-between; gap: 4px;
}
.box.sum::before { content: "Σ"; color: #a3abb7; font-weight: 600; }
.box.newest { box-shadow: inset 0 0 0 1px rgba(47,107,255,.35); }
/* 近 1 天口径下：被排序依据的那一天用红框标出 */
.box.focus { box-shadow: inset 0 0 0 1.5px var(--red); font-weight: 700; }
.box.t-green { background: var(--t-green-bg); border-color: var(--t-green-bd); color: var(--t-green-fg); }
.box.t-teal { background: var(--t-teal-bg); border-color: var(--t-teal-bd); color: var(--t-teal-fg); }
.box.t-blue { background: var(--t-blue-bg); border-color: var(--t-blue-bd); color: var(--t-blue-fg); font-weight: 600; }
.box.t-blue2 { background: var(--t-blue2-bg); border-color: var(--t-blue2-bd); color: var(--t-blue2-fg); }
.box.t-purple { background: var(--t-purple-bg); border-color: var(--t-purple-bd); color: var(--t-purple-fg); }
.box.t-violet { background: var(--t-violet-bg); border-color: var(--t-violet-bd); color: var(--t-violet-fg); }
.box.t-orange { background: var(--t-orange-bg); border-color: var(--t-orange-bd); color: var(--t-orange-fg); }
.box.t-yellow { background: var(--t-yellow-bg); border-color: var(--t-yellow-bd); color: var(--t-yellow-fg); }
.box.t-pink { background: var(--t-pink-bg); border-color: var(--t-pink-bd); color: var(--t-pink-fg); }
.box.t-red { background: var(--t-red-bg); border-color: var(--t-red-bd); color: var(--t-red-fg); }
.box.t-gray { background: var(--t-gray-bg); border-color: var(--t-gray-bd); color: var(--t-gray-fg); }
/* 空槽：那一天没有数据，占位但不参与任何合计（按 0 计） */
.box.ghost {
  background: repeating-linear-gradient(135deg, #fbfcfd 0 4px, #f3f5f8 4px 8px);
  border: 1px dashed #e3e7ed;
}
.box.ghost.focus { box-shadow: inset 0 0 0 1.5px rgba(211,48,43,.45); }
.txt.ghost {
  background: repeating-linear-gradient(135deg, #fbfcfd 0 4px, #f3f5f8 4px 8px);
  border: 1px dashed #e3e7ed; color: transparent;
}
.txt.ghost.focus { box-shadow: inset 0 0 0 1.5px rgba(211,48,43,.45); }
.txt.newest { box-shadow: inset 0 0 0 1px rgba(47,107,255,.35); }
.txt.focus { box-shadow: inset 0 0 0 1.5px var(--red); font-weight: 700; }
.cell-empty { color: #d9dde3; font-size: 11px; text-align: right; }
/* V2.4.28：缺数据算不出来时的标明（如「缺失成本无法计算」）——琥珀色，和普通空值区分开 */
.nc-mark { color: #BA7517; font-size: 11px; line-height: 1.35; text-align: left; font-weight: 500; }
body[data-theme="dark"] .nc-mark { color: #EF9F27; }
.stack .txt { font-size: 10.5px; padding: 1px 5px; border-radius: 3px; background: var(--t-violet-bg); color: var(--t-violet-fg); border: 1px solid var(--t-violet-bd); overflow: hidden; text-overflow: ellipsis; }

.more, .empty { padding: 40px 20px; text-align: center; color: var(--muted); }

/* ---------- 列设置面板 ---------- */
.pop {
  position: fixed; z-index: 90; background: var(--panel); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 16px 40px -12px rgba(20,26,38,.3); padding: 10px; width: 268px; display: none;
}
.pop.show { display: block; }
.pop h4 { margin: 0 0 8px; font-size: 12px; color: var(--sub); font-weight: 600; display: flex; justify-content: space-between; }
.pop .list { max-height: 320px; overflow: auto; }
.pop label { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 6px; cursor: pointer; font-size: 12px; }
.pop label:hover { background: #f6f8fb; }
.pop label input { accent-color: var(--blue); }
.pop .pop-foot { display: flex; justify-content: space-between; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }

/* ---------- 自定义筛选面板 ---------- */
#fselPop { width: 304px; }
.colbtn.on { border-color: #f3b3b3; color: var(--red); background: #fff5f5; }
.fsel-badge { min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--red); color: #fff; font-size: 10.5px; line-height: 16px; text-align: center; font-weight: 600; }
.fsel-badge[hidden] { display: none; }
.fsel-list label { gap: 6px; }
.fsel-name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 96px; }
.fsel-desc { margin-left: auto; color: #9aa1ac; font-size: 10.5px; white-space: nowrap; }
.fsel-del { color: #c2c8d1; cursor: pointer; padding: 0 1px 0 6px; font-size: 15px; line-height: 1; user-select: none; }
.fsel-del:hover { color: var(--red); }
.fsel-edit { color: #b7bec9; cursor: pointer; padding: 0 1px 0 6px; font-size: 12px; line-height: 1; user-select: none; }
.fsel-edit:hover { color: #5b8def; }
.fsel-addrow { display: flex; gap: 6px; }
.fsel-addrow #fsAdd { flex: 1; }
.fsel-empty { padding: 8px 6px; color: #9aa1ac; font-size: 11.5px; line-height: 1.5; }
.fsel-new { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 6px; }
.fsel-new input[type="text"] { height: 28px; border: 1px solid var(--line); border-radius: 6px; padding: 0 8px; font-size: 12px; outline: none; }
.fsel-new input[type="text"]:focus { border-color: #b9c8ee; }
.fsel-new-row { display: flex; align-items: center; gap: 6px; }
.fsel-new-row select { flex: 1; height: 28px; min-width: 0; border: 1px solid var(--line); border-radius: 6px; background: #fff; font-size: 12px; color: var(--text); padding: 0 4px; }
.fsel-new-row select#fsOp { flex: 0 0 108px; width: 108px; }   /* 比较符下拉：固定窄宽，给列名留空间 */
.fsel-new-row input[type="number"] { width: 76px; height: 28px; border: 1px solid var(--line); border-radius: 6px; padding: 0 6px; font-size: 12px; outline: none; }
.fsel-new-row .gt { color: var(--sub); font-weight: 600; }
.fsel-new .mini-btn { align-self: flex-start; }
.fsel-tip { margin: 8px 0 0; padding-top: 6px; border-top: 1px solid var(--line-soft); color: #9aa1ac; font-size: 10.5px; line-height: 1.5; }

/* ---------- 外观（主题）面板 ---------- */
#themePop { width: 296px; max-height: 78vh; overflow: auto; }
.theme-presets { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 4px; }
.theme-preset {
  border: 1px solid var(--line); border-radius: 8px; padding: 6px 7px; cursor: pointer;
  background: var(--panel); text-align: left; display: flex; flex-direction: column; gap: 5px;
}
.theme-preset:hover { border-color: #c9d3e3; }
.theme-preset.on { border-color: var(--red); box-shadow: 0 0 0 2px rgba(211,48,43,.1); }
.theme-preset .stripe { display: flex; height: 16px; border-radius: 4px; overflow: hidden; }
.theme-preset .stripe i { flex: 1; }
.theme-preset .nm { font-size: 11.5px; color: var(--text); font-weight: 600; }
.theme-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 12px; color: var(--sub); }
.theme-row .lb { flex: 1; }
.theme-row input[type="color"] {
  width: 34px; height: 22px; padding: 0; border: 1px solid var(--line); border-radius: 5px; background: none; cursor: pointer;
}
.theme-row input[type="color"]::-webkit-color-swatch-wrapper { padding: 2px; }
.theme-row input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 3px; }
.theme-row .hx { width: 72px; height: 22px; border: 1px solid var(--line); border-radius: 5px; padding: 0 6px; font-size: 11px; color: var(--muted); text-align: center; }
.theme-foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
.theme-sec { margin: 10px 0 2px; font-size: 11px; color: var(--muted); font-weight: 600; }
/* 我的配色卡片右上角删除角标 */
.theme-preset { position: relative; }
.tc-del {
  position: absolute; top: 3px; right: 5px; width: 16px; height: 16px; line-height: 14px; text-align: center;
  border-radius: 50%; color: #b6bdc8; font-size: 12px; cursor: pointer; background: rgba(255,255,255,.85);
}
.tc-del:hover { color: var(--red); background: #fff; }

/* ---------- 筛选面板：清空勾选/清空条件 ---------- */
.fsel-clearbar { display: flex; gap: 6px; justify-content: flex-end; margin: 6px 0 2px; padding-top: 6px; border-top: 1px dashed var(--line-soft); }

/* ---------- 搭配模板面板 ---------- */
#layoutPop { width: 320px; max-height: 78vh; overflow: auto; }
.lyt-list { display: flex; flex-direction: column; gap: 4px; max-height: 260px; overflow: auto; }
.lyt-item {
  display: flex; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid var(--line);
  border-radius: 8px; cursor: pointer; background: var(--panel); transition: border-color .12s, background .12s;
}
.lyt-item:hover { border-color: #c9d3e3; background: #f8fafd; }
.lyt-item .lyt-nm { flex: 1; min-width: 0; font-size: 12px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lyt-item .lyt-tm { font-size: 10.5px; color: var(--muted); flex: 0 0 auto; }
.lyt-item .mini-btn { flex: 0 0 auto; }
.lyt-del { width: 18px; height: 18px; line-height: 16px; text-align: center; border-radius: 50%; color: #b6bdc8; cursor: pointer; flex: 0 0 auto; }
.lyt-del:hover { color: var(--red); background: #fff; }
.lyt-foot { display: flex; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); flex-wrap: wrap; }
.lyt-foot #lytReset { margin-left: auto; }
.mini-btn.danger { color: var(--red); border-color: rgba(211, 48, 43, .35); }
.mini-btn.danger:hover { background: rgba(211, 48, 43, .08); }

/* ---------- 列设置里的整列配色 ---------- */
.crow { display: flex; align-items: center; gap: 4px; border-radius: 6px; }
.crow:hover { background: #f6f8fb; }
.crow label { flex: 1; min-width: 0; }
.crow label:hover { background: transparent; }
.crow input[type="color"] {
  flex: 0 0 auto; width: 26px; height: 18px; padding: 0; border: 1px dashed #d7dce4; border-radius: 4px;
  background: none; cursor: pointer;
}
.crow.has-c input[type="color"] { border-style: solid; }
.crow input[type="color"]::-webkit-color-swatch-wrapper { padding: 2px; }
.crow input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 2px; }
.crow .ccclear {
  flex: 0 0 auto; width: 14px; text-align: center; color: #c2c8d1; cursor: pointer; font-size: 13px; line-height: 1; visibility: hidden;
}
.crow.has-c .ccclear { visibility: visible; }
.crow .ccclear:hover { color: var(--red); }
.mini-btn {
  height: 26px; padding: 0 10px; border-radius: 6px; border: 1px solid var(--line); background: #fff;
  color: var(--sub); cursor: pointer; font-size: 12px; display: inline-flex; align-items: center; gap: 5px; text-decoration: none;
}
.mini-btn:hover { border-color: #c9d3e3; color: var(--text); }
/* V2.3.25：禁用态按钮（如「停止分析」平时、AI 分析中的解读按钮）统一灰色不可点 */
.mini-btn:disabled { opacity: .42; cursor: not-allowed; }
.mini-btn:disabled:hover { border-color: var(--line); color: var(--sub); }

/* ---------- V2.3.26 自定义利润公式 ---------- */
.pf-sec { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); }
.pf-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.pf-head b { font-size: 13px; color: var(--text); }
.pf-hint { flex: 1; min-width: 0; font-size: 11px; color: #9aa1ac; line-height: 1.4; }
.pf-rows {
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px 4px; min-height: 42px;
  padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: #fafbfc;
}
.pf-empty { font-size: 11.5px; color: #9aa1ac; }
/* 值 / 运算符 / 括号 / 数字 四类胶囊
   V2.4.20（用户要求）：药丸改成长方形，右侧带方形 ✕；整块可按住在公式里拖动换位置 */
.pf-chip {
  position: relative; display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 4px 0 9px;
  border-radius: 4px; font-size: 12px; font-weight: 600; line-height: 1; border: 1px solid transparent;
  cursor: grab; user-select: none; transition: box-shadow .12s, transform .12s;
}
.pf-chip:active { cursor: grabbing; }
.pf-chip input { cursor: text; user-select: auto; }
.pf-chip select { cursor: pointer; }
.pf-chip.var { background: #eaf1fe; border-color: #c3d7fb; color: #1d4ea8; }
.pf-chip.fixed { background: #eaf7ef; border-color: #bfe3cd; color: #1d7a4f; }
.pf-chip.num { background: #eaf7ef; border-color: #bfe3cd; color: #1d7a4f; padding-left: 6px; }
.pf-chip.paren { background: #f1f3f6; border-color: #dfe3e9; color: #5b626d; padding: 0 2px 0 8px; font-size: 14px; }
.pf-chip.op { background: #fdf4e3; border-color: #eed9a8; padding: 0 2px 0 3px; }
.pf-chip .pf-x {
  flex: 0 0 auto; width: 16px; height: 16px; border: 0; border-radius: 3px; background: rgba(20, 26, 38, .055);
  color: #8d95a1; font-size: 10px; font-weight: 400; line-height: 16px; text-align: center;
  cursor: pointer; font-style: normal;
}
.pf-chip .pf-x:hover { background: rgba(211, 48, 43, .14); color: #d3302b; }
.pf-opsel {
  width: 32px; height: 21px; border: 0; background: transparent; color: #a8710a; font-size: 14px;
  font-weight: 700; text-align: center; text-align-last: center; cursor: pointer; outline: none;
  -webkit-appearance: none; appearance: none; padding: 0;
}
.pf-fixnum {
  width: 64px; height: 20px; border: 1px solid rgba(29, 122, 79, .22); border-radius: 6px;
  background: #fff; color: #1d7a4f; font-size: 11.5px; text-align: right; padding: 0 4px;
}
/* V2.4.20：拖动排序的视觉——拖起的胶囊半透明，落点显示一根蓝竖线 */
.pf-chip.pf-dragging { opacity: .38; cursor: grabbing; }
.pf-rows.pf-drag-on { background: #f3f8ff; border-color: #c9dcfb; }
.pf-chip.pf-drop-l::before,
.pf-chip.pf-drop-r::after {
  content: ''; position: absolute; top: -3px; bottom: -3px; width: 2px;
  background: #2f6bff; border-radius: 1px; box-shadow: 0 0 0 2px rgba(47, 107, 255, .14);
}
.pf-chip.pf-drop-l::before { left: -4px; }
.pf-chip.pf-drop-r::after { right: -4px; }
body[data-theme="dark"] .pf-rows.pf-drag-on { background: #1a2433; border-color: #2d4a78; }
.pf-caret { display: inline-block; width: 2px; height: 20px; background: #2f6bff; border-radius: 1px; animation: pfBlink 1s steps(1) infinite; }
@keyframes pfBlink { 50% { opacity: 0; } }
/* 工具栏：插入值 / 运算符 / 括号 / 数字 */
.pf-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 8px; }
.pf-tool { display: flex; align-items: center; gap: 5px; }
.pf-tlabel { font-size: 11px; color: #9aa1ac; }
.pf-tool select {
  height: 25px; max-width: 200px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--panel, #fff); color: var(--text); font-size: 11.5px; padding: 0 4px;
}
.pf-tool input {
  width: 76px; height: 25px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--panel, #fff); color: var(--text); font-size: 11.5px; text-align: right; padding: 0 5px;
}
.pf-opbtn { min-width: 27px; font-size: 13px; font-weight: 700; }
/* V2.4.20：一键清空（危险动作，hover 变红） */
.pf-tool-end { margin-left: auto; }
.pf-clear:hover { border-color: #f0c2bf; color: #d3302b; background: #fdf4f3; }
.pf-preview { margin-top: 7px; font-size: 11.5px; color: var(--sub); line-height: 1.55; word-break: break-word; }
/* V2.4.20（用户要求）：公式不合法只在保存时拦——预览行给个轻提示，保存时弹出红条并标出出错的那一项 */
.pf-pwarn {
  margin-top: 5px; padding: 5px 9px; border-radius: 6px; line-height: 1.5;
  background: #fdf1f0; border: 1px solid #f3c9c6; color: #b3251c;
  font-size: calc(11.5px * var(--fz-sub) * var(--fz-all));
}
.pf-pwarn[hidden] { display: none; }
body[data-theme="dark"] .pf-pwarn { background: #3a2321; border-color: #6b3630; color: #f3b5ae; }
.pf-err {
  margin-top: 6px; padding: 8px 11px; border-radius: 7px; line-height: 1.55;
  background: #fdf1f0; border: 1px solid #f3c9c6; color: #b3251c;
  font-size: calc(11.5px * var(--fz-sub) * var(--fz-all));
}
.pf-err b { color: #d3302b; }
.pf-err span { display: block; margin-top: 2px; color: #a8574f; font-size: 11px; }
.pf-chip.pf-bad { border-color: #d3302b !important; box-shadow: 0 0 0 2px rgba(211, 48, 43, .22); }
body[data-theme="dark"] .pf-err { background: #3a2321; border-color: #6b3630; color: #f3b5ae; }
body[data-theme="dark"] .pf-err b { color: #ff8f85; }
/* 我的基础模板 */
.pf-tplrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 9px; padding-top: 8px; border-top: 1px dashed var(--line); }
.pf-tplstate { flex: 1 1 220px; min-width: 0; font-size: 11px; color: #9aa1ac; line-height: 1.5; word-break: break-word; }
/* 暗色主题：胶囊配色跟着换（浅底深字 ↔ 深底浅字） */
body[data-theme="dark"] .pf-rows { background: #1c222b; }
body[data-theme="dark"] .pf-chip.var { background: #1e2f4d; border-color: #2d4a78; color: #9dc0f7; }
body[data-theme="dark"] .pf-chip.fixed,
body[data-theme="dark"] .pf-chip.num { background: #1b3327; border-color: #2b5a42; color: #86d6ad; }
body[data-theme="dark"] .pf-chip.paren { background: #232a34; border-color: #333b48; color: #aab1bd; }
body[data-theme="dark"] .pf-chip.op { background: #38301a; border-color: #5b4a24; }
body[data-theme="dark"] .pf-chip .pf-x { color: #7c8492; }
body[data-theme="dark"] .pf-opsel { color: #f0c060; }
body[data-theme="dark"] .pf-fixnum { background: #232a34; border-color: #2b5a42; color: #86d6ad; }
body[data-theme="dark"] .pf-tool select,
body[data-theme="dark"] .pf-tool input,
body[data-theme="dark"] .pf-tgrid input { background: #232a34; }

/* ---------- 详情大面板 ---------- */
.overlay { position: fixed; inset: 0; z-index: 100; }
.overlay[hidden] { display: none; }
.ov-mask { position: absolute; inset: 0; background: rgba(18,24,34,.42); backdrop-filter: blur(2px); }
.ov-panel {
  position: fixed; left: 2vw; top: 4vh; width: 96vw; height: 92vh;
  background: #fff; border-radius: 12px;
  box-shadow: 0 30px 70px -20px rgba(0,0,0,.4); display: flex; flex-direction: column; overflow: hidden;
  animation: pop .18s ease;
}
.ov-panel.moving { }/* V2.3.25：.moving 不再改动画/阴影——之前 animation:none 在松手移除类时会让 pop 动画从头重放（面板闪一下），这就是拖动闪动的根源；现在 .moving 只影响子元素光标 */@keyframes pop { from { opacity: 0; transform: scale(.985) translateY(6px); } to { opacity: 1; transform: none; } }

/* 详情窗口缩放热区（8 个方向） */
.ov-grip { position: absolute; z-index: 12; }
.ov-grip.n { left: 10px; right: 10px; top: 0; height: 5px; cursor: ns-resize; }
.ov-grip.s { left: 10px; right: 10px; bottom: 0; height: 5px; cursor: ns-resize; }
.ov-grip.w { top: 10px; bottom: 10px; left: 0; width: 5px; cursor: ew-resize; }
.ov-grip.e { top: 10px; bottom: 10px; right: 0; width: 5px; cursor: ew-resize; }
.ov-grip.nw { left: 0; top: 0; width: 14px; height: 14px; cursor: nwse-resize; }
.ov-grip.ne { right: 0; top: 0; width: 14px; height: 14px; cursor: nesw-resize; }
.ov-grip.sw { left: 0; bottom: 0; width: 14px; height: 14px; cursor: nesw-resize; }
.ov-grip.se { right: 0; bottom: 0; width: 16px; height: 16px; cursor: nwse-resize; }
.ov-grip.se::after {
  content: ''; position: absolute; right: 3px; bottom: 3px; width: 8px; height: 8px;
  border-right: 2px solid #c3cad4; border-bottom: 2px solid #c3cad4; border-radius: 0 0 3px 0;
}

/* V2.3.23：窗口顶部「标题栏拖动条」——只有这一条能拖动窗口（Windows 体验），
   头部信息区和内容区不再触发拖动，所有文字可随意点住拖选复制 */
/* V2.3.25：拖动条再加高到 44px（用户反馈 28px 仍偏窄，要求至少再加 50%） */
.ov-dragbar {
  flex: 0 0 auto; height: 44px; cursor: move; touch-action: none;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(#f6f8fa, #eef1f5); border-bottom: 1px solid var(--line);
}
.ov-dragbar::after { content: ''; width: 72px; height: 7px; border-radius: 4px; background: #c9d2dd; }
.ov-panel.moving .ov-dragbar { cursor: grabbing; }
body[data-theme="dark"] .ov-dragbar { background: linear-gradient(#2c3440, #262d38); }
body[data-theme="dark"] .ov-dragbar::after { background: #4a5462; }

.ov-head { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px 12px; border-bottom: 1px solid var(--line); cursor: default; user-select: text; -webkit-user-select: text; }
.ov-panel.moving .ov-head { cursor: default; }
.ov-img { width: 92px; height: 92px; border-radius: 8px; object-fit: cover; border: 1px solid var(--line); background: #f1f3f6; flex: 0 0 auto; }
/* V2.3.14：详情头固定 5 列对齐（商品ID/商家编码/类目/上架时间/品牌控价 一行，近X天指标一行），整行项(标题/退款率)跨全列 */
.ov-info { flex: 1 1 auto; min-width: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px 18px; }
.ov-info .f { display: flex; gap: 6px; font-size: 12px; align-items: baseline; min-width: 0; }
.ov-info .f .k { color: var(--muted); flex: 0 0 auto; }
.ov-info .f .v { color: #2b3138; overflow: hidden; word-break: break-all; }
.ov-info .f.wide { grid-column: 1 / -1; }
.ov-info .f .v b { color: var(--red); }
.ov-actions { display: flex; gap: 8px; flex: 0 0 auto; }

.ov-tabs { display: flex; gap: 4px; padding: 8px 16px 0; border-bottom: 1px solid var(--line); }
.tab {
  border: 0; background: transparent; padding: 7px 14px; border-radius: 7px 7px 0 0; cursor: pointer;
  color: var(--sub); font-size: 12.5px; border-bottom: 2px solid transparent;
}
.tab.active { color: var(--text); font-weight: 600; border-bottom-color: var(--red); background: #fbfcfe; }
.tab[disabled] { color: #c8ced6; cursor: not-allowed; }

.ov-body { flex: 1 1 auto; display: flex; min-height: 0; min-width: 0; }   /* V2.3.26：min-width:0 否则内容会把整个 panel 撑破、表格被图表挤没 */
.ov-tablewrap { flex: 1 1 auto; overflow: auto; min-width: 0; }
.ov-table { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 12px; }
.ov-table th {
  position: sticky; top: 0; z-index: 2; background: #f8fafc; border-bottom: 1px solid var(--line);
  padding: 7px 9px; font-size: 11px; font-weight: 600; color: var(--sub); text-align: center; white-space: nowrap;
}
.ov-table td {
  padding: 6px 9px; border-bottom: 1px solid #f4f6f9; text-align: center; white-space: nowrap;
  font-variant-numeric: tabular-nums; color: #333a43;
}
.ov-table td:first-child { font-weight: 500; color: var(--text); }
.ov-table tr.in-win td { background: #fbfdff; }
.ov-table tr.today td { background: #fff8f7; }
.ov-table tr.today td:first-child { box-shadow: inset 2px 0 0 var(--red); }
/* 那天没有数据（按 0 计），整行淡显，避免和真实 0 混淆 */
.ov-table tr.nodata td { background: #fcfcfd; color: #b6bdc7; }
.ov-table tr.nodata td:first-child { color: #8f98a4; }
/* 每日明细表：表头可点击排序 */
.ov-table thead th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
.ov-table thead th.sortable:hover { background: #eef2f8; }
.ov-table thead th.sorted { color: #2f6bff; background: #eef3fc; }
.ov-table thead th .ar { font-size: 9px; margin-left: 3px; opacity: .6; }
.ov-table thead th .ar.idc { opacity: .4; color: #98a1ad; }   /* 常显 ⇅ 提示可排序 */
.ov-table thead th.sorted .ar { color: #2f6bff; opacity: 1; }
.ov-table tfoot td { position: sticky; background: #f5f7fa; font-weight: 650; border-top: 1px solid var(--line); }
.ov-table tfoot tr:first-child td { bottom: 28px; }
.ov-table tfoot tr:last-child td { bottom: 0; }
.ov-table tfoot td { height: 28px; padding: 0 9px; }
.ov-table tfoot tr:last-child td { font-weight: 600; color: #4d5663; }
.ov-table .badge { font-size: 9.5px; padding: 0 4px; border-radius: 3px; margin-left: 5px; background: #eef1f5; color: #8a9099; }

/* 每日明细表：表头可拖动排序位置 + 右边缘调列宽 */
.ov-table thead th.drag { cursor: grab; }
.ov-table thead th.dragging { opacity: .4; }
.ov-table thead th.drop-left { box-shadow: inset 2px 0 0 var(--blue); }
.ov-table thead th.drop-right { box-shadow: inset -2px 0 0 var(--blue); }
.ov-table thead th .grip { color: #c6ccd6; margin-right: 3px; font-size: 10px; cursor: grab; }
.ov-table thead th .rz {
  position: absolute; top: 0; right: -4px; width: 8px; height: 100%;
  cursor: col-resize; z-index: 8;
}
.ov-table thead th .rz:hover { background: rgba(47, 107, 255, .3); }
.ov-table .badge.red { background: #fdeceb; color: var(--red); font-weight: 600; }

.ov-charts { width: 306px; flex: 0 0 306px; border-left: 1px solid var(--line); overflow: auto; padding: 10px 12px; background: #fcfdfe; }
.ov-charts h5 { margin: 2px 0 6px; font-size: 11.5px; color: var(--sub); font-weight: 600; display: flex; justify-content: space-between; }
.ov-charts h5 span { color: var(--muted); font-weight: 400; }
.ov-charts .chart { margin-bottom: 14px; }
.ov-charts svg { display: block; width: 100%; }

/* ---------- 款式讨论 / 运营日志（V2.3.3，详情面板左栏） ----------
   V2.4.16（用户定死）：宽度收窄到「每日数据 + 推广分析」两个页签的右缘（16+78+4+78=176px），
   不再占详情窗的 375px 大半宽度 */
.ov-note { width: 176px; flex: 0 0 176px; border-right: 1px solid var(--line); background: #fcfdfe; display: flex; flex-direction: column; min-height: 0; }
.ov-note.off { display: none; }
.ov-note .on-head { display: flex; align-items: center; gap: 8px; padding: 8px 10px 6px; border-bottom: 1px solid var(--line); font-size: 12px; color: var(--sub); }
.ov-note .on-head b { font-size: 12px; }
.ov-note .on-head span { color: var(--muted); font-size: 11px; }
.ov-note .on-head .on-rf { margin-left: auto; cursor: pointer; color: var(--muted); font-weight: 400; font-size: 13px; padding: 0 4px; }
.ov-note .on-head .on-rf:hover { color: var(--primary, #2f6bff); }
.ov-note .on-list { flex: 1; overflow: auto; padding: 8px 10px; min-height: 0; }
.on-item { margin-bottom: 10px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.on-item .on-meta { display: flex; justify-content: space-between; gap: 6px; align-items: baseline; margin-bottom: 2px; }
.on-item .on-meta b { font-size: 11.5px; color: var(--sub); }
.on-item .on-meta span { font-size: 10.5px; color: var(--muted); }
.on-item .on-txt { font-size: 12px; line-height: 1.5; word-break: break-all; white-space: pre-wrap; }
.on-empty { color: var(--muted); font-size: 11.5px; line-height: 1.6; padding: 6px 2px; }
.ov-note .on-bar { display: flex; gap: 6px; padding: 8px 10px; border-top: 1px solid var(--line); }
.ov-note .on-bar input { flex: 1; min-width: 0; font-size: 12px; }
.ov-note-btn { margin-left: 6px; }

/* 成本缺失记录：搜索框（V2.4.17，多个关键词空格隔开） */
.nc-search { padding: 8px 12px 0; }
.nc-search input {
  width: 100%; box-sizing: border-box; font-size: 12.5px; padding: 7px 10px;
  border: 1px solid var(--line); border-radius: 8px; outline: none; background: #fff;
}
.nc-search input:focus { border-color: var(--primary, #2f6bff); }

/* ---------- 底部 ---------- */
.foot {
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center;
  color: var(--muted); font-size: 11.5px; padding: 10px 4px 0;
}
.foot .hint { color: #9a7f4e; background: #faf6ec; border: 1px solid #efe6d2; border-radius: 6px; padding: 3px 9px; }
.foot .src { color: #b3bac4; }

.toast {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(12px);
  background: #1f2937; color: #fff; padding: 9px 15px; border-radius: 8px; font-size: 12.5px;
  opacity: 0; transition: .22s; pointer-events: none; z-index: 200;
  box-shadow: 0 10px 30px -10px rgba(0,0,0,.4); max-width: 80vw;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

.status {
  display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--sub);
  background: #f6f8fb; border: 1px solid var(--line); border-radius: 20px; padding: 3px 10px; white-space: nowrap;
}
.status .dot2 { width: 6px; height: 6px; border-radius: 50%; background: #c9ced6; }
.status.ok .dot2 { background: #22b573; }
.status.new .dot2 { background: var(--red); animation: blip 1.2s infinite; }
@keyframes blip { 50% { opacity: .25; } }
.status button { border: 0; background: transparent; color: var(--blue); cursor: pointer; padding: 0 2px; font-size: 11.5px; }
.status.ok { cursor: pointer; }
.status.ok:hover { background: #eef7f1; border-color: #cfe9da; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d5dae2; border-radius: 10px; border: 2px solid #fff; }
::-webkit-scrollbar-thumb:hover { background: #c2c8d2; }

/* ---------- 表格（店铺）切换 ---------- */
.dsbox { display: inline-flex; align-items: center; background: #f2f4f7; border-radius: 8px; padding: 3px 3px 3px 9px; }
.dsbox::before { content: '表格'; color: var(--muted); font-size: 11.5px; margin-right: 6px; white-space: nowrap; }
.dsbox select {
  height: 27px; border: 0; background: transparent; font-weight: 600; color: var(--text);
  max-width: 200px; padding: 0 18px 0 0; box-shadow: none;
}
.dsbox select:focus { box-shadow: none; }
.dsbox select:disabled { color: var(--muted); font-weight: 400; }
.dsbtn {
  width: 26px; height: 26px; margin-left: 2px; border: 0; background: #fff; border-radius: 6px;
  cursor: pointer; color: var(--sub); font-size: 14px; line-height: 1; box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.dsbtn:hover { color: var(--red); }

/* ---------- 首次使用欢迎页 ---------- */
.welcome {
  position: fixed; inset: 0; z-index: 90; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(1200px 600px at 50% -10%, #ffffff 0%, #f2f4f7 55%, #e8ecf3 100%);
}
.welcome[hidden] { display: none; }
.wel-card {
  width: min(560px, 92vw); background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 34px 36px 26px; box-shadow: 0 18px 50px -22px rgba(20,26,38,.35); text-align: center;
}
.wel-logo {
  width: 52px; height: 52px; margin: 0 auto 12px; border-radius: 14px; overflow: hidden;
  background: #14203a; color: #fff;
  font-size: 26px; font-weight: 700; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px -8px rgba(20,32,58,.7);
}
.wel-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wel-card h2 { margin: 0; font-size: 22px; letter-spacing: 3px; }
.wel-sub { margin: 6px 0 20px; color: var(--sub); font-size: 13px; }
.wel-list { list-style: none; margin: 0 0 22px; padding: 0; text-align: left; }
.wel-list li { padding: 9px 0 9px 22px; position: relative; border-bottom: 1px dashed var(--line-soft); }
.wel-list li:last-child { border-bottom: 0; }
.wel-list li::before {
  content: ''; position: absolute; left: 4px; top: 16px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--red); opacity: .6;
}
.wel-list b { display: block; font-size: 13px; margin-bottom: 2px; }
.wel-list span { color: var(--sub); font-size: 12px; line-height: 1.65; }
.btn.big { height: 40px; padding: 0 26px; font-size: 14px; border-radius: 9px; }
.wel-tip { color: var(--muted); font-size: 11.5px; margin: 14px 0 0; }

/* ---------- 表格管理 ---------- */
.ds-panel {
  position: relative; width: min(700px, 94vw); max-height: 80vh; display: flex; flex-direction: column;
  background: #fff; border-radius: 14px; box-shadow: 0 24px 60px -20px rgba(20,26,38,.45); overflow: hidden;
}
.ds-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.ds-head h3 { margin: 0; font-size: 15px; }
.ds-list { padding: 8px 14px; overflow: auto; }
.ds-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 10px; border-bottom: 1px solid var(--line-soft); }
.ds-item:last-child { border-bottom: 0; }
.ds-item.cur { background: #fdf4f3; border-radius: 8px; }
.ds-nm { min-width: 0; }
.ds-nm b { display: block; font-size: 13.5px; margin-bottom: 3px; }
.ds-meta { display: block; color: var(--sub); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 380px; }
.tagk { display: inline-block; margin-top: 5px; padding: 1px 7px; border-radius: 20px; background: #f2f4f7; color: var(--sub); font-size: 11px; }
.tagk.ok { background: #e6f5ee; color: #17795a; }
.ds-ops { display: flex; gap: 6px; flex-shrink: 0; }
.ds-ops button {
  height: 27px; padding: 0 10px; border: 1px solid var(--line); background: #fff;
  border-radius: 6px; cursor: pointer; color: var(--sub); font-size: 12px;
}
.ds-ops button:hover { border-color: #cfd5de; color: var(--text); }
.ds-ops button.danger:hover { border-color: #f0c2bf; color: var(--red); background: #fdf4f3; }
.ds-empty { padding: 34px; text-align: center; color: var(--muted); }
.ds-note { margin: 0; padding: 10px 18px 14px; color: var(--muted); font-size: 11.5px; border-top: 1px solid var(--line-soft); }

/* ---------- 解析进度遮罩 ---------- */
.busy { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; background: rgba(18,24,34,.42); backdrop-filter: blur(2px); }
.busy[hidden] { display: none; }
.busy-card { width: min(430px, 92vw); background: #fff; border-radius: 14px; padding: 24px 26px; box-shadow: 0 24px 60px -20px rgba(20,26,38,.45); }
.spin { width: 26px; height: 26px; margin: 0 auto 14px; border: 3px solid #e8ecf2; border-top-color: var(--red); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.busy-t { font-size: 14px; font-weight: 650; text-align: center; margin-bottom: 6px; }
.busy-p { color: var(--sub); font-size: 12px; text-align: center; min-height: 18px; }
.busy-bar { height: 6px; background: #eef1f5; border-radius: 99px; margin-top: 14px; overflow: hidden; }
.busy-bar i { display: block; height: 100%; width: 4%; background: linear-gradient(90deg, #e0534e, #d3302b); border-radius: 99px; transition: width .25s; }

/* ---------- 当前排序列高亮（红字黄底） ---------- */
.box.hi {
  background: #fff500;
  border-color: #eccf00;
  color: #dd1a10;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px #f2d800;
}
.box.sum.hisum {
  background: #fff7a8;
  border-color: #eccf00;
  color: #b3251c;
}
td.colhi { background: #fffce0 !important; }
#grid tbody tr.row:hover td.colhi { background: #fff8c9 !important; }
.box.hi.focus { box-shadow: inset 0 0 0 2px #d3302b; }
#grid thead th.sorted { box-shadow: inset 0 -2px 0 var(--red); }

/* ---------- 深色主题下的控件表面色（只覆盖硬编码的白色） ---------- */
body[data-theme="dark"] .btn,
body[data-theme="dark"] .colbtn,
body[data-theme="dark"] .mini-btn,
body[data-theme="dark"] .dsbtn,
body[data-theme="dark"] .seg button.active { background: #2b333f; border-color: #3c4654; color: var(--text); }
body[data-theme="dark"] .btn.primary { background: var(--red); border-color: var(--red); color: #fff; }
body[data-theme="dark"] .seg { background: #1f252e; }
/* V2.4.42：表格切换盒（浅灰底）在暗色系下也跟着走——之前漏了，白花花一块很违和 */
body[data-theme="dark"] .dsbox { background: #1f252e; }
body[data-theme="dark"] .dsbox::before { color: #6a737d; }
body[data-theme="dark"] .search input,
body[data-theme="dark"] select,
body[data-theme="dark"] .fsel-new input,
body[data-theme="dark"] .fsel-new-row select,
body[data-theme="dark"] .theme-row .hx,
body[data-theme="dark"] .theme-row input[type="color"],
body[data-theme="dark"] .crow input[type="color"] { background: #232a35; color: var(--text); border-color: #39424f; }
body[data-theme="dark"] .search input:focus { background: #28303c; }
/* V2.4.51（用户报 bug）：上面那条用了 background 简写，会把 repeat 重置成 repeat，
   暗色下下拉箭头就铺满整个框（˅˅˅˅）——这里补回 no-repeat + 右侧居中 */
body[data-theme="dark"] select { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2395a1b2' stroke-width='2.4'><path d='M6 9l6 6 6-6'/></svg>"); background-repeat: no-repeat; background-position: right 8px center; }
body[data-theme="dark"] .pop label:hover,
body[data-theme="dark"] .crow:hover { background: #2b333f; }
body[data-theme="dark"] #grid thead th.sortable:hover { background: #333c4a; }
body[data-theme="dark"] .theme-preset { background: #262e39; }
body[data-theme="dark"] .ov-panel,
body[data-theme="dark"] .ds-panel,
body[data-theme="dark"] .wel-card { background: #232a35; color: var(--text); }
body[data-theme="dark"] .pop,
body[data-theme="dark"] .tablewrap,
body[data-theme="dark"] .toolbar,
body[data-theme="dark"] .sumbar { box-shadow: 0 10px 26px -18px rgba(0,0,0,.6); }
body[data-theme="dark"] .cell-empty { color: #4c5666; }
body[data-theme="dark"] .pimg { background: #2b333f; }

/* ---------- 版本徽章「终极版」 ---------- */
.ver {
  display: inline-block; margin-left: 7px; padding: 1px 6px;
  font-size: 10px; font-weight: 600; letter-spacing: 0; vertical-align: 2px;
  border-radius: 6px; white-space: nowrap;
  color: #c0392b;
  background: rgba(192, 57, 43, .10);
  border: 1px solid rgba(192, 57, 43, .30);
}
body[data-theme="dark"] .ver { color: #ff9a8c; background: rgba(255, 122, 105, .14); border-color: rgba(255, 122, 105, .34); }
.wel-card h2 .ver { font-size: 12px; padding: 2px 8px; vertical-align: 4px; }

/* ---------- 格子趋势：整格比例填充（数值文本放在色条内部居中显示） ---------- */
/* isolation:isolate 让 .box 自成层叠上下文：
   fill(z-index:-1) 画在白底之上、格子边框之下 —— 没有它 fill 会被 .box 的白背景盖住（此前完全看不见的根因） */
.stack .box { position: relative; isolation: isolate; }
.box .fill {
  position: absolute; left: 0; top: 0; bottom: 0; z-index: -1;
  display: flex; align-items: center; justify-content: center; overflow: visible;
  border-radius: 2px; background: currentColor;
  pointer-events: none; max-width: 100%; min-width: min-content;
  font-style: normal;   /* <i> 默认斜体：不加这句数字会变斜（用户反馈的根因） */
}
/* 数值在色条中间（用户明确要求：数字居中在数据格子里，不靠边） */
.box .fill b { font-weight: 600; font-style: normal; white-space: nowrap; padding: 0 8px; line-height: 17px; }
.box.ghost .fill, .box.sum .fill { display: none; }

/* ---------- 详情面板：趋势图工具栏 / 指标 chips / 悬停提示 ---------- */
.tc-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px; flex-wrap: wrap; }
.tc-seg { display: inline-flex; background: #eef1f5; border-radius: 7px; padding: 2px; gap: 2px; flex-wrap: wrap; }
.tc-seg button { border: 0; background: transparent; font-size: 11px; padding: 3px 8px; border-radius: 5px; cursor: pointer; color: #5c6572; }
.tc-seg button:hover { color: var(--red); }
.tc-seg button.active { background: #fff; color: var(--red); font-weight: 700; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.tc-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 8px; }
.tc-chip {
  display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; padding: 2px 6px;
  background: #f4f6f9; border: 1px solid #e3e7ee; border-radius: 6px; color: #4a5462;
}
.tc-chip i { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.tc-chip .tc-x { cursor: pointer; color: #a3abb7; font-weight: 400; padding: 0 1px; }
.tc-chip .tc-x:hover { color: var(--red); }
.tc-empty { font-size: 11px; color: #9aa1ac; padding: 12px 4px; }
.chart { position: relative; }
.tc-tip {
  position: absolute; top: 22px; z-index: 6; background: #222a35; color: #fff; font-size: 11px;
  padding: 4px 8px; border-radius: 6px; pointer-events: none; white-space: nowrap;
  box-shadow: 0 4px 14px rgba(0,0,0,.3);
}
.tc-tip b { display: block; font-size: 9.5px; color: #b8c0cc; font-weight: 400; }

/* ---------- 主图悬停放大预览 ---------- */
#imgZoom {
  position: fixed; inset: 0; z-index: 300; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 10px; cursor: default;
  background: rgba(13,16,22,.78); opacity: 0; transition: opacity .17s; pointer-events: none;
}
#imgZoom.on { opacity: 1; }
#imgZoom[hidden] { display: none !important; }
#imgZoom img {
  border-radius: 10px; box-shadow: 0 24px 80px rgba(0,0,0,.5);
  max-width: 86vw; max-height: 80vh; background: #fff;
}
#imgZoom .zm-meta { color: #e8ecf2; font-size: 12px; text-shadow: 0 1px 4px rgba(0,0,0,.65); }

/* ---------- 图片缓存面板 ---------- */
#picCachePop { width: 340px; }
#picCachePop .pc-row { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
#picCachePop .pc-row label { flex: 0 0 auto; padding: 0; color: var(--sub); }
#picCachePop .pc-row input {
  flex: 1; min-width: 0; height: 28px; border: 1px solid var(--line); border-radius: 6px;
  padding: 0 8px; font-size: 11.5px; color: var(--text); background: var(--cell); outline: none;
  font-family: Consolas, monospace;
}
#picCachePop .pc-row input:focus { border-color: #b9c8ee; }
#picCachePop .pc-row input:disabled { opacity: .6; }
#picCachePop .pc-actions { display: flex; gap: 6px; }
#picCachePop .mini-btn { flex: 1; height: 28px; }
/* 标题栏的「关闭」按钮：不吃 flex:1，靠右放，小巧的幽灵按钮样式 */
#picCachePop h4 .pc-x { flex: 0 0 auto; margin-left: auto; height: 24px; padding: 0 12px; font-size: 12px; }
#picCachePop .pc-stat { margin-top: 8px; font-size: 11.5px; color: var(--text); min-height: 16px; }
#picCachePop .pc-note { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line-soft); color: #9aa1ac; font-size: 10.5px; line-height: 1.5; }

/* ---------- 深色主题补充 ---------- */
body[data-theme="dark"] .tc-seg { background: #1f252e; }
body[data-theme="dark"] .tc-seg button { color: #95a1b2; }
body[data-theme="dark"] .tc-seg button.active { background: #2b333f; color: #ff9a8c; }
body[data-theme="dark"] .tc-chip { background: #262e39; border-color: #39424f; color: var(--text); }
body[data-theme="dark"] .box .fill { background: color-mix(in srgb, var(--bar, #ffce96) 45%, transparent); }
body[data-theme="dark"] #imgZoom img { background: transparent; }

/* ---------- 修复：指标选择弹层要盖过详情面板（.overlay z-index:100） ---------- */
#tcPop { z-index: 160; }

/* ---------- 详情趋势图：宽度可拖动（左边界分隔条） ---------- */
.ov-charts { width: var(--ovw, 306px); flex: 0 0 var(--ovw, 306px); }
.ov-split {
  flex: 0 0 7px; cursor: col-resize; position: relative;
  background: linear-gradient(90deg, transparent 0 3px, var(--line) 3px 4px, transparent 4px);
}
.ov-split::after {
  content: ""; position: absolute; top: 50%; left: 1px; transform: translateY(-50%);
  width: 3px; height: 38px; border-radius: 2px; background: #d7dde7; opacity: .8;
}
.ov-split:hover::after, .ov-split.dragging::after { background: var(--blue); opacity: 1; }
body.resizing-x, body.resizing-x * { cursor: col-resize !important; user-select: none !important; }
body[data-theme="dark"] .ov-split::after { background: #46505f; }

/* 图表高度拖动条 */
.tc-grip { height: 7px; margin: 2px 0 0; cursor: row-resize; position: relative; }
.tc-grip::after {
  content: ""; position: absolute; left: 50%; top: 3px; transform: translateX(-50%);
  width: 34px; height: 2px; border-radius: 2px; background: #e3e8ef;
}
.tc-grip:hover::after { background: var(--blue); }
body[data-theme="dark"] .tc-grip::after { background: #3c4654; }

/* 指标弹层：一键清空 */
.tc-clearbar { display: flex; justify-content: flex-end; margin: 2px 0 4px; }

/* ---------- 格子数据条：纯白轨道 + 色条（颜色在「外观配色」里自定义） ---------- */
body:not([data-theme="dark"]) .stack .box:not(.sum):not(.ghost) {
  background: #fff; border-color: #e5e9ef; color: #3b4048; font-weight: 600; border-radius: 4px;
}
/* V2.4.16（用户定死）：新默认观感（色条 #ffce96 + 线框 #bb9161）只对「没存过主题的新用户 /
   主动选了新默认色条」的人生效；老用户存过的旧主题连线框都保持原样 */
body[data-bar-v2="1"]:not([data-theme="dark"]) .stack .box:not(.sum):not(.ghost) {
  border-color: #bb9161;
}
/* 色条颜色 = --bar（默认柔橘 #ffce96，用户可在外观里改成任意颜色） */
body:not([data-theme="dark"]) .stack .box .fill { opacity: 1; border-radius: 3px; background: var(--bar, #ffce96); }
body:not([data-theme="dark"]) .stack .box .fill b { color: #30343b; }
/* V2.4.16（用户定死）：最新一天（每款第一格）不再加深——所有格子统一用同一个色条颜色 */
body:not([data-theme="dark"]) .stack .box.newest .fill { background: var(--bar, #ffce96); }

/* 排序列：保留「红字」，轨道仍纯白 + 橘色条，不遮住长短差异 */
body:not([data-theme="dark"]) .box.hi {
  background: #fffdf5; border-color: #f0d9a8; color: #d32016;
  box-shadow: inset 0 0 0 1px #f6e9a8;
}
body:not([data-theme="dark"]) .box.hi .fill { background: color-mix(in srgb, var(--bar, #ffce96) 72%, #e0530f); }
body:not([data-theme="dark"]) .box.sum.hisum { background: #fff6c9; border-color: #ecd97f; color: #b3251c; }

/* 文本/日期格：示例里的青绿实心块 */
body:not([data-theme="dark"]) .stack .txt {
  background: #a9e6d4; border-color: #6fc9ae; color: #225649; border-radius: 4px; font-weight: 600;
}

/* ---------- 主表格格子：每 7 天一组换底色（wb0/wb1 交替），看清一周区间 ---------- */
body:not([data-theme="dark"]) .stack .box.wb1:not(.ghost):not(.sum) { background: #f3f5f9; border-color: #e2e7ee; }
body[data-theme="dark"] .stack .box.wb1:not(.ghost):not(.sum) { background: #272f3a; border-color: #39424f; }
.stack .txt.wb1 { filter: brightness(0.94); }
.stack .box.ghost.wb1 { background: repeating-linear-gradient(135deg, #f3f5f9 0 4px, #e9edf3 4px 8px); }

/* ---------- 详情每日明细：每 7 天一组底色（6 色循环，与示例一致） ---------- */
.ov-table tr.wk0 td { background: #e9f6ee; }
.ov-table tr.wk1 td { background: #fdf7de; }
.ov-table tr.wk2 td { background: #fdeee1; }
.ov-table tr.wk3 td { background: #e9f0fc; }
.ov-table tr.wk4 td { background: #f2ecfa; }
.ov-table tr.wk5 td { background: #fdeff2; }
.ov-table tr.wkstart td:first-child { box-shadow: inset 3px 0 0 #7db08a; }
.ov-table tr.wk3.wkstart td:first-child { box-shadow: inset 3px 0 0 #7d9bc4; }

/* ---------- 详情每日明细：点列选中 → 整列高亮 + 表头标记 ---------- */
.ov-table thead th.selfd { color: #24589f; background: #e2ecfc; box-shadow: inset 0 -2px 0 #2f6bff; }
.ov-table td.selcol { background: #e6effd !important; }
/* ---------- V2.3.26（用户要求）：点任意一个格子 → 该行整行 + 该列整列同时变色（Excel 十字高亮） ---------- */
.ov-table tbody tr.selrow td { background: #eef4fd !important; }
.ov-table tbody tr.selrow td.selcol { background: #d5e4fc !important; }   /* 行列交叉的那一格最深，一眼定位 */
.ov-table tbody tr.selrow td:first-child { box-shadow: inset 3px 0 0 #2f6bff; }

/* ---------- 菜单下拉 ---------- */
#menuPop { width: 176px; padding: 6px; }
.menu-item {
  display: flex; width: 100%; align-items: center; gap: 9px; border: 0; background: transparent;
  padding: 9px 10px; border-radius: 7px; cursor: pointer; font-size: 13px; color: var(--text); text-align: left;
}
.menu-item:hover { background: #f4f6fa; }
.menu-item .mi-ic { width: 20px; text-align: center; flex: 0 0 auto; }

/* ---------- 主图缺失弹窗 ---------- */
.miss-panel { width: min(600px, 94vw); }
.miss-count { font-size: 12px; color: var(--red); font-weight: 600; margin-left: 6px; }
.miss-tip { margin: 0; padding: 10px 18px 0; color: var(--sub); font-size: 12px; line-height: 1.6; }
.miss-item {
  display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--line-soft);
  cursor: pointer; border-radius: 6px;
}
.miss-item:hover { background: #fdf4f3; }
.miss-item:last-child { border-bottom: 0; }
.miss-item .mi-id { font-weight: 650; font-size: 12.5px; color: var(--red); min-width: 110px; }
.miss-item .mi-code { color: var(--text); font-size: 12px; min-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.miss-item .mi-title { flex: 1; min-width: 0; color: var(--sub); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 汇总条自定义面板 ---------- */
#sumPop { width: 288px; }
.sum-list { max-height: 300px; overflow: auto; }
.sum-item { display: flex; align-items: center; gap: 4px; padding: 2px 4px; border-radius: 6px; }
.sum-item:hover { background: #f6f8fb; }
.sum-item.dragging { opacity: .4; }
.sum-item.drop-above { box-shadow: inset 0 2px 0 var(--blue); }
.sum-item.drop-below { box-shadow: inset 0 -2px 0 var(--blue); }
.sum-item label { flex: 1; min-width: 0; padding: 4px 4px; }
.sum-grip { color: #c6ccd6; font-size: 10px; cursor: grab; padding: 0 2px; user-select: none; }
.sum-sec { margin: 8px 0 3px; font-size: 11px; color: var(--muted); font-weight: 600; }
#sumbar .mini-btn { flex: 0 0 auto; margin-left: 4px; }

/* ---------- 更新说明弹窗（历史版本记录） ---------- */
.chg-list { padding: 4px 14px 14px; }
.chg-item { padding: 10px 0 6px; border-bottom: 1px dashed #e6eaf0; }
.chg-item:last-child { border-bottom: none; }
.chg-item h4 { margin: 0 0 6px; font-size: 13px; color: var(--text); display: flex; align-items: center; gap: 6px; }
.chg-item .chg-new { font-size: 10px; font-weight: 600; color: #fff; background: var(--blue, #2f6bff); border-radius: 4px; padding: 1px 6px; }
.chg-item ul { margin: 0; padding-left: 18px; }
.chg-item li { font-size: 12px; line-height: 1.75; color: #4a5260; }
/* V2.4.39：更新说明里的补充说明（次要信息，比正文小一号、淡一点） */
.chg-item .chg-minor { display: inline-block; margin-top: 2px; font-size: 11.5px; color: var(--sub, #7c8595); }

/* ---------- 列设置：拖动排序 ---------- */
.crow .sum-grip { flex: 0 0 auto; }
.crow.dragging { opacity: .4; }
.crow.drop-above { box-shadow: inset 0 2px 0 var(--blue); }
.crow.drop-below { box-shadow: inset 0 -2px 0 var(--blue); }

/* ---------- 详情表：鼠标下滑区间选中 + 实时总和/平均 ---------- */
.ov-table tbody { user-select: text; -webkit-user-select: text; }
.ov-table tbody td.rselcol {
  background: #dbe7ff !important;
  box-shadow: inset 0 1px 0 #c3d6ff, inset 0 -1px 0 #c3d6ff;
  color: #1d3f8f; font-weight: 650;
}
#ovSelChip {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 150;
  display: flex; align-items: center; gap: 12px; padding: 9px 14px; border-radius: 999px;
  background: rgba(24,32,46,.94); color: #fff; font-size: 12.5px; box-shadow: 0 12px 30px -10px rgba(0,0,0,.45);
  white-space: nowrap;
}
#ovSelChip[hidden] { display: none; }
#ovSelChip b { color: #ffd166; font-weight: 700; }
#ovSelChip button {
  height: 24px; padding: 0 10px; border-radius: 999px; border: 0; cursor: pointer;
  background: #2f6bff; color: #fff; font-size: 12px;
}
#ovSelChip button:hover { background: #1f57dd; }
#ovSelChip .x { background: transparent; color: #b9c1cc; border: 1px solid rgba(255,255,255,.22); }
#ovSelChip .x:hover { background: rgba(255,255,255,.12); color: #fff; }
body.ov-rseling, body.ov-rseling * { cursor: cell !important; user-select: none !important; }

/* ---------- 主图缺失弹窗：默认屏幕居中弹出 + 可拖动 + 小图标记 ---------- */
.miss-panel { position: relative; margin: 9vh auto 0; }   /* 水平居中、略偏上；拖动时会改成 fixed 定位不受影响 */
.miss-item .mi-bad {
  flex: 0 0 auto; font-size: 10px; font-weight: 600; color: #ad3d58;
  background: #fdeef1; border: 1px solid #f6d6dd; border-radius: 4px; padding: 1px 5px;
}

/* ================= V2.1.9：利润列 / 固定成本 / 列模板 ================= */
/* 利润格子：正数红（盈）、负数绿（亏） */
#gridBody .box.pf-pos .fill { background: #e05656; border-color: #c94545; }
#gridBody .box.pf-neg .fill { background: #2f9e6b; border-color: #26855a; }
#gridBody .box.sum.pf-pos { background: #fdecec; border-color: #e8a0a0; color: #b23434; }
#gridBody .box.sum.pf-neg { background: #e8f6ee; border-color: #9ed4b6; color: #1d7a4f; }
.ovp-pos { color: #d64541; font-weight: 600; }
.ovp-neg { color: #1d9e63; font-weight: 600; }

/* 固定成本弹窗 */
/* V2.4.20（用户要求）：标题条（固定成本 / 关闭）永远钉在面板顶部，只有内容区自己滚 */
#fixOv .ds-panel > .ds-head { flex: 0 0 auto; background: #fff; z-index: 3; }
body[data-theme="dark"] #fixOv .ds-panel > .ds-head { background: #232a35; }
#fixOv .fix-form { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.fix-form { padding: 12px 16px 16px; }
/* V2.3.28：作用范围提示条（固定成本按表格独立） */
.fix-scope {
  margin-bottom: 11px; padding: 7px 10px; border-radius: 7px; line-height: 1.5;
  font-size: calc(11.5px * var(--fz-sub) * var(--fz-all));
}
.fix-scope.own { background: #eef4fd; border: 1px solid #d3e2fb; color: #2a5a9e; }
.fix-scope.own b { color: #1d4ea8; }
.fix-scope.none { background: #fdf6e6; border: 1px solid #f0e0b8; color: #8a6a1e; }
.fix-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin-bottom: 12px; }
.fix-grid label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: #5a6472; }
.fix-grid label span { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #8a93a2; }
.fix-grid input { width: 96px; padding: 5px 9px; border: 1px solid #d8dee8; border-radius: 6px; font-size: 13px; outline: none; }
.fix-grid input:focus { border-color: #e8734a; }
.fix-actions { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.fix-match { font-size: 12px; color: #8a93a2; }

/* 列设置：模板条 */
.tpl-bar { display: flex; gap: 6px; padding: 9px 10px 3px; border-top: 1px solid #eef1f6; margin-top: 6px; }
.tpl-bar input { flex: 1; min-width: 0; padding: 4px 8px; border: 1px solid #d8dee8; border-radius: 6px; font-size: 12px; outline: none; }
.tpl-bar input:focus { border-color: #e8734a; }
.tpl-list { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px 10px 10px; max-height: 130px; overflow: auto; }
.tpl-item { display: flex; align-items: center; gap: 4px; }
.tpl-x { cursor: pointer; color: #b3bac4; font-size: 14px; line-height: 1; padding: 2px 3px; user-select: none; }
.tpl-x:hover { color: #e05656; }
.tpl-empty { font-size: 11px; color: #9aa1ac; line-height: 1.5; }

/* ---------- 账号系统（登录门 / 用户角标 / 账号管理）V2.2.0 ---------- */
.authgate {
  position: fixed; inset: 0; z-index: 300;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg);
}
.auth-card {
  width: 340px; max-width: calc(100vw - 40px);
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); padding: 24px 26px 20px;
}
.auth-logo { display: flex; align-items: center; gap: 10px; }
.auth-logo img { width: 38px; height: 38px; }
.auth-logo h3 { margin: 0; font-size: 16px; }
.auth-logo h3 .ver { font-size: 10px; vertical-align: 2px; margin-left: 6px; }
.auth-logo p { margin: 2px 0 0; font-size: 11px; color: var(--sub); }
.auth-tabs { display: flex; gap: 6px; margin: 16px 0 12px; background: var(--bg); padding: 3px; border-radius: 9px; }
.auth-tabs button {
  flex: 1; height: 30px; border: none; border-radius: 7px; cursor: pointer;
  background: transparent; color: var(--sub); font-weight: 500;
}
.auth-tabs button.active { background: var(--panel); color: var(--text); font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.auth-field { margin-bottom: 10px; }
.auth-field label { display: block; font-size: 12px; color: var(--sub); margin-bottom: 4px; }
.auth-field input {
  width: 100%; height: 34px; padding: 0 10px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--cell); color: var(--text);
}
.auth-field input:focus { outline: none; border-color: var(--blue); }
.auth-err { color: var(--red); font-size: 12px; min-height: 18px; margin: 2px 0 6px; }
.auth-go { width: 100%; }
.auth-sub { font-size: 11px; color: var(--muted); margin: 12px 0 0; line-height: 1.6; text-align: center; }
.userchip {
  display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px;
  border: 1px solid var(--line); border-radius: 8px; color: var(--sub); font-size: 12px;
  background: var(--panel); white-space: nowrap;
}
.userchip b { color: var(--text); font-weight: 600; }
.userchip .uadmin {
  font-style: normal; font-size: 10px; color: var(--t-orange-fg);
  background: var(--t-orange-bg); border: 1px solid var(--t-orange-bd);
  border-radius: 4px; padding: 1px 5px;
}
.userchip button { border: none; background: none; color: var(--blue); cursor: pointer; padding: 0; font-size: 12px; }
.userchip button:hover { text-decoration: underline; }
.menu-div { height: 1px; background: var(--line); margin: 5px 8px; }
/* 终极入口静默验证框：光秃秃一个小面板+一个输入框，无任何文字提示 */
.mgate-panel { width: 250px; padding: 16px; }
.mgate-panel input {
  width: 100%; height: 32px; padding: 0 10px; border: 1px solid var(--line);
  border-radius: 7px; font-size: 13px; outline: none; letter-spacing: 1px;
}
.adm-panel { width: 760px; max-width: calc(100vw - 40px); }
.adm-add {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-end;
  padding: 10px 2px; border-bottom: 1px solid var(--line);
}
.adm-add label { display: flex; flex-direction: column; gap: 3px; font-size: 11px; color: var(--sub); }
.adm-add input, .adm-add select {
  height: 30px; padding: 0 8px; border: 1px solid var(--line); border-radius: 7px;
  background: var(--cell); color: var(--text); width: 140px;
}
/* V2.3.14（用户反馈：运营日志占比太高，看子账号费劲）：账号列表为主、日志缩到底部一小条——
   列表吃掉全部富余空间，日志固定矮条内部滚动（.ds-panel 本身是 flex column） */
.adm-list { flex: 4 1 auto; min-height: 160px; overflow: auto; }
.adm-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.adm-table th, .adm-table td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; }
.adm-table th { color: var(--sub); font-weight: 500; background: var(--head); position: sticky; top: 0; }
.adm-ops { display: flex; gap: 2px; }
.adm-op { border: none; background: none; color: var(--blue); cursor: pointer; padding: 2px 5px; font-size: 12px; }
.adm-op:hover { text-decoration: underline; }
.adm-op.danger { color: var(--red); }
.badge {
  display: inline-block; font-size: 10px; border-radius: 4px; padding: 1px 6px;
  color: var(--t-gray-fg); background: var(--t-gray-bg); border: 1px solid var(--t-gray-bd);
}
.badge.adm { color: var(--t-orange-fg); background: var(--t-orange-bg); border-color: var(--t-orange-bd); }
.badge.ok { color: var(--t-green-fg); background: var(--t-green-bg); border-color: var(--t-green-bd); }
.badge.off { color: var(--t-red-fg); background: var(--t-red-bg); border-color: var(--t-red-bd); }
/* V2.4.2：成员在线状态（在线=绿点，离线=灰点）+ 最后一次活动时间 */
.badge.test { color: var(--t-gray-fg); background: var(--t-gray-bg); border-color: var(--t-gray-bd); font-style: italic; }
.badge.live { display: inline-flex; align-items: center; gap: 4px; color: #8a9099; background: #f2f4f7; border-color: #e3e7ee; }
.badge.live.on { color: var(--t-green-fg); background: var(--t-green-bg); border-color: var(--t-green-bd); }
.pres-dot { width: 6px; height: 6px; border-radius: 50%; background: #b9c0ca; display: inline-block; }
.badge.live.on .pres-dot { background: var(--t-green-fg); box-shadow: 0 0 0 2px rgba(22, 163, 74, .18); }
.pres-when { color: #a6adb8; font-size: 10.5px; margin-left: 5px; }
.ops-hint { color: var(--muted); font-size: 10.5px; padding: 0 0 5px; }
.u-self { color: var(--muted); font-size: 11px; }
.rst-panel { width: 380px; max-width: calc(100vw - 40px); }
.adm-newpwd {
  font-size: 15px; letter-spacing: 1px;
  background: var(--t-yellow-bg); border: 1px dashed var(--t-yellow-bd); color: var(--t-orange-fg);
  padding: 10px 12px; border-radius: 8px; margin: 0 0 10px;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  user-select: all;
}
.ys-toast {
  position: fixed; left: 50%; bottom: 34px; transform: translateX(-50%);
  z-index: 400; background: #232a34; color: #fff; font-size: 13px;
  padding: 9px 16px; border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.25);
  opacity: 0; transition: opacity .25s; pointer-events: none; max-width: 80vw;
}
.ys-toast.err { background: #a32d2d; }
body[data-theme="dark"] .auth-tabs { background: #1f252e; }
body[data-theme="dark"] .auth-tabs button.active { background: #2b333f; }
body[data-theme="dark"] .auth-field input,
body[data-theme="dark"] .adm-add input,
body[data-theme="dark"] .adm-add select { background: #232a34; border-color: #3c4654; }
.adm-stats {
  padding: 9px 14px; font-size: 12px; color: var(--sub);
  background: var(--t-blue-bg, #eef4fd); border-bottom: 1px solid var(--line);
}
.adm-stats b { color: var(--text); }
body[data-theme="dark"] .adm-stats { background: #1f2733; }

/* ---------- V2.3.2：运营日志 / 详情列设置按钮 / 缓存目录引导 ---------- */
.adm-opsbar { display: flex; align-items: center; gap: 8px; padding: 10px 18px 0; border-top: 1px solid var(--line); }
.adm-opsbar b { font-size: 13px; }
.adm-opsbar .adm-op { margin-left: auto; }
.adm-opsbox { flex: 0 0 auto; max-height: 130px; overflow: auto; padding: 8px 18px 14px; font-size: 11.5px; color: var(--sub); }
/* V2.3.13：线上版本更新提示条（右下角，非模态，不影响任何操作） */
#verBanner {
  position: fixed; right: 18px; bottom: 18px; z-index: 400; display: flex; align-items: center; gap: 10px;
  background: #223047; color: #fff; padding: 11px 14px; border-radius: 10px; font-size: 12.5px;
  box-shadow: 0 14px 34px -12px rgba(15, 22, 36, .55); border: 1px solid rgba(255, 255, 255, .12);
}
#verBanner b { color: #ffd479; }
#verBanner .vb-go { border: none; cursor: pointer; padding: 6px 12px; border-radius: 7px; font-size: 12px; font-weight: 600; background: var(--blue); color: #fff; }
#verBanner .vb-go:hover { filter: brightness(1.12); }
#verBanner .vb-no { border: none; cursor: pointer; padding: 6px 10px; border-radius: 7px; font-size: 12px; background: rgba(255, 255, 255, .12); color: #dfe6f0; }

/* V2.3.26：图片缓存/主图缺失常驻提示条（右下角，与版本提示条同款交互：只有用户主动关才消失） */
#imgBanner {
  position: fixed; right: 18px; bottom: 18px; z-index: 401; display: flex; align-items: center; gap: 10px; max-width: 560px;
  background: #2c2a22; color: #fff; padding: 11px 14px; border-radius: 10px; font-size: 12.5px; line-height: 1.45;
  box-shadow: 0 14px 34px -12px rgba(15, 22, 36, .55); border: 1px solid rgba(255, 255, 255, .12);
}
#imgBanner .ib-txt b { color: #ffd479; }
#imgBanner .ib-go { border: none; cursor: pointer; padding: 6px 12px; border-radius: 7px; font-size: 12px; font-weight: 600; background: var(--blue, #2f6bff); color: #fff; white-space: nowrap; }
#imgBanner .ib-go:hover { filter: brightness(1.12); }
#imgBanner .ib-close { border: none; cursor: pointer; width: 24px; height: 24px; border-radius: 6px; background: rgba(255, 255, 255, .12); color: #dfe6f0; font-size: 12px; line-height: 1; flex: 0 0 24px; }
#verBanner .vb-no:hover { background: rgba(255, 255, 255, .2); }
.ops-row { display: flex; gap: 8px; padding: 3px 0; border-bottom: 1px dashed var(--line-soft); align-items: baseline; }
.ops-row b { color: var(--text); flex: 0 0 auto; }
.ops-t { color: #a6adb8; flex: 0 0 auto; font-size: 10.5px; }
.ops-a { color: #5b8def; flex: 0 0 auto; }
.ops-d { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pcask-panel { width: 400px; max-width: calc(100vw - 40px); }
.pcask-p { margin: 0 0 10px; font-size: 12px; color: var(--sub); line-height: 1.7; }
.pcask-btns { display: flex; gap: 8px; }
.ov-col-btn { margin-left: auto; }

/* 登录门：记住账号/密码（V2.3.4） */
.auth-remember { display: flex; gap: 18px; margin: 2px 0 10px; font-size: 12.5px; color: #6b7280; }
.auth-remember label { display: flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; }
.auth-remember input { accent-color: #4f6ef2; cursor: pointer; }

/* 讨论删除按钮（V2.3.5，仅管理员/终极管理员渲染） */
.on-del { margin-left: auto; cursor: pointer; color: #c2c7d0; font-size: 12px; line-height: 1; padding: 1px 4px; border-radius: 4px; user-select: none; }
.on-del:hover { color: #e5484d; background: #fdecec; }

/* 讨论删除痕迹（微信撤回风格小字，V2.3.5） */
.on-sys { text-align: center; font-size: 11px; color: #9aa1ac; margin: 7px 0; }
.on-sys span { background: #f1f3f6; padding: 2px 9px; border-radius: 9px; }

/* ===== V2.3.5 窗口缩放把手（铁律：所有窗口可拖动+可缩放） ===== */
.win-grip { position: absolute; right: 2px; bottom: 2px; width: 17px; height: 17px; cursor: nwse-resize; z-index: 30; }
.win-grip::after { content: ''; position: absolute; right: 3px; bottom: 3px; width: 9px; height: 9px; border-right: 2px solid #c3c9d4; border-bottom: 2px solid #c3c9d4; border-radius: 1px; }
.win-grip:hover::after { border-color: #7c8595; }
/* V2.3.26：详情窗口不显示通用右下角把手（它压在 .ov-grip.se 上，会把几何写进另一套记忆） */
#overlay .win-grip { display: none; }

/* ===== 讨论工作台 ===== */
.wb-panel { width: 560px; max-width: 94vw; display: flex; flex-direction: column; }
.wb-head h3 { margin: 0; font-size: 14px; }
.wb-tip { margin: 8px 2px 6px; font-size: 11.5px; color: #9aa1ac; }
.wb-list { overflow: auto; min-height: 120px; }
/* ---------- V2.4.10 身份标签系统 ---------- */
.dw-shops { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 6px 2px 8px; border-bottom: 1px solid #eef0f4; margin-bottom: 6px; font-size: 11.5px; }
.dw-shops > b { color: #6b7280; font-weight: 600; }
.dw-shop { display: inline-flex; align-items: center; gap: 5px; padding: 3px 8px; border: 1px solid #e6e9f0; border-radius: 999px; background: #fff; }
.dw-shop i { font-style: normal; color: #374151; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dw-shop em { font-style: normal; font-size: 10.5px; padding: 1px 6px; border-radius: 999px; }
.dw-shop em.tg-on { background: #e8f7ee; color: #157347; }
.dw-shop em.tg-off { background: #fdf3e0; color: #a4700f; }
.dw-mem { font-size: 10.5px; padding: 1px 7px; border: 1px solid #dfe3ea; border-radius: 999px; background: #f7f8fb; color: #4b5563; cursor: pointer; }
.dw-mem:hover { background: #eef1f6; }
.idt-hint { font-size: 11.5px; color: #8a90a0; line-height: 1.6; margin-bottom: 10px; }
.idt-list { display: flex; flex-direction: column; gap: 6px; }
.idt-row { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid #e6e9f0; border-radius: 8px; background: #fff; font-size: 12px; }
.idt-row .idt-shop { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: #374151; }
.idt-row .idt-day { color: #9aa1ac; font-size: 11px; }
.idt-row select { font-size: 12px; padding: 3px 6px; }
.badge.tag-op { background: #e8f0ff; color: #2f5fd0; }
.badge.tag-as { background: #fdf3e0; color: #a4700f; }
.badge.tag-share { background: #e8f7ee; color: #157347; }
.wb-row { padding: 8px 10px; border-bottom: 1px solid #eef0f4; cursor: pointer; border-radius: 8px; }
.wb-row:hover { background: #f5f7fb; }
.wb-row.dim { opacity: 0.55; cursor: help; }
.wb-meta { display: flex; align-items: baseline; gap: 8px; font-size: 11.5px; color: #9aa1ac; }
.wb-meta b { color: #2c313a; font-size: 12.5px; }
.wb-meta i { margin-left: auto; font-style: normal; color: #b3b9c4; }
.wb-txt { margin-top: 3px; font-size: 13px; color: #2c313a; word-break: break-all; }
/* 工作台的表格筛选下拉（V2.3.8 表格隔离） */
.dw-tbl { max-width: 150px; height: 26px; font-size: 12px; padding: 0 4px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--text); }

/* ===== V2.3.7 菜单功能窗口非模态化（用户铁律） =====
   菜单点出来的窗口：①点其他地方不关闭（只能 ✕ / ESC 关）
   ②开着时不挡主页面——遮罩隐藏、窗口本身不拦截点击，
   可以照常点其他款式、切表格、用其他功能 */
.overlay.modeless { pointer-events: none; }
.overlay.modeless > * { pointer-events: auto; }
.overlay.modeless > .ov-mask { display: none; }

/* ============================================================
   字体大小自定义（V2.3.15）：四档缩放相乘
   --fz-main 主要文字 / --fz-sub 次要文字（标题/副标题）/
   --fz-muted 淡文字（ID/时间）/ --fz-all 全局（整个软件）
   放在文件末尾以覆盖上方同名规则的固定 px 字号
   ============================================================ */

/* ---------- 主要文字：表格数据 / 正文 / 输入框 ---------- */
html, body { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
button, input, select { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.sumbar .s .v { font-size: calc(14px * var(--fz-main) * var(--fz-all)); }
.pl { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
.pl .pv.strong { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
.pl .tag { font-size: calc(10px * var(--fz-main) * var(--fz-all)); }
td.meta { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
.box { font-size: calc(11px * var(--fz-main) * var(--fz-all)); }
.cell-empty { font-size: calc(11px * var(--fz-main) * var(--fz-all)); }
.stack .txt { font-size: calc(10.5px * var(--fz-main) * var(--fz-all)); }
.pimg.ph { font-size: calc(10px * var(--fz-main) * var(--fz-all)); }
.pop label { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.fsel-new input[type="text"] { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.fsel-new-row select { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.fsel-new-row input[type="number"] { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
#selChip { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
#selChip button { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
#ovSelChip { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
#ovSelChip button { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
.toast { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
.ys-toast { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
.status button { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
.userchip button { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.lyt-item .lyt-nm { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.theme-preset .nm { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
.wb-txt { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.wb-meta b { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
.on-item .on-txt { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.ov-note .on-bar input { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.adm-table { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.adm-op { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.chg-item li { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.dw-tbl { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.fix-grid input { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.tpl-bar input { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.ds-nm b { font-size: calc(13.5px * var(--fz-main) * var(--fz-all)); }
#imgZoom .zm-meta { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.menu-item { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.miss-item .mi-code { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.miss-item .mi-id { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
.auth-remember { font-size: calc(12.5px * var(--fz-main) * var(--fz-all)); }
.auth-err { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.auth-field input { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.mgate-panel input { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.adm-add input, .adm-add select { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
.pcask-p { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
#picCachePop .pc-row input { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
#picCachePop .pc-stat { font-size: calc(11.5px * var(--fz-main) * var(--fz-all)); }
#verBanner { font-size: calc(13px * var(--fz-main) * var(--fz-all)); }
#verBanner .vb-go { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
#verBanner .vb-no { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.fsel-badge { font-size: calc(10.5px * var(--fz-main) * var(--fz-all)); }
.fsbox select { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }
.ov-table { font-size: calc(12px * var(--fz-main) * var(--fz-all)); }

/* ---------- 次要文字（标题/副标题）：表头 / 面板标题 / 小标签 ---------- */
.logo { font-size: calc(16px * var(--fz-sub) * var(--fz-all)); }
.brand-text h1 { font-size: calc(15px * var(--fz-sub) * var(--fz-all)); }
.brand-text p { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.count { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
#grid thead th { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.sumbar .s .l { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.pop h4 { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.ov-info .f { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.tab { font-size: calc(12.5px * var(--fz-sub) * var(--fz-all)); }
.ov-table thead th { font-size: calc(11px * var(--fz-sub) * var(--fz-all)); }
.ov-charts h5 { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.ov-note .on-head { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.ov-note .on-head b { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.on-item .on-meta b { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.ds-head h3 { font-size: calc(15px * var(--fz-sub) * var(--fz-all)); }
.ds-meta { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.wel-card h2 { font-size: calc(22px * var(--fz-sub) * var(--fz-all)); }
.wel-sub { font-size: calc(13px * var(--fz-sub) * var(--fz-all)); }
.wel-list b { font-size: calc(13px * var(--fz-sub) * var(--fz-all)); }
.wel-list span { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.busy-t { font-size: calc(14px * var(--fz-sub) * var(--fz-all)); }
.busy-p { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.chg-item h4 { font-size: calc(13px * var(--fz-sub) * var(--fz-all)); }
.fix-grid label { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.fix-grid label span { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.fix-match { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.auth-logo h3 { font-size: calc(16px * var(--fz-sub) * var(--fz-all)); }
.auth-logo p { font-size: calc(11px * var(--fz-sub) * var(--fz-all)); }
.auth-field label { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.adm-add label { font-size: calc(11px * var(--fz-sub) * var(--fz-all)); }
.adm-stats { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.adm-opsbar { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.adm-opsbar b { font-size: calc(13px * var(--fz-sub) * var(--fz-all)); }
.wb-head h3 { font-size: calc(14px * var(--fz-sub) * var(--fz-all)); }
.tagk { font-size: calc(11px * var(--fz-sub) * var(--fz-all)); }
.miss-tip { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.miss-count { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.miss-item .mi-title { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
.theme-row { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.ds-ops button { font-size: calc(12px * var(--fz-sub) * var(--fz-all)); }
.ver { font-size: calc(10px * var(--fz-sub) * var(--fz-all)); }
.badge { font-size: calc(10px * var(--fz-sub) * var(--fz-all)); }
.tc-chip { font-size: calc(10.5px * var(--fz-sub) * var(--fz-all)); }
.userchip .uadmin { font-size: calc(10px * var(--fz-sub) * var(--fz-all)); }

/* ---------- 淡文字（ID / 时间）：时间戳 / 提示 / 说明 ---------- */
.sumbar .tip { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.lyt-item .lyt-tm { font-size: calc(10.5px * var(--fz-muted) * var(--fz-all)); }
.theme-sec { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.theme-row .hx { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.ov-note .on-head span { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.on-item .on-meta span { font-size: calc(10.5px * var(--fz-muted) * var(--fz-all)); }
.on-empty { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.on-sys { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.ds-note { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.wel-tip { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.fsel-empty { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.fsel-tip { font-size: calc(10.5px * var(--fz-muted) * var(--fz-all)); }
.fsel-desc { font-size: calc(10.5px * var(--fz-muted) * var(--fz-all)); }
.auth-sub { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.u-self { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.wb-tip { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.wb-meta { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.tpl-empty { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.sum-sec { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
#picCachePop .pc-note { font-size: calc(10.5px * var(--fz-muted) * var(--fz-all)); }
.ops-t { font-size: calc(10.5px * var(--fz-muted) * var(--fz-all)); }
.dsbox::before { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
.tc-tip { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }
.tc-empty { font-size: calc(11px * var(--fz-muted) * var(--fz-all)); }

/* ---------- 字号滑杆（外观面板里新增的控件） ---------- */
.fz-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 12px; color: var(--sub); }
.fz-row .lb { flex: 1; min-width: 0; }
.fz-row input[type="range"] { flex: 0 0 96px; height: 18px; margin: 0; padding: 0; accent-color: var(--red); cursor: pointer; }
.fz-row .fzv { flex: 0 0 auto; text-align: right; font-size: 11px; color: var(--text); font-variant-numeric: tabular-nums; }
/* V2.3.25：字号百分比手动输入框（与滑杆双向同步） */
.fz-row input.fzin { flex: 0 0 48px; width: 48px; height: 24px; padding: 0 4px; text-align: right; font-size: 11.5px; color: var(--text); border: 1px solid var(--line); border-radius: 6px; background: var(--panel, #fff); font-variant-numeric: tabular-nums; }
.fz-row input.fzin:focus { outline: none; border-color: #8fa8d8; }
.fz-note { margin: 2px 0 0; font-size: 10.5px; color: var(--muted); line-height: 1.5; }

/* 序号列（吸顶/吸左，选择器优先级更高，需单独覆盖）：表头归次要、序号数字归淡文字 */
#grid thead th.m-idx { font-size: calc(11.5px * var(--fz-sub) * var(--fz-all)); }
#grid tbody td.m-idx { font-size: calc(11.5px * var(--fz-muted) * var(--fz-all)); }
#grid thead th.m-prod, #grid tbody td.m-prod { font-size: inherit; }

/* ---------- 推广分析 tab（V2.3.17）：切到该卡片时隐藏每日数据/趋势图/讨论 ---------- */
.overlay.mode-promo .ov-tablewrap,
.overlay.mode-promo .ov-split,
.overlay.mode-promo .ov-charts,
.overlay.mode-promo .ov-note { display: none !important; }
.ov-promo { flex: 1 1 auto; min-width: 0; overflow: auto; padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 12px; }
.ov-promo[hidden] { display: none; }
.pr-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.pr-head b { font-size: 14px; }
.pr-head span { color: var(--muted); font-size: 11.5px; }
.pr-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.pr-card { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--panel); }
.pr-card h5 { margin: 0 0 8px; font-size: 12px; color: var(--sub); }
.pr-row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 3px 0; font-size: 12px; color: var(--sub); }
.pr-row b { font-variant-numeric: tabular-nums; color: var(--text); }
.pr-row b.na { color: #c8ced6; }
/* V2.3.26：推广卡片的利润行（正红负绿）与「因缺少 XX 无法计算」提示 */
.pr-row b.pr-pos { color: #c0392b; }
.pr-row b.pr-neg { color: #1f7a55; }
.pr-row b.na-why { color: #b03030; font-weight: 500; font-size: 11px; line-height: 1.3; text-align: right; white-space: normal; }
.pr-charts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pr-chart { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--panel); min-width: 0; position: relative; }
.pr-chart h5 { margin: 0 0 6px; font-size: 12px; color: var(--sub); display: flex; justify-content: space-between; }
.pr-chart svg { width: 100%; }
.pr-ai { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--panel); }
.pr-ai-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pr-ai-out { margin-top: 8px; white-space: pre-wrap; word-break: break-word; font-size: calc(13.5px * var(--fz-ai, 1) * var(--fz-all)); line-height: 1.75; color: var(--text); min-height: 24px; max-height: 320px; overflow: auto; }
.pr-ai-out:empty::before { content: '点上方按钮，AI 会结合成交成本与三条趋势给出结论和建议（增加付费 / 停止付费 / 维持不动）'; color: #c8ced6; font-size: 11.5px; }
/* V2.3.25：AI 分析中提示行——显示正在分析哪个款，点一下直接跳到那个款（同讨论工作台跳转） */
.pr-ai-status { margin-top: 8px; padding: 7px 12px; border: 1px solid #bcd0f0; border-radius: 8px; background: rgba(59, 108, 212, .08); color: #2c4d86; font-size: 12.5px; cursor: pointer; }
.pr-ai-status b { color: #1f3c6e; }
.pr-ai-status .go { color: #2f6bff; text-decoration: underline; font-weight: 600; }
.pr-ai-status.same { cursor: default; }
.pr-ai-status.same .go { display: none; }

/* ---------- AI 解读按钮的网站星星图标（V2.3.20，用户指定替换机器人 emoji） ---------- */
.mini-btn img.bt-ico { width: 15px; height: 15px; vertical-align: -3px; margin-right: 5px; border-radius: 4px; }

/* ---------- 详情头：商品ID/商家编码/标题 可选中复制 + 「复制」按钮（V2.3.21） ---------- */
.ov-info .f .v { user-select: text; -webkit-user-select: text; cursor: text; }
.ov-info .cp-btn { margin-left: 6px; padding: 1px 9px; font-size: 11px; line-height: 1.6; user-select: none; cursor: pointer; }

/* ============================================================
   V2.4.0：左侧功能列表 + 万相无界页面
   配色全部沿用现有变量（--panel/--line/--t-orange-*），不引入新风格
   ============================================================ */
.app-shell { display: flex; align-items: stretch; min-height: 100vh; }
.sidebar {
  width: 96px; flex: none; background: var(--panel); border-right: 1px solid var(--line);
  padding: 12px 8px 10px; display: flex; flex-direction: column; gap: 4px;
  position: sticky; top: 0; height: 100vh; z-index: 55;
}
.sb-brand { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 2px 0 12px; }
.sb-logo {
  width: 30px; height: 30px; border-radius: 9px; overflow: hidden;
  background: var(--t-orange-bg); border: 1px solid var(--t-orange-bd);
  display: flex; align-items: center; justify-content: center;
}
.sb-logo img { width: 100%; height: 100%; object-fit: contain; }
.sb-name { font-size: 11px; color: var(--sub); letter-spacing: .3px; }
.sb-nav { display: flex; flex-direction: column; gap: 4px; }
.sb-item {
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  padding: 9px 4px; border: 1px solid transparent; border-radius: 9px;
  background: transparent; color: var(--sub); cursor: pointer;
  font-size: 11.5px; line-height: 1; transition: background .12s, color .12s;
}
.sb-item svg { width: 17px; height: 17px; }
.sb-item:hover { background: var(--hover); color: var(--text); }
.sb-item.active { background: var(--t-orange-bg); border-color: var(--t-orange-bd); color: var(--t-orange-fg); font-weight: 600; }
/* V2.4.1：功能列里的分隔线（页面功能 ↔ 导入/菜单） */
.sb-sep { height: 1px; background: var(--line); margin: 6px 6px; }
.sb-foot { margin-top: auto; text-align: center; font-size: 10.5px; color: var(--muted); }
/* 账号信息（cloud.js 注入的 .userchip 在功能列底部竖排：图标 + 名字 + 角色/退出） */
.sb-user { border-top: 1px solid var(--line); padding-top: 8px; margin-bottom: 6px; }
.sidebar .userchip {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  width: 100%; height: auto; padding: 0; border: none; background: transparent;
}
.sidebar .userchip .sb-u-ic { color: var(--sub); line-height: 0; margin-bottom: 1px; }
.sidebar .userchip .sb-u-ic svg { width: 19px; height: 19px; }
.sidebar .userchip b {
  font-size: 11.5px; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; display: block;
}
.sidebar .userchip .sb-u-sub { display: flex; flex-direction: column; align-items: center; gap: 3px; margin-top: 2px; }
.sidebar .userchip .uadmin { font-size: 9.5px; padding: 0 4px; line-height: 15px; }
.sidebar .userchip button { font-size: 10.5px; padding: 1px 0; }
.sidebar .userchip button:hover { text-decoration: underline; }
.sb-ver { font-size: 10px; color: var(--muted); letter-spacing: .2px; }
.sb-ver .ver-beta {
  display: inline-block; margin-left: 2px; padding: 0 4px; border-radius: 4px;
  font-size: 9px; line-height: 14px; background: var(--t-orange-bg);
  border: 1px solid var(--t-orange-bd); color: var(--t-orange-fg);
}
/* 顶栏里内测版徽标（h1 / 欢迎页 h2 同一个） */
.ver.is-beta { background: var(--t-orange-bg); border-color: var(--t-orange-bd); color: var(--t-orange-fg) !important; }
.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.app-main > .page { flex: 1; }
/* 两页互斥显示：.page 自己没写 display，但保险起见给个 !important，
   否则哪天给 .page 加了 display:flex 会两个页面一起露出来 */
.app-main > .page[hidden] { display: none !important; }

/* ---------- 万相无界：工具栏 / 筛选条 ---------- */
.wx-page[hidden] { display: none; }
.wx-src { font-size: 11.5px; color: var(--muted); }
.wx-filters {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 8px 10px; margin-bottom: 10px; box-shadow: var(--shadow);
}
.wx-f-label { font-size: 11.5px; color: var(--muted); margin-right: 2px; }
.wx-chip {
  display: inline-flex; align-items: center; gap: 5px; max-width: 260px; height: 27px;
  padding: 0 10px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--panel); color: var(--sub); font-size: 12px; cursor: pointer;
  white-space: nowrap; overflow: hidden;
}
.wx-chip > span { overflow: hidden; text-overflow: ellipsis; }
.wx-chip:hover { border-color: #cfd6e2; color: var(--text); }
.wx-chip.on { background: var(--t-orange-bg); border-color: var(--t-orange-bd); color: var(--t-orange-fg); font-weight: 600; }
.wx-chip .wx-caret { font-size: 9px; opacity: .55; flex: none; }
.wx-chip .wx-x {
  flex: none; width: 14px; height: 14px; line-height: 13px; text-align: center;
  border-radius: 50%; font-size: 10px; font-style: normal; color: var(--muted);
}
.wx-chip .wx-x:hover { background: rgba(211,48,43,.12); color: var(--red); }

/* ---------- 两个 tab ---------- */
.wx-tabs { display: flex; gap: 6px; margin-bottom: 10px; }
.wx-tab {
  padding: 7px 16px; border: 1px solid var(--line); background: var(--panel);
  border-radius: 8px; font-size: 12.5px; color: var(--sub); cursor: pointer;
}
.wx-tab:hover { color: var(--text); border-color: #cfd6e2; }
.wx-tab.active { background: var(--t-orange-bg); border-color: var(--t-orange-bd); color: var(--t-orange-fg); font-weight: 600; }
.wx-view[hidden] { display: none; }
/* V2.4.3：模板按钮贴在 tab 行最右侧 */
.wx-tpl-btn {
  margin-left: auto; display: inline-flex; align-items: center; gap: 5px;
  padding: 0 12px; height: 31px; border: 1px dashed var(--t-orange-bd);
  background: var(--t-orange-bg); color: var(--t-orange-fg);
  border-radius: 8px; font-size: 12.5px; font-weight: 600; cursor: pointer;
}
.wx-tpl-btn:hover { border-style: solid; }
.wx-tpl-ic { font-size: 11px; line-height: 1; opacity: .85; }

/* ---------- 数据表 ---------- */
.wx-tablewrap {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: auto; max-height: calc(100vh - 258px); position: relative;
}
.wx-table { border-collapse: separate; border-spacing: 0; font-size: 12px; white-space: nowrap; }
.wx-table thead th {
  position: sticky; top: 0; z-index: 2; background: #f8fafc;
  border-bottom: 1px solid var(--line); padding: 7px 10px;
  font-size: 11.5px; font-weight: 600; color: var(--sub); text-align: left;
}
.wx-table tbody td { padding: 6px 10px; border-bottom: 1px solid var(--line-soft); color: var(--text); }
.wx-table tbody tr:hover td { background: var(--hover); }
.wx-table th.num, .wx-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.wx-table tfoot td {
  position: sticky; bottom: 0; z-index: 2; background: #f8fafc; border-top: 1px solid var(--line);
  padding: 7px 10px; font-weight: 600; color: var(--text);
}
.wx-table th:first-child, .wx-table td:first-child { position: sticky; left: 0; z-index: 1; background: var(--panel); }
.wx-table thead th:first-child { z-index: 3; background: #f8fafc; }
.wx-table tfoot td:first-child { z-index: 3; background: #f8fafc; }
.wx-table tbody tr:hover td:first-child { background: var(--hover); }
.wx-empty { padding: 40px 16px; text-align: center; color: var(--muted); font-size: 13px; }

/* ---------- V2.4.18：表头点击排序 / 主体ID·名称可点开详情 / 下滑选一列算合计平均 ---------- */
.wx-table thead th[data-wk] { cursor: pointer; user-select: none; }
.wx-table thead th.sorted { color: #2f6bff; background: #eaf1ff; box-shadow: inset 0 -2px 0 #2f6bff; }
/* 排序箭头走伪元素：表头文字保持纯列名（导出/测试比对/无障碍读屏都不受影响） */
.wx-table thead th.sorted[data-dir="desc"]::after { content: ' ▼'; color: #2f6bff; }
.wx-table thead th.sorted[data-dir="asc"]::after { content: ' ▲'; color: #2f6bff; }
.wx-table td.wx-link { color: #2f6bff; cursor: pointer; }
.wx-table td.wx-link:hover { background: #eaf1ff !important; text-decoration: underline; }
.wx-table tbody td.wx-selcol { background: #dbe7ff !important; color: #1d3f8f; font-weight: 600; }
body.wx-rseling, body.wx-rseling * { cursor: cell !important; user-select: none !important; }
#wxSelChip {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 150;
  display: flex; align-items: center; gap: 12px; padding: 9px 14px; border-radius: 999px;
  background: rgba(24,32,46,.94); color: #fff; font-size: 12.5px; box-shadow: 0 12px 30px -10px rgba(0,0,0,.45);
  white-space: nowrap;
}
#wxSelChip[hidden] { display: none; }
#wxSelChip b { color: #ffd166; font-weight: 700; }
#wxSelChip button {
  height: 24px; padding: 0 10px; border-radius: 999px; border: 0; cursor: pointer;
  background: #2f6bff; color: #fff; font-size: 12px;
}
#wxSelChip button:hover { background: #1f57dd; }
#wxSelChip .x { background: transparent; color: #b9c1cc; border: 1px solid rgba(255,255,255,.22); }
#wxSelChip .x:hover { background: rgba(255,255,255,.12); color: #fff; }


/* ---------- 数据趋势图 ---------- */
.wx-trend-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.wx-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.wx-mchip {
  display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 4px 0 9px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--panel);
  font-size: 12px; color: var(--text);
}
.wx-mchip i { width: 9px; height: 9px; border-radius: 2px; flex: none; }
.wx-mchip .wx-x {
  width: 15px; height: 15px; line-height: 14px; text-align: center; border-radius: 50%;
  font-size: 10px; font-style: normal; color: var(--muted); cursor: pointer;
}
.wx-mchip .wx-x:hover { background: rgba(211,48,43,.12); color: var(--red); }
.wx-chart {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 10px 12px 8px; margin-bottom: 10px;
}
.wx-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.wx-chart-head h5 { margin: 0; font-size: 12.5px; font-weight: 600; color: var(--text); }
.wx-chart-head .wx-unit { font-size: 11px; color: var(--muted); font-weight: 400; margin-left: 6px; }
.wx-cnt { font-size: 11px; color: var(--muted); font-weight: 400; }
.wx-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 11.5px; color: var(--sub); }
.wx-legend span { cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.wx-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; }
.wx-legend span.off { opacity: .35; text-decoration: line-through; }
.wx-color {
  width: 26px; height: 20px; padding: 0; border: 1px solid var(--line); border-radius: 5px;
  background: var(--panel); cursor: pointer;
}
.wx-hint { font-size: 12px; color: var(--muted); padding: 26px 12px; text-align: center; }

/* ---------- V2.4.3：组合图（柱 + 折线双轴） ---------- */
.wx-chart.wx-combo { padding-bottom: 10px; }
.wx-combo-keys { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px; font-size: 11.5px; color: var(--sub); }
.wx-combo-keys span { display: inline-flex; align-items: center; gap: 4px; }
.wx-combo-keys i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; }
.wx-combo-keys i.bar { border-radius: 2px; }
.wx-combo-keys i.line { height: 3px; border-radius: 2px; }

/* ---------- V2.4.3：占比饼图（玫瑰图 + 排行榜） ---------- */
.wx-pie-wrap { display: flex; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.wx-pie-svg { flex: 0 0 auto; }
.wx-pie-list { flex: 1 1 320px; min-width: 280px; display: flex; flex-direction: column; gap: 1px; padding-top: 4px; }
.wx-pie-row {
  display: grid; grid-template-columns: 9px minmax(0, 1fr) auto 56px; align-items: center;
  gap: 8px; font-size: 12px; padding: 5px 6px; border-radius: 6px;
}
.wx-pie-row:hover { background: var(--hover); }
.wx-pie-row i { width: 9px; height: 9px; border-radius: 2px; }
.wx-pie-row .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.wx-pie-row .vv { font-variant-numeric: tabular-nums; color: var(--text); font-weight: 600; }
.wx-pie-row .pp { font-variant-numeric: tabular-nums; color: var(--muted); text-align: right; }
.wx-pie-sum {
  display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--muted);
  border-top: 1px solid var(--line-soft); margin-top: 6px; padding: 7px 6px 0;
}
.wx-pie-svg text.wx-pie-lb { paint-order: stroke; stroke: rgba(0,0,0,.18); stroke-width: 2px; }

/* ---------- V2.4.3：模板浮层 ---------- */
.wx-tpl {
  position: fixed; z-index: 340; width: 306px; max-height: 430px; overflow: auto;
  background: var(--panel); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 12px 34px -14px rgba(20, 26, 38, .35); padding: 8px;
  display: flex; flex-direction: column; gap: 7px;
}
.wx-tpl[hidden] { display: none; }
.wx-tpl-head { font-size: 11.5px; color: var(--muted); padding: 0 3px; }
.wx-tpl-save { display: flex; gap: 6px; }
.wx-tpl-save input {
  flex: 1; min-width: 0; height: 28px; padding: 0 8px; border: 1px solid var(--line);
  border-radius: 6px; font-size: 12px; outline: none; color: var(--text); background: var(--panel);
}
.wx-tpl-save input:focus { border-color: #e8734a; }
.wx-tpl-list { display: flex; flex-direction: column; gap: 1px; }
.wx-tpl-item { display: flex; align-items: center; gap: 6px; padding: 5px 6px; border-radius: 6px; font-size: 12px; }
.wx-tpl-item:hover { background: var(--hover); }
.wx-tpl-item b {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: 600; color: var(--text); cursor: pointer;
}
.wx-tpl-item .ts { font-size: 10.5px; color: var(--muted); flex: none; }
.wx-tpl-item .act {
  flex: none; border: none; background: none; color: var(--muted); cursor: pointer;
  font-size: 12px; line-height: 1; padding: 3px 4px; border-radius: 4px;
}
.wx-tpl-item .act:hover { background: rgba(211, 48, 43, .12); color: var(--red); }
.wx-tpl-empty { font-size: 11.5px; color: var(--muted); padding: 6px; line-height: 1.65; }

/* ================= V2.4.4：AI 分析 ================= */
.wx-ai-pick {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 11px 14px; margin-bottom: 10px;
}
.wx-ai-sel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.wx-ai-lb { font-size: 12.5px; font-weight: 700; color: var(--text); }
.wx-ai-sel select {
  height: 32px; min-width: 136px; max-width: 250px; padding: 0 28px 0 10px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel);
  font-size: 12.5px; color: var(--text); outline: none; cursor: pointer;
}
.wx-ai-sel select:focus { border-color: #e8734a; }
.wx-ai-acts { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.wx-ai-run {
  display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 18px;
  border: none; border-radius: 9px; cursor: pointer; font-size: 13px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #f08a5d 0%, #e8734a 55%, #d9633c 100%);
  box-shadow: 0 6px 16px -8px rgba(232, 115, 74, .9);
}
.wx-ai-run:hover { filter: brightness(1.04); }
/* 禁用态（正在分析）：只降饱和、别加 opacity —— 半透明白字压在浅底上会糊成一片看不清 */
.wx-ai-run:disabled {
  cursor: not-allowed; box-shadow: none;
  background: linear-gradient(135deg, #d09a80 0%, #c08466 55%, #b0755a 100%);
  color: #fff;
}
/* 「正在分析 某某计划…」这类长文案不把按钮撑破 */
.wx-ai-run { max-width: 330px; }
.wx-ai-run > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wx-ai-spark { font-size: 12px; opacity: .95; flex: none; }
/* V2.4.4：按钮的忙碌态用 is-busy，不要用 .busy（那是全屏加载遮罩的类名，会把按钮拉成整屏） */
.wx-ai-run.is-busy .wx-ai-spark { animation: wxAiPulse 1.1s ease-in-out infinite; }
@keyframes wxAiPulse { 0%, 100% { transform: scale(1); opacity: .65 } 50% { transform: scale(1.3); opacity: 1 } }
.wx-ai-stop {
  height: 34px; padding: 0 14px; border-radius: 9px; font-size: 12.5px; font-weight: 600;
  border: 1px solid var(--line); background: var(--panel); color: var(--muted);
  cursor: not-allowed; opacity: .8;
}
.wx-ai-stop.is-on {
  border-color: var(--t-red-bd); background: var(--t-red-bg); color: var(--t-red-fg);
  cursor: pointer; opacity: 1;
}
.wx-ai-stop.is-on:hover { filter: brightness(.97); }
.wx-ai-hint { flex: 1 1 100%; font-size: 11.5px; color: var(--muted); }
.wx-ai-hint b { color: var(--sub); }

.wx-ai-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 10px 14px 12px; margin-bottom: 10px;
}
.wx-ai-hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.wx-ai-hd h4 { margin: 0; font-size: 13px; font-weight: 700; color: var(--text); }
.wx-ai-hd-r { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.wx-ai-when { font-size: 11px; color: var(--muted); margin-left: auto; }
.wx-ai-hd-r + .wx-ai-when, .wx-ai-hd-r ~ .wx-ai-when { margin-left: 0; }

.wx-ai-cols { display: flex; flex-wrap: wrap; gap: 5px; margin: 9px 0 4px; }
.wx-ai-tablewrap { overflow-x: auto; }
/* V2.4.4：固定布局 —— 第一列给 30%，剩下 4 个周期列自动均分，否则指标名会把数值列挤到最右边 */
.wx-ai-table { width: 100%; border-collapse: collapse; font-size: 12px; table-layout: fixed; }
.wx-ai-table th:first-child, .wx-ai-table td:first-child {
  width: 30%; overflow: hidden; text-overflow: ellipsis;
}
.wx-ai-table th, .wx-ai-table td {
  padding: 7px 10px; border-bottom: 1px solid var(--line-soft); text-align: right;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.wx-ai-table th:first-child, .wx-ai-table td:first-child { text-align: left; }
.wx-ai-table thead th { background: #f8fafc; color: var(--sub); font-weight: 600; font-size: 11.5px; }
.wx-ai-table thead th.on { background: var(--t-orange-bg); color: var(--t-orange-fg); }
.wx-ai-table td.on { background: rgba(232, 115, 74, .05); font-weight: 600; color: var(--text); }
.wx-ai-table tbody tr:hover td { background: var(--hover); }
.wx-ai-table td.k { color: var(--text); font-weight: 600; }
.wx-ai-table td.nums { color: var(--muted); font-size: 11px; }

.wx-ai-out { margin-top: 9px; }
.wx-ai-empty { font-size: 12px; color: var(--muted); line-height: 1.8; padding: 18px 0; text-align: center; }
.wx-ai-empty b { color: var(--sub); }
.wx-ai-block {
  border-left: 3px solid #e8734a; border-radius: 0 8px 8px 0; padding: 8px 12px; margin-bottom: 8px;
  background: linear-gradient(90deg, rgba(232, 115, 74, .055), rgba(232, 115, 74, 0) 62%);
}
.wx-ai-block.k1 { border-left-color: #4a7ae8; background: linear-gradient(90deg, rgba(74, 122, 232, .055), rgba(74, 122, 232, 0) 62%); }
.wx-ai-block.k2 { border-left-color: #3fae7a; background: linear-gradient(90deg, rgba(63, 174, 122, .055), rgba(63, 174, 122, 0) 62%); }
.wx-ai-block.k3 { border-left-color: #c8a02c; background: linear-gradient(90deg, rgba(200, 160, 44, .07), rgba(200, 160, 44, 0) 62%); }
.wx-ai-block h6 {
  margin: 0 0 4px; font-size: 12.5px; font-weight: 700; color: var(--text);
  display: flex; align-items: center; gap: 6px;
}
.wx-ai-block h6 i { font-style: normal; font-size: 11px; opacity: .45; }
.wx-ai-block .bd { font-size: 12.5px; line-height: 1.85; color: var(--text); white-space: pre-wrap; }
.wx-ai-typing::after {
  content: '▍'; color: #e8734a; margin-left: 1px;
  animation: wxBlink .9s step-end infinite;
}
@keyframes wxBlink { 50% { opacity: 0 } }

.wx-ai-his { margin-top: 9px; display: flex; flex-direction: column; gap: 1px; }
.wx-ai-his-row {
  display: flex; align-items: center; gap: 9px; padding: 7px 8px; border-radius: 7px;
  cursor: pointer; font-size: 12px;
}
.wx-ai-his-row:hover { background: var(--hover); }
.wx-ai-his-row .tm { flex: none; width: 72px; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.wx-ai-his-row .dm {
  flex: none; font-size: 10.5px; color: var(--muted);
  border: 1px solid var(--line); border-radius: 999px; padding: 0 6px; line-height: 16px;
}
.wx-ai-his-row .ob {
  flex: none; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--text); font-weight: 600;
}
.wx-ai-his-row .sm {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--sub);
}
.wx-ai-his-row .go { flex: none; font-size: 11px; color: var(--t-orange-fg); font-weight: 600; }

/* ---------- 浮层：维度多选 / 指标勾选 ---------- */
.wx-pop {
  position: fixed; z-index: 320; background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; box-shadow: 0 12px 34px -14px rgba(20,26,38,.35);
  padding: 8px; width: 240px; max-height: 320px; display: flex; flex-direction: column; gap: 6px;
}
.wx-pop[hidden] { display: none; }
.wx-pop-search {
  width: 100%; height: 28px; padding: 0 8px; border: 1px solid var(--line);
  border-radius: 6px; font-size: 12px; outline: none;
}
.wx-pop-search:focus { border-color: #e8734a; }
.wx-pop-list { overflow: auto; max-height: 220px; display: flex; flex-direction: column; gap: 1px; }
.wx-pop-item {
  display: flex; align-items: center; gap: 7px; padding: 4px 6px; border-radius: 5px;
  font-size: 12px; color: var(--text); cursor: pointer;
}
.wx-pop-item:hover { background: var(--hover); }
.wx-pop-item input { margin: 0; }
.wx-pop-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wx-pop-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid var(--line-soft); padding-top: 6px; }
.wx-pop-foot .mini-btn { height: 24px; }

/* ============================================================ V2.4.1
   ① 万相无界表格上方的「＋ 字段」条（列自己勾）
   ② 筛选胶囊末尾的「＋ 筛选」（胶囊自己勾）
   ③ 自定义时间段日期卡（产品页 / 万相无界共用）
   ============================================================ */
.wx-colcnt { font-size: 11.5px; color: var(--muted); }
.wx-colcnt b { color: var(--text); font-weight: 600; }
/* 「＋ 筛选」不是真胶囊，用虚线描边区分「添加」和「已打开的筛选」 */
.wx-chip-add {
  background: transparent; border-style: dashed; color: var(--sub);
  padding-right: 9px;
}
.wx-chip-add:hover { color: var(--t-orange-fg); border-color: var(--t-orange-bd); background: var(--t-orange-bg); }
.wx-chip-add .wx-plus { font-weight: 600; margin-right: 2px; }

.range-pop { width: 292px; padding: 12px; }
.range-pop h4 { margin: 0 0 10px; font-size: 12.5px; color: var(--sub); font-weight: 600; }
.range-pop[hidden] { display: none; }
.rp-row { display: flex; flex-direction: column; gap: 8px; }
.rp-row label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; color: var(--sub); }
.rp-row input[type="date"] {
  height: 30px; padding: 0 8px; border: 1px solid var(--line); border-radius: 7px;
  background: var(--cell); color: var(--text); font-size: 12px; outline: none;
  font-family: inherit;
}
.rp-row input[type="date"]:focus { border-color: var(--t-orange-bd); }
.rp-tip { min-height: 16px; margin-top: 7px; font-size: 11px; color: var(--muted); }
.rp-tip.warn { color: var(--red); }
.rp-quick { display: flex; gap: 6px; margin-top: 8px; }
.rp-foot {
  display: flex; align-items: center; justify-content: flex-end; gap: 6px;
  margin-top: 8px; padding-top: 9px; border-top: 1px solid var(--line-soft);
}
.rp-quick .mini-btn, .rp-foot .mini-btn { height: 27px; padding: 0 11px; flex: 0 0 auto; }
.rp-foot .mini-btn.primary { min-width: 62px; }

/* ============================================================ V2.4.1（续）
   ① 趋势图计划改成勾选式浮层后：工具栏上的「计划 N/M」提示
   ② 浮层里带颜色选择的行（勾选框 + 名字 + 色块）
   ③ 折线悬停的详细数据浮层（日期 + 各计划数值）
   ============================================================ */
.wx-planinfo { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.wx-planinfo b { color: var(--text); font-weight: 600; }
.wx-pop-item-c { gap: 6px; }
.wx-pop-lbl {
  flex: 1 1 auto; min-width: 0; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.wx-pop-color {
  flex: 0 0 auto; width: 20px; height: 18px; padding: 0; border: 1px solid var(--line);
  border-radius: 4px; background: none; cursor: pointer;
}
.wx-pop-color::-webkit-color-swatch-wrapper { padding: 1px; }
.wx-pop-color::-webkit-color-swatch { border: none; border-radius: 3px; }

/* V2.4.2：字段浮层里按住抓手上下拖，就能调这一列在表格里的位置 */
.wx-pop-sort { cursor: default; }
.wx-grip {
  flex: 0 0 auto; cursor: grab; color: #b9c0ca; font-size: 11px; line-height: 1;
  letter-spacing: -2px; user-select: none; padding: 0 1px;
}
.wx-grip:active { cursor: grabbing; }
.wx-pop-item.dnd { opacity: .45; }
.wx-pop-item.drop-before { box-shadow: inset 0 2px 0 #5b8def; }
.wx-pop-item.drop-after { box-shadow: inset 0 -2px 0 #5b8def; }
/* 表头拖动：按住可拖，拖到目标列左右半边决定插在它前面还是后面 */
.wx-table thead th[draggable="true"] { cursor: grab; }
.wx-table thead th.dragging { opacity: .45; cursor: grabbing; }
.wx-table thead th.drop-before { box-shadow: inset 2px 0 0 #5b8def; }
.wx-table thead th.drop-after { box-shadow: inset -2px 0 0 #5b8def; }

.wx-tip {
  position: fixed; z-index: 340; pointer-events: none;
  min-width: 150px; max-width: 252px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 9px;
  box-shadow: 0 12px 30px -12px rgba(20,26,38,.4);
  padding: 8px 10px; font-size: 11.5px; color: var(--text);
}
.wx-tip[hidden] { display: none; }
.wx-tip-date { font-weight: 600; font-size: 11px; color: var(--sub); margin-bottom: 5px; letter-spacing: .3px; }
.wx-tip-row { display: flex; align-items: center; gap: 6px; line-height: 1.75; border-radius: 4px; padding: 0 2px; }
.wx-tip-row i { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.wx-tip-row .wx-tip-n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 132px; color: var(--sub); }
.wx-tip-row b { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 600; }
.wx-tip-row.on { background: var(--hover); }
.wx-tip-row.on .wx-tip-n { color: var(--text); font-weight: 600; }
.wx-tip-more { margin-top: 3px; font-size: 10.5px; color: var(--muted); }

/* ===== V2.4.13 运营经理系统：规则配置弹窗 ===== */
.om-row { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid var(--line, #e3e8f0); border-radius: 8px; margin-bottom: 8px; background: var(--panel2, #fff); }
.om-ix { width: 18px; text-align: center; font-size: 12px; color: #9aa3af; flex: none; }
.om-side { flex: 1; min-width: 0; padding: 6px 8px; border: 1px solid #d8dee8; border-radius: 6px; font-size: 13px; outline: none; background: #fff; }
.om-side:focus { border-color: #e8734a; }
.om-sep { width: 86px; flex: none; padding: 6px 9px; border: 1px solid #d8dee8; border-radius: 6px; font-size: 14px; text-align: center; outline: none; }
.om-sep:focus { border-color: #e8734a; }
.om-del { flex: none; color: #c0392b; }

/* ================= V1.0.0 移动端（用户 2026-10-26 定死：同一套代码、设备分流） =================
   桌面端 .app-shell 与 #mApp 互斥显示；配色全部沿用上面的 CSS 变量，主题（含暗色）自动跟随。 */
#mApp { display: none; }
html.m-mode { overscroll-behavior: none; }
html.m-mode .app-shell { display: none !important; }
html.m-mode #mApp {
  display: flex; flex-direction: column;
  position: fixed; inset: 0; z-index: 10;
  background: var(--bg); color: var(--text);
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
/* 顶栏：品牌 + 版本 + 数据截至日期 */
.m-top {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 16px 10px; background: var(--panel); border-bottom: 1px solid var(--line);
}
.m-brand { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.m-name { font-size: 17px; font-weight: 700; letter-spacing: .5px; }
.m-ver {
  font-size: 11px; font-weight: 600; color: var(--red); background: color-mix(in srgb, var(--red) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--red) 28%, transparent); border-radius: 999px; padding: 1px 8px;
  font-variant-numeric: tabular-nums;
}
.m-sub { font-size: 11.5px; color: var(--sub); white-space: nowrap; }
.m-sub b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
/* 主体：四个页面对应底部四个 tab，一次只显示一个 */
.m-body { flex: 1; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; }
.m-page { display: none; padding: 14px 14px 20px; }
.m-page.m-on { display: block; }
/* 占位卡（M2/M3/M6 各自替换成真内容） */
.m-ph {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 26px 18px; text-align: center;
}
.m-ph-ic { font-size: 30px; line-height: 1; color: var(--muted); }
.m-ph-t { margin-top: 10px; font-size: 15px; font-weight: 650; }
.m-ph-d { margin-top: 6px; font-size: 12px; color: var(--sub); line-height: 1.7; }
.m-ph-n {
  display: inline-block; margin-top: 12px; font-size: 11px; color: var(--blue);
  background: color-mix(in srgb, var(--blue) 10%, transparent); border-radius: 999px; padding: 2px 10px;
}
/* 底部四 tab（固定，safe-area 适配） */
.m-tabs {
  flex: none; display: grid; grid-template-columns: repeat(4, 1fr);
  background: var(--panel); border-top: 1px solid var(--line);
  padding-bottom: env(safe-area-inset-bottom);
}
.m-tab {
  appearance: none; border: 0; background: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 7px 0 8px; color: var(--muted); font-size: 11px; -webkit-tap-highlight-color: transparent;
}
.m-tab i { font-style: normal; font-size: 19px; line-height: 1; }
.m-tab.m-on { color: var(--red); font-weight: 600; }
.m-tab:active { background: var(--hover); }
/* 移动端下桌面端那些绝对定位浮层（版本提示条等）不该挡路 */
html.m-mode #verBanner { display: none !important; }

/* V1.0.0 M2 看板首页（只渲染样式；数字全部来自 app.js 桥接，口径与 PC 端一致） */
/* 周期分段（近 7 天 / 近 30 天 / 全部） */
.m-seg {
  display: flex; gap: 6px; margin: 12px 0 12px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 3px; box-shadow: var(--shadow);
}
.m-seg-b {
  flex: 1; appearance: none; border: 0; background: none; cursor: pointer;
  padding: 7px 0; font-size: 13px; color: var(--sub); border-radius: calc(var(--radius) - 2px);
  -webkit-tap-highlight-color: transparent;
}
.m-seg-b.m-on { background: var(--red); color: #fff; font-weight: 600; }
/* KPI 2×2：涨红跌绿（A 股惯例，与桌面端汇总条一致） */
.m-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.m-kpi {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 12px 12px 10px; min-width: 0;
}
.m-kpi-l { font-size: 12px; color: var(--sub); }
/* V1.0.9：指标卡可点开趋势——右上角一个淡箭头，点整张卡都行 */
.m-kpi { position: relative; cursor: pointer; }
.m-kpi:active { transform: scale(.994); }
.m-kpi-spark {
  position: absolute; right: 9px; top: 8px;
  font-size: 11px; font-weight: 700; color: var(--accent); opacity: .5;
  width: 16px; height: 16px; line-height: 16px; text-align: center; border-radius: 5px;
}
.m-kpi:active .m-kpi-spark { opacity: 1; }
/* 指标趋势抽屉 */
.m-kt-hd { padding: 2px 2px 10px; }
.m-kt-l { font-size: 12.5px; color: var(--sub); }
.m-kt-v { margin-top: 3px; font-size: 26px; font-weight: 750; letter-spacing: .2px; font-variant-numeric: tabular-nums; }
.m-kt-s { margin-top: 2px; font-size: 11.5px; color: var(--muted); }
.m-kt-span { margin-top: 6px; font-size: 11px; color: var(--sub); background: var(--hover); border-radius: 7px; padding: 5px 8px; display: inline-block; }
.m-kt-mm { display: flex; gap: 14px; margin: 6px 2px 2px; font-size: 11.5px; color: var(--sub); }
.m-kt-mm b { color: var(--text); font-weight: 700; }
.m-kt-chart { margin: 4px -2px 6px; }
.m-kt-list { max-height: 30vh; overflow: auto; border-top: 1px solid var(--line-soft); }
.m-kt-row { display: flex; align-items: center; justify-content: space-between; padding: 7px 2px; border-bottom: 1px solid var(--line-soft); font-size: 12px; }
.m-kt-row span { color: var(--sub); font-variant-numeric: tabular-nums; }
.m-kt-row b { font-weight: 700; font-variant-numeric: tabular-nums; }
.m-kt-row b.up { color: var(--red); }
.m-kt-row b.down { color: var(--green); }
.m-kpi-v {
  margin-top: 4px; font-size: 20px; font-weight: 700; letter-spacing: .2px;
  font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.m-kpi-v.up { color: var(--red); }
.m-kpi-v.down { color: var(--green); }
.m-kpi-s { margin-top: 3px; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.m-kpi-why {
  grid-column: 1 / -1; font-size: 11px; line-height: 1.6; color: #BA7517;
  background: color-mix(in srgb, #BA7517 8%, transparent);
  border: 1px solid color-mix(in srgb, #BA7517 24%, transparent);
  border-radius: var(--radius); padding: 7px 10px;
}
body[data-theme="dark"] .m-kpi-why { color: #EF9F27; border-color: color-mix(in srgb, #EF9F27 30%, transparent); }
/* 卡片（趋势 / 退货率 / TOP） */
.m-card {
  margin-top: 12px; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 12px 12px 14px;
}
.m-card-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: 14px; font-weight: 650; }
.m-card-sub { font-size: 11px; font-weight: 400; color: var(--muted); }
/* 趋势：每天一根条，负值朝下；红正绿负 */
.m-trend { display: flex; align-items: flex-end; gap: 4px; margin-top: 14px; overflow-x: auto; }
.m-tbar { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.m-tbar-v { font-size: 9.5px; color: var(--sub); font-variant-numeric: tabular-nums; white-space: nowrap; }
.m-tbar-b { width: 100%; max-width: 22px; border-radius: 3px 3px 0 0; }
.m-tbar-b.up { background: var(--red); }
.m-tbar-b.down { background: var(--green); border-radius: 0 0 3px 3px; }
.m-tbar-d { font-size: 10px; color: var(--muted); font-variant-numeric: tabular-nums; }
/* 退货率带：大数字 + 分子/分母 */
.m-rate { margin-top: 10px; text-align: center; }
.m-rate-v { font-size: 30px; font-weight: 750; font-variant-numeric: tabular-nums; }
.m-rate-v.warn { color: var(--red); }
.m-rate-d { margin-top: 4px; font-size: 11.5px; color: var(--sub); font-variant-numeric: tabular-nums; }
/* TOP 5 款式 */
.m-toplist { margin-top: 8px; }
.m-toprow {
  display: flex; align-items: center; gap: 9px; padding: 9px 2px;
  border-bottom: 1px solid var(--line); font-variant-numeric: tabular-nums;
}
.m-toprow:last-child { border-bottom: 0; }
.m-topno {
  flex: none; width: 19px; height: 19px; border-radius: 6px; background: var(--hover);
  color: var(--sub); font-size: 11px; font-weight: 700; text-align: center; line-height: 19px;
}
.m-topcode { flex: 1; min-width: 0; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-toppf { flex: none; font-size: 13px; font-weight: 700; }
.m-toppf.up { color: var(--red); }
.m-toppf.down { color: var(--green); }
.m-toppf .m-nc {
  font-style: normal; font-size: 10px; color: #BA7517; margin-left: 5px;
  border: 1px solid color-mix(in srgb, #BA7517 35%, transparent); border-radius: 999px; padding: 0 6px;
}
body[data-theme="dark"] .m-toppf .m-nc { color: #EF9F27; }
/* V1.0.0 M4 本机导入：导入条 + 空态按钮（点击只负责唤起文件选择器，解析全在 app.js 桥接里） */
.m-impbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; }
.m-impbar-n { min-width: 0; font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-imp {
  flex: none; appearance: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
  display: inline-flex; align-items: center; gap: 3px;
  border: 1px solid color-mix(in srgb, var(--red) 45%, transparent); color: var(--red);
  background: color-mix(in srgb, var(--red) 8%, transparent);
  border-radius: 999px; padding: 7px 13px; font-size: 12.5px; font-weight: 600;
}
.m-imp b { font-weight: 700; font-size: 14px; line-height: 1; }
.m-imp:active { background: color-mix(in srgb, var(--red) 16%, transparent); }
.m-ph-btn {
  margin-top: 14px; appearance: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
  border: 0; background: var(--red); color: #fff; border-radius: 999px;
  padding: 9px 18px; font-size: 13px; font-weight: 600;
}
.m-ph-btn:active { filter: brightness(.94); }
/* 手机端 toast 抬到 tab 栏上方，别被挡住 */
html.m-mode .toast { bottom: calc(74px + env(safe-area-inset-bottom)); z-index: 260; max-width: 86vw; }
/* 文件输入不隐藏（display:none 在部分手机/内嵌浏览器里点击无反应），改成离屏 1px */
.m-filein { position: fixed; left: -9999px; top: 0; width: 1px; height: 1px; opacity: 0; }

/* ================= V1.0.1 移动端：款式 / 万相 / 我的 ================= */
/* 四段周期按钮在窄屏上也放得下（近 1 天 / 7 天 / 30 天 / 全部） */
.m-seg { gap: 4px; }
.m-seg-b { padding: 7px 2px; font-size: 12.5px; }
.m-seg-sm { margin-top: -4px; }
/* 搜索框 */
.m-search {
  display: flex; align-items: center; gap: 7px; margin-top: 12px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 0 12px;
}
.m-search-ic { font-size: 16px; color: var(--muted); line-height: 1; }
.m-search input {
  flex: 1; min-width: 0; appearance: none; border: 0; background: none; outline: none;
  padding: 10px 0; font-size: 13.5px; color: var(--text); font-family: inherit;
}
.m-search input::placeholder { color: var(--muted); }
/* 列表头：共 N 款 + 缺成本提示 */
.m-listhead {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  margin: 2px 2px 8px; font-size: 11.5px; color: var(--sub); font-variant-numeric: tabular-nums;
}
.m-listtip { color: #BA7517; font-size: 11px; }
body[data-theme="dark"] .m-listtip { color: #EF9F27; }
/* 款式卡片 */
.m-cards { display: block; }
.m-item {
  display: flex; align-items: center; gap: 10px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 10px; margin-bottom: 8px;
  -webkit-tap-highlight-color: transparent; cursor: pointer;
}
.m-item:active { background: var(--hover); }
.m-item.m-open { border-color: color-mix(in srgb, var(--red) 40%, var(--line)); border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin-bottom: 0; }
.m-item-img {
  flex: none; width: 54px; height: 54px; border-radius: 8px; overflow: hidden;
  background: var(--hover); display: flex; align-items: center; justify-content: center;
}
.m-item-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.m-item-holder { font-size: 20px; color: var(--muted); }
.m-item-main { flex: 1; min-width: 0; }
.m-item-t {
  font-size: 13px; font-weight: 600; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.m-item-m {
  margin-top: 3px; font-size: 10.5px; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.m-item-n { margin-top: 4px; display: flex; gap: 10px; flex-wrap: wrap; font-size: 10.5px; color: var(--sub); }
.m-item-n b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
/* V1.0.3：纯利润单独一行（常驻，跟电脑端同一个利润列）——点它按利润排序 */
.m-item-pf {
  margin-top: 6px; display: flex; align-items: baseline; gap: 6px;
  padding: 4px 8px; border-radius: 7px; cursor: pointer;
  background: color-mix(in srgb, var(--red) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--red) 18%, var(--line));
  font-variant-numeric: tabular-nums;
  transition: background .15s;
}
.m-item-pf:active { background: color-mix(in srgb, var(--red) 14%, transparent); }
.m-item-pf .m-pf-l { font-size: 10px; color: var(--sub); flex: none; }
.m-item-pf b { font-size: 12.5px; font-weight: 700; color: var(--text); }
.m-item-pf b.up { color: var(--red); }
.m-item-pf b.down { color: var(--green); }
.m-item-pf b.m-pf-na { font-size: 10.5px; font-weight: 600; color: var(--muted); }
/* V2.4.53：主图新/基础资料带来的零数据款标记（手机端款式卡片标题旁） */
.m-zero { display: inline-block; margin-left: 6px; padding: 1px 6px; font-size: 10px; font-weight: 500; color: var(--muted, #8b97b5); border: 1px dashed var(--muted, #9aa7c0); border-radius: 4px; vertical-align: 2px; }
.m-item-pf .m-pf-s { margin-left: auto; font-size: 9.5px; color: var(--muted); flex: none; }
.m-item-p { flex: none; text-align: right; min-width: 66px; font-variant-numeric: tabular-nums; }
.m-item-p b { display: block; font-size: 13.5px; font-weight: 700; }
.m-item-p i { display: block; margin-top: 2px; font-style: normal; font-size: 10px; color: var(--muted); }
.m-item-p.up b { color: var(--red); }
.m-item-p.down b { color: var(--green); }
/* 展开的每日明细 */
.m-item-det {
  background: var(--panel); border: 1px solid color-mix(in srgb, var(--red) 40%, var(--line));
  border-top: 1px dashed var(--line); border-radius: 0 0 var(--radius) var(--radius);
  padding: 8px 10px 10px; margin: 0 0 8px; font-variant-numeric: tabular-nums;
}
.m-det-h { font-size: 11px; color: var(--sub); margin-bottom: 6px; }
.m-det-head, .m-detrow {
  display: grid; grid-template-columns: 56px 1fr 46px 1fr; gap: 4px;
  padding: 4px 0; font-size: 11.5px;
}
.m-det-head { color: var(--muted); font-size: 10.5px; border-bottom: 1px solid var(--line); }
.m-detrow { border-bottom: 1px solid var(--line); }
.m-detrow:last-child { border-bottom: 0; }
.m-detrow span:nth-child(2), .m-detrow span:nth-child(4) { text-align: right; }
.m-detrow span:nth-child(3) { text-align: right; color: var(--sub); }
.m-detrow .up { color: var(--red); }
.m-detrow .down { color: var(--green); }
.m-det-empty { padding: 8px 0; font-size: 11.5px; color: var(--muted); text-align: center; }
/* 加载更多 */
.m-more {
  display: block; width: 100%; margin-top: 10px; appearance: none; cursor: pointer;
  border: 1px solid var(--line); background: var(--panel); color: var(--sub);
  border-radius: 999px; padding: 10px 0; font-size: 12.5px; font-family: inherit;
  -webkit-tap-highlight-color: transparent;
}
.m-more:active { background: var(--hover); }
/* 万相：花费柱（蓝）+ 柱下 ROI */
.m-tbar-b.cost { background: var(--blue); }
.m-tbar-r { font-size: 9px; color: var(--blue); font-variant-numeric: tabular-nums; }
.m-roi {
  font-style: normal; font-size: 9.5px; font-weight: 600; color: var(--sub);
  margin-left: 6px; white-space: nowrap;
}
/* 我的 */
.m-me-row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 12.5px;
}
.m-me-row:last-child { border-bottom: 0; }
.m-me-row span { color: var(--sub); flex: none; }
.m-me-row b {
  font-weight: 600; min-width: 0; text-align: right; font-variant-numeric: tabular-nums;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.m-me-row b.warn { color: #BA7517; }
body[data-theme="dark"] .m-me-row b.warn { color: #EF9F27; }
.m-me-sub { margin: 10px 0 6px; font-size: 11px; color: var(--muted); }
.m-ds-btn {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px; width: 100%;
  appearance: none; cursor: pointer; font-family: inherit;
  background: var(--hover); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 9px 10px; margin-bottom: 6px; color: var(--text); font-size: 12.5px; text-align: left;
  -webkit-tap-highlight-color: transparent;
}
.m-ds-btn span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-ds-btn i { flex: none; font-style: normal; font-size: 10.5px; color: var(--muted); }
.m-ds-btn:active { border-color: var(--red); }
.m-me-empty { padding: 10px 0 4px; font-size: 12.5px; color: var(--sub); text-align: center; }
.m-me-note { margin-top: 8px; font-size: 11.5px; line-height: 1.9; color: var(--sub); }
.m-me-warn { margin-top: 8px; font-size: 11px; line-height: 1.6; color: #BA7517; }
body[data-theme="dark"] .m-me-warn { color: #EF9F27; }
/* V2.4.40 / 手机端 V1.0.8：重复表格合并入口（同一张表换了文件名又导了一次） */
.m-dup {
  margin-top: 10px; padding: 10px 11px; border-radius: 10px;
  background: #fff7e6; border: 1px solid #f5d9a8;
}
.m-dup-h { font-size: 12.5px; font-weight: 700; color: #8a5a00; }
.m-dup-d { margin-top: 4px; font-size: 11px; line-height: 1.65; color: #8a5a00; opacity: .92; }
.m-dup-btn {
  margin-top: 8px; height: 32px; padding: 0 14px; border-radius: 8px; cursor: pointer;
  font-size: 12px; font-weight: 650; font-family: inherit;
  color: #fff; background: #d98b20; border: 0;
}
.m-dup-btn:active { filter: brightness(.94); }
body[data-theme="dark"] .m-dup { background: #2b2119; border-color: #4a3a22; }
body[data-theme="dark"] .m-dup-h, body[data-theme="dark"] .m-dup-d { color: #f0c98a; }
/* V1.0.8：手机端「有新版本」常驻提示条（贴顶、不遮底部 tab，点立即体验重载页面） */
#mApp .m-upd {
  position: fixed; left: 8px; right: 8px; z-index: 70;
  top: calc(8px + env(safe-area-inset-top, 0px));
  display: flex; align-items: center; gap: 9px;
  padding: 9px 10px; border-radius: 12px;
  background: #eaf6ee; border: 1px solid #a9d9ba; box-shadow: 0 6px 18px -8px rgba(20,40,30,.35);
  animation: mUpdIn .22s ease;
}
@keyframes mUpdIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
#mApp .m-upd-ic {
  flex: none; width: 20px; height: 20px; border-radius: 50%; background: #2f9e63; color: #fff;
  font-size: 12px; font-weight: 700; text-align: center; line-height: 20px;
}
#mApp .m-upd-t { flex: 1; min-width: 0; font-size: 12px; line-height: 1.5; color: #1f6b45; }
#mApp .m-upd-t b { font-weight: 700; }
#mApp .m-upd-t i { display: block; font-style: normal; font-size: 10.5px; opacity: .85; }
#mApp .m-upd-go {
  flex: none; height: 30px; padding: 0 12px; border: 0; border-radius: 8px; cursor: pointer;
  font-family: inherit; font-size: 12px; font-weight: 700; color: #fff; background: #2f9e63;
}
#mApp .m-upd-go:active { filter: brightness(.94); }
#mApp .m-upd-x {
  flex: none; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 6px; cursor: pointer;
  font-family: inherit; font-size: 12px; color: #4c7a5f; background: transparent;
}
#mApp[data-skin="ruby"] .m-upd { background: #2b2119; border-color: #4a3a22; box-shadow: 0 6px 18px -8px rgba(0,0,0,.6); }
#mApp[data-skin="ruby"] .m-upd-t { color: #f0c98a; }
#mApp[data-skin="midnight"] .m-upd,
#mApp[data-skin="neon"] .m-upd { background: #16161d; border-color: #2b4a38; }
#mApp[data-skin="midnight"] .m-upd-t,
#mApp[data-skin="neon"] .m-upd-t { color: #9ee0b8; }
/* 看板「较昨日」涨跌色（国内红涨绿跌，与桌面端一致） */
.m-kpi-s i { font-style: normal; font-weight: 650; }
.m-kpi-s i.up { color: var(--red); }
.m-kpi-s i.down { color: var(--green); }
/* 空态嵌在页面里时不要撑满整屏 */
.m-ph-inline { padding: 22px 16px; }
/* 看板导入条左侧表名：点一下去「我的」切换表格 */
.m-impbar-n[data-goto] { cursor: pointer; }
.m-impbar-n[data-goto]::after { content: " ⇄"; color: var(--red); font-size: 11px; }

/* ================= V1.0.2 移动端：全字段 + 抽屉 + 折线图 ================= */
/* 工具条（指标 / 趋势 / 排序 / 筛选） */
.m-tools { display: flex; gap: 7px; margin-top: 10px; }
.m-tool {
  flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 4px;
  appearance: none; cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--panel); color: var(--text);
  border-radius: 10px; padding: 8px 5px; font-size: 12px;
  -webkit-tap-highlight-color: transparent; box-shadow: var(--shadow);
}
.m-tool:active { background: var(--hover); }
.m-tool i {
  font-style: normal; font-weight: 700; font-size: 11.5px; color: var(--red);
  max-width: 56px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* 时间分段第 5 个「区间」 */
.m-seg-b.m-seg-date { font-size: 11.5px; letter-spacing: 0; }
/* 图表 */
.m-chart { margin: 2px -2px 0; color: var(--text); }
.m-cwrap { position: relative; }
.m-chart svg { display: block; width: 100%; height: auto; }
.m-chart-empty { padding: 20px 0; text-align: center; font-size: 12px; color: var(--muted); }
.m-clgs { display: flex; gap: 5px 12px; flex-wrap: wrap; margin-top: 8px; }
.m-clg { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--sub); max-width: 100%; }
.m-clg i { width: 9px; height: 9px; border-radius: 2px; flex: none; }
.m-clg-t { max-width: 86px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-clg b { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.m-ctip {
  position: absolute; z-index: 5; min-width: 118px; max-width: 70%;
  background: var(--panel); border: 1px solid var(--line); border-radius: 8px;
  padding: 6px 8px; box-shadow: var(--shadow); font-size: 11px; pointer-events: none;
}
.m-ct-d { font-size: 10.5px; color: var(--muted); margin-bottom: 3px; }
.m-ct-r { display: flex; align-items: center; gap: 5px; padding: 1px 0; }
.m-ct-r i { width: 7px; height: 7px; border-radius: 2px; flex: none; }
.m-ct-r span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-ct-r b { font-variant-numeric: tabular-nums; }
/* 款式卡片里的临时字段 */
.m-item-more { color: var(--muted); font-size: 10px; }
/* 明细表：列数跟着勾选字段变（日期 + N 个字段） */
.m-det-head.m-det-c2, .m-detrow.m-det-c2 { grid-template-columns: 54px 1fr 1fr; }
.m-det-head.m-det-c3, .m-detrow.m-det-c3 { grid-template-columns: 46px 1fr 1fr 1fr; font-size: 11px; }
.m-det-head.m-det-c4, .m-detrow.m-det-c4 { grid-template-columns: 42px 1fr 1fr 1fr 1fr; font-size: 10.5px; }
.m-det-head.m-det-c5, .m-detrow.m-det-c5 { grid-template-columns: 38px 1fr 1fr 1fr 1fr 1fr; font-size: 10px; }
/* 底部抽屉 */
.m-mask {
  position: fixed; inset: 0; z-index: 400; background: rgba(10, 14, 22, .44);
  opacity: 0; transition: opacity .2s ease;
}
.m-mask.m-shown { opacity: 1; }
.m-sheet {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 401;
  display: flex; flex-direction: column; max-height: 84vh;
  background: var(--panel); color: var(--text);
  border-radius: 16px 16px 0 0; box-shadow: 0 -8px 30px rgba(10, 14, 22, .22);
  transform: translateY(101%); transition: transform .22s cubic-bezier(.32, .72, .3, 1);
  padding-bottom: env(safe-area-inset-bottom);
}
.m-sheet.m-shown { transform: translateY(0); }
.m-sheet-h {
  flex: none; display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px 10px; border-bottom: 1px solid var(--line);
}
.m-sheet-h b { font-size: 14.5px; }
.m-sheet-x {
  appearance: none; border: 0; background: none; color: var(--muted);
  font-size: 15px; line-height: 1; padding: 4px 6px; cursor: pointer;
}
.m-sheet-b { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 10px 14px 6px; }
.m-sheet-f { flex: none; display: flex; gap: 10px; padding: 10px 14px 14px; border-top: 1px solid var(--line); }
.m-sheet-c, .m-sheet-o {
  flex: 1; appearance: none; cursor: pointer; font-family: inherit; font-size: 14px;
  border-radius: 10px; padding: 11px 0; border: 1px solid var(--line);
  background: var(--hover); color: var(--text);
}
.m-sheet-o { background: var(--red); border-color: var(--red); color: #fff; font-weight: 600; }
.m-sheet-c:active { background: var(--line-soft); }
.m-sheet-o:active { filter: brightness(.94); }
/* 抽屉内的通用行 */
.m-sh-tip { font-size: 11.5px; color: var(--muted); margin-bottom: 8px; line-height: 1.6; }
.m-sh-tip2 { font-size: 11px; color: var(--muted); margin-top: 10px; }
.m-sh-search { margin-bottom: 8px; }
.m-sh-search input {
  width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 9px;
  background: var(--hover); color: var(--text); padding: 9px 10px; font-size: 13px; font-family: inherit;
}
.m-sh-ops { display: flex; gap: 8px; margin-bottom: 6px; }
.m-sh-ops button {
  flex: 1; appearance: none; cursor: pointer; font-family: inherit; font-size: 11.5px;
  border: 1px solid var(--line); background: var(--panel); color: var(--sub);
  border-radius: 8px; padding: 7px 0;
}
.m-sh-gt {
  position: sticky; top: -10px; z-index: 1; background: var(--panel);
  padding: 8px 2px 4px; font-size: 11px; font-weight: 700; color: var(--muted);
}
.m-sh-row {
  display: flex; align-items: center; gap: 9px; padding: 9px 2px;
  border-bottom: 1px solid var(--line-soft); font-size: 13px;
}
.m-sh-row input[type=checkbox], .m-sh-row input[type=radio] {
  width: 17px; height: 17px; flex: none; accent-color: var(--red); margin: 0;
}
.m-sh-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-sh-k { flex: none; font-size: 10px; color: var(--muted); font-variant-numeric: tabular-nums; }
.m-sh-r {
  font-style: normal; margin-left: 5px; padding: 0 4px; border-radius: 4px;
  background: color-mix(in srgb, var(--blue) 14%, transparent); color: var(--blue); font-size: 9.5px;
}
.m-sh-list { margin-top: 2px; }
.m-sh-dir { display: flex; gap: 8px; margin-bottom: 10px; }
.m-sh-dir button {
  flex: 1; appearance: none; cursor: pointer; font-family: inherit; font-size: 12px;
  border: 1px solid var(--line); background: var(--panel); color: var(--sub);
  border-radius: 8px; padding: 8px 0;
}
.m-sh-dir button.m-on {
  border-color: var(--red); color: var(--red); font-weight: 600;
  background: color-mix(in srgb, var(--red) 8%, transparent);
}
.m-sh-quick { display: flex; gap: 8px; margin: 4px 0 12px; }
.m-sh-quick button {
  flex: 1; appearance: none; cursor: pointer; font-family: inherit; font-size: 12.5px;
  border: 1px solid var(--line); background: var(--panel); color: var(--text);
  border-radius: 8px; padding: 9px 0;
}
.m-sh-date { display: flex; gap: 10px; }
.m-sh-date label { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.m-sh-date span { font-size: 11px; color: var(--muted); }
.m-sh-date input {
  width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel); color: var(--text); padding: 8px; font-size: 13px; font-family: inherit;
}
/* 组合筛选条件行 */
.m-cd {
  position: relative; border: 1px solid var(--line); border-radius: 10px;
  background: var(--hover); padding: 10px; margin-bottom: 8px;
}
.m-cd-del {
  position: absolute; right: 5px; top: 5px; appearance: none; border: 0; background: none;
  color: var(--muted); font-size: 12px; padding: 3px 5px; cursor: pointer;
}
.m-cd-l1 { display: flex; gap: 6px; padding-right: 24px; }
.m-cd-l2 { display: flex; align-items: center; gap: 6px; margin-top: 7px; }
.m-cd-f, .m-cd-o {
  min-width: 0; appearance: none; font-family: inherit; font-size: 12.5px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--text);
  padding: 8px 6px;
}
.m-cd-f { flex: 1; }
.m-cd-o { flex: 0 0 92px; }
.m-cd-v, .m-cd-v2 {
  flex: 1; min-width: 0; box-sizing: border-box; font-family: inherit; font-size: 13px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--text);
  padding: 8px 8px;
}
.m-cd-sep { flex: none; font-size: 12px; color: var(--muted); }
.m-cd-na { font-size: 11.5px; color: var(--muted); }
.m-sh-preset { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.m-sh-preset button {
  appearance: none; cursor: pointer; font-family: inherit; font-size: 11.5px;
  border: 1px solid var(--line); background: var(--panel); color: var(--sub);
  border-radius: 999px; padding: 5px 10px;
}
.m-sh-add {
  width: 100%; appearance: none; cursor: pointer; font-family: inherit; font-size: 12.5px;
  border: 1px dashed var(--line); background: none; color: var(--red);
  border-radius: 9px; padding: 9px 0; margin-top: 2px;
}

/* ================= 导入进度：秒表 + 流动条纹（用户反馈「以为浏览器卡死」） ================= */
.busy-t2 { font-size: 11px; color: var(--muted); text-align: center; margin-top: 7px; line-height: 1.5; }
.busy-bar i {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0 8px, rgba(255, 255, 255, .42) 8px 16px);
  background-size: 16px 100%;
  animation: busyFlow .7s linear infinite;
}
@keyframes busyFlow { from { background-position: 0 0; } to { background-position: 16px 0; } }
/* 手机端：遮罩卡片别贴边，字大一点，离手远一点更清楚 */
html.m-mode .busy-card { width: min(360px, 88vw); padding: 22px 20px; }
html.m-mode .busy-t { font-size: 15px; }
html.m-mode .busy-p { font-size: 12.5px; }
html.m-mode .busy-bar { height: 8px; }

/* ================= V1.0.4 移动端：皮肤 / 饼图 / 排行卡片 / 多表 / 复制 ================= */
/* 移动端自己的变量都在 #mApp 上（桌面端读不到，换肤绝不会影响电脑端）。
   --m-bg/--m-card 等默认指向桌面主题变量，所以不选皮肤时外观与之前完全一致。 */
#mApp {
  --m-accent: var(--red);
  --m-card: var(--panel);
  --m-num: inherit;
  background: var(--bg);
  color: var(--text);
}
/* 顶栏 logo（和电脑端同一个五角星图） */
#mApp .m-logo { width: 24px; height: 24px; border-radius: 7px; display: block; flex: none; object-fit: cover; }
#mApp .m-brand { align-items: center; }
#mApp .m-me-logo { width: 16px; height: 16px; border-radius: 5px; vertical-align: -3px; margin-right: 6px; }
/* 表格选择（点开抽屉；「全部表格」= 多店合并） */
#mApp .m-dspick {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 4px;
  appearance: none; border: 0; background: none; padding: 0; cursor: pointer;
  font-family: inherit; text-align: left; color: inherit;
  -webkit-tap-highlight-color: transparent;
}
#mApp .m-dspick .m-impbar-n { color: var(--sub); }
#mApp .m-ds-caret { font-style: normal; font-size: 10px; color: var(--m-accent); flex: none; }
/* 数据没导到昨天的提醒条（V1.0.6：常驻，数据对上才自动消失，不再给「知道了」） */
#mApp .m-stale {
  display: flex; align-items: flex-start; gap: 8px; margin-top: 10px;
  padding: 9px 11px; border-radius: 10px; font-size: 11.5px; line-height: 1.55;
  color: #8a5a00; background: #fff7e6; border: 1px solid #f5d9a8;
}
#mApp .m-stale-ic {
  flex: none; width: 16px; height: 16px; border-radius: 50%; background: #e8a33d; color: #fff;
  font-size: 11px; font-weight: 700; text-align: center; line-height: 16px; margin-top: 1px;
}
#mApp .m-stale-t { flex: 1; min-width: 0; }
#mApp .m-stale-t b { font-weight: 700; }
/* V1.0.7 踩坑（用户 2026-10-27 报「导入新产品后提醒条不消失，关掉重开才没」）：
   作者样式里的 display:flex / block 优先级高于浏览器默认的 [hidden]{display:none}，
   于是代码里 el.hidden = true 只改了属性、画面一点没动——提醒条就一直挂着导入前的旧文字。
   .m-more（加载更多）也中了同一枪。这里一次性兜住手机外壳里所有用 hidden 控制显隐的元素。
   例外 .m-sheet：抽屉靠 transform 滑入滑出，不能被 display 掐断动画。 */
#mApp [hidden]:not(.m-sheet) { display: none !important; }
/* 万相：趋势 / 分布 切换 */
#mApp .m-card-h2 { align-items: center; }
#mApp .m-chtab { display: inline-flex; background: var(--hover); border-radius: 9px; padding: 2px; gap: 2px; }
#mApp .m-chtab-b {
  appearance: none; border: 0; background: none; cursor: pointer; font-family: inherit;
  font-size: 12px; color: var(--sub); padding: 5px 14px; border-radius: 7px;
  -webkit-tap-highlight-color: transparent;
}
#mApp .m-chtab-b.m-on { background: var(--m-accent); color: #fff; font-weight: 650; }
/* 饼图 */
#mApp .m-pie { margin-top: 8px; }
#mApp .m-pietop { font-size: 11px; color: var(--sub); line-height: 1.6; }
#mApp .m-pietop b { color: var(--text); font-weight: 650; }
#mApp .m-piewrap { margin: 4px auto 0; width: min(240px, 72vw); }
#mApp .m-piewrap svg { display: block; width: 100%; height: auto; }
#mApp .m-plgs { margin-top: 8px; display: flex; flex-direction: column; gap: 1px; }
#mApp .m-plg {
  display: flex; align-items: center; gap: 7px; padding: 5px 2px;
  border-bottom: 1px solid var(--line-soft); font-size: 11.5px; font-variant-numeric: tabular-nums;
}
#mApp .m-plg:last-child { border-bottom: 0; }
#mApp .m-plg i { width: 9px; height: 9px; border-radius: 2px; flex: none; }
#mApp .m-plg-n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mApp .m-plg-v { flex: none; font-weight: 650; color: var(--m-num, var(--text)); }
#mApp .m-plg-p { flex: none; width: 46px; text-align: right; font-style: normal; color: var(--muted); }
#mApp .m-pie-f label { display: block; margin-bottom: 10px; }
#mApp .m-pie-f span { display: block; font-size: 11px; color: var(--muted); margin-bottom: 4px; }
#mApp .m-pie-f select {
  width: 100%; box-sizing: border-box; appearance: none; font-family: inherit; font-size: 12px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--m-card); color: var(--text);
  padding: 9px 10px; line-height: 1.35;
}
/* V1.0.6：指标不再用原生下拉，改成小字号选项块，一次能看全所有指标名 */
#mApp .m-pie-blk { margin: 0 0 10px; }
#mApp .m-pie-lb {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 11px; color: var(--muted); margin-bottom: 5px;
}
#mApp .m-pie-lb b {
  margin-left: auto; max-width: 62%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12px; font-weight: 650; color: var(--m-accent);
}
#mApp .m-pie-list {
  display: flex; flex-wrap: wrap; gap: 6px; max-height: 232px; overflow-y: auto; padding: 7px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel);
  -webkit-overflow-scrolling: touch;
}
#mApp .m-pie-opt {
  appearance: none; cursor: pointer; font-family: inherit; font-size: 11.5px; line-height: 1.25;
  padding: 6px 9px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--m-card); color: var(--text); white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
#mApp .m-pie-opt.m-on {
  border-color: var(--m-accent); color: var(--m-accent); font-weight: 650;
  box-shadow: inset 0 0 0 1px var(--m-accent);
}
/* 款式卡片：勾选的字段全部显示，一行放不下左右滑（V1.0.4） */
#mApp .m-item { position: relative; }
#mApp .m-item-n {
  display: flex; flex-wrap: nowrap; gap: 12px; overflow-x: auto; -webkit-overflow-scrolling: touch;
  padding: 2px 0 3px; scrollbar-width: none;
}
#mApp .m-item-n::-webkit-scrollbar { display: none; }
#mApp .m-fl { flex: 0 0 auto; display: flex; flex-direction: column; gap: 1px; line-height: 1.2; }
#mApp .m-fl em { font-style: normal; font-size: 9.5px; color: var(--muted); white-space: nowrap; }
#mApp .m-fl b {
  font-size: 11.5px; font-weight: 650; color: var(--m-num, var(--text)); font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
#mApp .m-fl b.up { color: var(--red); }
#mApp .m-fl b.down { color: var(--green); }
/* 卡片右上角的「⋯」复制按钮 */
#mApp .m-item-cp {
  position: absolute; right: 6px; bottom: 5px; z-index: 2;
  appearance: none; cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--hover); color: var(--sub);
  padding: 2px 8px; border-radius: 999px; font-size: 10px; line-height: 1.5;
  -webkit-tap-highlight-color: transparent;
}
#mApp .m-item-cp:active { background: var(--hover); color: var(--m-accent); }
/* 明细表：列多了整张表左右滑 */
#mApp .m-det-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -2px; }
#mApp .m-det-tb { width: max-content; min-width: 100%; }
#mApp .m-det-head, #mApp .m-detrow { grid-template-columns: var(--det-cols, 56px 1fr 1fr 1fr); }
#mApp .m-detrow span:not(:first-child), #mApp .m-det-head span:not(:first-child) { text-align: right; }
#mApp .m-detrow span { color: var(--m-num, inherit); }
#mApp .m-detrow span.up { color: var(--red); }
#mApp .m-detrow span.down { color: var(--green); }
/* 数字颜色（--m-num）只作用于「普通数字」，红涨绿跌永不被改 */
#mApp .m-kpi-v:not(.up):not(.down) { color: var(--m-num, inherit); }
#mApp .m-item-p:not(.up):not(.down) b { color: var(--m-num, inherit); }
#mApp .m-toppf:not(.up):not(.down) { color: var(--m-num, inherit); }
#mApp .m-clg b, #mApp .m-gv b { color: var(--m-num, var(--text)); }
/* 卡片底色统一走 --m-card（默认等于桌面 --panel） */
#mApp .m-card, #mApp .m-kpi, #mApp .m-seg, #mApp .m-search, #mApp .m-tool,
#mApp .m-item, #mApp .m-item-det, #mApp .m-sheet, #mApp .m-more, #mApp .m-ds-btn,
#mApp .m-sh-dir button, #mApp .m-sh-quick button, #mApp .m-sh-preset button, #mApp .m-sh-ops button,
#mApp .m-sh-date input, #mApp .m-cd-f, #mApp .m-cd-o, #mApp .m-cd-v, #mApp .m-cd-v2,
#mApp .m-dspick { background-color: var(--m-card); }
/* 强调色统一走 --m-accent */
#mApp .m-seg-b.m-on, #mApp .m-ph-btn, #mApp .m-sheet-o { background: var(--m-accent); border-color: var(--m-accent); }
#mApp .m-tab.m-on, #mApp .m-tool i, #mApp .m-sh-add, #mApp .m-me-link { color: var(--m-accent); }
#mApp .m-imp { color: var(--m-accent); border-color: color-mix(in srgb, var(--m-accent) 45%, transparent); background: color-mix(in srgb, var(--m-accent) 8%, transparent); }
#mApp .m-imp:active { background: color-mix(in srgb, var(--m-accent) 16%, transparent); }
#mApp .m-item.m-open { border-color: color-mix(in srgb, var(--m-accent) 40%, var(--line)); }
#mApp .m-item-det { border-color: color-mix(in srgb, var(--m-accent) 40%, var(--line)); }
#mApp .m-sh-row input[type=checkbox], #mApp .m-sh-row input[type=radio] { accent-color: var(--m-accent); }
#mApp .m-sh-dir button.m-on { border-color: var(--m-accent); color: var(--m-accent); background: color-mix(in srgb, var(--m-accent) 8%, transparent); }
#mApp .m-item-pf { background: color-mix(in srgb, var(--m-accent) 6%, transparent); border-color: color-mix(in srgb, var(--m-accent) 18%, var(--line)); }
#mApp .m-item-pf:active { background: color-mix(in srgb, var(--m-accent) 14%, transparent); }
#mApp .m-dschip.m-on { border-color: var(--m-accent); background: color-mix(in srgb, var(--m-accent) 10%, transparent); }
#mApp .m-dschip:active { border-color: var(--m-accent); }
/* 多表格芯片 */
#mApp .m-dschips { display: flex; flex-direction: column; gap: 7px; margin-top: 6px; }
#mApp .m-dschips-sheet { margin-top: 8px; }
#mApp .m-dschip {
  display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left;
  appearance: none; cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--hover); color: var(--text);
  border-radius: 10px; padding: 9px 11px; -webkit-tap-highlight-color: transparent;
}
#mApp .m-dschip b { font-size: 12.5px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mApp .m-dschip i { font-style: normal; font-size: 10.5px; color: var(--muted); }
/* 我的：删表 / 导入 / 个性化入口 */
#mApp .m-me-btns { display: flex; gap: 8px; margin-top: 10px; }
#mApp .m-me-btn {
  flex: 1; appearance: none; cursor: pointer; font-family: inherit; font-size: 12.5px;
  border: 1px solid var(--line); background: var(--hover); color: var(--text);
  border-radius: 9px; padding: 10px 0; -webkit-tap-highlight-color: transparent;
}
#mApp .m-me-btn:active { filter: brightness(.96); }
#mApp .m-me-btn-danger { color: #c0392b; border-color: color-mix(in srgb, #c0392b 40%, var(--line)); background: color-mix(in srgb, #c0392b 7%, transparent); }
#mApp .m-me-btn:disabled { opacity: .45; cursor: not-allowed; }
#mApp .m-me-link {
  appearance: none; border: 0; background: none; cursor: pointer; font-family: inherit;
  font-size: 12.5px; font-weight: 650; padding: 0;
}
/* 复制菜单 */
#mApp .m-cplist { display: flex; flex-direction: column; gap: 8px; }
#mApp .m-cp {
  display: flex; flex-direction: column; gap: 3px; width: 100%; text-align: left;
  appearance: none; cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--hover); color: var(--text);
  border-radius: 10px; padding: 10px 12px; -webkit-tap-highlight-color: transparent;
}
#mApp .m-cp span { font-size: 11px; color: var(--muted); }
#mApp .m-cp b { font-size: 12.5px; font-weight: 600; word-break: break-all; }
#mApp .m-cp:disabled { opacity: .5; }
#mApp .m-cp:active:not(:disabled) { border-color: var(--m-accent); }
/* 皮肤选择 */
#mApp .m-skins { display: flex; flex-direction: column; gap: 9px; }
#mApp .m-skin {
  display: flex; align-items: center; gap: 11px; width: 100%; text-align: left;
  appearance: none; cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--hover); color: var(--text);
  border-radius: 12px; padding: 9px 11px; -webkit-tap-highlight-color: transparent;
}
#mApp .m-skin-pv { flex: none; width: 46px; height: 34px; border-radius: 8px; border: 1px solid var(--line); }
#mApp .m-skin b { display: block; font-size: 13px; font-weight: 650; }
#mApp .m-skin i { display: block; margin-top: 2px; font-style: normal; font-size: 10.5px; color: var(--muted); line-height: 1.45; }
#mApp .m-skin.m-on { border-color: var(--m-accent); box-shadow: 0 0 0 1px var(--m-accent) inset; }
#mApp .m-skin.m-on::after { content: "✓"; margin-left: auto; color: var(--m-accent); font-weight: 700; }
/* 颜色选择 */
#mApp .m-colors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
#mApp .m-color {
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  appearance: none; cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--hover); color: var(--text);
  border-radius: 11px; padding: 9px 4px; -webkit-tap-highlight-color: transparent;
}
#mApp .m-color span { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); display: block; }
#mApp .m-color span.m-color-auto { background: linear-gradient(135deg, #fff 0 48%, #d0d6df 48% 52%, #2b333f 52% 100%); }
#mApp .m-color b { font-size: 11px; font-weight: 500; color: var(--sub); }
#mApp .m-color.m-on { border-color: var(--m-accent); box-shadow: 0 0 0 1px var(--m-accent) inset; }
#mApp .m-color.m-on b { color: var(--text); font-weight: 650; }

/* ---------- 五套皮肤（模仿主流 App 的配色气质，名字都是自取的） ---------- */
/* 1) 星河（默认）：沿用桌面主题的可变色，只把强调色定成品牌红 */
#mApp[data-skin="star"] { --m-accent: var(--red); }
/* 2) 晴空蓝：清透白底 + 天蓝，顶栏做渐变 */
#mApp[data-skin="sky"] {
  --bg: #eef6fd; --panel: #ffffff; --cell: #ffffff; --head: #eaf4fc; --hover: #f1f9ff;
  --line: #d8e9f6; --line-soft: #e8f3fb; --text: #0f2438; --sub: #4c6b86; --muted: #8aa4b9;
  --m-accent: #12a7e8;
}
#mApp[data-skin="sky"] .m-top { background: linear-gradient(135deg, #12a7e8, #4cc9f0); border-bottom: 0; color: #fff; }
#mApp[data-skin="sky"] .m-top .m-sub { color: rgba(255, 255, 255, .92); }
#mApp[data-skin="sky"] .m-top .m-sub b { color: #fff; }
#mApp[data-skin="sky"] .m-ver { color: #fff; background: rgba(255, 255, 255, .2); border-color: rgba(255, 255, 255, .5); }
/* 3) 青野绿：淡绿底 + 草绿 */
#mApp[data-skin="leaf"] {
  --bg: #eff7f1; --panel: #ffffff; --cell: #ffffff; --head: #e9f5ec; --hover: #f3fbf6;
  --line: #d9e9dd; --line-soft: #e9f4ec; --text: #1a2a20; --sub: #54705f; --muted: #8fa899;
  --m-accent: #07a65a;
}
#mApp[data-skin="leaf"] .m-top { background: linear-gradient(135deg, #07a65a, #45c98a); border-bottom: 0; color: #fff; }
#mApp[data-skin="leaf"] .m-top .m-sub { color: rgba(255, 255, 255, .92); }
#mApp[data-skin="leaf"] .m-top .m-sub b { color: #fff; }
#mApp[data-skin="leaf"] .m-ver { color: #fff; background: rgba(255, 255, 255, .2); border-color: rgba(255, 255, 255, .5); }
/* 4) 暗夜红：深色底 + 朱红（夜间护眼） */
#mApp[data-skin="ruby"] {
  --bg: #151314; --panel: #201c1d; --cell: #201c1d; --head: #2a2425; --hover: #271f20;
  --line: #332b2c; --line-soft: #2a2324; --text: #f6efef; --sub: #c9b9b9; --muted: #9a8888;
  --m-accent: #d33a3a;
}
#mApp[data-skin="ruby"] .m-top { background: linear-gradient(135deg, #3a0f10, #7a1a1c); border-bottom: 1px solid #4a1c1e; color: #fff; }
#mApp[data-skin="ruby"] .m-top .m-sub { color: rgba(255, 255, 255, .86); }
#mApp[data-skin="ruby"] .m-top .m-sub b { color: #fff; }
#mApp[data-skin="ruby"] .m-ver { color: #ffb3b3; background: rgba(211, 58, 58, .18); border-color: rgba(211, 58, 58, .5); }
#mApp[data-skin="ruby"] .m-seg-b.m-on,
#mApp[data-skin="ruby"] .m-chtab-b.m-on { color: #fff; }
#mApp[data-skin="ruby"] .m-stale { color: #f0c98a; background: #2b2119; border-color: #4a3a22; }
/* 5) 霓虹黑：纯黑 + 青霓虹（对比最强） */
#mApp[data-skin="neon"] {
  --bg: #0b0b0f; --panel: #16161d; --cell: #16161d; --head: #1d1d26; --hover: #1c1c25;
  --line: #272732; --line-soft: #1f1f29; --text: #f2f4f8; --sub: #b9c2cf; --muted: #8a94a3;
  --m-accent: #00e5d0;
}
#mApp[data-skin="neon"] .m-top { background: #0b0b0f; border-bottom: 1px solid #00e5d0; color: #f2f4f8; }
#mApp[data-skin="neon"] .m-name { letter-spacing: 1px; }
#mApp[data-skin="neon"] .m-ver { color: #00e5d0; background: rgba(0, 229, 208, .12); border-color: rgba(0, 229, 208, .45); }
#mApp[data-skin="neon"] .m-seg-b.m-on,
#mApp[data-skin="neon"] .m-chtab-b.m-on { color: #06201e; font-weight: 700; }
#mApp[data-skin="neon"] .m-tab.m-on { color: #00e5d0; }
#mApp[data-skin="neon"] .m-stale { color: #ffd479; background: #1d1a10; border-color: #403820; }

/* 深色皮肤下，浏览器原生控件（日期、下拉）也跟着变深，不然白得扎眼 */
#mApp[data-skin="ruby"], #mApp[data-skin="neon"] { color-scheme: dark; }

/* ===== V1.0.5 ===== */
/* ① 拖动排序：抽屉「已选」区（长按拖动，顺序就是显示顺序） */
#mApp .m-selbox {
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel);
  padding: 8px 8px 6px; margin: 0 0 10px;
}
#mApp .m-sel-h {
  display: flex; align-items: center; gap: 6px;
  font-size: 11.5px; color: var(--sub); padding: 0 2px 6px;
}
#mApp .m-sel-h b { color: var(--text); font-variant-numeric: tabular-nums; }
#mApp .m-sel-h span { margin-left: auto; font-size: 10.5px; color: var(--muted); }
#mApp .m-sellist { display: flex; flex-direction: column; gap: 5px; max-height: 190px; overflow-y: auto; }
#mApp .m-selrow {
  display: flex; align-items: center; gap: 7px; padding: 7px 8px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--cell, var(--panel));
  font-size: 12.5px; touch-action: manipulation; user-select: none;
}
#mApp .m-selrow .m-selg { font-style: normal; color: var(--muted); letter-spacing: -2px; font-size: 13px; }
#mApp .m-selrow em {
  font-style: normal; font-size: 10px; color: var(--muted); font-variant-numeric: tabular-nums;
  min-width: 13px; text-align: right;
}
#mApp .m-selrow span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mApp .m-selrow .m-selx {
  flex: none; width: 22px; height: 22px; line-height: 20px; text-align: center; border-radius: 50%;
  border: 1px solid var(--line); color: var(--muted); font-weight: 400; font-size: 13px;
}
#mApp .m-sel-empty { font-size: 11.5px; color: var(--muted); padding: 6px 2px 8px; }
#mApp .m-selrow.m-dragging {
  border-color: var(--m-accent); background: var(--hover, rgba(0, 0, 0, .04));
  box-shadow: 0 8px 22px rgba(0, 0, 0, .18); transform: scale(1.015);
  position: relative; z-index: 3; opacity: .96;
}
#mApp .m-sellist.m-sorting { cursor: grabbing; }

/* ② 看板指标卡可直接长按拖动换顺序 */
#mApp .m-kpi[data-k] { touch-action: manipulation; user-select: none; }
#mApp .m-kpi[data-k]::after {
  content: '⋮⋮'; position: absolute; top: 5px; right: 7px;
  font-size: 11px; line-height: 1; letter-spacing: -2px; color: var(--muted); opacity: .75;
}
#mApp .m-kpi[data-k] { position: relative; }
#mApp .m-kpi.m-dragging {
  border-color: var(--m-accent); box-shadow: 0 10px 26px rgba(0, 0, 0, .2);
  transform: scale(1.02); z-index: 3; opacity: .97;
}
#mApp .m-kpis.m-sorting { cursor: grabbing; }

/* ③ 推广排行卡（与款式卡同壳；没有主图，用占位图标） */
#mApp .m-item-pro .m-item-img { display: flex; align-items: center; justify-content: center; background: var(--hover, var(--cell)); }
/* V1.0.6：推广排行也显示主图（宝贝ID 对上「主图新」就有图），填满方式跟款式卡一致 */
#mApp .m-item-pro .m-item-img img { width: 100%; height: 100%; object-fit: cover; display: block; flex: 1 1 auto; min-width: 0; }
#mApp .m-item-pro .m-item-holder { font-size: 18px; color: var(--muted); }
#mApp .m-tools-in { margin: 2px 0 8px; }
#mApp .m-cp-trend { border-style: dashed; }
#mApp .m-cp-trend span { color: var(--m-accent); }

/* ④ 抽屉里的款式趋势图 */
#mApp .m-trend-sheet { min-height: 190px; }
#mApp .m-trend-sheet .m-chart { height: 200px; }
/* 推广排行工具条：三个按钮要挤在一行，长名字省略，不换行 */
#mApp #mWxRankTools .m-tool {
  white-space: nowrap; overflow: hidden; gap: 3px; padding: 8px 4px; font-size: 11.5px;
}
#mApp #mWxRankTools .m-tool i {
  display: inline-block; max-width: 58px; overflow: hidden; text-overflow: ellipsis;
  vertical-align: bottom; white-space: nowrap;
}
#mApp #mWxRankTools .m-tool i { max-width: 72px; }

/* ===== V2.4.37 手机端体验（PC 侧边栏「手机版」→ 扫码） ===== */
.qr-panel { width: min(620px, 94vw); }
/* V2.4.40（用户 2026-10-27 报「滑动鼠标后关闭按钮被滚到上面藏起来了」）：
   applyWinPos 恢复记住的高度时会给面板就地加 inline 的 overflow:auto，整个面板（含标题栏）变成
   滚动容器 → 滚轮一转，标题栏和关闭按钮就滚出可视区。
   这里把面板固定成「不滚动的外壳 + 内部 .qr-body 滚动」，标题栏 sticky 兜底，标题栏和 X 永远在。 */
.qr-panel { overflow: hidden !important; display: flex; flex-direction: column; }
.qr-panel > .ds-head {
  flex: 0 0 auto; position: sticky; top: 0; z-index: 6;
  background: var(--panel, #fff); border-radius: 14px 14px 0 0;
}
.qr-body {
  display: flex; gap: 20px; align-items: flex-start; padding: 2px 2px 8px;
  flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain;
}
.qr-x { display: none; }   /* V2.4.40 起不需要单独的 X：标题栏已 sticky，关闭按钮永远在 */
.qr-pic { flex: none; text-align: center; }
.qr-pic img {
  width: 208px; height: 208px; display: block; box-sizing: border-box;
  padding: 8px; border-radius: 12px; background: #fff; border: 1px solid var(--line);
}
.qr-hint { margin: 8px 0 0; font-size: 12px; color: var(--sub); }
.qr-side { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.qr-row { display: flex; flex-direction: column; gap: 4px; }
.qr-row > span { font-size: 12px; color: var(--sub); }
.qr-row > b { font-size: 13px; }
.qr-row code {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11.5px; line-height: 1.5;
  word-break: break-all; background: var(--hover); border: 1px solid var(--line-soft);
  border-radius: 7px; padding: 7px 9px; color: var(--text);
}
.qr-tag {
  font-size: 11.5px; font-weight: 500; color: #fff; background: var(--red);
  border-radius: 999px; padding: 2px 9px; vertical-align: 2px; margin-left: 2px;
}
.qr-note { margin: 2px 0 0; font-size: 12px; line-height: 1.75; color: var(--sub); }
.qr-note b { color: var(--text); }
/* V2.4.39：安卓 APP 下载块（放在二维码右边，和「复制链接」同一列）
   V2.4.40：左边加一颗「扫码直接下载安装包」的二维码 —— 用户不用先在电脑下载再传手机 */
.qr-app {
  display: flex; align-items: flex-start; gap: 12px; padding: 10px 11px;
  border: 1px dashed var(--line); border-radius: 10px; background: var(--hover);
}
.qr-app-qrwrap { flex: none; text-align: center; }
.qr-app-qr {
  width: 96px; height: 96px; display: block; box-sizing: border-box;
  padding: 4px; border-radius: 8px; background: #fff; border: 1px solid var(--line);
}
.qr-app-scan { display: block; margin-top: 4px; font-size: 10.5px; color: var(--sub); }
.qr-app-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.qr-app-h { font-size: 12.5px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 6px; }
.qr-app-h span {
  font-size: 11px; font-weight: 600; color: var(--accent); background: var(--panel);
  border: 1px solid var(--line); border-radius: 999px; padding: 1px 7px;
}
.qr-app-d { font-size: 11.5px; line-height: 1.6; color: var(--sub); }
.qr-app-btn { align-self: flex-start; margin-top: 2px; text-decoration: none; }
.qr-app-url {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 10.5px; line-height: 1.5;
  word-break: break-all; color: var(--sub);
}
body[data-theme="dark"] .qr-panel > .ds-head { background: #232a35; }
@media (max-width: 640px) {
  .qr-body { flex-direction: column; gap: 14px; }
  .qr-pic { align-self: center; }
}

/* 移动端：首次扫码的 20MB 提醒 */
#mApp .m-qr-tip { display: flex; flex-direction: column; gap: 9px; margin-top: 4px; }
#mApp .m-qr-li { display: flex; gap: 9px; align-items: flex-start; font-size: 12.5px; line-height: 1.6; }
#mApp .m-qr-li b {
  flex: none; width: 18px; height: 18px; border-radius: 50%; margin-top: 1px;
  background: var(--m-accent); color: #fff; font-size: 11px; font-weight: 700;
  text-align: center; line-height: 18px;
}
#mApp .m-qr-li span { flex: 1; min-width: 0; }

/* V2.4.46：产品页「数据是否最新」提醒（正常应到昨天） */
.prod-stale{ display:none; align-items:center; gap:8px; margin:10px 16px 0; padding:9px 14px; font-size:12px; color:#8a5a00; background:#fff8e8; border:1px solid #f2d9a6; border-radius:10px; line-height:1.6; }
.prod-stale b{ color:#b97517; }
body[data-theme="dark"] .prod-stale{ background:#2a2416; border-color:#5a4a24; color:#e8c98a; }
body[data-theme="dark"] .prod-stale b{ color:#f0b64a; }

/* V2.4.46：表头拖动换列序——统一「首页看板」手感（拖动列变淡、目标列虚线框、插入其前） */
th.coldrag{ opacity:.45; }
th.coldrop{ outline:2px dashed #2f6fed; outline-offset:-2px; }
#gridHead th.drag, #wxHead th[data-wk], #ovTable thead th[data-key]{ cursor:grab; }
#gridHead th.drag:active, #wxHead th[data-wk]:active, #ovTable thead th[data-key]:active{ cursor:grabbing; }

/* V2.4.47：外观设置里的「配色方案」抽屉（默认收起，点开才展开 20 套） */
.theme-drawer-h{ display:flex; align-items:center; font-size:12px; font-weight:700; padding:6px 2px 4px; cursor:pointer; user-select:none; }
.theme-drawer-h:hover span{ color:#2f6fed; }
.theme-drawer{ display:none; }
.theme-drawer.open{ display:block; }