/* ============================================================================
   皮肤 F「纸白·墨线」— 2026-10-07
   ---------------------------------------------------------------------------
   定位：**第 6 套皮肤，只新增、不改任何旧层**（删掉本文件 + 撤 index.html 那两行
        即可完全回退）。加载于 polish.css **之后**，所以能压过前面所有层。

   为什么还要再做一套（用户："我始终看不到我的web主题和布局有什么变化"）：
     现有 5 套（E/D/A/B/C）全部只是**换配色**，布局形态一模一样 ——
     skin.css 自己的注释就写着"只改颜色、圆角、阴影，不动任何布局尺寸"。
     所以不管切哪套，看到的都是"同一个界面换了颜色"。
     设计规范对这件事的判断是：**"换一套新风格"要改的是「形态」，不是「配色」；
     仅仅重新上色不叫改版，用户会说"几乎没变"，而且他们是对的。**
     本层改的就是形态。

   形态上的四处改动（也是你能一眼看到的部分）：
     ① **侧栏由深海军蓝改成纸白**。skin.css 顶部注释里记着你早前的原话
        ——"左栏这个黑乎乎的页面我实在是接受不了"。改回纸白侧栏，
        同时把 theme.css 里那批"浅色字压在深侧栏上"的假设全部翻掉
        （.brand h1 用近白色、.nav-group .gt 用半透明浅蓝、.nav-item 用 ink-300
          —— 它们压在纸白底上会直接看不见，这是本层必须一起处理的关键点）。
     ② **中性灰取代蓝调灰**。原来从页面底到分隔线都带蓝（#f6f6f6 / #ececec / #e7e7e7），
        整套换成中性纸灰（#f5f5f5 / #e6e6e6）。这是"纸感"的来源。
     ③ **去卡**：卡片不再靠阴影浮起，改由「发丝墨线 + 底色差」分层；
        圆角 10/16px 收到 6/8px；章节标题下压一道通栏墨线。
     ④ **等宽数字**：单号、时间、计数改等宽字体 + tabular-nums，大数字收紧字距。

   保留不动（重要）：
     · 各工序功能色（合成蓝 / 氨解青 / 接酯金 / 纯化绿 / 分装粉）—— 一个不改
     · 语义色 ok/warn/danger 的语义不变，只把明度调到墨线主题里
     · 任何布局尺寸（宽高、栅格、间距）—— 与旧皮肤一致，零回归风险
   ========================================================================== */

/* ---------------------------------------------------------------------------
   1. 变量契约
   ---------------------------------------------------------------------------
   皮肤层要求实现的变量清单（照 skin.css 的 :root / html[data-skin="E"] 对齐）：
     点缀 5 个 · 侧栏 15 个 · 内容区 10 个 · 指挥带 5 个 · 形状阴影 5 个
   少给一个就会出现"这套皮肤某处没跟上"的脏点，所以这里给全。
   ------------------------------------------------------------------------- */

/* —— 浅色：纸白 + 墨 —— */
html[data-paper]:not([data-theme="dark"]) {
  /* 点缀：墨蓝（不是品牌亮蓝。#6e6e6e 太亮，压在纸白上没有"墨"的味道） */
  --sk-accent: #434343;
  --sk-accent-2: #595959;
  --sk-accent-deep: #2b2b2b;
  --sk-accent-soft: rgba(67,67,67, .10);
  --sk-grad: linear-gradient(135deg, #4f4f4f 0%, #383838 100%);

  /* 侧栏：纸白。层次靠「类目轨浅纸灰 + 1px 墨线 + 面板纯白」，不是白对白 */
  --sk-rail-1: #FFFFFF;
  --sk-rail-2: #FFFFFF;
  --sk-rail-line: #e8e8e8;
  --sk-rail-txt: #424242;
  /* ⚠ 实测踩坑：第一版给 #787E86，压在纸白侧栏上只有 3.79:1（42 页全中：
     「产线 / 监控 / 产线作业 / 五道工序 / 在线·李培基」）。深侧栏时代这个明度没问题
     （浅字压深底），翻成纸白底之后同样的明度就不够了 —— 这是"换侧栏底色"的连带成本。
     压到 #545454（白底约 5.4:1），仍明显轻于 --sk-rail-txt(#424242)，层级不丢。 */
  --sk-rail-txt-2: #545454;
  --sk-rail-txt-hi: #181818;
  --sk-rail-hover: #f4f4f4;
  --sk-rail-pin-bg: rgba(67,67,67, .05);
  --sk-rail-field: #f2f2f2;
  --sk-rail-field-focus: #FFFFFF;
  --sk-rail-badge: rgba(24,24,24, .07);
  --sk-rail-rail-bg: #f6f6f6;
  --sk-rail-thumb: #cbcbcb;
  --sk-rail-thumb-hover: #ADB1B6;

  /* 内容区：中性纸灰（去蓝调 —— 这一条就是"纸感"） */
  --sk-page: #f5f5f5;
  --sk-page-2: #ebebeb;
  --sk-card: #FFFFFF;
  --sk-soft: #f9f9f9;
  --sk-line: #e6e6e6;
  --sk-line-2: #f0f0f0;
  --sk-ink: #181818;
  --sk-ink-2: #484848;
  /* ⚠ 实测踩坑：第一版 #747474 在白底上 3.35:1（「点任意一行看 NC 原始报文」这类
     说明文字、单位、次级标签，全站 800+ 处）。"caption 可以更浅"不等于"可以低于 4.5:1"。
     压到 #6B7078（白底约 4.7:1），与 --sk-ink-2 仍拉得开。

     ★ 2026-10-08 再压一档：4.7:1 是"白底"的数，但本主题里这批字更常压在**浅蓝底**
     #f1f1f1/#eeeeee 上，实测只有 4.25~4.35:1（对比度审计里那 40 处 4.2~4.4 的边缘组）。
     记的是"压在最差底色上也过线"：#585858 = 4.75:1(#f1f1f1) / 5.46:1(白)。 */
  --sk-ink-3: #585858;

  /* 指挥带：纸白（原来是深色带；纸白带 + 一道墨线更"纸面"） */
  --sk-band-1: #FFFFFF;
  --sk-band-2: #FFFFFF;
  --sk-band-3: #FFFFFF;
  --sk-band-glow: rgba(67,67,67, .08);
  --sk-band-txt: #616161;

  /* 语义色：明度按纸白底重调（原值在纸白上偏亮） */
  --sk-ok: #0A7043;
  --sk-warn: #B45309;
  --sk-danger: #B3202E;
  --sk-info: #434343;

  /* 形状：利落。深度靠墨线，不靠阴影 */
  --sk-r: 6px;
  --sk-r-lg: 8px;
  --sk-sh-1: 0 1px 0 rgba(24,24,24, .03);
  --sk-sh-2: 0 1px 2px rgba(24,24,24, .05), 0 10px 24px -20px rgba(24,24,24, .32);
  --sk-sh-3: 0 20px 44px -30px rgba(24,24,24, .48);

  /* 老变量桥：design-system / app.css 里那批 var() 要跟着走，
     否则会出现"侧栏换了、某些组件还是旧蓝"的脏点 */
  --brand: #383838;
  --brand-2: #4f4f4f;
  --brand-soft: #f1f1f1;
  --brand-glow: rgba(67,67,67, .15);
  --ui-brand-100: #f1f1f1;
  --ui-brand-050: #f7f7f7;
  --ui-brand-900: #2b2b2b;
  --ui-brand-700: #434343;
  --ui-brand-600: #434343;
  --ui-brand-500: #595959;
  --panel-2: #f9f9f9;
  /* 中性阶也去蓝调 */
  --ui-ink-900: #181818;
  --ui-ink-700: #484848;
  --ui-ink-500: #636363;
  /* ★ 2026-10-08：#5d5d5d 在 #f9f9f9 上是 4.47:1 —— 注释早写了"再压一档到约 4.6:1"，
     但一直没落地；压在浅蓝底上更低（4.35:1）。同 --sk-ink-3 一起收到 #585858。 */
  --ui-ink-400: #585858;
  /* ★ 2026-10-08：【本次最大的一块】原值 #767676 = 2.23:1。
     它名义上是"占位/禁用专用"，但其实被 theme.css 当成**第三档文字色**用在真实数据上了：
     日期 / 百分比 / 单数 / 单位 / 列名 / 序号，全站约 160 处（.ht-w · .ht-d · .cr-v u · .cr-v s
     · .evt-v u · .ps-v u · .dr-c u · .pf-c b · .tl2-gu · .ov-cal-cell .w · .ovz-sub em …）。
     这些使用点太多、分布在 6 个文件里，改使用点不现实 ⇒ 把这一档提到能读。
     层级改由**字号/字重**表达（这批本来就是 10~11px），不再靠"浅到看不见"表达。
     "真的不是信息"的那几类（箭头 / 破折号 / 禁用按钮 / 滚动条滑块）在文件末 §13 里显式保持浅色。 */
  --ui-ink-300: #585858;
  --ui-line-100: #f0f0f0;
  --ui-line-200: #e6e6e6;
  --ui-bg-page: #f5f5f5;
  --ui-bg-soft: #f9f9f9;
}

/* —— 深色：F 在深色下也要成套，否则切到深色就"这套皮肤缺了一半" ——
   深色不做纸白（那不合理），做**中性墨黑**：去掉原来那股蓝调，
   分层靠 rgba 白线而不是蓝边。 */
html[data-paper][data-theme="dark"] {
  --sk-accent: #868686;
  --sk-accent-2: #9c9c9c;
  --sk-accent-deep: #616161;
  --sk-accent-soft: rgba(163,163,163, .16);
  --sk-grad: linear-gradient(135deg, #5a5a5a 0%, #393939 100%);

  --sk-rail-1: #1a1a1a;
  --sk-rail-2: #141414;
  --sk-rail-line: rgba(255, 255, 255, .09);
  --sk-rail-txt: #9d9d9d;
  --sk-rail-txt-2: #747474;
  --sk-rail-txt-hi: #f4f4f4;
  --sk-rail-hover: rgba(255, 255, 255, .07);
  --sk-rail-pin-bg: rgba(255, 255, 255, .04);
  --sk-rail-field: rgba(255, 255, 255, .07);
  --sk-rail-field-focus: rgba(255, 255, 255, .12);
  --sk-rail-badge: rgba(255, 255, 255, .14);
  --sk-rail-rail-bg: rgba(0, 0, 0, .22);
  --sk-rail-thumb: rgba(255, 255, 255, .18);
  --sk-rail-thumb-hover: rgba(255, 255, 255, .30);

  --sk-page: #111111;
  --sk-page-2: #181818;
  --sk-card: #1a1a1a;
  --sk-soft: #1f1f1f;
  --sk-line: #2e2e2e;
  --sk-line-2: #242424;
  --sk-ink: #eaeaea;
  --sk-ink-2: #767676;
  --sk-ink-3: #7C828A;

  --sk-band-1: #1a1a1a;
  --sk-band-2: #1a1a1a;
  --sk-band-3: #1a1a1a;
  --sk-band-glow: rgba(163,163,163, .10);
  --sk-band-txt: #858585;

  --sk-sh-1: 0 1px 0 rgba(0, 0, 0, .3);
  --sk-sh-2: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 26px -20px rgba(0, 0, 0, .7);
  --sk-sh-3: 0 22px 48px -30px rgba(0, 0, 0, .8);
}

/* 等宽字体栈：单号/时间/计数用。中文会自然回落到雅黑，不影响 */
html[data-paper] {
  --mono: 'Cascadia Mono', Consolas, 'SF Mono', Menlo, 'Courier New', monospace;
}

/* ---------------------------------------------------------------------------
   2. 外壳：侧栏（纸白）+ 顶栏 + 页面底
   ---------------------------------------------------------------------------
   ★ 关键点：theme.css 里有一批规则**假设侧栏是深色**，直接把浅色字写死在
     .brand h1 / .nav-group .gt / .nav-item 上。侧栏一旦变纸白，这些字就消失了。
     所以下面必须逐条翻掉 —— 这是"改用纸白侧栏"真正的成本所在。 */
html[data-paper]:not([data-theme="dark"]) .sidebar {
  background: linear-gradient(180deg, var(--sk-rail-1), var(--sk-rail-2));
  border-right: 1px solid var(--sk-rail-line);
  /* 深色侧栏靠 34px 外阴影和背景分开；纸白侧栏靠一条发丝线就够，阴影反而是脏的 */
  box-shadow: none;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .brand h1 {
  color: var(--sk-rail-txt-hi);
  text-shadow: none;                     /* theme.css 给深底配的蓝色发光，纸白上没有意义 */
}
html[data-paper]:not([data-theme="dark"]) .sidebar .brand .sub { color: var(--sk-rail-txt-2); }
html[data-paper]:not([data-theme="dark"]) .sidebar .brand { border-bottom-color: var(--sk-rail-line); }
/* 类目轨 / 分组标题 / 连接状态：原来是"半透明浅蓝压在深底上"，纸白底上全部要换成墨灰 */
html[data-paper]:not([data-theme="dark"]) .sidebar :is(.nav-group .gt, .nav-panel-h, .conn, .conn span, .nav-rail .nr-btn, .nav-search svg) {
  color: var(--sk-rail-txt-2);
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-group .gt { letter-spacing: .18em; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item { color: var(--sk-rail-txt); }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item :is(i, svg, span) { color: inherit; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item:hover { background: var(--sk-rail-hover); color: var(--sk-rail-txt-hi); }
/* 选中态：墨色字 + 一道 2px 墨蓝内嵌左线（用 inset 阴影而不是 border，避免挤动布局） */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.on,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.active {
  background: var(--sk-accent-soft);
  color: var(--sk-rail-txt-hi);
  box-shadow: inset 2px 0 0 var(--sk-accent);
  font-weight: 800;
}
html[data-paper]:not([data-theme="dark"]) .sidebar :is(.nav-search, .nav-search input) {
  background: var(--sk-rail-field);
  color: var(--sk-rail-txt);
  border-color: var(--sk-rail-line);
}
html[data-paper]:not([data-theme="dark"]) .sidebar :is(.nav-search input::placeholder) { color: var(--sk-rail-txt-2); }
/* 侧栏 logo：深底上的蓝渐变+发光在纸白上会显得脏，收敛成墨蓝平色 */
html[data-paper]:not([data-theme="dark"]) .sidebar .logo {
  background: var(--sk-grad);
  border-color: rgba(67,67,67, .22);
  box-shadow: none;
}

/* 顶栏：纸白 + 一道墨线，去掉投影 */
html[data-paper]:not([data-theme="dark"]) .topbar {
  background: #FFFFFF;
  border-bottom: 1px solid var(--sk-line);
  box-shadow: none;
}
html[data-paper]:not([data-theme="dark"]) .app-tabs { background: transparent; border-bottom-color: var(--sk-line); }

/* ---------------------------------------------------------------------------
   3. 去卡：深度从"阴影"改成"墨线 + 底色差"
   ---------------------------------------------------------------------------
   原来每张卡都是 白底 + 圆角 + 两层阴影 —— 一屏十几张卡时，
   阴影互相叠加反而糊成一片。纸白主题的做法：**去阴影、留发丝线、收圆角**。 */
html[data-paper] #view :is(.ov3-card, .bp-card, .sp-panel, .sp-kpi-card, .mqz-card, .rp-card, .dv-card,
    .fqc-qcard, .fqc-panel, .fqc-card, .pk-card, .ocard, .ui-card, .panel, .sec-card, .tp-card,
    .ov-insight, .ov-kpi, .oc-filtercard, .rework-stat-card, .mqz-panel, .odkpis > *) {
  border-radius: var(--sk-r) !important;
  box-shadow: none !important;
  border: 1px solid var(--sk-line);
}
html[data-paper] #view :is(.ov3-card, .bp-card, .sp-panel, .mqz-card, .rp-card, .dv-card,
    .fqc-qcard, .pk-card, .ocard, .ui-card, .panel):hover {
  border-color: #d9d9d9;
  box-shadow: none !important;
}
/* 卡片内的头部分隔：从"阴影"改成"发丝线" */
html[data-paper] #view :is(.ov3-h, .ui-card-h, .mqz-head, .sp-panel-h, .panel-h) {
  border-bottom: 1px solid var(--sk-line-2);
}

/* 章节标题下压一道通栏墨线 —— 这是"一张纸被分成几栏"的视觉信号，
   比给每块加边框更像纸面，也是本主题最容易被一眼看出的改动之一。 */
html[data-paper] #view :is(.ov3-h, .ui-card-h, .mqz-head, .sp-panel-h, .panel-h, .sec-head) {
  position: relative;
  padding-bottom: 8px;
}
html[data-paper] #view :is(.ov3-h, .ui-card-h, .mqz-head, .sp-panel-h, .panel-h, .sec-head)::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: var(--sk-line);
}

/* ---------------------------------------------------------------------------
   4. 表格：吸顶墨色表头 + 40px 行 + 去斑马 + 发丝线
   ---------------------------------------------------------------------------
   表格是这个系统的主体（线边物料单页 583 行）。纸白主题下改的是**线的层级与表头归属**：
     · 表头吸顶（滚动时始终知道每列是什么）
     · 表头改墨色小字、字重 800、+0.02em 字距
     · 表头线比行线重一档（#6B7078 vs #f0f0f0）——列归属才清楚
     · 去掉隔行底色（斑马纹在 500+ 行的长表里是噪点），行间改发丝线
     · 行内边距 9px

   ⚠ 不动**行高**：实测 .oc-table 的 td 带 `height:45px`，行高由它决定而不是 padding。
     皮肤层的既定约定就是"不动任何布局尺寸"，硬掰行高只会带来新的裁切风险
     （本会话已经为"单元格静默截断"打过两轮硬仗）。所以这里如实描述：
     行高保持原作者设定，本层只改线与字。 */
html[data-paper] #view table:where(:not(.dbe-grid)):where(:not([class*="plate"])):where(:not([class*="well"])) thead th {
  color: var(--sk-ink-2) !important;
  font-weight: 800;
  letter-spacing: .02em !important;
  background: var(--sk-card);
  border-bottom: 1px solid var(--sk-ink-3) !important;   /* 表头线比行线重一档，列归属才清楚 */
  position: sticky;
  top: 0;
  z-index: 2;
}
html[data-paper] #view table:where(:not(.dbe-grid)):where(:not([class*="plate"])):where(:not([class*="well"])) tbody tr {
  background: transparent !important;
}
html[data-paper] #view table:where(:not(.dbe-grid)):where(:not([class*="plate"])):where(:not([class*="well"])) tbody td {
  border-bottom: 1px solid var(--sk-line-2) !important;
}
html[data-paper] #view table:where(:not(.dbe-grid)):where(:not([class*="plate"])):where(:not([class*="well"])) tbody tr:hover > td {
  background: var(--sk-soft) !important;
}
/* 行内边距（只改 padding，不改 height —— 见上方说明） */
html[data-paper] #view table:where(:not(.dbe-grid)):where(:not([class*="plate"])):where(:not([class*="well"])) tbody td {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/* ---------------------------------------------------------------------------
   5. 等宽数字与单号
   ---------------------------------------------------------------------------
   规范里那条："任何一列数字、任何指标、任何倒计时都要 tabular-nums"。
   这里的补充是：**单号和时间用等宽字体**，让它们读起来像数据而不是散文。 */
html[data-paper] :is(.mono, .od, .tl-oid, .tl2-oid, .wc-id, .oc-oid, .df-oid, .board-cell, .rm-oid,
    .ov-sub-od, .seq-cell, .am-ledger-path, .clock, .clock .d, .clock .t) {
  font-family: var(--mono) !important;
  font-variant-numeric: tabular-nums;
}
/* 大数字：收紧字距（规范："字号越大字距越紧"），并保持表格数字 */
html[data-paper] :is(.ov3-val, .ov-kpi b, .pk-val, .hv-kpi b, .kpi b, .ov3-kpi b,
    .sp-kpi-v, .bp-kpi b, .od > b, .rp-kpi b) {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.4px;
}

/* ---------------------------------------------------------------------------
   6. 侧栏纸白：终裁权重
   ---------------------------------------------------------------------------
   ⚠ 为什么这一节要再用一次 !important：
   改成「E 的契约 + data-paper 覆盖」之后，E 那批**按导航模式分档**的侧栏规则
   也开始匹配（形如 `html[data-skin="E"]:not([data-theme="dark"])[data-nav="ink"] .sidebar`，
   带 4 个属性、特异性 (0,4,1)），把上面 (0,3,1) 的纸白底压掉了 ——
   实测侧栏又变回深色 #242424，于是「产线 / 监控 / 产线作业」这些**墨字压在深底上**，
   对比度跌到 1.08~2.93:1（全站 504 处，占这次泄漏的 4/5）。
   皮肤层本来就是"最终裁决者"，这里用 !important 把侧栏的底与字钉死。 */
html[data-paper]:not([data-theme="dark"]) .sidebar {
  background: #FFFFFF !important;
  border-right: 1px solid var(--sk-rail-line) !important;
  box-shadow: none !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail { background: var(--sk-rail-rail-bg) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar::before { display: none !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .brand h1 { color: var(--sk-rail-txt-hi) !important; text-shadow: none !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .brand .sub { color: var(--sk-rail-txt-2) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .brand { border-bottom-color: var(--sk-rail-line) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item { color: var(--sk-rail-txt) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item :is(i, svg, span) { color: inherit !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item:hover { background: var(--sk-rail-hover) !important; color: var(--sk-rail-txt-hi) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.on,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.active {
  background: var(--sk-accent-soft) !important;
  color: var(--sk-rail-txt-hi) !important;
  box-shadow: inset 2px 0 0 var(--sk-accent) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar :is(.nav-group .gt, .nav-group > .gt, .nav-panel-h, .nav-panel-h i,
    .conn, .conn span, .nav-rail .nr-btn, .nav-empty, .nav-search svg, .nav-pin .np-h, .nav-pin .np-h em) {
  color: var(--sk-rail-txt-2) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn.on { color: var(--sk-rail-txt-hi) !important; background: rgba(67,67,67, .07) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar :is(.nav-search, .nav-search input) {
  background: var(--sk-rail-field) !important;
  color: var(--sk-rail-txt) !important;
  border-color: var(--sk-rail-line) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-search input::placeholder { color: var(--sk-rail-txt-2) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar :is(.nav-badge, .side-foot) { color: var(--sk-rail-txt-2) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-badge { background: var(--sk-rail-badge) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .side-foot { border-top-color: var(--sk-rail-line) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .logo { background: var(--sk-grad) !important; box-shadow: none !important; }
/* 底部「退出登录」：E 给深底配的是浅蓝字（#e1e1e1），压在纸白上只有 1.35:1（42 页全中）。
   E 那条规则的载体是 .side-foot 里的**内层元素**，所以这里连后代一起钉。 */
html[data-paper]:not([data-theme="dark"]) .sidebar .side-foot,
html[data-paper]:not([data-theme="dark"]) .sidebar .side-foot :is(button, a, span, div, b, i) {
  color: var(--sk-rail-txt) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .side-foot :is(button, a):hover { color: var(--sk-rail-txt-hi) !important; }
/* 同类泄漏兜底：E 用浅蓝（#c6c6c6 系）写的"浅底上的说明文字"，统一拉回墨阶 */
html[data-paper]:not([data-theme="dark"]) :is(.dg-kv-n, .dg-kv-v, [class*="kv-n"]) {
  color: var(--sk-ink-3) !important;
}


/* ===========================================================================
   7. 「高端工整」精修：KPI 数据带统一 + 空态收敛 + 纸白下的隐形色修正
   ---------------------------------------------------------------------------
   实测问题（逐条都在截图/探针里确认过）：

   ① **一排 5 张 KPI 卡里装了 3 种不同的"数据带"**：5px 细条 / 28px 迷你折线 /
      多色堆叠条。结构其实已经统一（标签/大数/副标/数据带/底注），参差感来自
      **带子里装的东西形态不同**，而且细条的 margin-top:12px 让它在 28px 带里浮着。
      → 统一成"同一条 4px 胶囊 + 同一根可见轨道 + 垂直居中"。

   ② **两个"给深色指挥带配的颜色"压在纸白卡上等于看不见**：
      · `.k-bar` 的轨道 `rgba(255,255,255,.14)` → 纸白上完全隐形，
        于是所有条看起来像"悬空的半截色块"；
      · 设备堆叠条里「待机」段 `rgba(255,255,255,.45)` → 同样隐形，
        而待机恰恰是最大的一段（15 台里 13 台待机），等于把主要信息藏了。
      → 轨道改 `--sk-line`，待机段改中性 ink（JS 侧改）。

   ③ **工序登记那条堆叠条用的是装饰性色阶**（蓝→蓝→青→绿→浅蓝），颜色没有含义。
      → 改用真工序功能色（合成蓝/氨解青/接酯金/纯化绿/分装粉），见 app.js。

   ④ 空态 `.ov3-empty` 是 `min-height:120px; height:100%`，会把整张卡撑成大白块。
   ========================================================================== */

/* ① 数据带统一：同一条 4px 胶囊、同一根轨道、垂直居中 */
html[data-paper] .ov-kpi-d .k-viz {
  height: 24px !important;
  margin-top: 10px !important;
  display: flex !important;
  align-items: center !important;
}
html[data-paper] .ov-kpi-d .k-viz .k-bar,
html[data-paper] .ov-kpi-d > .k-bar {
  width: 100% !important;
  height: 4px !important;
  margin-top: 0 !important;
  border-radius: 999px !important;
  background: var(--sk-line) !important;    /* ★ 轨道可见化：原来 rgba(255,255,255,.14) 在纸白上隐形 */
  overflow: hidden !important;
}
html[data-paper] .ov-kpi-d .k-viz .ov-spark,
html[data-paper] .ov-kpi-d .k-viz svg {
  height: 24px !important;
  width: 100% !important;
}
/* 率条的刻度线：深色带上它是白线，纸白上要改成墨色细线 */
html[data-paper] .ov-kpi-d .k-bar-rate u {
  background: var(--sk-ink-3) !important;
  opacity: .55 !important;
}

/* ② KPI 卡内的字阶与节奏统一（标签/大数/单位/副标/底注 五件套） */
html[data-paper] .ov-kpi-d {
  padding: 14px 16px 12px !important;
  border-radius: 8px !important;
}
html[data-paper] .ov-kpi-d .k-lb {
  color: var(--sk-ink-3) !important;
  font-size: 11px !important;
  letter-spacing: .02em !important;
}
html[data-paper] .ov-kpi-d .k-vl { gap: 6px !important; margin-top: 4px !important; }
html[data-paper] .ov-kpi-d .k-vl b {
  font-size: 32px !important;
  letter-spacing: -.8px !important;
  line-height: 1.02 !important;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
html[data-paper] .ov-kpi-d .k-vl span { color: var(--sk-ink-3) !important; font-size: 11px !important; }
html[data-paper] .ov-kpi-d .k-sb { color: var(--sk-ink-2) !important; font-size: 11px !important; margin-top: 4px !important; }
html[data-paper] .ov-kpi-d .k-sb b { color: var(--sk-ink) !important; font-variant-numeric: tabular-nums; }
html[data-paper] .ov-kpi-d .k-cap { color: var(--sk-ink-3) !important; font-size: 11px !important; margin-top: 6px !important; }
/* 底部文字与数据带之间留出统一的呼吸位，5 张卡基线才齐 */
html[data-paper] .ov-kpi-d .k-cap { margin-top: auto !important; padding-top: 10px !important; }
html[data-paper] .ov-kpi-d { display: flex !important; flex-direction: column !important; }

/* ③ 空态收敛：120px 的撑满改成紧凑一句，别再让空态卡当大白块 */
html[data-paper] .ov3-empty {
  min-height: 84px !important;
  height: auto !important;
  font-size: 12px !important;
  color: var(--sk-ink-3) !important;
}

/* ④ 卡片内小标题下压的通栏墨线：KPI 卡不要（它们是并列的砖，不是章节） */
html[data-paper] .ov-kpi-d .k-lb::after { content: none !important; }


/* ===========================================================================
   10. 深色补齐（交付前最后一轮）
   ---------------------------------------------------------------------------
   实测：深色主题剩 728 个低对比元素（浅色 395）。查下来是**三处漏配**，不是设计问题：

   ① **语义色只写了浅色版**。`--sk-ok / --sk-warn / --sk-danger / --sk-info` 我只在
      `html[data-paper]:not([data-theme="dark"])` 里给了值，深色下它们回落到 skin.css 的
      `:root`（那是给深色带配的亮色）→ 于是"红字压深底"实测 3.49~3.98:1（全站 100+ 处）。
   ② **侧栏在深色下还是旧的深蓝 `#292929`** —— 我的侧栏规则写的是 `:not([data-theme="dark"])`。
      深蓝底 + 我这套中性灰字 → 4.4:1，差一点点，但**42 页全中**（174 处）。
   ③ **中性阶在深色下压得太低**：`--sk-ink-3: #7C828A` 落在深卡 `#1d1d1d` 上只有 4.43:1。
   ========================================================================== */

/* ① 语义色深色版（对齐 tokens.css 深色块的同族档） */
html[data-paper][data-theme="dark"] {
  --sk-ok: #5FE0A8;
  --sk-warn: #F5C77E;
  --sk-danger: #FF9AA5;
  --sk-info: #9e9e9e;
  /* ③ 中性阶提亮一档：原来是 #7C828A（深卡上 4.43:1，差 0.07） */
  --sk-ink-3: #7d7d7d;
  --ui-ink-400: #787878;
  --ui-ink-300: #767676;
}

/* ② 侧栏：深色下也用"中性墨黑"，与纸白主题的深色版保持一致（原来是深蓝 #292929） */
html[data-paper][data-theme="dark"] .sidebar {
  background: #1a1a1a !important;
  border-right: 1px solid rgba(255, 255, 255, .09) !important;
  box-shadow: none !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-rail { background: rgba(0, 0, 0, .24) !important; }
html[data-paper][data-theme="dark"] .sidebar::before { display: none !important; }
html[data-paper][data-theme="dark"] .sidebar .brand h1 { color: #f4f4f4 !important; text-shadow: none !important; }
html[data-paper][data-theme="dark"] .sidebar .brand .sub { color: #858585 !important; }
html[data-paper][data-theme="dark"] .sidebar .brand { border-bottom-color: rgba(255, 255, 255, .09) !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-item { color: #9d9d9d !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-item :is(i, svg, span) { color: inherit !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-item:hover { background: rgba(255, 255, 255, .07) !important; color: #f4f4f4 !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-item.on,
html[data-paper][data-theme="dark"] .sidebar .nav-item.active {
  background: rgba(163,163,163, .16) !important;
  color: #f4f4f4 !important;
  box-shadow: inset 2px 0 0 #868686 !important;
}
html[data-paper][data-theme="dark"] .sidebar :is(.nav-group .gt, .nav-group > .gt, .nav-panel-h, .nav-panel-h i,
    .conn, .conn span, .nav-rail .nr-btn, .nav-empty, .nav-search svg, .nav-pin .np-h, .nav-pin .np-h em,
    .nav-badge, .side-foot, .side-foot :is(button, a, span, div, b, i)) {
  color: #858585 !important;
}
html[data-paper][data-theme="dark"] .sidebar .nr-btn.on { color: #f4f4f4 !important; background: rgba(255, 255, 255, .10) !important; }
html[data-paper][data-theme="dark"] .sidebar :is(.nav-search, .nav-search input) {
  background: rgba(255, 255, 255, .07) !important;
  color: #9d9d9d !important;
  border-color: rgba(255, 255, 255, .10) !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-search input::placeholder { color: #858585 !important; }
html[data-paper][data-theme="dark"] .sidebar .side-foot { border-top-color: rgba(255, 255, 255, .09) !important; }
html[data-paper][data-theme="dark"] .sidebar .logo { box-shadow: none !important; }

/* ④ 白字压在"中间调实心块"上（深色下这些块偏亮，白字只有 2.5~3.4:1）→ 把底压深 */
html[data-paper][data-theme="dark"] .wc-st.is-now { background: #5a5a5a !important; color: #FFFFFF !important; }
html[data-paper][data-theme="dark"] .nav-badge.is-warn { background: #9A5508 !important; color: #FFFFFF !important; }
html[data-paper][data-theme="dark"] :is(.ov-delta.up, .ov-delta.down) { background: rgba(255, 255, 255, .10) !important; color: #eeeeee !important; }
html[data-paper][data-theme="dark"] .ov-delta b { color: #FFFFFF !important; }
html[data-paper][data-theme="dark"] .ov-delta i { color: #858585 !important; }

/* ⑤ 深色 hero 带上的灰标签/单位：提亮到可读（原来 2.88:1） */
html[data-paper][data-theme="dark"] .ov-kpi-d :is(.k-lb, .k-cap, .k-vl span) { color: #858585 !important; }
html[data-paper][data-theme="dark"] .ov-kpi-d .k-sb { color: #9d9d9d !important; }

/* ===========================================================================
   11. 窄屏（≤1440px）两处修正
   ---------------------------------------------------------------------------
   实测（1280×800，`probe-narrow.cjs`）：
     · `th.c-lamp`「状态」w=42 sw=48 —— workbench.css:2254 在 ≤1440px 把该列压到 28px，
       而表头是「状态」两个字，装不下就裁。**不去抢别的列的宽度**（抢了会把单号列一起挤坏），
       改为窄屏收表头字号与内边距，让它落进列宽里。
     · 单号 `<b>` w=190 sw=206 —— 窄屏把整表字号收 1px（13→12px ≈ -7.7%）即可落进列宽。
   ========================================================================== */
@media (max-width: 1440px) {
  /* ⚠ 必须带 #view / #pdContent：skin.css:2696 那条 `#view table thead th{padding:0 12px !important}`
     带 ID，特异性 (1,0,3)；不带 ID 的写法 (0,4,3) 会被它压掉（第一版就是这么失效的）。 */
  html[data-paper] #view .pd3-wb .ol-tb th.c-lamp,
  html[data-paper] #pdContent .pd3-wb .ol-tb th.c-lamp {
    font-size: 11px !important;
    letter-spacing: -.02em !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  html[data-paper] #view .pd3-wb .ol-tb,
  html[data-paper] #pdContent .pd3-wb .ol-tb { font-size: 12px !important; }
  /* 产能计划：那个容器是**无类名的 DIV 直接包一张表**，窄屏下 1004px 装 1258px 被裁。
     没法点名，就用结构选择器：任何"直接包表"的 DIV 在窄屏下允许横向滚动。
     只在使用者真的溢出时才出现滚动条，不会平白多出滚动条。 */
  html[data-paper] #view div:has(> table) { overflow-x: auto !important; }
}


/* ===========================================================================
   12. 深色收口（交付前）
   ---------------------------------------------------------------------------
   上一轮 728 → 541 → 488，剩下的是"规则打不过"而不是"没配"：
     · `.bp-tag.tone-a` 42 处 —— 我那条无前缀规则特异性不够，被后面的层压掉；
     · `.badge.b-gray` 29 处 —— 用的 ink-400 在深卡上只有 4.19:1，差一点点；
     · hero 带（深青底 rgba(60,60,60)）上的标签 60 处 —— #858585 只有 3.65:1；
     · `.nav-badge.is-warn` 10 处 —— 被我自己那条"侧栏统一灰"压掉了白字（特异性反噬）；
     · 白字压在 #12A06A 绿块上 8 处 —— 深色下这个绿偏亮。
   统一用 `html[data-paper][data-theme="dark"] #view …` 提一级特异性。
   ========================================================================== */
html[data-paper][data-theme="dark"] #view :is(.bp-tag.tone-a, .bp-tag.tone-b, .ov-b-red) {
  color: var(--ui-danger-ink) !important;
}
html[data-paper][data-theme="dark"] #view :is(.badge.b-gray, .badge.b-grey, .badge.b-mute, .mqz-tag.is-gray) {
  color: #999999 !important;
}
html[data-paper][data-theme="dark"] #view :is(.badge.b-cyan, .badge.b-blue, .badge.b-info) {
  color: var(--ui-info-ink) !important;
}
/* hero 带（深青底）上的标签 / 单位 / 底注：纸白主题的深色版这里偏暗，提亮一档 */
html[data-paper][data-theme="dark"] .ov-kpi-d :is(.k-lb, .k-cap, .k-sb, .k-vl span) {
  color: #e5e5e5 !important;
}
html[data-paper][data-theme="dark"] .ov-kpi-d .k-vl b { color: #FFFFFF !important; }
/* 侧栏角标：白色压在"警示橙"上。这条必须写在"侧栏统一灰"之后并提一级特异性，
   否则会被我自己的灰字规则盖掉（上一轮就是这么丢掉白字的）。 */
html[data-paper][data-theme="dark"] .sidebar .nav-badge.is-warn {
  background: #9A5508 !important;
  color: #FFFFFF !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-badge { color: #e5e5e5 !important; }
/* 白字压在实心绿块上（深色下 #12A06A 偏亮）→ 把底下压一档 */
html[data-paper][data-theme="dark"] #view :is(.g-u, .ov-delta.up, [class*="is-ok"], [class*="tone-ok"]) i {
  color: #FFFFFF !important;
}
html[data-paper][data-theme="dark"] #view :is(.ov-delta.up, .ov-delta.down) {
  background: rgba(255, 255, 255, .12) !important;
  color: #eeeeee !important;
}

/* ---------------------------------------------------------------------------
   8. 焦点环：墨蓝双层（键盘可达性必须看得见）
   --------------------------------------------------------------------------- */
html[data-paper] :is(a, button, [tabindex], input, select, textarea, .nav-item):focus-visible {
  outline: 2px solid var(--sk-accent) !important;
  outline-offset: 2px !important;
}

/* ---------------------------------------------------------------------------
   9. 实测补漏：把"真数据"从"占位/禁用灰"里捞出来
   ---------------------------------------------------------------------------
   `--ui-ink-300` 是占位/禁用态专用色（WCAG 对非活动控件豁免，所以给得轻）。
   但下面这几个类是**真实数据**，不该跟着一起轻：
     .tl-time 「5天前」· .who-t / [class$="-time"] 「09-30 04:30」· .mqz-rn 序号 · .mqz-ico 图标
   实测它们压在白底上只有 2.23:1（全站 163 处）。这里单独提到 --sk-ink-3。 */
html[data-paper] :is(.tl-time, .who-t, .mqz-rn, .mqz-ico, [class$="-time"], [class*="-time "]) {
  color: var(--sk-ink-3) !important;
}


/* ===========================================================================
   13. 浅色可读性收口（2026-10-08）
   ---------------------------------------------------------------------------
   起因：42 页对比度审计（_qctest/audit-contrast.cjs，1680×1000，真机渲染）
   在浅色下仍报 **380 个低对比元素**（旧皮肤 E 是 2446）。
   用 _qctest/ink-probe.cjs 逐元素查出「到底是哪条规则把 color 定成这样」之后，
   这 380 不是零散疏忽，是**四条系统性口子**：

     ① **三个中性令牌差一口气**（约 200 处）——已在 §1 的变量块里收口：
       `--ui-ink-300` #767676(2.23:1) → #585858；`--ui-ink-400`、`--sk-ink-3` → #585858。
       这三条一改，日期/百分比/单数/单位/列名/标签那 200 处全部跟着过线（它们都写 var()）。
       理由写在 §1 的注释里，这里不重复。
     ② **危险字色 #C0392B 压粉底**只有 4.45:1（设备状态签 65 处）→ 13.3。
     ③ **深色带的遗留**（本次最该先修的一类）：纸白主题把 KPI 指挥带、交付卡、
       质量驾驶舱都翻成了浅底，但带上一批"压深底才成立"的字色没跟着翻
       （`#fff` / `var(--ui-brand-050)` / `var(--ui-brand-100)` / `#c6c6c6` / `#F7DCB0`），
       于是出现 **1.0~1.4:1 的"几乎不可见"**：白字白底、近白字压近白底。→ 13.1
     ④ **拿"线色 / 品牌亮色"当文字色**：`var(--ui-line-200)` 是发丝分隔线色（#e6e6e6），
       被当成文字色用就等于"没有文字"；`#6e6e6e`/`#D97706`/`#10B981`/`#0C9AB8` 是
       **图形/描边色**，压在白底上 2.4~3.8:1，当字色用不合格。→ 13.2 / 13.4

   本节只覆盖**浅色**，所有选择器都带 `html[data-paper]:not([data-theme="dark"])`；
   深色主题一个字节都不碰。
   验收：改完重跑 `node _qctest/audit-contrast.cjs <out> light`，看总数与剩余清单。
   ========================================================================== */


/* ---------------------------------------------------------------------------
  13.1 深色带遗留 → 浅底上翻成墨色
  --------------------------------------------------------------------------- */

/* 「今日」条大数：原来写死 #fff，纸白带上就是白字白底 */
html[data-paper]:not([data-theme="dark"]) .ov-today-c b { color: var(--sk-ink) !important; }

/* KPI 带上的「豁免」签：原来 --ui-brand-100 压同族浅底，1.09:1（等于没有这个字） */
html[data-paper]:not([data-theme="dark"]) .ov-kpi-d .k-sb .ovz-waive {
  color: var(--ui-ok-ink) !important;
  background: var(--ui-ok-bg) !important;
}

/* 生产概览右上角「近 14 日 / 全部」等口径按钮：#c6c6c6 是深蓝带上的颜色 */
html[data-paper]:not([data-theme="dark"]) .ov-win button { color: var(--ui-brand-700) !important; }
html[data-paper]:not([data-theme="dark"]) .ov-win button:hover { color: var(--ui-brand-900) !important; }
html[data-paper]:not([data-theme="dark"]) .ov-win button.on {
  background: var(--ui-brand-700) !important;
  color: #FFFFFF !important;
}

/* 交付周期达成 / 交期预警：值用的是 --ui-brand-050（近白）、角标用的是 #c6c6c6 */
html[data-paper]:not([data-theme="dark"]) .dg-due :is(.dg-kv-c b, .dg-kv2-v) {
  color: var(--ui-ink-700) !important;
}
html[data-paper]:not([data-theme="dark"]) .dg-due .dg-kv2-l { color: var(--ui-ink-400) !important; }

/* 三色占比条：段色是 JS 内联的**浅色**（#939393 / #c6c6c6 …），白字压上去 1.8~2.2:1。
   段色是数据编码，不动；改成「深字 + 半透明白底片」，任何段色上都成立。 */
html[data-paper]:not([data-theme="dark"]) .dg-due .dg-tri-bar span b {
  color: #282828 !important;
  background: rgba(255, 255, 255, .82);
  border-radius: 4px;
  padding: 0 4px;
  text-shadow: none !important;
}

/* 成品质检的能力卡角标：blue 用 #c6c6c6、red 用 --ui-danger-line（粉）、green 用 ink-300 */
html[data-paper]:not([data-theme="dark"]) #view .fqc-cp-kpi .fqc-cp-kl { color: var(--ui-ink-400) !important; }
html[data-paper]:not([data-theme="dark"]) #view .fqc-cp-kpi.b-red .fqc-cp-kl { color: var(--ui-danger-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view .fqc-cp-kpi.b-green .fqc-cp-kl { color: var(--ui-ok-ink) !important; }

/* 中间质检页首大数：--ui-warn-line(#F7DCB0) 压白卡 = 1.33:1 */
html[data-paper]:not([data-theme="dark"]) #view .mq-hero-k b { color: var(--sk-ink) !important; }

/* 物料出库「加入」按钮：白字压 rgba(255,255,255,.22)（在浅底上等于压白底，1.06:1） */
html[data-paper]:not([data-theme="dark"]) .mo-scan-add {
  color: #FFFFFF !important;
  background: var(--ui-brand-600) !important;
  border-color: var(--ui-brand-600) !important;
}
html[data-paper]:not([data-theme="dark"]) .mo-scan-add:hover {
  background: var(--ui-brand-700) !important;
  border-color: var(--ui-brand-700) !important;
}


/* ---------------------------------------------------------------------------
  13.2 拿「发丝线色」当文字色 → 等于没有文字（1.07~1.20:1）
  --------------------------------------------------------------------------- */

/* .dr-c b 的默认色是 --ui-line-200；只有 is-x/is-a/is-b 三档才覆盖它，
   剩下"无档位"的柱子（.is-z 或没类）数字直接隐形。 */
html[data-paper]:not([data-theme="dark"]) #view .dr-c b { color: var(--ui-ink-400) !important; }
html[data-paper]:not([data-theme="dark"]) #view .dr-c.is-x b { color: var(--ui-danger-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view .dr-c.is-a b { color: var(--ui-warn-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view .dr-c.is-b b { color: var(--ui-ink-900) !important; }

/* 跨工段对账：守恒式的「=」和「—（首道）」用的也是线色 */
html[data-paper]:not([data-theme="dark"]) #view :is(.flow-page .fl-id-op, .flow-page .fl-dim, .ps-row.is-zero .ps-v u) {
  color: var(--ui-ink-400) !important;
}


/* ---------------------------------------------------------------------------
  13.3 危险字压粉底：#C0392B(4.45:1) → --ui-danger-ink(#B3202E, 5.78:1)
  --------------------------------------------------------------------------- */

/* 覆盖 skin.css 里那条 `html:not([data-theme="dark"]) :is(…) { color:#C0392B !important }`：
   它同时管着「设备状态签」（.dv-tag-pending 40 处 + .dv-tag-maint 25 处）和红色徽标。 */
html[data-paper]:not([data-theme="dark"]) #view
  :is(.dv-tag.dv-tag-pending, .dv-tag.dv-tag-maint, .badge.b-red, .badge.b-danger, .ui-pill.is-danger, .bp-tag.tone-a) {
  color: var(--ui-danger-ink) !important;
}


/* ---------------------------------------------------------------------------
  13.4 「大数 / 数字」拿图形色当字色
  --------------------------------------------------------------------------- */

/* 综合查询的 4 个 KPI 大数是 JS 内联色（#10B981 绿 / #E8930C 琥珀 …），
   40px 大字按 WCAG 也要 3.0:1，实测 2.33~2.42:1。内联样式只能靠 !important 压。 */
html[data-paper]:not([data-theme="dark"]) #view .q-kpi-val { color: var(--sk-ink) !important; }

/* 工序看板「本地台账 0」：skin.css 里写死的 #8b8b8b（2.21:1） */
html[data-paper]:not([data-theme="dark"]) #view .board .sthc.is-zero {
  color: var(--ui-ink-400) !important;
  background: var(--ui-bg-page) !important;
}

/* 页签上的小字（英文名 / 计数）：未选中压浅蓝 2.55:1，选中态更是白字压亮蓝 3.2:1 */
html[data-paper]:not([data-theme="dark"]) #view
  :is(.ov-tabs button, .oc-tabs .tab, .mqz-tab, .fqc-tab, .rp-tab, .seg, .segment, .pd-seg, .tab) :is(i, small) {
  color: var(--ui-ink-400) !important;
}
/* 同上：页内页签的选中态已改走 §27 的淡底 + 墨色字，这里不再给它钉白字 */
html[data-paper]:not([data-theme="dark"]) #view
  :is(.oc-tabs .tab.active, .mqz-tab.on, .fqc-tab.on, .rp-tab.on, .seg.on, .segment.on, .pd-seg.on, .tab.active) :is(i, small) {
  color: rgba(255, 255, 255, .92) !important;
}


/* ---------------------------------------------------------------------------
  13.5 显式保留浅色（**只有"真的不是信息"的才允许在这里**）
  ---------------------------------------------------------------------------
  §1 把 --ui-ink-300 提到 #585858 之后，下面这几类会跟着一起变黑。
  它们要么是纯装饰、要么是 WCAG 明确豁免的"非活动控件"、要么是设计水印，
  所以这里单独钉回浅灰（2.2:1），并写清楚为什么：
   ========================================================================== */

/* ① 箭头 / 分隔符：纯装饰，不承载信息 */
html[data-paper]:not([data-theme="dark"]) :is(.sep, .pd3g-arw) { color: #767676 !important; }

/* ② "—" 空值占位：空就是空，不承载信息 */
html[data-paper]:not([data-theme="dark"]) #view :is(.mqz-fb-none, .is-na, .dg-due .dg-wkc-t > b.is-na) {
  color: #767676 !important;
}

/* ③ 禁用态控件：WCAG 2.2 对"非活动界面组件"豁免（键盘焦点环仍在，见 §8） */
html[data-paper]:not([data-theme="dark"]) :is(.la-go[disabled], .mo-submit[disabled]) { color: #767676 !important; }

/* ④ 滚动条滑块：是"控件背景"不是文字，跟着变黑会非常抢视线 */
html[data-paper]:not([data-theme="dark"]) .app *::-webkit-scrollbar-thumb { background: #cbcbcb; background-clip: content-box; }
html[data-paper]:not([data-theme="dark"]) .app *::-webkit-scrollbar-thumb:hover { background: #ADB1B6; background-clip: content-box; }
html[data-paper]:not([data-theme="dark"]) .app * { scrollbar-color: #cbcbcb transparent; }

/* ⑤ 成品质检卡右上角的巨大序号（01/02/03/04）是设计水印，故意极淡：
      它重复的是卡片排列顺序，删掉也不丢信息 ⇒ 保持原样，不改。 */


/* ===========================================================================
   14. 第二轮（2026-10-08）：把 380 → 90 之后剩下的系统性项清掉
   ---------------------------------------------------------------------------
   13 节之后重跑审计还剩 90 个，归因后分两种：**该修的 47 个** 和
   **13.5 里明确豁免的 43 个**（箭头/破折号/禁用/水印）。这一节清前面那 47 个。
   ========================================================================== */

/* —— 14.1 「实色语义色」被当文字色 ——
   --ui-warn-solid(#D97706) 本来是**填充色**（进度条/实心按钮），却被大量当字色用：       */
/*   运营分析 / 合成工序 的「9天」「合成中」「×30」… 六处来源合计 16 个元素，
     白字压它当按钮底也只有 3.19:1。浅色下把它压到 --ui-warn-ink 同族更深的一档，
     当字色（白底 6.4:1）和当底色（同值互为前景/背景 5.0:1）两头都成立。 */
html[data-paper]:not([data-theme="dark"]) {
  --ui-warn-solid: #A94E08;   /* 白字压它 5.56:1；它当字色压"×30"那层浅琥珀底 4.90:1 */
  --ui-warn-ink: #9A4708;
}

/* —— 14.2 选中态页签：亮蓝实心 #797979 上的白字只有 3.21:1 ——
   改成纸白主题的墨蓝渐变（--sk-accent-2 → --sk-accent-deep），白字 5.4:1，
   而且比原来的亮蓝更贴"墨线"这套语言。 */
/* ⚠ 2026-10-08 起 `.ov-tabs button.on` 从本条的名单里**摘掉**：页内页签的选中态改由 §27 处理
   （淡底 + 墨色左条）。不摘不行 —— 本条的 `:is()` 参数里 `.oc-tabs .tab.active` 是 (0,3,0)，
   整条因此达到 (1,5,1)，比 §27 的 (1,4,2) 高，会在 §27 后面继续把页签涂成墨蓝渐变
   （实测：§27 写了 !important 也压不住，页面里那颗页签一直是深色块）。 */
html[data-paper]:not([data-theme="dark"]) #view
  :is(.oc-tabs .tab.active, .mqz-tab.on, .fqc-tab.on, .rp-tab.on,
      .seg.on, .segment.is-on, .pd-seg.on, .tab.active, .tab.on) {
  background: linear-gradient(180deg, var(--sk-accent-2) 0%, var(--sk-accent-deep) 100%) !important;
  border-color: var(--sk-accent-deep) !important;
}

/* —— 14.3 青色 --pl-cyan(#0C9AB8) 当字色：2.84~3.04:1 ——
   --pl-cyan 是"氨解工序"的功能色，做图形/描边没问题，做字色要降到 --pl-cyan-ink。 */
html[data-paper]:not([data-theme="dark"]) #view
  :is(.flow-page .fl-id-ok, .am-badge.cyan, .cyc-ws-num.ship, .fs-card.fs-active .fs-card-value) {
  color: var(--pl-cyan-ink) !important;
}

/* —— 14.4 页脚小字压在浅灰蓝/浅青底上 4.0~4.5:1 ——
   （.sub 说明句、分页信息、"--" 注释）再压一档到 --ui-ink-500。 */
html[data-paper]:not([data-theme="dark"]) #view
  :is(.sub, .rm-pager-info, .ui-count, .oc-count, .sp-count, .tbl-count, [class$="-pager"], [class*="pager"]) {
  color: var(--ui-ink-500) !important;
}

/* —— 14.5 上面用的 --pl-cyan-ink / --pl-pink-ink 在深色下从没被覆盖过 ——
   tokens.css 只在 `:root`（＝浅色）给了这两个值，深色块漏了。
   app.js 的「合作部门」标签从本轮起开始用它们当字色 ⇒ 这里补深色版，
   否则深色下会从"亮青/亮品红"退化成"暗青压暗底"。 */
html[data-paper][data-theme="dark"] {
  --pl-cyan-ink: #6FD3E8;
  --pl-pink-ink: #F09CC4;
}

/* —— 14.6 JS 内联写死的「图形色当字色」兜底 ——
   还有几处颜色是**写死在 JS 模板字符串里**的（不在 CSS 里，令牌改不到）：
   `style="color:#D97706"`（合成工序「合成中」/「×30」）、`color:#6e6e6e`（「×24」）、
   `color:#0C9AB8`（生产动态「26」）… 逐个改 JS 调用点会漏，这里按**内联样式字符串**兜住。

   ⚠ 为什么带两个 :not()：CSS 的 `[style*=…]` 是**子串**匹配，
   `background-color:#D97706` 和 `border-color:#D97706` 里都含有 `color:#D97706`。
   不排除它们的话，会把「琥珀底 + 白字」的实心按钮的字色也改深 —— 那就把按钮改坏了。
   排除之后，只命中"独立的 color 声明"。 */
html[data-paper]:not([data-theme="dark"]) #view [style*="color:#D97706"]:not([style*="background-color:#D97706"]):not([style*="border-color:#D97706"]) { color: var(--ui-warn-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view [style*="color:#6e6e6e"]:not([style*="background-color:#6e6e6e"]):not([style*="border-color:#6e6e6e"]) { color: var(--ui-brand-700) !important; }
html[data-paper]:not([data-theme="dark"]) #view [style*="color:#0C9AB8"]:not([style*="background-color:#0C9AB8"]):not([style*="border-color:#0C9AB8"]) { color: var(--pl-cyan-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view [style*="color:#EF4444"]:not([style*="background-color:#EF4444"]):not([style*="border-color:#EF4444"]) { color: var(--ui-danger-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view [style*="color:#10B981"]:not([style*="background-color:#10B981"]):not([style*="border-color:#10B981"]) { color: var(--ui-ok-ink) !important; }
html[data-paper]:not([data-theme="dark"]) #view [style*="color:#5e5e5e"]:not([style*="background-color:#5e5e5e"]):not([style*="border-color:#5e5e5e"]) { color: var(--ui-brand-700) !important; }


/* ===========================================================================
   15. 左侧导航 · 可读性与打磨（2026-10-08）
   ---------------------------------------------------------------------------
   用户原话：「把左侧导航栏好好给我优化一下，越做越丑了，标题竟然还显示不全」。

   ## 一、先把"标题显示不全"量出来（不是感觉）

   两级导航（类目轨 + 条目面板）是 2026-10-05 加的。实测 1920×1080 下逐条量
   `scrollWidth vs clientWidth`，**带数字角标的条目一律被截断**：

     合成工序(41 < 56) · 角标 100      ← 显示成「合…」
     接酯工序(47 < 56) · 角标 24       ← 显示成「接酯…」
     分装工序(54 < 56) · 角标 9        ← 显示成「分装…」
     重合登记(54 < 56) · 角标 8

   板面算术（都是实测值，不是估的）：
     面板 161 · 条目左右外边距 10+10（theme.css:423 的 `margin:2px 10px`）
     ⇒ 条目只剩 139；减内边距 22 = 117 给「图标 18 + 间隙 10 + 名字 56 + 间隙 10 + 角标 38」
     需要 132 ⇒ **差 15px**。谁都不让，于是唯一允许收缩的"名字"被 ellipsis 吃掉。

   注意：这一层跟窗口宽度无关 —— ui-scale.js 是给 `<html>` 加 zoom，
   布局的**本地像素**恒定（1920 与 1024 视口下量到的面板都是 161 本地 px），
   所以 1024 宽的窗口并不会更糟，改一处即可全宽度生效。

   ## 二、改法：让"名字"永远优先

     · 名字 `flex:0 0 auto` + `min-width:max-content` ⇒ 按内容宽度定死，**不可能再截断**；
     · 角标改成可让位的一侧（紧凑尺寸，省下 10px）；
     · 条目左右外边距 10 → 4、间隙 10 → 8（省 16px）；
     · 侧栏 258 → 272（面板多 14px）。
     净得 ≈ 40px，对着那 15px 的缺口是宽裕的；5 字条目（跨工段对账）也能连带塞下。

   ## 三、顺带修掉的三处"看起来像坏了"

     ① **角标颜色全被压成一片浅灰**。skin-paper 早前为了"侧栏统一灰"写了
        `background: var(--sk-rail-badge) !important`，把 app.css 的
        红/蓝/橙三级分级（>100 红 · ≤20 蓝 · 21~100 橙）一起压掉了 ——
        而"角标颜色"正是运维一眼看出哪里积压的唯一线索。这里按"墨色版"恢复分级。
     ② **角标入场动画会卡在第 0 帧**。`.nav-badge` 的 `nbPop`（scale .4→1）在
        `display:none → block` 切换（＝切类目）时会重播；实测抓到的中间帧是
        `matrix(0.4,…)` + `running/0`，看上去就是"角标坏了、字被挤没了"。
        这层动画对"数字角标"没有任何信息价值，纸白主题下直接关掉。
     ③ 面板标题（产线作业 · 五道工序）在窄面板下会被裁掉尾巴，改成"名字不缩、备注可省略"。

   ## 四、视觉打磨（形状，不只是颜色）

     · 类目轨：选中态从"白底描边"改成**实心墨蓝块 + 白图标白字**（一屏只有一个是实心，
       和参考平台的"当前所在类目"一致，比白对白清楚得多）；
     · 轨宽 66 → 68，给 4 字类目名留出呼吸位；
     · 面板滚动条留位（scrollbar-gutter: stable），切类目时不再左右抖 4px；
     · 条目 hover/选中沿用 §2 的墨色体系，只补一个更明确的左内嵌竖线。
   ========================================================================== */


/* —— 15.1 侧栏整体加宽 14px（面板是"条目名 + 角标"的预算来源） ——
   ⚠ 必须限定 >760px：≤760px 时 skin.css 把侧栏收成 64px 图标轨、
   条目面板变成 `position:fixed; left:64px` 的抽屉（手机导航）。
   媒体查询不加特异性，我这条 `html[data-paper] .sidebar` 会把它盖掉 ⇒ 手机布局会散。 */
@media (min-width: 761px) {
  html[data-paper] .sidebar { width: 272px; }
}

/* 2026-10-12 锚定菜单：窄屏也用贴着分类图标的内容卡片，不切换成整栏抽屉 */
@media (max-width: 760px) {
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel {
    position: fixed !important;
    inset: auto !important;
    /* ★ 2026-10-12 v31（用户：「导航条会被其他页面的显示内容给遮挡，这绝对是不可以的」）：
       1000 → 10001。原因：页面里的浮层全是挂 body 的 position:fixed + z-index 9999/10000
       （.mqs-menu ⋯菜单 / .mgw-recent 最近送检 / .mgw-pop 板图 / .drawer 详情抽屉 /
       各模块 modal-mask / midqc 加载蓝屏 10000），定位再准也难免与导航面板相交 ——
       只要相交，1000 就必然被它们盖住。10001 站在全部页面浮层之上、仍低于 toast(99999)。
       配套：nav-collapse.js 打开/切换导航时会主动收掉这些浮层，双保险。 */
    z-index: 10001 !important;
    box-sizing: border-box !important;
    padding: 8px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 13px !important;
    background: linear-gradient(160deg, #20294F 0%, #171E40 100%) !important;
    box-shadow: 0 16px 38px -18px rgba(5,10,28,.72), inset 0 1px 0 rgba(255,255,255,.07) !important;
    overflow: hidden !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel::before,
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel::after,
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-lights {
    display: none !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 34px !important;
    margin: 0 0 6px !important;
    padding: 0 3px 7px !important;
    border-bottom: 1px solid rgba(255,255,255,.11) !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > span {
    color: #F4F6FF !important;
    font-size: 12px !important;
    font-weight: 750 !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > i {
    color: #ADB8E3 !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-cat {
    max-height: calc(100vh - 110px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item {
    min-height: 35px !important;
    height: 35px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    color: #DCE4F7 !important;
    font-size: 12px !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover {
    background: rgba(255,255,255,.075) !important;
    color: #FFFFFF !important;
  }
  html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active {
    background: linear-gradient(90deg, rgba(92,123,238,.30), rgba(92,123,238,.15)) !important;
    color: #FFFFFF !important;
    box-shadow: inset 2px 0 0 #8EA4FF !important;
  }
}


/* —— 15.2 条目行：名字按内容宽度定死，永不省略 —— */
html[data-paper] .sidebar .nav-item {
  /* theme.css:423 是 `margin:2px 10px`（深色侧栏时代留的），纸白下不需要这么宽的外边距 */
  margin-left: 4px;
  margin-right: 4px;
  gap: 8px;
  padding: 10px 10px;
}
html[data-paper] .sidebar .nav-item > span:not(.nav-badge) {
  flex: 0 0 auto;
  min-width: max-content;   /* ★ 名字的"不可压缩下限"＝它的完整宽度 */
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}
html[data-paper] .sidebar .nav-item .nav-badge {
  flex: 0 1 auto;           /* 让位的一方换成角标 */
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  padding: 0 6px;
  font-size: 11px;
  animation: none;          /* 见 §15 三②：入场动画会重播并停在第 0 帧 */
  box-shadow: none;
}


/* —— 15.3 角标恢复"三级分级"配色（墨色版，白底侧栏上对比度都 ≥4.5:1） ——
   app.js 的分级：≤20 蓝(is-total) · 21~100 橙(is-warn) · >100 红(默认)。
   这里用"淡底 + 深字"而不是原来的"实底 + 白字"：纸白侧栏上不该出现实心红块，
   但**颜色的语义必须保留**。 */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item .nav-badge {
  background: rgba(178, 32, 46, .12) !important;
  color: var(--ui-danger-ink) !important;
  font-weight: 800;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item .nav-badge.is-total {
  background: rgba(67,67,67, .12) !important;
  color: var(--sk-accent) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item .nav-badge.is-warn {
  background: rgba(154, 71, 8, .14) !important;
  color: var(--ui-warn-ink) !important;
}
/* 深色版：底色提亮、字用浅色（延续 §10 的做法） */
html[data-paper][data-theme="dark"] .sidebar .nav-item .nav-badge {
  background: rgba(255, 154, 165, .18) !important;
  color: #FFB3BC !important;
  animation: none;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  padding: 0 6px;
  font-size: 11px;
}
html[data-paper][data-theme="dark"] .sidebar .nav-item .nav-badge.is-total {
  background: rgba(193,193,193, .20) !important;
  color: #d0d0d0 !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-item .nav-badge.is-warn {
  background: rgba(245, 199, 126, .20) !important;
  color: #F5C77E !important;
}


/* —— 15.4 类目轨：实心墨蓝选中 + 4 字类目名不换行 —— */
html[data-paper] .sidebar .nav-rail {
  padding: 6px;
  gap: 6px;
  scrollbar-gutter: stable;
}
@media (min-width: 761px) {
  /* 手机档（≤760px）侧栏固定 64px、抽屉从 left:64px 滑出，轨宽必须跟着 64，不能变 68 */
  /* ⚠ 要带 :not([data-theme="dark"]) —— skin.css:1868 那条 E 皮肤规则是
     `html[data-skin="E"]:not([data-theme="dark"]) .sidebar .nav-rail{width:66px}`，
     特异性 (0,4,1) 压过 (0,3,1)；不带这个 :not 的话我写的 68px 根本不生效（实测就是 66）。 */
  html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail { width: 68px; }
  /* 深色档的轨宽对齐同一个数：skin.css 深色块给的是 62，两个主题轨宽不一致会显得"两套东西" */
  html[data-paper][data-theme="dark"] .sidebar .nav-rail { width: 68px; }
}
@media (max-width: 760px) {
  /* ★ 顺手修一个既有 bug：≤760px 时 skin.css:192 的 `.sidebar{width:258px}`
     排在 app.css 那条 `@media(max-width:760px){.sidebar{width:64px}}` **之后**，
     媒体查询不加特异性 ⇒ 手机档拿到的是 258px，而条目面板是 `position:fixed; left:64px`，
     于是抽屉把类目轨**压掉 14px**（实测 420px：轨 12~78、抽屉从 64 开始，
     轨上的「产线作业」被切掉第一个字）。这里把 64px 明确钉回来。 */
  html[data-paper] .sidebar { width: 64px; }
  html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail { width: 64px; }
  html[data-paper][data-theme="dark"] .sidebar .nav-rail { width: 64px; }
}
html[data-paper] .sidebar .nr-btn {
  min-height: 56px;
  border-radius: 10px;
  font-size: 11px;
  letter-spacing: 0;
  gap: 4px;
  padding: 6px 2px;
}
html[data-paper] .sidebar .nr-btn > span {
  white-space: nowrap;
  letter-spacing: 0;
  line-height: 1.1;
}
html[data-paper] .sidebar .nr-btn svg { width: 19px; height: 19px; }

html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn { color: var(--sk-rail-txt-2); }
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn:hover {
  background: var(--sk-rail-hover);
  color: var(--sk-rail-txt-hi);
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn.on,
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn.on:hover {
  background: linear-gradient(180deg, var(--sk-accent-2), var(--sk-accent-deep));
  color: #FFFFFF;
  box-shadow: 0 8px 18px -12px rgba(43,43,43, .85);
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn.on svg { color: #FFFFFF; opacity: 1; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn.on::before { display: none; }
/* 有积压的类目：红点挪到右上角外侧一点，实心块上更醒目 */
html[data-paper]:not([data-theme="dark"]) .sidebar .nr-btn .nr-dot {
  top: 6px; right: 8px;
  box-shadow: 0 0 0 2px var(--sk-rail-rail-bg);
}
html[data-paper][data-theme="dark"] .sidebar .nr-btn.on {
  background: linear-gradient(180deg, #5a5a5a, #393939);
  color: #f4f4f4;
}
html[data-paper][data-theme="dark"] .sidebar .nr-btn.on svg { color: #f4f4f4; opacity: 1; }


/* —— 15.5 面板：标题不裁、滚动条留位、选中条目更明确 —— */
html[data-paper] .sidebar .nav-panel {
  padding-right: 4px;
  scrollbar-gutter: stable;
}
html[data-paper] .sidebar .nav-panel-h {
  padding: 10px 6px 10px;
  gap: 6px;
  letter-spacing: .08em;
}
html[data-paper] .sidebar .nav-panel-h > span { flex: 0 0 auto; white-space: nowrap; }
html[data-paper] .sidebar .nav-panel-h > i {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 选中条目：左内嵌竖线改用主题的墨蓝（原来那条在 margin 变窄后位置会飘） */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.active,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.on {
  background: var(--sk-accent-soft);
  box-shadow: inset 2px 0 0 var(--sk-accent);
}
html[data-paper] .sidebar .nav-item.active::before,
html[data-paper] .sidebar .nav-item.on::before { display: none; }


/* ===========================================================================
   16. 左侧导航 · 收窄 / 去搜索 / 换配色 / 去缝（2026-10-08 第二轮）
   ---------------------------------------------------------------------------
   用户四条要求，逐条对应：
     ① 「收窄一点」          → 侧栏 272 → 236（轨 68 → 62，条目内边距 10 → 9，图标 18 → 17）
     ② 「把搜索功能去掉」    → 侧栏搜索框整块 display:none（只做浅色主题；深色一并去掉，
                               免得两个主题一个有一个没有）
     ③ 「换一种合理的配色」  → 见下：改成「钢蓝墨 + 冷灰」的冷色系（原来是偏暖的藏青 + 蓝调灰）
     ④ 「左栏和右栏之间那道缝隙」→ **去掉**。那道缝就是类目轨的灰底色带造成的：
        轨 #f6f6f6 压在白面板旁边 ⇒ 视觉上被切成"两块砖 + 中间一道白沟"。
        现在轨和面板同底（纯白），层级改由**形状**表达（选中的实心墨块 / 面板标题的发丝线），
        不再靠底色分区 ⇒ 缝自然消失。侧栏右边缘那条 1px 硬线也一起去掉：
        侧栏是 #FFFFFF、页面底是 #f5f5f5，本来就有 4% 的明度差，够分开了，
        那条线只是"多画了一笔"。手机上（≤760px）侧栏与内容必须分开，那条线保留。

   ## 新配色：钢蓝墨 + 冷灰（不再用藏青 + 蓝调灰）

     旧：accent #434343（藏青，偏暖）· 文字 #424242（暖灰）
     新：accent #4c4c4c（钢蓝墨，更冷更清）· 深档 #333333 · 文字 #414141（中性）· 次级 #616161
     选中：实心钢蓝墨渐变块（类目轨）/ #f0f0f0 淡底 + 2px 墨条（条目面板）
     悬停：统一 #f7f7f7（一个值，不再有 #f4f4f4 / rgba(...) 两种）
     分隔：统一 #f0f0f0（只有面板标题下面那一根，别处不画线）

   为什么这样"合理"：这套蓝只用于**导航自身的状态**，不碰各工序的功能色
   （合成蓝 / 氨解青 / 接酯金 / 纯化绿 / 分装粉），所以不会和图表语义打架；
   冷灰比暖灰更贴"纸白·墨线"的墨，也不会让侧栏显脏。

   ⚠ 本节覆盖 §15.1 / §15.4 / §15.5 里的宽度与轨底色，以本节为准（两节都留着，
     回退时先删 §16 就回到"上一版"）。
   ========================================================================== */

html[data-paper] {
  --nav-txt: #414141;          /* 条目名 */
  --nav-txt-2: #616161;        /* 类目名 / 面板副标 */
  /* 极弱档：原来给 #838383 = 白底 2.65:1 —— 侧栏品牌副标 / 连接状态用它，
     42 页全中（对比度审计从 55 涨到 187 的主因）。压到 #71767D = 4.58:1。 */
  --nav-txt-3: #71767D;
  --nav-hover: #f7f7f7;
  --nav-active-bg: #f0f0f0;
  --nav-ink: #4c4c4c;
  --nav-ink-deep: #333333;
  --nav-line: #f0f0f0;
  --nav-surface: #FFFFFF;      /* 红点描边用：要和轨底同色才能把点"垫"起来 */
}
html[data-paper][data-theme="dark"] {
  --nav-txt: #d0d0d0;
  --nav-txt-2: #858585;
  /* 深底上的"极弱档"要比浅色**更亮**：#6b6b6b 在 #1a1a1a 上只有 4.3:1（42 页全中），
     对齐 §10 里侧栏副标一直在用的 #858585 ⇒ 6.8:1。 */
  --nav-txt-3: #858585;
  --nav-hover: rgba(255, 255, 255, .06);
  --nav-active-bg: rgba(163,163,163, .16);
  --nav-ink: #868686;
  --nav-ink-deep: #616161;
  --nav-line: rgba(255, 255, 255, .09);
  --nav-surface: #1a1a1a;
}


/* —— 16.1 收窄到 236px —— */
@media (min-width: 761px) {
  html[data-paper] .sidebar { width: 244px; }
  html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail { width: 62px; }
  html[data-paper][data-theme="dark"] .sidebar .nav-rail { width: 62px; }
}


/* —— 16.2 去掉侧栏搜索（含它占的高度） —— */
html[data-paper] .sidebar .nav-search { display: none !important; }
html[data-paper] .sidebar nav { margin-top: 2px; }


/* —— 16.3 去缝：类目轨与条目面板同底；右边缘不再画硬线 ——

   ⚠⚠ 本节后半段全部带 !important，不是偷懒 ——
   本文件 §3 / §10 早前**已经用 !important 把整个侧栏钉死过**（见 350-380、510-540 两段注释：
   当时是为了压掉 E 皮肤那批 `[data-nav="ink"]` 的深色侧栏规则），包括：
     侧栏底/边线、类目轨底色、.nr-btn 与 .nr-btn.on 的字色与底色、.nav-item 的常态/悬停/选中。
   不带 !important 或特异性不够，本节规则**一条都不会生效**（实测：轨道底色仍是 #f6f6f6、
   选中态仍是 rgba(67,67,67, .07)、侧栏仍留 1px 边线 —— 我第一版就是栽在这里）。
   所以下面统一用「与它们同级的选择器 + !important + 更靠后的位置」来接管。 */

html[data-paper]:not([data-theme="dark"]) .sidebar {
  border-right: 0 !important;
  box-shadow: none !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail {
  background: transparent !important;
  border-right: 0 !important;
  border-radius: 0;
  padding: 2px 6px 6px;
}
html[data-paper][data-theme="dark"] .sidebar {
  border-right: 0 !important;
  box-shadow: none !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-rail {
  background: transparent !important;
  border-right: 0 !important;
  border-radius: 0;
  padding: 2px 6px 6px;
}
html[data-paper] .sidebar .nav-body { gap: 6px; margin-top: 0; }
/* 手机上侧栏与内容是"浮层 + 底"，必须留一条线分开 */
@media (max-width: 760px) {
  html[data-paper]:not([data-theme="dark"]) .sidebar { border-right: 1px solid var(--nav-line) !important; }
  html[data-paper][data-theme="dark"] .sidebar { border-right: 1px solid var(--nav-line) !important; }
}


/* —— 16.4 类目轨：一条文字化的竖列，选中＝实心钢蓝墨块 —— */
/* ⚠ 这一组为什么多写一个 `body`：
   本文件 §3 有一条 `html[data-paper]:not([data-theme="dark"]) .sidebar :is(
   .nav-group .gt, .nav-panel-h, .conn, .conn span, .nav-rail .nr-btn, …) { color: … !important }`，
   `:is()` 取参数里最高的特异性 —— 那个列表里 `.nav-pin .np-h em` 是 (0,2,1)，
   于是整条是 **(0,5,2)**，比我原来写的 (0,4,1)/(0,5,1) 都高 ⇒ 类目名的字色一直是它说了算
   （实测：选中的类目块已经是钢蓝墨，字却还是灰色）。
   加一个 `body` 把这个类型选择器带上，就变成 (0,5,2)/(0,6,2)，再靠"文件更靠后"接管。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn {
  min-height: 54px;
  border-radius: 10px;
  gap: 6px;
  padding: 8px 2px;
  color: var(--nav-txt-2) !important;
  background: transparent !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > span,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > span {
  font-size: 11px; font-weight: 700; letter-spacing: .2px;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn svg { width: 18px; height: 18px; opacity: .7; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:hover {
  background: var(--nav-hover) !important; color: var(--nav-txt) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:hover svg { opacity: .95; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on {
  background: linear-gradient(180deg, var(--nav-ink), var(--nav-ink-deep)) !important;
  color: #FFFFFF !important;
  box-shadow: 0 10px 20px -14px rgba(51,51,51, .9);
}
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on {
  background: linear-gradient(180deg, #5a5a5a, #393939) !important;
  color: #f4f4f4 !important;
}
html[data-paper] .sidebar .nav-rail .nr-btn.on > span { font-weight: 800; letter-spacing: .2px; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on :is(svg, span) { color: #FFFFFF !important; opacity: 1; }
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on :is(svg, span) { color: #f4f4f4 !important; opacity: 1; }
html[data-paper] .sidebar .nr-btn.on::before { display: none !important; }
/* 有积压的类目：红点从"压在字上"挪到按钮右上角的留白里，并描一圈底色把它"垫"起来 */
html[data-paper] .sidebar .nr-btn .nr-dot {
  top: 5px; right: 5px; width: 6px; height: 6px;
  box-shadow: 0 0 0 2px var(--nav-surface);
}
html[data-paper] .sidebar .nr-btn.on .nr-dot { box-shadow: 0 0 0 2px var(--nav-ink); }


/* —— 16.5 条目面板：白底不分区，层级靠形状表达 —— */
html[data-paper] .sidebar .nav-panel {
  padding-right: 2px;
  /* ⚠ 不要再加 scrollbar-gutter:stable —— 类目面板最多 7 条、几乎不会滚动，
     但 stable 会**常驻预留 ~10px**，条目名+角标本来就差这 10px（实测 124 vs 134）。
     §15.5 里那句已在本节去掉。 */
  scrollbar-gutter: auto;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h,
html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h {
  padding: 4px 4px 10px;
  margin-bottom: 6px;
  color: var(--nav-txt-2) !important;
  border-bottom: 1px solid var(--nav-line);
  font-weight: 800;
  letter-spacing: .14em;
}
html[data-paper] .sidebar .nav-panel-h > i { color: var(--nav-txt-3) !important; }

html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item {
  color: var(--nav-txt) !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-item { color: var(--nav-txt) !important; }
/* ⚠ 同样要 `body` 提一级：skin.css 的 E 皮肤块用 (0,5,1) 写了
   `.sidebar .nav-item{padding:10px 12px;font-size:13px}` 与 `.nav-item svg{width:18px}`，
   不加就压不动它们（实测：我写的 padding:10px / svg:17px 完全没生效）。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item,
html[data-paper][data-theme="dark"] body .sidebar .nav-item {
  margin-left: 4px;
  margin-right: 4px;
  padding: 10px 10px;
  gap: 8px;
  border-radius: 9px;
  border: 0;
  font-weight: 600;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-item svg { width: 17px; height: 17px; opacity: .62; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item:hover,
html[data-paper][data-theme="dark"] .sidebar .nav-item:hover {
  background: var(--nav-hover) !important; color: var(--nav-txt) !important;
}
html[data-paper] .sidebar .nav-item:hover svg { opacity: .85; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.active,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.on {
  background: var(--nav-active-bg) !important;
  color: var(--nav-ink) !important;
  font-weight: 800;
  box-shadow: inset 2px 0 0 var(--nav-ink) !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-item.active,
html[data-paper][data-theme="dark"] .sidebar .nav-item.on {
  background: var(--nav-active-bg) !important;
  color: var(--nav-ink) !important;
  font-weight: 800;
  box-shadow: inset 2px 0 0 var(--nav-ink) !important;
}
html[data-paper] .sidebar .nav-item.active svg,
html[data-paper] .sidebar .nav-item.on svg { opacity: 1; color: inherit !important; }
html[data-paper] .sidebar .nav-item.active::after,
html[data-paper] .sidebar .nav-item.on::after { display: none !important; }

/* 面板副标 / 底部状态 / 退出登录一起并入新灰阶，别留旧色 */
html[data-paper]:not([data-theme="dark"]) body .sidebar :is(.conn, .conn span, .side-foot, .brand .sub),
html[data-paper][data-theme="dark"] body .sidebar :is(.conn, .conn span, .side-foot, .brand .sub) {
  color: var(--nav-txt-3) !important;
}
html[data-paper] .sidebar .side-foot { border-top: 1px solid var(--nav-line); }


/* ===========================================================================
   17. 给「该有颜色」的卡片上色（2026-10-08 第三轮）
   ---------------------------------------------------------------------------
   用户原话：「做的再精美一点，没必要死磕白色，像 KPI 卡片需要加颜色的就加颜色」。

   ## 一、为什么现在满屏白

   两段历史叠出来的：
     ① 2026-09 那版是「深色指挥带 + 高饱和实心彩卡」，被嫌"太重"；
     ② 2026-10-05 的整体回调把 `.ov-act-c / .ov3-card / …` 一大票卡片家族
        **统一压成同一个白色渐变**（skin.css:2054 那条 `:is(…)` 白卡规则），
        连 `theme.css` 里本来写好的 `.ov-act-c.is-danger{background: var(--ui-danger-bg)}`
        也一并压掉了 —— 于是"语义色只剩图标那一口气"。
   ⇒ 结论：不是没设计，是**白卡规则的特异性把语义底色全吃了**。

   ## 二、这一轮的分工原则（避免又回到"高饱和实心块"）

     · **色相认身份**：每张 KPI 卡有自己的 hue（rate 青碧 / wip 钢蓝 / over 朱红 /
       stage 靛 / device 石墨），一眼分得清是哪一类指标；
     · **色深认健康**：`tone-a`（不达标 / 有异常）时**大数转红**、左缘条转红，
       卡面仍是自己的浅色底 —— 既有颜色，又不是"每张卡都在报警"；
     · 上色只到「浅底 + 深字 + 一道左缘条」为止，不铺满、不用实心块。

   所有色值都是"墨色"档：数字压在各自的浅底上 ≥5.4:1，仍满足正文对比度要求。
   ========================================================================== */

html[data-paper]:not([data-theme="dark"]) {
  --h-cyan-ink: #0D6B75;  --h-cyan-tint: #F1F9FA;  --h-cyan-line: #CDE7EB;  --h-cyan-solid: #1293A4;
  --h-brand-ink: #4c4c4c; --h-brand-tint: #f6f6f6; --h-brand-line: #e2e2e2; --h-brand-solid: #585858;
  --h-danger-ink: #B3202E; --h-danger-tint: #FDF3F4; --h-danger-line: #F3D3D7; --h-danger-solid: #DC3A4C;
  --h-indigo-ink: #5d5d5d; --h-indigo-tint: #f8f8f8; --h-indigo-line: #e6e6e6; --h-indigo-solid: #848484;
  --h-slate-ink: #525252;  --h-slate-tint: #f6f6f6;  --h-slate-line: #e3e3e3;  --h-slate-solid: #626262;
  --h-warn-ink: #9A4708;   --h-warn-tint: #FDF6EE;   --h-warn-line: #F2DDC2;   --h-warn-solid: #C9761A;
}
html[data-paper][data-theme="dark"] {
  --h-cyan-ink: #6FD3E0;  --h-cyan-tint: rgba(18, 147, 164, .12);  --h-cyan-line: rgba(111, 211, 224, .26);  --h-cyan-solid: #4FBFCE;
  --h-brand-ink: #9e9e9e; --h-brand-tint: rgba(107,107,107, .14); --h-brand-line: rgba(193,193,193, .26); --h-brand-solid: #868686;
  --h-danger-ink: #FF9AA5; --h-danger-tint: rgba(220, 58, 76, .14); --h-danger-line: rgba(255, 154, 165, .26); --h-danger-solid: #E04553;
  --h-indigo-ink: #cdcdcd; --h-indigo-tint: rgba(161,161,161, .14); --h-indigo-line: rgba(205,205,205, .26); --h-indigo-solid: #999999;
  --h-slate-ink: #999999; --h-slate-tint: rgba(255, 255, 255, .05); --h-slate-line: rgba(255, 255, 255, .10); --h-slate-solid: #787878;
  --h-warn-ink: #F5C77E;  --h-warn-tint: rgba(201, 118, 26, .16);  --h-warn-line: rgba(245, 199, 126, .26);  --h-warn-solid: #E0A040;
}


/* —— 17.1 KPI 卡：浅色底 + 左缘色条 + 墨色数字 ——
   ⚠ 特异性要压过 skin.css:2054 那条 `html[data-skin="E"]:not([data-theme="dark"]) #view :is(…){background:…}`，
   所以这里必须带 `#view`；`data-hue` 再加一个属性，抬到 (1,5,1)。 */
/* ⚠ 只给"有身份"的卡上色：带 data-hue（本页 5 张）或带语义 tone-a/b/c。
   没有 tone 也没有 hue 的 .ov-kpi-d（其它页可能有）保持原来的白卡 ——
   一下子把全站 KPI 都染蓝，会比"该加颜色的加颜色"过头。 */
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d:is([data-hue], .tone-a, .tone-b, .tone-c),
html[data-paper][data-theme="dark"] #view .ov-kpi-d:is([data-hue], .tone-a, .tone-b, .tone-c) {
  --h-ink: var(--h-brand-ink); --h-tint: var(--h-brand-tint);
  --h-line: var(--h-brand-line); --h-solid: var(--h-brand-solid);
  background: linear-gradient(158deg, var(--h-tint) 0%, var(--ui-bg-card) 62%) !important;
  border-color: var(--h-line) !important;
}
/* 色相映射：先按语义（tone），再按指标身份（data-hue，写在后面 ⇒ 身份优先）。
   ⚠ 这一组必须和上面那条基础规则**同档特异性**（都是 (1,5,1) / 深色 (1,6,1)）才能靠"更靠后"接管；
   上一版写成 (1,3,1) 结果被基础规则反压，5 张卡全变成同一个品牌蓝（实测踩过）。 */
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d.tone-a,
html[data-paper][data-theme="dark"] #view .ov-kpi-d.tone-a { --h-ink: var(--h-danger-ink); --h-tint: var(--h-danger-tint); --h-line: var(--h-danger-line); --h-solid: var(--h-danger-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d.tone-b,
html[data-paper][data-theme="dark"] #view .ov-kpi-d.tone-b { --h-ink: var(--h-brand-ink); --h-tint: var(--h-brand-tint); --h-line: var(--h-brand-line); --h-solid: var(--h-brand-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d.tone-c,
html[data-paper][data-theme="dark"] #view .ov-kpi-d.tone-c { --h-ink: var(--h-slate-ink); --h-tint: var(--h-slate-tint); --h-line: var(--h-slate-line); --h-solid: var(--h-slate-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d[data-hue="rate"],
html[data-paper][data-theme="dark"] #view .ov-kpi-d[data-hue="rate"] { --h-ink: var(--h-cyan-ink); --h-tint: var(--h-cyan-tint); --h-line: var(--h-cyan-line); --h-solid: var(--h-cyan-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d[data-hue="wip"],
html[data-paper][data-theme="dark"] #view .ov-kpi-d[data-hue="wip"] { --h-ink: var(--h-brand-ink); --h-tint: var(--h-brand-tint); --h-line: var(--h-brand-line); --h-solid: var(--h-brand-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d[data-hue="over"],
html[data-paper][data-theme="dark"] #view .ov-kpi-d[data-hue="over"] { --h-ink: var(--h-danger-ink); --h-tint: var(--h-danger-tint); --h-line: var(--h-danger-line); --h-solid: var(--h-danger-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d[data-hue="stage"],
html[data-paper][data-theme="dark"] #view .ov-kpi-d[data-hue="stage"] { --h-ink: var(--h-indigo-ink); --h-tint: var(--h-indigo-tint); --h-line: var(--h-indigo-line); --h-solid: var(--h-indigo-solid); }
html[data-paper]:not([data-theme="dark"]) #view .ov-kpi-d[data-hue="device"],
html[data-paper][data-theme="dark"] #view .ov-kpi-d[data-hue="device"] { --h-ink: var(--h-slate-ink); --h-tint: var(--h-slate-tint); --h-line: var(--h-slate-line); --h-solid: var(--h-slate-solid); }

/* 左缘那道色条：原来 3px、固定在 top/bottom 15px，且实测 5 张卡都是同一个浅蓝（tone 分色被打掉）。
   现在改成通高 4px、圆角、取本卡的 hue。 */
html[data-paper] #view .ov-kpi-d::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important; top: 14px !important; bottom: 14px !important; width: 4px !important;
  border-radius: 0 4px 4px 0;
  background: var(--h-solid) !important;
  opacity: 1 !important;
}
/* 大数取 hue 墨色；不达标 / 有异常时（tone-a）转红 —— 色相认身份、色深认健康 */
html[data-paper] #view .ov-kpi-d .k-vl b { color: var(--h-ink) !important; }
html[data-paper] #view .ov-kpi-d.tone-a .k-vl b { color: var(--ui-danger-ink) !important; }
/* 标签前加一枚同色小点，把"这是哪一类"再说一遍（很轻，不抢数字） */
html[data-paper] #view .ov-kpi-d .k-lb { display: flex; align-items: center; gap: 6px; }
html[data-paper] #view .ov-kpi-d .k-lb::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--h-solid); flex: none;
}
/* 迷你进度条：**只染"单段"的那种**。
   ⚠ 不能写成 `.k-bar i { background: … !important }` —— 「工序登记」「设备总数」两张卡用的是
   **多段堆叠条**，每一段 `<i style="background:var(--ui-brand-600)">` 都带内联底色，
   一刀切会把"按工序分色"的信息直接抹掉（实测：改成单色靛/石墨，看不出哪段是哪道工序）。
   `:not(:has(i + i))` = 只有一段的进度条（＝按时交付率那条）才跟随 hue。 */
html[data-paper] #view .ov-kpi-d .k-bar:not(:has(i + i)) i {
  background: linear-gradient(90deg, var(--h-solid), var(--h-ink)) !important;
}
html[data-paper] #view .ov-kpi-d.tone-a .k-bar:not(:has(i + i)) i {
  background: linear-gradient(90deg, #E36A78, var(--ui-danger-ink)) !important;
}
/* 迷你趋势线（.ov-spark 是单折线 + 面积）：跟随 hue。
   只作用于 .ov-spark，避免伤到 k-viz 里可能出现的别的图形。 */
html[data-paper] #view .ov-kpi-d .k-viz svg.ov-spark path { stroke: var(--h-solid) !important; }
html[data-paper] #view .ov-kpi-d .k-viz svg.ov-spark path[fill]:not([fill="none"]) { fill: var(--h-solid) !important; fill-opacity: .14 !important; }
html[data-paper] #view .ov-kpi-d .k-viz svg.ov-spark circle { fill: var(--h-solid) !important; }


/* —— 17.2 行动条（已超期 / 超过 48h / 今日要点）：把语义底色还给它们 ——
   同样是被 skin.css 那条白卡规则压掉的。这一层是"今天该动手的事"，
   用整条浅底把严重程度铺出来，比只染一个图标更抓得住眼睛。 */
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c { background: var(--ui-bg-card) !important; }
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-danger {
  background: linear-gradient(115deg, var(--ui-danger-bg) 0%, var(--ui-bg-card) 70%) !important;
  border-color: var(--ui-danger-line) !important;
  box-shadow: inset 3px 0 0 var(--ui-danger-solid), 0 18px 40px -34px rgba(46,46,46, .55) !important;
}
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-warn {
  background: linear-gradient(115deg, var(--ui-warn-bg) 0%, var(--ui-bg-card) 70%) !important;
  border-color: var(--ui-warn-line) !important;
  box-shadow: inset 3px 0 0 var(--ui-warn-solid), 0 18px 40px -34px rgba(46,46,46, .55) !important;
}
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-info {
  background: linear-gradient(115deg, var(--ui-info-bg) 0%, var(--ui-bg-card) 70%) !important;
  border-color: var(--ui-info-line) !important;
  box-shadow: inset 3px 0 0 var(--ui-info-solid), 0 18px 40px -34px rgba(46,46,46, .55) !important;
}
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-ok {
  background: linear-gradient(115deg, var(--ui-ok-bg) 0%, var(--ui-bg-card) 70%) !important;
  border-color: var(--ui-ok-line) !important;
  box-shadow: inset 3px 0 0 var(--ui-ok-solid), 0 18px 40px -34px rgba(46,46,46, .55) !important;
}
/* 深色档：同语义，用半透明色雾（深底上不能铺浅色块） */
html[data-paper][data-theme="dark"] #view .ov-act-c.is-danger { background: linear-gradient(115deg, var(--ui-danger-bg) 0%, var(--ui-bg-card) 72%) !important; border-color: var(--ui-danger-line) !important; box-shadow: inset 3px 0 0 var(--ui-danger-solid) !important; }
html[data-paper][data-theme="dark"] #view .ov-act-c.is-warn { background: linear-gradient(115deg, var(--ui-warn-bg) 0%, var(--ui-bg-card) 72%) !important; border-color: var(--ui-warn-line) !important; box-shadow: inset 3px 0 0 var(--ui-warn-solid) !important; }
html[data-paper][data-theme="dark"] #view .ov-act-c.is-info { background: linear-gradient(115deg, var(--ui-info-bg) 0%, var(--ui-bg-card) 72%) !important; border-color: var(--ui-info-line) !important; box-shadow: inset 3px 0 0 var(--ui-info-solid) !important; }
html[data-paper][data-theme="dark"] #view .ov-act-c.is-ok { background: linear-gradient(115deg, var(--ui-ok-bg) 0%, var(--ui-bg-card) 72%) !important; border-color: var(--ui-ok-line) !important; box-shadow: inset 3px 0 0 var(--ui-ok-solid) !important; }
/* 行动条的图标徽章：跟着语义走（浅底 + 深图标） */
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-danger .ov-act-ico { background: var(--ui-danger-solid) !important; border-color: var(--ui-danger-solid) !important; color: #FFFFFF !important; }
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-warn .ov-act-ico { background: var(--ui-warn-solid) !important; border-color: var(--ui-warn-solid) !important; color: #FFFFFF !important; }
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-info .ov-act-ico { background: var(--ui-info-solid) !important; border-color: var(--ui-info-solid) !important; color: #FFFFFF !important; }
html[data-paper]:not([data-theme="dark"]) #view .ov-act-c.is-ok .ov-act-ico { background: var(--ui-ok-solid) !important; border-color: var(--ui-ok-solid) !important; color: #FFFFFF !important; }


/* ===========================================================================
   17.3 工序看板那一排 KPI（.pk-card）：把「白纱」调薄，语义色让它透出来
   ---------------------------------------------------------------------------
   这排卡本来就是**实心语义渐变**：在产＝蓝 / 合作＝亮蓝 / 在制＝青 / 已发货＝蓝 /
   延期＝红 / 按时交付率＝绿（色值在 app.js 的 `grad:` 里，是内联 background）。
   2026-10-07 的 v5 精修给它们盖了一层 `radial-gradient(rgba(255,255,255,.975)→.68)`
   的"白纱"，说是"语义色只在角落留一口气" —— 实测那一口气几乎看不见，整排读起来就是白的。

   这里**只调薄白纱**，不动卡片自己的渐变色：
     · 文字区在左上角，白纱最厚（.93）⇒ 深色字仍然压得住；
     · 右下角透到 .54 ⇒ 每张卡的语义色自己显出来（不用按位置硬编码颜色，
       以后 app.js 改了 `grad`，这里自动跟随）；
     · 环 / 迷你条这类"图形"落在透出来的那一侧，正好借这层颜色做背景。 */
html[data-paper]:not([data-theme="dark"]) #view :is(.pk-card, .sp-kpi-card, .am-kpi-card)::after {
  background: radial-gradient(135% 140% at 0% 0%,
    rgba(255, 255, 255, .905) 0%,
    rgba(255, 255, 255, .865) 45%,
    rgba(255, 255, 255, .78) 80%,
    rgba(255, 255, 255, .70) 100%) !important;
}
/* 左缘那条"统一品牌蓝"的色条：卡身现在已经有各自的语义色了，再压一条蓝会互相打架
   （实测：延期红的卡配蓝条很别扭）⇒ .pk-card 上撤掉，颜色交给卡身自己说。
   .sp-kpi-card / .am-kpi-card 那两类常常没有内联底色，色条保留。 */
html[data-paper]:not([data-theme="dark"]) #view .pk-card::before { display: none !important; }
/* 卡面带浅色之后，11px 的标签用 --sk-ink-3(#585858) 实测只有 4.24~4.50:1（像素采样，
   按卡不同）—— 它是"最小号的说明字"，直接压到 --sk-ink-2（与副标同级）⇒ 6.5:1。 */
html[data-paper]:not([data-theme="dark"]) #view .pk-card .pk-label { color: var(--sk-ink-2) !important; }
/* 发货出库那两张"没圆环"的 KPI 卡，右侧原本是一个写死的「#」（见 app.js 的 sp-kpi-icon），
   现在换成每张卡自己的线性图标：尺寸/颜色按纸面浅色调来，别用白（白压在浅底上看不见）。 */
html[data-paper]:not([data-theme="dark"]) #view .sp-kpi-icon {
  width: 38px; height: 38px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: var(--sk-ink-2) !important;
  background: rgba(255, 255, 255, .66);
  border: 1px solid rgba(255, 255, 255, .9);
}
html[data-paper]:not([data-theme="dark"]) #view .sp-kpi-icon svg { width: 21px; height: 21px; }


/* ===========================================================================
   18. 订单中心：整页一屏装下（表体内部滚动，底部不留空）
   ---------------------------------------------------------------------------
   实测（1920×1080，`_qctest` 量的）：
     #view 高 987（93→1080）✅ 本身是满的，可是里面的块是**自然堆高**：
       顶部块 120 · 页头 68 · 筛选卡 168 · section.oc-tbl-wrap **976**（505 → 1481）
     ⇒ 表格面板比视口高 401px，必须滚动整页才能看到表底，底下还留空 —— 就是"没铺满"的观感。
   发货出库那页本来就是"表体在固定高度里滚"（.sp-tbl-wrap 高 477），所以这里把订单中心
   也对齐成同一套：`#view` 变成纵向 flex 容器，**最后一个块（表格面板）吃掉剩余高度**并在内部滚动。
   只作用于含 `.oc-tbl-wrap` 的页面（用 `:has()` 限定），其它页一个字不动。 */
html[data-paper] #view:has(.oc-tbl-wrap) {
  display: flex;
  flex-direction: column;
  overflow: hidden;              /* 滚动交给表体，整页不再滚 */
}
html[data-paper] #view:has(.oc-tbl-wrap) > .oc-tbl-wrap {
  flex: 1 1 auto;
  min-height: 0;                 /* 关键：flex 子项默认 min-height:auto 会撑破容器 */
  /* ⚠ 必须 !important：skin.css 里 `.oc-tbl-wrap{overflow:hidden auto}` 在前，压掉了这条，
     实测会变成 overflow:hidden ⇒ 下面的行被**裁掉且无法滚动**（比原来更糟）。 */
  overflow: auto !important;     /* 行多了在面板内部滚 */
}
/* 面板内部：表头/工具条不缩，表体吸收 */
html[data-paper] #view:has(.oc-tbl-wrap) > .oc-tbl-wrap > * { flex: 0 0 auto; }
html[data-paper] #view:has(.oc-tbl-wrap) > .oc-tbl-wrap { display: flex; flex-direction: column; }


/* ★ 2026-10-08 用户更正：「空列必须占一整列」—— 我上一版把空列收窄到 88px 是误读，
   已整段撤掉，空列恢复与其它列等宽（board 回到原 grid 8 等分）。
   用户真正指的是：**每一列下面还有一片空白**，见 §20。 */


/* ===========================================================================
   20. 工序看板：看板吃掉"剩余高度"，板下不再留一条空白
   ---------------------------------------------------------------------------
   ★ 用户两次纠正后确认的真正口径（2026-10-08）：
     · 「空列必须占一整列」⇒ 列宽一律等分（我早先把空列收窄到 88px 是误读，已撤）；
     · 「我指的是每列下面的这些空白」⇒ 指**整块看板下沿到窗口底部之间那条空白带**
       （不是托盘内部的余量），截图里就是那条浅色空带。

   实测（1920×1080）：
     改前 `.board` 379 → **1119**（固定高 740，底边**超出视口 39px**、整页还要滚 85px）；
     中途我把它改成"随内容" ⇒ 板底 1061，但板下留了空带，正是用户不要的那条。
   根因是 `theme.css:.board{height:clamp(340px, calc(100vh - 340px), 760px)}` —— **写死高度**，
   与上面页头/KPI 的实际高度无关，于是不是超出就是留空。

   改法（和"订单中心一屏装下"同一招）：把 `#view` 变成纵向 flex，让**看板吃掉剩余高度**：
     · 板顶到板底刚好是"视口 − 上面所有块" ⇒ 下面不留空白、也不会被裁；
     · 列恢复 `height:100%`（托盘下探到板底，空列照样占一整列）；
     · 卡多的列仍在列内滚动（.stcb 的 overflow 不动）。
   ========================================================================== */
html[data-paper] #view:has(.board) {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
/* ⚠ 实测踩坑：`.board` **不是 `#view` 的直接子元素**（中间还有一层页面容器），
   所以上一版写 `#view:has(.board) > .board` 完全不匹配、板子仍是写死的 740（底边 1119 超出视口）。
   这里改成"逐层打通"：直接子块默认不伸缩，**含有看板的那一层**吃掉剩余高度并自身也变纵向 flex，
   看板再在这一层里 flex:1 —— 包装层有几层都成立。 */
/* ⚠ 实测拿到的真实层级链（2026-10-08）：
     #view  →  div.view-fade  →  section.panel.board-panel  →  div.board  →  .stcol
   中间有**两层**包装，所以"只打通直接子块"是不够的（板子还是写死 740、底边 1095 超出视口 15px）。
   这里按实际类名逐层打通 —— 每层都 `flex:1 + min-height:0 + 纵向 flex`，最后一层（看板）吃掉剩余高度。 */
html[data-paper] #view:has(.board) > * { flex: 0 0 auto; }
html[data-paper] #view:has(.board) > .view-fade {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
}
html[data-paper] #view .view-fade > .board-panel {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
}
html[data-paper] #view .board-panel > .board {
  flex: 1 1 auto; min-height: 0;
  height: auto;          /* 交回给 flex 算，不再用写死的 clamp */
}
html[data-paper] #view .board > .stcol { height: 100%; }


/* ===========================================================================
   21. 工序看板：订单卡片（.ocard）视觉精修 —— 只做观感，不动结构
   ---------------------------------------------------------------------------
   用户：「订单卡片设计的精美一点」。
   ⚠ 先看清历史：app.js 里 ocardHtml 上方有一段注释，2026-09-26 那一轮**改版式被用户否掉、
     整段回退**了。所以这轮只改"看起来"，一个字都不动结构（od/oc/ometa/pbar/otags 的 DOM 不变）。

   四件事：
     ① **状态色条**：卡左缘 3px —— 延期=朱红、未生产=琥珀、正常=钢蓝墨。
        一眼分清"哪张要处理"，同时不靠整卡染色（纸白主题里整卡染色会跟托盘打架）。
     ② **层级**：订单号用等宽数字加粗（对齐、可扫读）；客户名降到次级灰；板号/行数用最小号。
     ③ **进度条**：2px→4px 圆角胶囊，轨道更浅、填充用状态色（原来跟卡片同色系、看不出来）。
     ④ **角标**：统一高度/圆角/间距，右对齐成一条，不再随字数抖动。
   ========================================================================== */
html[data-paper] #view .board .ocard {
  position: relative;
  padding: 12px 12px 10px 16px;
  border-radius: 12px;
  background: linear-gradient(180deg, #FFFFFF 0%, #fefefe 100%);
  border: 1px solid var(--ui-line-200);
  box-shadow: 0 1px 2px rgba(45,45,45, .05), 0 10px 22px -20px rgba(45,45,45, .5);
  overflow: hidden;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
html[data-paper] #view .board .ocard:hover {
  border-color: var(--ui-brand-100);
  box-shadow: 0 6px 18px -12px rgba(45,45,45, .45);
  transform: translateY(-1px);
}
/* ① 左缘状态条 */
html[data-paper] #view .board .ocard::before {
  content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--ui-brand-600);          /* 正常：钢蓝墨 */
}
html[data-paper] #view .board .ocard.over::before { background: var(--ui-danger-solid); }
html[data-paper] #view .board .ocard.unprod::before { background: var(--ui-warn-solid); }

/* ★★ 2026-10-08 让卡片"不够精美"的两个真凶（都是老样式，不是我加的）：
   ① `.ocard.over{animation:ovp 1.6s ease-in-out infinite}` —— 延期卡**无限脉冲闪烁**。
      车间大屏上几十张卡一起闪 = 廉价感，且一直在重绘（白烧 GPU）。
      ⇒ 关掉动画，改用"浅红晕 + 红发丝边"的静态处理：一样醒目，但不闪。
   ② `.ocard.unprod{ border:2px dashed … }` + 顶部 4px 渐变条 —— **蓝色虚线框**看起来像"没画完的草稿"。
      ⇒ 换成实线琥珀发丝边 + 浅琥珀晕，与左缘那条琥珀状态条同色系（那条已经承担了辨识）。 */
html[data-paper] #view .board .ocard.over {
  animation: none !important;
  background: linear-gradient(180deg, #FFF8F8 0%, #FFFDFD 100%) !important;
  border-color: var(--ui-danger-line) !important;
}
/* ★ 2026-10-09：上面那条"关掉延期卡脉冲"当初只关了**元素自身**的 animation；
   app.css 现在把红光挪到 `.ocard.over::after`（为了不动 box-shadow），这里一并压成静态浅红晕，
   保持"车间大屏几十张卡不一起闪"的原决定。 */
html[data-paper] #view .board .ocard.over::after {
  animation: none !important;
  opacity: 1 !important;
}
html[data-paper] #view .board .ocard.unprod {
  background: linear-gradient(180deg, #FFFBF4 0%, #FFFEFB 100%) !important;
  border: 1px solid var(--ui-warn-line) !important;
  box-shadow: 0 1px 2px rgba(45,45,45, .05) !important;
}
html[data-paper] #view .board .ocard.unprod::before {
  /* 老样式那条"顶部 4px 通栏渐变"与左缘状态条重复，去掉，只留左缘 */
  content: "" !important; top: 8px !important; bottom: 8px !important;
  left: 0 !important; right: auto !important; width: 3px !important; height: auto !important;
  border-radius: 0 3px 3px 0 !important;
  background: var(--ui-warn-solid) !important;
}
html[data-paper] #view .board .ocard.over .od { color: var(--ui-danger-ink); }
html[data-paper] #view .board .ocard.unprod .od { color: #8A4A06; }

/* 交期那一行（cardDueHtml 直接吐 <span>，没有容器类名）：
   用 `.ocard > span` 精确命中它 —— `.od/.oc/.ometa/.pbar/.otags` 都是 div，不会被误伤。
   加一道极淡的分隔上边线，让"单号+客户+板号"与"交期+已放置"分成两段。 */
html[data-paper] #view .board .ocard > span {
  font-size: 11px; font-variant-numeric: tabular-nums;
}
html[data-paper] #view .board .ocard > span:first-of-type {
  display: inline-block; padding-top: 8px; margin-top: 8px;
  border-top: 1px solid var(--ui-line-100);
  width: calc(100% - 0px);
}

/* ② 层级：单号等宽加粗 → 客户次级 → 板号/行数最小号 */
html[data-paper] #view .board .ocard .od {
  font-family: var(--mono, Consolas, monospace);
  font-size: 13px; font-weight: 800; letter-spacing: -.2px;
  color: var(--sk-ink);
}
html[data-paper] #view .board .ocard .oc {
  margin-top: 2px; font-size: 12px; color: var(--sk-ink-2);
}
html[data-paper] #view .board .ocard .ometa {
  margin-top: 6px; font-size: 11px; color: var(--sk-ink-3);
}
html[data-paper] #view .board .ocard .ometa-label { color: var(--sk-ink-3); }
html[data-paper] #view .board .ocard .ometa-qty {
  font-variant-numeric: tabular-nums; font-weight: 700; color: var(--sk-ink-2);
}

/* ③ 进度条：4px 胶囊 + 状态色填充 */
html[data-paper] #view .board .ocard .pbar {
  height: 4px; border-radius: 999px; margin-top: 8px;
  background: var(--ui-line-100);
  overflow: hidden;
}
html[data-paper] #view .board .ocard .pbar > i {
  display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, var(--ui-brand-600), var(--ui-brand-700));
}
html[data-paper] #view .board .ocard.over .pbar > i { background: linear-gradient(90deg, #E36A78, var(--ui-danger-ink)); }
html[data-paper] #view .board .ocard.unprod .pbar > i { background: linear-gradient(90deg, #E0A540, var(--ui-warn-ink)); }

/* ④ 角标：统一尺寸、右对齐成一条 */
html[data-paper] #view .board .ocard .otags {
  margin-top: 8px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
}
html[data-paper] #view .board .ocard .otags .badge {
  height: 18px; line-height: 18px; padding: 0 8px; border-radius: 999px;
  font-size: 11px; font-weight: 800; letter-spacing: 0;
}
/* 成品质检那几张卡也有浅色底（像素采样实测绿/粉底 rgb(207,227,218) / rgb(248,213,213)），
   压在浅底上的 10px 灰英文标只有 4.0:1 ⇒ 一起压到 --sk-ink-2。 */
html[data-paper]:not([data-theme="dark"]) #view :is(.fqc-qcard-en, .fqc-qmode-desc) { color: var(--sk-ink-2) !important; }
/* 环上那圈"未完成的轨道"原来写的是深底半透明白，透出颜色之后要改成浅底可读的灰 */
html[data-paper]:not([data-theme="dark"]) #view :is(.pk-card, .sp-kpi-card, .am-kpi-card) :is(.pk-ring-bg, .pk-ring-track) {
  stroke: rgba(28,28,28, .14) !important;
}
html[data-paper]:not([data-theme="dark"]) #view :is(.pk-card, .sp-kpi-card, .am-kpi-card) .pk-ring-pct {
  color: var(--sk-ink) !important; font-weight: 800 !important;
}


/* ===========================================================================
   17.4 交期砖（.dg-g.dg-gk）：tone-a/b/c 在 app.css 里**根本没写配色**
   ---------------------------------------------------------------------------
   app.js 给这四块砖传 tone: 'a'/'c'/'b'/'b'（逾期红 / 今天橙 / 明天蓝 / 风险蓝），
   但 app.css 只定义了 tone-n / tone-u 两种 —— 于是"逾期"和"明天到期"长得一模一样。
   这里按语义补齐（浅底 + 墨色数字 + 同色迷你条 + 同色图标）。 */
html[data-paper]:not([data-theme="dark"]) #view .dg-g.dg-gk.tone-a { background: linear-gradient(155deg, var(--h-danger-tint) 0%, var(--ui-bg-card) 64%) !important; border-color: var(--h-danger-line) !important; }
html[data-paper]:not([data-theme="dark"]) #view .dg-g.dg-gk.tone-b { background: linear-gradient(155deg, var(--h-brand-tint) 0%, var(--ui-bg-card) 64%) !important; border-color: var(--h-brand-line) !important; }
html[data-paper]:not([data-theme="dark"]) #view .dg-g.dg-gk.tone-c { background: linear-gradient(155deg, var(--h-warn-tint) 0%, var(--ui-bg-card) 64%) !important; border-color: var(--h-warn-line) !important; }
html[data-paper][data-theme="dark"] #view .dg-g.dg-gk.tone-a { background: linear-gradient(155deg, var(--h-danger-tint) 0%, var(--ui-bg-card) 66%) !important; border-color: var(--h-danger-line) !important; }
html[data-paper][data-theme="dark"] #view .dg-g.dg-gk.tone-b { background: linear-gradient(155deg, var(--h-brand-tint) 0%, var(--ui-bg-card) 66%) !important; border-color: var(--h-brand-line) !important; }
html[data-paper][data-theme="dark"] #view .dg-g.dg-gk.tone-c { background: linear-gradient(155deg, var(--h-warn-tint) 0%, var(--ui-bg-card) 66%) !important; border-color: var(--h-warn-line) !important; }
html[data-paper] #view .dg-g.dg-gk.tone-a { --tg-ink: var(--h-danger-ink); --tg-solid: var(--h-danger-solid); }
html[data-paper] #view .dg-g.dg-gk.tone-b { --tg-ink: var(--h-brand-ink); --tg-solid: var(--h-brand-solid); }
html[data-paper] #view .dg-g.dg-gk.tone-c { --tg-ink: var(--h-warn-ink); --tg-solid: var(--h-warn-solid); }
html[data-paper] #view .dg-g.dg-gk :is(.dg-g-v b, .dg-g-go, .dg-gk-ico) { color: var(--tg-ink, inherit) !important; }
html[data-paper] #view .dg-g.dg-gk .dg-gk-bar i { background: var(--tg-solid, currentColor) !important; }


/* ===========================================================================
   22. 工序看板订单卡片（.ocard）第二轮精修 —— 夺回被"去卡"抢走的立体感
   ---------------------------------------------------------------------------
   用户：「订单卡片设计的精美一点」→ 改完仍「还是不够精美」。所以这次先用
   `_qctest/board-inspect.cjs` 把**卡片的真实几何/字号/层叠**量出来再动手，
   不靠感觉改。1920×1080 浅色实测出来的三件事（2026-10-08）：

     ① .ocard 的真实样式 = 圆角 6px、box-shadow none、发丝边 1px
        —— 不是 §21 写的 12px + 双层阴影。因为本文件 §3「去卡」用的是
           `html[data-paper] #view :is(…, .ocard, …) { border-radius: var(--sk-r)!important;
                                                       box-shadow: none!important }`
           而 §21 那两条**没有 !important** ⇒ 全被压掉（实测 computed 就是 6px/none）。
        ⇒ 本节凡是"几何/阴影"一律带 !important，否则等于没写。

     ② .otags 的真实样式 = 140×20 的**空心胶囊**（padding 0 9px / 半径 999px / 1px 描边）
        —— 来自 skin.css 把「标签容器」也塞进了 `:is(.badge, …, .otags, …)` 的胶囊规则。
        截图里"合作"外面那一圈大框就是它（容器和标签各画了一个框，双层框最显廉价）。
        ⇒ 本节把容器还原成纯 flex 行，标签自己改成"软色底"。

     ③ §21 想给交期行加的那道分隔线写在 `.ocard > span` 上，而交期实际是
        **`.odue` 里的 span** ⇒ 那条规则一次都没命中（死代码）。
        ⇒ 本节把分隔线写到 `.odue` 自己身上。

   ★ 结构一个字不动：app.js 的 ocardHtml / cardDueHtml 不碰（2026-09-26 改版式被否过，
     所以这里全部是纯 CSS 覆盖，回退只需删掉本节）。
   ========================================================================== */

/* ① 立体感与圆角：必须 !important（§3 用 !important 把全站卡片抹平过） */
html[data-paper] #view .board .ocard {
  border-radius: 12px !important;   /* 与「登录卡圆润」同一口径：小卡也要有弧 */
  padding: 10px 12px 10px 14px !important;
  border: 1px solid var(--ui-line-200) !important;
  box-shadow: 0 1px 2px rgba(37,37,37, .05), 0 10px 20px -18px rgba(37,37,37, .55) !important;
}
html[data-paper] #view .board .ocard:hover {
  border-color: var(--ui-brand-500) !important;
  box-shadow: 0 8px 20px -14px rgba(37,37,37, .42) !important;
  transform: translateY(-1px);
}

/* ② 底色：浅色＝极淡顶白（不是纯白，白卡在浅灰托盘上会"发死"）；
   延期/未生产的暖冷晕用语义 token，两套主题都成立（深色下 token 自动变深底）。 */
html[data-paper]:not([data-theme="dark"]) #view .board .ocard { background: linear-gradient(180deg, #FFFFFF 0%, #fdfdfd 100%) !important; }
html[data-paper][data-theme="dark"] #view .board .ocard { background: var(--ui-bg-card) !important; }
/* ⚠ 一张卡可以**同时**是「延期」和「未生产」（实测就有这种卡）。§21 把两组规则都写成
   !important 且同特异性 ⇒ 谁写在后面谁赢（结果是一张卡被染成琥珀色）。
   本节用 `:not(.over)` 把口径写死：**延期优先**（更紧急），未生产只保留角标。 */
html[data-paper]:not([data-theme="dark"]) #view .board .ocard.unprod:not(.over) { background: linear-gradient(180deg, #FFFBF3 0%, #FFFEFC 100%) !important; }
html[data-paper][data-theme="dark"] #view .board .ocard.unprod:not(.over) { background: linear-gradient(180deg, var(--ui-warn-bg) 0%, var(--ui-bg-card) 72%) !important; }
html[data-paper] #view .board .ocard.unprod:not(.over) { border-color: var(--ui-warn-line) !important; }
html[data-paper]:not([data-theme="dark"]) #view .board .ocard.over { background: linear-gradient(180deg, #FFF6F7 0%, #FFFDFD 100%) !important; }
html[data-paper][data-theme="dark"] #view .board .ocard.over { background: linear-gradient(180deg, var(--ui-danger-bg) 0%, var(--ui-bg-card) 72%) !important; }
html[data-paper] #view .board .ocard.over { border-color: var(--ui-danger-line) !important; }
html[data-paper] #view .board .ocard.over::before { background: var(--ui-danger-solid) !important; }
html[data-paper] #view .board .ocard.over .od { color: var(--ui-danger-ink) !important; }
html[data-paper] #view .board .ocard.over .pbar > i { background: var(--ui-danger-solid) !important; }

/* ③ 左缘状态条：两端收圆、离开卡片左上角的圆角一点，不再像"贴了一条胶带" */
html[data-paper] #view .board .ocard::before {
  left: 1px !important; top: 9px !important; bottom: 9px !important; width: 3px !important;
  border-radius: 2px !important;
}
/* theme.css 还给逾期卡单独画了一条 `::after` 红条（left:0/半径 0 4 4 0）——和上面的
   状态条重叠，逾期卡的条会变成 4px 宽、正常卡 3px。这里把 ::after 直接关掉，只留一条轨。 */
html[data-paper] #view .board .ocard::after { content: none !important; }

/* ④ 节奏收紧：单号 18px 行、客户贴近、板号行 5px、进度条 6px —— 让 4 组信息有呼吸
      （实测原卡 162px 高，本节净持平但信息分组更清楚） */
/* 字号：单号 13px（等宽加粗）/ 客户 12px —— 卡片是车间扫读用的，10.5px 的中文偏小，
   抬一档之后"层级"更清楚，卡片只高约 4px（列内还有大半空高，不挤） */
html[data-paper] #view .board .ocard .od { font-size: 13px !important; line-height: 19px !important; }
html[data-paper] #view .board .ocard .oc { margin-top: 2px !important; font-size: 12px !important; line-height: 16px !important; }
html[data-paper] #view .board .ocard .ometa { margin-top: 6px !important; align-items: center !important; }
html[data-paper] #view .board .ocard .ometa-qty { font-size: 11px !important; font-weight: 800 !important; color: var(--sk-ink-2) !important; font-variant-numeric: tabular-nums; }
html[data-paper] #view .board .ocard .pbar { margin-top: 6px !important; height: 4px !important; background: var(--ui-line-100) !important; }
html[data-paper] #view .board .ocard .pbar > i { background: var(--ui-brand-600) !important; }
html[data-paper] #view .board .ocard.over .pbar > i { background: var(--ui-danger-solid) !important; }
html[data-paper] #view .board .ocard.unprod .pbar > i { background: var(--ui-warn-solid) !important; }

/* ⑤ 交期行：补上 §21 写错位置的那道分隔线（写在 .odue 上），并把"已放置"钉到右端。
      实测 .odue 宽 140px、三段文字在 10px 下共约 153px ⇒ **一行放不下**，
      所以维持两行，但让第二行右对齐、行高统一为 15px（原来是 14px + 4px 行距，参差）。 */
html[data-paper] #view .board .ocard .odue {
  margin-top: 6px !important;
  padding-top: 6px !important;
  border-top: 1px solid var(--ui-line-100) !important;
  gap: 0 4px !important;
  line-height: 16px !important;
  align-items: center !important;
}
html[data-paper] #view .board .ocard .odue > span {
  font-size: 11px !important; line-height: 16px !important; white-space: nowrap !important;
  font-variant-numeric: tabular-nums;
}
html[data-paper] #view .board .ocard .odue > span:last-child { margin-left: auto !important; }

/* ⑥ 标签行：容器还原成"一行 flex"，不再自己画框（截图里那圈空心大框的根因）；
      标签由"空心描边"改成**软色底 + 深色字**，一眼能读、也不跟状态条抢色。 */
html[data-paper] #view .board .ocard .otags {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  height: auto !important; min-height: 0 !important;
  margin-top: 6px !important;
  padding: 0 !important;
  border: 0 !important; border-radius: 0 !important;
  background: none !important; box-shadow: none !important;
  letter-spacing: 0 !important;
}
html[data-paper] #view .board .ocard .otags .badge {
  height: 18px !important;
  min-height: 18px !important;   /* ⚠ 必须写：polish.css 用 min-height:22px!important 顶着，只写 height 压不下去（实测 22px） */
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;                /* 砍掉 skin.css 的 currentColor 内描边（空心胶囊） */
  font-size: 11px !important; font-weight: 800 !important; line-height: 18px !important;
}
html[data-paper] #view .board .ocard .otags .badge.b-red { background: var(--ui-danger-bg) !important; color: var(--ui-danger-ink) !important; }
html[data-paper] #view .board .ocard .otags .badge.b-unprod { background: var(--ui-warn-bg) !important; color: var(--ui-warn-ink) !important; }
html[data-paper] #view .board .ocard .otags .badge.b-bio { background: var(--ui-ok-bg) !important; color: var(--ui-ok-ink) !important; }
/* 合作单：全站对"合作"一直有三种色（灰蓝/青/紫，见 skin.css §1436 的记述），
   这里统一到紫色一档（.badge.b-violet 本来就是紫字），只是把空描边补成软紫底。 */
html[data-paper]:not([data-theme="dark"]) #view .board .ocard .otags .badge.b-violet { background: #f7f7f7 !important; color: #5d5d5d !important; }
html[data-paper][data-theme="dark"] #view .board .ocard .otags .badge.b-violet { background: rgba(148,148,148, .18) !important; color: #d9d9d9 !important; }

/* ⑦ 板号角标「+N」：原来是实心深蓝渐变（app.css），在纸白卡上像一颗按钮；
      改成品牌浅底 + 品牌深字，读作"还有 N 个板号"的元信息。 */
html[data-paper] #view .board .ocard .board-more {
  background: var(--ui-brand-100) !important;
  color: var(--ui-brand-700) !important;
  border: 0 !important;
  border-radius: 4px !important;
  padding: 2px 4px !important;
  font-weight: 800 !important;
  font-size: 11px !important;
  line-height: 1 !important;
}


/* ===========================================================================
   23. 左侧导航：第三轮 —— 修「带角标的类目按钮变畸形」+ 统一选中语言 + 节奏
   ---------------------------------------------------------------------------
   实测工具：_qctest/nav-inspect.cjs（1920×1080 纸白浅色，逐元素量几何/字号/颜色）

   ★ 真 bug（用户说"越做越丑"里最刺眼的一处）：
     类目轨 8 个按钮，实测 **有积压角标的两个**（产线作业 / 质量与异常）= 50×22 / 圆角 999px，
     其余 6 个 = 50×54 / 圆角 10px ⇒ 轨上参差不齐，而且 22px 高装不下 18px 图标 + 4 字名字，
     图标被切掉半截（用户截图里"产线作业""质量异常"那两格是瘪的）。
     真因：polish.css:228 的胶囊规则
       :is(.badge, [class*="badge"], .ui-pill, .bp-tag, …) { height:22px!important; min-height:22px!important; … }
     其中 **`[class*="badge"]` 是子串匹配**，把 nav-collapse.js 打在按钮上的 `has-badge` 类
     也一起命中了 ⇒ 类目按钮被当成一枚标签。本节用 !important 的显式几何把它顶回来。

   ★ 另两处观感问题（同一批实测值）：
     · 类目轨的选中态是"实心墨蓝块"，条目面板的选中态是"浅底 + 墨条"，两个层级用了两套语言，
       而轨上的图标只有 18px / 不透明度 .7，灰得发糊；
     · 面板头原来是 11px + 1.4px 字距（像一排小字母），在 150px 宽的面板里显小气。

   ⚠ 本节只调样式，不动 index.html / nav-collapse.js 的任何结构（那个文件用 move 节点保 onclick，
     绝不能重建）。
   ========================================================================== */

/* ① 类目按钮：钉死几何（把 polish.css 的胶囊规则顶回去），并统一 12px 圆角 */
html[data-paper] .sidebar .nav-rail .nr-btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  height: 54px !important;
  min-height: 54px !important;
  width: 100% !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 6px 4px 6px !important;
  gap: 4px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  cursor: pointer;
}
html[data-paper] .sidebar .nav-rail .nr-btn > span {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}
html[data-paper] .sidebar .nav-rail .nr-btn svg {
  width: 20px !important; height: 20px !important; opacity: .8 !important;
  transition: opacity .14s ease;
}

/* ② 未选中 / 悬停 / 选中：一套语言（墨色系），悬停给"可点"的反馈，不做位移 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn {
  color: var(--nav-txt-2) !important;
  background: transparent !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover {
  background: var(--nav-hover) !important;
  color: var(--nav-ink) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover svg { opacity: 1 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on:hover {
  background: linear-gradient(180deg, var(--nav-ink) 0%, var(--nav-ink-deep) 100%) !important;
  color: #FFFFFF !important;
  /* 一层内高光 + 一层落影：实心块不再"死平" */
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 10px 20px -14px rgba(51,51,51, .95) !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on :is(svg, span) { color: #FFFFFF !important; opacity: 1 !important; }
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on {
  background: linear-gradient(180deg, #5a5a5a 0%, #393939 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10) !important;
}

/* ③ 轨上第一个按钮是"产线作业（五道工序常驻）"，与下面 7 个监控类目之间加一根发丝线 */
html[data-paper] .sidebar .nav-rail .nr-btn:first-child { margin-bottom: 12px; }
html[data-paper] .sidebar .nav-rail .nr-btn:first-child::after {
  content: ""; position: absolute; left: 7px; right: 7px; bottom: -6px; height: 1px;
  background: var(--nav-line);
}
/* 积压红点：加大到 7px 并把"垫圈"跟着按钮底色走（选中时用墨色垫） */
html[data-paper] .sidebar .nav-rail .nr-btn .nr-dot {
  top: 6px; right: 6px; width: 7px; height: 7px;
  box-shadow: 0 0 0 2px var(--nav-surface);
}
html[data-paper] .sidebar .nav-rail .nr-btn.on .nr-dot { box-shadow: 0 0 0 2px var(--nav-ink); }

/* ④ 面板头：从"一排小字母"改成真正的分区标题（13px/800），右侧项数降为弱灰小字 */
html[data-paper] .sidebar .nav-panel-h {
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 4px 10px !important;
  margin-bottom: 6px !important;
  border-bottom: 1px solid var(--nav-line) !important;
  letter-spacing: 0 !important;
}
html[data-paper] .sidebar .nav-panel-h > span {
  font-size: 13px !important; font-weight: 800 !important;
  color: var(--sk-ink) !important; letter-spacing: .02em !important;
}
html[data-paper] .sidebar .nav-panel-h > i {
  font-size: 11px !important; font-weight: 700 !important;
  color: var(--nav-txt-2) !important; opacity: 1 !important; letter-spacing: 0 !important;
}

/* ⑤ 条目：图标更清楚、名字 13.5px、悬停只是"淡底 + 变深"，选中 = 淡底 + 3px 墨条 */
html[data-paper] .sidebar .nav-item {
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 10px !important;
  padding: 0 10px !important;
  gap: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  transition: background .14s ease, color .14s ease !important;
}
html[data-paper] .sidebar .nav-item > svg {
  flex: none !important;
  width: 18px !important; height: 18px !important;
  opacity: .72 !important;
  transition: opacity .14s ease, color .14s ease;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item:hover {
  background: var(--nav-hover) !important;
  color: var(--nav-ink) !important;
  transform: none !important;          /* theme.css 的 translateX(2px) 在窄面板里会"抖" */
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item:hover > svg { opacity: .95 !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.active,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item.on {
  background: var(--nav-active-bg) !important;
  color: var(--nav-ink) !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}
/* 选中条不用 `inset 3px 0 0`：圆角 10px 会把内阴影切成一枚"月牙"（实测截图里就是弯的）。
   改成自己的 ::before 短竖条（上下各留 9px），两端干净。 */
html[data-paper] .sidebar .nav-item:is(.active, .on)::before {
  display: block !important;
  content: "" !important;
  position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--nav-ink);
}
html[data-paper] .sidebar .nav-item:is(.active, .on) > svg { color: var(--nav-ink) !important; opacity: 1 !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-item:hover { background: var(--nav-hover) !important; transform: none !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-item.active,
html[data-paper][data-theme="dark"] .sidebar .nav-item.on {
  background: var(--nav-active-bg) !important;
  color: var(--nav-ink) !important;
  box-shadow: none !important;
}
html[data-paper] .sidebar .nav-item .nav-badge { margin-left: auto !important; }

/* ⑥ 底部状态区：与上面同一套线色与内边距 */
html[data-paper] .sidebar .side-foot {
  border-top: 1px solid var(--nav-line) !important;
  padding: 10px 6px 6px !important;
}
/* 实测：底部那颗"退出登录"的底色/描边都落在近白上，屏幕上读起来就是一行纯文字，
   看不出能点。这里给它一个明确的按钮外形（浅描边 + 悬停淡底），并和条目同宽同圆角。 */
html[data-paper] .sidebar .side-foot .btn-ghost {
  width: 100% !important;
  height: 34px !important;
  margin-top: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  border-radius: 10px !important;
  border: 1px solid var(--ui-line-200) !important;
  background: var(--ui-bg-card) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
html[data-paper][data-theme="dark"] .sidebar .side-foot .btn-ghost {
  border-color: var(--nav-line) !important;
  background: rgba(255, 255, 255, .04) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .side-foot .btn-ghost:hover {
  background: var(--nav-hover) !important;
  border-color: var(--nav-ink) !important;
  color: var(--nav-ink) !important;
}
html[data-paper] .sidebar .side-foot .conn { font-size: 12px !important; letter-spacing: .01em !important; }
/* ≤760px 时侧栏只剩 64px（图标轨 + 抽屉），底部的"退出登录"实测只有 ~28px 宽、
   文字必然被裁成半截。这一档只留图标：按钮收成方块，标签文字隐藏。 */
@media (max-width: 760px) {
  html[data-paper] .sidebar .side-foot .btn-ghost { padding: 0 !important; width: 34px !important; }
  html[data-paper] .sidebar .side-foot .btn-ghost span { display: none !important; }
  html[data-paper] .sidebar .side-foot .conn span:not(.dot) { display: none !important; }
}


/* ===========================================================================
   24. 全站「高级感」统一层（2026-10-08）
   ---------------------------------------------------------------------------
   实测现状（`_qctest/shell-inspect.cjs` 2560×1440，输出见 `_qctest/out/shell-*.txt`）：
     · 圆角三种并存 —— 面板 **6px**（§3 用 `border-radius: var(--sk-r)!important` 钉死）、
       KPI 砖 8px、页签/行动条 16px；
     · 描边带色相 —— 顶栏按钮 `#e8e8e8`（蓝）、KPI 砖 `#CDE7EB`（青）、行动条 `#F5C6CC`（粉），
       一屏三种色相的描边，是"廉价感"最主要的来源；
     · 深度语言不统一 —— 按钮有蓝影、KPI 几乎没有影、行动条靠内嵌色条。
   高级感只有三条：**圆角统一、描边中性、深度极轻**；颜色只留给语义。
   ⚠ .ocard（工序看板订单卡）由 §22 单独精修，本节刻意不含它，避免把上一轮的成果盖掉。
   ========================================================================== */
html[data-paper] {
  --p2-r-card: 14px;    /* 卡片 / 面板 */
  --p2-r-ctl: 10px;     /* 控件 / 按钮 */
  --p2-line: #e9e9e9;         /* 中性发丝线 */
  --p2-line-soft: #f1f1f1;
  --p2-sh-1: 0 1px 2px rgba(28,28,28, .04), 0 12px 22px -20px rgba(28,28,28, .40);
  --p2-sh-2: 0 2px 6px rgba(28,28,28, .05), 0 20px 36px -24px rgba(28,28,28, .45);
}
html[data-paper][data-theme="dark"] {
  --p2-line: rgba(255, 255, 255, .10);
  --p2-line-soft: rgba(255, 255, 255, .07);
  --p2-sh-1: 0 1px 2px rgba(0, 0, 0, .35), 0 12px 22px -20px rgba(0, 0, 0, .8);
  --p2-sh-2: 0 2px 6px rgba(0, 0, 0, .4), 0 20px 36px -24px rgba(0, 0, 0, .9);
}

/* ① 卡片与面板：统一 14px 圆角 + 中性发丝线 + 一层极轻的落影
      （§3 把这一组卡片的圆角钉成 6px、阴影清成 none；本节在文件更靠后，同权重下接管） */
html[data-paper] #view :is(.ov3-card, .bp-card, .sp-panel, .mqz-card, .rp-card, .dv-card,
    .fqc-qcard, .fqc-panel, .fqc-card, .ui-card, .panel, .sec-card, .tp-card,
    .ov-insight, .ov-kpi, .oc-filtercard, .rework-stat-card, .mqz-panel, .odkpis > *) {
  border-radius: var(--p2-r-card) !important;
  border: 1px solid var(--p2-line) !important;
  box-shadow: var(--p2-sh-1) !important;
}
/* 页面里的"次级砖"（KPI 砖）只给线，不给影，避免一屏十几张卡叠出阴影糊成一片 */
html[data-paper] #view :is(.ov-kpi-d, .dg-g, .ov-kpi, .ui-kpi) {
  border-radius: var(--p2-r-card) !important;
  border: 1px solid var(--p2-line) !important;
  box-shadow: none !important;
}
/* 页签条与行动条：跟卡片同一个圆角，不再 16px */
html[data-paper] #view :is(.ov-tabs, .app-tabs, .dv-tabs, .rp-tabs, .sp-seg) {
  border-radius: var(--p2-r-card) !important;
}
html[data-paper] #view .ov-act-c {
  border-radius: var(--p2-r-card) !important;
  border-color: var(--ui-line-200) !important;   /* 原来是粉色描边，语义交给左缘色条 */
  box-shadow: var(--p2-sh-1) !important;
}
/* 工序看板各列的托盘也跟着统一（列本身是"容器"，只给线不给影） */
html[data-paper] #view :is(.stcol, .board .stcol) { border-radius: var(--p2-r-card) !important; }

/* ② 顶栏：去掉"蓝底蓝框蓝影"三件套，改白底 + 发丝线；悬停才出现墨色 */
html[data-paper]:not([data-theme="dark"]) .topbar {
  box-shadow: none !important;
  border-bottom: 1px solid var(--p2-line) !important;
}
html[data-paper]:not([data-theme="dark"]) .topbar :is(.tbtn, .shift) {
  background: #FFFFFF !important;
  border: 1px solid var(--p2-line) !important;
  color: var(--sk-ink-2) !important;
  border-radius: var(--p2-r-ctl) !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
}
html[data-paper]:not([data-theme="dark"]) .topbar :is(.tbtn, .shift):hover {
  background: #f8f8f8 !important;
  border-color: var(--nav-ink) !important;
  color: var(--nav-ink) !important;
  transform: none !important;
}
/* 「交期预警」是唯一允许带色的顶栏按钮（语义：告警），但也收敛成"浅底 + 深字" */
html[data-paper]:not([data-theme="dark"]) .topbar .tbtn.delivery-alert {
  background: var(--ui-danger-bg) !important;
  border-color: var(--ui-danger-line) !important;
  color: var(--ui-danger-ink) !important;
}
html[data-paper] .topbar .clock .t { font-size: 14px !important; font-weight: 800 !important; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
html[data-paper] .topbar .clock .d { font-size: 11px !important; color: var(--sk-ink-3) !important; }

/* ③ 页头文字：标题一档、副标改成"小型大写"（letter-spacing 比字重更显工整） */
html[data-paper] .topbar #modTitle { font-size: 16px !important; font-weight: 800 !important; letter-spacing: -.01em !important; color: var(--sk-ink) !important; }
html[data-paper] .topbar #modSub { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .16em !important; text-transform: uppercase; color: var(--sk-ink-3) !important; }

/* ④ 通用按钮（#view 里的 .btn/.ui-btn/.mbtn/.sp-btn…）：统一 10px 圆角 + 中性描边，
      不再各自带色相；语义按钮（primary/danger/ok）由模块自己决定，这里不碰。 */
html[data-paper]:not([data-theme="dark"]) #view :is(.btn, .ui-btn, .mbtn, .sp-btn, .dv-btn, .mq-btn, .mqz-btn, .rp-btn, .mqz-mini, .btn-ghost) {
  border-radius: var(--p2-r-ctl) !important;
}
html[data-paper]:not([data-theme="dark"]) #view :is(.btn, .ui-btn, .mbtn, .dv-btn, .mqz-mini, .btn-ghost):not(.primary):not(.danger):not(.ok):not(.is-primary) {
  border-color: var(--p2-line) !important;
}


/* ===========================================================================
   25. 左侧导航 · 第四轮：把「能用」再往上做到「精致」
   ---------------------------------------------------------------------------
   用户：「整个程序增加高级感，尤其是左侧导航栏」。
   §23 已经把尺寸/选中语言统一了，这一轮只做**质感**：
     · 图标线宽 1.6 → **1.5**、20px（细线 + 大一点 = 精致；CJK 标签保持 10.5px 才不挤）
     · 品牌块的 logo 砖加内高光、标题字距收紧、副标改小型大写
     · 面板头加一枚 3px 圆角色标（"高级感"里最便宜也最有效的一招：给分组一个视觉锚点）
     · 条目图标色从 --sk-ink-3 提到 --sk-ink-2（原来和占位字一个灰度，看着"发虚"）
     · 选中条 3px 改 2.5px 并两端收圆；悬停统一 #f8f8f8；圆角跟 §24 的 14/10 对齐
   ⚠ 依旧只动样式：index.html / nav-collapse.js 一个字没改。
   ========================================================================== */

/* 品牌块 */
html[data-paper] .sidebar .brand { padding: 4px 6px 14px !important; }
html[data-paper] .sidebar .logo {
  width: 36px !important; height: 36px !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 8px 18px -12px rgba(51,51,51, .85) !important;
}
html[data-paper] .sidebar .brand h1 {
  font-size: 14px !important; font-weight: 800 !important; line-height: 1.28 !important;
  letter-spacing: -.01em !important;
}
html[data-paper] .sidebar .brand .sub {
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: .16em !important; text-transform: uppercase;
}

/* 类目轨：细线图标 + 14px 圆角块 */
html[data-paper] .sidebar .nav-rail .nr-btn { border-radius: var(--p2-r-card) !important; }
html[data-paper] .sidebar .nav-rail .nr-btn svg { width: 20px !important; height: 20px !important; stroke-width: 1.5 !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn:hover { background: #f8f8f8 !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn.on {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 12px 22px -16px rgba(51,51,51, .95) !important;
}

/* 面板头：加色标 + 项数改浅灰胶囊 */
html[data-paper] .sidebar .nav-panel-h { padding: 6px 4px 10px !important; }
html[data-paper] .sidebar .nav-panel-h > span {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
}
html[data-paper] .sidebar .nav-panel-h > span::before {
  content: ""; width: 3px; height: 13px; border-radius: 2px;
  background: var(--nav-ink); flex: none;
}
html[data-paper] .sidebar .nav-panel-h > i {
  padding: 2px 8px !important; border-radius: 999px !important;
  background: #f4f4f4 !important; color: var(--sk-ink-3) !important; font-weight: 800 !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-panel-h > i { background: rgba(255, 255, 255, .07) !important; }

/* 条目：图标提亮、圆角 10px、选中条 2.5px */
html[data-paper] .sidebar .nav-item { border-radius: var(--p2-r-ctl) !important; }
html[data-paper] .sidebar .nav-item > svg { width: 17px !important; height: 17px !important; stroke-width: 1.6 !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item > svg { color: var(--sk-ink-2) !important; opacity: .9 !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-item:hover { background: #f8f8f8 !important; }
html[data-paper] .sidebar .nav-item:is(.active, .on)::before { width: 2.5px; border-radius: 0 3px 3px 0; }
html[data-paper] .sidebar .nav-item .nav-badge { height: 18px !important; min-height: 18px !important; line-height: 18px !important; font-size: 11px !important; }

/* 底部：状态行小圆点加一圈柔光，按钮跟面板条目同宽同圆角 */
html[data-paper] .sidebar .side-foot .conn .dot { box-shadow: 0 0 0 3px rgba(16, 185, 129, .12); }
html[data-paper] .sidebar .side-foot .btn-ghost { border-radius: var(--p2-r-ctl) !important; }

/* 28. 侧栏「两块面」：类目轨浅纸灰 + 面板纯白 + 一根发丝线
   ---------------------------------------------------------------------------
   第六轮（去蓝）之后侧栏整体是白的，类目轨与条目面板糊成一整块 —— 层次只能靠"选中的那颗砖"。
   这里把轨铺成 **#FBFBFC**（只比白低 1.6%），两者之间一根 #EFEFF0 发丝线：
   macOS 侧栏那种"两块面"的做法，既分清层，又不会像早前 #F5F6F7 那样"被切成两块砖"。
   ⚠ 这是侧栏**内部**的分层；侧栏与主内容之间那条缝（用户明确不要）依然没有。 */
html[data-paper] .sidebar .nav-rail {
  background: #FBFBFC !important;
  border-right: 1px solid #EFEFF0 !important;
  border-radius: 10px 0 0 10px !important;
}
html[data-paper][data-theme="dark"] .sidebar .nav-rail {
  background: rgba(255, 255, 255, .035) !important;
  border-right-color: rgba(255, 255, 255, .07) !important;
}
html[data-paper] .sidebar .nav-rail .nr-btn > svg { background: #F1F1F2 !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn:hover > svg { background: #E7E7E9 !important; }

/* ⚠ 去蓝之后必须补的一步：原来那批"中性色"是**同明度的灰**，但蓝的感知亮度比同明度灰更低 ——
   实测（`_qctest/audit-contrast.cjs`）全站低对比元素从 60 涨到 202，其中 120 个集中在
   `--ui-brand-600` 当字色压在浅灰底上（3.82:1，如物料出库的「出库」标）。
   这里把当字/当图标用的几档灰**再压深一档**（按钮、标签、链接一起受益）。 */
html[data-paper]:not([data-theme="dark"]) {
  --ui-brand-600: #5C6369;   /* 压 #EFF0F2 灰底 ≈5.6:1（改前 3.82:1） */
  --ui-brand-700: #464D53;
  --ui-brand-500: #767D84;
  --ui-brand-900: #2C3238;
  --ui-info-ink: #4A5158;
  --ui-info-solid: #5C6369;
  --ui-brand-100: #EDEFF1;
  --ui-brand-050: #F6F7F8;
}
/* 去蓝之后 KPI 带丢了两种"身份色"（钢蓝 / 靛蓝都变灰了），补成**非蓝**的两个色相：
   wip → 青灰绿（和 rate 的青碧分得开），stage → 暖砂（给整条带子一点温度）。 */
html[data-paper]:not([data-theme="dark"]) {
  --h-brand-ink: #2E5F57; --h-brand-tint: #F0F7F5; --h-brand-line: #CFE4DF; --h-brand-solid: #3F7F72;
  --h-indigo-ink: #6E5327; --h-indigo-tint: #F9F5EC; --h-indigo-line: #E9DFC9; --h-indigo-solid: #9C7C3E;
}


/* ===========================================================================
   29. 产线作业台（氨解/合成/接酯/纯化 .pd3-wb）：把"六层盒子"收成"一卡三区"
   ---------------------------------------------------------------------------
   用户：「有没有更好的布局方案，总感觉整个页面很割裂」。
   实测（_qctest/tree-probe.cjs，2560×1440，氨解作业台）：
     .pd3-wrap 2270×1304 里，**每一块都自带边框**：
       headbar 2270×66(边) → guide 2270×54(边) → md 2270×1114 → md-right 1926×1114(边)
       → mp-tbl 1924×998(边) → fold 2270×36(边)    ⇒ 六层边线叠在一起
     右侧 1114px 里真正有内容的只有 **KPI 79 + 细条 35 + 在线条 28 + 空态 160 = 302px**，
     其余 **~810px 是纯白空白**，而空态还缩在左上角一小块里。
   改法（只动样式，DOM 一个字不改）：
     ① 整个作业台 = **一张卡**：headbar / guide / fold 只留**发丝线**，不再各自画框；
     ② 中区变 grid：**左 292px 机台栏（浅灰面 + 右发丝线）+ 右工作区**，两侧不再各是一个盒子；
     ③ 右侧内部也只用发丝线：KPI 4 个从"4 张独立小卡"改成**一条内联指标带**（竖线分隔），
        细条行同宽同高、直接贴在工作区头上；
     ④ 主工作区 `.mp-tbl` 去掉边框、**空态改竖直居中**（原来贴左上角），
        空出来的高度就是"工作区"，不再像一块没画完的白板。
   ========================================================================== */

/* ① 一卡：外框只留一条 */
html[data-paper] .pd3-wrap.pd3-wb > .pd3-top.pd3-headbar {
  border: 0 !important;
  border-bottom: 1px solid var(--p2-line) !important;
  border-radius: var(--p2-r-card) var(--p2-r-card) 0 0 !important;
  background: #FFFFFF !important;
}
html[data-paper] .pd3-wrap.pd3-wb > .pd3-guide {
  border: 0 !important;
  border-bottom: 1px solid var(--p2-line) !important;
  background: #FFFFFF !important;
  min-height: 44px !important; height: 44px !important;
  padding: 0 16px !important;
}
html[data-paper] .pd3-wrap.pd3-wb > .pd3-fold {
  border: 0 !important;
  border-top: 1px solid var(--p2-line) !important;
  border-radius: 0 0 var(--p2-r-card) var(--p2-r-card) !important;
  background: #FFFFFF !important;
}

/* ② 中区：左机台栏（浅灰面）+ 右工作区，只用一根发丝线分 */
html[data-paper] .pd3-wrap.pd3-wb > .pd3-md { border: 0 !important; background: transparent !important; gap: 0 !important; }
html[data-paper] .pd3-wrap.pd3-wb .pd3-md-left {
  width: 292px !important;
  background: #FBFBFC !important;
  border: 0 !important;
  border-right: 1px solid var(--p2-line) !important;
  border-radius: 0 !important;
  display: flex !important; flex-direction: column !important; gap: 10px !important;
  padding: 12px !important;
}
/* "上机操作 / 工序功能"贴到栏底，中间那段空白就成了"栏内留白"而不是洞
   （用 justify-content 而不是给子项 margin-top:auto —— 实测后者在 rail-card 自带
    margin-bottom 的情况下只下移了一部分，栏底仍留 292px 空洞） */
html[data-paper] .pd3-wrap.pd3-wb .pd3-md-left { justify-content: space-between !important; }
html[data-paper] .pd3-wrap.pd3-wb .pd3-md-left .pd3-railtools { margin-top: 0 !important; }
/* ⚠ 真因：workbench.css 给最后一块写了 `.pd3-wb .pd3-md-left .pd3-railtools{margin-bottom:auto}`
   —— 自动外边距会先吃掉全部自由空间，所以 `justify-content:space-between` 完全没效果
   （实测工序功能一直贴在机台卡下面、栏底留 424px 洞）。把这条反过来用：
   清掉 margin-bottom:auto + 用 space-between，让「工序功能」落到栏底、留白放到中间。 */
html[data-paper] .pd3-wrap.pd3-wb .pd3-md-left .pd3-railtools { margin-bottom: 0 !important; }
/* 合成页没有「工序功能」块，此时留白归「上机操作」 */
html[data-paper] .pd3-wrap.pd3-wb .pd3-md-left:not(:has(.pd3-railtools)) .pd3-leftacts { margin-bottom: 0 !important; }
html[data-paper] .pd3-wrap.pd3-wb .pd3-md-right {
  border: 0 !important; background: #FFFFFF !important; border-radius: 0 !important;
}

/* ③ 右侧内部：KPI 内联成一条指标带 + 细条行同宽 */
html[data-paper] .pd3-wrap.pd3-wb .pd3-statusrow {
  height: 52px !important; min-height: 52px !important;
  padding: 0 16px !important;
  border-bottom: 1px solid var(--p2-line) !important;
  background: transparent !important;
}
/* ★★ 2026-10-11（用户：「怎么会壳套壳呢」）：
   原来这条把「未选机台」时的状态卡**拍平成指示带**（去边框/去底色/去圆角，只留右侧分隔线），
   而「已选机台」时卡片是可点的、不命中 `.is-static` —— 于是同一个位置两种长相：
   没选机台是"一条带"，选了机台就变成**卡片套在一个带边框的盒子里面**（外层 `.pd3-kpirow`
   自己有 1px 边框 + 12px 圆角 + 面板底）。用户截图看到的"壳套壳"就是这个。
   现在：**外层不再套盒子**（见下面那条），卡片两种状态一致 —— 盒子只留一层。 */
html[data-paper] .pd3-wrap.pd3-wb .hv-kpi.is-static {
  height: 52px !important;
  padding: 0 16px !important;
  /* 不再去边框/底色/圆角：与可点状态保持同一套外观（颜色仍由行内 style 按状态给）。 */
}

/* 工序页状态条：外层只当布局容器，去边框 / 去底色 / 去圆角。
   加 `#view` 是为了压过后面那条 `#view :is(.hv-kpi,.pt-kpis,.pd3-kpi-inner){border-radius:10px}`（ID 级）。 */
html[data-paper] #view .pd3-wrap.pd3-wb .pd3-kpirow {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html[data-paper] #view .pd3-wrap.pd3-wb .pd3-kpirow .hv-kpi,
html[data-paper] #view .pd3-wrap.pd3-wb .pd3-kpirow .hv-kpi.is-static {
  height: 52px !important;
  padding: 0 16px !important;
  border-radius: 12px !important;
  border-width: 1.5px !important;
  border-style: solid !important;
  box-shadow: none !important;
}
html[data-paper] .pd3-wrap.pd3-wb .pd3-kpi-reload { height: 30px !important; align-self: center !important; }
html[data-paper] .pd3-wrap.pd3-wb .pt-acts.is-slim {
  height: 46px !important; min-height: 46px !important;
  padding: 0 16px !important;
  border-bottom: 1px solid var(--p2-line) !important;
  background: transparent !important;
}

/* ④ 主工作区：去框 + 空态竖直居中 */
html[data-paper] .pd3-wrap.pd3-wb .mp-tbl { border: 0 !important; display: flex !important; flex-direction: column !important; }
html[data-paper] .pd3-wrap.pd3-wb .pd3-online {
  border-bottom: 1px solid var(--p2-line) !important;
  background: transparent !important;
}
html[data-paper] .pd3-wrap.pd3-wb .pd3-empty-line:not(.is-pool) {
  margin: auto !important;
  width: auto !important; height: auto !important;
  min-height: 0 !important;
  border: 0 !important; background: transparent !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  gap: 10px !important; padding: 0 24px !important; text-align: center !important;
}

/* ★★ 2026-10-11（用户：「这几个工序的页面再好好设计一下，还是有点乱」）：
   上面那条「空态竖直居中」是为**整块空态**（加载中 / 无权限）写的 —— 那是页面主角，居中是对的。
   但空**池**那一块（`.is-pool`）在 2026-10-16 就被专门设计成**一行**（标题 ｜ 结论 ｜ ⓘ ｜ 按钮右对齐），
   挂上这条规则后被强行掰成「居中的竖排小盒」：实测 1520 宽的容器里渲染成 281×223 的一小块，
   大片空白中间飘一个小盒子 —— 正是用户说的"扎眼"。
   这里把 `.is-pool` 排除出去并显式还原成横向一行。 */
html[data-paper] .pd3-wrap.pd3-wb .pd3-empty-line.is-pool {
  margin: 0 !important;
  width: 100% !important; height: auto !important; min-height: 0 !important;
  display: flex !important; flex-direction: row !important;
  align-items: center !important; justify-content: flex-start !important;
  gap: 10px !important; padding: 10px 14px !important; text-align: left !important;
}


/* ===========================================================================
   30. 看板页（生产概览 / 订单与交期 / 质量… 一切含 .ov3-grid 的页）：一屏装下
   ---------------------------------------------------------------------------
   用户：「整个页面布局很乱很乱，必须给我解决布局的问题」。
   实测（_qctest/tree-probe.cjs，2560×1440，生产概览）：
     .view 2316×1381（可视）  ←  .view-fade 2276×**1596**  ⇒ **溢出 215px，整页必须滚**，
                                截图里最后一行就是被切掉的
     .ov-hero.is-dash 315（KPI 带：top 47 + kpis 168 + today 42）  ← 首屏 22% 被它吃掉
     .ov3-grid 2×2：行高 **474 / 611**（两行不一样高）⇒ 看过去像两套东西
     面板内部：图表是**写死高度**（.bp-chart.ov3-h250 = 252px），面板却 474/611 ⇒ 面板下半截永远是空白

   改法（只对含 .ov3-grid 的页生效，其它页一个字不动）：
     ① #view 纵向 flex + overflow:hidden：**整页不滚**；
     ② 把 "顶部 KPI 带 + 告警条 + 页签" 之后剩下的高度全给网格；
     ③ 网格改成 **两行 1fr**（等高、吃满）；
     ④ 面板 100% 高 + 内部纵向 flex，图表容器 `flex:1`（从 250 长到面板能给的尺寸）
        —— 图表在**页面载入时**就按新尺寸 init，不会出现画布与容器不一致；
        窗口 resize 时 app.js 本来就有 `__bpCharts.resize()` 监听，继续有效。
   ========================================================================== */

/* ① 整页不滚。安全性核对：`.ov3-grid` 只出现在「生产概览」这一页（4 个页签共用同一个
      .bp-home.ov3 网格）；「生产动态 / 交期分布」是 .dg-page 长页，不吃本节规则（实测
      .view-fade 分别 5588 / 4075，保持原来的整页滚动）。 */
html[data-paper] #view:has(.bp-home) {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
html[data-paper] #view:has(.bp-home) > .view-fade {
  flex: 1 1 auto !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important;
}
html[data-paper] #view:has(.bp-home) .view-fade > .bp-home {
  flex: 1 1 auto !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important;
}
html[data-paper] #view:has(.bp-home) .view-fade > .ov-hero { flex: 0 0 auto !important; }
html[data-paper] #view:has(.bp-home) .bp-home > :is(.ov-act-wrap, .ov-tabs) { flex: 0 0 auto !important; }

/* ② KPI 带 + 告警条 + 页签共收 ~85px（315+66+62 → 248+62+48）：
      只有让上面这三条瘦下来，下面两行才够高（每行需 ~470 才能装下"图表 + 日历条"）。 */
html[data-paper] #view:has(.bp-home) .ov-hero.is-dash { padding: 10px 14px 10px !important; }
html[data-paper] #view:has(.bp-home) .ov-hero-band { padding: 8px 12px 8px !important; }
html[data-paper] #view:has(.bp-home) .ov-hero-top { height: 40px !important; min-height: 40px !important; }
/* ⚠ 这里只能给 min-height，不能给 height：1080p 下卡更窄，底注会折成两行
   （app.js 给 5 张卡都带了 `<br>` 的底注），写死高度就会把第二行切掉（实测 17/26）。 */
html[data-paper] #view:has(.bp-home) .ov-kpis-dark { min-height: 130px !important; height: auto !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d { min-height: 118px !important; height: auto !important; padding: 10px 14px 9px !important; }
html[data-paper] #view:has(.bp-home) .ov-today { height: 30px !important; min-height: 30px !important; padding: 0 12px !important; }
html[data-paper] #view:has(.bp-home) .ov-act { min-height: 0 !important; height: 58px !important; padding: 6px 14px !important; }
html[data-paper] #view:has(.bp-home) .ov-act > * { height: 46px !important; min-height: 0 !important; }
html[data-paper] #view:has(.bp-home) .ov-tabs { height: 48px !important; min-height: 48px !important; padding: 4px 12px !important; }
html[data-paper] #view:has(.bp-home) .ov-tabs button { height: 40px !important; }

/* ③ 网格：两行等高、吃满剩余高度 */
html[data-paper] #view:has(.bp-home) .ov3-grid {
  flex: 1 1 auto !important; min-height: 0 !important;
  grid-auto-rows: minmax(0, 1fr) !important;
  align-content: stretch !important;
}
html[data-paper] #view:has(.bp-home) .ov3-card {
  height: 100% !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important;
  overflow: hidden !important;
}

/* ④ 面板内部：头/脚固定，图表体吃掉剩余高度 */
html[data-paper] #view:has(.bp-home) .ov3-card > .ov3-h { flex: 0 0 auto !important; }
html[data-paper] #view:has(.bp-home) .ov3-card > .ov3-foot { flex: 0 0 auto !important; }
html[data-paper] #view:has(.bp-home) .ov3-card > .ov3-b {
  flex: 1 1 auto !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important;
  /* 面板内内容比面板高时**面板内滚动**（不是切掉）—— 这是看板页不整页滚的前提 */
  overflow: auto !important;
}
/* 图表容器（.bp-chart / .ov3-hNNN / .mq-chart 等）跟着长高；固定高那几个类不再写死 */
html[data-paper] #view:has(.bp-home) .ov3-b > * { min-height: 0 !important; }
html[data-paper] #view:has(.bp-home) .ov3-b :is(.bp-chart, .ov3-chart, [class*="ov3-h"]) {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 170px !important;
}
/* 面板内的次级块（日历条、口径说明、图例说明）保持自然高度 */
html[data-paper] #view:has(.bp-home) .ov3-b > :is(.ov-cal, .ov-wkmode, .ov3-legend, .ov3-note) { flex: 0 0 auto !important; }


/* ===========================================================================
   31. 1920×1080 适配（2026-10-08 第七轮）—— 用户：「全局照着 24 寸 1080p 设计」
   ---------------------------------------------------------------------------
   实测工具 `_qctest/fit-1080.cjs`（1920×1080 逐页量：纵向溢出 / 横向溢出 / 被裁的文字块）：
     · **23 / 42 页要整页滚动**，最狠的生产动态要滚 4621px、在制订单 3331、交期分布 2504；
     · **13 / 42 页有被裁内容**：`.k-cap`（KPI 底注）在 8 个页面被裁 ——
       app.js 第 8054 行的注释写着"底注各只留一行，超出打省略号"，但 CSS 从来没写；
       于是 10px 的底注折成两行、被卡片的固定高截掉半行（实测 17/26）；
     · 工序看板的 `.ocard` 116/137：列内有滚动时，flex 子项**默认会压缩**（flex-shrink:1），
       卡片被压扁 → 卡内文字被自己的 overflow:hidden 切掉。
   ========================================================================== */

/* ① KPI 底注/副标：按 app.js 的既定口径收成一行 + 省略号（原来会折两行再被截半行） */
html[data-paper] #view :is(.k-cap, .k-sb) {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ② 工序看板列：卡片不再被 flex 压缩（列内滚动，卡保持自然高度） */
html[data-paper] .board .stcb > * { flex: 0 0 auto !important; }

/* ③ 全站：页面级不再整页滚动，主内容块自己滚
      规则：`#view` = 纵向 flex + 不滚；唯一的"主块"（.view-fade / .pd-wrap）吃掉剩余高度，
      它内部的**最后一块**（表格/看板/列表）负责滚动。这样长页（生产动态 4621px）不再
      把整页顶成一长条，短页也不会在底部留半屏白。 */
html[data-paper] #view {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
html[data-paper] #view > * { flex: 0 0 auto; min-height: 0; }
/* 「最后一块吃剩余高度」这条对**所有页面**成立：不管中间是 .view-fade / .pd-wrap / .rp-wrap
   还是像设备管理那样直接挂在 #view 下（hero + KPI + 设备网格）—— 那一页实测 2176px 溢出，
   不兜底就会被 #view 的 overflow:hidden 切掉。 */
html[data-paper] #view > *:last-child {
  flex: 1 1 auto !important; min-height: 0 !important;
  overflow-y: auto !important;
}
html[data-paper] #view > :is(.view-fade, .pd-wrap, .rp-wrap) {
  flex: 1 1 auto !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important;
}
html[data-paper] #view > :is(.view-fade, .pd-wrap, .rp-wrap) > * { flex: 0 0 auto; min-height: 0; }
html[data-paper] #view > :is(.view-fade, .pd-wrap, .rp-wrap) > *:last-child {
  flex: 1 1 auto !important; min-height: 0 !important;
  overflow-y: auto !important;
}
/* 产线执行那层还多包了一层 div */
html[data-paper] #view > .pd-wrap > div {
  flex: 1 1 auto !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important;
}
/* 2026-10-12 全站结构复核：这里原来把 #pdContent 的每一个直接子块都设成
   flex:1，导致“现场变更”的三张 KPI、工具条、表格被强行均分整屏，工具条被拉成
   近 200px 高的空壳；记录查询页的多个结果区也会互相挤压。普通块保持自然高度，
   只让最后的主列表承接剩余空间。 */
html[data-paper] #view > .pd-wrap > div > * { flex: 0 0 auto !important; min-height: 0 !important; }
html[data-paper] #view > .pd-wrap > div > *:last-child {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* 设备管理那页 `#view` 下是 hero + kpi + **两张** .dv-card（大卡 1918 + 尾部小卡 38），
   `:last-child` 会误命中那张尾部小卡 ⇒ 大卡被顶出视口。这里按"非最后一张"来兜。 */
html[data-paper] #view > .dv-card:not(:last-child) {
  flex: 1 1 auto !important; min-height: 0 !important;
  overflow-y: auto !important;
}

/* ⚠ 关键兜底（实测踩到）：把一个块设成"自己滚"之后，**它内部的子块不能再被 flex 压缩** ——
   否则 在制订单 那页的 5 块卡会被压成一条条虚线（KPI 砖被挤扁、表格只剩表头）。
   这里给所有"我让它滚"的容器的直接子块钉上不收缩。 */
/* ⚠ 排除 .ov3-grid：它是"要吃掉剩余高度"的网格（flex:1），被这条兜底钉成 flex-shrink:0 之后
   就撑到 1105 > 容器 998 ⇒ 第二行被裁掉（实测生产概览第二行整排消失）。 */
html[data-paper] #view > :is(.view-fade, .pd-wrap, .rp-wrap) > *:last-child > *:not(.ov3-grid) { flex-shrink: 0 !important; }
html[data-paper] #view > *:last-child > *:not(.ov3-grid) { flex-shrink: 0 !important; }
/* 同类兜底：`.ov3-card` 在"自己滚"的容器里也会被压扁（交期预警/交期分布/交付周期达成 各 1 张，
   实测 30/75），一并钉住不收缩。 */
html[data-paper] #view .ov3-card { flex-shrink: 0 !important; }


/* ===========================================================================
   32. 配色落地方案 A「青绿 · 医疗清爽」（2026-10-08 第八轮）
   ---------------------------------------------------------------------------
   来由：用户先否了蓝调、再否了纯灰，最后从四套方案图（`_qctest/theme-options.cjs`
   渲染的 A 青绿 / B 暖砂 / C 深紫 / D 石墨+琥珀）里选了 **A**。
   做法：**只换色彩令牌**（点缀 / 侧栏 / 内容底 / 语义），几何、尺寸、布局一行不动 ——
   所以上一轮 1080p 的适配结论（0/42 需滚动）继续成立。
     点缀 墨青绿 #0F766E（深档 #0A5A54）· 悬停 #F1F6F5 · 选中底 #E7F3F1
     底   页 #F3F7F6 · 卡 #FFFFFF · 发丝线 #E1E8E6
     KPI 身份色：rate 青碧 / wip 墨青绿 / over 朱红 / stage 暖砂 / device 石墨
     （合成工序的功能色随之变墨青绿；氨解仍是青 #0C9AB8，两者深浅分得开）
   图表色板同步换（`echarts-theme.js`，ECharts 不解析 CSS 变量）。
   ========================================================================== */
html[data-paper]:not([data-theme="dark"]) {
  --sk-page: #F3F7F6;
  --sk-page-2: #E9EFED;
  --sk-card: #FFFFFF;
  --sk-soft: #F6FAF9;
  --sk-line: #E1E8E6;
  --sk-line-2: #EDF2F1;

  --sk-accent: #0F766E;
  /* ⚠ 亮青绿 #14958A 压白底只有 3.34:1、白字压它只有 3.69:1（实测 .board-more / mo-step / 徽标
     共 13 处掉到 4.5 以下）⇒ 这一档收到 #0E7A70（白底 4.6:1、白字压它 4.6:1）。 */
  --sk-accent-2: #0E7A70;
  --sk-accent-deep: #0A5A54;
  --sk-accent-soft: rgba(15, 118, 110, .10);
  --sk-grad: linear-gradient(135deg, #14958A 0%, #0A5A54 100%);
  --sk-rail-pin-bg: rgba(15, 118, 110, .05);
  --sk-band-glow: rgba(15, 118, 110, .07);

  /* 内容区变量（很多模块直接吃这几个） */
  --ui-line-200: #E1E8E6;
  --ui-line-100: #EDF2F1;
  --ui-bg-page: #F3F7F6;
  --ui-bg-soft: #F6FAF9;
  --ui-brand-600: #0F766E;
  --ui-brand-500: #0E7A70;
  --ui-brand-700: #0A5A54;
  --ui-brand-900: #08413D;
  --ui-brand-100: #E3F1EF;
  --ui-brand-050: #F1F8F7;
  --ui-info-ink: #0A5A54;
  --ui-info-solid: #0F766E;

  /* 导航（§16 那套） */
  --nav-ink: #0F766E;
  --nav-ink-deep: #0A5A54;
  --nav-active-bg: #E7F3F1;
  --nav-hover: #F1F6F5;
  --nav-line: #E5EAE9;

  /* KPI 身份色 */
  /* --h-brand-solid 是"色点/带条 + 白字"的底：原来 #14958A 上压白字只有 3.69:1 ⇒ 收到 #0F766E（5.3:1） */
  --h-brand-ink: #0F766E; --h-brand-tint: #EAF5F3; --h-brand-line: #CBE4E0; --h-brand-solid: #0F766E;
  --h-indigo-ink: #8A5B1E; --h-indigo-tint: #FAF3E9; --h-indigo-line: #EEDFC8; --h-indigo-solid: #B8862F;
}
/* 深色档：只换点缀与导航，底/线走深色原有的那套 */
html[data-paper][data-theme="dark"] {
  --sk-accent: #4FBFB0;
  --sk-accent-2: #6FD3C8;
  --sk-accent-deep: #2E8A80;
  --sk-accent-soft: rgba(79, 191, 176, .14);
  --nav-ink: #6FD3C8;
  --nav-ink-deep: #4FA99F;
  --nav-active-bg: rgba(111, 211, 200, .13);
  --ui-brand-600: #4FBFB0;
  --ui-brand-500: #6FD3C8;
  --ui-brand-700: #2E8A80;
  --ui-brand-100: rgba(79, 191, 176, .16);
}

/* 26. 左侧导航 · 第五轮：把"整块实心"换成「图标砖 + 小标签」
   ------------------------------------------------------------------------
   前三轮已把尺寸/语言统一，但类目选中态是一整块 50×54 的实心墨蓝 —— 尺寸大、色块重，
   一屏两个深色块（导航 + 页内页签）就显沉。这一轮改成：**30×30 图标砖 + 10.5px 标签**，
   选中时只有那枚砖变墨蓝、标签变墨蓝加粗 —— 同样的识别度，重量少一半。
   （只动样式：SVG 用 padding + background 撑成砖，DOM 一个字没改。） */
html[data-paper] .sidebar .nav-rail .nr-btn {
  gap: 6px !important;
  padding: 6px 4px 6px !important;
  background: transparent !important;
  box-shadow: none !important;
}
html[data-paper] .sidebar .nav-rail .nr-btn > svg {
  box-sizing: content-box !important;
  width: 18px !important; height: 18px !important;
  padding: 6px !important;
  border-radius: 10px !important;
  background: #f3f3f3 !important;
  color: var(--sk-ink-2) !important;
  opacity: 1 !important;
  stroke-width: 1.6 !important;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn:hover { background: transparent !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn:hover > svg {
  background: #eaeaea !important; color: var(--nav-ink) !important;
}
/* ⚠ 必须带 `body` 才压得住 §23 那条 `... body .sidebar .nav-rail .nr-btn.on{background:linear-gradient(...)}`
   （它把整块 50×54 涂成墨蓝）；选中态现在只由那枚 30×30 图标砖表达。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on:hover {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nav-ink) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on > span { color: var(--nav-ink) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn.on > svg {
  background: linear-gradient(180deg, var(--nav-ink) 0%, var(--nav-ink-deep) 100%) !important;
  color: #FFFFFF !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 8px 16px -10px rgba(51,51,51, .95) !important;
}
html[data-paper] .sidebar .nav-rail .nr-btn.on > span { color: inherit !important; font-weight: 800 !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-rail .nr-btn > svg { background: rgba(255, 255, 255, .07) !important; color: #9d9d9d !important; }
html[data-paper][data-theme="dark"] .sidebar .nav-rail .nr-btn.on > svg {
  background: linear-gradient(180deg, #5a5a5a 0%, #393939 100%) !important; color: #f4f4f4 !important;
}
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on:hover { background: transparent !important; box-shadow: none !important; }
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on { color: #d0d0d0 !important; }
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on > span { color: #d0d0d0 !important; }
/* 积压红点跟着砖的右上角走，而不是按钮的角 */
html[data-paper] .sidebar .nav-rail .nr-btn .nr-dot { top: 8px; right: 9px; }
html[data-paper] .sidebar .nav-rail .nr-btn.on .nr-dot { box-shadow: 0 0 0 2px #FFFFFF; }
html[data-paper][data-theme="dark"] .sidebar .nav-rail .nr-btn.on .nr-dot { box-shadow: 0 0 0 2px var(--nav-surface); }


/* ===========================================================================
   27. 页内页签 / 图表面板头 / 口径说明胶囊 统一（2026-10-08）
   ---------------------------------------------------------------------------
   ① 页内「视图」页签条：选中态原来是 **实心墨蓝块**
      （theme.css `.ov-tabs button.on{background:linear-gradient(180deg,var(--ui-brand-900),…)}`
      + `.on b{color:#fff}`）。一屏里"导航类目 + 页签"两块深色太重 ⇒ 换成与导航条目**同一套语言**：
      淡底（--nav-active-bg）+ 3px 墨色左条 + 墨色字；未选中改透明（原来每颗都是灰底方块）。
   ② 图表面板头（.ov3-h）：图标砖、标题、英文副标统一尺寸与灰度。
   ③ 口径说明胶囊（.pl-note-btn，polish-ux.js 生成）：原来没有基础外形（只有 hover 规则），
      靠通用 button 规则兜着，各页大小不一 ⇒ 统一成"白底 + 发丝线 + 999 圆角 + 11px"。
   ========================================================================== */

/* ① 页签条 */
html[data-paper]:not([data-theme="dark"]) #view .ov-tabs button {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: var(--p2-r-ctl) !important;
}
html[data-paper]:not([data-theme="dark"]) #view .ov-tabs button:hover {
  background: #f8f8f8 !important;
  border-color: transparent !important;
}
html[data-paper]:not([data-theme="dark"]) #view .ov-tabs button.on,
html[data-paper]:not([data-theme="dark"]) #view .ov-tabs button.on:hover {
  background: var(--nav-active-bg) !important;
  box-shadow: inset 3px 0 0 var(--nav-ink) !important;
  border-color: transparent !important;
}
html[data-paper] #view .ov-tabs button b { font-size: 13px !important; font-weight: 800 !important; letter-spacing: -.01em !important; color: var(--sk-ink-2) !important; }
html[data-paper] #view .ov-tabs button i { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .1em !important; color: var(--sk-ink-3) !important; }
html[data-paper] #view .ov-tabs button.on b { color: var(--nav-ink) !important; }
html[data-paper] #view .ov-tabs button.on i { color: #717171 !important; }
html[data-paper] #view :is(.ov-tabs-lb, .ov-tabs-note) { font-size: 11px !important; font-weight: 700 !important; color: var(--sk-ink-3) !important; }
html[data-paper][data-theme="dark"] #view .ov-tabs button.on { background: rgba(255, 255, 255, .08) !important; box-shadow: inset 3px 0 0 var(--nav-ink) !important; }
html[data-paper][data-theme="dark"] #view .ov-tabs button.on b { color: #eeeeee !important; }

/* ② 图表面板头 */
html[data-paper] #view .ov3-h :is(h3, .ov3-t) { font-size: 13px !important; font-weight: 800 !important; letter-spacing: -.01em !important; }
html[data-paper] #view .ov3-h .ov3-en {
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: .14em !important;
  text-transform: uppercase; color: var(--sk-ink-3) !important;
}
html[data-paper]:not([data-theme="dark"]) #view .ov3-h .ov3-ico {
  width: 24px !important; height: 24px !important; border-radius: 8px !important;
  background: #f6f6f6 !important; border: 1px solid var(--p2-line) !important; color: var(--nav-ink) !important;
}
html[data-paper] #view .ov3-h .ov3-meta { font-size: 11px !important; font-weight: 700 !important; color: var(--sk-ink-3) !important; }

/* ③ 口径说明胶囊 */
html[data-paper] #view .pl-note-btn {
  display: inline-flex !important; align-items: center !important; gap: 4px !important;
  min-height: 20px !important; height: 20px !important;
  padding: 0 8px !important; border-radius: 999px !important;
  border: 1px solid var(--p2-line) !important;
  background: #FFFFFF !important; color: var(--sk-ink-3) !important;
  font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0 !important;
}
html[data-paper] #view .pl-note-btn:hover,
html[data-paper] #view .pl-note.is-open .pl-note-btn {
  border-color: var(--nav-ink) !important; color: var(--nav-ink) !important; background: #FFFFFF !important;
}
html[data-paper] #view .pl-note-pop {
  border-radius: 12px !important; border-color: var(--p2-line) !important;
  box-shadow: var(--p2-sh-2) !important; font-size: 12px !important; line-height: 1.7 !important;
}


/* ===========================================================================
   33. 导航形态：顶部类目条 + 左栏二级（2026-10-09 第三版）
   ---------------------------------------------------------------------------
   用户先后否掉：① 一堵平铺列表「很乱」 ② 类目轨+面板「很割裂」 ③ 坞+浮岛「太丑」
                 ④ 单列+折叠「交互逻辑更不喜欢」
   ⇒ 本版**取消折叠/悬停/浮层**，改成企业后台最常见的形态（也是 bioligo.com 官网的形态）：

     ┌ 顶部品牌蓝条 ───────────────────────────────────────────────┐
     │ [BiOligo 标] 百力格生物 合成三部   │ 产线作业 生产监控 订单与交期 … │
     └───────────────────────────────────────────────────────────┘
     ┌ 左栏 208 ─┐┌ 内容 ────────────────────────────────────────┐
     │ 五道工序  ││ 顶栏（模块名 + 操作）                          │
     │ 合成工序  ││ 页签                                          │
     │ 氨解工序  ││ 页面内容                                      │
     │ …         ││                                               │
     │ 常用      ││                                               │
     │ 在线/退出 ││                                               │
     └───────────┘└───────────────────────────────────────────────┘

   交互：顶部 8 个类目**一次点击直达**；左栏只列"当前类目"的 3~7 条（永不折叠、永不滚动）；
        左栏底部「常用」按实际点击频次自动积累 4 条；页面被程序跳转时顶部条与左栏自动跟过去。

   回退：删 index.html 里的 `data-navm="groups"` + 把 nav-groups.js 换回 nav-collapse.js。
   =========================================================================== */
html[data-navm="groups"][data-paper] {
  --n3-w: 208px;
  --n3-top-h: 46px;
  --n3-brand-1: #0767C5;
  --n3-brand-2: #1A7BD9;
  --n3-side-bg: #FFFFFF;
  --n3-ink: #1B2430;
  --n3-ink2: #55636F;
  --n3-ink3: #8A97A4;
  --n3-hover: #F1F6FC;
  --n3-active: #E8F1FB;
  --n3-line: #E4E9F0;
  --n3-accent: #1A7BD9;
}
html[data-navm="groups"][data-paper][data-theme="dark"] {
  --n3-side-bg: #161A20;
  --n3-ink: #ECF1F7; --n3-ink2: #A8B4C2; --n3-ink3: #7C8896;
  --n3-hover: rgba(255, 255, 255, .06);
  --n3-active: rgba(26, 123, 217, .22);
  --n3-line: #262E38;
  --n3-accent: #63A9E8;
  --n3-brand-1: #0A4E8E; --n3-brand-2: #1466B4;
}

/* ① 顶部品牌蓝条 */
html[data-navm="groups"][data-paper] body .navtop {
  flex: none !important;
  height: var(--n3-top-h) !important;
  display: flex !important; align-items: center !important; gap: 4px !important;
  padding: 0 12px 0 10px !important;
  background: linear-gradient(90deg, var(--n3-brand-1) 0%, var(--n3-brand-2) 62%, #2A8FE4 100%) !important;
  color: #FFFFFF !important;
  position: relative !important; z-index: 40 !important;
}
html[data-navm="groups"][data-paper] body .navtop .brand {
  flex: none !important; flex-direction: row !important; align-items: center !important;
  gap: 9px !important; padding: 0 14px 0 0 !important; margin: 0 !important;
  border: 0 !important; overflow: visible !important;
  border-right: 1px solid rgba(255, 255, 255, .22) !important;
}
html[data-navm="groups"][data-paper] body .navtop .brand .logo {
  width: 26px !important; height: 26px !important; border-radius: 8px !important;
  background: rgba(255, 255, 255, .18) !important;
  border: 1px solid rgba(255, 255, 255, .34) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3) !important;
}
html[data-navm="groups"][data-paper] body .navtop .brand .logo svg { width: 15px !important; height: 15px !important; }
html[data-navm="groups"][data-paper] body .navtop .brand h1 {
  font-size: 12.5px !important; font-weight: 800 !important; line-height: 1.15 !important;
  letter-spacing: .02em !important; color: #FFFFFF !important; white-space: nowrap !important;
}
html[data-navm="groups"][data-paper] body .navtop .brand .sub { display: none !important; }
html[data-navm="groups"][data-paper] body .navtop .nv-tabs {
  display: flex !important; align-items: center !important; gap: 2px !important;
  margin-left: 6px !important; overflow-x: auto !important; scrollbar-width: none !important;
  min-width: 0 !important;
}
html[data-navm="groups"][data-paper] body .navtop .nv-tabs::-webkit-scrollbar { height: 0 !important; }
html[data-navm="groups"][data-paper] body .navtop .nv-tab {
  height: 30px !important; padding: 0 13px !important; flex: none !important;
  border: 0 !important; border-radius: 8px !important; background: transparent !important;
  color: rgba(255, 255, 255, .86) !important;
  font: inherit !important; font-size: 12.5px !important; font-weight: 700 !important;
  letter-spacing: .01em !important; white-space: nowrap !important; cursor: pointer !important;
  transition: background .14s ease, color .14s ease !important;
}
html[data-navm="groups"][data-paper] body .navtop .nv-tab:hover {
  background: rgba(255, 255, 255, .16) !important; color: #FFFFFF !important;
}
html[data-navm="groups"][data-paper] body .navtop .nv-tab.on,
html[data-navm="groups"][data-paper] body .navtop .nv-tab.on:hover {
  background: #FFFFFF !important; color: #0F63B4 !important;
  box-shadow: 0 6px 14px -8px rgba(3, 32, 62, .75) !important;
}

/* ② 左栏：只显示当前类目 */
html[data-navm="groups"][data-paper] body .sidebar {
  width: var(--n3-w) !important; flex: 0 0 var(--n3-w) !important;
  padding: 12px 10px 10px !important; gap: 2px !important;
  background: var(--n3-side-bg) !important;
  border-right: 1px solid var(--n3-line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  overflow: visible !important;
}
html[data-navm="groups"][data-paper] body .sidebar .brand { display: none !important; }  /* 已搬到顶条 */
html[data-navm="groups"][data-paper] body .sidebar nav {
  overflow-y: auto !important; overflow-x: hidden !important;
}
html[data-navm="groups"][data-paper] body .sidebar nav::-webkit-scrollbar { width: 5px !important; }
html[data-navm="groups"][data-paper] body .sidebar nav::-webkit-scrollbar-thumb {
  background: var(--n3-line) !important; border-radius: 999px !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nav-hide { display: none !important; }
html[data-navm="groups"][data-paper] body .sidebar :is(.nav-pin, .nav-group) {
  margin: 0 0 2px !important; padding: 0 !important; border: 0 !important;
}
/* 类目名在左栏顶部当"区标题"（不可点、无三角） */
html[data-navm="groups"][data-paper] body .sidebar :is(.nav-pin .np-h, .nav-group > .gt) {
  display: flex !important; align-items: center !important; gap: 6px !important;
  margin: 0 !important; padding: 4px 8px 8px !important;
  font-size: 11px !important; font-weight: 800 !important; letter-spacing: .14em !important;
  text-transform: none !important; color: var(--n3-ink3) !important;
  background: transparent !important; cursor: default !important;
}
html[data-navm="groups"][data-paper] body .sidebar :is(.nav-pin .np-h, .nav-group > .gt) em {
  margin-left: auto !important; font-style: normal !important; font-size: 10px !important;
  letter-spacing: 0 !important; color: var(--n3-ink3) !important;
}
html[data-navm="groups"][data-paper] body .sidebar :is(.nav-pin, .nav-group) .nav-item {
  margin: 0 0 1px !important; padding: 9px 10px !important; gap: 9px !important;
  border: 0 !important; border-radius: 9px !important;
  font-size: 13px !important; font-weight: 600 !important;
  color: var(--n3-ink2) !important;
  transition: background .14s ease, color .14s ease, box-shadow .14s ease !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nav-item svg { width: 16px !important; height: 16px !important; opacity: .58 !important; }
html[data-navm="groups"][data-paper] body .sidebar .nav-item:hover {
  background: var(--n3-hover) !important; color: var(--n3-ink) !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nav-item:hover svg { opacity: .95 !important; }
html[data-navm="groups"][data-paper] body .sidebar .nav-item.active,
html[data-navm="groups"][data-paper] body .sidebar .nav-item.on {
  background: var(--n3-active) !important; color: var(--n3-accent) !important;
  font-weight: 800 !important;
  box-shadow: inset 3px 0 0 var(--n3-accent) !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nav-item.active :is(svg, span),
html[data-navm="groups"][data-paper] body .sidebar .nav-item.on :is(svg, span) {
  color: var(--n3-accent) !important; opacity: 1 !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nav-item.active::after,
html[data-navm="groups"][data-paper] body .sidebar .nav-item.on::after { display: none !important; }
html[data-navm="groups"][data-paper] body .sidebar .nav-badge {
  margin-left: auto !important; background: var(--ui-danger-bg) !important;
  color: var(--ui-danger-ink) !important; border: 1px solid var(--ui-danger-line) !important;
  border-radius: 999px !important; padding: 0 6px !important; height: 16px !important;
  line-height: 15px !important; font-size: 10px !important; font-weight: 800 !important;
}
/* ③ 左栏「常用」 */
html[data-navm="groups"][data-paper] body .sidebar .nav-recent {
  margin: 14px 0 0 !important; padding: 12px 0 0 !important;
  border-top: 1px solid var(--n3-line) !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nv-rc-h {
  padding: 0 8px 6px !important; font-size: 11px !important; font-weight: 800 !important;
  letter-spacing: .14em !important; color: var(--n3-ink3) !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nv-rc {
  display: flex !important; align-items: center !important; gap: 9px !important;
  width: 100% !important; margin: 0 0 1px !important; padding: 8px 10px !important;
  border: 0 !important; border-radius: 9px !important; background: transparent !important;
  font: inherit !important; font-size: 12.5px !important; font-weight: 600 !important;
  color: var(--n3-ink2) !important; text-align: left !important; cursor: pointer !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nv-rc:hover {
  background: var(--n3-hover) !important; color: var(--n3-ink) !important;
}
html[data-navm="groups"][data-paper] body .sidebar .nv-rc svg { width: 15px !important; height: 15px !important; opacity: .55 !important; }
/* ④ 底部：连接状态 + 登录/退出 */
html[data-navm="groups"][data-paper] body .sidebar .side-foot {
  margin-top: auto !important; padding: 10px 0 0 !important; gap: 8px !important;
  border-top: 1px solid var(--n3-line) !important; align-items: stretch !important;
}
html[data-navm="groups"][data-paper] body .sidebar .side-foot .conn,
html[data-navm="groups"][data-paper] body .sidebar .side-foot .conn span {
  color: var(--n3-ink2) !important; font-size: 11.5px !important;
  flex-direction: row !important; width: auto !important; max-width: none !important; text-align: left !important;
}
html[data-navm="groups"][data-paper] body .sidebar .side-foot .btn-ghost {
  width: 100% !important; flex-direction: row !important; justify-content: center !important;
  padding: 8px 10px !important; gap: 7px !important; border-radius: 10px !important;
  font-size: 12px !important; font-weight: 700 !important; white-space: normal !important;
  background: transparent !important; border: 1px solid var(--n3-line) !important;
  color: var(--n3-ink2) !important;
}
html[data-navm="groups"][data-paper] body .sidebar .side-foot .btn-ghost :is(span, svg) { color: inherit !important; }
html[data-navm="groups"][data-paper] body .sidebar .side-foot .btn-ghost:hover {
  background: var(--n3-hover) !important; border-color: var(--n3-accent) !important; color: var(--n3-accent) !important;
}
/* ⑤ ≤760px：顶条可横滚，左栏变抽屉 */
html[data-navm="groups"][data-paper] .nav-burger { display: none; }
@media (max-width: 760px) {
  html[data-navm="groups"][data-paper] { --n3-w: 226px; --n3-top-h: 44px; }
  html[data-navm="groups"][data-paper] body .navtop .brand h1 { display: none; }
  html[data-navm="groups"][data-paper] body .sidebar {
    position: fixed !important; left: 0; top: var(--n3-top-h); bottom: 0; z-index: 80 !important;
    transform: translateX(-102%); transition: transform .2s ease !important;
    box-shadow: 18px 0 40px -24px rgba(10, 24, 40, .5) !important;
  }
  html[data-navm="groups"][data-paper] body.nav-drawer .sidebar { transform: none !important; }
  html[data-navm="groups"][data-paper] body.nav-drawer::after {
    content: ""; position: fixed; inset: var(--n3-top-h) 0 0 0; z-index: 75; background: rgba(10, 24, 40, .30);
  }
  html[data-navm="groups"][data-paper] .nav-burger {
    display: inline-flex !important; position: fixed; left: 8px; top: 8px; z-index: 90;
    width: 30px; height: 30px; align-items: center; justify-content: center;
    border-radius: 8px; cursor: pointer; border: 1px solid rgba(255, 255, 255, .35);
    background: rgba(255, 255, 255, .16); color: #fff;
  }
  html[data-navm="groups"][data-paper] .nav-burger svg { width: 16px; height: 16px; }
}


/* ===========================================================================
   34. 整体配色「BiOligo 品牌蓝」（2026-10-09 · 用户："去搜索百力格生物科技上海股份有限公司看用什么色调合适"）
   ---------------------------------------------------------------------------
   依据（`_qctest/site-shot.cjs` 抓官网 + 解析 bioligo.com 的 CSS，见
   `_qctest/_brand-probe.cjs` 的输出）：
     主色   #1A7BD9（出现 18 次：hover 强调色 / 按钮渐变起点 / 顶菜单 hover）
     深蓝   #2A67C5 · #0767C5（顶部通栏 38px / footer 底 / 深档 hover）
     亮蓝   #479BED · #399AF8（按钮渐变尾 / 亮档 hover）
     辅色   #56A7A2（banner-3 分类卡底 —— 官网唯一的青绿）
     页面底 #F5F7FA   正文 #333333 / #555555
   ⇒ 本系统按"**中性灰白打底 + 品牌蓝作唯一强调色 + 品牌青绿作第二身份色**"落地，
     蓝色只出现在"顶栏条 / 选中 / 主按钮 / 链接"这些**该蓝的地方**，不做满屏蓝。

   换配色只需改本节色值（+ echarts-theme.js 的 TOKEN/色板），几何一行不动。
   回退：删掉本节 ⇒ 回到上一版「象牙 · 黄铜」。
   =========================================================================== */
/* ⚠ 配色与"导航形态"解绑：这一节的开关是 `html[data-paper]`（皮肤层），不是 data-navm。
   换导航形态时配色必须跟着走，否则会退回 §32 的青绿。 */
html[data-paper]:not([data-theme="dark"]) {
  /* 内容底 / 卡 / 线 —— 取官网 #F5F7FA 系 */
  --sk-page: #F5F7FA;
  --sk-page-2: #EDF1F6;
  --sk-card: #FFFFFF;
  --sk-soft: #F8FAFC;
  --sk-line: #E4E9F0;
  --sk-line-2: #EFF3F8;
  --sk-accent: #1A7BD9;
  --sk-accent-2: #1568BE;
  --sk-accent-deep: #0F63B4;
  --sk-accent-soft: rgba(26, 123, 217, .10);
  --sk-grad: linear-gradient(135deg, #1A7BD9 0%, #0767C5 100%);

  --ui-bg-page: #F5F7FA;
  --ui-bg-soft: #F8FAFC;
  --ui-line-200: #E4E9F0;
  --ui-line-100: #EFF3F8;
  --ui-brand-600: #1A7BD9;
  --ui-brand-500: #1568BE;
  --ui-brand-700: #0F63B4;
  --ui-brand-900: #0B4E8E;
  --ui-brand-100: #E8F1FB;
  --ui-brand-050: #F5F9FE;
  --ui-info-ink: #0F63B4;
  --ui-info-solid: #1A7BD9;
  --ui-ink-900: #1B2430;

  --nav-ink: #1A7BD9;
  --nav-ink-deep: #0F63B4;
  --nav-active-bg: #E8F1FB;
  --nav-hover: #F1F6FC;
  --nav-line: #E4E9F0;

  /* KPI 身份色（§17 的六组 --h-*）：品牌蓝主 · 品牌青绿次 · 靛/石墨中性 · 红琥珀语义 */
  --h-brand-ink: #0F63B4; --h-brand-tint: #E8F1FB; --h-brand-line: #C9DFF6; --h-brand-solid: #1A7BD9;
  --h-cyan-ink: #2F7C76;  --h-cyan-tint: #EDF6F5;  --h-cyan-line: #CFE4E2;  --h-cyan-solid: #56A7A2;
  --h-indigo-ink: #3D5A80; --h-indigo-tint: #EEF2F7; --h-indigo-line: #D5DFEA; --h-indigo-solid: #5B7FA6;
  --h-slate-ink: #4A5560; --h-slate-tint: #F4F6F8; --h-slate-line: #E3E8ED; --h-slate-solid: #6B7885;

  /* 工序功能色：青 = 品牌青绿 #56A7A2 */
  --pl-cyan: #56A7A2; --pl-cyan-ink: #2F7C76; --pl-cyan-bg: #EDF6F5; --pl-cyan-line: #CFE4E2;
  /* ★★ 2026-10-09（用户连问三次"还是粉色/没有变化"）：**真正的粉色来源是这两个令牌**
     （`tokens.css:50` / `polish.css:25` 定义的 --pl-pink 族 = 「分装工序」身份色），
     前面几轮我只改了 JS 里的颜色表，令牌没动 ⇒ 凡是 var(--pl-pink) 画的东西（含
     「2767 上机文件」预览里那张 96 孔板、分装工序的色条/角标）一直是品红/浅粉。
     这里把整族换成**墨紫**（与"未标注纯化方式"同色，既消掉粉色又保留分装的辨识度）。 */
  --pl-pink: #8A76A0;
  --pl-pink-ink: #6A5A7A;
  --pl-pink-bg: #F3F0F7;
  --pl-pink-line: #DED6E8;
}
/* 深色档：点缀提亮，底/线走深色原有那套 */
html[data-paper][data-theme="dark"] {
  --sk-accent: #63A9E8;
  --sk-accent-2: #7FB9EE;
  --sk-accent-deep: #4A90D0;
  --nav-ink: #63A9E8;
  --nav-ink-deep: #4A90D0;
  --nav-active-bg: rgba(99, 169, 232, .18);
  --ui-brand-600: #63A9E8;
  --ui-brand-500: #7FB9EE;
  --ui-brand-700: #4A90D0;
  --ui-brand-100: rgba(99, 169, 232, .18);
  --h-brand-ink: #7FB9EE; --h-brand-tint: rgba(99, 169, 232, .12); --h-brand-line: rgba(127, 185, 238, .26); --h-brand-solid: #4A90D0;
  --h-cyan-ink: #79C4BE;  --h-cyan-tint: rgba(86, 167, 162, .14); --h-cyan-line: rgba(121, 196, 190, .26); --h-cyan-solid: #56A7A2;
}
/* 页面底纹：一层极淡的品牌蓝光（保持"灰白"观感，不做渐变块） */
html[data-paper]:not([data-theme="dark"]) body {
  background-image:
    radial-gradient(1200px 620px at 4% -14%, rgba(26, 123, 217, .06), transparent 62%),
    radial-gradient(900px 520px at 102% -8%, rgba(86, 167, 162, .045), transparent 60%),
    linear-gradient(180deg, #F7F9FC 0%, #F1F4F8 100%) !important;
}
/* 表格"当前行"高亮（引物流转查询）：跟新的选中蓝同一套 */
html[data-paper] #view .tr-t2 tbody tr.on > td,
html[data-paper] #view .tr-t2 tbody tr.on td { background: #E8F1FB !important; }
html[data-paper] #view .tr-t2 tbody tr:hover > td,
html[data-paper] #view .tr-t2 tbody tr:hover td { background: #F4F8FD !important; }


/* ===========================================================================
   35. 生产概览「版面收敛」（2026-10-09 · 用户："生产概览这个页面我怎么看都是很混乱"）
   ---------------------------------------------------------------------------
   实测这一页的高度分布（`_qctest/probe-ov.cjs`）：
     .ov-hero.is-dash 297px（信息条 40 + 5 张 KPI 163 + 今日实况 30）
     .ov-act-wrap 58（三张告警并排）· .ov-tabs 48 · .ov3-grid 378（4 张图）
   "乱"的四个来源与对策（**只动这一页，用 :has() 精确限定**）：
     ① 每张 KPI 卡塞了 5 层（标签/大数/副标/迷你图/底下那行小字）⇒ 收紧间距、副标与脚注降一档；
     ② 每张图卡里挂着两颗"口径说明"胶囊，悬在图里很扎眼 ⇒ 收成安静的 10.5px 小胶囊（hover 才显形）；
     ③ 信息条里"系统状态"和"业务数字"同权重 ⇒ 状态类降灰、业务数字保持；
     ④ 图表区被挤到 378px ⇒ KPI 省下的高度全部让给图表。
   =========================================================================== */
@supports selector(:has(*)) {
  /* ① 头部信息条：状态降灰、数字留白 */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-hero.is-dash {
    padding: 10px 14px 12px !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-hero-top {
    height: auto !important; margin-bottom: 8px !important; align-items: center !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-hs { gap: 8px !important; row-gap: 6px !important; }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) :is(.ov-hs-k, .ov-live) {
    font-size: 11.5px !important; color: var(--sk-ink-3) !important; font-weight: 600 !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-delta {
    font-size: 12px !important; padding: 3px 9px !important; border-radius: 8px !important;
  }
  /* ② KPI 卡：5 层压到 4 层半（脚注降一档、迷你图不变） */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpis-dark { gap: 10px !important; }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d { padding: 10px 12px 8px !important; }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-lb {
    font-size: 12px !important; margin-bottom: 2px !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-vl {
    font-size: 30px !important; line-height: 1.1 !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-sb {
    font-size: 11px !important; margin-top: 2px !important; opacity: .9 !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-viz {
    height: 18px !important; margin: 5px 0 0 !important;
  }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-viz svg { height: 18px !important; }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-cap {
    font-size: 10.5px !important; line-height: 1.35 !important; margin-top: 6px !important;
    padding-top: 5px !important; border-top: 1px solid var(--sk-line-2) !important; opacity: .82 !important;
  }
  /* ③ 今日实况：压成一条安静的小字条 */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-today {
    margin-top: 8px !important; height: 24px !important; opacity: .9 !important;
    font-size: 11.5px !important;
  }
  /* ④ 告警三张：统一内边距与圆角（原来是三种高度） */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-act-wrap { gap: 10px !important; }
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov-act-wrap > * {
    padding: 8px 12px !important; border-radius: 10px !important; min-height: 0 !important;
  }
  /* ⑤ 「口径说明」胶囊：安静下来（hover 才显形），不再跟图表抢视线 */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .pl-note-btn {
    height: 18px !important; min-height: 18px !important; padding: 0 6px !important;
    font-size: 10.5px !important; border-color: transparent !important; background: transparent !important;
    color: var(--sk-ink-3) !important; opacity: .7 !important;
  }
  /* 同一张卡里的两颗胶囊排成一行（原来各占一行，白吃 26px 高度） */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .pl-note {
    display: inline-flex !important; align-items: center !important;
    margin: 0 10px 0 0 !important; vertical-align: middle !important;
  }
  /* ⚠ 不要再动 `.pl-note` 的**父容器** display：实测卡片的 note 是**卡片的直接子节点**，
     给 `*:has(> .pl-note){display:inline-block}` 会把卡片本身踢出 flex ⇒ 胶囊被挤到卡外、
     又被圆角 overflow 裁掉（等于"口径说明"整颗消失）。只调胶囊自己就够了。 */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .pl-note-btn:hover {
    background: var(--sk-soft) !important; border-color: var(--sk-line) !important; opacity: 1 !important;
  }
  /* ⑥ 图表区：把 KPI 省下的高度让给图，卡片之间呼吸一致 */
  html[data-navm="groups"][data-paper] #view:has(.ov-hero.is-dash) .ov3-grid { gap: 12px !important; }
}


/* ===========================================================================
   36. 布局再调整：**取消左栏** + 二级做成横向条（2026-10-09 第四版 · 用户："完全是在敷衍侮辱我"）
   ---------------------------------------------------------------------------
   用户截图里三个"敷衍"的证据（我逐条认）：
     ① 左栏 208px 只放 5 条，剩 400+px 纯空白 —— 一列白墙；
     ② 顶部三条横栏叠着（品牌条 / 模块名条 / 页签条），模块名与左栏选中项重复；
     ③ 概览图表卡大片空白、KPI 卡里又塞迷你图与脚注，没有主次。
   对策：
     · **左栏整列撤掉** ⇒ 内容拿到整宽（+208px）；所有类目在品牌条上一键直达（与 bioligo.com 官网同构）；
     · 当前类目的条目变成品牌条正下方的**二级横向条**（一行放得下，永不折叠、永不滚动到看不见）；
     · 「常用」（按点击频次自动积累）钉在二级条右端；
     · 顶栏与页签条各压 6~8px，把三条横栏的总高压到比原来还矮。
   回退：删本节 + `nav-groups.js` 里 `sub.appendChild(c.el)` 那一段（恢复左栏）。
   =========================================================================== */
html[data-navm="groups"][data-paper] body .sidebar { display: none !important; }

/* 二级横向条 */
html[data-navm="groups"][data-paper] body .subnav {
  flex: none !important;
  height: 40px !important;
  display: flex !important; align-items: center !important; gap: 2px !important;
  padding: 0 12px !important;
  background: #FFFFFF !important;
  border-bottom: 1px solid var(--n3-line) !important;
  overflow-x: auto !important; overflow-y: hidden !important;
  scrollbar-width: none !important;
  position: relative !important; z-index: 35 !important;
}
html[data-navm="groups"][data-paper] body .subnav::-webkit-scrollbar { height: 0 !important; }
html[data-navm="groups"][data-paper] body .subnav :is(.nav-pin, .nav-group) {
  display: flex !important; flex-direction: row !important; align-items: center !important;
  gap: 2px !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; flex: none !important;
}
html[data-navm="groups"][data-paper] body .subnav .nav-hide { display: none !important; }
html[data-navm="groups"][data-paper] body .subnav .nav-item,
html[data-navm="groups"][data-paper] body .subnav .nav-item.on,
html[data-navm="groups"][data-paper] body .subnav .nav-item.active {
  display: inline-flex !important; align-items: center !important; gap: 7px !important;
  height: 28px !important; min-height: 28px !important;
  margin: 0 !important; padding: 0 12px !important;
  border-radius: 8px !important; border: 0 !important; background: transparent !important;
  font-size: 12.5px !important; font-weight: 700 !important;
  color: var(--n3-ink2) !important; white-space: nowrap !important; cursor: pointer !important;
  box-shadow: none !important;
}
html[data-navm="groups"][data-paper] body .subnav .nav-item svg {
  width: 15px !important; height: 15px !important; opacity: .58 !important;
}
html[data-navm="groups"][data-paper] body .subnav .nav-item:hover {
  background: var(--n3-hover) !important; color: var(--n3-ink) !important;
}
html[data-navm="groups"][data-paper] body .subnav .nav-item:hover svg { opacity: .95 !important; }
html[data-navm="groups"][data-paper] body .subnav .nav-item.active,
html[data-navm="groups"][data-paper] body .subnav .nav-item.on {
  background: var(--n3-active) !important; color: var(--n3-accent) !important;
  box-shadow: inset 0 -2px 0 var(--n3-accent) !important;
}
html[data-navm="groups"][data-paper] body .subnav .nav-item.active :is(svg, span),
html[data-navm="groups"][data-paper] body .subnav .nav-item.on :is(svg, span) {
  color: var(--n3-accent) !important; opacity: 1 !important;
}
html[data-navm="groups"][data-paper] body .subnav .nav-item.active::after,
html[data-navm="groups"][data-paper] body .subnav .nav-item.on::after { display: none !important; }
html[data-navm="groups"][data-paper] body .subnav .nav-badge {
  margin-left: 2px !important; background: var(--ui-danger-bg) !important;
  color: var(--ui-danger-ink) !important; border: 1px solid var(--ui-danger-line) !important;
  border-radius: 999px !important; padding: 0 5px !important; height: 15px !important;
  line-height: 14px !important; font-size: 10px !important; font-weight: 800 !important;
}
/* 常用：钉在二级条右端 */
html[data-navm="groups"][data-paper] body .subnav .nv-quick {
  display: flex !important; align-items: center !important; gap: 4px !important;
  margin: 0 0 0 auto !important; padding: 0 0 0 12px !important;
  border-top: 0 !important; border-left: 1px solid var(--n3-line) !important;
}
html[data-navm="groups"][data-paper] body .subnav .nv-quick.nav-hide { display: none !important; }
html[data-navm="groups"][data-paper] body .subnav .nv-rc-h {
  padding: 0 !important; font-size: 10.5px !important; font-weight: 800 !important;
  letter-spacing: .12em !important; color: var(--n3-ink3) !important; white-space: nowrap !important;
}
html[data-navm="groups"][data-paper] body .subnav .nv-rc {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  width: auto !important; height: 26px !important; margin: 0 !important; padding: 0 10px !important;
  border: 1px solid var(--n3-line) !important; border-radius: 999px !important;
  background: var(--sk-soft) !important;
  font: inherit !important; font-size: 12px !important; font-weight: 600 !important;
  color: var(--n3-ink2) !important; white-space: nowrap !important; cursor: pointer !important;
}
html[data-navm="groups"][data-paper] body .subnav .nv-rc:hover {
  border-color: var(--n3-accent) !important; color: var(--n3-accent) !important;
}
html[data-navm="groups"][data-paper] body .subnav .nv-rc svg { width: 14px !important; height: 14px !important; opacity: .6 !important; }

/* 顶栏 / 页签条一起压薄：三条横栏总高 ≤ 原来 */
html[data-navm="groups"][data-paper] body .topbar { padding: 8px 18px !important; }
html[data-navm="groups"][data-paper] body .app-tabs { padding: 4px 18px 0 !important; }
html[data-navm="groups"][data-paper] .nav-burger { display: none !important; }

/* 二级条左端那枚"当前类目"标签（.np-h / .gt 被搬进二级条后自然成了段首标签，留着当定位） */
html[data-navm="groups"][data-paper] body .subnav :is(.nav-pin .np-h, .nav-group > .gt) {
  display: flex !important; align-items: center !important; gap: 6px !important;
  height: 100% !important; margin: 0 10px 0 0 !important; padding: 0 12px 0 2px !important;
  border-right: 1px solid var(--n3-line) !important;
  font-size: 11px !important; font-weight: 800 !important; letter-spacing: .12em !important;
  color: var(--n3-ink3) !important; white-space: nowrap !important;
}
html[data-navm="groups"][data-paper] body .subnav :is(.nav-pin .np-h, .nav-group > .gt) em {
  margin: 0 !important; font-style: normal !important; font-size: 10px !important;
  letter-spacing: 0 !important; color: var(--n3-ink3) !important; opacity: .8 !important;
}


/* ===========================================================================
   38. 定稿：左栏「两栏式」精修（2026-10-09 · 用户："左栏必须保留，还是那种两栏的交互样式，做的精美一些"）
   ---------------------------------------------------------------------------
   形态＝ nav-collapse.js 建出来的 **62px 类目轨 + 条目面板**（两栏），本节只做精修：
     · 两栏读成**一块表面**：轨底 #F6F8FB、面板纯白、中间一道发丝线（不再是两个色块硬碰）
     · 轨上每项 = 30×30 图标砖 + 10px 标签；选中 = 品牌蓝砖 + 白图标 + 左缘蓝条
     · 面板头 = 类目名(13px/800) + 右侧「N 项」胶囊；条目行 34px，选中 = 淡蓝底 + 蓝字 + 3px 左条
     · 品牌区、底部连接/退出一起并进同一套蓝白语言（配色见 §34）
   回退：删掉本节 ⇒ 回到 §23/§26 的上一版两栏观感。
   =========================================================================== */
html[data-paper] {
  --n4-w: 236px;
  --n4-rail: 62px;
  --n4-rail-bg: #F6F8FB;
  --n4-rail-btn: #EDF2F8;
  --n4-ink: #1B2430;
  --n4-ink2: #55636F;
  --n4-ink3: #8A97A4;
  --n4-line: #E4E9F0;
  --n4-hover: #F1F6FC;
  --n4-active: #E8F1FB;
  --n4-accent: #1A7BD9;
}
html[data-paper][data-theme="dark"] {
  --n4-rail-bg: rgba(255, 255, 255, .03);
  --n4-rail-btn: rgba(255, 255, 255, .07);
  --n4-ink: #ECF1F7; --n4-ink2: #A8B4C2; --n4-ink3: #7C8896;
  --n4-line: #262E38; --n4-hover: rgba(255, 255, 255, .06);
  --n4-active: rgba(99, 169, 232, .18); --n4-accent: #63A9E8;
}

/* ① 侧栏外壳 */
html[data-paper] body .sidebar {
  width: var(--n4-w) !important; flex: 0 0 var(--n4-w) !important;
  padding: 12px 10px 10px !important; gap: 0 !important;
  background: #FFFFFF !important;
  border-right: 1px solid var(--n4-line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html[data-paper][data-theme="dark"] body .sidebar { background: #14181E !important; }
/* ② 品牌区（紧凑：34 图标 + 两行 12.5/10） */
html[data-paper] body .sidebar .brand {
  flex-direction: row !important; align-items: center !important; gap: 9px !important;
  padding: 2px 4px 12px !important; margin: 0 !important;
  border-bottom: 1px solid var(--n4-line) !important;
}
html[data-paper] body .sidebar .brand .logo {
  width: 32px !important; height: 32px !important; border-radius: 10px !important;
  background: linear-gradient(150deg, #2A8FE4 0%, #0767C5 100%) !important;
  border: 0 !important;
  box-shadow: 0 8px 16px -12px rgba(7, 60, 110, .9), inset 0 1px 0 rgba(255, 255, 255, .3) !important;
}
html[data-paper] body .sidebar .brand .logo svg { width: 17px !important; height: 17px !important; }
html[data-paper] body .sidebar .brand h1 {
  font-size: 12.5px !important; line-height: 1.25 !important; letter-spacing: .01em !important;
  font-weight: 800 !important; color: var(--n4-ink) !important; white-space: normal !important;
}
html[data-paper] body .sidebar .brand .sub { display: none !important; }

/* ③ 两栏容器：一块表面 + 中间一道发丝线 */
html[data-paper] body .sidebar nav { overflow: visible !important; padding: 0 !important; }
html[data-paper] body .sidebar .nav-body {
  display: flex !important; gap: 0 !important; margin: 6px 0 0 !important;
  border: 1px solid var(--n4-line) !important; border-radius: 12px !important;
  overflow: hidden !important; background: #FFFFFF !important;
}
html[data-paper][data-theme="dark"] body .sidebar .nav-body { background: #171C22 !important; }
html[data-paper] body .sidebar .nav-rail {
  width: var(--n4-rail) !important; flex: 0 0 var(--n4-rail) !important;
  padding: 5px 0 !important; gap: 2px !important;
  background: var(--n4-rail-bg) !important;
  border-right: 1px solid var(--n4-line) !important;
  overflow-y: auto !important; overflow-x: hidden !important; scrollbar-width: none !important;
}
html[data-paper] body .sidebar .nav-rail::-webkit-scrollbar { width: 0 !important; }
/* ④ 轨上的类目：30×30 图标砖 + 10px 标签 */
html[data-paper] body .sidebar .nav-rail .nr-btn {
  position: relative !important;
  width: 54px !important; height: 52px !important; min-height: 52px !important;
  margin: 0 auto !important; padding: 5px 2px !important; gap: 3px !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  border: 0 !important; border-radius: 11px !important; background: transparent !important;
  box-shadow: none !important;
  color: var(--n4-ink2) !important;
  font-size: 10px !important; font-weight: 700 !important; letter-spacing: .01em !important;
  transition: background .14s ease, color .14s ease !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn > svg {
  box-sizing: content-box !important;
  width: 16px !important; height: 16px !important; padding: 7px !important;
  border-radius: 9px !important;
  background: var(--n4-rail-btn) !important;
  color: inherit !important; opacity: 1 !important; stroke-width: 1.6 !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn > span {
  font-size: 10px !important; font-weight: 700 !important; line-height: 1.1 !important;
  white-space: nowrap !important; letter-spacing: 0 !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:hover {
  background: var(--n4-hover) !important; color: var(--n4-ink) !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:hover > svg { background: #E4EDF8 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on:hover {
  background: var(--n4-active) !important; color: var(--n4-accent) !important; box-shadow: none !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on > svg {
  background: linear-gradient(160deg, #2A8FE4 0%, #0F63B4 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 12px -8px rgba(15, 99, 180, .95) !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on > span { color: var(--n4-accent) !important; font-weight: 800 !important; }
html[data-paper] body .sidebar .nav-rail .nr-btn.on::before {
  content: "" !important; display: block !important;
  position: absolute !important; left: 0 !important; top: 12px !important; bottom: 12px !important;
  width: 3px !important; border-radius: 0 3px 3px 0 !important;
  background: var(--n4-accent) !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:first-child { margin-bottom: 8px !important; }
html[data-paper] body .sidebar .nav-rail .nr-btn:first-child::after {
  content: "" !important; position: absolute !important; left: 8px !important; right: 8px !important;
  bottom: -5px !important; height: 1px !important; background: var(--n4-line) !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn .nr-dot {
  top: 5px !important; right: 6px !important; width: 7px !important; height: 7px !important;
  box-shadow: 0 0 0 2px var(--n4-rail-bg) !important;
}
/* ⑤ 面板 */
html[data-paper] body .sidebar .nav-panel {
  flex: 1 !important; min-width: 0 !important;
  display: flex !important; flex-direction: column !important;
  padding: 8px 8px 10px !important;
  background: transparent !important; overflow-y: auto !important; overflow-x: hidden !important;
}
html[data-paper] body .sidebar .nav-panel-h {
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 4px 6px 10px !important; margin: 0 0 6px !important;
  border-bottom: 1px solid var(--n4-line) !important;
  font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0 !important;
  color: var(--n4-ink) !important;
}
html[data-paper] body .sidebar .nav-panel-h > span { font-size: 13px !important; color: var(--n4-ink) !important; }
html[data-paper] body .sidebar .nav-panel-h > i {
  margin-left: auto !important; font-style: normal !important; font-size: 10px !important;
  letter-spacing: 0 !important; color: var(--n4-ink3) !important;
  background: var(--n4-rail-btn) !important; border-radius: 999px !important; padding: 2px 7px !important;
}
html[data-paper] body .sidebar .nav-cat { min-width: 0 !important; }
html[data-paper] body .sidebar .nav-item,
html[data-paper][data-theme="dark"] body .sidebar .nav-item {
  margin: 0 0 1px !important; padding: 8px 9px !important; gap: 8px !important;
  border: 0 !important; border-radius: 8px !important;
  font-size: 12.5px !important; font-weight: 600 !important; color: var(--n4-ink2) !important;
  transition: background .14s ease, color .14s ease, box-shadow .14s ease !important;
}
html[data-paper] body .sidebar .nav-item svg { width: 15px !important; height: 15px !important; opacity: .55 !important; }
html[data-paper] body .sidebar .nav-item:hover { background: var(--n4-hover) !important; color: var(--n4-ink) !important; }
html[data-paper] body .sidebar .nav-item:hover svg { opacity: .95 !important; }
html[data-paper] body .sidebar .nav-item.active,
html[data-paper] body .sidebar .nav-item.on,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.active,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.on {
  background: var(--n4-active) !important; color: var(--n4-accent) !important;
  font-weight: 800 !important; box-shadow: inset 3px 0 0 var(--n4-accent) !important;
}
html[data-paper] body .sidebar .nav-item.active :is(svg, span),
html[data-paper] body .sidebar .nav-item.on :is(svg, span) {
  color: var(--n4-accent) !important; opacity: 1 !important; font-weight: 800 !important;
}
html[data-paper] body .sidebar .nav-item.active::after,
html[data-paper] body .sidebar .nav-item.on::after { display: none !important; }
html[data-paper] body .sidebar .nav-badge {
  margin-left: auto !important; background: var(--ui-danger-bg) !important;
  color: var(--ui-danger-ink) !important; border: 1px solid var(--ui-danger-line) !important;
  border-radius: 999px !important; padding: 0 5px !important; height: 15px !important;
  line-height: 14px !important; font-size: 10px !important; font-weight: 800 !important;
}
/* ⑥ 底部 */
html[data-paper] body .sidebar .side-foot {
  margin-top: auto !important; padding: 10px 2px 0 !important; gap: 8px !important;
  border-top: 1px solid var(--n4-line) !important; align-items: stretch !important;
}
html[data-paper] body .sidebar .side-foot .conn,
html[data-paper] body .sidebar .side-foot .conn span {
  color: var(--n4-ink2) !important; font-size: 11.5px !important;
  flex-direction: row !important; width: auto !important; max-width: none !important; text-align: left !important;
}
html[data-paper] body .sidebar .side-foot .btn-ghost {
  width: 100% !important; flex-direction: row !important; justify-content: center !important;
  padding: 8px 10px !important; gap: 7px !important; border-radius: 9px !important;
  font-size: 12px !important; font-weight: 700 !important; white-space: normal !important;
  background: transparent !important; border: 1px solid var(--n4-line) !important; color: var(--n4-ink2) !important;
}
html[data-paper] body .sidebar .side-foot .btn-ghost :is(span, svg) { color: inherit !important; }
html[data-paper] body .sidebar .side-foot .btn-ghost:hover {
  background: var(--n4-hover) !important; border-color: var(--n4-accent) !important; color: var(--n4-accent) !important;
}
html[data-paper] body .sidebar .nav-search { display: none !important; }


/* ===========================================================================
   39. 生产概览「全面重做」：把五张浮空 KPI 卡收成一条**态势带**（2026-10-09）
   ---------------------------------------------------------------------------
   用户："生产概览页面全面重做"。前一版的问题（我逐条认）：
     · 5 张同样大小的 KPI 卡各带边框/圆角/阴影，页头就是"五张卡 + 三块告警 + 四张图"，
       一屏 12 个方块、没有主次，看着像数据倾倒而不是驾驶舱；
     · 每张 KPI 卡内部 5 层（标签/大数/副标/迷你图/脚注），脚注还自带一条分隔线；
     · 图表卡里的"口径说明"胶囊跟图表抢视线。
   现在改成三段式（高度分布用 `_qctest/probe-ov.cjs` 实测过）：

     ┌ ① 态势带（1 个圆角容器，内部靠发丝线分 5 格，格内大数字 38px）──────────┐
     │   数据源/口径/周期/刷新 在上缘一行；今日实况 在下缘一行                 │
     ├ ② 待处理（3 张同规格卡：超期 / 停摆 / 交期风险）──────────────────────┤
     ├ ③ 视图页签 + 图表 2×2（吃掉剩余全部高度）────────────────────────────┤
     └──────────────────────────────────────────────────────────────────────┘

   只动"这一页"（`:has(.ov-hero.is-dash)` 精确限定），不碰其它 41 页。
   回退：删掉本节即可回到原来的"五张卡 + 三块告警"。
   =========================================================================== */
@supports selector(:has(*)) {
  /* ① 态势带容器：一个圆角面，不再是五张浮空卡 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-hero.is-dash,
  html[data-paper][data-theme="dark"] #view:has(.ov-hero.is-dash) .ov-hero.is-dash {
    padding: 0 !important; margin: 0 0 12px !important;
    background: var(--sk-card) !important;
    border: 1px solid var(--sk-line) !important; border-radius: 14px !important;
    box-shadow: 0 1px 2px rgba(20, 40, 70, .04) !important;
    overflow: hidden !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-hero-band { padding: 0 !important; background: transparent !important; }
  /* 上缘一行：数据源 / 口径 / 周期 / 刷新 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-hero-top {
    height: auto !important; padding: 10px 16px !important; margin: 0 !important;
    border-bottom: 1px solid var(--sk-line-2) !important; align-items: center !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-hs { gap: 8px !important; }
  html[data-paper] #view:has(.ov-hero.is-dash) :is(.ov-hs-k, .ov-live) {
    font-size: 11.5px !important; color: var(--sk-ink-3) !important; font-weight: 600 !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-delta {
    font-size: 12px !important; padding: 3px 9px !important; border-radius: 8px !important;
  }
  /* 中间：五格，靠发丝线分隔，格内无边框无阴影 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpis-dark {
    display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0 !important; padding: 0 !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d,
  html[data-paper][data-theme="dark"] #view:has(.ov-hero.is-dash) .ov-kpi-d {
    border: 0 !important; border-right: 1px solid var(--sk-line-2) !important;
    border-radius: 0 !important; background: transparent !important; box-shadow: none !important;
    padding: 14px 18px 12px !important; min-height: 0 !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d:last-child { border-right: 0 !important; }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-lb {
    font-size: 12px !important; font-weight: 700 !important; letter-spacing: .01em !important;
    color: var(--sk-ink-3) !important; margin-bottom: 4px !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-vl {
    font-size: 38px !important; line-height: 1.05 !important; letter-spacing: -.02em !important;
    font-weight: 800 !important; font-variant-numeric: tabular-nums !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-sb {
    font-size: 11.5px !important; margin-top: 4px !important; color: var(--sk-ink-3) !important; opacity: 1 !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-viz { height: 22px !important; margin: 8px 0 0 !important; }
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-viz svg { height: 22px !important; }
  /* 脚注（"目标 95% · 台账全量对照 76.6%"）：收进副标下面一行小字，不再自带分隔线 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d .k-cap {
    font-size: 10.5px !important; line-height: 1.35 !important;
    margin-top: 6px !important; padding-top: 0 !important; border-top: 0 !important; opacity: .72 !important;
  }
  /* 下缘一行：今日实况 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-today {
    height: auto !important; margin: 0 !important; padding: 9px 16px !important;
    border-top: 1px solid var(--sk-line-2) !important; background: var(--sk-soft) !important;
    font-size: 11.5px !important; opacity: 1 !important;
  }
  /* ② 待处理：三张卡
     ⚠ 不要给 `.ov-act-wrap` 写 display/grid-template-columns —— 它自己的排布规则在 theme.css 里，
       覆盖后三张卡会叠在一起（实测：后两张被页签条压住、只看得见第一张）。只给卡片上质感。 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov-act-c {
    padding: 10px 14px !important; border-radius: 12px !important;
    border: 1px solid var(--sk-line) !important;
    box-shadow: 0 1px 2px rgba(20, 40, 70, .04) !important;
  }
  /* ③ 图表：吃掉剩余高度 + 卡片统一 */
  html[data-paper] #view:has(.ov-hero.is-dash) .ov3-grid { gap: 12px !important; }
  html[data-paper] #view:has(.ov-hero.is-dash) :is(.ov3-card, .ov-tabs) {
    border-radius: 14px !important; border: 1px solid var(--sk-line) !important;
    box-shadow: 0 1px 2px rgba(20, 40, 70, .04) !important;
  }
  /* 口径说明：安静的小标，别再跟图抢视线 */
  html[data-paper] #view:has(.ov-hero.is-dash) .pl-note-btn {
    height: 18px !important; min-height: 18px !important; padding: 0 6px !important;
    font-size: 10.5px !important; border-color: transparent !important; background: transparent !important;
    color: var(--sk-ink-3) !important; opacity: .62 !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .pl-note-btn:hover {
    background: var(--sk-soft) !important; border-color: var(--sk-line) !important; opacity: 1 !important;
  }
  html[data-paper] #view:has(.ov-hero.is-dash) .pl-note {
    display: inline-flex !important; align-items: center !important;
    margin: 0 8px 0 0 !important; vertical-align: middle !important;
  }
}


/* ===========================================================================
   40. 定稿二：左栏「深蓝两栏 + 细节」+ 全局去白（2026-10-09 · 用户："改动太小还不够，
       左栏还需要细节优化，配色也不要白色"）
   ---------------------------------------------------------------------------
   ① 左栏：白底 → **品牌深蓝**（和 bioligo.com 官网顶栏同族），两栏读成一整块深色面；
      细节补齐：图标砖 32×32 + 10px 标签、选中=高光蓝砖+白图标+左缘亮蓝条、
      面板头吸顶 + 项数胶囊、条目行 34px + 悬停/选中三层反馈、徽章深色版。
   ② 内容：白 → **蓝灰**（页底 #E9F0F8 / 卡面 #F5F9FE / 发丝线 #D8E4F2），
      全站卡片、面板头、页签、表格底一起跟着走（改的是 `--sk-*` 与 `--ui-*` 令牌）。
   回退：删本节 ⇒ 回到 §38 的白底两栏 + 白卡。
   =========================================================================== */
html[data-paper] {
  /* ① 左栏深蓝 */
  --n5-rail-bg: linear-gradient(180deg, #0C3E72 0%, #0A3562 100%);
  --n5-panel-bg: #0E4176;
  --n5-line: rgba(255, 255, 255, .10);
  --n5-txt: rgba(255, 255, 255, .78);
  --n5-txt-2: rgba(255, 255, 255, .60);
  --n5-txt-hi: #FFFFFF;
  --n5-btn: rgba(255, 255, 255, .10);
  --n5-btn-hover: rgba(255, 255, 255, .18);
  --n5-active-bg: rgba(58, 150, 232, .34);
  --n5-active-bar: #7CC0F8;
  /* ② 内容蓝灰（去白） */
  --sk-page: #E9F0F8;
  --sk-page-2: #DFE8F4;
  --sk-card: #F5F9FE;
  --sk-soft: #EDF4FC;
  --sk-line: #D8E4F2;
  --sk-line-2: #E6EEF9;
  --ui-bg-page: #E9F0F8;
  --ui-bg-card: #F5F9FE;
  --ui-bg-soft: #EDF4FC;
  --ui-line-200: #D8E4F2;
  --ui-line-100: #E6EEF9;
  --ui-brand-050: #EFF5FD;
  --ui-brand-100: #E2EDFB;
}
html[data-paper][data-theme="dark"] {
  --n5-rail-bg: linear-gradient(180deg, #10243C 0%, #0C1D31 100%);
  --n5-panel-bg: #12273F;
  --n5-line: rgba(255, 255, 255, .08);
  --ui-bg-card: #1B222B;
  --ui-bg-soft: #202836;
  --ui-bg-page: #171D24;
  --ui-line-200: #2B3542;
  --ui-line-100: #232C37;
}

/* ── 左栏：外壳 / 品牌 ──────────────────────────────────────────────────
   ⚠⚠ 全部写成 `html[data-paper]:not([data-theme="dark"]) body .sidebar …`（0,3,2 / 0,5,2）。
   实测教训：skin.css 的 E 皮肤规则是 `html[data-skin="E"]:not([data-theme="dark"]) .sidebar …`
   = (0,3,1) / (0,5,1)，**类数比我原来的 `html[data-paper] body …`（0,2,2 / 0,4,2）多**，
   所以那一层白底/深字一直赢 —— 侧栏看着就是"白底 + 深字"，我写的深蓝根本没生效（探针实测
   `.sidebar` computed = rgb(255,255,255)）。加一个 `:not([data-theme="dark"])` + `body` 才压得住。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar,
html[data-paper][data-theme="dark"] body .sidebar {
  background: var(--n5-rail-bg) !important;
  border-right: 1px solid rgba(255, 255, 255, .06) !important;
  box-shadow: 12px 0 30px -24px rgba(6, 24, 45, .9) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand,
html[data-paper][data-theme="dark"] body .sidebar .brand {
  border-bottom: 1px solid var(--n5-line) !important;
  padding: 2px 4px 12px !important;
  color: #FFFFFF !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand .logo,
html[data-paper][data-theme="dark"] body .sidebar .brand .logo {
  background: rgba(255, 255, 255, .16) !important;
  border: 1px solid rgba(255, 255, 255, .32) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 8px 16px -12px rgba(0, 0, 0, .8) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand h1,
html[data-paper][data-theme="dark"] body .sidebar .brand h1 { color: #FFFFFF !important; }

/* ── 左栏：两栏容器（深色一整块，中间发丝线） ───────────────────────── */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-body,
html[data-paper][data-theme="dark"] body .sidebar .nav-body {
  border: 0 !important; border-radius: 0 !important;
  background: transparent !important; overflow: visible !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail {
  background: transparent !important;
  border-right: 1px solid var(--n5-line) !important;
  padding: 6px 0 !important; gap: 3px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel,
html[data-paper][data-theme="dark"] body .sidebar .nav-panel {
  background: var(--n5-panel-bg) !important;
  padding: 10px 8px 12px !important;
}
/* 面板头吸顶 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h,
html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h {
  position: sticky !important; top: 0 !important; z-index: 2 !important;
  background: var(--n5-panel-bg) !important;
  border-bottom: 1px solid var(--n5-line) !important;
  color: var(--n5-txt-hi) !important;
  padding: 2px 6px 9px !important; margin: 0 0 6px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h > span,
html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h > span { color: var(--n5-txt-hi) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h > i,
html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h > i {
  background: rgba(255, 255, 255, .14) !important; color: rgba(255, 255, 255, .82) !important;
}

/* ── 左栏：轨上类目（32 图标砖 + 10px 标签 + 三层状态） ─────────────── */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn {
  width: 54px !important; height: 56px !important; min-height: 56px !important;
  padding: 6px 2px !important; gap: 4px !important;
  color: var(--n5-txt) !important;
  border-radius: 12px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > svg {
  width: 16px !important; height: 16px !important; padding: 8px !important;
  border-radius: 10px !important;
  background: var(--n5-btn) !important;
  border: 1px solid rgba(255, 255, 255, .07) !important;
  color: inherit !important;
  transition: background .14s ease, color .14s ease, transform .14s ease !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > span,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > span { font-size: 10px !important; font-weight: 700 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:hover { background: rgba(255, 255, 255, .06) !important; color: #FFFFFF !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover > svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:hover > svg { background: var(--n5-btn-hover) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on:hover,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on {
  background: var(--n5-active-bg) !important; color: var(--n5-txt-hi) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on > svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on > svg {
  background: linear-gradient(160deg, #4AA5EE 0%, #1A7BD9 100%) !important;
  border-color: rgba(255, 255, 255, .28) !important;
  color: #FFFFFF !important;
  box-shadow: 0 8px 16px -10px rgba(0, 0, 0, .75) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on > span,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on > span { color: #FFFFFF !important; font-weight: 800 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on::before,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on::before {
  left: -2px !important; top: 14px !important; bottom: 14px !important;
  background: var(--n5-active-bar) !important; box-shadow: 0 0 8px rgba(124, 192, 248, .8) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:first-child::after,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:first-child::after { background: var(--n5-line) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn .nr-dot,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn .nr-dot { box-shadow: 0 0 0 2px #0B3A6A !important; }

/* ── 左栏：面板条目（深色三层状态） ───────────────────────────────────
   ⚠⚠ 血案：这里的选择器**必须**写成 `html[data-paper]:not([data-theme="dark"]) body .sidebar …`
      ——皮肤 §24/§38 里那几条是 (0,6,2)，只写 `html[data-paper] body .sidebar …` 是 (0,4,2)，
     压不住它们 ⇒ 选中项会拿到旧规则的**浅蓝底 #E8F1FB**，再配上我给的白色字 = **白底白字**（实测踩过，
     用户在截图里看到的"看不见的选中项"就是它）。本节所有"深色底上的字/底"一律按 (0,6,2)/(0,7,2) 写。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item,
html[data-paper][data-theme="dark"] body .sidebar .nav-item {
  min-height: 34px !important;
  padding: 8px 10px !important; gap: 9px !important;
  color: var(--n5-txt) !important; background: transparent !important;
  border-radius: 9px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-item svg {
  color: rgba(255, 255, 255, .58) !important; opacity: 1 !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item:hover,
html[data-paper][data-theme="dark"] body .sidebar .nav-item:hover {
  background: rgba(255, 255, 255, .07) !important; color: #FFFFFF !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item:hover svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-item:hover svg { color: #FFFFFF !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.active,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.on,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.active,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.on {
  background: var(--n5-active-bg) !important; color: #FFFFFF !important;
  font-weight: 800 !important;
  box-shadow: inset 3px 0 0 var(--n5-active-bar) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.active :is(svg, span),
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.on :is(svg, span),
html[data-paper][data-theme="dark"] body .sidebar .nav-item.active :is(svg, span),
html[data-paper][data-theme="dark"] body .sidebar .nav-item.on :is(svg, span) {
  color: #FFFFFF !important; opacity: 1 !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.active::after,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.on::after,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.active::after,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.on::after { display: none !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-badge,
html[data-paper][data-theme="dark"] body .sidebar .nav-badge {
  background: rgba(226, 74, 74, .92) !important; color: #FFFFFF !important;
  border: 0 !important;
}

/* ── 左栏：底部（连接状态 + 登录） ─────────────────────────────────── */
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot,
html[data-paper][data-theme="dark"] body .sidebar .side-foot { border-top: 1px solid var(--n5-line) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .conn,
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .conn span,
html[data-paper][data-theme="dark"] body .sidebar .side-foot .conn,
html[data-paper][data-theme="dark"] body .sidebar .side-foot .conn span { color: var(--n5-txt-2) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .btn-ghost,
html[data-paper][data-theme="dark"] body .sidebar .side-foot .btn-ghost {
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  color: rgba(255, 255, 255, .88) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .btn-ghost:hover,
html[data-paper][data-theme="dark"] body .sidebar .side-foot .btn-ghost:hover {
  background: rgba(255, 255, 255, .16) !important;
  border-color: rgba(255, 255, 255, .3) !important; color: #FFFFFF !important;
}

/* ── 内容去白：底纹 / 顶栏 / 页签条 ────────────────────────────────── */
html[data-paper]:not([data-theme="dark"]) body {
  background-image:
    radial-gradient(1100px 600px at 4% -10%, rgba(26, 123, 217, .10), transparent 62%),
    radial-gradient(900px 500px at 102% -6%, rgba(86, 167, 162, .07), transparent 60%),
    linear-gradient(180deg, #EEF4FB 0%, #E4ECF6 100%) !important;
}
html[data-paper] body .topbar,
html[data-paper] body .app-tabs {
  background: rgba(245, 249, 254, .92) !important;
  border-bottom-color: var(--sk-line) !important;
}


/* ===========================================================================
   41. 全站 KPI 卡统一（2026-10-09 · 用户："所有页面的KPI卡片风格是否统一"）
   ---------------------------------------------------------------------------
   `_qctest/audit-all.cjs` 逐页实测（42 页）出来的**9 种互不相同的 KPI 卡**：

     家族              页数 高     圆角  值字号   卡选择器                值/标签/副标
     ov-kpi-d           8  156~160  0    38     div.ov-kpi-d           .k-vl / .k-lb / .k-sb
     ui-kpi             4   88     14    28     div.ui-kpi             b / span / —
     sp-kpi-card        1  140      6    40     div.sp-kpi-card        .sp-kpi-val / -label / -sub
     dv-kpi-item        1   96     16    24     div.dv-kpi-item        .val / .lbl / —
     pd-card            1  163     16    24     div.pd-card            .val / .lbl / —
     q-kpi              1  116     16    40     div.q-kpi              .q-kpi-val / -label / -sub
     am-kpi-card        1  124     12    40     div.am-kpi-card        .am-kpi-val / -label / -sub
     rp-kpi-item        1   80     16    24     div.rp-kpi-item        .val / .lbl / —
     hv-kpi / pd3       4   52      0    26     div.hv-kpi             b / span / —

   本节把"看得见的语言"统一成一套：**圆角 12 · 1px 发丝线 · 卡面 var(--sk-card) ·
   极轻投影 · 内边距 14/16 · 值 30px/800 · 标签 12px · 副标 11.5px**；
   高度不写死（内容多少不同，写死会溢出），只统一零件。
   ⚠ 例外：生产概览的「态势带」里的 `.ov-kpi-d` 保持带状（无边框、38px 大字），
     由 `#view:not(:has(.ov-hero.is-dash))` 排除掉。
   =========================================================================== */
html[data-paper] {
  --kpi-r: 12px;
  --kpi-line: 1px solid var(--sk-line);
  --kpi-bg: var(--sk-card);
  --kpi-sh: 0 1px 2px rgba(20, 40, 70, .05);
  /* ★ §24 里有一批 `border-radius: var(--p2-r-card) !important` 的卡片规则（其中就可能包含
     `.ov-kpi-d`），它们比我 §41 的普通声明更强 ⇒ **改这个变量比再堆选择器有效**。 */
  --p2-r-card: 12px;
}
/* ① 卡片语言 */
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item),
html[data-paper] #view .ov-kpi-d.ov-kpi-d {
  border-radius: var(--kpi-r) !important;
  border: var(--kpi-line) !important;
  background: var(--kpi-bg) !important;
  box-shadow: var(--kpi-sh) !important;
  padding: 14px 16px !important;
}
/* ⚠ 上一条会连"生产概览的态势带"一起命中 ⇒ 这里用**多一个类 + :has()** 把态势带盖回来（(1,5,1) > (1,4,1)）。
   实测核对：改前在制订单的 `.ov-kpi-d` 是 r=0/bg 透明（8 个页面的 KPI 各长各的），
   改后（探针 `probe-kpi-nodes.cjs`）应为 r=12/bg #F5F9FE。 */
html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d.ov-kpi-d {
  border: 0 !important;
  border-right: 1px solid var(--sk-line-2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 14px 18px 12px !important;
}
html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d.ov-kpi-d:last-child { border-right: 0 !important; }
/* 紧凑条（工序页 52px 那一条）只统一圆角与分隔，不再套一层边卡 */
html[data-paper] #view :is(.hv-kpi, .pt-kpis, .pd3-kpi-inner) {
  border-radius: 10px !important;
  box-shadow: none !important;
}
/* ② 值：**跟着屏宽走一档**（2026-10-10）——
   这些 KPI 卡在 1920 屏上是 520~550px 宽，里面只有一行 30px 的数字 ⇒ 卡片看着"宽而空"，
   这正是用户说的"整个程序的页面显示比例"问题（全站扫描：订单中心 / 班次总览 / 重合登记 /
   报表分析 / 设备管理 / 现场变更 / 留样出库 / 交接待办 / 综合查询 / 线边物料 都是同一形态）。
   现在数字用 clamp(30px, 2.1vw, 44px)：1366 及以下仍是 30px（窄卡不变），1920 上约 40px、
   2K 上到顶 44px —— 卡片有多大，字就有多大，不再是一片空白配一行小字。
   ⚠ 只放大"数字"，标签/副标不动，所以不会挤爆卡片。 */
html[data-paper] #view :is(.ui-kpi b, .sp-kpi-card .sp-kpi-val, .dv-kpi-item .val, .pd-card .val,
  .q-kpi .q-kpi-val, .am-kpi-card .am-kpi-val, .rp-kpi-item .val, .hv-kpi b, .pd3-kpi-inner b,
  .rm-stat .v),
html[data-paper] #view .ov-kpi-d.ov-kpi-d .k-vl {
  font-size: clamp(30px, 2.1vw, 44px) !important;
  font-weight: 800 !important;
  line-height: 1.12 !important;
  letter-spacing: -.015em !important;
  font-variant-numeric: tabular-nums !important;
}

/* 2026-10-12：工序页使用轻量任务读数条；覆盖纸面主题的通用 KPI 卡片放大/描边。 */
html[data-paper] #view .pd3-wrap.pd3-wb .pd3-kpirow .hv-kpi,
html[data-paper] #view .pd3-wrap.pd3-wb .pd3-kpirow .hv-kpi.is-static {
  width:auto !important; min-width:112px !important; height:34px !important;
  padding:0 16px !important; border:0 !important;
  border-right:1px solid var(--line) !important; border-radius:0 !important;
  background:transparent !important; box-shadow:none !important;
}
html[data-paper] #view .pd3-wrap.pd3-wb .pd3-kpirow .hv-kpi b {
  font-size:20px !important; font-weight:700 !important; line-height:1.2 !important;
}

/* 2026-10-12：订单详情重做为任务工作区。首屏看结论与执行清单，矩阵退到二级页签。 */
html[data-paper] #modalBody.od-page { padding:18px 20px 20px !important; }
html[data-paper] #modalBody.od-page .od-back { position:static !important; float:left; margin:0 8px 10px 0; }
html[data-paper] #modalBody.od-page .od-print { float:right; margin-right:0; }
html[data-paper] #modalBody.od-page .od-head { clear:both; display:grid; grid-template-columns:minmax(260px,.8fr) minmax(760px,2.2fr); gap:20px; align-items:center; padding:14px 0 16px; border-bottom:1px solid var(--line); }
html[data-paper] #modalBody.od-page .od-title h3 { margin:0 0 6px; font-size:20px; }
html[data-paper] #modalBody.od-page .od-kpis { display:grid; grid-template-columns:1.05fr 1.2fr .75fr .8fr 1.2fr; gap:0; border:0; }
html[data-paper] #modalBody.od-page .odkpi { min-height:64px; padding:7px 14px; border:0 !important; border-left:1px solid var(--line) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
html[data-paper] #modalBody.od-page .odkpi .v { font-size:20px !important; }
html[data-paper] #modalBody.od-page #odTabs { margin:0; padding:8px 0 0; border-bottom:1px solid var(--line); background:transparent; }
html[data-paper] #modalBody.od-page #odTabs .tab { padding:9px 14px; border-radius:0; border-bottom:2px solid transparent; }
html[data-paper] #modalBody.od-page #odTabs .tab.active { background:transparent; color:var(--ui-brand-700); border-bottom-color:var(--ui-brand-600); }
.od-workboard { display:grid; grid-template-columns:250px minmax(0,1fr); min-height:0; height:calc(100vh - 330px); border:1px solid var(--line); border-top:0; background:var(--panel-solid); }
.odw-side { padding:16px; border-right:1px solid var(--line); background:var(--panel-2); overflow:auto; }
.odw-next { padding:13px 14px; border-left:3px solid var(--ui-brand-600); background:var(--panel-solid); }
.odw-next i { display:block; margin-bottom:5px; color:var(--txt-3); font-size:11px; font-style:normal; }
.odw-next b { font-size:13px; line-height:1.55; }
.odw-side-sec { margin-top:20px; }
.odw-side-sec h4 { margin:0 0 9px; color:var(--txt-3); font-size:11px; letter-spacing:.08em; }
.odw-side-sec p { margin:6px 0; color:var(--txt-2); font-size:12px; }
.odw-stagechips { display:flex; flex-direction:column; gap:6px; }
.odw-stagechips span { display:flex; justify-content:space-between; padding:7px 9px; background:var(--panel-solid); border-bottom:1px solid var(--line); color:var(--txt-2); font-size:12px; }
.odw-stagechips b { font-weight:600; }
.odw-main { min-width:0; overflow:auto; }
.odw-mainhead { position:sticky; top:0; z-index:4; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:11px 14px; border-bottom:1px solid var(--line); background:var(--panel-solid); }
.odw-mainhead > div { display:flex; align-items:baseline; gap:10px; }
.odw-mainhead span { color:var(--txt-3); font-size:11px; }
.odw-search { color:var(--txt-3); font-size:11px; }
.odw-search input { width:210px; height:30px; margin-left:6px; padding:0 10px; border:1px solid var(--line); border-radius:7px; background:var(--panel-solid); }
.odw-plate { margin:0; border-bottom:1px solid var(--line); }
.odw-plate > header { position:sticky; top:53px; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 14px; background:var(--panel-2); border-bottom:1px solid var(--line); }
.odw-plate > header div { display:flex; align-items:center; gap:10px; }
.odw-plate > header span,.odw-plate > header em { color:var(--txt-3); font-size:11px; font-style:normal; }
.odw-row { border-bottom:1px solid var(--line); }
.odw-row:last-child { border-bottom:0; }
.odw-row summary { display:grid; grid-template-columns:190px 100px minmax(210px,1fr) minmax(170px,.8fr) 46px; align-items:center; gap:12px; min-height:45px; padding:6px 14px; cursor:pointer; list-style:none; }
.odw-row summary::-webkit-details-marker { display:none; }
.odw-row summary:hover { background:var(--ui-brand-050); }
.odw-row .id b,.odw-row .id small { display:block; }
.odw-row .id b { font-family:var(--mono,Consolas,monospace); font-size:12px; }
.odw-row .id small { margin-top:2px; color:var(--txt-3); font-size:10px; }
.odw-row .stage { color:var(--ui-brand-700); font-weight:700; font-size:12px; }
.odw-row .route { display:flex; align-items:center; gap:9px; }
.odw-row .route > span { display:grid; grid-template-columns:repeat(8,1fr); gap:3px; flex:1; }
.odw-row .route i { height:5px; border-radius:2px; background:var(--ui-line-200); }
.odw-row .route i.done { background:var(--ui-ok-solid); }
.odw-row .route i.cur { background:var(--ui-brand-600); box-shadow:0 0 0 1px var(--ui-brand-600); }
.odw-row .route i.skip { background:repeating-linear-gradient(135deg,var(--ui-line-200) 0 2px,transparent 2px 4px); }
.odw-row .route b { min-width:28px; color:var(--txt-3); font-size:10px; }
.odw-row .spec { overflow:hidden; color:var(--txt-2); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.odw-row .go { color:var(--ui-brand-700); font-size:11px; }
.odw-row[open] .go { font-size:0; }
.odw-row[open] .go::after { content:'收起'; font-size:11px; }
.odw-detail { display:grid; grid-template-columns:minmax(260px,2fr) repeat(4,minmax(110px,.7fr)); gap:10px; padding:10px 14px 12px 216px; background:var(--panel-2); }
.odw-detail span { overflow:hidden; color:var(--txt-2); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.odw-detail i { margin-right:6px; color:var(--txt-3); font-style:normal; }
@media(max-width:1250px){ .od-workboard{grid-template-columns:210px minmax(0,1fr)} .odw-row summary{grid-template-columns:150px 90px minmax(180px,1fr) 130px 40px}.odw-detail{padding-left:14px;grid-template-columns:1fr 1fr} }
/* ③ 标签：12px / 700 / 次级灰 */
html[data-paper] #view :is(.ui-kpi span, .sp-kpi-card .sp-kpi-label, .dv-kpi-item .lbl, .pd-card .lbl,
  .q-kpi .q-kpi-label, .am-kpi-card .am-kpi-label, .rp-kpi-item .lbl, .hv-kpi span, .pd3-kpi-inner span),
html[data-paper] #view .ov-kpi-d.ov-kpi-d .k-lb {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  color: var(--sk-ink-3) !important;
}
/* ④ 副标 / 说明：11.5px */
html[data-paper] #view :is(.sp-kpi-card .sp-kpi-sub, .q-kpi .q-kpi-sub, .am-kpi-card .am-kpi-sub, .dv-kpi .lbl),
html[data-paper] #view .ov-kpi-d.ov-kpi-d .k-sb {
  font-size: 11.5px !important;
  color: var(--sk-ink-3) !important;
}
/* ⑤ 卡片之间的最小留白一致（各页 grid gap 原来是 8/10/12/14 混用） */
html[data-paper] #view :is(.oc-kpi-grid, .sp-kpi-grid, .dv-kpi, .q-kpis, .am-kpi-grid, .rp-kpi, .ov-kpis-dark) {
  gap: 12px !important;
}


/* ---------------------------------------------------------------------------
   41.1 ⚠⚠ 上面 §39/§41 的 `#view:has(.ov-hero.is-dash) .ov-kpi-d` **在其它 7 个页也命中**：
   那些页面里同样留着一个 `.ov-hero.is-dash` 节点（隐藏的），`:has()` 只要"存在"就成立，
   于是把 在制订单/交期预警/交期分布/交付周期达成/按时交付率/订单构成 的 KPI 卡
   全按"态势带格子"（圆角 0、底透明、38px 大字）染了一遍 —— 这就是"8 页 KPI 跟别处不一样"的真因
   （用 CDP `CSS.getMatchedStylesForNode` 实测到的胜出规则，见 `_qctest/probe-matched.cjs`）。

   修法：把**非态势带**的 `.ov-kpi-d` 用祖先选择器 + `:not(后代)` 单独拎出来，(1,6,1) 稳压 (1,5,1)；
   真正在 `.ov-hero.is-dash` 里的那 5 张（生产概览）被 `:not()` 排除，保持带状。
   --------------------------------------------------------------------------- */
/* 判别器实测（`_qctest/probe-matched.cjs`）：
     在制订单  inHero=true heroVisible=true bpHome=0
     生产概览  inHero=true                bpHome=1
   ⇒ `.ov-hero.is-dash` 是 8 页**共用**的 KPI 横幅组件，唯一能区分"生产概览"的是它下面的 `.bp-home`。
   选择器用「三写类名」把特异性抬到 (1,5,1) 与 §39/§41 的态势带规则持平，靠"写在更后面"胜出；
   而生产概览上 `:not(:has(.bp-home))` 不成立 ⇒ 那条根本不参与，态势带不受影响。 */
html[data-paper] #view:not(:has(.bp-home)) .ov-kpi-d.ov-kpi-d.ov-kpi-d {
  border-radius: var(--kpi-r) !important;
  border: var(--kpi-line) !important;
  background: var(--kpi-bg) !important;
  box-shadow: var(--kpi-sh) !important;
  padding: 14px 16px !important;
}
html[data-paper] #view:not(:has(.bp-home)) .ov-kpi-d.ov-kpi-d.ov-kpi-d .k-vl {
  font-size: 30px !important; font-weight: 800 !important;
  line-height: 1.12 !important; letter-spacing: -.015em !important;
  font-variant-numeric: tabular-nums !important;
}
html[data-paper] #view:not(:has(.bp-home)) .ov-kpi-d.ov-kpi-d.ov-kpi-d .k-lb {
  font-size: 12px !important; font-weight: 700 !important; color: var(--sk-ink-3) !important;
}
html[data-paper] #view:not(:has(.bp-home)) .ov-kpi-d.ov-kpi-d.ov-kpi-d .k-sb {
  font-size: 11.5px !important; color: var(--sk-ink-3) !important;
}


/* ===========================================================================
   43. 「到期日标尺 / 交期标尺」：从"一排空框"改成"紧凑柱状图"（2026-10-09 续）
   ---------------------------------------------------------------------------
   实测（`_qctest/out/audit3/shot-14-交期分布.png`）：`.dg-due .dg-ruler23` 高 **180px**，
   每格轨道 `.dg-rl-t{flex:1}` 把剩余 ~130px 全部撑开，而柱子 `.dg-rl-t i` 是按百分比高度的
   —— 结果 23 个格子里绝大多数是"空框 + 0"，看起来就是一大块没用的空白（用户："一块竖向空白"）。
   改法：① 标尺总高压到 118px、轨道固定 64px；② 轨道给淡底、柱子给**实色**
   （过期/今天=朱红、窗口内=琥珀、其余=品牌蓝）；③ 0 值的格子不画框，只留一条基线，
   23 列排开就是一条干净的柱状带。`.dg-ruler`（14 列那版·交期预警）同样受益。
   回退：删本节。
   =========================================================================== */
html[data-paper] #view .dg-due .dg-ruler23 { min-height: 118px !important; }
html[data-paper] #view .dg-ruler { min-height: 118px !important; }
html[data-paper] #view .dg-ruler .dg-rl { gap: 3px !important; justify-content: flex-end !important; }
html[data-paper] #view .dg-ruler .dg-rl-t {
  flex: 0 0 64px !important; min-height: 64px !important; height: 64px !important;
  background: var(--sk-soft) !important;
  border: 0 !important; border-radius: 6px !important;
}
html[data-paper] #view .dg-ruler .dg-rl.is-zero .dg-rl-t {
  background: transparent !important;
  box-shadow: inset 0 -1px 0 var(--sk-line-2) !important;
}
/* 柱子：把 position/inset 也显式写死（怀疑被后加载的规则改回 static ⇒ height:% 失效 ⇒ 柱子看不见）。
   实测：改前 23 个格子只有"框 + 数字"，柱子一根都不出来；这里把定位、颜色、最小高度一次钉死。 */
html[data-paper] #view .dg-ruler .dg-rl-t > i {
  position: absolute !important;
  left: 0 !important; right: 0 !important; bottom: 0 !important;
  min-height: 4px !important;
  border-radius: 4px !important;
  background-color: var(--sk-accent) !important;
  background-image: none !important;
  opacity: 1 !important;
}
html[data-paper] #view .dg-ruler .dg-rl.in-win .dg-rl-t > i { background-color: var(--ui-warn-solid) !important; }
html[data-paper] #view .dg-ruler .dg-rl.is-late .dg-rl-t > i,
html[data-paper] #view .dg-ruler .dg-rl.is-today .dg-rl-t > i { background-color: var(--ui-danger-solid) !important; }
html[data-paper] #view .dg-ruler .dg-rl.is-late .dg-rl-t,
html[data-paper] #view .dg-ruler .dg-rl.is-today .dg-rl-t { background: rgba(220, 58, 76, .10) !important; }
html[data-paper] #view .dg-ruler .dg-rl.in-win .dg-rl-t { background: rgba(201, 118, 26, .10) !important; }
/* 0 值的格子：不要那根 4px 小柱（否则 20 个"没有到期订单"的日子看起来都像有货） */
html[data-paper] #view .dg-ruler .dg-rl.is-zero .dg-rl-t > i { display: none !important; }


/* ===========================================================================
   44. 自绘排行条的"刻度参考" + 表格负数标红（2026-10-09 续）
   ---------------------------------------------------------------------------
   ① 周维度排行 / 客户维度堆叠这两条自绘横条，原来只有一根光溜溜的柱子 + 读数，
      没有刻度参照，跟旁边 ECharts 那几张图（有网格线、有均值线）不是一套语言。
      这里给轨道补 **25% / 50% / 75% 三道刻度线**（纯 CSS 渐变，不改 DOM、不用算均值）。
   ② 表格里"负数数值格"标红，由 `table-polish.js` 打 `tbl-neg` class，颜色在这里定义。
      适用范围：产能计划「差额」列、交期类表的「结余/缺口」列等（负值在本业务里一律表示"缺"）。
   回退：删本节（class 还在也不影响功能）。
   =========================================================================== */
html[data-paper] #view :is(.dg-wk-b, .dg-cst-b, .dg-cst-bar, .dg-rl-t) {
  background-color: var(--sk-soft) !important;
  background-image: repeating-linear-gradient(90deg,
    transparent 0, transparent calc(25% - 1px),
    var(--sk-line-2) calc(25% - 1px), var(--sk-line-2) 25%) !important;
  border-radius: 6px !important;
}
html[data-paper] #view .dg-wk-r.is-zero :is(.dg-wk-b) { background-image: none !important; }
html[data-paper] #view td.tbl-neg,
html[data-paper] #view th.tbl-neg {
  color: var(--ui-danger-ink) !important;
  font-weight: 800 !important;
}
/* 非表格的数值块（叶节点）同样标红：字体大、字重加一档，别在页头缩成小字 */
html[data-paper] #view .tbl-neg:not(td):not(th) {
  color: var(--ui-danger-ink) !important;
  font-weight: 800 !important;
}
/* 自绘横条的均值参考线（JS 把均值百分比写到 --dg-mean 上） */
html[data-paper] #view :is(.dg-wk-b, .dg-cst-b, .dg-cst-bar) { position: relative !important; }
html[data-paper] #view :is(.dg-wk-b, .dg-cst-b, .dg-cst-bar).has-mean::after {
  content: "" !important; position: absolute !important;
  top: -2px !important; bottom: -2px !important;
  left: var(--dg-mean, 50%) !important;
  border-left: 1px dashed var(--sk-ink-3) !important;
  opacity: .6 !important; pointer-events: none !important;
}

/* ---------------------------------------------------------------------------
   45. KPI 卡「两档高度」统一（2026-10-09 续）
   ---------------------------------------------------------------------------
   巡检（audit4）里同一批卡还有第二个不统一：**同样叫 KPI，有的卡里带迷你图/环/进度条
   （发货出库的环、工序页的条、态势带的碳足迹线），有的是纯数字**，结果高度 88/96/124/140 各不同。
   这里按"**卡里有没有可视化零件**"分成两档，并把高度对齐：
     · 有图档（`.k-viz/.k-bar/svg/canvas`）→ 132px
     · 纯数字档 → 92px
   （仍然不写死到"所有卡一样高"：内容复杂度真的不同，硬拉平会出现大片空白。）
   --------------------------------------------------------------------------- */
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item, .ov-kpi-d):has(svg, canvas, .k-viz, .k-bar, .ring, .sp-kpi-ring) {
  min-height: 132px !important;
}
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item, .ov-kpi-d):not(:has(svg, canvas, .k-viz, .k-bar, .ring, .sp-kpi-ring)) {
  min-height: 92px !important;
}


/* ---------------------------------------------------------------------------
   46. KPI 卡「四档」细分（2026-10-09 续 · §45 的两档再拆细）
   ---------------------------------------------------------------------------
   §45 只分了"有图 / 纯数字"两档，粒度不够：带环的卡（发货出库的完成率环、按时交付率的仪表）
   和只带一条进度条的卡，需要的呼吸空间差一倍。这里按**卡内的可视化零件**分四档：

     ① 带环（`.ring/.sp-kpi-ring` 或 svg 里的 dasharray 圆）  → 140px
     ② 带迷你图/仪表（`.k-viz` / canvas / 任意 svg）           → 132px
     ③ 只带进度条（`.k-bar` / 类名含 -bar）                    → 116px
     ④ 纯数字                                                  → 92px

   选择器按"从最具体到最一般"叠加 `:not()` 排除，保证每张卡只落进一档（同权重时后者胜，
   再加上 `:has/:not` 的类数递增，实际优先级天然成立）。仍然不硬拉平成一个高度。
   --------------------------------------------------------------------------- */
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item, .ov-kpi-d):has(.ring, .sp-kpi-ring) {
  min-height: 140px !important;
}
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item, .ov-kpi-d):not(:has(.ring, .sp-kpi-ring)):has(.k-viz, canvas, svg) {
  min-height: 132px !important;
}
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item, .ov-kpi-d):not(:has(.ring, .sp-kpi-ring)):not(:has(.k-viz, canvas, svg)):has(.k-bar, [class*="-bar"]) {
  min-height: 116px !important;
}
html[data-paper] #view :is(.ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item, .ov-kpi-d):not(:has(.ring, .sp-kpi-ring)):not(:has(.k-viz, canvas, svg)):not(:has(.k-bar, [class*="-bar"])) {
  min-height: 92px !important;
}


/* ---------------------------------------------------------------------------
   47. KPI 卡「图标砖」统一 + 态势带大字并入同尺度（2026-10-09 续 · 审美层）
   ---------------------------------------------------------------------------
   ① 图标砖：9 个 KPI 家族各带各的图标容器（`.ov-kpi-ico / .dv-… / .sp-… / .q-… / .am-…` 等），
      尺寸/圆角/底色全不一样。这里用**通配属性选择器**一次收口成同一块砖：
      **26×26 · 圆角 8 · 淡底 `--sk-soft` · 1px 发丝线 · 内嵌 15px 图标**。
      只改外形，不动图标本身（各页 svg 自带）。
   ② 态势带大字：生产概览的 KPI 值是 38px，其它 7 页同族卡片是 30px —— 同一套系统里两个尺度。
      这里把态势带也收到 **30px**，全站 KPI 数值一个尺度（态势带仍靠"无边框 + 一整个圆角容器 + 今日实况条"
      与普通卡区分，不再靠字号）。
   --------------------------------------------------------------------------- */
html[data-paper] #view [class*="kpi-ico"],
html[data-paper] #view [class*="kpi-icon"],
html[data-paper] #view :is(.ov-kpi-ico, .k-ico, .am-kpi-ico, .q-kpi-ico) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  box-sizing: border-box !important;
  width: 26px !important; height: 26px !important; min-width: 26px !important;
  border-radius: 8px !important;
  background: var(--sk-soft) !important;
  border: 1px solid var(--sk-line) !important;
  color: var(--sk-accent) !important;
  flex: none !important;
}
html[data-paper] #view [class*="kpi-ico"] svg,
html[data-paper] #view [class*="kpi-icon"] svg,
html[data-paper] #view :is(.ov-kpi-ico, .k-ico, .am-kpi-ico, .q-kpi-ico) svg {
  width: 15px !important; height: 15px !important;
}
/* 态势带大字 38 → 30（与全站同尺度；(1,6,1) 压过 §39 的 38px） */
html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d.ov-kpi-d .k-vl {
  font-size: 30px !important;
  line-height: 1.12 !important;
}


/* ---------------------------------------------------------------------------
   48. 生产概览「图表被压扁」修复（2026-10-09 续 · 用户："图表必须下拉滚动条才能看全，肯定不行"）
   ---------------------------------------------------------------------------
   真因（`_qctest/fit-probe.cjs`，1920×900 真实可用高度实测）：
     `#view` 自身 clientH=841 / scrollH=841（不滚），但 **4 个图表卡体 `.ov3-b` 只有 32~39px 高、
      内容需要 170~395px** ⇒ 图表在自己的卡里被切掉 + 出现内部滚动条。
   为什么会这样：整页是 `.view-fade` 的 flex 列，图区 `.ov3-grid` 吃剩余高度，顶上的
     态势带(267) + 告警(58) + 页签(48) 占了 373px，一屏剩下的全被"平均分配"，
     卡片内部的 body 就被挤到几十像素 —— 页面"看起来没滚动条"，但图表是残的。
   修法：
     ① 顶上三块压薄：态势带 267→约 150（值 26px、去掉脚注那一层、今日实况 22px）、告警 44、页签 40；
     ② **给图卡体一个下限 `min-height:156px`**（4 张图都画得开），并让网格按内容撑高；
     ③ 万一还不够高，宁可让整页滚也别再把图表压扁（`.view-fade` 允许纵向滚动）。
   ⚠ 复核口径也要跟着改：以后判"一屏放得下"必须量**图卡体**的高度，不能只量 `#view`。
   --------------------------------------------------------------------------- */
html[data-paper] #view:has(.bp-home) .ov-hero.is-dash { padding: 8px 12px 10px !important; }
html[data-paper] #view:has(.bp-home) .ov-hero-top { padding: 6px 4px !important; margin-bottom: 4px !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d { padding: 8px 14px 10px !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-vl { font-size: 26px !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-lb { font-size: 11.5px !important; margin-bottom: 2px !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-sb { font-size: 11px !important; margin-top: 2px !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-viz { height: 16px !important; margin: 4px 0 0 !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-viz svg { height: 16px !important; }
html[data-paper] #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-cap { display: none !important; }  /* 脚注收进副标，省 22px */
html[data-paper] #view:has(.bp-home) .ov-today { padding: 5px 4px !important; font-size: 11px !important; }
html[data-paper] #view:has(.bp-home) .ov-act-c { padding: 7px 12px !important; }
html[data-paper] #view:has(.bp-home) .ov-tabs { padding-top: 0 !important; }
/* ② 图表卡体：给足高度，Cards 不再挤压 */
/* ⚠ 第一版写 `#view:has(.bp-home) .ov3-b{min-height:156px}` **没生效**（实测卡体仍只有 46~53px）：
   它被更高权重的声明压住/被 flex 收缩吃掉。这里改用"多写类名 + flex 固定尺寸"的硬写法：
   卡体不许收缩、必须 ≥156px；卡片本身也给定下限，网格按内容撑高（页面因此会滚，是可接受的代价）。 */
html[data-paper] body #view .ov3-grid .ov3-b.ov3-b {
  min-height: 140px !important;   /* 156 → 140：两行共省 32px，换来"一屏放完" */
  flex: 0 0 auto !important;
  height: auto !important;
  overflow: visible !important;
}
html[data-paper] body #view .ov3-grid .ov3-card.ov3-card { min-height: 200px !important; height: auto !important; }
html[data-paper] body #view .ov3-grid.ov3-grid { grid-auto-rows: minmax(200px, auto) !important; min-height: 0 !important; }
html[data-paper] #view:has(.bp-home) .ov3-grid { min-height: 0 !important; }
/* ④ 收掉"嵌套滚动条"：`.bp-home` 自己滚会变成"页面里再套一条滚动条"（很难用）。
   改成 `.bp-home` 不滚、高度按内容撑开，让 `#view`（页面级）滚动 —— 只有一条滚动条，
   而且**图表永远不会被切**。同时再压掉告警/页签/网格间距约 24px，把需要的滚动量降到最小。 */
html[data-paper] body #view:has(.bp-home) .bp-home { overflow: visible !important; }
html[data-paper] body #view:has(.bp-home) .ov-act-wrap > * { padding: 6px 12px !important; }
html[data-paper] body #view:has(.bp-home) .ov-act-wrap { margin-bottom: 8px !important; }
html[data-paper] body #view:has(.bp-home) .ov-tabs { min-height: 0 !important; margin-bottom: 8px !important; }
html[data-paper] body #view:has(.bp-home) .ov3-grid { gap: 10px !important; }


/* ===========================================================================
   49. 左栏精修（2026-10-09 续 · 用户："左栏导航栏做的更精美一点"）
   ---------------------------------------------------------------------------
   这一段全是**质感层**，不动任何尺寸与布局（所以不会引发溢出/挤压回归）：
     ① 选中态左光条：从纯色改成"浅→亮→深"的三段渐变，像一条发光导轨；
     ② 图标砖：hover 时轻微上浮 + 放大 4%（0.16s 弹性曲线），给出"可点"的手感；
     ③ 轨与面板之间：把硬 1px 竖线换成**两端渐隐**的细线（上下各留 6px 透明），两栏读成一整块；
     ④ 面板头：字距放宽、计数胶囊加描边 + 毛玻璃；
     ⑤ 条目标选中：在左侧光条之外再补一圈极淡内描边，深底上更"立得起来"；
     ⑥ 底部连接点：加一圈呼吸光环（2.6s，跟实时数据同一条呼吸节奏）。
   回退：删本节。
   =========================================================================== */
/* ① 选中光条：三段渐变（浅→亮→深） */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on::before,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn.on::before {
  background: linear-gradient(180deg, #A9D8FF 0%, #4AA5EE 52%, #1A7BD9 100%) !important;
  box-shadow: 0 0 10px rgba(124, 192, 248, .85) !important;
}
/* ② 图标砖 hover 上浮（只动 transform，不影响排版） */
html[data-paper] body .sidebar .nav-rail .nr-btn > svg {
  transition: transform .16s cubic-bezier(.2, .8, .3, 1), background .14s ease, color .14s ease, box-shadow .14s ease !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:hover > svg { transform: translateY(-1px) scale(1.04); }
html[data-paper] body .sidebar .nav-rail .nr-btn.on > svg { transform: none; }
/* ③ 轨/面板之间：两端渐隐的细线 */
html[data-paper] body .sidebar .nav-rail { border-right: 0 !important; }
html[data-paper] body .sidebar .nav-body { position: relative !important; }
html[data-paper] body .sidebar .nav-body::after {
  content: "" !important; position: absolute !important; top: 6px !important; bottom: 6px !important;
  left: 62px !important; width: 1px !important; pointer-events: none !important;
  background: linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, .18) 12%,
    rgba(255, 255, 255, .18) 88%, transparent 100%) !important;
}
/* ④ 面板头：字距 + 更精致的计数胶囊 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h,
html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h {
  letter-spacing: .08em !important;
  padding-bottom: 10px !important;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .06), transparent) !important;
  background-repeat: no-repeat !important;
}
html[data-paper] body .sidebar .nav-panel-h > i {
  border: 1px solid rgba(255, 255, 255, .16) !important;
  -webkit-backdrop-filter: blur(3px) !important; backdrop-filter: blur(3px) !important;
  letter-spacing: 0 !important;
}
/* ⑤ 选中条目：光条 + 一圈极淡内描边 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.active,
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-item.on,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.active,
html[data-paper][data-theme="dark"] body .sidebar .nav-item.on {
  box-shadow: inset 3px 0 0 var(--n5-active-bar), inset 0 0 0 1px rgba(255, 255, 255, .07) !important;
}
/* ⑥ 连接状态：呼吸光环
   ⚠⚠ 2026-10-09 **性能修复（用户："网页工具很卡 / 很不正常"）**：
   原来是把 box-shadow 从 0 扩到 7px 做光环、而且 `infinite`。box-shadow 是**非合成属性**，
   动画它等于每一帧都要「样式重算 + 重绘那块像素」⇒ 这个 9px 的小点让**每一个页面**在
   **完全闲置时**也在按帧干活。A/B 实测（`_qctest/idle-cost-probe.cjs --noanim`）：
     静置 12 秒——样式重算 720 次(60/秒) → 12 次(1/秒)；主线程 833ms → 39ms
   （≈ 常驻吃掉 7% 的一个核，24 小时不停；而且屏幕一直在变 ⇒ DWM 一直合成、
     ToDesk 一直抓屏编码 ⇒ 远程看这台机器就一直卡）。
   改法：光环交给 **伪元素**，只动 `transform` / `opacity`（合成属性，跑在合成器上，
   不触发样式重算，主线程不再被占用）。视觉与原效果一致（绿环从头像扩出去、淡出）。 */
@keyframes navBreath {
  0%   { transform: scale(.6); opacity: .50; }
  70%  { transform: scale(2.6); opacity: 0; }
  100% { transform: scale(2.6); opacity: 0; }
}
html[data-paper] body .sidebar .side-foot .conn .dot { position: relative; }
html[data-paper] body .sidebar .side-foot .conn .dot::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  border: 1.5px solid rgba(46, 204, 113, .55);
  pointer-events: none;
  will-change: transform, opacity;
  /* ⚠ 这里**不能**再写 `!important`：animation 简写加上 !important 会连 `animation-duration /
     animation-iteration-count` 一起锁死，从而**盖掉 perf.css 的"减少动态效果"限制** ——
     当初那条 navBreath 之所以是唯一"绕过系统设置还在跑"的动画，就是因为这个 !important。
     光环挂在 ::after 上、与 .dot.live 的 animation:pulse 不冲突，所以去掉 !important 也照样生效。 */
  animation: navBreath 2.6s ease-out infinite;
}
/* 品牌 logo：一层内高光 + 落影，深底上更有实体感 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand .logo,
html[data-paper][data-theme="dark"] body .sidebar .brand .logo {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .34), 0 8px 18px -12px rgba(0, 0, 0, .9) !important;
}


/* ===========================================================================
   50. 生产概览「门面」质感（2026-10-09 续 · 用户："这是我整个程序的门面，一进来要有高端感"）
   ---------------------------------------------------------------------------
   诊断（对照截图）：这页不高端不是因为缺颜色，而是**所有块等权、且全平**——
   5 张 KPI 卡 + 3 条告警 + 4 张图卡都是"白底 + 1px 发丝线"，没有焦距、没有层次、没有材质。
   高端感只需要三件事：**一个焦点 · 一层深度 · 一套细字**。所以：

     ① 焦点：KPI 带做成"仪表盘面板" —— 顶缘一道 2px 品牌蓝，面板带极淡竖向渐变，
        底部一层抱光阴影（浮起来）；数值 30px/800 + 等宽数字 + 轻微字距收紧，副标 11px 灰。
     ② 深度：四张图卡换成 14px 圆角 + 一层 28px 的柔影 + 卡头图标砖（品牌蓝淡底），
        图区给一层"上浅下白"的内底，让图表像嵌在仪表玻璃里。
     ③ 细字：页头标题前加一道 3px 品牌蓝竖标；视图页签/图例/口径说明统一到 11px 灰阶。
     ④ 交期压力里的"日历格子"改成圆角小片（带描边 + hover 抬升），不再是裸表格。
   全是质感属性（渐变/阴影/圆角/字距），**不碰宽高与内边距**，因此不会再引发挤压或溢出。
   =========================================================================== */
/* ① KPI 仪表面板（焦点） */
html[data-paper] body #view:has(.bp-home) .ov-hero.is-dash {
  border-radius: 16px !important;
  border: 1px solid rgba(26, 123, 217, .16) !important;
  background:
    linear-gradient(180deg, rgba(26, 123, 217, .045) 0%, rgba(255, 255, 255, 0) 42%),
    linear-gradient(180deg, #FFFFFF 0%, #F7FAFE 100%) !important;
  box-shadow: 0 14px 34px -26px rgba(12, 58, 110, .55), inset 0 1px 0 rgba(255, 255, 255, .9) !important;
  position: relative !important; overflow: hidden !important;
}
html[data-paper] body #view:has(.bp-home) .ov-hero.is-dash::before {
  content: "" !important; position: absolute !important; left: 0 !important; right: 0 !important; top: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, #0767C5 0%, #1A7BD9 38%, #56A7A2 100%) !important;
}
html[data-paper] body #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-vl {
  font-variant-numeric: tabular-nums !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .8) !important;
}
html[data-paper] body #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-lb { letter-spacing: .06em !important; }
html[data-paper] body #view:has(.bp-home) .ov-kpi-d.ov-kpi-d .k-lb::first-letter { font-weight: 900 !important; }
/* ② 图卡深度 + 卡头图标砖 */
html[data-paper] body #view:has(.bp-home) .ov3-card.ov3-card {
  border-radius: 14px !important;
  border: 1px solid var(--sk-line) !important;
  background: #FFFFFF !important;
  box-shadow: 0 16px 34px -30px rgba(12, 58, 110, .6) !important;
  overflow: hidden !important;
}
html[data-paper] body #view:has(.bp-home) .ov3-b {
  background: linear-gradient(180deg, #FBFDFF 0%, #FFFFFF 58%) !important;
  border-radius: 10px !important;
}
html[data-paper] body #view:has(.bp-home) .ov3-h .ov3-ico {
  width: 24px !important; height: 24px !important; border-radius: 8px !important;
  background: linear-gradient(160deg, #EAF3FD 0%, #DCEAFA 100%) !important;
  border: 1px solid rgba(26, 123, 217, .2) !important;
  color: #0F63B4 !important;
}
/* ③ 页头与页签细字 */
html[data-paper] body .topbar .crumb { position: relative !important; padding-left: 12px !important; }
html[data-paper] body .topbar .crumb::before {
  content: "" !important; position: absolute !important; left: 0 !important; top: 4px !important; bottom: 4px !important;
  width: 3px !important; border-radius: 2px !important;
  background: linear-gradient(180deg, #1A7BD9, #0767C5) !important;
}
html[data-paper] body #view:has(.bp-home) .ov-tabs { border-radius: 12px !important; }
/* ④ 交期压力的"日历格子"：改成圆角小片 */
html[data-paper] body #view:has(.bp-home) .dg-ruler .dg-rl {
  border-radius: 8px !important;
  transition: background .14s ease, box-shadow .14s ease, transform .14s ease !important;
}
html[data-paper] body #view:has(.bp-home) .dg-ruler .dg-rl:hover {
  background: rgba(26, 123, 217, .06) !important;
  box-shadow: 0 6px 14px -10px rgba(12, 58, 110, .6) !important;
  transform: translateY(-1px) !important;
}


/* ===========================================================================
   51. 生产概览「下方空白没利用 + 底部图表被切」修复（2026-10-09 续）
   ---------------------------------------------------------------------------
   用户截图 + `fit-probe` 实测同时成立的两个事实：
     · `.ov3-grid` 的行高被写死成等分（1fr）⇒ 每行只分到 ~253px，卡片里放不下的内容
       （交期压力底部日历、交付周期的 UPAGE/DSL/PAGE 条）被 **裁掉**；
     · 同时网格又没吃掉页面的剩余高度 ⇒ 页面底部留出一片空白。
   修法：
     ① 行高改 `auto`（按内容撑）+ `align-content: stretch`（有富余时等分给两行）——
        内容少时自动填满、内容多时网格变高（页面滚动），**两头都不会再出现"空白 + 裁切"**；
     ② 图卡里的两颗「口径说明」胶囊**脱离文档流**钉到卡片右下角（绝对定位）——
        信息保留、可点开，但不再各占一行，每张卡省 ~52px（两行共 ~104px）。
   ⚠ 只动"行高分配"与"胶囊定位"，不改卡片的内边距与内容尺寸。
   =========================================================================== */
html[data-paper] body #view:has(.bp-home) .ov3-grid.ov3-grid {
  grid-template-rows: auto auto !important;
  align-content: stretch !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
}
html[data-paper] body #view:has(.bp-home) .ov3-grid > .ov3-card {
  height: auto !important;
  min-height: 200px !important;
  align-self: stretch !important;
}
/* ② 口径说明胶囊：钉到卡片右下角，不再占版面 */
html[data-paper] body #view:has(.bp-home) .ov3-card { position: relative !important; }
html[data-paper] body #view:has(.bp-home) .ov3-card .pl-note {
  position: absolute !important;
  right: 12px !important; bottom: 6px !important;
  margin: 0 0 0 6px !important;
  z-index: 3 !important;
}
html[data-paper] body #view:has(.bp-home) .ov3-card .pl-note-btn {
  height: 18px !important; min-height: 18px !important;
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid var(--sk-line) !important;
  opacity: .8 !important;
}
html[data-paper] body #view:has(.bp-home) .ov3-card .pl-note-btn:hover { opacity: 1 !important; }


/* ---------------------------------------------------------------------------
   52. 生产概览「底部灰色底不露出来」（2026-10-09 续 · 用户："我说的是这些灰色的区域"）
   ---------------------------------------------------------------------------
   现象：页面内容比视口矮时，最底下露出一条**页面底色灰带**（截图里图卡下方那条）。
   原因：高度没有沿 DOM 传下去 —— `#view`(有高) → `.view-fade`(没拉满) → `.bp-home`(没伸开)
         → `.ov3-grid`(因此拿不到"剩余高度"，只能按内容高度站住)。
   修法：把这条链一次接到底，**让图区的两行把剩余高度分掉**（图表跟着变高，视觉上更饱满）：
     `#view > .view-fade` 拉满 100% 并转成 flex 列 → `.bp-home` 作为可伸长的子项 →
     `.ov3-grid` `flex:1` + 行高 `auto` + `align-content:stretch` ⇒ 富余高度全部摊给两行图卡。
   结果：**内容少时图卡变高填满（不露灰）；内容多时页面滚动（不裁切）**，两头都对。
   --------------------------------------------------------------------------- */
html[data-paper] body #view:has(.bp-home) > .view-fade {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 100% !important;
}
html[data-paper] body #view:has(.bp-home) .bp-home.ov3 {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
html[data-paper] body #view:has(.bp-home) .ov3-grid.ov3-grid {
  flex: 1 1 auto !important;
  align-content: stretch !important;
}
/* ② 「灰色区域」的最后一截其实是 `#view` 自己的内边距（skin.css 里 .view{padding:18px 20px 26px}）。
   内容已经拉满 100%，露出来的就是这 26px 底内边距 ⇒ 这一页把内边距压到 10/12/8，
   灰带从 26px 收到 8px（肉眼基本看不到），同时图区再多拿 24px 高度。 */
html[data-paper] body #view:has(.bp-home) {
  padding: 10px 12px 8px !important;
}


/* ===========================================================================
   53. 让内容区也"姓蓝"（2026-10-09 续 · 用户："主题色是不是高级灰，显得有点违和"）
   ---------------------------------------------------------------------------
   诊断：左栏是饱和品牌蓝，内容区却是"蓝灰色阶"（页底 #F5F7FA、卡面纯白、表头浅灰），
   一屏里两套语气 ⇒ 看着"高级灰 + 违和"。
   做法（不加深、不刷色，全部是**低饱和淡蓝**）：
     ① 页底 #F5F7FA → **#EDF3FB**（明显偏蓝），底纹两道蓝光加强；
     ② 卡面/面板：保持白，但**描边改蓝**（#DCE7F4→#D8E5F3），并给卡头一层极淡蓝渐变；
     ③ 表头 / 看板列头 / 视图页签：**淡蓝底 #F4F8FD + 品牌蓝字 #0F63B4**；
     ④ 卡头标题、区块标题：改**深品牌蓝**（#0F63B4），不再用墨灰；
     ⑤ 把两张"近灰"的 KPI 身份色（slate/indigo）也往蓝里推一档，避免屏幕上出现"灰卡"。
   ⚠ 只改颜色令牌与描边色，不动尺寸。
   =========================================================================== */
html[data-paper]:not([data-theme="dark"]) {
  --sk-page: #EDF3FB;
  --sk-page-2: #E3EBF7;
  --sk-soft: #F2F7FD;
  --sk-line: #D8E5F3;
  --sk-line-2: #E7EFF9;
  --ui-bg-page: #EDF3FB;
  --ui-bg-soft: #F2F7FD;
  --ui-line-200: #D8E5F3;
  --ui-line-100: #E7EFF9;
  /* 近灰的两个身份色往蓝推一档，屏幕上不再出现"灰卡" */
  --h-slate-ink: #3E5A7A; --h-slate-tint: #EDF3FB; --h-slate-line: #D6E3F2; --h-slate-solid: #6C8CB0;
  --h-indigo-ink: #2F5C8F; --h-indigo-tint: #EAF2FC; --h-indigo-line: #D2E1F3; --h-indigo-solid: #5B85B8;
}
html[data-paper]:not([data-theme="dark"]) body {
  background-image:
    radial-gradient(1200px 640px at 3% -12%, rgba(26, 123, 217, .13), transparent 62%),
    radial-gradient(900px 520px at 102% -6%, rgba(86, 167, 162, .09), transparent 60%),
    linear-gradient(180deg, #EEF4FC 0%, #E6EEF9 100%) !important;
}
/* ② 卡头 / 卡面质感：淡蓝渐变 + 蓝描边 */
html[data-paper] body #view :is(.ov3-card, .ov-act-c, .ui-kpi, .sp-kpi-card, .dv-kpi-item, .pd-card, .q-kpi, .am-kpi-card, .rp-kpi-item) {
  border-color: var(--sk-line) !important;
}
html[data-paper] body #view .ov3-h {
  background-image: linear-gradient(180deg, rgba(26, 123, 217, .06), rgba(26, 123, 217, 0)) !important;
}
/* ③ 表头 / 看板列头 / 页签：淡蓝底 + 品牌蓝字 */
html[data-paper] body #view table thead th {
  background: #F2F7FD !important;
  color: #0F63B4 !important;
  border-bottom-color: var(--sk-line) !important;
}
html[data-paper] body #view :is(.stcol, .board .stcol) > :first-child,
html[data-paper] body #view :is(.ov-tabs button.on, .dv-tabs button.on, .rp-tabs button.on) {
  color: #0F63B4 !important;
}
/* ④ 卡头/区块标题：深品牌蓝 */
html[data-paper] body #view :is(.ov3-h h3, .ov3-h .ov3-t, .dcv-card > h4, .panel > h4, .card > h4) {
  color: #0F63B4 !important;
}


/* ===========================================================================
   54. 锁定 1920×1080 设计（2026-10-09 续 · 用户："不要再搞自适应屏幕尺寸这一套，
       全部按照 24 寸 1920×1080 的显示屏幕来做设计"）
   ---------------------------------------------------------------------------
   自适应那套（`ui-scale.js`）已经整段停用（见 index.html 的注释）。本节只做两件事：
     ① **钉死 zoom=1**：万一浏览器里还残留上一次写入的内联 `style.zoom`（或在别的机器上
        被写过 localStorage），这里用 `!important` 强制回到 1 —— CSS 的 !important
        能压过行内非 important 声明，所以不需要再跑任何脚本；
     ② **钉死设计画布基准**：整站按 1920 宽设计，给内容区一个"不小于设计宽"的下限，
        窗口被拖窄时**不再重排**（宁可出现横向滚动），保证在任何窗口尺寸下看到的
        都是同一套排版，而不是"每台机器一个样"。
   ⚠ 手机档（≤760px）的媒体查询保留但不会在 1920×1080 下触发；如果连那套也不要，说一声一起删。
   =========================================================================== */
/* ★ 2026-10-10：§56 那版「1080p 整体 zoom 0.85」已**撤回**（见文末 §56 的实测结论：
   本项目的布局用百分比宽度，zoom 会让布局视口和渲染尺寸对不上 —— 实测 1920×956 下
   文档横向溢出 339px，最右边那张 KPI 卡被切掉）。这里恢复"恒定 zoom=1"。 */
html, body { zoom: 1 !important; }
html[data-paper] body #view { min-width: 1480px !important; }
/* 顶栏那条"显示比例"入口（ui-scale.js 注入的）即便脚本残留也一并藏掉 */
html[data-paper] body :is(#uiScaleBtn, #uiScalePanel, .ui-scale-btn, .ui-scale-pop, [id*="uiScale"]) {
  display: none !important;
}


/* ===========================================================================
   55. 「口径说明」全站统一（2026-10-09 续 · 用户："这种页面的口径说明布局都很怪异，全程序检查一下"）
   ---------------------------------------------------------------------------
   现象（用户截图：生产动态页左下）：口径说明**展开成一大块白卡**压在图/表格下面，
   占掉半屏高度、还把页面撑长。
   成因：`polish-ux.js` 的机制是「把原本的说明文字抽成 `.pl-note`（小胶囊）+ `.pl-note-pop`（弹出层）」，
     胶囊点击才展开；但**弹出层的隐藏只写在 polish.css 里**，被后面加载的皮肤层/模块层的
     `display` 声明盖掉了 ⇒ 在部分页面上"弹出层常驻可见"。
   修法（全站一份，不再逐页打补丁）：
     ① `.pl-note-pop` **默认 `display:none`**，只有父级 `.pl-note.is-open` 时才显示；
     ② 弹出层统一为"浮在胶囊正上方"的小卡：绝对定位 + 520px 上限 + 圆角 10 + 柔影；
     ③ 胶囊统一成 20px 高的安静小片（11px、发丝线、淡蓝 hover），并且**只在行内**占位。
   这样任何模块的"口径说明"都是同一形态：一行小胶囊，需要时点开看，不会再有常驻大白块。
   =========================================================================== */
html[data-paper] body #view .pl-note {
  position: relative !important;
  display: inline-flex !important; align-items: center !important;
  vertical-align: middle !important;
  margin: 0 6px 0 0 !important;
}
html[data-paper] body #view .pl-note-btn {
  display: inline-flex !important; align-items: center !important; gap: 4px !important;
  height: 20px !important; min-height: 20px !important;
  padding: 0 8px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 999px !important;
  background: #FFFFFF !important;
  color: var(--sk-ink-3) !important;
  font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0 !important;
  cursor: pointer !important;
}
html[data-paper] body #view .pl-note-btn:hover,
html[data-paper] body #view .pl-note.is-open .pl-note-btn {
  border-color: var(--sk-accent) !important;
  color: var(--sk-accent) !important;
  background: var(--sk-soft) !important;
}
/* ① 默认隐藏（这是关键：以前它被别的规则放出来了） */
html[data-paper] body #view .pl-note-pop {
  display: none !important;
}
html[data-paper] body #view .pl-note.is-open .pl-note-pop {
  display: block !important;
  position: absolute !important;
  left: 0 !important; bottom: calc(100% + 6px) !important;
  z-index: 60 !important;
  width: max-content !important; max-width: 520px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 10px !important;
  background: #FFFFFF !important;
  box-shadow: 0 14px 34px -20px rgba(12, 58, 110, .55) !important;
  font-size: 12px !important; line-height: 1.7 !important;
  color: var(--sk-ink-2) !important;
  white-space: normal !important;
}
/* ③ 原始说明文字（被抽成胶囊前的那段）必须保持隐藏，避免"顺手又露出来" */
html[data-paper] body #view .pl-note-src { display: none !important; }


/* ===========================================================================
   56. 全站「不再出现灰色」（2026-10-09 续 · 用户："96 深孔板的颜色怎么还是灰色，
       整个程序所有功能模块的颜色不要再出现灰色了"）
   ---------------------------------------------------------------------------
   ① **96 孔位小图**（接酯/上机操作台里那一格）：占位孔的颜色来自数据里的 `col`，
      数据没给色时渲染函数自己落回 `#939393`（production.js:2553 的 `return '#939393'`），
      于是屏幕上一片灰。这里在**渲染结果上**统一钉死：
        空孔 = 极淡蓝（--sk-line-2）· 占位孔 = 品牌蓝（--sk-accent）· 悬停加深。
      用 `!important` 是因为占位孔的颜色是**行内 style**（`.wm-dot.has[style]`），普通声明压不住。
   ② **全局灰面**：把几个"中性灰实心/描边"令牌换成蓝灰（仍是低饱和，不会变成彩色块），
      这样各模块里 `var(--ui-mute-*)`/`var(--ui-line-*)` 画出来的块也都不再是纯灰。
   ⚠ 只换颜色，不动任何尺寸；文字灰阶（--ui-ink-*）保留 —— 那是排版层次，不是"色块"。
   回退：删本节。
   =========================================================================== */
html[data-paper] body #view .wm-dot {
  background: var(--sk-line-2) !important;
  box-shadow: inset 0 0 0 1px rgba(26, 123, 217, .14) !important;
}
html[data-paper] body #view .wm-dot.has {
  background: var(--sk-accent) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5) !important;
}
html[data-paper] body #view .wm-dot.has:hover { background: #0F63B4 !important; }
/* ② 全局灰面 → 蓝灰 */
html[data-paper]:not([data-theme="dark"]) {
  --ui-mute-solid: #7E93A8;
  --ui-mute-ink: #4E6478;
  --ui-mute-line: #D8E5F3;
  --ui-mute-bg: #F2F7FD;
  --ui-info-solid: #5B85B8;
  --ui-info-ink: #2F5C8F;
  --p2-line: #D8E5F3;
}
/* ③ 台面/上机图里那些"空闲/未用"的灰字灰线 → 蓝灰（同明度，不影响可读性） */
html[data-paper] body #view svg :is(text, path, circle, line, rect)[fill="#939393"],
html[data-paper] body #view svg :is(text, path, circle, line, rect)[stroke="#939393"] {
  fill: #6C8CB0 !important; stroke: #6C8CB0 !important;
}
/* ④ 96 孔位小图（`.pmap .pw`）：空孔也改淡蓝 —— 原来它是灰底，
      所以"数据里没有孔位的那些孔"一直是灰的（用户："孔位还是灰的"）。
      `.pw.fill` 的颜色由数据层 `_pureColor()` 给（本轮已把 HPLC/未标注的灰改成蓝/墨紫），
      这里只兜底"数据层万一还给灰"的情况。 */
/* ⚠⚠ 血案（2026-10-09 · 我自己引入又自己修）：上一版写的是 `.pmap .pw{background:淡蓝!important}`，
   它虽然特异性低于 `.pw.fill`，但 **!important 能压过行内 style**（占位孔的颜色正是行内 style），
   结果把**所有孔位（含占位孔）都刷成淡蓝** ⇒ 用户看到"一片不着色"。
   ⇒ 空孔样式必须用 `:not(.fill)` 限定，占位孔一律**不声明 background**，让数据层给的颜色生效。 */
html[data-paper] body #view .pmap .pw:not(.fill) {
  background: var(--sk-line-2) !important;
  box-shadow: inset 0 0 0 1px rgba(26, 123, 217, .16) !important;
}
html[data-paper] body #view .pmap .pw.fill {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45) !important;
  /* 故意不写 background：颜色来自 `_pureColor()`（HPLC 蓝 / PAGE 品红 / UPAGE 绿 / DSL 琥珀 / 未标注墨紫） */
  background-image: none !important;
}
html[data-paper] body #view .pm-legend .lg em[style*="#ebebeb"],
html[data-paper] body #view .pm-legend .lg em[style*="235, 235, 235"] {
  background: var(--sk-line-2) !important;
  border-color: rgba(26, 123, 217, .2) !important;
}


/* ---------------------------------------------------------------------------
   57. 「2767 上机文件」美化（2026-10-09 续 · 用户："收集孔也用圆孔显示，页面美化按你的建议来做"）
   ---------------------------------------------------------------------------
   ① 孔型统一：整机布局里小板图的孔是**方块**（`.pmap .pw` 是 span，没有圆角），
      样品板/上机位图那边是圆孔 ⇒ 用 `border-radius:50%` 把小板图的孔也做成圆孔，
      全页只有一种孔型（顺带把孔位尺寸做成正方形+内高光，像真实深孔板）。
   ② 孔位配色令牌化：`--upw-sample`（样品蓝）/ `--upw-collect`（收集青绿）/ `--upw-wash`（洗针琥珀），
      下面凡是能命中的孔/床位都用变量，后面"换配色"只改这三个值即可。
   ③ 逐针清单隔行底色统一成极淡蓝（原来浅黄/浅白交替，和上面的蓝青绿不搭）。
   --------------------------------------------------------------------------- */
html[data-paper] {
  --upw-sample: #CFE2F8;
  --upw-sample-2: #4A90D0;
  --upw-collect: #C9E9E5;
  --upw-collect-2: #2F7C76;
  --upw-wash: #FBE6C8;
  --upw-wash-2: #C9761A;
}
/* ① 小板图的孔 → 圆孔（含空孔与占位孔） */
html[data-paper] body #view .pmap .pw {
  border-radius: 50% !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), inset 0 0 0 1px rgba(26, 123, 217, .18) !important;
}
html[data-paper] body #view .pmap .pw.fill { border-radius: 50% !important; }
/* ⚠⚠ 血案：上面两条只写了 `#view .pmap` —— 而「2767 上机文件」是**弹窗**（挂在 <body> 下、
   不在 #view 里）⇒ 弹窗里的小板图（1.1/1.2 收集板）孔还是方块。
   `workbench.css:731` 的 `.modal .pi-map .pmap .pw{border-radius:4px}` 才是它们的规则。
   补一条弹窗作用域的；`:not(!important)` 对非 important 声明必胜，所以这一条足够。 */
html[data-paper] body .modal .pmap .pw,
html[data-paper] body .modal .pi-map .pmap .pw {
  border-radius: 50% !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), inset 0 0 0 1px rgba(26, 123, 217, .18) !important;
}
html[data-paper] body .modal .pmap .pw.fill,
html[data-paper] body .modal .pi-map .pmap .pw.fill {
  border-radius: 50% !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5) !important;
}
/* ⚠⚠ 上面两条仍然没命中 1.1/1.2 那两张收集板 ⇒ 它们既不是 `#view .pmap`、也不是 `.modal .pmap`。
   这一条是**兜底shotgun**：凡是「弹窗里、祖先 class 含 map/bed/plate 的小图元」
   一律做成圆孔（HTML 元素用 border-radius，SVG rect 用 rx/ry）。
   对行/列字母标签（`.pc/.pr`，本身没有底色）无副作用。 */
html[data-paper] body .modal [class*="map" i] :is(span, i, b, rect),
html[data-paper] body .modal [class*="bed" i] :is(span, i, b, rect),
html[data-paper] body .modal [class*="plate" i] :is(span, i, b, rect) {
  border-radius: 50% !important;
  rx: 50% !important; ry: 50% !important;
}


/* ---------------------------------------------------------------------------
   59. 全站「清晰度 +1 档」（2026-10-09 续 · 用户："整个页面的清晰度提高一个档"）
   ---------------------------------------------------------------------------
   清晰度不是靠加大，而是三件事：**文字更实（墨色降一档）+ 边界更清（发丝线加深）+
   小图元更锐（SVG 几何精度 + 抗锯齿）**。这里只改颜色与渲染方式，**不动任何尺寸**，
   所以不会引发挤压/溢出（前几轮"改好看反而挤坏"的教训）。
     · 墨色：主文字 #1B2430→#14202B、正文 #4A5763→#46586A、标签 #8A97A4→#62748A
     · 发丝线： #D8E5F3→#C9D9EC（浅底 #E7EFF9→#DCE7F4）—— 卡片/表格/孔位的边界一眼可辨
     · 渲染： 全站开抗锯齿 + optimizeLegibility；弹窗里的 SVG（机台图/板图）用
              `shape-rendering: geometricPrecision`，小圆点边缘不再发糊
   --------------------------------------------------------------------------- */
html[data-paper] body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
html[data-paper]:not([data-theme="dark"]) {
  --ui-ink-900: #14202B;
  --ui-ink-700: #253444;
  --ui-ink-500: #46586A;
  --ui-ink-400: #62748A;
  --ui-ink-300: #8095AB;
  --sk-line: #C9D9EC;
  --sk-line-2: #DCE7F4;
  --ui-line-200: #C9D9EC;
  --ui-line-100: #DCE7F4;
  --n4-line: #C9D9EC;
  --n5-line: rgba(255, 255, 255, .14);
}
/* 小图元更锐：机台图 / 板图 / 孔位小图（弹窗与页面内都算） */
html[data-paper] body :is(.modal, #view) svg { shape-rendering: geometricPrecision; }
html[data-paper] body .modal svg :is(rect, circle, path, line) { shape-rendering: geometricPrecision !important; }
/* 行列字母、表头这类 11px 小字最容易显糊：加半档字重 + 深一档墨色 */
html[data-paper] body :is(.modal, #view) :is(.pmap .pc, .pmap .pr, .pi-plate-h .sub, .pi-wash-note, table thead th) {
  color: #46586A !important;
  font-weight: 800 !important;
}


/* ---------------------------------------------------------------------------
   60. 「线边物料」页美化（2026-10-09 续 · 用户："这个页面好好美化一下"）
   ---------------------------------------------------------------------------
   诊断（对照截图）：这页的主体是一张 12 列的大表 + 一条灰色提示带 + 一排筛选片，
   问题不在缺色，而在**没有层次**：表头跟前几行一个样、行线比内容还抢眼、
   "线边区域"徽章各色混用（绿/粉/蓝）、提示带像一块灰补丁。
   作用域用 `#view:has(.pd-tag)` 精确锁定这一页（`.pd-tag` 是这页徽章的类，
   在巡检里出现过 583 次），改动不会外溢到别的模块。
     · 表头：淡蓝底 + 深蓝字 + 800 字重 + 下缘发丝线（一眼分出表头）
     · 行：隔行极淡蓝（#FAFCFF）· hover 加深（#EDF4FC）· 单元格线降到最淡
     · 徽章 `.pd-tag`：统一成小胶囊（淡蓝底 + 蓝字 + 发丝线），不再各色混用
     · 提示带：浅蓝底 + 左侧 3px 品牌蓝条，从"灰补丁"变成"说明条"
   --------------------------------------------------------------------------- */
html[data-paper] body #view:has(.pd-tag) table thead th {
  background: #F2F7FD !important;
  color: #0F63B4 !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  letter-spacing: .02em !important;
  border-bottom: 1px solid var(--sk-line) !important;
}
html[data-paper] body #view:has(.pd-tag) table tbody tr:nth-child(even) > td { background: #FAFCFF !important; }
html[data-paper] body #view:has(.pd-tag) table tbody tr:hover > td { background: #EDF4FC !important; }
html[data-paper] body #view:has(.pd-tag) table tbody td {
  font-size: 12px !important;
  color: #46586A !important;
  border-color: var(--sk-line-2) !important;
}
html[data-paper] body #view:has(.pd-tag) table tbody td:first-child { font-weight: 700 !important; }
/* 徽章统一成小胶囊 */
html[data-paper] body #view:has(.pd-tag) .pd-tag {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 20px !important; padding: 0 8px !important;
  border-radius: 999px !important;
  background: #EAF3FD !important;
  color: #0F63B4 !important;
  border: 1px solid var(--sk-line) !important;
  font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0 !important;
}
/* 提示带：灰补丁 → 说明条 */
html[data-paper] body #view:has(.pd-tag) :is([class*="note"], [class*="tip"], [class*="hint"]) {
  background: #F4F8FD !important;
  border-left: 3px solid var(--sk-accent) !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  color: #46586A !important;
  font-size: 11.5px !important;
  line-height: 1.7 !important;
}
/* 顶部三张 KPI 卡：跟全站 KPI 一套零件（若已被 §41 覆盖则无副作用） */
html[data-paper] body #view:has(.pd-tag) [class*="kpi"] {
  border-radius: 12px !important;
  border: 1px solid var(--sk-line) !important;
  background: var(--sk-card) !important;
  box-shadow: 0 1px 2px rgba(20, 40, 70, .05) !important;
}


/* ---------------------------------------------------------------------------
   61. 线边物料页 · 第二轮（用户："都做" —— 筛选片 + 列宽）
   ---------------------------------------------------------------------------
   ① 筛选片：这页所有"页面级按钮"（筛选片 / 顶部三个页签）统一成**胶囊**：
      常态＝白底+发丝线+深蓝字；选中（.on/.active/aria-pressed）＝实品牌蓝+白字。
      用 `:not(td *)` 把表格里的「编辑」按钮排除在外，避免误伤。
   ② 列宽：12 列里「规格/型号」「主单位/包装单位」常年是「—」，白占宽度，把「物料名称」
      挤到 20% 以下。这里改用 `table-layout:fixed` + 按列定宽（合计 100%），
      名称列拿到 20%、仓库 12%、品牌 10%，其余压窄；单元格超出用省略号 + title 兜底
      （title 由 table-polish.js 自动补）。
      ⚠ 只作用于「线边物料」这一页（`#view:has(.pd-tag)`），且改完立刻量横向溢出。
   --------------------------------------------------------------------------- */
html[data-paper] body #view:has(.pd-tag) button:not(td *) {
  height: 26px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid var(--sk-line) !important;
  background: #FFFFFF !important;
  color: #0F63B4 !important;
  font-size: 12px !important; font-weight: 700 !important;
  box-shadow: none !important;
}
html[data-paper] body #view:has(.pd-tag) button:not(td *):hover {
  background: #F2F7FD !important; border-color: var(--sk-accent) !important;
}
html[data-paper] body #view:has(.pd-tag) button:not(td *).on,
html[data-paper] body #view:has(.pd-tag) button:not(td *).active,
html[data-paper] body #view:has(.pd-tag) button:not(td *)[aria-pressed="true"] {
  background: linear-gradient(180deg, #2A8FE4 0%, #0F63B4 100%) !important;
  border-color: #0F63B4 !important;
  color: #FFFFFF !important;
}
/* ⚠⚠ 第一版用了 `table-layout:fixed + nowrap + ellipsis`，结果**754 个单元格被截断**
   （实测 tips 86 → 754）—— 虽然都有悬停 title，但可读性明显退步，所以改成：
   **不锁表格布局、不做硬截断**，只给"常年是 `—` 的窄列"一个宽度建议，
   让浏览器在 auto 布局里把这些列自动收窄、把省下的宽度分给「物料名称」。
   实测标准：`xOver` 必须为 0，`tips`（被截断单元格数）不得比改前明显上升。 */
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(4) { width: 9% !important; }
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(5) { width: 7% !important; }
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(6) { width: 4% !important; }
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(7) { width: 4% !important; }
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(11) { width: 5% !important; }
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(12) { width: 4% !important; }
html[data-paper] body #view:has(.pd-tag) table :is(th, td):nth-child(3) { min-width: 200px !important; }
/* 第三列（物料名称）：加个下限宽度，把长名称撑开；同时保证不因为窄列被压回 */
html[data-paper] body #view:has(.pd-tag) table th:nth-child(3) { white-space: nowrap !important; }


/* ---------------------------------------------------------------------------
   62. 「线边物料 · 物料领用登记」页美化（2026-10-09 续 · 用户："这个页面更需要好好美化一下"）
   ---------------------------------------------------------------------------
   诊断（对照截图）：
     ① 顶部三张 KPI 卡**又高又空**（约 130px 高、内容只占一半）—— 浪费一屏；
     ② KPI 与页签之间**空出一大条**（~70px），是"页面没被填满"的老问题；
     ③ 表单的输入框/下拉全是浏览器默认样式（直角、灰边、高度不一），和全站不是一套；
     ④ 台账表 14 列挤在一起、表头与正文同色、行线比内容抢眼。
   做法（作用域 `#view:has(.pd-table)`，只作用这套页；全部无尺寸放大，只压高度/换色）：
     · KPI 卡：`min-height:92px`（与全站第 4 档一致），不再空占高度；
     · 表单控件：统一 32px 高、8px 圆角、发丝线、聚焦蓝环；
     · 按钮：页面级按钮统一胶囊（主按钮/危险按钮/表格内按钮**排除**，保持语义）；
     · 台账表：表头淡蓝+深蓝字+800、隔行极淡蓝、悬停加深、单元格线降到最淡。
   --------------------------------------------------------------------------- */
html[data-paper] body #view:has(.pd-table) [class*="kpi"] {
  min-height: 92px !important;
  padding: 12px 16px !important;
}
/* 表单控件统一 */
html[data-paper] body #view:has(.pd-table) :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  height: 32px !important; min-height: 32px !important;
  border-radius: 8px !important;
  border: 1px solid var(--sk-line) !important;
  background: #FFFFFF !important;
  color: #253444 !important;
  font-size: 12.5px !important;
  padding: 0 10px !important;
  box-shadow: none !important;
}
html[data-paper] body #view:has(.pd-table) textarea { height: auto !important; min-height: 60px !important; padding: 8px 10px !important; }
html[data-paper] body #view:has(.pd-table) :is(input, select, textarea):focus {
  border-color: var(--sk-accent) !important;
  box-shadow: 0 0 0 3px rgba(26, 123, 217, .14) !important;
}
html[data-paper] body #view:has(.pd-table) label { font-size: 12px !important; font-weight: 700 !important; color: #46586A !important; }
/* 页面级按钮统一胶囊（主按钮 / 危险按钮 / 表格内按钮不碰） */
html[data-paper] body #view:has(.pd-table) button:not(td *):not(.primary):not(.is-primary):not(.danger):not(.pd-primary) {
  height: 28px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid var(--sk-line) !important;
  background: #FFFFFF !important;
  color: #0F63B4 !important;
  font-size: 12px !important; font-weight: 700 !important;
  box-shadow: none !important;
}
html[data-paper] body #view:has(.pd-table) button:not(td *):not(.primary):not(.is-primary):not(.danger):not(.pd-primary):hover {
  background: #F2F7FD !important; border-color: var(--sk-accent) !important;
}
/* 台账表：表头 / 行 / 线 */
html[data-paper] body #view:has(.pd-table) .pd-table thead th {
  background: #F2F7FD !important;
  color: #0F63B4 !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  letter-spacing: .02em !important;
  border-bottom: 1px solid var(--sk-line) !important;
}
html[data-paper] body #view:has(.pd-table) .pd-table tbody tr:nth-child(even) > td { background: #FAFCFF !important; }
html[data-paper] body #view:has(.pd-table) .pd-table tbody tr:hover > td { background: #EDF4FC !important; }
html[data-paper] body #view:has(.pd-table) .pd-table tbody td {
  font-size: 12px !important; color: #46586A !important;
  border-color: var(--sk-line-2) !important;
}


/* ---------------------------------------------------------------------------
   63. 「线边物料」顶部三张卡不再空占高度（2026-10-09 续 · 用户 DevTools 给到
       `<div class="pd-cards">` → `<div class="pd-card pd-c-pending">`）
   ⚠ 本节已被 **§65** 取代（线边物料页不再用 `.pd-cards`，改成页头 KPI 小片）。
     留着只对**别的页**（物料出库 / 交接 / 生产动态…）生效，线边物料页不再命中。
   ---------------------------------------------------------------------------
   现象：`.pd-cards` 里每张 `.pd-card` 高约 130px，而内容（标签 + 数字 + 单位）只占 ~50px，
   剩下的 80px 就是用户截图里那片空白；再加卡片行与页签之间的外边距，一屏被吃掉 150px 左右。
   做法（只作用这一套页，靠 `.pd-cards` 这个容器锚定）：
     · 网格行改成按内容高度（`grid-auto-rows: min-content`）+ `align-items:start`
     · 卡片 `min-height:86px; height:auto`，内边距 12/16
     · 卡片行整体下边距收到 8px
   ⚠ `.pd-card` 在「交接待办」页也出现（那边是内容较多的任务卡，高 163px），
     所以这里**必须**用 `.pd-cards` 限定，不能直接改 `.pd-card`。
   --------------------------------------------------------------------------- */
html[data-paper] body #view .pd-cards {
  grid-auto-rows: min-content !important;
  align-items: start !important;
  margin-bottom: 8px !important;
  row-gap: 10px !important;
}
html[data-paper] body #view .pd-cards .pd-card {
  min-height: 86px !important;
  height: auto !important;
  padding: 12px 16px !important;
}


/* ---------------------------------------------------------------------------
   64. 「物料领用登记」版式重排（2026-10-09 续 · 用户："布局还是特别丑，需要重新设计合理布局"）
   ⚠ 本节是**在旧结构上打补丁**，已被 **§65** 换骨架取代 ——
     线边物料页现在没有 `.pd-cards`，本节所有 `:has(.pd-cards)` 规则在那页全部失效。
     为什么当时没成（flex 被撑开的根因）写在 §65 开头，别再照着本节的路子往下补。
   ---------------------------------------------------------------------------
   现状（截图）：卡片行 → **一大片空白（~150px）** → 页签 → 表单散排 → 工具栏与表格两张皮。
   问题不是配色，是**页面纵向节奏断了**：卡片行下面挂着一个"固定高度的容器"，
   页签被推到半屏，表单和表格又各自漂着。
   这里做四件事（全部靠容器关系定位，不搬任何 DOM）：
     ① **掐掉空白带**：`.pd-cards` 的**直接父容器**一律 `height:auto / min-height:0 / padding-bottom:0`，
        并把它与下一个兄弟之间的外边距归零 —— 页签紧跟在卡片行下面；
     ② **表单成卡**：表单区域做成白卡（12px 圆角 + 发丝线 + 12/14 内边距），
        与卡片行、表格并列成"三段式"，不再散在空白里；
     ③ **工具栏 + 台账表合并成一张卡**：工具栏当表头（去掉两者之间的缝），
        表格容器圆角只保下沿 —— 视觉上"一条台账"而不是"两片纸"；
     ④ **三段之间统一 12px 间距**、页面上下留 8px —— 不再有大段空档。
   --------------------------------------------------------------------------- */
/* ① 掐空白带 */
html[data-paper] body #view :is(div, section):has(> .pd-cards) {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 6px !important;
}
html[data-paper] body #view :is(div, section):has(> .pd-cards) + * { margin-top: 0 !important; }
/* ② 表单成卡（这一套页里，表单区就是紧邻表格上方的那块） */
html[data-paper] body #view:has(.pd-cards) form,
html[data-paper] body #view:has(.pd-cards) .pd-form {
  background: var(--sk-card) !important;
  border: 1px solid var(--sk-line) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  margin-bottom: 12px !important;
}
/* ③ 台账表 + 工具栏合成一张卡 */
html[data-paper] body #view:has(.pd-cards) .pd-table-wrap {
  border: 1px solid var(--sk-line) !important;
  border-radius: 12px !important;
  background: var(--sk-card) !important;
  overflow: hidden !important;
}
html[data-paper] body #view:has(.pd-cards) :has(+ .pd-table-wrap) {
  border: 1px solid var(--sk-line) !important;
  border-bottom: 0 !important;
  border-radius: 12px 12px 0 0 !important;
  background: var(--sk-soft) !important;
  padding: 8px 12px !important;
  margin-bottom: 0 !important;
}
html[data-paper] body #view:has(.pd-cards) .pd-table-wrap { margin-top: 0 !important; }
/* ④ 三段统一节奏 */
html[data-paper] body #view:has(.pd-cards) { display: flex !important; flex-direction: column !important; gap: 12px !important; }
html[data-paper] body #view:has(.pd-cards) > * { margin-top: 0 !important; }
/* 收集板小图的孔：青绿族（与样品蓝分开；具体色值来自 --upw-collect 系列，便于以后换配色） */
html[data-paper] body #view .pmap .pw.fill { background: var(--upw-sample-2) !important; }
html[data-paper] body #view .pmap .pw:not(.fill) { background: var(--sk-line-2) !important; }
/* ③ 逐针清单：隔行底色统一成极淡蓝 */
html[data-paper] body #view :is(.up-list, .pp-list, .pin-list) tbody tr:nth-child(odd) > td,
html[data-paper] body #view :is(.up-list, .pp-list, .pin-list) tr:nth-child(odd) > td {
  background: #F6FAFE !important;
}
html[data-paper] body #view :is(.up-list, .pp-list, .pin-list) tbody tr:hover > td,
html[data-paper] body #view :is(.up-list, .pp-list, .pin-list) tr:hover > td {
  background: #EDF4FC !important;
}


/* ---------------------------------------------------------------------------
   58. 「2767 上机文件」美化落地（2026-10-09 续 · 用户："页面美化按你的建议来做"）
   ---------------------------------------------------------------------------
   结构（`workbench.css` 里查到）：大板 = `.modal .pi-plate-grid > .pi-w`，
     空孔 `.pi-w`、用到的孔 `.pi-w.on`，修饰类 `.mod-end / .mod-star / .wash`；
     卡头 = `.modal .pi-plate-h`（b＝标题 / .tag＝板号胶囊 / .sub＝右侧用量）。
   ① 用到的孔加描边（同色深一档，1.5px）+ 空孔淡蓝细圈 ⇒ 一眼看清"哪些孔要打"；
   ② 三栏卡头统一：图标砖 + 中文标题 + 板号胶囊 + 右侧用量，圆角/描边/字号全站一套；
   ③ 板卡（.pi-plate）统一成标准卡面（12px 圆角 + 发丝线 + 极轻投影）。
   ⚠ 孔色是**行内 style**（见 §58 上一条改的 production.js），这里只用 box-shadow 描边，
     不碰 background，避免再把颜色压掉。
   --------------------------------------------------------------------------- */
/* ① 用到的孔：按角色给同色描边（空孔只留一圈淡蓝） */
html[data-paper] body .modal .pi-plate-grid .pi-w {
  box-shadow: inset 0 0 0 1px rgba(26, 123, 217, .18) !important;
}
html[data-paper] body .modal .pi-plate-grid .pi-w.on {
  box-shadow: inset 0 0 0 1.5px rgba(15, 99, 180, .55), 0 1px 2px rgba(12, 58, 110, .16) !important;
}
html[data-paper] body .modal .pi-plate-grid .pi-w.on.mod-end {
  box-shadow: inset 0 0 0 1.5px rgba(106, 90, 122, .62), 0 1px 2px rgba(12, 58, 110, .16) !important;
}
html[data-paper] body .modal .pi-plate-grid .pi-w.on.mod-star {
  box-shadow: inset 0 0 0 1.5px rgba(178, 69, 63, .62), 0 1px 2px rgba(12, 58, 110, .16) !important;
}
html[data-paper] body .modal .pi-plate-grid .pi-w.on.wash {
  box-shadow: inset 0 0 0 1.5px rgba(201, 118, 26, .62), 0 1px 2px rgba(12, 58, 110, .16) !important;
}
/* ② 三栏卡头统一 */
html[data-paper] body .modal .pi-plate-h {
  gap: 8px !important; margin-bottom: 10px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--sk-line-2) !important;
}
html[data-paper] body .modal .pi-plate-h b {
  font-size: 12.5px !important; font-weight: 800 !important; letter-spacing: .01em !important;
  color: #0F63B4 !important;
}
html[data-paper] body .modal .pi-plate-h b::before {
  content: "" !important; display: inline-block !important;
  width: 3px !important; height: 11px !important; margin-right: 6px !important;
  border-radius: 2px !important; vertical-align: -1px !important;
  background: linear-gradient(180deg, #1A7BD9, #0F63B4) !important;
}
html[data-paper] body .modal .pi-plate-h .tag {
  font-size: 11px !important; font-weight: 800 !important;
  padding: 2px 8px !important; border-radius: 999px !important;
  background: #EAF3FD !important; color: #0F63B4 !important;
  border: 1px solid var(--sk-line) !important;
}
html[data-paper] body .modal .pi-plate-h .sub {
  margin-left: auto !important; font-size: 11px !important; font-weight: 700 !important;
  color: var(--sk-ink-3) !important;
}
/* ③ 板卡统一卡面 */
html[data-paper] body .modal .pi-plate {
  border-radius: 12px !important;
  border: 1px solid var(--sk-line) !important;
  background: var(--sk-card) !important;
  box-shadow: 0 1px 2px rgba(20, 40, 70, .05) !important;
}
/* ③ 兜底：真放不下时允许整页滚（宁可滚，也不把图表压扁） */
html[data-paper] #view:has(.bp-home) { overflow-y: auto !important; }
html[data-paper] #view:has(.bp-home) > .view-fade { min-height: 0 !important; }


/* ===========================================================================
   65. 「线边物料」整页版式重做（2026-10-09 续 · 用户："重新布局设计，别再敷衍我"）
   ---------------------------------------------------------------------------
   为什么前四轮（§60 / §62 / §63 / §64）都没成：那四轮改的都是**旧结构的皮**，
   而旧结构是「三张大卡 → 空白工具条 → 正文」三块并列挂在 `#pdContent` 下。
   `#pdContent` 是 flex 列，skin-paper §30 给它挂了"最后一块吃剩余高度"，
   但那组规则写宽了 —— `#view > .pd-wrap > div > * { flex:1 1 auto !important }`
   命中**每一个**子块，于是每块都去平分剩余高度（实测：卡片行 92→136px、
   页签工具条 38→104px），补丁压住一处又冒出另一处 ⇒ 永远还是"大卡 + 空白带"。

   这一轮换骨架（production.js 的 `_paintMaterial`），页面只剩三层：
     .lm-head  页头（标题 + 口径一行 | 右侧 KPI 小片）
     .lm-tabs  页签条
     .lm-body  正文（吃满剩余高度，内部自己排）
   本节做的事：
     ① 把 .lm-head / .lm-tabs 钉成 `flex:0 0 auto`（特异性高于 §30 那条），
        只让 .lm-body 吃高度 ⇒ 空白带从"根"上不会再出现；
     ② 页头 KPI 是**小片**（34px 高），不再是三张 92px 的空卡；
     ③ 登记页 = 表单卡（标签在上、控件在下，4 列，3 行排完 11 个字段）+ 台账卡
        （卡头两行 + 表格自己滚）⇒ 竖向节奏连续，没有"两张皮"；
     ④ 所有选择器都带 `#view #pdContent`（两个 id）——比 §60/§62 的 `#view:has(...)`
        高一档，所以能稳稳压过那几节的 `!important`，不需要靠顺序赌运气。
   ⚠ §62 的 `[class*="kpi"] { min-height:92px }` 会误伤本节的小片，故 ② 里显式归零。
   =========================================================================== */
/* ① 三层骨架：页头 / 页签不吃高度，正文吃满 */
html[data-paper] body #view #pdContent > .lm-head,
html[data-paper] body #view #pdContent > .lm-tabs {
  flex: 0 0 auto !important;
  min-height: 0 !important;
}
/* 三段之间的呼吸：页头 → 10px → 页签 → 12px → 正文（#pdContent 本身没有 gap，靠这两条） */
html[data-paper] body #view #pdContent > .lm-head { margin: 0 0 10px !important; }
html[data-paper] body #view #pdContent > .lm-tabs { margin: 0 0 12px !important; }
html[data-paper] body #view #pdContent > .lm-body {
  /* ⚠ `flex-basis` 必须是 **0**（不能是 auto）：
     §30 还有一条 `#view > .pd-wrap > *:last-child > * { flex-shrink: 0 !important }`
     命中 .lm-body（它是 #pdContent 的直接子块）。basis:auto 时它按内容高度起步、
     又不许收缩 ⇒ 清单页的正文被撑到 28090px，再被 `#view { overflow:hidden }` 整段切掉
     （实测踩到：583 行物料只能看到前 20 行，滚不动）。
     basis:0 + grow:1 ⇒ 高度**只由剩余空间决定**，与内容多长无关，再配 overflow:auto 就是
     一个规规矩矩的滚动区。 */
  flex: 1 1 0 !important;
  min-height: 0 !important;
  flex-shrink: 1 !important;
  display: flex !important; flex-direction: column !important; gap: 12px !important;
  overflow: auto !important;
  padding-bottom: 2px !important;
}
/* 登记页：表单钉在上面，台账卡吃满、只有表格自己滚 */
html[data-paper] body #view #pdContent > .lm-body.is-dock { overflow: hidden !important; }
html[data-paper] body #view #pdContent > .lm-body.is-dock > .lm-dock-wrap {
  flex: 1 1 0 !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important; gap: 12px !important;
}
/* 清单页 / 库存页：**筛选行钉住 + 表格自己滚**（与登记页台账同一套体验）
   —— 一排筛选（搜索框 + 线边区域片）不该跟着 583 行一起滚走；表格标题行也要一直在。
   做法：正文 → 内容包 → [筛选行 flex:0 0 auto] [表格 flex:1 1 0 + overflow:auto]，
   表格容器同时是滚动口，`.pd-table th{position:sticky}` 才有意义（sticky 只认最近的滚动口）。 */
html[data-paper] body #view #pdContent > .lm-body:not(.is-dock) > div {
  flex: 1 1 0 !important; min-height: 0 !important;
  display: flex !important; flex-direction: column !important; gap: 10px !important;
}
html[data-paper] body #view #pdContent > .lm-body:not(.is-dock) > div > .pd-toolbar {
  flex: 0 0 auto !important; margin-bottom: 0 !important;
}
html[data-paper] body #view #pdContent > .lm-body:not(.is-dock) .pd-table-wrap {
  flex: 1 1 0 !important; min-height: 140px !important;
  max-height: none !important;
  overflow: auto !important;
}

/* ② 页头：标题 + 一句口径 | 右侧 KPI 小片 */
html[data-paper] body #view #pdContent > .lm-head {
  display: flex !important; align-items: center !important; gap: 16px !important;
  padding: 10px 16px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 14px !important;
  background: var(--sk-card) !important;
  box-shadow: 0 1px 2px rgba(20, 40, 70, .05) !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-head-t { min-width: 0 !important; }
html[data-paper] body #view #pdContent > .lm-head .lm-head-t h3 {
  margin: 0 !important; font-size: 16px !important; font-weight: 800 !important;
  color: #14304F !important; letter-spacing: .2px !important; line-height: 1.2 !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-head-t p {
  margin: 4px 0 0 !important; font-size: 11.5px !important; font-weight: 600 !important;
  color: #7A8A9B !important; line-height: 1.5 !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-kpis {
  margin-left: auto !important; flex: 0 0 auto !important;
  display: flex !important; align-items: center !important; gap: 8px !important;
  min-height: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-kpi {
  display: inline-flex !important; align-items: center !important; gap: 7px !important;
  height: 34px !important; min-height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 10px !important;
  background: #F7FAFE !important; box-shadow: none !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-kpi i {
  width: 7px !important; height: 7px !important; border-radius: 50% !important; flex: 0 0 auto !important;
  background: #0F63B4 !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-kpi span {
  font-size: 11.5px !important; font-weight: 700 !important; color: #5A6B7C !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-kpi b {
  font-size: 17px !important; font-weight: 800 !important; color: #14304F !important;
  font-variant-numeric: tabular-nums !important; line-height: 1 !important;
}
html[data-paper] body #view #pdContent > .lm-head .lm-k-ok i { background: #0A7043 !important; }
html[data-paper] body #view #pdContent > .lm-head .lm-k-ok { background: #F4FBF7 !important; border-color: #D3EADD !important; }
html[data-paper] body #view #pdContent > .lm-head .lm-k-warn i { background: #B45309 !important; }
html[data-paper] body #view #pdContent > .lm-head .lm-k-warn { background: #FFFBF3 !important; border-color: #F0E2C6 !important; }
html[data-paper] body #view #pdContent > .lm-head .lm-k-danger i { background: #B3261E !important; }
html[data-paper] body #view #pdContent > .lm-head .lm-k-danger { background: #FFF7F6 !important; border-color: #F2D9D5 !important; }

/* ③ 页签条：淡蓝底轨道 + 白底选中片（比"三个白胶囊漂在空白里"更像一条页签） */
html[data-paper] body #view #pdContent > .lm-tabs { display: flex !important; align-items: center !important; gap: 10px !important; }
html[data-paper] body #view #pdContent > .lm-tabs .pd-inline-seg {
  display: inline-flex !important; gap: 3px !important;
  padding: 3px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 11px !important;
  background: #EAF1FA !important; box-shadow: none !important;
}
html[data-paper] body #view #pdContent > .lm-tabs .pd-inline-seg button {
  height: 30px !important; min-height: 30px !important;
  padding: 0 16px !important;
  border: 0 !important; border-radius: 8px !important;
  background: transparent !important; color: #4A6076 !important;
  font-size: 12.5px !important; font-weight: 700 !important;
  box-shadow: none !important; cursor: pointer !important;
}
html[data-paper] body #view #pdContent > .lm-tabs .pd-inline-seg button:hover { color: #0F63B4 !important; }
html[data-paper] body #view #pdContent > .lm-tabs .pd-inline-seg button.on {
  background: #FFFFFF !important; color: #0F63B4 !important;
  box-shadow: 0 1px 3px rgba(16, 58, 110, .20) !important;
}

/* ④ 卡片底（表单 / 台账共用） */
html[data-paper] body #view #pdContent .lm-card {
  border: 1px solid var(--sk-line) !important; border-radius: 14px !important;
  background: var(--sk-card) !important;
  box-shadow: 0 1px 2px rgba(20, 40, 70, .05) !important;
}

/* ⑤ 登记表单：标签在上、控件在下的 4 列小格 */
html[data-paper] body #view #pdContent .lm-form {
  flex: 0 0 auto !important;
  overflow: hidden !important;
}
html[data-paper] body #view #pdContent .lm-form-h {
  display: flex !important; align-items: center !important; gap: 12px !important;
  padding: 9px 14px !important;
  border-bottom: 1px solid var(--sk-line-2) !important;
  background: linear-gradient(180deg, #F7FAFE, #FFFFFF) !important;
}
html[data-paper] body #view #pdContent .lm-form-t {
  font-size: 13.5px !important; font-weight: 800 !important; color: #14304F !important;
}
html[data-paper] body #view #pdContent .lm-form-t i {
  font-style: normal !important; margin-left: 10px !important;
  font-size: 11.5px !important; font-weight: 600 !important; color: #7A8A9B !important;
}
html[data-paper] body #view #pdContent .lm-form-t i b { color: #0F63B4 !important; font-weight: 800 !important; }
html[data-paper] body #view #pdContent .lm-submit {
  margin-left: auto !important; flex: 0 0 auto !important;
  height: 34px !important; min-height: 34px !important;
  padding: 0 20px !important;
  border: 0 !important; border-radius: 9px !important;
  background: linear-gradient(135deg, #1A7BD9, #0F63B4) !important;
  color: #FFFFFF !important; font-size: 13px !important; font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: 0 6px 16px -8px rgba(15, 99, 180, .85) !important;
}
html[data-paper] body #view #pdContent .lm-submit:hover { filter: brightness(1.07) !important; }
html[data-paper] body #view #pdContent .lm-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px 12px !important;
  padding: 12px 14px !important;
}
html[data-paper] body #view #pdContent .lm-f {
  display: flex !important; flex-direction: column !important; gap: 5px !important;
  min-width: 0 !important;
}
html[data-paper] body #view #pdContent .lm-f > :is(input, select) { width: 100% !important; }
html[data-paper] body #view #pdContent .lm-f-k {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  font-size: 11.5px !important; font-weight: 700 !important; color: #6B7C8F !important;
  letter-spacing: .2px !important; line-height: 1.2 !important;
}
html[data-paper] body #view #pdContent .lm-n {
  width: 16px !important; height: 16px !important; flex: 0 0 auto !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  border-radius: 50% !important;
  background: #EAF3FD !important; color: #0F63B4 !important;
  font-size: 10px !important; font-weight: 800 !important; font-style: normal !important;
}
html[data-paper] body #view #pdContent .lm-n.done { background: #0A7043 !important; color: #FFFFFF !important; }
/* "下一步点哪个"：整格高亮（保持 §前一轮 的引导，但不靠整块黄底） */
html[data-paper] body #view #pdContent .lm-f.is-next .lm-f-k { color: #B45309 !important; }
html[data-paper] body #view #pdContent .lm-f.is-next .lm-n { background: #B45309 !important; color: #FFFFFF !important; }
html[data-paper] body #view #pdContent .lm-f.is-next > :is(input, select) {
  border-color: #E6B87A !important;
  box-shadow: 0 0 0 3px rgba(217, 119, 6, .12) !important;
  background: #FFFCF6 !important;
}
/* 只读格：淡底 + 虚线，一眼区分"系统带出来的" */
html[data-paper] body #view #pdContent .lm-ro {
  display: flex !important; align-items: center !important;
  height: 32px !important; min-height: 32px !important;
  padding: 0 10px !important;
  border: 1px dashed #D8E5F3 !important; border-radius: 8px !important;
  background: #F7FAFE !important; color: #5A6B7C !important;
  font-size: 12.5px !important; font-weight: 600 !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] body #view #pdContent .lm-span2 { grid-column: span 2 !important; }
html[data-paper] body #view #pdContent .lm-form-f {
  padding: 0 14px 12px !important;
  font-size: 11.5px !important; font-weight: 600 !important; color: #7A8A9B !important;
}

/* 领用登记新工作区：物料可搜索，信息按“选物料→数量→出库信息”分区。 */
html[data-paper] body #view #pdContent .lm-register{overflow:visible!important;border-radius:14px!important;background:linear-gradient(145deg,#F6FAFF 0%,#FFFFFF 52%,#F8FBFF 100%)!important}
html[data-paper] body #view #pdContent .lm-register-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;padding:15px 18px!important;border-bottom:1px solid #E2EBF5!important;background:linear-gradient(100deg,#F5F9FF,#FFFFFF 72%)!important}
html[data-paper] body #view #pdContent .lm-register-eyebrow{display:block!important;margin-bottom:3px!important;color:#4382C4!important;font-size:9px!important;font-weight:800!important;letter-spacing:1.15px!important}
html[data-paper] body #view #pdContent .lm-register-head h3{margin:0!important;color:#173552!important;font-size:17px!important;line-height:1.3!important;font-weight:800!important}
html[data-paper] body #view #pdContent .lm-register-head p{margin:4px 0 0!important;color:#75869A!important;font-size:11.5px!important}
html[data-paper] body #view #pdContent .lm-register-head .lm-submit{margin:0!important;min-width:154px!important;height:38px!important;border-radius:9px!important}
html[data-paper] body #view #pdContent .lm-register-head .lm-submit span{padding-left:10px!important;font-size:17px!important;vertical-align:-1px!important}
html[data-paper] body #view #pdContent .lm-register-body{display:grid!important;grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr)!important;gap:12px!important;padding:13px 15px 12px!important}
html[data-paper] body #view #pdContent .lm-register-section{min-width:0!important;padding:13px 14px!important;border:1px solid #E2EAF3!important;border-radius:11px!important;background:rgba(255,255,255,.92)!important;box-shadow:0 2px 8px rgba(33,69,108,.035)!important}
html[data-paper] body #view #pdContent .lm-register-source{grid-column:1/-1!important}
html[data-paper] body #view #pdContent .lm-section-title{display:flex!important;align-items:center!important;gap:9px!important;margin-bottom:12px!important}
html[data-paper] body #view #pdContent .lm-section-title>i{display:flex!important;align-items:center!important;justify-content:center!important;width:25px!important;height:25px!important;border-radius:8px!important;background:#EAF3FE!important;color:#176BB7!important;font-size:10px!important;font-style:normal!important;font-weight:900!important}
html[data-paper] body #view #pdContent .lm-section-title b{display:block!important;color:#203B56!important;font-size:12.5px!important;font-weight:800!important}
html[data-paper] body #view #pdContent .lm-section-title small{display:block!important;margin-top:2px!important;color:#8190A2!important;font-size:10px!important}
html[data-paper] body #view #pdContent .lm-register-pick-grid{display:grid!important;grid-template-columns:minmax(145px,.72fr) minmax(250px,1.55fr)!important;gap:11px!important;align-items:start!important}
html[data-paper] body #view #pdContent .lm-field{display:flex!important;flex-direction:column!important;gap:6px!important;min-width:0!important;color:#667B91!important;font-size:10.5px!important;font-weight:700!important}
html[data-paper] body #view #pdContent .lm-field>span{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;min-height:14px!important}
html[data-paper] body #view #pdContent .lm-field em{color:#8294A8!important;font-size:9.5px!important;font-style:normal!important;font-weight:600!important}
html[data-paper] body #view #pdContent .lm-field :is(input,select){box-sizing:border-box!important;width:100%!important;height:36px!important;min-height:36px!important;padding:0 10px!important;border:1px solid #D6E2EF!important;border-radius:8px!important;background:#FFFFFF!important;color:#263D55!important;font-size:12px!important;font-weight:600!important;outline:none!important}
html[data-paper] body #view #pdContent .lm-field :is(input,select):focus{border-color:#6EA8E5!important;box-shadow:0 0 0 3px rgba(61,133,205,.12)!important}
html[data-paper] body #view #pdContent .lm-field input[readonly]{background:#F3F7FB!important;color:#60758B!important;border-style:dashed!important;cursor:default!important}
html[data-paper] body #view #pdContent .lm-field :is(input,select):disabled{background:#F3F6F9!important;color:#929EAA!important}
html[data-paper] body #view #pdContent .lm-material-control{position:relative!important;min-width:0!important}
html[data-paper] body #view #pdContent #pdLrMatSearch{padding-right:34px!important}
html[data-paper] body #view #pdContent .lm-search-glyph{position:absolute!important;right:11px!important;top:8px!important;color:#7993AD!important;font-size:17px!important;pointer-events:none!important}
html[data-paper] body #view #pdContent .lm-mat-options{position:absolute!important;top:calc(100% + 5px)!important;left:0!important;right:0!important;z-index:90!important;max-height:255px!important;overflow:auto!important;padding:4px!important;border:1px solid #D8E4F0!important;border-radius:10px!important;background:#FFFFFF!important;box-shadow:0 12px 28px rgba(28,55,86,.16)!important}
html[data-paper] body #view #pdContent .lm-mat-options[hidden]{display:none!important}
html[data-paper] body #view #pdContent .lm-mat-option{display:grid!important;grid-template-columns:94px minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:2px 9px!important;width:100%!important;padding:8px 9px!important;border:0!important;border-bottom:1px solid #EEF2F7!important;border-radius:6px!important;background:#FFFFFF!important;text-align:left!important;cursor:pointer!important}
html[data-paper] body #view #pdContent .lm-mat-option[hidden],html[data-paper] body #view #pdContent .lm-mat-empty[hidden]{display:none!important}
html[data-paper] body #view #pdContent .lm-mat-option:hover{background:#F1F7FE!important}
html[data-paper] body #view #pdContent .lm-mat-code{grid-row:1/3!important;align-self:center!important;color:#1868AD!important;font-family:ui-monospace,Consolas,monospace!important;font-size:10.5px!important;font-weight:800!important}
html[data-paper] body #view #pdContent .lm-mat-name{overflow:hidden!important;color:#273E57!important;font-size:11.5px!important;font-weight:750!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-mat-option small{color:#8493A4!important;font-size:9.5px!important;font-weight:500!important}
html[data-paper] body #view #pdContent .lm-mat-empty{padding:14px 8px!important;color:#8796A7!important;font-size:11px!important;text-align:center!important}
html[data-paper] body #view #pdContent .lm-selected-material{display:flex!important;align-items:center!important;gap:9px!important;margin-top:10px!important;padding:9px 10px!important;border:1px solid #D8EBDD!important;border-radius:9px!important;background:#F4FBF6!important}
html[data-paper] body #view #pdContent .lm-selected-mark{display:flex!important;align-items:center!important;justify-content:center!important;width:21px!important;height:21px!important;border-radius:50%!important;background:#E1F3E7!important;color:#13824D!important;font-size:12px!important;font-weight:900!important}
html[data-paper] body #view #pdContent .lm-selected-material div{display:flex!important;flex-direction:column!important;gap:2px!important;min-width:0!important}
html[data-paper] body #view #pdContent .lm-selected-material small{color:#7C9586!important;font-size:9px!important}
html[data-paper] body #view #pdContent .lm-selected-material b{overflow:hidden!important;color:#28553B!important;font-size:11px!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-selected-brand{margin-left:auto!important;color:#718A7A!important;font-size:10px!important}
html[data-paper] body #view #pdContent .lm-pick-hint{margin-top:10px!important;padding:10px!important;border:1px dashed #DCE6F0!important;border-radius:8px!important;background:#F8FAFC!important;color:#8392A2!important;font-size:10.5px!important}
html[data-paper] body #view #pdContent .lm-qty-grid{display:grid!important;grid-template-columns:minmax(0,1.2fr) minmax(130px,.8fr)!important;gap:10px!important}
html[data-paper] body #view #pdContent .lm-qty-field>span em{color:#B45309!important}
html[data-paper] body #view #pdContent .lm-qty-control{position:relative!important}
html[data-paper] body #view #pdContent .lm-qty-control input{padding-right:48px!important;font-size:16px!important;font-weight:800!important;font-variant-numeric:tabular-nums!important}
html[data-paper] body #view #pdContent .lm-qty-control b{position:absolute!important;right:10px!important;top:11px!important;color:#698198!important;font-size:10px!important}
html[data-paper] body #view #pdContent .lm-auto-meta{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:10px!important}
html[data-paper] body #view #pdContent .lm-auto-meta>div{display:flex!important;flex-direction:column!important;gap:4px!important;padding:8px 9px!important;border-radius:8px!important;background:#F4F7FA!important}
html[data-paper] body #view #pdContent .lm-auto-meta small{color:#8191A2!important;font-size:9.5px!important}
html[data-paper] body #view #pdContent .lm-auto-meta b{overflow:hidden!important;color:#435D76!important;font-size:11px!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-source-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px 12px!important}
html[data-paper] body #view #pdContent .lm-remark-field{grid-column:span 2!important}
html[data-paper] body #view #pdContent .lm-register-foot{display:flex!important;align-items:center!important;gap:8px!important;padding:0 16px 12px!important;color:#76899D!important;font-size:10px!important}
html[data-paper] body #view #pdContent .lm-foot-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:16px!important;height:16px!important;border-radius:50%!important;background:#EAF3FD!important;color:#3075B5!important;font-size:10px!important;font-weight:800!important}
html[data-paper] body #view #pdContent .lm-required-note{margin-left:auto!important;color:#8998A8!important}
@media(max-width:1050px){html[data-paper] body #view #pdContent .lm-register-body{grid-template-columns:1fr!important}html[data-paper] body #view #pdContent .lm-register-source{grid-column:auto!important}html[data-paper] body #view #pdContent .lm-source-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* 领用登记采用独立向导弹层：台账常驻主视图，填写时一次只显示当前步骤。 */
html[data-paper] body #view #pdContent .lm-register-launch{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;min-height:62px!important;margin:0 0 10px!important;padding:10px 16px!important;border:1px solid #DCE7F3!important;border-radius:11px!important;background:linear-gradient(100deg,#F5F9FE,#FFFFFF 70%)!important}
html[data-paper] body #view #pdContent .lm-register-launch>div{display:flex!important;flex-direction:column!important;gap:3px!important;min-width:0!important}
html[data-paper] body #view #pdContent .lm-register-launch b{color:#203B56!important;font-size:13px!important;font-weight:800!important}
html[data-paper] body #view #pdContent .lm-register-launch span{color:#8292A4!important;font-size:10.5px!important}
html[data-paper] body #view #pdContent .lm-register-launch .lm-submit{flex:none!important;min-width:132px!important;height:36px!important;border-radius:8px!important}
html[data-paper] body #view #pdContent .lm-register-overlay{position:fixed!important;inset:0!important;z-index:10050!important;display:flex!important;justify-content:flex-end!important;background:rgba(16,35,58,.38)!important;backdrop-filter:blur(2px)!important}
html[data-paper] body #view #pdContent .lm-register-dialog{display:flex!important;flex-direction:column!important;width:min(620px,96vw)!important;height:100%!important;max-height:100vh!important;background:#F7FAFD!important;box-shadow:-18px 0 48px rgba(18,41,68,.2)!important;animation:lmDrawerIn .18s ease-out both!important}
@keyframes lmDrawerIn{from{transform:translateX(22px);opacity:.7}to{transform:translateX(0);opacity:1}}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register{display:flex!important;flex:1!important;flex-direction:column!important;min-height:0!important;max-height:100%!important;overflow:hidden!important;border:0!important;border-radius:0!important;background:#F7FAFD!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-head{flex:none!important;padding:18px 20px 14px!important}
html[data-paper] body #view #pdContent .lm-register-close{display:flex!important;align-items:center!important;justify-content:center!important;flex:none!important;width:34px!important;height:34px!important;border:1px solid #DCE5EE!important;border-radius:9px!important;background:#FFFFFF!important;color:#61758A!important;font-size:22px!important;line-height:1!important;cursor:pointer!important}
html[data-paper] body #view #pdContent .lm-register-close:hover{background:#EEF4FA!important;color:#244767!important}
html[data-paper] body #view #pdContent .lm-stepper{display:flex!important;align-items:center!important;gap:8px!important;flex:none!important;padding:12px 20px!important;border-bottom:1px solid #E7EDF4!important;background:#FFFFFF!important}
html[data-paper] body #view #pdContent .lm-stepper-item{display:flex!important;align-items:center!important;gap:7px!important;padding:0!important;border:0!important;background:transparent!important;color:#8A99A9!important;font-size:10.5px!important;font-weight:700!important;white-space:nowrap!important;cursor:pointer!important}
html[data-paper] body #view #pdContent .lm-stepper-item i{display:flex!important;align-items:center!important;justify-content:center!important;width:22px!important;height:22px!important;border-radius:50%!important;background:#EDF1F5!important;color:#77899C!important;font-size:9px!important;font-style:normal!important;font-weight:900!important}
html[data-paper] body #view #pdContent .lm-stepper-item.active{color:#176BB7!important}
html[data-paper] body #view #pdContent .lm-stepper-item.active i,html[data-paper] body #view #pdContent .lm-stepper-item.complete i{background:#E6F1FD!important;color:#176BB7!important}
html[data-paper] body #view #pdContent .lm-stepper-line{height:1px!important;flex:1!important;min-width:10px!important;background:#DDE6EF!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-body{display:block!important;flex:1!important;min-height:0!important;overflow:auto!important;padding:16px 20px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-wizard-step{display:none!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-wizard-step.active{display:block!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-section{padding:15px!important;background:#FFFFFF!important;box-shadow:0 2px 10px rgba(34,64,96,.045)!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-source{grid-column:auto!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-pick-grid{grid-template-columns:1fr!important;gap:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-source-grid{grid-template-columns:1fr 1fr!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-remark-field{grid-column:1/-1!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-foot{display:flex!important;flex:none!important;justify-content:space-between!important;gap:12px!important;padding:12px 20px!important;border-top:1px solid #E5ECF3!important;background:#FFFFFF!important}
html[data-paper] body #view #pdContent .lm-step-hint{color:#8091A3!important;font-size:10px!important}
html[data-paper] body #view #pdContent .lm-wizard-actions{display:flex!important;align-items:center!important;gap:8px!important;margin-left:auto!important}
html[data-paper] body #view #pdContent .lm-wizard-actions .lm-btn,html[data-paper] body #view #pdContent .lm-wizard-actions .lm-submit{min-width:92px!important;height:34px!important;padding:0 13px!important;border-radius:8px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-options{max-height:min(310px,42vh)!important}
@media(max-width:700px){html[data-paper] body #view #pdContent .lm-register-dialog{width:100vw!important}html[data-paper] body #view #pdContent .lm-register-overlay .lm-source-grid{grid-template-columns:1fr!important}html[data-paper] body #view #pdContent .lm-stepper{gap:5px!important;padding:10px 14px!important}html[data-paper] body #view #pdContent .lm-stepper-item{gap:4px!important;font-size:9px!important}html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-head,html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-body,html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-foot{padding-left:14px!important;padding-right:14px!important}}

/* ⑥ 台账卡：卡头（标题 + 计数片 + 刷新）· 工具行 · 表格自己滚 */
html[data-paper] body #view #pdContent .lm-ledger {
  flex: 1 1 auto !important; min-height: 220px !important;
  display: flex !important; flex-direction: column !important;
  overflow: hidden !important;
}
html[data-paper] body #view #pdContent .lm-ledger-h {
  display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 9px 14px !important;
  border-bottom: 1px solid var(--sk-line-2) !important;
  background: linear-gradient(180deg, #F7FAFE, #FFFFFF) !important;
}
html[data-paper] body #view #pdContent .lm-ledger-t {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  font-size: 13.5px !important; font-weight: 800 !important; color: #14304F !important;
}
html[data-paper] body #view #pdContent .lm-ledger-t em {
  font-style: normal !important; font-size: 11.5px !important; font-weight: 600 !important; color: #7A8A9B !important;
}
html[data-paper] body #view #pdContent .lm-ledger-t em b { color: #0F63B4 !important; font-weight: 800 !important; }
html[data-paper] body #view #pdContent .lm-chip {
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  height: 21px !important; min-height: 21px !important;
  padding: 0 9px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 999px !important;
  font-size: 11px !important; font-weight: 700 !important;
}
html[data-paper] body #view #pdContent .lm-chip b { font-weight: 800 !important; }
html[data-paper] body #view #pdContent .lm-chip-ok { background: #EAF6F0 !important; border-color: #CBE7D9 !important; color: #0A7043 !important; }
html[data-paper] body #view #pdContent .lm-chip-warn { background: #FFF7EA !important; border-color: #F3E0BE !important; color: #B45309 !important; }
html[data-paper] body #view #pdContent .lm-chip-danger { background: #FDECEA !important; border-color: #F5D2CE !important; color: #B3261E !important; }
html[data-paper] body #view #pdContent .lm-ledger-h > .lm-btn { margin-left: auto !important; }
html[data-paper] body #view #pdContent .lm-btn {
  height: 30px !important; min-height: 30px !important;
  padding: 0 14px !important;
  border: 1px solid var(--sk-line) !important; border-radius: 9px !important;
  background: #FFFFFF !important; color: #0F63B4 !important;
  font-size: 12px !important; font-weight: 700 !important;
  cursor: pointer !important; box-shadow: none !important;
}
html[data-paper] body #view #pdContent .lm-btn:hover { background: #F2F7FD !important; border-color: #9CC3E8 !important; }
html[data-paper] body #view #pdContent .lm-btn-pri {
  border-color: transparent !important;
  background: linear-gradient(135deg, #1A7BD9, #0F63B4) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 12px -6px rgba(15, 99, 180, .8) !important;
}
/* 导入主按钮保持蓝底白字，鼠标按下/键盘聚焦时不被全站 button 状态洗成白色。 */
html[data-paper] body #view #pdContent .lm-ledger-tools .lm-btn-pri:hover,
html[data-paper] body #view #pdContent .lm-ledger-tools .lm-btn-pri:active,
html[data-paper] body #view #pdContent .lm-ledger-tools .lm-btn-pri:focus,
html[data-paper] body #view #pdContent .lm-ledger-tools .lm-btn-pri:focus-visible {
  background: linear-gradient(135deg, #1A7BD9, #0F63B4) !important;
  border-color: #0F63B4 !important; color: #FFFFFF !important; filter: none !important;
  outline: 2px solid rgba(15, 99, 180, .24) !important; outline-offset: 2px !important;
}
html[data-paper] body #view #pdContent .lm-ledger-h .lm-btn-archive {
  margin-left: auto !important; border-color: #A9D9C1 !important;
  background: #EAF6F0 !important; color: #0A7043 !important; font-weight: 800 !important;
}
html[data-paper] body #view #pdContent .lm-ledger-h .lm-btn-archive:hover,
html[data-paper] body #view #pdContent .lm-ledger-h .lm-btn-archive:focus,
html[data-paper] body #view #pdContent .lm-ledger-h .lm-btn-archive:active {
  background: #DDF1E7 !important; border-color: #79BE99 !important; color: #075A35 !important;
}
html[data-paper] body #view #pdContent .lm-ledger-h .lm-archive-done {
  margin-left: auto !important; padding: 5px 10px !important; border: 1px solid #CBE7D9 !important;
  border-radius: 999px !important; background: #EAF6F0 !important; color: #0A7043 !important;
  font-size: 11px !important; font-weight: 800 !important;
}
html[data-paper] body #view #pdContent .lm-ledger td .pd-tag.pd-badge-done {
  background: #EAF6F0 !important; border: 1px solid #CBE7D9 !important; color: #0A7043 !important;
}
html[data-paper] body #view #pdContent .lm-ledger-switch{display:inline-flex!important;align-items:center!important;gap:3px!important;padding:3px!important;border:1px solid var(--sk-line-2)!important;border-radius:10px!important;background:#F3F7FC!important;margin-left:auto!important}
html[data-paper] body #view #pdContent .lm-ledger-switch button{height:30px!important;padding:0 11px!important;border:0!important;border-radius:7px!important;background:transparent!important;color:#617286!important;font-size:12px!important;font-weight:700!important;cursor:pointer!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-ledger-switch button b{margin-left:4px!important;color:#7D8DA0!important;font-variant-numeric:tabular-nums!important}
html[data-paper] body #view #pdContent .lm-ledger-switch button.active{background:#fff!important;color:#0969DA!important;box-shadow:0 1px 3px #0b326212!important}
html[data-paper] body #view #pdContent .lm-ledger-h .lm-btn-export{color:#0969DA!important;border-color:#B8D3F5!important;background:#F5F9FF!important}
html[data-paper] body #view #pdContent .lm-row-archive{height:27px!important;padding:0 10px!important;border:1px solid #B8E5CE!important;border-radius:7px!important;background:#EFFAF4!important;color:#087443!important;font-size:12px!important;font-weight:700!important;cursor:pointer!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-row-archive:hover{background:#DCF5E7!important;border-color:#80D2A7!important}
html[data-paper] body #view #pdContent .lm-row-archive:disabled{opacity:.55!important;cursor:wait!important}
html[data-paper] body #view #pdContent .lm-archive-meta{font-size:11px!important;color:#087443!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-ledger .pd-table th:nth-child(6),html[data-paper] body #view #pdContent .lm-ledger .pd-table th:nth-child(7),html[data-paper] body #view #pdContent .lm-ledger .pd-table td:nth-child(6),html[data-paper] body #view #pdContent .lm-ledger .pd-table td:nth-child(7){min-width:110px!important;text-align:left!important}
html[data-paper] body #view #pdContent .lm-ledger-tools {
  display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important;
  padding: 8px 14px !important;
  border-bottom: 1px solid var(--sk-line-2) !important;
  background: #FBFDFF !important;
}
html[data-paper] body #view #pdContent .lm-ledger-tools .lm-btn { height: 28px !important; min-height: 28px !important; }
html[data-paper] body #view #pdContent .lm-t {
  font-size: 11.5px !important; font-weight: 600 !important; color: #7A8A9B !important;
}
html[data-paper] body #view #pdContent .lm-num {
  width: 52px !important; height: 28px !important; min-height: 28px !important;
  padding: 0 6px !important; text-align: center !important;
}
html[data-paper] body #view #pdContent .lm-path {
  width: 230px !important; height: 28px !important; min-height: 28px !important;
  font-size: 12px !important;
}
/* 表格区：去掉自己的外框（卡已经有框），只负责滚 */
html[data-paper] body #view #pdContent .lm-tblwrap {
  flex: 1 1 auto !important; min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  border: 0 !important; border-radius: 0 !important;
  background: #FFFFFF !important; box-shadow: none !important;
}
/* 活动/归档共用相同的页面骨架，切换时不增删垂直区域；表格列按业务信息量分配。 */
html[data-paper] body #view #pdContent .lm-register-launch{height:58px!important;min-height:58px!important;box-sizing:border-box!important}
html[data-paper] body #view #pdContent .lm-ledger{min-height:0!important}
html[data-paper] body #view #pdContent .lm-ledger-h{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto auto!important;column-gap:12px!important;min-height:50px!important;box-sizing:border-box!important}
html[data-paper] body #view #pdContent .lm-ledger-switch{margin-left:0!important;justify-self:center!important}
html[data-paper] body #view #pdContent .lm-ledger-h>.lm-btn{margin-left:0!important;justify-self:end!important}
html[data-paper] body #view #pdContent .lm-ledger-tools{height:42px!important;min-height:42px!important;box-sizing:border-box!important;flex-wrap:nowrap!important;overflow:hidden!important}
html[data-paper] body #view #pdContent .lm-ledger-tools-archive{display:flex!important;align-items:center!important}
html[data-paper] body #view #pdContent .lm-ledger-tools-archive .lm-t{color:#73869A!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table{width:100%!important;min-width:1700px!important;table-layout:fixed!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th,html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td{box-sizing:border-box!important;padding:8px 9px!important;vertical-align:middle!important;overflow:hidden!important;text-overflow:ellipsis!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-code,html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-spec,html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-level,html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-date,html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-qty{white-space:nowrap!important;font-variant-numeric:tabular-nums!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-name,html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-operator{white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td.line-location{white-space:normal!important;text-align:left!important;vertical-align:middle!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-location span{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;overflow-wrap:anywhere!important;line-height:1.4!important;text-overflow:clip!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th{text-align:center!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th:nth-child(3),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th:nth-child(6),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th:nth-child(7),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th:nth-child(8),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table th:nth-child(13){text-align:left!important;padding-left:12px!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td.line-remark{white-space:normal!important;text-align:left!important;vertical-align:middle!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table .line-remark-text{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;overflow-wrap:anywhere!important;line-height:1.45!important;text-overflow:clip!important;text-align:left!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(1),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(2),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(4),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(5),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(9),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(10),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(11){text-align:center!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(3){text-align:left!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(6),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(7),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(8){text-align:left!important}
html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(9),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(12),html[data-paper] body #view #pdContent .lm-ledger .lm-request-table td:nth-child(14){text-align:center!important}
@media(max-width:1050px){html[data-paper] body #view #pdContent .lm-ledger-h{grid-template-columns:minmax(0,1fr) auto auto auto!important;column-gap:6px!important}html[data-paper] body #view #pdContent .lm-ledger-t{gap:4px!important;font-size:11px!important}html[data-paper] body #view #pdContent .lm-ledger .lm-request-table{min-width:1700px!important}}

/* 线边仓批次库存：强化表头层次、批次信息和现存数量的辨识度。 */
html[data-paper] body #view #pdContent .pd-ls-table:has(.pd-ls-stock-table){border-color:#D6E3F2!important;border-radius:13px!important;box-shadow:0 3px 12px #1F49730A!important;background:#fff!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table{min-width:1280px!important;border-collapse:separate!important;border-spacing:0!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table th{height:44px!important;padding:0 16px!important;background:linear-gradient(180deg,#F3F8FE,#EAF2FB)!important;color:#315B88!important;font-size:12px!important;font-weight:750!important;letter-spacing:.02em!important;border-bottom:1px solid #D7E4F3!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table th:first-child,html[data-paper] body #view #pdContent .pd-ls-stock-table th:nth-child(2){text-align:left!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table th:last-child{text-align:right!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table td{height:50px!important;padding:8px 14px!important;border-bottom:1px solid #EAF0F7!important;color:#273B52!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table tbody tr:nth-child(even) td{background:#F8FAFD!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table tbody tr:hover td{background:#EEF6FF!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table tbody tr:last-child td{border-bottom:0!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-code{min-height:26px!important;padding:3px 9px!important;border-color:#D3E3F7!important;border-radius:7px!important;background:#F2F7FE!important;font-size:11.5px!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-brand{background:#F1F6FC!important;color:#405A75!important;font-weight:650!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-level{background:#F2F5F9!important;color:#4D5C6D!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-batch{padding:5px 9px!important;border-color:#DCE7F4!important;background:#FBFCFE!important;color:#42566E!important;font-size:11.5px!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-spec{border-color:#DCE7F4!important;background:#F4F8FD!important;color:#405A75!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-qty-cell{padding-right:18px!important;text-align:right!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-code-cell,
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-batch-cell{text-align:left!important}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-code,
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-batch{
  display:inline-flex!important;align-items:center!important;gap:8px!important;min-height:30px!important;max-width:100%;
  padding:4px 10px 4px 8px!important;border:1px solid #D9E3EE!important;border-radius:7px!important;
  box-shadow:none!important;white-space:nowrap!important;
}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-code{
  background:#F3E8FF!important;color:#6B21A8!important;border-color:#D8B4FE!important;
  font:700 12.5px/1.2 ui-monospace,Consolas,"Microsoft YaHei",monospace!important;letter-spacing:.015em!important
}
html[data-paper] body #view #pdContent .pd-ls-stock-table .pd-ls-batch{
  border-color:#FDBA74!important;background:#FFF7ED!important;color:#9A3412!important;
  font:650 12px/1.2 ui-monospace,Consolas,monospace!important;letter-spacing:.01em!important
}
html[data-paper] body #view #pdContent .pd-ls-stock-table tbody tr:hover .pd-ls-code{
  border-color:#C084FC!important;background:#EDE9FE!important
}
html[data-paper] body #view #pdContent .pd-ls-stock-table tbody tr:hover .pd-ls-batch{
  border-color:#FB923C!important;background:#FFEDD5!important
}


/* ===========================================================================
   66. 去灰总收口：主题色一律走品牌蓝（2026-10-09 · 用户："好多模板的主题色还是这种灰色，全面检查一下"）
   ---------------------------------------------------------------------------
   ▍怎么查出来的（三个探针，可随时复跑）
     · `node _qctest/gray-audit.cjs 39108 120`
       —— 逐个导航页 + 页内页签（实测 99 个视图）打开，把**块面级中性灰**按命中视图数排名，
          输出 `_qctest/out/gray-audit.json`。它只看"当主题色用"的东西
          （hero / 卡头 / 面板头 / 药丸 / 选中态 / 色条 / 图标砖），
          正文文字灰、描边灰、表格隔行底**不算**（那些是层级，不是主题色）。
     · `node _qctest/token-gray-audit.cjs`
       —— 把 `html` 上**仍是中性灰**的 CSS 变量列出来（运行时真值，不读源码猜）。
     · `node _qctest/gray-trace.cjs <页> "<选择器>"`
       —— 追出"这块的灰是**哪条规则**给的"（遍历样式表找匹配且声明灰值的规则）。

   ▍根因（两处，都是"换了配色但没换干净"）
     ① **变量层**：skin-paper 的纸感皮把点缀定义成墨灰（`--sk-accent:#434343`、`--brand:#383838`、
        `--ui-brand-600:#434343`、`--panel-2:#f9f9f9`、`--ui-info-bg:#f3f3f3` …）。
        §34 换成品牌蓝时只改了 `--sk-*` / `--ui-brand-*` / `--h-*` 这一组，
        `--brand* / --line-strong / --line-soft / --panel-2 / --ui-info-* / --kpi-*` 这些
        "老变量桥"没跟着走 ⇒ `.chip.active`、`.am-btn.primary`、`.pt-badge` 这些还是灰的。
     ② **硬编码层**：`skin.css` 的 E 皮肤里有一整块"台面/卡面/卡头/输入"的**灰调**规则
        （`.view` 页面底 `#e5e5e5→#dfdfdf→#e3e3e3`、卡面 `#fbfbfb→#f7f7f7→#f3f3f3`、
          卡头 `.panel>.panel-h / .ui-toolbar` `#f1f1f1→#ececec`、KPI 砖 `#fbfbfb→#f6f6f6`、
          看板列 `.stcol` `#f2f2f2→#eeeeee`、`.sthc` `#f2f2f2`、
          按钮底 `rgba(198,198,198,·)`、`.ft-tab.on` `rgba(115,115,115,·)` …），
        它们**不读变量**（或读的是没被换掉的老变量），所以改令牌改不动它们，必须逐条覆盖。

   ▍本节做什么
     ① 把**剩余灰变量**重新指向蓝色族（一张表，见下）；
     ② 把**硬编码灰**的那些选择器逐条覆盖成蓝色族。
     只动"主题色"，语义色（ok 绿 / warn 琥珀 / danger 红 / 未重合紫）与灰字层级一个字不改。

   ▍两条纪律
     · 为什么写 `[data-paper][data-paper][data-paper]`：skin.css 那些规则是
       `html[data-skin="E"]:not([data-theme="dark"]) #view :is(...)` = (1,3,0)，而且带 `!important`。
       本节要稳压它，就得 ① 拿到一个 id（`#view`）+ ② 类/属性计数比它多。
       重复属性选择器是标准允许的**提权**写法（匹配结果不变，只抬特异性），**别"清理"成一次**。
     · 每条都带 `!important`：对面也是 `!important`，不写就输在特异性之后的同权比拼上。
     回退：删掉本节（文件末尾 §66 整段）即可回到上一版灰调。
   =========================================================================== */

/* ── 66.1 变量层：把"还是灰的"令牌一次点干净 ─────────────────────────────── */
html[data-paper]:not([data-theme="dark"]) {
  /* 老变量桥：brand 一族（.chip.active / .am-btn.primary / .due-slicer .chip.active 都在吃它） */
  --brand: #0F63B4;
  --brand-2: #1A7BD9;
  --brand-soft: #E8F1FB;
  --brand-glow: rgba(26, 123, 217, .20);
  /* 线：strong/soft 原来是 #e4e4e4 / rgba(68,68,68,.09)（.rm-btn / 输入框 / 分隔都在吃） */
  --line-strong: #C9D9EC;
  --line-soft: rgba(15, 99, 180, .10);
  --p2-line-soft: #EAF1FA;
  /* 信息色：pt-badge / ft-tab.on / ui-pill.is-info 全走 --ui-info-* */
  --ui-info-ink: #0F63B4;
  --ui-info-bg: #EAF2FC;
  --ui-info-line: #CFE0F4;
  --ui-info-solid: #1A7BD9;
  --sk-info: #0F63B4;
  /* KPI 身份色：#6e6e6e / #5e5e5e → 品牌蓝（这三档原本就是"待办/中性"两档） */
  --kpi-default: #1A7BD9;
  --kpi-pending: #1A7BD9;
  /* 面/线：面板第二档底、细线、页面第二档底 */
  --panel-2: #F7FAFE;
  --sk-line-2: #EAF1FA;
  --sk-page-2: #E4EBF6;
  /* 灰字改**蓝灰**（同一明度，只换色相；不是"去掉灰"而是"别是纯灰"）。
     明度基本不动 ⇒ 对比度不降；三档仍是 16:1 / 9:1 / 5:1 的量级。 */
  --txt: #17202B; --txt-2: #3F4A58; --txt-3: #4E5A6A;
  --sk-ink: #17202B; --sk-ink-2: #3F4A58; --sk-ink-3: #4E5A6A;
  --ui-ink-900: #17202B; --ui-ink-700: #3F4A58; --ui-ink-500: #4E5A6A;
  --ui-ink-400: #4E5A6A; --ui-ink-300: #55637A;
  --nav-txt: #3B4A5A; --nav-txt-2: #566272; --sk-band-txt: #566272;
  /* 侧栏那组纸白轨（当前侧栏是深蓝，用不到；一并换掉免得哪天切回纸白轨又冒灰） */
  --sk-rail-line: #E2E9F3;
  --sk-rail-field: #EFF4FB;
  --sk-rail-hover: #F1F6FC;
  --sk-rail-rail-bg: #F1F6FC;
  --sk-rail-badge: rgba(15, 99, 180, .10);
  --sk-rail-thumb: #C3D4E6;
  --sk-rail-thumb-hover: #9DB4CC;
  --sk-rail-pin-bg: rgba(15, 99, 180, .06);
}

/* ── 66.2 页面底：台面由"灰阶渐层"改成"淡蓝渐层" ────────────────────────── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view {
  background:
    radial-gradient(1200px 600px at 12% -12%, rgba(26, 123, 217, .10), transparent 60%),
    radial-gradient(900px 500px at 100% 0%, rgba(86, 167, 162, .07), transparent 56%),
    linear-gradient(180deg, #EEF4FC 0%, #E9F0FA 55%, #EDF3FB 100%) !important;
}

/* ── 66.3 卡面：`#fbfbfb→#f7f7f7→#f3f3f3` 的"纸灰"改成纯白（纸感靠发丝线，不靠灰底） ── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .ui-card, .ui-panel, .panel, .card, .pd-wrap > div, .rp-card, .dv-card, .fl-id, .ov3-card,
  .sp-panel, .mqz-card, .fqc-card, .oc-filtercard, .oc-tbl-wrap, .ov-tabs, .ov-act-c, .al-card,
  .ov-alert, .sec-card, .tp-card, .ui-section, .q-pane, .ocard, .wc-card,
  .rework-hero, .rework-stat-card, .rework-segments, .am-hero, .am-hero-user, .am-hero-eyebrow) {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
  box-shadow: 0 1px 2px rgba(20, 40, 70, .05) !important;
}

/* ── 66.4 卡头 / 工具条 / 面板头：`#f1f1f1→#ececec` 的灰带改成品牌淡蓝带 ─────────
   （这是用户截图里"工序看板 8-Station Pipeline"那一条，全站 16 个视图在吃。） */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .ui-card-h, .ui-card-b, .ui-toolbar, .tp-card-h, .sec-card > h3, .panel > .panel-h,
  .ov3-h, .mqz-head, .sp-panel-h, .fqc-panel-h) {
  background: linear-gradient(180deg, #F6FAFE 0%, #E9F1FA 100%) !important;
  border-color: var(--sk-line) !important;
}

/* ── 66.5 图标砖 / 差异胶囊：`#f6f6f6`、`#f5f5f5` 的灰块改成蓝色族 ──────────────
   ⚠ 这里**不要**去覆盖 KPI 卡（.pk-card / .ov-kpi-d / .q-kpi / .bp-kpi / .dv-kpi-item）的
     background：它们的底色是 app.js 按语义**内联**写死的（在产蓝 / 延期红 / 按时绿…），
     skin-paper §17.3 只盖一层"白纱"柔化。写成 `!important` 会把内联的语义色一起抹掉
     —— 第一版就踩了（工序看板六张卡全变白），实测截图才发现，已回退。 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .ov3-h .ov3-ico, .rp-hero-ic, .dv-hero-ic, .am-hero-ic) {
  background: linear-gradient(160deg, #E8F1FB, #D8E8F9) !important;
  border-color: #A9CDF0 !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .ov-delta {
  background: #F2F7FD !important;
  border-color: var(--sk-line) !important;
  color: #3F4A58 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .ov-delta :is(b, i, span) { color: inherit !important; }
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .ov-delta.up :is(b, i) { color: #0A7043 !important; }
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .ov-delta.down :is(b, i) { color: #B3202E !important; }

/* ── 66.6 表格：表头带 / 斑马 / 悬停 / 行线（原来全是 `#f1f1f1/#ededed/#f4f4f4/#efefef/#e8e8e8`） ── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view table thead th {
  background: linear-gradient(180deg, #F2F7FD, #E9F1FA) !important;
  color: #0F63B4 !important;
  border-bottom: 1px solid var(--sk-line) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view table tbody tr:nth-child(even) td { background: #FAFCFF !important; }
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view table tbody tr:hover td { background: #EDF4FC !important; }
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view table tbody td { border-bottom: 1px solid var(--sk-line-2) !important; }

/* ── 66.7 控件：输入 / 按钮 / 胶囊 / 段控 / 页签 —— 灰底灰边一律换蓝族 ────────────── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  input[type="text"], input[type="search"], input[type="password"], input[type="number"],
  input:not([type]), select, textarea) {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
  color: var(--sk-ink) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(input, select, textarea)::placeholder { color: #7A8A9B !important; }
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(input, select, textarea):focus {
  border-color: var(--sk-accent) !important;
  box-shadow: 0 0 0 3px rgba(26, 123, 217, .14) !important;
}
/* 工具栏按钮（.tbtn / .rm-btn / .ui-btn …）：白底 + 蓝灰边 + 蓝字 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .tbtn, .rm-btn, .ui-btn, .dv-btn, .mqz-btn, .mq-btn, .oc-btn, .rp-btn, .sp-btn):not(.primary):not(.is-primary):not(.btn-primary):not(.danger) {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .tbtn, .rm-btn, .ui-btn, .dv-btn, .mqz-btn, .mq-btn, .oc-btn, .rp-btn, .sp-btn):not(.primary):not(.is-primary):not(.btn-primary):not(.danger):hover {
  background: #F2F7FD !important;
  border-color: #A9CDF0 !important;
}
/* 胶囊 / 筛选片 / 段控 / 页签：常态淡蓝底，选中实品牌蓝 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .chip {
  background: #F2F7FD !important;
  border-color: var(--sk-line) !important;
  color: #3F4A58 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .chip :is(b, .cnt) {
  background: rgba(15, 99, 180, .10) !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.chip.active, .chip.is-on, .due-slicer .chip.active) {
  background: #0F63B4 !important;
  border-color: #0F63B4 !important;
  color: #FFFFFF !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.chip.active, .chip.is-on, .due-slicer .chip.active) :is(b, .cnt) {
  background: rgba(255, 255, 255, .24) !important;
  color: #FFFFFF !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.oc-chip, .sp-chip, .mqs-chip, .q-chip, .pbc-chip) {
  background: #F2F7FD !important;
  border-color: var(--sk-line) !important;
  color: #3F4A58 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.oc-chips .oc-chip.active, .oc-chips .oc-chip.is-on, .oc-chip.active, .sp-chip.on, .mqs-chip.on) {
  background: linear-gradient(180deg, #E8F1FB, #D8E8F9) !important;
  border-color: #A9CDF0 !important;
  color: #0F63B4 !important;
  box-shadow: inset 0 2px 0 var(--sk-accent) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.pd3-fold-h .ft-tab, .ft-tab) {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
  color: #3F4A58 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.pd3-fold-h .ft-tab.on, .ft-tab.on) {
  background: #E8F1FB !important;
  border-color: #A9CDF0 !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.sp-seg-item, .mqs-seg button, .ov-tabs button, .dv-tabs button, .rp-tabs button) {
  color: #3F4A58 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.sp-seg-item.active, .live-seg .sp-seg-item.active, .sp-seg-item.is-on) {
  background: #E8F1FB !important;
  color: #0F63B4 !important;
  box-shadow: 0 1px 2px rgba(15, 99, 180, .18) !important;
}

/* ── 66.8 工序看板：列 / 计数徽标 / 列内计数（原来 `#f2f2f2→#eeeeee`、`#f2f2f2`、`rgba(198,198,198,.18)`） ── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .stcol {
  background: linear-gradient(180deg, #F8FBFF 0%, #EFF5FC 100%) !important;
  border-color: var(--sk-line) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .stcol.is-empty,
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .stcol.is-empty:hover {
  background: #F7FAFE !important;
  border-color: var(--sk-line-2) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .sthc {
  background: #E8F1FB !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .sthc.is-zero {
  background: #F1F5FA !important;
  color: #7A8A9B !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .stcol :is(.cnt, .sh .cnt) {
  background: rgba(15, 99, 180, .10) !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .board .stcol::-webkit-scrollbar-thumb {
  background: rgba(15, 99, 180, .22) !important;
}

/* ── 66.9 空态提示块 / 信息药丸：灰底灰虚线 → 淡蓝底蓝虚线 ─────────────── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .stcol-empty, .rework-empty, .mo-cart-empty, .pd-empty, .ui-empty, .rp-empty) {
  background: #F7FAFE !important;
  border-color: #CFE0F4 !important;
  color: #4E5A6A !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .ui-pill.is-info {
  background: #EAF2FC !important;
  border-color: #CFE0F4 !important;
  color: #0F63B4 !important;
}

/* ── 66.10 管理台 / 报表 / 返工的 hero 与统计块 ─────────────────────────── */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.am-hero, .rp-hero, .rework-hero) {
  background: linear-gradient(120deg, #FFFFFF 0%, #F4F8FD 58%, #EAF1FA 100%) !important;
  border-color: var(--sk-line) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .am-hero-eyebrow, .am-hero-user, .rework-hero-badge, .rework-segments, .rework-stat-card) {
  background: #F2F7FD !important;
  border-color: var(--sk-line) !important;
}

/* ── 66.11 补齐清单：巡检最后一轮剩下的那些（全是"漏网"的页头 / 工具条 / 段控） ─────
   ⚠ 其中一类特别隐蔽：`<button>` **不写 background 就是浏览器 UA 的 ButtonFace (#f0f0f0)** ——
     `.sp-seg-item` / `.btn` 这类没背景的按钮，量出来就是"灰块"，但任何样式表里都查不到这条规则
     （`_qctest/css-why.cjs` 用 CDP 的 getMatchedStylesForNode 也查不到 ⇒ 那是 UA 默认值）。
     所以这里必须**显式**给它一个背景。 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .sp-hero, .dv-hero, .oc-hero, .pd-hero, .mq-hero, .od2-hero, .page-hero) {
  background: linear-gradient(120deg, #FFFFFF 0%, #F4F8FD 58%, #EAF1FA 100%) !important;
  border-color: var(--sk-line) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(
  .fqc-panel, .fqc-card, .fqc-section, .fqc-qcard, .fqc-cockpit) {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
}
/* 工具条：`.pd-toolbar` 上一轮漏了（它的灰来自 skin.css 的 `#fdfdfd→#fafafa`） */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .pd-toolbar {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
}
/* 段控（发货出库 / 生产动态 / 数据分析同一套）：轨道淡蓝、未选项透明、选中白片 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .sp-seg {
  background: #EAF1FA !important;
  border-color: var(--sk-line) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .sp-seg-item {
  background: transparent !important;
  color: #3F4A58 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.sp-seg-item.active, .live-seg .sp-seg-item.active) {
  background: #FFFFFF !important;
  color: #0F63B4 !important;
  box-shadow: 0 1px 3px rgba(16, 58, 110, .20) !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view :is(.live-count, .sp-seg-item .n, .sp-seg-item .cnt) {
  background: rgba(15, 99, 180, .10) !important;
  color: #0F63B4 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .sp-seg-item.active :is(.live-count, .n, .cnt) {
  background: rgba(15, 99, 180, .14) !important;
  color: #0F63B4 !important;
}
/* 普通按钮（非主按钮 / 非危险）：UA 的 ButtonFace 灰 → 白底蓝字 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .btn:not(.primary):not(.is-primary):not(.btn-primary):not(.danger) {
  background: #FFFFFF !important;
  border-color: var(--sk-line) !important;
  color: #0F63B4 !important;
}


/* ===========================================================================
   56.（已撤回）1080p 整体 zoom 0.85 —— 为什么不能用，留档给下次别再试
   ---------------------------------------------------------------------------
   2026-10-10 上午，用户：「这是我这个程序在实验室电脑里面的显示比例，这是我们绝对接受不了的」
   （附实验室 1920×1080 截图）。当时的判断是"实验室机没有放大，是 24″1080p 与 27″2K 的
   像素密度差（92 vs 109 PPI）"，于是给 ≤1920 这一档挂 `zoom:.85`。

   当天下午同一台机器的截图（`codex-clipboard-a265cd1b…png`）暴露了它的副作用：
     · 右侧横向溢出 **339px**：`.ov-kpis-dark` 第 5 张 KPI 卡（设备总数）被切掉半边；
     · 页面纵向依旧超出一屏（那张图里"未来 14 天"日历条只露了一半）。
   机制（用探针量出来的，见 `_qctest/ovf-probe.cjs`）：`zoom` 作用在 html 上时，
   本项目的百分比宽度解析出来的布局视口与渲染尺寸对不上 ——
     `width:100%` 的元素 offsetWidth（布局）= 2259、rect（物理）= 1920，
     而 `document.documentElement.scrollWidth` = 2259 > clientWidth 1920 ⇒ 文档横向可滚、右侧被切。
   （`100vw` 又完全不吃 zoom：100vw 的 offsetWidth 仍是 1920、rect 只有 1632。）

   ⇒ 结论：**这个项目不能用整体 zoom 来"缩放界面"**；要"在 1080p 上更紧凑、看得全"，
     只能按页面把尺寸/留白收掉（见 §57）。以后别再走 zoom 这条路。
   =========================================================================== */


/* ===========================================================================
   57. 生产概览「一屏装得下」（2026-10-10）
   ---------------------------------------------------------------------------
   用户原话（附实验室机截图）：「你看这个页面还是会显示不全的，还需要再好好优化一下」

   实测（`_qctest/ovf-probe.cjs`，视口＝实验室机真实尺寸 1920×**956**：
   Edge 外壳 80px + 任务栏 45px 吃掉的那部分以前一直被漏算，之前所有验收都按 1920×1080 量，
   所以"0/42 需要滚动"的结论在真机上并不成立）：
     · 图区 4 张卡被**切掉** 66 / 34 / 254 / 249 px（交期压力那张切掉一大半日历条）；
     · 页面自身还要往下多出 ~290px。
   原因：`.ov3-grid` 是 `flex:1 1 auto` + `min-height:0`，高度不够时**行高被压缩**，
   而卡片是 `overflow:hidden` ⇒ 内容直接被裁（不是滚动，看不到也滚不到）。

   做法（只对含 `.bp-home` 的生产概览生效，其它页一个字不动）：
     ① 顶部 KPI 带 / 今日实况 / 告警条 / 页签 各收一档留白与字号（省 ~120px）；
     ② 图区行高改「按内容」、且**只涨不缩**（`flex:1 0 auto`）：有余量时两行等高摊满（不露灰底），
        内容真的超了就让 `.view-fade` 滚动 —— 宁可滚，也不再裁；
     ③ 图表容器最小高 170→130、14 天日历格子收一档（cell min-height 52→0 + 小内边距）。
   =========================================================================== */
/* ⚠ 这个文件里已经有一堆同名的 !important 规则（§30/§31/§33/§51… 还有 html[data-navm="groups"]
   那一层），比"谁的 !important 更 !important"只能靠特异性取胜。实测必须写成
   `#view#view:has(.bp-home)`（重复 id 把特异性顶到 (2,3,2)）才压得住
   `html[data-paper] #view:has(.ov-hero.is-dash) .ov-kpi-d.ov-kpi-d` 那条 (1,4,1)。
   改这里之前先跑 `_qctest/ovf-probe.cjs 1920 956`，别凭感觉。 */

/* ① 顶部三块瘦身（KPI 带 245→~150：内边距、字号、去掉瓷砖里的迷你折线） */
html[data-paper] body #view#view:has(.bp-home) .ov-hero.is-dash { margin: 0 0 6px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hero-band { padding: 8px 12px 6px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hero-top { min-height: 0 !important; padding: 6px 12px !important; }
/* 顶部那行芯片（实时数据/本地台账/订单总数/发货率…）默认会折成两行（47px）。
   字号与内边距收一档后能落回一行（27px）——省 20px，且信息一条不少。 */
html[data-paper] body #view#view:has(.bp-home) .ov-hero-top { gap: 6px 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hs { gap: 4px 8px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hs > * { font-size: 10px !important; padding: 1px 6px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hc { gap: 5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hc > * { padding: 2px 8px !important; font-size: 11px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpis-dark {
  margin-top: 6px !important; gap: 10px !important; min-height: 0 !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.ov-kpi-d {
  min-height: 0 !important; padding: 4px 10px 5px !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-vl { margin-top: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-vl b { font-size: 24px !important; letter-spacing: -.5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-sb { margin-top: 2px !important; line-height: 1.3 !important; }
/* 迷你折线（.k-viz）在这页去掉：占 23px 且与底下的进度条重复表达 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-viz { display: none !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-bar { margin-top: 5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-cap { margin-top: 2px !important; padding-top: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-today {
  margin-top: 6px !important; padding-top: 6px !important; gap: 10px !important; min-height: 0 !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-today-c b { font-size: 16px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act-wrap { margin-bottom: 5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act-wrap > * { padding: 3px 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act :is(em, .ov-act-t, .ov-act-d) { line-height: 1.35 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs { margin-bottom: 5px !important; padding: 4px 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs button { padding: 2px 12px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs button :is(b, i) { line-height: 1.15 !important; }

/* ② 图区不再被压缩：行高按内容、只涨不缩；真装不下就让 .view-fade 滚 */
html[data-paper] body #view#view:has(.bp-home) .ov3-grid.ov3-grid {
  grid-template-rows: auto auto !important;
  align-content: stretch !important;
  flex: 1 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov3-card.ov3-card {
  height: auto !important;
  min-height: 0 !important;
  align-self: stretch !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
/* ★ 关键：`.ov3-b` 原来是 `flex: 0 0 auto`（不许长），所以卡片长高时图不跟着长 ——
   这样"把顶部收掉、高度让给图卡"就白让了（实测图一直卡在 min-height）。
   改成可长：卡片多高，图就占多高。 */
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-b { flex: 1 1 auto !important; min-height: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-b :is(.bp-chart, .ov3-chart, [class*="ov3-h"]) {
  min-height: 120px !important;
}
/* ⚠ 别写 `.ov3-grid:has(.c-pressure) .bp-chart` —— :has 落在网格上会命中**里面所有**图表，
   第一版的 76px 就这么把四张图一起压到 76 了。按卡片限定。 */
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-pressure .bp-chart,
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-cycle .bp-chart { min-height: 108px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h { padding-bottom: 4px !important; }
/* 卡头（.ov3-h 33px：图标砖 + 标题 + 英文副标三行）在 1080p 上再收一档；图标砖同时缩到 18px */
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h { min-height: 0 !important; padding-top: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h .ov3-ico { width: 18px !important; height: 18px !important; min-width: 18px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h :is(h3, .ov3-t) { font-size: 12px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h .ov3-en { font-size: 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h :is(em, .ov3-meta) { font-size: 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card :is(.ov-wkmode, .pl-note) { margin-top: 4px !important; }

/* ③ 14 天日历：原来的格子是"日期/星期/条数/单数"四行 ⇒ 每格 78px、两行 200+。
   改成两行两列（日期+星期 一行、条数+单数 一行）⇒ 每格 ~40px，省下 ~100px。 */
html[data-paper] body #view#view:has(.bp-home) .ov-cal { margin-top: 6px !important; padding-top: 5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-hd { margin-bottom: 4px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-grid { gap: 5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell {
  min-height: 0 !important;
  padding: 3px 7px 4px !important;
  display: grid !important;
  grid-template-columns: auto auto !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  gap: 0 6px !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell .n { margin-top: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell .w { font-size: 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell .p { font-size: 10px !important; }


/* ===========================================================================
   59. 左栏收窄 + 给图卡让回高度（2026-10-10）
   ---------------------------------------------------------------------------
   用户原话：「现在显示的还是很怪异，用心调整一下，左侧导航栏可以收窄一点」
     · 左栏 236px（轨 62 + 条目面板 153）在 1920 屏上占了 12.3%，比内容里任何一栏都"重"；
       实测条目面板的可用余量：最宽的条目「跨工段对账」内容只要 110px，面板却有 153px
       （条目宽度是被面板撑开的，不是内容撑的）⇒ 面板收到 ~134px 不影响任何名字。
     · §57 把生产概览压到刚好一屏，图卡被压得偏矮（图表 84/76px），看着"挤"。
       这里再收顶部三块的留白，把高度还给图卡（图表回到 110px 上下）。
   ⚠ 条目名是 `min-width:max-content`（永不绝断），所以收窄侧栏时**必须**同时量
     `.nav-item > span` 的宽度 —— 我用 `_qctest/nav-probe`（见 §58 末尾命令）复核过：
     196px 下最宽条目 158 ≤ 面板 134+…，没有溢出。
   =========================================================================== */
/* ⚠ 侧栏宽度是 §38 的变量 `--n4-w`（同时喂 width 与 flex-basis），
   直接写 width 会被 `flex: 0 0 var(--n4-w)` 顶掉 —— 必须改这个变量。 */
@media (min-width: 761px) {
  html[data-paper] { --n4-w: 196px; }
}
html[data-paper] body .app .sidebar .brand { padding: 2px 2px 10px !important; }
html[data-paper] body .app .sidebar .brand h1 { font-size: 13px !important; letter-spacing: 0 !important; }
html[data-paper] body .app .sidebar .brand .sub { font-size: 9px !important; }
html[data-paper] body .app .sidebar .nav-item {
  margin-left: 3px !important; margin-right: 3px !important;
  padding: 7px 8px !important; gap: 8px !important;
  font-size: 12.5px !important;
}
html[data-paper] body .app .sidebar .nav-group > .gt { padding-left: 8px !important; padding-right: 8px !important; }

/* 生产概览：顶部三块再收一档（省 ~45px 给图卡） */
html[data-paper] body #view#view:has(.bp-home) .ov-act-wrap { margin-bottom: 4px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act-wrap > * { padding: 2px 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs { margin-bottom: 4px !important; padding: 3px 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs button { padding: 1px 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs button i { font-size: 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-today-c b { font-size: 14px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpis-dark { gap: 8px !important; }
/* ⑨ 第二轮收紧（把高度让给四张图）：顶部那行本身只有 34px 高，撑到 47 的是我给它的
   6px 上下内边距；右侧三个控件 34px 也收成 27px。 */
html[data-paper] body #view#view:has(.bp-home) .ov-hero-top { padding: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hc > * { padding: 3px 9px !important; min-height: 27px !important; height: 27px !important; line-height: 21px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hs > * { min-height: 22px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-today { margin-top: 5px !important; padding-top: 5px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.ov-kpi-d { padding: 3px 10px 4px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-bar { margin-top: 4px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h { padding-bottom: 2px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card .ov-wkmode { margin-top: 2px !important; padding-top: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-grid { gap: 4px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell { padding: 2px 6px 3px !important; }
/* ⑩ 告警条与页签的高度是**写死**的（`.ov-act{height:58px}` / `.ov-tabs{height:48px}` /
   `.ov-tabs button{height:40px}`，全是 !important）—— 光调 padding 没用，必须改高度本身。
   这两条共省 30px，转给图卡。 */
html[data-paper] body #view#view:has(.bp-home) .ov-act.ov-act { height: 48px !important; padding: 2px 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act > * { height: 44px !important; padding: 5px 12px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act > * :is(b, strong, em, span) { line-height: 1.25 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs.ov-tabs { height: 38px !important; min-height: 38px !important; padding: 2px 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs button { height: 32px !important; padding: 0 10px !important; }
/* ⑪ 日历格子再收 8px（两行省 16），字号 9/10 仍清楚 */
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell { padding: 1px 5px 2px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell .d { font-size: 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell .n { font-size: 11px !important; }
/* ⑫ KPI 瓷砖再收一点（数字 22px / 内边距 2-3px），把高度留给图 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.ov-kpi-d { padding: 2px 9px 3px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-vl b { font-size: 22px !important; }


/* ===========================================================================
   60. 生产概览「去杂」：色噪声与重复说明（2026-10-10 · 用户："整个页面的布局
       可以再调整一下吗，看上去真的好杂好乱"）
   ---------------------------------------------------------------------------
   一页里最吵的三样东西：
     ① 告警条＝3 张各自带底色/描边的彩色卡（红 / 橙 / 蓝各一块），和上面 5 块
        KPI 瓷砖的颜色在抢眼睛；
     ② KPI 瓷砖每块标签前一颗彩色圆点、底下一条彩色进度条 ⇒ 5 块 = 10 个色块；
     ③ 卡内长句说明（"按纯化方式对比…均值被少数慢单拉高时两者会分叉…"）整段小字
        压在图上，一行折两行。
   做法：只降"色彩与文字"的噪声，不动信息量（长句改成单行省略 + title 全文）。
   =========================================================================== */
/* ① 告警条 → 一条中性底 + 竖发丝线的三栏（图标颜色仍区分严重度） */
html[data-paper] body #view#view:has(.bp-home) .ov-act {
  display: flex !important; gap: 0 !important; align-items: stretch !important;
  background: #FFFBF2 !important; border: 1px solid #F0E2C8 !important;
  border-radius: 10px !important; padding: 0 !important; overflow: hidden !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-act > * {
  flex: 1 1 0 !important; min-width: 0 !important;
  background: transparent !important; border: 0 !important; border-left: 1px solid #F0E2C8 !important;
  border-radius: 0 !important; box-shadow: none !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-act > *:first-child { border-left: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act > * :is(b, strong) { color: #8A4B00 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act > * :is(em, i, small) { color: #9A7B4F !important; }

/* ② KPI 瓷砖：去掉标签前的小色点（10 个色块里最没信息量的 5 个），进度条轨道压淡 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-lb::before { display: none !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-bar { background: rgba(68,68,68, .10) !important; height: 4px !important; }

/* ③ 卡内长句说明 → 单行省略（全文保留在 title，鼠标停上去可读） */
html[data-paper] body #view#view:has(.bp-home) .ov-cmp-hd {
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov3-b > :is(.ov-note, .ov3-note) {
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
/* 趋势卡的"条数 / OD"开关：原来占一整行（30px），收成贴着卡头右下角的一枚小开关 */
/* ⚠ 2026-10-10 撤回：下面这条把开关绝对定位到卡头右上角，结果它正好压在图的图例上
   （用户："那个 OD 条数切换按钮很离谱"）。§61 里已改回正常文档流。 */


/* ===========================================================================
   61. 回到舒适尺寸，允许往下滚（2026-10-10 · 用户："还是很乱 我可以接受往下滚动"）
   ---------------------------------------------------------------------------
   §57/§59/§60 全是为了"严格一屏"把字号与留白一压再压的产物；
   用户明确说可以滚动 ⇒ 把这些尺寸还给内容：
     · KPI 数字 22→28、瓷砖内边距 2→8、今日实况数字 14→18
     · 告警条 48→56、页签 38→46
     · 图卡里的图表 108/120 → **150/140**（这是"挤"的主因）
     · 长句说明恢复换行（不再单行省略）
   只放宽尺寸，不动结构：告警条仍是中性一条、KPI 仍无小色点、无重复说明。
   页面整体因此比视口高 ~250px —— 超出部分滚动（.view-fade 本来就是 overflow:auto）。
   =========================================================================== */
html[data-paper] body #view#view:has(.bp-home) .ov-hero-band { padding: 12px 16px 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hero-top { padding: 0 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hs > * { font-size: 11px !important; padding: 3px 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-hc > * { height: 30px !important; min-height: 30px !important; line-height: 24px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpis-dark { margin-top: 10px !important; gap: 12px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.ov-kpi-d { padding: 8px 12px 8px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-vl b { font-size: 28px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-sb { font-size: 11px !important; margin-top: 4px !important; line-height: 1.45 !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-bar { height: 5px !important; margin-top: 8px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-today { margin-top: 10px !important; padding-top: 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-today-c b { font-size: 18px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act.ov-act { height: 56px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-act > * { height: 52px !important; padding: 8px 14px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs.ov-tabs { height: 46px !important; min-height: 46px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-tabs button { height: 38px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card.ov3-card { padding-top: 10px !important; padding-bottom: 10px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h { padding-bottom: 6px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h .ov3-ico { width: 22px !important; height: 22px !important; min-width: 22px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-h :is(h3, .ov3-t) { font-size: 13px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-b :is(.bp-chart, .ov3-chart, [class*="ov3-h"]) { min-height: 150px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-pressure .bp-chart,
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-cycle .bp-chart { min-height: 140px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cmp-hd { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-cal-cell { padding: 3px 7px 4px !important; }
/* 趋势卡的「条数 / OD」开关：回到卡内正常一行（§60 的绝对定位会压住图例，已撤） */
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-t7 .ov-wkmode {
  position: static !important; top: auto !important; right: auto !important; z-index: auto !important;
  margin: 0 0 6px !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-t7 .ov-wkmode button { font-size: 11px !important; padding: 2px 9px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov3-card.c-t7 .ov-wkmode em { display: inline !important; }


/* ===========================================================================
   62. 口径说明不再压图 + 顶部 KPI 重新设计（2026-10-10）
   ---------------------------------------------------------------------------
   用户两条：
     ① 「几张图表右下角的口径说明那几个文字会遮挡图表内容」
        —— §51 当初把 `.pl-note` 绝对定位到卡片右下角（为了省 52px/卡）；现在允许滚动，
           把它放回**文档流**：卡片底部单独一行、右对齐，图形区不再被压。
     ② 「顶部 KPI 卡片有没有更好的优化方案」
        —— 现状每块砖同时用了 **4 个颜色通道**：左缘 4px 色条(::before) + 渐变色底 + 大数取色相墨色
           + 标签前小圆点；五块砖五种色相叠在一起，看上去就是"花"。
           新方案：**颜色只留两处** ——
             · 身份色（色相）只在「标签前 6px 小圆点」和「迷你图」上出现；
             · 健康度（tone）只在「大数」上出现：达标＝墨色，不达标＝红。
           砖面统一成白底 + 发丝描边；§57 为省高度藏起来的迷你图（交付率条 / 在产火花线 /
           设备堆叠条）请回来 —— 那是"这块砖为什么是这个数"的唯一图形线索。
           副标 / 底注一律单行省略（全文在 title / 迷你图 title 里）。
   =========================================================================== */
/* ① 口径说明回到卡片底部（文档流，右对齐） */
html[data-paper] body #view#view:has(.bp-home) .ov3-card .pl-note {
  position: static !important; inset: auto !important;
  align-self: flex-end !important; margin: 6px 0 0 !important; z-index: auto !important;
}
/* ② KPI 砖：去渐变色底与左缘色条 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.ov-kpi-d {
  background: #FFFFFF !important; background-image: none !important;
  border: 1px solid var(--sk-line) !important; box-shadow: none !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.ov-kpi-d::before { display: none !important; }
/* ③ 大数：默认墨色（身份不再染字），只有不达标(tone-a)才红 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-vl b { color: var(--sk-ink) !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d.tone-a .k-vl b { color: var(--ui-danger-ink) !important; }
/* ④ 身份色点回到标签前（唯一保留的"是哪一类"提示） */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-lb::before {
  display: inline-block !important; content: "" !important;
  width: 6px !important; height: 6px !important; border-radius: 50% !important;
  background: var(--h-solid, var(--ui-brand-600)) !important;
  margin-right: 6px !important; vertical-align: 1.5px !important; flex: none !important;
}
/* ⑤ 迷你图请回来（交付率条 / 火花线 / 设备堆叠条） */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-viz {
  display: block !important; height: 20px !important; margin-top: 6px !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-viz svg { height: 20px !important; }
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-bar { height: 5px !important; margin-top: 0 !important; background: rgba(68,68,68, .10) !important; }
/* ⑥ 副标 / 底注：单行省略，砖面高度齐平 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-sb,
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-cap {
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-cap { margin-top: 4px !important; padding-top: 0 !important; }
/* ⑦ 率条上的"目标刻度"（<u>）原来比 5px 的条高，被 overflow:hidden 裁掉半截（实测 5/10）——
   把刻度线收到条内，纸白底上仍看得见。 */
html[data-paper] body #view#view:has(.bp-home) .ov-kpi-d .k-bar-rate u {
  height: 5px !important; top: 0 !important;
}


/* ⑧ （已撤）交期压力日历格子的"紧迫度色带"：那属于被用户否决的改版，
   日历已恢复原来的"按条数分档"配色，这几条规则随之删除。 */


/* ===========================================================================
   63. 去掉两处"看着空"的留白（2026-10-10 · 用户：「第一张图右侧留的空白太多，
       第二张图下侧留的空白太多」）
   ---------------------------------------------------------------------------
   ① 交期压力卡：卡片被同一行的「交付周期」按等高拉长，但上半的桶状图与下半的日历
      都是固定高度 ⇒ 日历下方到"口径说明"之间空出 ~99px（实测 284..325 是日历、
      下一处内容要到 425 才出现）。做法：#ovPressureMain 变纵向 flex 撑满卡片，
      图吃剩余高度、日历保持自身高度 ⇒ 空出来的高度全部变成图中 5 根条的行距。
   ② 按时交付率卡右侧的 ~100px 白槽在 app.js 的图表 option 里改（grid.right 62→38，
      去掉线末端标签）；这里补一条兜底：图卡本体不要留多余右内边距。
   =========================================================================== */
html[data-paper] body #view#view:has(.bp-home) #ovPressureMain {
  display: flex !important; flex-direction: column !important;
  height: 100% !important; min-height: 0 !important;
}
html[data-paper] body #view#view:has(.bp-home) #ovPressureMain > #bpcPressure {
  flex: 1 1 auto !important; min-height: 140px !important;
}
html[data-paper] body #view#view:has(.bp-home) #ovPressureMain > .ov-cal {
  flex: 0 0 auto !important; margin-top: 10px !important;
}
html[data-paper] body #view#view:has(.bp-home) .ov3-card > .ov3-b { padding-right: 0 !important; }


/* ===========================================================================
   64. 订单中心整页优化（2026-10-10 · 用户：「对订单中心这个页面进行全面优化」）
   ---------------------------------------------------------------------------
   实测（1920×1000，`#view` 内从上到下）：
     .oc-kpi-grid   3 张状态卡 92px —— 标签在最左、数字在最右，中间一大片空白
     .oc-chips      6 枚概览胶囊 22px —— 与下面页签的数字**完全重复**（页签才是筛选入口）
     .page-hero     68px —— 与顶栏已经写着的「订单中心 / ORDER CENTER」重复
     .oc-filtercard 168px —— 两行：页签+搜索 / 日期切片+操作按钮
     .oc-tbl-wrap   451px —— 表格只拿到一半高度
   最要命的一条：`.oc-table` 是 flex 子项且 `flex:1 0 auto` ⇒ 过滤到只剩 1~2 单时，
   表格被拉高到容器高度，浏览器把多出来的高度**平均分给 tbody 的行** ⇒ 一行 400px 高
   （用户第二、三张截图就是这个）。
   =========================================================================== */
/* ① 表格行不再被拉伸：表格按内容高度站住，容器该滚就滚 */
html[data-paper] #view:has(.oc-filtercard) .oc-tbl-wrap > .oc-table {
  flex: 0 0 auto !important; height: auto !important;
}
/* ② 顶部那排概览胶囊与页签数字重复 ⇒ 去掉一整行 */
html[data-paper] #view:has(.oc-filtercard) .oc-chips { display: none !important; }
/* ③ 状态卡：92 → 70px，标签与数字改成上下两行（原来中间空一大段） */
/* ⚠ 高度压不下来是因为 skin-paper 里有一条 (1,2,1) 的 `min-height:92px !important`
   （`html[data-paper] #view :is(.ui-kpi, …)`），min-height 优先于 height ⇒
   必须用更重的选择器（重复 id + 重复类）把它盖掉，且 height 与 min-height 一起写。 */
html[data-paper] body #view#view:has(.oc-filtercard) .oc-kpi-grid { gap: 12px !important; }
html[data-paper] body #view#view:has(.oc-filtercard) .oc-kpi-grid > .ui-kpi.ui-kpi {
  height: 70px !important; min-height: 70px !important; max-height: 70px !important; padding: 9px 16px !important;
  /* ★ 2026-10-10：这里上一版把标签与数字改成"上下两行、都靠左" ⇒ 卡片右侧空出 ~380px
     （三张卡合计空 1140px），看着"比例不对"。改回**标签靠左、数字靠右、垂直居中**——
     和卡片原生版式一致，只是高度从 92 收到 70。 */
  display: flex !important; flex-direction: row !important;
  align-items: center !important; justify-content: space-between !important; gap: 12px !important;
}
html[data-paper] body #view#view:has(.oc-filtercard) .oc-kpi-grid > .ui-kpi > span { font-size: 12px !important; color: var(--txt-3) !important; }
/* 数字尺寸交给全局那条 clamp(30px, 2.1vw, 44px)（见 §「值：跟着屏宽走一档」），这里不再单独写死 */
html[data-paper] body #view#view:has(.oc-filtercard) .oc-kpi-grid > .ui-kpi > b { line-height: 1.05 !important; }
/* ④ 页头横幅 68 → 34px：图标 46→20，标题与说明并成一行 */
html[data-paper] #view:has(.oc-filtercard) .page-hero {
  height: 34px !important; min-height: 0 !important; padding: 4px 14px !important; gap: 9px !important;
}
html[data-paper] #view:has(.oc-filtercard) .page-hero .page-hero-ic { width: 20px !important; height: 20px !important; border-radius: 6px !important; }
html[data-paper] #view:has(.oc-filtercard) .page-hero .page-hero-ic svg { width: 14px !important; height: 14px !important; }
html[data-paper] #view:has(.oc-filtercard) .page-hero .page-hero-txt { display: flex !important; align-items: baseline !important; gap: 10px !important; }
html[data-paper] #view:has(.oc-filtercard) .page-hero .page-hero-txt h2 { font-size: 14px !important; margin: 0 !important; }
html[data-paper] #view:has(.oc-filtercard) .page-hero .page-hero-txt p { font-size: 11px !important; margin: 0 !important; }
/* ⑤ 筛选卡收紧：搜索框不再撑满一行（它原来占 708px），操作按钮并到页签那一行（见 app.js 的 hoist） */
html[data-paper] #view:has(.oc-filtercard) .oc-filtercard { padding: 8px 12px 10px !important; gap: 6px !important; }
html[data-paper] #view:has(.oc-filtercard) .oc-tabs-row { min-height: 0 !important; gap: 10px !important; }
/* ⚠ 搜索框收窄到 292px 后，图标 + 输入框会换行 ⇒ 整行从 48px 涨到 62px；
   这里放宽到 330px 并禁止换行，行高回到 48px。 */
html[data-paper] body #view#view:has(.oc-filtercard) .oc-search {
  flex: 0 0 auto !important; width: 300px !important; flex-wrap: nowrap !important; align-items: center !important;
}
html[data-paper] body #view#view:has(.oc-filtercard) .oc-search input { max-width: 226px !important; min-width: 0 !important; width: 100% !important; }
html[data-paper] #view:has(.oc-filtercard) .oc-tabs { gap: 5px !important; }
html[data-paper] #view:has(.oc-filtercard) .oc-tabs .tab { padding: 0 8px !important; }
html[data-paper] #view:has(.oc-filtercard) #orderControls { padding-top: 0 !important; }
html[data-paper] #view:has(.oc-filtercard) .oc-acts { margin-left: auto !important; }


/* ===========================================================================
   66. 超宽屏（>1920）限宽居中：全站按 1920 设计稿显示（2026-10-10）
   ---------------------------------------------------------------------------
   实测：2560 屏上 `#view` 宽 2364px（1920 屏上是 1660）⇒ 卡片/表格被等比拉散，
   这正是用户说的"整个程序的页面显示比例"在 2K 上的表现。
   做法：整块 `.app`（左栏 + 内容）限宽 1920 并居中 —— 2560 屏上左右各留 320px 背景，
   内容宽度与 24 寸 1080p 上完全一致。**1920 及以下完全不生效**（媒体查询门槛 1921px），
   所以实验室机和 1366/1600 的机器一个字都不变。
   注：fixed 覆盖层（弹窗 / 抽屉 / 提示）仍按视口定位，不受影响。
   =========================================================================== */
@media (min-width: 1921px) {
  html[data-paper] body > .app { max-width: 1920px !important; margin-left: auto !important; margin-right: auto !important; }
}


/* ===========================================================================
   67. 逐页"收空"（一）：整条页签/工具条右半边全空（2026-10-10）
   ---------------------------------------------------------------------------
   量法：容器里"文字最右沿"到容器右边缘的距离（`_qctest` 扫描脚本）。
   命中（1920 屏、内容宽 1658）：
     中间质检 mqz-tabs  1445px 空 1083 · 线边物料 lm-tabs 1678px 空 1356 ·
     综合查询 q-tabs    1646px 空 1412 · 系统管理 am-tabs 1684px 空  946 ·
     设备管理 dv-bar    1646px 空 1442
   —— 都是"左边 3~6 个胶囊 + 右边一整片空"。做法：**让条本身贴合内容**
   （`width: fit-content` + `max-width: 100%`），条就成了左上角一枚正常长度的分段控件，
   而不是横贯整页的空槽。窄屏（胶囊会换行）时 `max-width:100%` 兜底，不会溢出。
   =========================================================================== */
html[data-paper] #view :is(.mqz-tabs, .lm-tabs, .q-tabs, .am-tabs, .dv-bar, .dv-tabs) {
  width: fit-content !important;
  max-width: 100% !important;
  /* ⚠ 中间质检那条还有一个 `flex: 1 1 0%`（父级是 flex 行）在撑宽它 —— fit-content 管不住，
     必须同时把 flex 收掉，否则它照样横贯整行。 */
  flex: 0 0 auto !important;
}

/* ===========================================================================
   68. 逐页"收空"（二）：工具条 / 图例条 / 状态条右半边全空（2026-10-10）
   ---------------------------------------------------------------------------
   同一次扫描命中的其余大类（左侧一排胶囊或一句话，右侧 600~1500px 空白）：
     订单构成/交期分布/交付周期达成/交期预警的筛选条 diag-toolbar（空 408~945）
     在制订单/交期预警/交期分布/交付周期达成的图例条 ps-lg / dg-stn-lg / dg-wkr-lg（空 407~774）
     生产动态的分段条 ovz-strip-seg（空 1217）· 扣料失败的状态条 nfz-runbar（空 1462）
     线边物料的工具条 pd-toolbar（空 810）· 重合登记的页头段 rm-head（空 797）
   做法同上：贴合内容（fit-content + max-width:100%），不再横贯整页。
   =========================================================================== */
html[data-paper] #view :is(.diag-toolbar, .dg-stn-lg, .dg-wkr-lg, .dg-mix-rest, .dg-coop-hd, .ps-lg,
  .nfz-runbar, .pd-toolbar, .ovz-strip-seg, .rm-head) {
  width: fit-content !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
}
/* 统计卡：同一排统一高度与内部基线（有副标 / 没副标不再一大一小） */
html[data-paper] #view :is(.ui-kpi, .dv-kpi-item, .pd-card, .rp-kpi-item, .q-kpi, .am-kpi-card, .rm-stat) {
  min-height: 88px !important;
}


/* ===========================================================================
   69. "很胖"的两处：数字跟屏幕走 / 空列占着整列（2026-10-10 · 工序看板）
   ---------------------------------------------------------------------------
   实测（1920 屏）：
     · KPI 六卡一排，每张只有 **271px** 宽，数字却被上一版按屏宽放大到 **40px** ⇒ 数字顶满卡片；
       而订单中心那种"三卡一排"的卡有 **550px** 宽，40px 才正好。
       ⇒ 数字改成**跟着卡片自身的宽度**走（容器查询 `cqw`），而不是跟着窗口：
         `clamp(26px, 8.5cqw, 44px)` —— 271px 卡 ≈ 26px · 412px 卡 ≈ 35px · 550px 卡 = 44px。
     · 看板 8 列等宽 195px，其中 **3 列是空的**（MS报告 / HPLC报告 / 入库，"本工序暂无在制"）
       却和满列一样宽 ⇒ 真正在用的 5 列被挤到 195px，卡里的客户名折成两行。
       ⇒ 空列收到 112px，余量分给在用的列（195 → 约 248px，+27%）。
   =========================================================================== */
html[data-paper] #view :is(.pk-card, .ui-kpi, .dv-kpi-item, .pd-card, .rp-kpi-item, .q-kpi, .am-kpi-card, .rm-stat) {
  container-type: inline-size;
}
html[data-paper] #view :is(.pk-val, .ui-kpi > b, .dv-kpi-item .val, .pd-card .val, .rp-kpi-item .val,
  .q-kpi .q-kpi-val, .am-kpi-card .am-kpi-val, .rm-stat .v, .hv-kpi b, .pd3-kpi-inner b) {
  font-size: clamp(26px, 8.5cqw, 44px) !important;
}
/* ⚠ 2026-10-10 用户明确否决："没有数据你也不能给我收窄" —— 空列必须和其它列**一样宽**，
   这一节已整段撤回（看板保持 8 列等宽）。 */


/* ===========================================================================
   70. 全站显示尺寸缩一档：0.9（2026-10-10 · 用户："整个程序页面的显示尺寸看起来很胖，
       是不是可以把比例适当的调小一点"）
   ---------------------------------------------------------------------------
   已实测四种写法（1920×1000 与 2560×1400 两个视口）：
     V1 `html{zoom:.9}`                → 侧栏 196→176、顶栏 59→53、KPI 卡高 104→94，**文档不滚**；
     V2 `html{zoom:.9}` + `html{w/h:calc(100%/.9)}` → 文档横向溢出 213px ✗
     V3 把补偿写到 body（用 vw/vh）     → 也不滚，但和 V1 等效；
     V4 `body{zoom:.9}` + 补偿          → 溢出 ✗
   ⚠ 上一轮（10-10 早）之所以判定"zoom 不能用"，就是因为当时**同时**写了 body 的宽度补偿
     （那个补偿让文档横向溢出 339px）—— 这次单挂 `html` 是干净的，所以正式采用 V1。
   效果：字体、行高、卡片高度、侧栏宽度这些**固定尺寸**整体 ×0.9；fluid 宽度仍铺满屏幕
   （布局视口同步放大到 1/0.9，所以不会出现横向留白或滚动条）。
   调档：把这里的 .9 改成 .85 / .95 即可；改回 1 就完全恢复。
   =========================================================================== */
html { zoom: 0.9 !important; }
@media (min-width: 1921px) {
  /* 缩放后"设计画布"变成 1920/0.9 ≈ 2133，所以超宽屏的限宽阈值也要跟着换 */
  html[data-paper] body > .app { max-width: 2133px !important; }
}


/* ===========================================================================
   65. 订单中心收尾：吸顶表头 + 搜索框（2026-10-10 · 用户：「滚动的时候表头很割裂，
       还有搜索框很怪异，感觉像是在套壳」）
   ---------------------------------------------------------------------------
   ① 表头割裂（实测）：`th` 是 `position:sticky; top:0; z-index:2`，但
      `background: rgba(0,0,0,0)` —— **全透明**。行从下面滑过时两层文字叠在一起，
      所以滚动看着像表头裂开了。做法：吸顶表头给**不透明底** + 底边发丝线 +
      一道向下的极淡投影（行滑到下面时有一条干净的"屋檐"）。
   ② 搜索框"套壳"（实测）：外层 `.oc-search` 有底色 #F5F9FE + 1px 边框 + 圆角 6px，
      里面 `<input>` 又是白底 + 1px 边框 + 圆角 8px ⇒ 框套框。
      做法：只留**一层壳** —— 容器＝可视输入框（白底/描边/圆角/内边距），
      里面的 input 边框与底色全部透明，聚焦时整块给一圈品牌色光环。
   =========================================================================== */
/* ⚠ 两条实测踩到的坑：
   ① 容器 `.oc-tbl-wrap` 有 `padding:18px`，吸顶表头 `top:0` 是相对**滚动视口**（含内边距）
      定位的 ⇒ 行会从表头上方那 18px 里滑过去，看着就是"表头裂开"。
      所以必须把容器上内边距去掉，表头才会贴着滚动区顶端。
   ② `skin-paper.css` 里有一条 `html[data-paper][data-paper][data-paper]:not([data-theme]) #view table thead th`
      （特异性 (1,4,5)，带 !important 的渐变底）—— 普通选择器压不住，必须用重复 id + 重复类。 */
html[data-paper] body #view#view:has(.oc-filtercard) .oc-tbl-wrap { padding-top: 0 !important; }
html[data-paper] body #view#view:has(.oc-filtercard) .oc-tbl-wrap .oc-table thead th.oc-th,
html[data-paper] body #view#view:has(.oc-filtercard) .oc-tbl-wrap .oc-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #F7FAFE !important;
  background-image: none !important;
  box-shadow: 0 1px 0 var(--sk-line), 0 8px 12px -10px rgba(68, 68, 68, .6) !important;
}
/* table 原本的 overflow:hidden 会成为 sticky 的最近滚动祖先，导致 thead 跟着表格移出视口。
   clip 保留圆角裁剪，但不创建滚动容器，让表头以外层 .oc-tbl-wrap 为吸顶参照。 */
html[data-paper] #view:has(.oc-filtercard) .oc-tbl-wrap .oc-live-table {
  overflow: clip !important;
}
html[data-paper] #view:has(.oc-filtercard) .oc-tbl-wrap .oc-table thead th:first-child {
  border-top-left-radius: 8px !important;
}
html[data-paper] #view:has(.oc-filtercard) .oc-tbl-wrap .oc-table thead th:last-child {
  border-top-right-radius: 8px !important;
}
/* ② 搜索框：一层壳 */
html[data-paper] body #view#view:has(.oc-filtercard) .oc-search {
  background: #FFFFFF !important;
  border: 1px solid var(--sk-line) !important;
  border-radius: 10px !important;
  padding: 0 10px !important;
  gap: 8px !important;
  transition: border-color .15s, box-shadow .15s;
}
html[data-paper] body #view#view:has(.oc-filtercard) .oc-search > input {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  height: 30px !important;
}
html[data-paper] body #view#view:has(.oc-filtercard) .oc-search > input:focus {
  outline: none !important;
  box-shadow: none !important;
}
html[data-paper] body #view#view:has(.oc-filtercard) .oc-search:focus-within {
  border-color: var(--ui-brand-600) !important;
  box-shadow: 0 0 0 3px rgba(26, 123, 217, .10) !important;
}


/* ===========================================================================
   71. 工序看板收尾（2026-10-10 · 用户：「这一档看着舒服多了，工序看板这个页面再好好
       设计一下，让他看起来更舒服一些，还有本工序暂无在制的卡片标题高度需要和有内容的
       高度一致才可以，现在的会低一些」）
   ---------------------------------------------------------------------------
   实测（1920×956 · 页面比例 0.9）：
     · 空列 `.stcol.is-empty` 被 polish.css 的 `padding:12px 10px` 往里撑了 12/10px
       ⇒ 列头 `.sthd` 比别的列**低 11px、窄 18px**（列头自身高 42.7px 与别的列一样，
       不齐的是**位置**）；列托底色也不同（空列 #F7FAFE 实色，别的列是
       #F8FBFF→#EFF5FC 渐变）。八列摆在一起就"看着不齐"。
     · 负载条 `.sthb` 实测只有 **0.85px** —— `.stcol` 是 flex 列，子项默认 flex-shrink:1，
       列体内容一高就把 4px 的负载条挤没了 ⇒ 这条"每列负载"其实一直是看不见的。
     · 订单卡实测 126 / 135 / 149px 三种高度：客户名一行还是两行、有没有角标行，
       都会改卡片高度，同一列读起来高矮参差。
   本节做法（结构一字不动，只调观感）：
     ① 空列 = 有内容列：padding 归零 + 列高 100% + 底色/描边同款 ⇒ 八个列头一条线；
     ② 负载条钉成 3px（flex:0 0 3px）当"列头下沿"：有单据＝品牌色进度，0 单＝空轨道，
        天然就是一条干净的分隔线（同时把列头那条 1px 灰边去掉，避免双线）；
     ③ 卡片：客户名固定两行位、角标行固定一行位 ⇒ 同列卡片**等高**（默认 158px）；
     ④ "本工序暂无在制"改成**幽灵卡**：与订单卡等高、虚线框，图标+文字钉在**卡片首行
        的高度**（左对齐、同样的内边距），不再是整列居中的小方块；
     ⑤ 顺手：整张卡给手型光标（卡本身就是点开单的入口）。
   调档：卡片/幽灵卡高度由 `--ocb-card-h` 控制（一处改，全看板生效）。
   =========================================================================== */
/* 卡片自然高度实测 ≈159px（内距 20 + 三行信息 + 4px 进度条 + 交期行 + 角标行，内容撑出来的），
   幽灵卡取同一个值 ⇒ 空列与有内容列等高、且标题落在同一高度 */
html[data-paper] #view .board { --ocb-card-h: 159px; }

/* ① 空列与有内容列完全同款 */
html[data-paper] body #view#view .board > .stcol.is-empty {
  padding: 0 !important;
  align-self: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
}
html[data-paper]:not([data-theme="dark"]) body #view#view .board > .stcol.is-empty {
  background: linear-gradient(180deg, #F8FBFF 0%, #EFF5FC 100%) !important;
  border-color: #C9D8EC !important;
}

/* ② 负载条：钉成 3px，当列头下沿用 */
html[data-paper] body #view#view .board > .stcol > .sthb {
  flex: 0 0 3px !important;
  height: 3px !important;
  background: rgba(37, 37, 37, .08) !important;
}
html[data-paper][data-theme="dark"] body #view#view .board > .stcol > .sthb {
  background: rgba(255, 255, 255, .10) !important;
}
html[data-paper] body #view#view .board > .stcol > .sthb > i {
  border-radius: 0 999px 999px 0 !important;
  min-width: 0 !important;
}
html[data-paper] body #view#view .board > .stcol > .sthd { border-bottom: 0 !important; }

/* ③ 订单卡等高 */
html[data-paper] body #view#view .board .ocard {
  display: flex;
  flex-direction: column;
  cursor: pointer;
}
html[data-paper] body #view#view .board .ocard .oc { min-height: 32px; }   /* 固定两行位 */
/* 交期行 + 角标行钉在卡片底部：等高之后，同一列所有卡的"交期行"落在同一条线上 */
/* ★ 并入 §72 的判断：进度条本身就横在「板号行 / 交期行」之间当分隔线，
   再给交期行加一道 1px 上边线＋6px 上内距就是**双线**（实测两条线贴在一起 5px 厚），
   所以这里把 §22 那道分隔线与内距去掉，卡片同时矮 7px（更紧凑）。 */
html[data-paper] body #view#view .board .ocard .odue {
  margin-top: auto !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}
html[data-paper] body #view#view .board .ocard .otags {
  min-height: 18px !important;                                            /* 固定一行角标位 */
  margin-top: 6px !important;
}

/* ④ 空态＝幽灵卡（与订单卡等高、首行同高） */
html[data-paper] body #view#view .board > .stcol.is-empty > .stcb {
  padding: 10px !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
}
html[data-paper] body #view#view .board > .stcol.is-empty .stcol-empty {
  min-height: var(--ocb-card-h) !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 10px 12px 10px 14px !important;   /* 与订单卡同内边距 ⇒ 标题落在同一高度 */
  border: 1px dashed var(--ui-line-200) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .62) !important;
  text-align: left !important;
  color: var(--sk-ink-3) !important;
  font-size: 11px !important;
  line-height: 19px !important;
  font-variant-numeric: tabular-nums;
}
html[data-paper][data-theme="dark"] body #view#view .board > .stcol.is-empty .stcol-empty {
  background: rgba(255, 255, 255, .04) !important;
}
/* 那个 40px 大圆图标在这里太大、还会把文字顶到第二行 ⇒ 收成与文字同高的一枚 14px 小图标 */
html[data-paper] body #view#view .board > .stcol.is-empty .stcol-empty::before {
  flex: none !important;
  width: 14px !important;
  height: 14px !important;
  margin: 3px 0 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: .85 !important;
  background: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2392A5BF' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='M3 8l3-4h12l3 4v11a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z'/><path d='M3 8h5l1.5 2.5h5L16 8h5'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 14px 14px !important;
}


/* ===========================================================================
   72. 工序看板：工序分组配色（2026-10-10 · 用户：「我觉得可以按照你的思路再好好优化一下」）
   ---------------------------------------------------------------------------
   思路：这 8 列不是平级的 —— 前 5 列（合成 / 氨解 / 接酯 / 纯化 / 分装）是**生产工序**，
   后 3 列（MS报告 / HPLC报告 / 入库）是**报告 / 入库**环节（实测长期为空）。
   八列长得一模一样时，要看出"哪几列真正在制、哪几列只是在等报告 / 入库"只能靠读字。

   做法：一个变量族挂在列上，四处生效（DOM 只多了一个 is-post 类名，排版零改动）：
     · `--ocb-accent`    生产工序＝品牌蓝；报告 / 入库＝青绿
     · 生效处：列头计数胶囊、该列负载条填充、该列卡片左缘条（仅"正常"卡）、空态虚线框描边、
               卡片 hover 描边
   ⚠ 「状态优先于分组」：延期（红）与未生产（琥珀）保持自己的左缘条与描边，不被列色盖掉 ——
      所以选择器一律带 `:not(.over):not(.unprod)`。
   ⚠ 列色只落在"该列自己的元素"上，不跨列、不改托盘底色（上一轮刚把八列托盘统一，不能再分家）。
   =========================================================================== */
html[data-paper] body #view#view .board > .stcol {
  --ocb-accent: var(--ui-brand-600);
  --ocb-accent-ink: var(--ui-brand-700);
  --ocb-accent-soft: rgba(26, 123, 217, .10);
  --ocb-accent-line: rgba(26, 123, 217, .30);
}
html[data-paper] body #view#view .board > .stcol.is-post {
  --ocb-accent: #12A594;
  --ocb-accent-ink: #0B7A6D;
  --ocb-accent-soft: rgba(18, 165, 148, .12);
  --ocb-accent-line: rgba(18, 165, 148, .34);
}
html[data-paper][data-theme="dark"] body #view#view .board > .stcol.is-post {
  --ocb-accent: #2BB8A6;
  --ocb-accent-ink: #5FD3C4;
  --ocb-accent-soft: rgba(18, 165, 148, .22);
  --ocb-accent-line: rgba(43, 184, 166, .42);
}
/* 列头计数胶囊（0 单仍是中性灰，不参与分组色） */
html[data-paper] body #view#view .board > .stcol .sthc:not(.is-zero) {
  color: var(--ocb-accent-ink) !important;
  background: var(--ocb-accent-soft) !important;
}
/* 负载条填充 */
html[data-paper] body #view#view .board > .stcol .sthb > i { background: var(--ocb-accent) !important; }
/* 卡片左缘条：正常卡跟随列色 */
html[data-paper] body #view#view .board > .stcol .ocard:not(.over):not(.unprod)::before {
  background: var(--ocb-accent) !important;
}
/* 卡片 hover 描边：也用列色（延期 / 未生产保持自己的语义色） */
html[data-paper] body #view#view .board > .stcol .ocard:not(.over):not(.unprod):hover {
  border-color: var(--ocb-accent) !important;
}
/* 空态虚线框描边跟随列色 */
html[data-paper] body #view#view .board > .stcol.is-empty .stcol-empty {
  border-color: var(--ocb-accent-line) !important;
}

/* 标题行图例（颜色含义一句话说清；窄屏让位给"← 横向滚动 →"提示） */
html[data-paper] #view .board-legend {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: 10px; font-size: 11px; color: var(--sk-ink-3);
}
html[data-paper] #view .board-legend i { display: inline-block; width: 7px; height: 7px; border-radius: 999px; }
html[data-paper] #view .board-legend i.is-proc { background: var(--ui-brand-600); }
html[data-paper] #view .board-legend i.is-post { background: #12A594; margin-left: 6px; }
@media (max-width: 1440px) {
  html[data-paper] #view .board-legend { display: none; }
}


/* ===========================================================================
   73. 工序看板：把"卡片下方那块空"用起来（2026-10-10 · 用户：「还有卡片下方还有一些
       白色的区域我希望可以利用上」）
   ---------------------------------------------------------------------------
   实测（1920×956 · 页面比例 0.9）：
     · 看板本体 566px（贴满首屏剩余高度），但**列托盘只有 518px** —— 底下空出 **48px
       白条**横贯整块看板。根因：skin-paper 早先给 `.board > .stcol` 写了 `height:100%`
       （想"列等高"），可这一页的看板是**固定高度**的 grid，百分比高度反而让托盘按内容
       高度落地，`align-items:stretch` 也就拉不起来了。
     做法：
       ① 托盘回到"拉伸"：`height:auto` + `align-self:stretch` ⇒ 八列托盘与看板同高，
          那条白条直接变成列的一部分（不再有"看板留白"）；
       ② 空列：幽灵卡 `flex:1` 铺满整列（标题仍在卡片首行的高度，上一轮的对齐不丢），
          整列读起来是"这一列确实是空的"，而不是"一个小方块浮在一大片空托盘里"；
       ③ 有单的列：底部加一条**列小结**（最早交期 / 最久已放置，两行、11px、右对齐数值，
          紧迫度沿用卡片同一套颜色）—— 空出来的那截托盘就有内容了。
   ⚠ 小结条是列内的固定元素（不进 `.stcb` 滚动区），所以列内滚动时它始终贴在列底。
   =========================================================================== */
/* ① 托盘拉伸（只针对"看板高度固定"的宽屏形态；≤1280 是 4×2 行各自封顶的形态，保持原样）
   ⚠ 三条规则缺一不可，实测每一条都能单独把版面弄坏：
     · app.css `.stcol{max-height:calc(100vh - 380px)}`（1920×956 下正好 576px）是托盘长不上去的闸门；
     · 解掉它之后，grid 子项的 `min-height:auto`（自动最小尺寸＝内容高度）会让八列被内容
       撑到 2600px 冲出看板 → 必须压 min-height；
     · 看板本身是 flex 子项（`flex:1 0 auto`），同理要压它的 min-height，`height:clamp()` 才生效；
     · 隐式行是 auto，仍会按 max-content 撑高 → 显式 `grid-template-rows:1fr` 钉住行高。
   超出部分照旧在 `.stcb` 里滚动（列内滚动条不变）。 */
@media (min-width: 1281px) {
  /* ★ 关键一步：看板是 flex 子项，`flex:1 1 auto` 的 flex-basis 是 auto ⇒ 基准尺寸取
     **内容尺寸**，于是八列的内容一高（解掉 max-height 之后 = 2600px）它跟着长、整页被撑开。
     改成 `flex:1 1 0`：基准 0，只吃"父容器剩下的那块高度" —— 高度重新变成确定的，
     托盘才有东西可拉伸。 */
  html[data-paper] body #view#view .board-panel > .board {
    flex: 1 1 0 !important;
    min-height: 0 !important;
  }
  html[data-paper] body #view#view .board > .stcol {
    height: auto !important;
    align-self: stretch !important;
    max-height: none !important;
    min-height: 0 !important;
  }
  html[data-paper] body #view#view .board {
    min-height: 0 !important;
    grid-template-rows: 1fr !important;
  }
}
html[data-paper] body #view#view .board > .stcol > .stcb { min-height: 0 !important; }
/* ② 空列的幽灵卡铺满（min-height 仍是一张卡的高度，不会比卡片矮） */
html[data-paper] body #view#view .board > .stcol.is-empty .stcol-empty {
  flex: 1 1 auto !important;
}
/* ③ 列小结 */
html[data-paper] #view .board .stfo {
  flex: 0 0 auto;
  display: flex; flex-direction: column; gap: 2px;
  padding: 7px 10px 8px;
  border-top: 1px solid var(--ui-line-100);
  font-size: 11px; line-height: 1.5;
}
html[data-paper] #view .board .stfo > div {
  display: flex; align-items: baseline; justify-content: space-between; gap: 6px;
}
html[data-paper] #view .board .stfo > div > span { color: var(--sk-ink-3); }
html[data-paper] #view .board .stfo > div > b {
  color: var(--sk-ink-2); font-weight: 800;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
html[data-paper] #view .board .stfo > div > b.is-near { color: var(--ui-warn-ink); }
html[data-paper] #view .board .stfo > div > b.is-hot { color: var(--ui-danger-solid); }
@media (max-width: 1280px) {
  /* 窄屏看板是"4 列 × 2 行、各自封顶"的形态，别把小结条撑成一截空白 */
  html[data-paper] #view .board .stfo { display: none; }
}


/* ===========================================================================
   74. 订单卡片精修（2026-10-10 · 用户：「订单卡片的样式能不能做的更精美一些」）
   ---------------------------------------------------------------------------
   改前卡片是 8 段信息平铺、行距靠 margin 堆：单号 / 客户 / 「板号 + 行数」 / 进度条 /
   交期 + 剩余天数 + 已放置 / 角标；行数挤在板号行里跟"板号 +N"抢位置，剩余天数全靠
   灰红文字区分，卡内还会在"进度条 → 交期行"之间留一条空档（等高卡的余量）。
   本节做四件事（结构只多了一个身份行 .otop，其余全部是样式）：
     ① **身份行**：单号（等宽加粗）＋右端行数；下面客户 → 板号 → 进度 → 交期 → 角标，
        信息按「身份 → 归属 → 状态」逐层下落；
     ② **交期胶囊**：≤1 天＝红胶囊、≤3 天＝琥珀胶囊、>3 天＝素文字、合作豁免＝中性胶囊。
        胶囊只在"要盯"的时候出现 ⇒ 卡面上"有胶囊"本身就是信号；
     ③ **余量归位**：客户名那一格 `flex:1`，等高卡多出来的高度落在"客户名 → 板号"之间，
        不再是卡中间挖一个洞（交期行与角标行稳定贴底，同列卡片对齐成一条线）；
     ④ 细节：板号"+N"从**实心蓝药丸**降成浅蓝胶囊（卡里最跳的颜色留给状态）、角标统一
        17px、进度条 4px 胶囊、边线与投影收细一档。
   =========================================================================== */
html[data-paper] body #view#view .board .ocard {
  padding: 10px 11px 9px 13px !important;
  box-shadow: 0 1px 2px rgba(23, 32, 43, .04), 0 8px 18px -16px rgba(23, 32, 43, .5) !important;
}
/* ① 身份行 */
html[data-paper] body #view#view .board .ocard .otop {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
}
html[data-paper] body #view#view .board .ocard .otop > .od {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-paper] body #view#view .board .ocard .otop > .ometa-qty {
  flex: none; font-size: 11px; font-weight: 800;
  color: var(--sk-ink-2) !important; font-variant-numeric: tabular-nums;
}
/* ③ 客户名吸收余量 ⇒ 交期行与角标行稳定贴底 */
html[data-paper] body #view#view .board .ocard .oc { flex: 1 1 auto; }
/* ④ 节奏收紧：板号行不再留 6px 下边距，进度条 8px 起 */
html[data-paper] body #view#view .board .ocard .ometa { margin-bottom: 0 !important; }
html[data-paper] body #view#view .board .ocard .pbar { margin-top: 8px !important; }
/* ② 交期行与胶囊 */
html[data-paper] body #view#view .board .ocard .odue {
  /* ⚠ flexbox 的规矩：**auto 外边距吃掉全部剩余空间、flex-grow 反而拿不到**
     （规范 §8.1）。上一版把余量交给交期行的 auto 外边距，结果卡中间挖了个洞；
     这里改成固定 6px，余量交给客户名那一格（`.oc{flex:1}`）⇒ 洞挪到"客户名 → 板号"之间，
     底部的「板号 + 进度 + 交期 + 角标」稳定贴底。 */
  margin-top: 6px !important; padding-top: 0 !important; border-top: 0 !important;
}
html[data-paper] body #view#view .board .ocard .odue-k {
  color: var(--sk-ink-3); white-space: nowrap; font-variant-numeric: tabular-nums;
}
/* 角标行：左端"已放置"，右端状态角标（角标行本来就占着固定高度，不额外撑卡） */
html[data-paper] body #view#view .board .ocard .otags { justify-content: flex-end !important; }
html[data-paper] body #view#view .board .ocard .otags > .ostay {
  margin-right: auto; color: var(--sk-ink-3);
  font-size: 11px; line-height: 17px; font-variant-numeric: tabular-nums; white-space: nowrap;
}
html[data-paper] body #view#view .board .ocard .opill {
  padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; line-height: 15px; font-weight: 800;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
html[data-paper] body #view#view .board .ocard .opill.is-hot { background: rgba(198, 45, 60, .12); color: #B3202E; }
html[data-paper] body #view#view .board .ocard .opill.is-near { background: rgba(217, 119, 6, .14); color: var(--ui-warn-ink); }
html[data-paper] body #view#view .board .ocard .opill.is-exempt { background: rgba(120, 130, 150, .16); color: #5C6675; }
html[data-paper][data-theme="dark"] body #view#view .board .ocard .opill.is-hot { background: rgba(226, 85, 79, .20); color: #F3A6AB; }
html[data-paper][data-theme="dark"] body #view#view .board .ocard .opill.is-near { background: rgba(217, 119, 6, .22); color: #F5C77E; }
html[data-paper][data-theme="dark"] body #view#view .board .ocard .opill.is-exempt { background: rgba(148, 148, 148, .20); color: #D9D9D9; }
/* 板号"+N"：实心蓝药丸 → 浅蓝胶囊（最跳的颜色留给"延期/未生产"这类状态） */
html[data-paper] body #view#view .board .ocard .ometa .board-more {
  background: rgba(26, 123, 217, .10) !important;
  color: var(--ui-brand-700) !important;
  padding: 1px 7px !important; border-radius: 999px !important;
  font-size: 10.5px !important; line-height: 15px !important; font-weight: 800 !important;
}
/* 角标：统一 17px、10.5px 字 */
html[data-paper] body #view#view .board .ocard .otags .badge {
  height: 17px !important; line-height: 17px !important;
  padding: 0 8px !important; font-size: 10.5px !important;
}

/* ⚠ 上面这些精细规则是按 `.board` 写的（要压过 §21/§22 同族的 !important）。
   可这张卡**同时**用在"点工序名弹出的明细抽屉"里 —— 实测那条链是
     BODY → #modal.modal-bg.show → #modalBody → .station-detail-grid → .ocard
   **完全不在 `#view` 里**，所以带 `#view` 的通用规则根本匹配不到（第一版就踩了这个）。
   本轮新引入的结构（身份行 .otop / 交期胶囊 .opill / 角标行左侧的"已放置" .ostay）
   必须写成**不带 #view** 的通用规则，否则抽屉里的卡会把"单号"和"行数"折成两行。
   （`.opill` / `.ostay` / `.otop` 这三个类名全站只有这里的卡片在用，不会误伤别的模块。） */
html[data-paper] .ocard .otop {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
}
html[data-paper] .ocard .otop > .od {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-paper] .ocard .otop > .ometa-qty {
  flex: none; font-size: 11px; font-weight: 800;
  color: var(--sk-ink-2); font-variant-numeric: tabular-nums;
}
html[data-paper] .ocard .otags { justify-content: flex-end !important; }
html[data-paper] .ocard .otags > .ostay {
  margin-right: auto; color: var(--sk-ink-3);
  font-size: 11px; line-height: 17px; font-variant-numeric: tabular-nums; white-space: nowrap;
}
html[data-paper] .ocard .opill {
  padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; line-height: 15px; font-weight: 800;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
/* 交期行只有「交期 + 胶囊」两段时，把胶囊压到右端（看板与抽屉两个上下文一致） */
html[data-paper] .ocard .odue > .opill:last-child { margin-left: auto; }
html[data-paper] .ocard .opill.is-hot { background: rgba(198, 45, 60, .12); color: #B3202E; }
html[data-paper] .ocard .opill.is-near { background: rgba(217, 119, 6, .14); color: var(--ui-warn-ink); }
html[data-paper] .ocard .opill.is-exempt { background: rgba(120, 130, 150, .16); color: #5C6675; }
html[data-paper][data-theme="dark"] .ocard .opill.is-hot { background: rgba(226, 85, 79, .20); color: #F3A6AB; }
html[data-paper][data-theme="dark"] .ocard .opill.is-near { background: rgba(217, 119, 6, .22); color: #F5C77E; }
html[data-paper][data-theme="dark"] .ocard .opill.is-exempt { background: rgba(148, 148, 148, .20); color: #D9D9D9; }
/* 进度条：轨道压深一档（0 进度也看得出"这里有一条进度"），两端圆头 */
html[data-paper] .ocard .pbar { background: rgba(23, 32, 43, .07); border-radius: 999px; }
html[data-paper] .ocard .pbar > i { border-radius: 999px; }
html[data-paper][data-theme="dark"] .ocard .pbar { background: rgba(255, 255, 255, .10); }


/* ===========================================================================
   75. 订单卡片：进度读数 + 列内排序（2026-10-10 · 用户：「继续吧」）
   ---------------------------------------------------------------------------
   ① 进度读数：进度条右端补一行 `已完成 N/8`（等宽数字、10.5px、灰字）。取数与悬停提示
      同源（cardDoneStations），所以 hover 里那句"已完成 3/8 工序 · 当前：纯化 · 已放置 14h"
      现在有个**常显的缩写**在卡面上；取不到完成数时不显示数字，进度条自动占满整行。
   ② 列内排序：原来列里是后端给的原始顺序（`byStation[s].push(o)`，不排），最急的单可能
      排在第三张；而列底小结写的又是"最早交期"，两边对不上。现在按「交期早的在前 →
      同交期未生产的在前 → 再同则本工序停留久的在前」稳定排序（**只排显示，不动数据**）。
   =========================================================================== */
html[data-paper] .ocard .prow {
  display: flex; align-items: center; gap: 6px;
}
html[data-paper] body #view#view .board .ocard .prow { margin-top: 8px; }
html[data-paper] body #view#view .board .ocard .prow > .pbar { margin-top: 0 !important; flex: 1 1 auto; min-width: 0; }
html[data-paper] .ocard .pnum {
  /* line-height 收到 1：这一行的高度由 4px 进度条主导，数字只占 10.5px，
    卡片因此只长 ~6px（不放数字时是 4px 一整条）。 */
  flex: none; font-size: 10.5px; line-height: 1; font-weight: 700;
  color: var(--sk-ink-3); font-variant-numeric: tabular-nums;
}


/* ===========================================================================
   76. 订单卡片：8 段步进 + 客户首字色块（2026-10-10 · 用户：「继续」）
   ---------------------------------------------------------------------------
   ① 进度的读法从"一根连续条"升级成"8 段步进"：每段＝一道工序（合成→…→入库），
      已完成＝实心（列色；延期卡红、未生产卡琥珀）、**当前道次＝描边高亮**、未到＝空心。
      连续条只告诉你"走了多少"，步进还告诉你"卡在哪一道"。右端 `N/8` 读数保留。
      数据同源：cardDoneStations（已完成数）+ cardCurTiming（当前道次 si）；
      两个都取不到时，退回一根连续条（旧观感，不会渲染出空壳）。
   ② 客户首字色块：15px 圆角方块 + 客户名首字，底色/字色按**客户名哈希**取 6 组淡色之一
      （蓝 / 青 / 紫 / 琥珀 / 绿 / 灰，全部是本站既有色系的 .13 淡底 + 深字），
      同一客户永远同色 ⇒ 扫一眼就能把"同一客户的单"归堆。纯装饰、不参与任何判断。
   =========================================================================== */
html[data-paper] .ocard .steps {
  display: flex; align-items: center; gap: 2px;
  flex: 1 1 auto; min-width: 0;
}
html[data-paper] .ocard .steps > i {
  flex: 1 1 0; min-width: 0; height: 5px; border-radius: 999px;
  background: rgba(23, 32, 43, .09);
}
html[data-paper][data-theme="dark"] .ocard .steps > i { background: rgba(255, 255, 255, .12); }
html[data-paper] .ocard .steps > i.is-done { background: var(--ui-brand-600); }
/* ★ 2026-10-11："不经过"的工序 —— 斜纹灰块（跟订单明细矩阵里 `⊘ 跳过` 同一套语言），
   不再跟"未到"（空心）混为一谈。 */
html[data-paper] .ocard .steps > i.is-skip {
  background: repeating-linear-gradient(135deg,
    rgba(122, 134, 150, .55) 0 2px, rgba(122, 134, 150, .10) 2px 5px);
  box-shadow: inset 0 0 0 1px rgba(122, 134, 150, .22);
}
html[data-paper] body #view#view .board .ocard .steps > i.is-done { background: var(--ocb-accent); }
html[data-paper] body #view#view .board .ocard.over .steps > i.is-done { background: var(--ui-danger-solid); }
html[data-paper] body #view#view .board .ocard.unprod .steps > i.is-done { background: var(--ui-warn-solid); }
/* 当前道次：描边 + 淡底，比实心段略高 2px（一眼看出"就卡在这一道"） */
html[data-paper] .ocard .steps > i.is-cur {
  height: 7px;
  background: rgba(26, 123, 217, .18);
  box-shadow: inset 0 0 0 1.5px var(--ui-brand-600);
}
html[data-paper] body #view#view .board .ocard .steps > i.is-cur {
  background: var(--ocb-accent-soft);
  box-shadow: inset 0 0 0 1.5px var(--ocb-accent);
}
html[data-paper] body #view#view .board .ocard.over .steps > i.is-cur {
  background: rgba(198, 45, 60, .18);
  box-shadow: inset 0 0 0 1.5px var(--ui-danger-solid);
}
html[data-paper] body #view#view .board .ocard.unprod .steps > i.is-cur {
  background: rgba(217, 119, 6, .18);
  box-shadow: inset 0 0 0 1.5px var(--ui-warn-solid);
}
/* 取不到步进数据时退回的连续条 */
html[data-paper] .ocard .steps > i.is-bar { flex: 0 0 auto; background: var(--ui-brand-600); height: 5px; }
html[data-paper] body #view#view .board .ocard .steps > i.is-bar { background: var(--ocb-accent); }
html[data-paper] body #view#view .board .ocard.over .steps > i.is-bar { background: var(--ui-danger-solid); }
html[data-paper] body #view#view .board .ocard.unprod .steps > i.is-bar { background: var(--ui-warn-solid); }

/* ② 客户首字色块 */
html[data-paper] .ocard .cav {
  flex: none; align-self: center; margin-right: 6px;
  width: 15px; height: 15px; border-radius: 5px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 9.5px; font-weight: 800; line-height: 1;
  background: rgba(26, 123, 217, .13); color: #0F63B4;
}
/* ⚠ 客户色块**只用冷色**（蓝/青/紫/靛/蓝绿/石板灰）—— 红、琥珀这两个色位留给"延期/未生产"
   这类状态，客户色块不参与状态语义，避免出现"这张卡的客户色是红的，到底是不是逾期"的误读。 */
html[data-paper] .ocard .cav.n2 { background: rgba(18, 165, 148, .14); color: #0B7A6D; }
html[data-paper] .ocard .cav.n3 { background: rgba(124, 92, 214, .14); color: #5A44A8; }
html[data-paper] .ocard .cav.n4 { background: rgba(79, 107, 237, .14); color: #3B4FD8; }
html[data-paper] .ocard .cav.n5 { background: rgba(8, 145, 178, .14); color: #0E7490; }
html[data-paper] .ocard .cav.n6 { background: rgba(100, 116, 139, .16); color: #475569; }
html[data-paper][data-theme="dark"] .ocard .cav { background: rgba(26, 123, 217, .26); color: #A8CBF2; }
html[data-paper][data-theme="dark"] .ocard .cav.n2 { background: rgba(18, 165, 148, .28); color: #8FE0D4; }
html[data-paper][data-theme="dark"] .ocard .cav.n3 { background: rgba(124, 92, 214, .28); color: #C9B8F5; }
html[data-paper][data-theme="dark"] .ocard .cav.n4 { background: rgba(79, 107, 237, .30); color: #B9C4FA; }
html[data-paper][data-theme="dark"] .ocard .cav.n5 { background: rgba(8, 145, 178, .28); color: #A5E3F0; }
html[data-paper][data-theme="dark"] .ocard .cav.n6 { background: rgba(148, 163, 184, .24); color: #D3DBE5; }


/* ===========================================================================
   77. 工序看板：列头"第 N 道"序号 + 当前道次呼吸（2026-10-10 · 用户：「我觉得可以做一下」）
   ---------------------------------------------------------------------------
   ① 列头序号：卡片上的 8 段步进是按 STATION_ORDER 排的，但列本身没有序号，
      "3/8"到底对应哪一列只能靠数。列头加一枚**圆圈序号**（描边式，跟卡片上那枚
      **实心**的客户首字色块区分开），颜色跟随该列的列色（生产工序蓝 / 报告·入库青绿）。
   ② 当前道次呼吸：只动那一段（5×7px 的 opacity 动画，compositor 友好、不触发布局），
      不整卡闪 —— 2026-10-08 已经因为"几十张卡一起脉冲"吃过亏（廉价感 + 白烧 GPU）。
      这里额外遵守系统"减少动态效果"：`prefers-reduced-motion: reduce` 时不动。
   =========================================================================== */
html[data-paper] #view .board > .stcol .sthd .sthn-n {
  flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; border-radius: 999px;
  border: 1px solid var(--ocb-accent);
  color: var(--ocb-accent-ink);
  font-size: 9.5px; font-weight: 800; line-height: 1;
  font-variant-numeric: tabular-nums;
}
@keyframes ocbCurPulse { 0%, 100% { opacity: 1; } 50% { opacity: .42; } }
html[data-paper] .ocard .steps > i.is-cur {
  animation: ocbCurPulse 1.6s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  html[data-paper] .ocard .steps > i.is-cur { animation: none; }
}


/* ===========================================================================
   78. 生产动态页：KPI 底注对齐 + 流水表列对齐/斑马（2026-10-10 · 用户：「接下来开始优化
       生产动态页面…我希望你也可以好好规划一下并进行优化」）
   ---------------------------------------------------------------------------
   先说**量出来的**四个真问题（无头浏览器 1920×956 实测，不是观感）：
     ① KPI 四张卡的底注 `.k-cap` 不在一条线上：卡 1 的 y=273，其余三张 y=246/247，
        **差 26px**。根因：`.k-viz`（迷你折线）与 `.k-cap`（底注）**都**写了 `margin-top:auto`，
        于是卡 1 里那点余量被两者平分，底注被顶下去半格；没有迷你图的三张卡余量全给底注。
     ② 流水行右侧三段（工序 / 交期 / 状态）在 `.tl-key`（实测 559px）里是普通 flex，
        段位由**前一段的实宽**决定 —— 今天的工序名都是 2 个字（分装/入库）才碰巧对齐，
        一旦出现「HPLC报告」这种 4 字段，后面两列立刻整体右移。
     ③ 一行 1650px 里有约 **1000px 空档**（`.tl-cust` 727px 只用 ~130px，`.tl-key` 559px
        只用 ~150px），而整行**没有斑马纹也没有行分隔线** —— 扫读时极易串行。
     ④ 组头折叠箭头 `.tl2-gcaret` 被 `margin-left:auto` 推到最右端（实测 margin-left
        **1732.9px**），离标题一千多像素远，点起来像另一个按钮。
   ⚠ 已核对过、**不需要改**的：图例四行（`.evt-li`）本来就是 grid，名字 54px / 条 220px /
       数值 59px 四行完全对齐（我一开始看错成"条形起点不齐"，量完撤回）。
   本节做四件事：① 底注只让 `.k-cap` 吃余量 ⇒ 四张卡底注贴底成一条线；② `.tl-key` 换成
   固定列网格（工序 68 / 交期 100 / 状态 1fr / 豁免旗 auto）⇒ 列位不再靠值宽撑；
   ③ 隔行极淡斑马 + 行发丝线 + 悬停加深 ⇒ 1650px 宽的表能"横着读不串行"；
   ④ 折叠箭头挪到标题旁边。
   =========================================================================== */

/* ① KPI 底注对齐：实测 `.k-cap` 的 `margin-top` 被别处的 `.ov-kpi-d.ov-kpi-d…` 规则压成 6px
   （skin-paper 第 470 行那条 `margin-top:auto` 根本轮不到），所以这里按本仓库的惯例用
   `body #view#view:has(.feed-page)` 把特异性顶上去；同时把迷你图的 auto 外边距拿掉，
   让余量**只**归底注 ⇒ 四张卡的底注一起贴底、成一条线。
   ⚠ 只作用于生产动态页（`:has(.feed-page)`），其它页面的 KPI 这一轮不动。 */
html[data-paper] body #view#view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-viz {
  margin-top: 0 !important; padding-top: 6px !important;
}
html[data-paper] body #view#view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-cap {
  margin-top: auto !important; padding-top: 10px !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}

/* ②③ 流水表：列对齐 + 斑马 + 行发丝线（只针对"宽屏 7 列"形态；≤1280 是 6 列且隐藏客户列） */
@media (min-width: 1281px) {
  html[data-paper] .tl-row {
    grid-template-columns: 56px 10px 70px 110px minmax(0, 1fr) 320px 54px !important;
  }
  html[data-paper] .tl-key {
    display: grid !important;
    grid-template-columns: 68px 100px minmax(0, 1fr) auto;
    align-items: center !important;
    gap: 0 6px !important;
  }
  html[data-paper] .tl-key .tl-dot { display: none !important; }   /* 有列宽了，不再需要「·」分隔 */
  html[data-paper] .tl-key > :is(.tl-k1, .tl-k2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html[data-paper] .tl-key > .tl-flag { justify-self: start; }
}
html[data-paper] .tl2-rows .tl-row { border-bottom: 1px solid rgba(23, 32, 43, .05); }
html[data-paper] .tl2-rows .tl-row:nth-of-type(odd) { background: rgba(23, 32, 43, .022); }
html[data-paper] .tl2-rows .tl-row:hover { background: var(--ui-brand-050) !important; }
html[data-paper][data-theme="dark"] .tl2-rows .tl-row { border-bottom-color: rgba(255, 255, 255, .07); }
html[data-paper][data-theme="dark"] .tl2-rows .tl-row:nth-of-type(odd) { background: rgba(255, 255, 255, .035); }

/* ④ 组头折叠箭头归位（贴着"发货 7 条"） */
html[data-paper] .tl2-gcaret { margin-left: 4px !important; }


/* ===========================================================================
   79. 生产动态：一个事件类型全页只用一个颜色（2026-10-10）
   ---------------------------------------------------------------------------
   实测（同一页面同一刻，取计算色）：
     事件类型      分布卡华夫格/图例/日头胶囊      流水行的圆点+标签          组头圆点
     发货          #2E8B57（绿）                #1A7BD9（蓝）✗             #1A7BD9（蓝）✗
     待补报工      #D9538A（粉）                #56A7A2（青绿）✗           #56A7A2 ✗
     交期待审核    #56A7A2（青绿）              #56A7A2 ✓                  #56A7A2 ✓
     延期（非合作）#B2453F（红）                danger（红）✓              danger ✓
     延期（合作豁免）#B2453F（红）              灰蓝（刻意，豁免不告警）✓    —
   根因：这一页其实有**两套**「事件类型→颜色」——`feedTypeColor()`（分布卡/日头胶囊用）与
   主题里的 `.tl-row.tone-*` / `.tl2-grp.tone-*`（行内与组头用，只有 5 个语义桶 tone），
   于是同一类事件在 2~3 处是三四种颜色，"乱"就是这么来的。
   改法：把 `feedTypeColor()` 的结果由 JS 写进元素的 `--c`（与日头胶囊同一手法），
   行内圆点 / 标签文字 / 组头圆点 / 组头名称**全部读 `--c`** ⇒ 全页一个类型一个颜色。
   标签底色改成中性淡灰（原来是 tone 色底），避免"彩底+彩字+彩边"三重上色；
   颜色只出现在圆点与标签文字上，扫读时更安静。
   ⚠ 保留的例外：合作单逾期豁免仍走中性灰蓝（豁免＝不告警，这是既定业务口径）。
   =========================================================================== */
html[data-paper] .tl-row .tl-chip {
  background: rgba(23, 32, 43, .045) !important;
  border-color: transparent !important;
  color: var(--c, var(--ui-brand-700)) !important;
}
html[data-paper][data-theme="dark"] .tl-row .tl-chip { background: rgba(255, 255, 255, .07) !important; }
/* 合作豁免（合作单逾期）：整行回到中性灰蓝，不变红 */
html[data-paper] .tl-row.tone-coop { --c: var(--ui-ink-400) !important; }
html[data-paper] .tl2-grp .tl2-dot { background: var(--c) !important; }
html[data-paper] .tl2-grp .tl2-gn { color: var(--c) !important; }
html[data-paper][data-theme="dark"] .tl2-grp .tl2-gn { color: var(--sk-ink-2) !important; }


/* ===========================================================================
   80. 生产动态：文字层级统一 + 两张图卡去噪加宽 + 组头"只看这类"（2026-10-10 ·
       用户：「根据你的建议来进行全面优化」）
   ---------------------------------------------------------------------------
   ① 顶部两类卡的文字层级：实测现在有 **4 档字号（10.5/11/11.5/12）× 4 档字重（400/600/700/800）**
      混在一起 —— KPI 标签 12px/700，闸门卡标签 11px/**800**；KPI 副标 11.5px/400，闸门卡说明
      11px/**700**；KPI 脚注反而最小（10.5px）却最粗（700）。读起来"飘"就是这个原因。
      统一成**一个三档角色表**（跨两类卡一致）：
        标签＝11.5px / 700 / ink-2 ｜ 副标（说明）＝11.5px / 400 / ink-2 ｜ 脚注＝11px / 400 / ink-3
      数值仍按角色分大小（KPI 30px、闸门 15px），但单位/单数（条 / N 单）统一 700 / ink-3。
   ② 两张图卡：**先说结论——它们底部并没有空白**（实测三张卡的内容底=卡底−15px，是"口径说明"
      贴底撑住的；我上一轮提的"空档利用"是看 1:1 缩略图看错了）。真正的问题是横向与噪声：
      · 近 7 日趋势：4 个零值日画的是**整根虚线胶囊**（150px 高），比三根真柱子还抢眼 ⇒ 换成
        极淡实底轨道（保留"0"字），主角回到有数据的 3 根；
      · 同一张卡柱子只有 32px 宽、每列 71px ⇒ 加宽到 40px，把横向空档用起来。
   ③ 组头新增「只看这类 →」：复用**已有**的 `feedTypeDrill()` 抽屉（与分布卡点格子、点图例同一入口），
      不新增数据、不新增页面；`stopPropagation` 保证点它不会顺带折叠这一组。
   =========================================================================== */

/* ① 标签 */
html[data-paper] body #view#view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-lb {
  font-size: 11.5px !important; font-weight: 700 !important; color: var(--sk-ink-2) !important;
}
html[data-paper] body #view#view:has(.feed-page) .ovz-strip .dg-g.is-compact .dg-g-k {
  font-size: 11.5px !important; font-weight: 700 !important; color: var(--sk-ink-2) !important;
}
/* 副标（说明） */
html[data-paper] body #view#view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-sb {
  font-size: 11.5px !important; font-weight: 400 !important; color: var(--sk-ink-2) !important;
}
html[data-paper] body #view#view:has(.feed-page) .ovz-strip .dg-g.is-compact .dg-g-s {
  font-size: 11.5px !important; font-weight: 400 !important; color: var(--sk-ink-2) !important;
}
/* 脚注（最轻一档：原来最小却最粗） */
html[data-paper] body #view#view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-cap {
  font-size: 11px !important; font-weight: 400 !important; color: var(--sk-ink-3) !important;
}
/* 闸门卡数值行：数字抬一档，单位/单数统一 700 灰 */
html[data-paper] body #view#view:has(.feed-page) .ovz-strip .dg-g.is-compact .dg-g-v b {
  font-size: 15px !important;
}
html[data-paper] body #view#view:has(.feed-page) .ovz-strip .dg-g.is-compact .dg-g-v :is(i, em) {
  font-weight: 700 !important; color: var(--sk-ink-3) !important;
}

/* ② 近 7 日趋势：零值日不再画整根虚线胶囊；柱子加宽用掉横向空档 */
html[data-paper] body #view#view:has(.feed-page) .ht-col.is-zero .ht-tr {
  background: rgba(28, 28, 28, .035) !important;
  border: 0 !important;
}
html[data-paper][data-theme="dark"] body #view#view:has(.feed-page) .ht-col.is-zero .ht-tr {
  background: rgba(255, 255, 255, .055) !important;
}
@media (min-width: 1281px) {
  html[data-paper] body #view#view:has(.feed-page) .ht-tr { width: 40px !important; }
}

/* ③ 组头「只看这类 →」 */
/* 折叠箭头挪到**最左**（与日头「▾ 今天 7 条」同一手势位置），"只看这类"留在右端 */
html[data-paper] .tl2-gcaret { order: -1; margin: 0 4px 0 0 !important; }
html[data-paper] .tl2-go {
  margin-left: auto; flex: none;
  font-size: 11px; font-weight: 700; color: var(--c, var(--sk-accent));
  opacity: .72; transition: opacity .13s ease; white-space: nowrap;
}
html[data-paper] .tl2-go b { font-weight: 800; }
html[data-paper] .tl2-go:hover { opacity: 1; text-decoration: underline; }

/* ④ 顺手修一个**深色主题**下的真 bug（本轮量到的）：
   `theme.css` 给 `.ovz-strip .dg-g.tone-b` 写的是浅色 token `--ui-brand-050`，
   而它在深色主题下**不变**（实测深色下第 3 张「风险窗内到期」的卡底仍是 rgb(239,245,253)
   的亮蓝白，与旁边四张深卡完全不搭）。这里按同族色 token 换成深色版。 */
html[data-paper][data-theme="dark"] body #view#view .ovz-strip .dg-g.tone-b {
  background: var(--h-brand-tint) !important;
  border-color: var(--h-brand-line) !important;
}


/* ===========================================================================
   82. 生产动态：流水卡提到图卡前面 + 闸门卡动作做成按钮（2026-10-10 · 用户：「根据你的建议
       来进行进一步优化」）
   ---------------------------------------------------------------------------
   ① 版面顺序：这一页的主内容是「动态流水 · 谁在动、卡在哪」，但它原来排在 3 张图卡之后
      （实测流水卡 y=755），**首屏只能看到 3~5 行事件**。本节点把流水卡提到图卡前面：
      首屏可见行数 **3 → 17 行**（流水卡 y 755 → ≈345），顺序变成"明细在前、汇总在后"。
      实现用网格 `order`（`.ov3-grid` 是 grid，`order` 直接生效）：只给流水卡 `order:-1`，
      三张图卡与页脚说明保持原相对顺序，所以视觉顺序＝流水 → 三图 → 页脚口径。
      ★ 只作用于生产动态页（`:has(.feed-page)`），其它页面的 `.ov3-grid` 一个字不动。
   ---------------------------------------------------------------------------
   ② 闸门卡"查看 N 单 →"：原来是与标题同行的 11px/800 纯文字（颜色按 tone 变），
      和标题抢行、也不像能点的东西。改成**小胶囊按钮**：中性淡底 + 细描边 + 同 tone 文字，
      悬停加深；文字与 tone 色都沿用原规则（只补底色/内边距/圆角）。
   ③ 实测**不需要改**的两条（我上一轮的建议说错了，这里以实测为准，不做改动）：
      · 工段事件流向的节点：本来就有 `onclick="feedStnDrill(...)"`，实测点击弹出「事件节点：合成 ·
        1 条」明细抽屉，可用；
      · 四张卡的"口径说明"：实测都在 **卡底 −15px**、同一套样式（`.pl-note`），本来就一致。
   =========================================================================== */
html[data-paper] #view:has(.feed-page) .ov3-grid > .ov3-card.ov3-g12 { order: -1; }

html[data-paper] body #view#view:has(.feed-page) .ovz-strip .dg-g .dg-g-go {
  background: rgba(23, 32, 43, .045) !important;
  border: 1px solid rgba(23, 32, 43, .08) !important;
  border-radius: 999px !important;
  padding: 2px 9px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  transition: background .13s ease, border-color .13s ease;
}
html[data-paper] body #view#view:has(.feed-page) .ovz-strip .dg-g .dg-g-go:hover {
  background: rgba(26, 123, 217, .10) !important;
  border-color: rgba(26, 123, 217, .22) !important;
}
html[data-paper][data-theme="dark"] body #view#view:has(.feed-page) .ovz-strip .dg-g .dg-g-go {
  background: rgba(255, 255, 255, .07) !important;
  border-color: rgba(255, 255, 255, .12) !important;
}


/* ===========================================================================
   83. 生产动态：KPI 卡可点就地筛选 + 行内「明细」按钮化（2026-10-10 · 用户：「继续」）
   ---------------------------------------------------------------------------
   ① 顶部 4 张 KPI 卡以前只是展示（点不动），而它下面那句副标一直写着"点筛选片「需处理」就地看这
      9 条"——要用户去找下面那排小片。现在**有数的砖自己就能点**：点一下＝切到对应筛选片
      （复用 `setFeedFilter`，不新增一套筛选逻辑；0 条的砖保持纯展示、避免点进空列表）。
      事件→全部 / 需处理→需处理 / 本部门逾期事件→本部门逾期 / 待审核→待审核。
   ② 行内「明细 →」以前是不带边框的纯文字（只在 hover 时加深），改成**小胶囊按钮**，
      与闸门卡的"查看 N 单 →"同一套语言；顺带把那一列 50px 加宽到 62px 容纳按钮。
   =========================================================================== */
html[data-paper] #view:has(.feed-page) .ov-kpi-d.is-clickable { cursor: pointer; }
html[data-paper] #view:has(.feed-page) .ov-kpi-d.is-clickable:hover {
  border-color: rgba(26, 123, 217, .35) !important;
}
/* 不可点的 KPI 砖别再"浮起来"（原来所有砖 hover 都上浮 1.5px，会被误读成可点） */
html[data-paper] #view:has(.feed-page) .ov-kpi-d:not(.is-clickable):hover { transform: none !important; }

html[data-paper] .tl-go {
  background: rgba(23, 32, 43, .045);
  border: 1px solid rgba(23, 32, 43, .08);
  border-radius: 999px;
  padding: 2px 9px; opacity: .85; font-weight: 700;
  justify-self: end;
}
html[data-paper] .tl-row:hover .tl-go {
  opacity: 1;
  background: rgba(26, 123, 217, .10);
  border-color: rgba(26, 123, 217, .22);
}
html[data-paper][data-theme="dark"] .tl-go {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .12);
}


/* ===========================================================================
   84. 去掉"页底文字墙"（2026-10-10 · 用户：「所有模块页面的最下面这些文字说明统统去掉，
       页面布局再优化一下，使其更合理」）
   ---------------------------------------------------------------------------
   全站扫描（_qctest/note-scan.cjs，12 个页签逐页扫"可见 + ≥60 字 + 字号 ≤12.5px"的文本块）
   只剩两类真正的"页底文字墙"：
     · `.ovz-footbar`「本页口径总说明」：生产动态 234 字 / 在制订单 227 字，实测**高 180px**，
       横跨整页贴着最下面；
     · 动态流水卡底的 `.ck-more`：139 字的"两级聚类怎么用"说明。
   做法（信息一字不删，只换承载方式，和卡片脚注同一套）：
     ① `.ovz-footbar` 交给 polish-ux.js 的既有机制收成「口径说明」小胶囊 + 气泡
        （已加进 NOTE_SEL）；这里只补一条：它在 `.ov3-grid` 里是 grid 子项，
        胶囊要横跨整行、贴左下，别被塞进某一列。
     ② `.ck-more` 只留"已显示全部 N 条"，用法说明搬进卡片底部的「口径说明」胶囊里。
   页面因此少 180px 灰字墙，末尾停在图表卡上，观感干净。
   =========================================================================== */
html[data-paper] #view .ov3-grid > .pl-note {
  grid-column: 1 / -1;
  margin: 6px 0 0 2px;
}

/* —— ② 顺手治掉"被拉伸的空卡"（全站扫描 _qctest/stretch-scan.cjs 实测）——
   背景：`.ov3-card` 是网格子项，同一行的卡片会被拉到最高那张的高度；短内容卡于是
   底下留一大片空白。实测最狠的三处：交期预警「口径总说明」卡高 916、底部空 **630px**；
   按时交付率「订单状态分解」高 471、空 265px；「分纯化方式按时率」空 235px。
   两刀：
     · 「口径总说明」卡（`.dg-c-cal`）：正文已被收进「口径说明」胶囊 ⇒ 让它**贴内容高**
       （`align-self:start`）并把空掉的 `.ov3-b` 最小高度归零，卡片从 916px 收到一个小条；
     · 其它卡：把「口径说明」胶囊**钉到卡底**（`margin-top:auto`）—— 拉伸出空高时，
       观感是"内容在上、说明在下"的正常卡片，而不是"说明浮在中间、下面一片空"。 */
/* ⚠ 这一页的卡不是网格而是**竖向 flex 列**（`.dg-col4`）—— 在 flex 列里 `align-self` 管的是
   横向，纵向要 `flex: 0 0 auto` 才不参与"填满列高"（实测只写 align-self 时卡片照样 916px）。 */
html[data-paper] #view .ov3-card.dg-c-cal { align-self: start !important; flex: 0 0 auto !important; }
html[data-paper] #view .ov3-card.dg-c-cal > .ov3-b { min-height: 0 !important; }
/* ⚠ 必须带 !important：胶囊的外边距被 skin-paper 第 4503 行那条
   `html[data-paper] body #view .pl-note{margin:0 6px 0 0 !important}` 钉死过
   （实测不加 !important 时 margin-top 仍是 0px，胶囊浮在内容下面、底下照样一片空）。 */
/* ⚠ 选择器必须写 `#view#view`（两重 id）：页头是态势带的页面（`:has(.ov-hero.is-dash)`）
   还有一条 (1,4,1) 的 `.pl-note{margin:0 8px 0 0 !important}` 压在我这条 (1,3,2) 上面，
   光加 !important 也抢不过它（CDP 实测：命中规则里它排在最后）。 */
html[data-paper] body #view#view .ov3-card > .pl-note { margin-top: auto !important; }


/* ===========================================================================
   85. 生产动态：顶部 KPI 卡压缩 + 精修（2026-10-10 · 用户：「顶部的 KPI 卡片设计的太丑了，
       好好优化一下，高度矮一点」）
   ---------------------------------------------------------------------------
   实测（1920×956 · 页面比例 0.9）：四张 KPI 卡**高 162px**，里面堆了 5 行东西 ——
     标签 17 + 大数字 29 + 说明 16 + 迷你折线 **20** + 底注 13，再加 30px 内距与各处
     4~10px 外边距。底注为了跟别的卡对齐还带 `margin-top:auto + padding-top:10px`，
     于是"最高的那张卡"把整排都撑到 162。
   本轮（高度 162 → ~95px，约 ‑42%）：
     ① **底注收进悬停提示**（它本来就在 title 里一字不差）⇒ 卡面只剩「标签 / 数字 / 一句说明」三层；
     ② **迷你折线挪到卡内右上角**（绝对定位 66×20），不再单独占 20px + 外边距；
     ③ 内距 14→11/12、数字 30→28、行距与外边距统一收紧到 3px 档；
     ④ 说明行固定单行 + 省略号（合作豁免那个小胶囊仍留在行内，超长才截断）。
   ⚠ 底注虽然不显示了，但**并没有删**：`ovzKpi` 仍把它拼进 `title`，鼠标停上去全文可见；
     可点的砖也仍在 title 里写着"点击就地筛选"。
   =========================================================================== */
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d {
  position: relative;
  padding: 11px 14px 12px !important;
  min-height: 0 !important;
  height: auto !important;
}
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-lb {
  margin: 0 !important; padding-right: 76px !important;   /* 给右上角折线留位 */
  font-size: 11.5px !important; font-weight: 700 !important;
}
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-vl {
  margin: 3px 0 0 !important; gap: 5px !important;
}
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-vl b {
  font-size: 28px !important; line-height: 1.05 !important; letter-spacing: -.6px !important;
}
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-vl span { font-size: 11px !important; }
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-sb {
  margin: 3px 0 0 !important; font-size: 11.5px !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
/* 迷你折线：钉在卡内右上角，不占纵向空间 */
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-viz {
  position: absolute !important; top: 10px !important; right: 12px !important;
  width: 66px !important; height: 20px !important;
  margin: 0 !important; padding: 0 !important;
}
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-viz svg {
  display: block !important; width: 66px !important; height: 20px !important; overflow: visible !important;
}
/* 底注：不占卡面（全文仍在 title 里） */
html[data-paper] #view:has(.feed-page) .ov-kpi-d.ov-kpi-d .k-cap { display: none !important; }


/* ===========================================================================
   86. 订单明细：整屏接管 → 右侧大抽屉（2026-10-10 · 用户：「这样的交互方式我真的受不了」）
   ---------------------------------------------------------------------------
   现状：点任意订单/卡片打开的是 `#modalBody.modal.fullscreen`（app.css：`width:100vw;
   height:100vh;border-radius:0`）—— **整屏把页面顶掉**，只能靠左上角「返回生产驾驶舱」退出来，
   用户原来在哪一列、看到第几条全丢。
   改法：只动**订单明细**这一处（它的类名是 `modal wide fullscreen`，全站唯一），
   把整屏面板换成"贴右侧滑出的大抽屉"：
     · 面板贴右上、宽 min(1280px, 84vw)、满高、左侧一道投影 ⇒ 左边仍能看到列表/看板；
     · 遮罩从"深色 + 6px 毛玻璃"降到 22% 纯色（不糊背景），页面内容保持可读；
     · 内部结构（`.modal.fullscreen{display:flex;flex-direction:column}` 的 sticky 头 +
       `.tbl-wrap{flex:1;overflow:auto}`）原样沿用 ⇒ 明细行/工序进度这些宽表照旧在**面板内**横向滚动。
   ⚠ 其它 7 处仍在用整屏（板号与工序 / 延期每日汇总 / 交期上传 / 交期预估预览 / 溶解放大倍数 /
     工段明细 / 发货周报）—— 那些是"报表 / 一次性录入"，本次不动；你要的话我按同一套改成抽屉。
   =========================================================================== */
/* ⚠ 真正的做法在 app.js 的 odPageShow()：把 `#modalBody` **整块搬进 `#view`**（DOM 移动），
   于是它从"浮层"变成"页面里的一块"；这里只负责把"弹层那部分外观"关掉 ——
   位置、圆角、阴影、固定定位、100vw 全部还原成普通块，内部样式（`.eta-head` / `#rowTbl`
   等挂在 `modal.fullscreen` 上的规则）原样保留（类名没摘）。 */
html[data-paper] #view > #modalBody.od-page {
  /* ⚠ 必须 `relative`：明细里的「← 关闭明细」按钮与右上角那些元素是**绝对定位**的，
     原来是挂在 fixed 的弹层上；改成 static 后它们的包含块会变成视口 ⇒ 按钮飞到页面左上角
     （实测直接压在左侧导航的品牌区上）。 */
  position: relative !important;
  inset: auto !important;
  top: auto !important; left: auto !important; right: auto !important; bottom: auto !important;
  width: auto !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  /* ⚠ 上内距必须留住：明细左上那颗「← 关闭明细」是**绝对定位**的（原来靠 .modal.fullscreen
     的 60px 上内距给它让位）；这里只给 14px 就会压到单号上（实测重叠）。 */
  padding: 56px 20px 18px !important;
  overflow: auto !important;
  display: flex !important;
  flex-direction: column !important;
}
/* 右上角那个 × 是弹层时代的产物：既然已经是"页"，关闭入口只留左上角「关闭明细」一个 */
html[data-paper] #view > #modalBody.od-page > .close { display: none !important; }


/* ===========================================================================
   87. 订单明细页 · 内容紧凑化（2026-10-10 · 用户："先按照你的建议来做"）
   ---------------------------------------------------------------------------
   实测（1920×956 · 页面比例 0.9，订单 HS261009010）：
     页头 `.od-head` 共 **259px**：标题块 68 +「当前工序」状态条 48 + 四张大数字卡 91
       （`.odkpi` 91 高 = 图标 36 + 大数字 41 + 标签 18 + 内距；app.css 第 28/29 行）；
     「订单信息」`.detail-meta.two` 是**两列 × 8 格**、每格 66px（第 2502/2566 行）⇒ 整块 **784px**。
   ⚠ 第一次改失败的原因记在这里：`app.css:14 .od-head{display:flex;flex-direction:column}` ——
     我只覆盖了 `display/align-items` 没覆盖 `flex-direction`，结果还是"竖着排+居中"，
     看着像被挤歪。这次连方向一起改。
   三刀（DOM 不动）：
     ① 页头 **两行**：第 1 行＝单号+状态徽标+客户摘要+「当前工序」胶囊；
        第 2 行＝四个关键值（进度/预计完成/数量/累计OD），去掉图标、数值 17px、标签 11px；
     ② 「订单信息」2 列 → **4 列**，格子 66 → 约 44px（标签 10.5 / 值 12）；
     ③ 右栏各块间距、分区标题、页签条一并收紧。
   =========================================================================== */
html[data-paper] #view > #modalBody.od-page .od-head {
  display: flex !important;
  flex-direction: row !important;        /* ← 关键：原样式是 column */
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px 14px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
html[data-paper] #view > #modalBody.od-page .od-title {
  display: flex !important; align-items: baseline !important; gap: 8px !important;
  margin: 0 !important; padding: 0 !important;
}
html[data-paper] #view > #modalBody.od-page .od-title h3 {
  font-size: 16px !important; margin: 0 !important; line-height: 1.35 !important; gap: 6px !important;
}
html[data-paper] #view > #modalBody.od-page .od-title .sub {
  margin: 0 !important; font-size: 11.5px !important; max-width: 460px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html[data-paper] #view > #modalBody.od-page .od-status-bar {
  display: flex !important; flex-direction: row !important; align-items: center !important;
  gap: 6px !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important;
}
html[data-paper] #view > #modalBody.od-page .od-status-label { font-size: 11.5px !important; }
html[data-paper] #view > #modalBody.od-page .od-status-chips { display: flex !important; gap: 5px !important; flex-wrap: nowrap !important; }
/* 四个关键值：独占第二行、左对齐铺开 */
html[data-paper] #view > #modalBody.od-page .od-kpis {
  display: flex !important; flex: 1 1 100% !important;
  flex-direction: row !important; flex-wrap: wrap !important;
  gap: 6px 28px !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important; box-shadow: none !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi {
  display: flex !important; flex-direction: row !important; align-items: baseline !important;
  gap: 6px !important; padding: 0 !important; margin: 0 !important;
  min-height: 0 !important; height: auto !important;
  border: 0 !important; background: none !important; box-shadow: none !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-icon { display: none !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-main { display: flex !important; align-items: baseline !important; gap: 5px !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-main .v {
  font-size: 17px !important; line-height: 1.15 !important; letter-spacing: -.3px !important;
  background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
  color: var(--sk-ink) !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-main .v .u { font-size: 11px !important; color: var(--sk-ink-3) !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-main .l {
  font-size: 11px !important; color: var(--sk-ink-3) !important; margin: 0 !important;
}
/* ② 订单信息：2 列 → 4 列 */
html[data-paper] #view > #modalBody.od-page .detail-meta.two {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px 10px !important;
}
html[data-paper] #view > #modalBody.od-page .detail-meta .ic {
  height: auto !important; min-height: 0 !important;
  padding: 5px 8px !important; border-radius: 8px !important;
}
html[data-paper] #view > #modalBody.od-page .detail-meta .ic .l { font-size: 10.5px !important; line-height: 1.4 !important; margin: 0 !important; }
html[data-paper] #view > #modalBody.od-page .detail-meta .ic .v { font-size: 12px !important; line-height: 1.35 !important; margin-top: 2px !important; }
/* ③ 右栏 / 分区标题 / 页签条收紧 */
html[data-paper] #view > #modalBody.od-page .detail-section { margin-bottom: 10px !important; }
html[data-paper] #view > #modalBody.od-page .detail-section h4 { font-size: 12px !important; margin-bottom: 6px !important; }
html[data-paper] #view > #modalBody.od-page .dept-block { padding: 8px 10px !important; margin-top: 6px !important; }
html[data-paper] #view > #modalBody.od-page .tabbar { margin: 4px 0 6px !important; }


/* ===========================================================================
   88. 订单明细页 · 重整"卡片语言"（2026-10-10 · 用户："看着更乱了，用心去设计，
       可以把原有思路彻底推翻"）
   ---------------------------------------------------------------------------
   实测这一页"乱"的三个来源（1920×956 · 页面比例 0.9，订单 HS261009002）：
     ① 八道工段条：`.station-timeline > .tl-item` 每格 **112px** 高，里面只有
        「合成 / — / 无数据」三行 ⇒ 一整条 128px 几乎全是空气；
     ② 右栏「当前工序（按部门）」整块 **583px**：`.dept-block` 75 + 117、
        `.dept-auto`（QC 文件夹卡）351 —— 而它们三种块**三种长相**（实线卡 / 虚线卡 / 无边框）；
     ③ 分区标题、卡片内距、圆角在各块之间彼此不一致，眼睛没有"一种卡片"的锚点。
   做法（DOM 不动，只统一视觉规格）：
     · 八道工段改成**一行八个紧凑格**（112 → 约 56px，名字/时间/状态各一行、字号 11~11.5）；
     · 右栏所有块统一成**同一种卡片**：白底 + 1px 发丝边 + 圆角 10 + 内距 8/10；
       `.dept-head` 12→11.5px、步骤胶囊 22→20px、按钮行上距 6px；
     · QC 文件夹卡（`.dept-auto > *`）不再用虚线，跟其它卡同规格。
   =========================================================================== */
/* ① 工段条：一格 112px → 约 56px */
html[data-paper] #view > #modalBody.od-page .station-timeline {
  display: flex !important; gap: 6px !important;
}
html[data-paper] #view > #modalBody.od-page .station-timeline > .tl-item {
  flex: 1 1 0 !important; min-width: 0 !important;
  height: auto !important; min-height: 0 !important;
  padding: 6px 8px !important; border-radius: 10px !important;
}
html[data-paper] #view > #modalBody.od-page .station-timeline > .tl-item > * { margin: 0 !important; }
html[data-paper] #view > #modalBody.od-page .station-timeline > .tl-item :is(b, strong) { font-size: 11.5px !important; }
html[data-paper] #view > #modalBody.od-page .station-timeline > .tl-item :is(span, em, i, small) { font-size: 11px !important; line-height: 1.45 !important; }
/* ② 右栏统一卡片规格（交期卡 / 当前工序（按部门）/ QC 文件夹卡同一种长相） */
html[data-paper] #view > #modalBody.od-page :is(.dept-block, .dept-auto > *) {
  background: #FFFFFF !important;
  border: 1px solid var(--ui-line-200) !important;
  border-style: solid !important;
  border-radius: 10px !important;
  padding: 8px 10px !important;
  margin: 8px 0 0 !important;
  box-shadow: none !important;
}
html[data-paper] #view > #modalBody.od-page .dept-head {
  font-size: 11.5px !important; margin: 0 0 4px !important; padding: 0 !important; border: 0 !important;
}
html[data-paper] #view > #modalBody.od-page .dept-steps { gap: 5px !important; }
html[data-paper] #view > #modalBody.od-page .dept-steps :is(.badge, .st-pill, span) { height: 20px !important; line-height: 20px !important; font-size: 11px !important; }
html[data-paper] #view > #modalBody.od-page .dept-btns { margin-top: 6px !important; gap: 6px !important; }
html[data-paper] #view > #modalBody.od-page .dept-auto { margin-top: 8px !important; }
html[data-paper] #view > #modalBody.od-page .dept-auto :is(button, .mbtn) { height: 26px !important; font-size: 11.5px !important; }


/* —— 89. QC 文件夹卡 → 紧凑一行一条（用户："继续做"）——
   实测：`.dept-auto` 里每张 `.dept-auto-block` 是"标题 / 位置 / 按钮"三行 × 3~4 张 = 351px，
   而"位置"那一行与标题里的 `baseFolder / folder` **完全重复**。
   改成清单式：一张一条，左＝路径 + 状态徽标，右＝打开按钮，行高 ~30px ⇒ 整块约 120px。 */
html[data-paper] #view > #modalBody.od-page .dept-auto { display: block !important; margin-top: 8px !important; }
html[data-paper] #view > #modalBody.od-page .dept-auto > .dept-auto-block {
  display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 6px 10px !important; margin: 0 !important;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--ui-line-100) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html[data-paper] #view > #modalBody.od-page .dept-auto > .dept-auto-block:first-child {
  border-top: 1px solid var(--ui-line-200) !important;
}
html[data-paper] #view > #modalBody.od-page .dept-auto > .dept-auto-block .dept-head {
  flex: 1 1 auto !important; min-width: 0 !important; margin: 0 !important;
  display: flex !important; align-items: center !important; gap: 8px !important;
  white-space: nowrap !important; overflow: hidden !important;
}
html[data-paper] #view > #modalBody.od-page .dept-auto > .dept-auto-block .dept-head b {
  font-size: 11.5px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* "位置：…" 与标题里的 base/folder 重复，收掉 */
html[data-paper] #view > #modalBody.od-page .dept-auto > .dept-auto-block .dept-steps { display: none !important; }
html[data-paper] #view > #modalBody.od-page .dept-auto > .dept-auto-block .dept-btns {
  flex: none !important; margin: 0 !important; display: flex !important; gap: 6px !important;
}


/* ===========================================================================
   90. 订单明细 · 明细行表格精修（2026-10-10 · 用户："数据看着很乱，能不能做的更精美一点"）
   ---------------------------------------------------------------------------
   实测这一张表三个问题：
     ① 表宽 **1855px** 比面板（1744）宽 111px ⇒ 横向滚动；根因 `#rowTbl{min-width:1710px}`
        （app.css:2509）写死，而 `table-layout` 已经是 fixed ⇒ 只要把 min-width 放开就能吃满；
     ② 「八点位工序轨」那列占 **351px**（`.sjt-cell > .sjt-bar > .sjt-seg` 一堆彩色小胶囊），
        比"序列"列（292）还宽 ⇒ 表里最花的地方占了最大宽度；
     ③ 序列列 13px 等宽、每行折 2 行还好，但字号与行距偏大 ⇒ 行高 66px、屏里只放得下 10 行。
   做法：表吃满面板宽；工序轨压到 230px 并把小胶囊压成 16px 高、10.5px 字；
      全表字号 12px、单元格内距 5/8；序列列限两行（`line-clamp:2`）；总OD 列右对齐用等宽数字。
   =========================================================================== */
html[data-paper] #view > #modalBody.od-page #rowTbl {
  min-width: 0 !important;
  width: 100% !important;
  table-layout: fixed !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl thead th {
  padding: 6px 8px !important; font-size: 11.5px !important; height: auto !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td {
  padding: 5px 8px !important; font-size: 12px !important; height: auto !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl tbody tr { height: auto !important; max-height: none !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.seq-cell {
  max-width: none !important;
  font-size: 11.5px !important; line-height: 1.5 !important;
  word-break: break-all !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl tbody tr:nth-child(even) { background: rgba(23, 32, 43, .022) !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl tbody tr:hover { background: rgba(26, 123, 217, .05) !important; }
/* 总OD（第 12 列）右对齐 + 等宽数字 */
html[data-paper] #view > #modalBody.od-page #rowTbl :is(tbody td, thead th):nth-child(12) {
  text-align: right !important; font-variant-numeric: tabular-nums;
}
/* 八点位工序轨：351 → 230px（固定布局下宽度由表头决定），胶囊 16px 高 / 10.5px 字 */
html[data-paper] #view > #modalBody.od-page #rowTbl thead th:last-child { width: 232px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl thead th:nth-child(4) { width: 380px !important; }  /* 序列列吃回收窄的余量 */
html[data-paper] #view > #modalBody.od-page #rowTbl td.sjt-cell { max-width: 232px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-bar { gap: 3px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg {
  height: 16px !important; line-height: 16px !important;
  font-size: 10.5px !important; padding: 0 5px !important; border-radius: 999px !important;
}


/* ===========================================================================
   91. 明细行 · 八点位工序轨 → 工序看板同款"分段进度条"（2026-10-10 · 用户：
       "这些进度条可以参考工序看板面板的"）
   ---------------------------------------------------------------------------
   现状：这一列是 8 个**带文字的彩色胶囊**（`✓合成 ▶氨解 ⊘接酯 ○纯化 …`，10.5px），
   一屏 20 行叠在一起就是一片彩色小标签，读不出"走到第几道"。
   看板那套是：**八段等宽细条**——已完成实心、当前段描边、未到浅灰，条右端一个 `N/8`。
   这里整套换过来（DOM 见 app.js `detailRowsHtml` 里的 `.sjt-top` / `.sjt-bar` / `.sjt-n`）：
     · 第一行＝细条 + 右端 `N/8`（看板就是"条在左、读数在右"）；
     · `.sjt-seg` 收成 5px 高的等宽段（`flex:1 1 0`），文字与图标用 `font-size:0` 隐去
       （每段的完整口径仍在 `title` 里：`合成：2026-09-28 14:03`）；
     · done＝实心品牌蓝（与看板同源 `--ui-brand-600`，实测 #1A7BD9）· done.last 不再另标
       （底层那圈绿环要去掉，见下）· doing＝7px 描边+淡底 · none＝浅灰 · skip＝更浅灰；
     · 第二行才是这一列真正要交代的东西——末段工段 + 作业完成时间（列头就叫"作业完成时间"）。
   实测：段 21.8×4.5（视觉px，zoom 0.9）等宽、条 193px、列宽 261px 不换行、行高 35px
   （改前 36px，密度没丢）、面板无横向滚动；深色主题另给一套浅色段。
   =========================================================================== */
/* 第一行：细条 + 右端 N/8 读数（看板卡片就是"条在左、读数在右"） */
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-top {
  display: flex !important; align-items: center !important; gap: 10px !important;
  line-height: 1.2 !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-bar {
  display: flex !important; flex-wrap: nowrap !important; align-items: center !important;
  flex: 1 1 auto !important; min-width: 90px !important;
  gap: 3px !important; padding: 3px 0 !important;
  /* 底层 app.css:5256 给这条加了"灰底轨道 + 圆角 + 内距"，看板里没有轨道 ⇒ 拿掉 */
  background: transparent !important; border-radius: 0 !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-n {
  flex: none !important;
  font-size: 11.5px !important; font-weight: 800 !important; letter-spacing: .2px !important;
  color: var(--sk-ink-2) !important;
  font-variant-numeric: tabular-nums;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg {
  flex: 1 1 0 !important; min-width: 0 !important;
  height: 5px !important; line-height: 0 !important;
  padding: 0 !important; border: 0 !important; border-radius: 999px !important;
  font-size: 0 !important;
  background: rgba(23, 32, 43, .10) !important;
  color: transparent !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg > i { display: none !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg.done {
  background: var(--ui-brand-600) !important;
}
/* ★ 底层 app.css:5254 给"最后一个已完成段"套了一圈绿环（那张 16px 胶囊时代的强调），
   现在段只有 5px 高，绿环比段本身还抢眼 ⇒ 末段与普通段同色，不再另标。 */
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg.done.last {
  background: var(--ui-brand-600) !important;
  box-shadow: none !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg.doing {
  height: 7px !important;
  background: rgba(26, 123, 217, .18) !important;
  box-shadow: inset 0 0 0 1.5px var(--ui-brand-600) !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg.none { background: rgba(23, 32, 43, .10) !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-seg.skip { background: rgba(23, 32, 43, .055) !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-last {
  display: flex !important; align-items: baseline !important; gap: 8px !important;
  margin-top: 1px !important; line-height: 1.25 !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .sjt-last .seg-tm {
  font-size: 10.5px !important; color: var(--sk-ink-3) !important;
}
/* 深色主题：浅灰段在深卡上会"看不见"（底层是 rgba(23,32,43,…) 的墨色），换成白色系 */
html[data-paper][data-theme="dark"] #view > #modalBody.od-page #rowTbl .sjt-seg { background: rgba(255, 255, 255, .14) !important; }
html[data-paper][data-theme="dark"] #view > #modalBody.od-page #rowTbl .sjt-seg.none { background: rgba(255, 255, 255, .16) !important; }
html[data-paper][data-theme="dark"] #view > #modalBody.od-page #rowTbl .sjt-seg.skip { background: rgba(255, 255, 255, .085) !important; }
html[data-paper][data-theme="dark"] #view > #modalBody.od-page #rowTbl .sjt-seg.doing {
  background: rgba(26, 123, 217, .30) !important;
  box-shadow: inset 0 0 0 1.5px var(--ui-brand-600) !important;
}


/* ===========================================================================
   81. 动态流水（feed list）专项优化（2026-10-10 · 用户：「动态流水这边需要好好进行优化」）
   ---------------------------------------------------------------------------
   实测（1920×956）：
     · 行内七列实测 x/宽 = 时间 50 / 轨道 9 / 类型 36 / 单号 99 / **客户 1025** / 关键信息 288 /
       明细 33 —— 客户列吃掉 1fr（1025px），而客户名平均只用 ~130px ⇒ **每行中段空出约 900px**，
       30 行叠起来就是一条竖着的空白带；这也是"这页看着空"的主因。
     · 行高 40px（11px 字压在 40px 行里，偏松）；组头 29px、日头 37px。
     · 首屏（956px）只能看到 **3 行事件**（流水卡从 y=755 才开始）。
   本轮做法：
     ① 客户列固定 240px（超长省略号，悬停仍是整行 title 全文）；
     ② 空出来的中段给**一句话说明**（`.tl-msg`）——取的是 title / 明细抽屉里那份「说明」，
        没有说明时退回「提交人」或「事件节点」；不新增数据、不新增请求；
     ③ 行高 40 → 34px、组头 29 → 24、日头 37 → 32 ⇒ 30 条事件整体矮约 300px，首屏可见行数 +2；
     ④ 窄屏（≤1280）单独给 7 列模板（那一档本来就隐藏客户列），避免新列把行挤折。
   ⚠ 没有动页面上下的顺序（图表仍在流水之上）——"把流水提到图表前面"是另一件事，
     实测那样首屏可见行数能从 3 行提到 17 行，我把它留给你点头再做。
   =========================================================================== */
@media (min-width: 1281px) {
  html[data-paper] .tl-row {
    grid-template-columns: 52px 9px 68px 104px 240px minmax(0, 1fr) 288px 62px !important;
    height: 34px !important;
  }
  html[data-paper] .tl-rail { height: 34px !important; }
}
@media (max-width: 1280px) {
  /* 窄屏：客户列本来就隐藏，这里给说明列留一档，其余照旧 */
  html[data-paper] .tl-row {
    grid-template-columns: 52px 10px 66px 104px minmax(0, 150px) minmax(0, 1fr) 62px !important;
  }
}
html[data-paper] .tl-msg {
  min-width: 0; font-size: 11px; color: var(--sk-ink-3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html[data-paper] .tl-row:hover .tl-msg { color: var(--sk-ink-2); }
/* 组头 / 日头节奏收紧 */
html[data-paper] .tl2-gh { padding: 4px 10px !important; }
html[data-paper] .tl2-dh { padding: 7px 12px !important; }
/* 日头吸顶：30 条事件要滚 1300px+，滚到「更早」里时始终知道自己在哪一天
   （`.tl2-day` 是它的包含块，所以只在当天这一段内吸顶，滚出这段自动让位） */
html[data-paper] .tl2-day > .tl2-dh {
  position: sticky; top: 0; z-index: 4;
  box-shadow: 0 1px 0 var(--ui-line-100);
}
/* ⚠ 实测坑：`.tl2-day` 自带 `overflow:hidden`（为了裁圆角），它会把吸顶的**滚动态容器**
   变成自己 —— 于是 sticky 永远不会触发（实测滚到 900 时日头 y=-2，直接滑走了）。
   这里把 day 的裁切关掉、改由日头自己带圆角（吸顶时是圆头小条，观感也成立）。 */
html[data-paper] .tl2-day { overflow: visible !important; }
html[data-paper] .tl2-day > .tl2-dh { border-radius: 14px 14px 0 0; }
html[data-paper] .tl2-day.is-fold > .tl2-dh { border-radius: 14px; }
/* ⚠ 第二个坑：`.dg-page.feed-page` 也是 `overflow:auto`（它是"永不滚动的滚动容器"——
   高度跟着内容长）⇒ 仍会把 sticky 的参照系吃掉。整页真正的滚动容器是 `.view-fade`，
   所以这里把包一层放掉裁切（实测这一步之后日头才吸得住）。 */
html[data-paper] #view:has(.feed-page) .dg-page.feed-page { overflow: visible !important; }


/* ===========================================================================
   95. 左侧导航 · 三条补强（2026-10-11 · 用户："左侧导航栏还有什么好的建议"）
   ---------------------------------------------------------------------------
   先体检（1920×956 / 比例 0.9，实测）：
     · 侧栏 176px＝图标轨 56 + 面板 102；条目 12.5px/rgba(255,255,255,.78) on rgb(14,65,118)
       → 对比度 10.31:1（AA 只要 4.5）—— 配色不用动；
     · 42 个 `.nav-item` **focusable: 0**（全是 div，无 role/tabindex）→ Tab 进不了面板；
     · 轨上 `.nr-dot` 亮灭没有数字/说明；面板留给文字只有 45–50px（"生产概览"要 50）。
   本轮补三条（都在 nav-collapse.js 里做，DOM 结构不改）：
     ① 条目键盘可达：role=link + tabindex=0 + 回车/空格 = 点它；面板内 ↑↓/Home/End，
        坞上 →/↓ 送焦点进面板第一条；焦点环见下；
     ② 坞上红点给说明与数量：按钮 title 列出"哪几项、各多少"，角上显示"有几项带数字"；
     ③ 搜索框搬进浮岛顶部并显示（它原来被 display:none 藏着，而 Ctrl+K / "/" 仍会把焦点交给它
        —— 敲字看不见，是个真 bug）。
   =========================================================================== */
/* ① 焦点环：键盘走到哪一眼看得见（只在键盘操作时出现，鼠标点击不闪） */
html[data-paper] .sidebar .nav-item:focus-visible {
  outline: 2px solid var(--ui-brand-500) !important;
  outline-offset: -2px !important;
  background: rgba(255, 255, 255, .10) !important;
}
html[data-paper] .sidebar .nav-rail .nr-btn:focus-visible,
html[data-paper] .sidebar .nav-panel .nav-search input:focus-visible {
  outline: 2px solid var(--ui-brand-500) !important;
  outline-offset: 2px !important;
}
/* ② 坞上**不再**加数字角标 —— 第一版加了个红底"N"，在 56px 的坞砖上像一枚通知数、又贴着高亮块
   （用户："还是太怪异了"）。信息保留在按钮 title 里（悬停列出"哪几项、各多少"），坞上只留原来的红点。 */
html[data-paper] .sidebar .nav-rail .nr-btn[data-n] { position: relative !important; }
/* ③ 搜索框进浮岛：盖掉那两条 `display:none !important`（更具体 + 更靠后） */
html[data-paper] .sidebar .nav-panel .nav-search {
  display: flex !important; align-items: center !important; gap: 6px !important;
  margin: 6px 8px 8px !important; padding: 0 8px !important;
  /* ⚠ 这枚药丸在纸白主题下是**白底**（皮肤原色），别给它浅字：第一版设成 #EAF1F9 之后
     "搜索功能 / 工序" 在白底上直接隐形（用户截图里那块空白就是它）。保持皮肤原色即可。 */
  background: var(--sk-rail-field, #f2f2f2) !important;
  box-shadow: inset 0 0 0 1px var(--sk-rail-line, #e8e8e8) !important;
  border-radius: 8px !important; height: 30px !important;
}
html[data-paper] .sidebar .nav-panel .nav-search input {
  flex: 1 1 auto !important; min-width: 0 !important;
  background: transparent !important; border: 0 !important; outline: none !important;
  font-size: 12.5px !important;
}
html[data-paper] .sidebar .nav-panel .nav-search svg { flex: none !important; width: 14px !important; height: 14px !important; opacity: .7 !important; }
html[data-paper] .sidebar .nav-panel .nav-search button {
  flex: none !important; background: none !important; border: 0 !important; cursor: pointer !important;
  opacity: .6 !important; font-size: 12px !important;
}
/* ④ 侧栏加宽 196 → 220（面板因此 ~102 → ~126）：条目文字不再贴边，
   条目里的数字角标也不再被裁成一坨红块（用户截图上那些红sliver 就是被裁的角标）。 */
@media (min-width: 761px) {
  html[data-paper] { --n4-w: 68px; }   /* ★ 全新设计（选项 1 窄轨收起式）：只留 68px 图标轨，面板浮出 */
}
/* ══ 窄轨收起式（用户选 1）════════════════════════════════════════════════
   侧栏＝68px 图标轨（无方底、无文字，名称走 title 悬停）；面板**浮出**在轨右侧、
   不占布局 ⇒ 页面内容不再被顶动（用户一直不喜欢"被顶/被盖"的交互）。
   开关沿用程序里现成的 flyOpen/flyClose：鼠标进轨、键盘聚焦进轨都会浮出，Esc / 点外面收起。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar { padding: 12px 4px 10px !important; }
html[data-paper] .sidebar .nav-rail { width: 60px !important; flex: 0 0 60px !important; }
html[data-paper] .sidebar .nav-rail .nr-btn { width: 56px !important; height: 42px !important; min-height: 42px !important; }
html[data-paper] .sidebar .nav-rail .nr-btn > span { display: none !important; }   /* 轨上只留图标 */
html[data-paper] .sidebar .nav-panel {
  position: fixed !important;
  left: 68px !important; top: 60px !important; bottom: 14px !important;
  width: 212px !important; z-index: 60 !important;
  background: var(--n5-panel-bg) !important;
  border: 1px solid var(--n5-line) !important; border-left: 0 !important;
  border-radius: 0 14px 14px 0 !important;
  box-shadow: 0 20px 44px -26px rgba(20, 24, 28, .5) !important;
  padding: 10px 8px !important;
  opacity: 0; transform: translateX(-6px); pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
html.nav-fly .sidebar .nav-panel { opacity: 1 !important; transform: none !important; pointer-events: auto !important; }
html[data-paper] .sidebar .nav-rail .nr-btn.on { box-shadow: inset 2px 0 0 var(--n5-active-bar) !important; }
/* 68px 的轨里放不下文字：品牌只留 logo、底部只留图标（原来品牌名被挤成了竖排一格一个字） */
html[data-paper] body .sidebar .brand { justify-content: center !important; align-items: center !important; padding: 2px 0 10px !important; }
html[data-paper] body .sidebar .brand h1 { display: none !important; }
html[data-paper] body .sidebar .side-foot { align-items: center !important; }
html[data-paper] body .sidebar .side-foot .conn { justify-content: center !important; }
html[data-paper] body .sidebar .side-foot .conn > span:not(.dot),
html[data-paper] body .sidebar .side-foot .btn-ghost > span { display: none !important; }
html[data-paper] body .sidebar .side-foot .btn-ghost { width: 44px !important; height: 34px !important; padding: 0 !important; justify-content: center !important; }
/* ⚠ 继续加宽治不了这件事：面板再宽也装不下"4 汉字 + 3 位数字"（实测 220px 侧栏时
   「合成工序 108」仍需 ~120px 而条目盒只有 ~110px），角标照样被面板的 `overflow-x:hidden` 硬裁。
   根治：条目改成 flex —— 标签 `flex:1 1 auto + 省略号`，角标 `flex:none` 永远完整。 */
html[data-paper] .sidebar .nav-panel .nav-item {
  display: flex !important; align-items: center !important; gap: 8px !important; min-width: 0 !important;
}
html[data-paper] .sidebar .nav-panel .nav-item > svg { flex: none !important; }
html[data-paper] .sidebar .nav-panel .nav-item > span {
  flex: 1 1 auto !important; min-width: 0 !important;
  overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
}
html[data-paper] .sidebar .nav-panel .nav-badge {
  flex: 0 0 auto !important; margin-left: 2px !important;
  font-size: 10px !important; padding: 0 5px !important; line-height: 16px !important;
}
/* ⑤ 刷新时"两个界面"：index.html 里那套旧导航（.nav-pin / .nav-group）会先被画出来，
   nav-collapse.js 过约 150ms 才把它换成 rail+面板 —— 中间那一瞬两套导航并存（用户："刷新
   的时候会出现两个界面"）。这里在**构建完成前**先把 <nav> 藏起来：
     · 正常路径：build() 给 nav 加上 data-nav-v3="1" → 立即可见；
     · 兜底：万一 JS 没跑起来，1.2s 后由 CSS 动画强制显形（不会把导航永久藏死）。 */
@keyframes navBootReveal { to { visibility: visible; } }
html[data-paper] .sidebar nav:not([data-nav-v3="1"]) {
  visibility: hidden !important;
  animation: navBootReveal 0s linear 1.2s forwards !important;
}
/* ⑥ 导航调色：海军蓝 → **石墨墨色**（用户："这个颜色有点 LOW"）
   ⚠ 上一版失败的原因（`_qctest/nav-dump.cjs` dump 出来的）：整套导航的颜色**不是我猜的那些选择器**
   在写，而是被 `--n5-*` 这组变量喂的 ——
     `--n5-rail-bg`（坞的渐变）· `--n5-panel-bg`（面板底）· `--n5-txt/2/hi`（字）·
     `--n5-btn(-hover)`（图标砖）· `--n5-active-bg`（选中底）· `--n5-active-bar`（选中左竖条）
   所以正解是**改这几个变量的值**（选择器那层原样不动，谁都赢不了谁的问题自然消失）。
   变量定义在 3600 行附近、作用域是 `html[data-paper]:not([data-theme="dark"])`；本块更靠后 ⇒ 覆盖生效。
   调色思路：底/面走中性石墨（不跟内容抢），品牌蓝只留"选中左竖条"这一处。 */
/* ★ 第二轮（用户："设计成高级灰是不是比这个黑乎乎的会好一些"）：石墨 → **高级灰**。
   同一套变量、同一个做法，只把色阶从"深灰底 + 浅字"翻成"浅灰底 + 深字"：
     · 坞：F4F5F7 → EEF0F3 的极浅灰渐变；面板 #F8F9FB（比坞亮一档，靠明度分层）
     · 分隔线 rgba(17,24,39,.06)；字阶 #3F4750 / #6B7280 / #111827
     · 图标砖 rgba(17,24,39,.035)，悬停 .07；选中底 rgba(26,123,217,.10) + 品牌蓝左竖条
   ⚠ 浅底必须配深字：这一块的每个字色都走变量，翻的时候要**整套一起翻**，
   漏一个就会出现"白底白字"（上一轮就是这么翻车的）。 */
html[data-paper]:not([data-theme="dark"]) {
  /* ★ 用户选定 **A · 中灰莫兰迪**（色样见 `_qctest/nav-gray-pick.html`）：
       坞 #DFE1E4（比面深一档）· 面 #E9EAEC · 线 rgba(17,24,39,.10) ·
       字 #33383D / #6B7280 / #111827 · 图标砖 rgba(17,24,39,.05) ·
       选中 #FFFFFF 底 + 3px 品牌蓝左竖条。 */
  --n5-rail-bg: linear-gradient(180deg, #E2E4E7 0%, #D9DCE0 100%);
  /* ★★ 「全新设计」（用户："还是很丑，进行全新设计吧"）—— 不再调色号，换做法：
     **拆掉所有装饰件**（坞砖方底、选中药丸、渐变、内高光、投影），只留"排版 + 一根 2px 竖条"。
     面用暖纸灰（跟纸白页面同族），线压到 .08，字只分三档（深/中/浅），层级全部靠**粗细 + 竖条**表达。 */
  --n5-rail-bg: #EEEDEB;
  --n5-panel-bg: #F4F3F1;
  --n5-line: rgba(60, 50, 40, .08);
  --n5-txt: #46423D;
  --n5-txt-2: #8A857D;
  --n5-txt-hi: #1B1917;
  --n5-btn: transparent;
  --n5-btn-hover: rgba(60, 50, 40, .055);
  --n5-active-bg: transparent;
  --n5-active-bar: #1A7BD9;
  /* ★ 「高级灰」第二轮（用户："这个灰色还是不够高级"）：三个动作 ——
       ① **去掉纯白**：选中底从 #FFF 改成"白 86%→72% 的极浅渐变"（纯白是廉价感第一来源）；
       ② **压饱和**：选中竖条从品牌蓝 #1A7BD9 改成压过饱和的**灰蓝 #4A7FB5**，品牌蓝只在别处出现；
       ③ **给面一点材质**：坞用渐变、选中项加 1px 内高光 + 极轻投影（见下面的补丁）。
     外加把线/字都往"低对比"方向拉一档（rgba(20,24,28,.08) / #343940），少一分锐利就多一分贵。 */
  --n5-panel-bg: #ECEDEF;
  --n5-line: rgba(20, 24, 28, .08);
  --n5-txt: #343940;
  --n5-txt-2: #71787F;
  --n5-txt-hi: #1B2026;
  --n5-btn: rgba(20, 24, 28, .045);
  --n5-btn-hover: rgba(20, 24, 28, .09);
  --n5-active-bg: linear-gradient(180deg, rgba(255, 255, 255, .86) 0%, rgba(246, 247, 248, .70) 100%);
  --n5-active-bar: #4A7FB5;
  /* 品牌区 / 底部这些走 §33 的 --sk-rail-*，同批翻 */
  --sk-rail-txt: #343940;
  --sk-rail-txt-2: #71787F;
  --sk-rail-txt-hi: #1B2026;
  --sk-rail-hover: rgba(20, 24, 28, .05);
  --sk-rail-line: rgba(20, 24, 28, .08);
  --sk-rail-field: #FFFFFF;
  --sk-rail-1: #E5E6E8;
  --sk-rail-2: #DBDDE0;
  --sk-rail-rail-bg: #E0E2E5;
}
/* 浅灰底上的"遗留浅色"：品牌区标题/副标题、底部"在线"、退出登录按钮 ——
   这三处原来按深蓝底配的浅色（白/近白），翻成浅灰后基本看不见了，这里按深浅阶压回去。 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand h1 { color: #111827 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand .sub { color: #6B7280 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand .logo {
  box-shadow: 0 6px 14px -10px rgba(7, 60, 110, .55), inset 0 1px 0 rgba(255, 255, 255, .35) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .conn,
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .conn span { color: #4B5563 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .btn-ghost {
  color: #111827 !important; background: rgba(17, 24, 39, .05) !important;
  border-color: rgba(17, 24, 39, .12) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .btn-ghost:hover {
  background: rgba(17, 24, 39, .09) !important; color: #000000 !important;
}
/* ⚠ 抓到一条"深蓝时代"的漏网规则：选中项的文字被写死成白色（`#fff`），
   而浅灰底上的选中项现在是**白底** ⇒ 白底白字，选中项看起来是个空白框
   （用户截图里"生产概览"那格就是这个）。这里把选中项的文字/图标按浅灰底压成深字；
   深色主题不动（那边白字是对的）。 */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active > span,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on > span,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active > svg,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on > svg { color: #111827 !important; }
/* 坞上选中的类目砖：文字用品牌深蓝（比纯黑有指向性），图标砖本来就是淡蓝底 */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn.on,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn.on > span { color: #0F63B4 !important; }
/* 「高级灰」第三件：**材质**。选中项除了竖条，再给 1px 内高光 + 极轻投影；
   坞砖 hover 也给一点内高光 —— 面与面的层次靠光，而不是靠更黑/更白。 */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on {
  box-shadow: inset 3px 0 0 var(--n5-active-bar), inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(20, 24, 28, .07) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn > svg {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75) !important;
}
/* ── 全新设计：把装饰件全部拆掉 ──────────────────────────────────────────
   坞砖：不要方底/渐变/内高光，图标就是图标；hover 只加 5% 淡底；
        选中＝深字 + 左侧 2px 品牌蓝（不铺底、不加药丸）。
   条目：不要药丸；选中＝**加粗深字 + 左侧 2px 品牌蓝**；行高 32px、左缩进统一 10px。 */
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn {
  background: transparent !important; box-shadow: none !important; border-radius: 0 !important;
  color: var(--n5-txt-2) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn:hover {
  background: var(--n5-btn-hover) !important; color: var(--n5-txt) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn > svg {
  background: transparent !important; box-shadow: none !important;
  width: 17px !important; height: 17px !important; padding: 0 !important;
  color: #6E6A64 !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn.on {
  background: transparent !important; color: var(--n5-txt-hi) !important;
  box-shadow: inset 2px 0 0 var(--n5-active-bar) !important; font-weight: 800 !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-rail .nr-btn.on > svg { color: var(--n5-active-bar) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item {
  background: transparent !important; border-radius: 0 !important;
  padding-left: 10px !important; min-height: 32px !important;
  color: var(--n5-txt) !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item:hover { background: var(--n5-btn-hover) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on {
  background: transparent !important; box-shadow: inset 2px 0 0 var(--n5-active-bar) !important;
  color: var(--n5-txt-hi) !important; font-weight: 800 !important;
}
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active > span,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on > span,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active > svg,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on > svg { color: var(--n5-txt-hi) !important; }
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.active > svg,
html[data-paper]:not([data-theme="dark"]) .sidebar .nav-panel .nav-item.on > svg { color: var(--n5-active-bar) !important; }


/* ===========================================================================
   92. 订单明细 · 明细行「更精美」第一步（2026-10-10 · 用户："把这个界面优化的更精美一些，
       有什么好的设计思路" → 采纳我给的 ①③④）
   ---------------------------------------------------------------------------
   先量后改：这一页 15 列 × 11 行 = 165 个格子里，**115 个是"同一列里重复的值"（70%）**，
   真正逐行会变的只有 柱号 / 核酸编号 / 序列。所以"挤"和"空"是同一个病 —— 同值列占着横向宽度。
   本轮三件事（渲染在 app.js 的 detailRowsHtml，规则见那段注释）：
     ① 整单只有一个值的列**逐行不再渲染**，提到标题行右侧的「整单统一」条
        （保守规则：列里出现第二个值就原样保留；整列全空的直接撤掉，不再刷一排"—"）；
     ② 序列：等宽单行 + 每 10 个碱基一组（原来折两行把行高撑到 47px）；
     ③ 「进度」与「作业完成时间」拆成两列：条 + N/8 同行，时间独立成列。
   顺带：按板号分组的第一行加一条更重的上分界线（不重排数据，只按既有顺序标出来）。
   =========================================================================== */
/* ① 标题行右侧的「整单统一」：小字、灰、竖向细线分隔，安静地待在明细行标题右边 */
html[data-paper] #view > #modalBody.od-page .od-h4 {
  display: flex !important; align-items: baseline !important; gap: 10px !important;
}
/* 第一版是"右对齐飘在标题行右端"，看着像散字（用户："还是很怪异"）——
   改成紧跟标题、**带标签**的一句话：「整单统一 · 纯化方式 HPLC · 分装管数 2 · …」 */
html[data-paper] #view > #modalBody.od-page .od-const {
  display: inline-flex !important; flex-wrap: wrap !important; align-items: baseline !important;
  font-size: 12px !important; color: var(--sk-ink-3) !important;
  font-weight: 400 !important; letter-spacing: 0 !important;
  /* 页头标题两头对齐：`明细行 (N行)` 在左，整单统一靠右收边（原来是紧贴标题、右半段散着） */
  padding-left: 12px !important; margin-left: auto !important;
  border-left: 1px solid var(--ui-line-100) !important;
}
html[data-paper] #view > #modalBody.od-page .od-const > i {
  font-style: normal !important; color: var(--ui-brand-700) !important; opacity: .85 !important;
  margin-right: 8px !important; font-size: 11.5px !important;
}
html[data-paper] #view > #modalBody.od-page .od-const .kv {
  white-space: nowrap !important; color: var(--sk-ink-3) !important;
}
html[data-paper] #view > #modalBody.od-page .od-const .kv i {
  font-style: normal !important; color: var(--sk-ink-3) !important; opacity: .72 !important; margin-right: 3px !important;
}
html[data-paper] #view > #modalBody.od-page .od-const .mx-dot {
  padding: 0 7px !important; color: var(--ui-line-200) !important;
}

/* ② 序列：撤掉 §90 的"两行截断"，改等宽单行 + 10 碱基分组（超出由 CSS 截断，悬停看全文） */
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.seq-cell {
  display: table-cell !important;
  -webkit-line-clamp: none !important; -webkit-box-orient: initial !important;
  white-space: nowrap !important; word-break: normal !important; overflow: hidden !important;
}
/* 序列格 = 左侧碱基串（可截断）+ 右端碱基数：序列列吃剩余宽度，短序列的行原本右边空一大片，
   现在那块空白变成"113 nt"这样的读数（实验室最关心的量），空白就"有主"了。 */
html[data-paper] #view > #modalBody.od-page #rowTbl .seq-line {
  display: flex !important; align-items: baseline !important; gap: 12px !important;
  overflow: hidden !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .seq-bases {
  flex: 1 1 auto !important; min-width: 0 !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 11.5px !important; letter-spacing: .1px !important;
  color: var(--sk-ink-2) !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl .seq-bases .sq { display: inline-block !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .seq-bases .sq + .sq { margin-left: 5px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl .seq-nt {
  flex: none !important; font-style: normal !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 10.5px !important; color: var(--sk-ink-3) !important; opacity: .85 !important;
  letter-spacing: .2px !important;
}
/* 被截断的序列格：可点（就地展开全文，再点收回）—— 行高只在展开的那一行变 */
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.seq-cell { cursor: zoom-in !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.seq-cell.is-open { cursor: zoom-out !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.seq-cell.is-open .seq-bases {
  white-space: normal !important; word-break: break-all !important; text-overflow: clip !important;
}

/* ③ 进度列（条 + N/8 同行）与作业完成时间列。列宽由 app.js 的 colWidths 给到 th 上，
   §90 里那条 `th:last-child{width:232px}` 是"进度+时间还挤在一格"时的旧值，这里按新列宽覆盖。 */
/* 序列列：撤掉 §90 写死的 380px，让它吃剩余宽度（数据列就能保持紧凑） */
html[data-paper] #view > #modalBody.od-page #rowTbl thead th:nth-child(4) { width: auto !important; }
/* 兜底：固定布局下格子一旦装不下就会**溢出压到右边那一列**（实测柱号的「+2」胶囊压住了核酸编号，
   看着像乱码）。所有数据格一律"不换行 + 裁掉"，宁可变省略号也不越界；序列/进度/时间各自有自己的规则。 */
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td {
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.seq-cell,
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.sjt-track-cell,
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.sjt-time-cell { text-overflow: clip !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl thead th:nth-last-child(2) { width: 126px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl thead th:last-child { width: 146px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.sjt-track-cell { max-width: none !important; padding-right: 4px !important; }
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.sjt-time-cell {
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 11.5px !important; color: var(--sk-ink-3) !important; white-space: nowrap !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl tbody td.sjt-time-cell i {
  font-style: normal !important; opacity: .72 !important;
}

/* 顺带：按板号分组的第一行，上边界画重一点（数据顺序没动，只是把既有分组标出来） */
html[data-paper] #view > #modalBody.od-page #rowTbl tbody tr.grp-start > td {
  border-top: 2px solid var(--ui-line-200) !important;
}
html[data-paper] #view > #modalBody.od-page #rowTbl tbody tr.grp-start > td:first-child { font-weight: 700 !important; }


/* ===========================================================================
   93. 订单明细 ·「过站矩阵」视图（2026-10-10 · 用户："你能不能有点自己的设计和想法，
       摆脱现有的思路和布局"）
   ---------------------------------------------------------------------------
   行＝一条引物，列＝一道工序，格子里是「状态 + 过站时间」——把后端本来就是这个形状的
   「站点状态 / 站点时间」矩阵直接画出来，不再翻译成文字列（渲染在 app.js 的 rowsMatrixHtml）。
   列＝工序 与「工序看板」同源；表脚是每道工序的整单汇总，一张图同时回答
   "这条引物走到哪了"和"这单卡在哪一道"。
   注意：主程序有若干条 `#view table thead th{…!important}` 的宽泛规则，这里用
   `#view > #modalBody.od-page #mxTbl …`（3 个 id）盖过去。
   =========================================================================== */
html[data-paper] #view > #modalBody.od-page .mx-wrap {
  max-height: 72vh !important; overflow: auto !important;
  border: 1px solid var(--ui-line-200) !important; border-radius: 12px !important;
  background: var(--panel, #fff) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl {
  width: 100% !important; table-layout: fixed !important;
  border-collapse: separate !important; border-spacing: 0 !important; font-size: 12px !important;
}
/* 表头＝工序轴 */
html[data-paper] #view > #modalBody.od-page #mxTbl thead th {
  position: sticky !important; top: 0 !important; z-index: 3 !important;
  background: var(--panel-2, #F7FAFE) !important;
  border-bottom: 1px solid var(--ui-line-200) !important; border-top: 0 !important;
  padding: 7px 3px !important; height: auto !important;
  font-size: 11px !important; font-weight: 600 !important; letter-spacing: .02em !important;
  color: var(--sk-ink-3) !important; text-align: center !important; white-space: nowrap !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl thead th.mx-id { text-align: left !important; padding-left: 10px !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl thead th i {
  font-style: normal !important; display: inline-block !important;
  width: 13px !important; height: 13px !important; line-height: 13px !important;
  margin-right: 4px !important; border-radius: 50% !important;
  background: var(--ui-line-100) !important; color: var(--sk-ink-3) !important;
  font-size: 9.5px !important; text-align: center !important;
}
/* 报告/入库那两道半工序给一点淡青绿底，跟「工序看板」的分组配色对上 */
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-seg2 { background-color: rgba(10,112,67,.045) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-id { width: 30% !important; text-align: left !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-st { width: 8.25% !important; }
/* ★ 打磨二：板号/工作中心/工艺编码/纯化/管数 都提到组头之后，身份列只要装"核酸编号 + 柱号"，
   收窄到 22%，把宽度让给八道工序格（每格 9.25%） */
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-id { width: 22% !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-st { width: 9.25% !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-len { width: 4% !important; text-align: right !important; padding-right: 10px !important; }
/* 行首身份 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody th.mx-id {
  font-weight: 400 !important; padding: 5px 8px 5px 10px !important;
  border-bottom: 1px solid var(--ui-line-100) !important; white-space: nowrap !important; overflow: hidden !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody th.mx-id b {
  display: inline-block !important; margin-right: 8px !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 12px !important; font-weight: 700 !important; color: var(--sk-ink) !important; letter-spacing: .2px !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody th.mx-id em {
  display: inline !important; font-style: normal !important;
  font-size: 10.5px !important; color: var(--sk-ink-3) !important;
}
/* 格子 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.mx-cell {
  border-bottom: 1px solid var(--ui-line-100) !important;
  padding: 4px 2px !important; text-align: center !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 10.5px !important; color: var(--sk-ink-3) !important;
  white-space: nowrap !important; overflow: hidden !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.mx-cell i { font-style: normal !important; margin-right: 3px !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-done { background-color: rgba(26,123,217,.075) !important; color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-done i { color: var(--ui-ok-solid) !important; font-weight: 700 !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-cur {
  background-color: rgba(26,123,217,.15) !important; color: var(--ui-brand-700) !important;
  font-weight: 700 !important; box-shadow: inset 0 0 0 1.5px var(--ui-brand-600) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-skip {
  /* 原来这里是斜纹底 —— 19 行 × 3 列铺起来是一层"纹理噪声"（用户："看着不是很清晰"）。
     `⊘` 记号本身已经把"跳过"和"未到"区分开了，所以斜纹撤掉，只留极浅的底 + 灰字。 */
  color: var(--sk-ink-3) !important; opacity: 1 !important;
  background-color: rgba(23,32,43,.028) !important;
  background-image: none !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.mx-len { color: var(--sk-ink-3) !important; font-family: var(--mono, ui-monospace, Consolas, monospace) !important; font-size: 11px !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.mx-len i { font-style: normal !important; font-size: 9.5px !important; opacity: .8 !important; margin-left: 1px !important; }
/* 板号分组重分界线 + 行悬停 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.grp-start > * { border-top: 2px solid var(--ui-line-200) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr:hover > * { background-color: rgba(26,123,217,.05) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr:hover th.mx-id b { color: var(--ui-brand-700) !important; }
/* 表脚：每道工序的整单汇总（细条 + N/M） */
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot th,
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot td {
  position: sticky !important; bottom: 0 !important; z-index: 2 !important;
  background: var(--panel-2, #F7FAFE) !important;
  border-top: 1px solid var(--ui-line-200) !important; padding: 6px 3px !important; text-align: center !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot th.mx-id { text-align: left !important; padding-left: 10px !important; font-size: 11.5px !important; color: var(--sk-ink-3) !important; font-weight: 600 !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-bar {
  display: block !important; height: 4px !important; margin: 0 5px 3px !important;
  border-radius: 99px !important; background: var(--ui-line-100) !important; overflow: hidden !important;
}
/* 细条两段：深蓝＝该工序已完成，浅蓝＝正在这道工序（在制）——"卡在哪一道"一眼看出来 */
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-bar { display: flex !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-bar i.done { background: var(--ui-brand-600) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-bar i.run { background: rgba(26,123,217,.32) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-sum b { color: var(--ui-brand-700) !important; font-weight: 700 !important; font-size: 10px !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-sum em { font-style: normal !important; font-size: 10px !important; color: var(--sk-ink-3) !important; }
/* 图例 */
/* ── 打磨补充（第二轮） ───────────────────────────────────────────────── */
/* 1. 组头：板号 + 行数 + 该组公共参数（工作中心/工艺编码/纯化/管数） */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > th,
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > td {
  background: var(--panel-2, #F7FAFE) !important;
  border-top: 1px solid var(--ui-line-200) !important; border-bottom: 1px solid var(--ui-line-200) !important;
  padding: 5px 8px 5px 10px !important; text-align: left !important; font-weight: 400 !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > th.mx-grp-k {
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important; font-size: 12px !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > th.mx-grp-k b { color: var(--sk-ink) !important; font-weight: 700 !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > th.mx-grp-k em {
  font-style: normal !important; margin-left: 6px !important; font-size: 10.5px !important; color: var(--sk-ink-3) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > td.mx-grp-m {
  font-family: inherit !important; font-size: 11px !important; color: var(--sk-ink-3) !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
/* 2. 列分隔：给矩阵一条真正的"网格感"，空白列就不再像荒地；生产段与报告段之间加一条稍重的竖线 */
html[data-paper] #view > #modalBody.od-page #mxTbl th.mx-st,
html[data-paper] #view > #modalBody.od-page #mxTbl td.mx-cell { border-left: 1px solid var(--ui-line-100) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl th.mx-st:first-of-type,
html[data-paper] #view > #modalBody.od-page #mxTbl td.mx-cell:first-of-type { border-left: 0 !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl th.mx-seg2:not(.mx-len),
html[data-paper] #view > #modalBody.od-page #mxTbl td.mx-seg2:not(.mx-len) { border-left: 1px solid var(--ui-line-200) !important; }
/* 3. "还没到"的格子画一条极淡的虚线轨道，表示流程从这里继续（空 ≠ 缺数据） */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-todo {
  background-image: linear-gradient(to bottom, transparent calc(50% - .5px), var(--ui-line-100) calc(50% - .5px), var(--ui-line-100) calc(50% + .5px), transparent calc(50% + .5px)) !important;
  background-repeat: no-repeat !important;
}
/* 4. "全单已跳过"的工序：整列去掉斜纹，只留安静的 ⊘（表头有一枚小签说明） */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-skip-all {
  background-image: none !important; opacity: 1 !important;
  color: var(--sk-ink-3) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl thead th.mx-allskip { color: var(--sk-ink-3) !important; opacity: .85 !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl thead th .mx-tag {
  display: block !important; font-style: normal !important; font-weight: 400 !important;
  font-size: 9.5px !important; color: var(--sk-ink-3) !important; opacity: .8 !important; margin-top: 1px !important;
}
/* 图例里的"跳过"记号也去掉斜纹 */
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-skip {
  background-image: none !important; color: var(--sk-ink-3) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-foot { margin-top: 8px !important; font-size: 11px !important; color: var(--sk-ink-3) !important; line-height: 1.7 !important; }
/* 图例压成四个小记号 + 一个 ? （原来的整段说明文字已收进 ? 的悬停与 docs） */
html[data-paper] #view > #modalBody.od-page .mx-foot {
  display: flex !important; align-items: center !important; gap: 14px !important;
  margin-top: 7px !important;
}
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k {
  font-weight: 600 !important; padding: 0 !important; border-radius: 4px !important;
  font-size: 11px !important; color: var(--sk-ink-3) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-done { color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-cur { color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-help {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 15px !important; height: 15px !important; border-radius: 50% !important;
  border: 1px solid var(--ui-line-200) !important; background: #fff !important;
  font-size: 10.5px !important; font-weight: 700 !important; color: var(--sk-ink-3) !important;
  cursor: help !important;
}
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-done { background: rgba(26,123,217,.075) !important; color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-cur { background: rgba(26,123,217,.15) !important; color: var(--ui-brand-700) !important; box-shadow: inset 0 0 0 1px var(--ui-brand-600) !important; }
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-skip { color: var(--sk-ink-3) !important; background-image: repeating-linear-gradient(45deg, rgba(23,32,43,.05) 0 4px, transparent 4px 8px) !important; }
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-k.is-todo { color: var(--sk-ink-3) !important; }
/* ── 打磨第三轮：行级异常、停留时长、组头折叠、打印 ─────────────────────── */
/* 行级异常：行首一条竖条（红＝该行有未补报的工序；黄＝状态与多数行不同），悬停看原因 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-red > th.mx-id {
  box-shadow: inset 3px 0 0 var(--ui-danger-solid) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-amber > th.mx-id {
  box-shadow: inset 3px 0 0 var(--ui-warn-solid) !important;
}
/* 上面那两条 box-shadow 在实测里被别的规则吃掉了（computed 落成透明 inset），
   所以真正画竖条的是下面这枚 ::before（同区块的组头 ▾ 走的也是 ::before，实测有效）。 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-red > th.mx-id,
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-amber > th.mx-id { position: relative !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-red > th.mx-id::before,
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-amber > th.mx-id::before {
  content: '' !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important;
  width: 3px !important; border-radius: 0 2px 2px 0 !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-red > th.mx-id::before { background: var(--ui-danger-solid) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-flag-amber > th.mx-id::before { background: var(--ui-warn-solid) !important; }
/* 当前工序格里的"已停留"：比正文再小一档、比"生产中"淡一点 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-cur .mx-stay {
  font-style: normal !important; display: block !important;
  margin-top: 1px !important; font-size: 9.5px !important; font-weight: 400 !important;
  color: var(--ui-brand-700) !important; opacity: .8 !important;
}
/* 组头：可点、折叠态给一枚 ▸/▾ */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp { cursor: pointer !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp > th.mx-grp-k::before {
  content: '▾' !important; display: inline-block !important; margin-right: 6px !important;
  font-size: 9px !important; color: var(--sk-ink-3) !important; vertical-align: 1px !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp.is-folded > th.mx-grp-k::before { content: '▸' !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp:hover > th,
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp:hover > td { background: #EFF5FD !important; }
html[data-paper] #view > #modalBody.od-page .mx-foot .mx-hint { margin-left: 10px !important; opacity: .8 !important; }
/* 「打印」按钮：跟着「关闭明细」那一排，样式轻一档 */
html[data-paper] #view > #modalBody.od-page .od-print { margin-left: 8px !important; }
/* 交期倒计时胶囊：剩 N 天 / 今天到期 / 已逾期 N 天（合作单豁免走灰蓝，不吓人） */
html[data-paper] #view > #modalBody.od-page .od-due { font-weight: 700 !important; letter-spacing: .02em !important; }
html[data-paper] #view > #modalBody.od-page .od-due.is-ok { background: rgba(23,32,43,.05) !important; color: var(--sk-ink-2) !important; }
html[data-paper] #view > #modalBody.od-page .od-due.is-soon { background: rgba(169,78,8,.12) !important; color: var(--ui-warn-solid) !important; }
html[data-paper] #view > #modalBody.od-page .od-due.is-over { background: rgba(179,32,46,.12) !important; color: var(--ui-danger-solid) !important; }
html[data-paper] #view > #modalBody.od-page .od-due.is-coop { background: rgba(26,123,217,.10) !important; color: var(--ui-brand-700) !important; }
/* 打印页眉：屏幕上完全不显示，只有打印时才出现 */
html[data-paper] #view > #modalBody.od-page .mx-print-only { display: none !important; }
/* ===========================================================================
   94. 订单明细页 · 页头与工具栏「排整齐」（2026-10-11 · 用户："这个界面能否做得更工整
       一些，尤其是顶部信息看起来很乱"）
   ---------------------------------------------------------------------------
   乱在哪（对着截图一条条数）：
     ① 副标题把 客户 · 类别 · 类别标题 拼成一句，于是「合作订单」徽标后面又跟了一遍
        `coop · 合作订单`，同一条信息说三遍；
     ② 关键值（进度/预计完成/数量/累计OD）原来是一行内联的"值 标签 值 标签…"，
        没有列的边界，眼睛只能顺着读；「当前工序」还单独占一条状态条；
     ③ 筛选胶囊、排列开关、搜索框各占一行，左对齐、高度不一，看着散。
   改法：
     ① 副标题只留客户名（类别在「概览」页里还有）；
     ② KPI 改成**等宽五列栅格**：每格「标签在上 / 值在下」，格与格用 1px 竖线分隔，
        「当前工序」并进第 5 格 —— 页头因此是"两行标题 + 一条栅格"；
     ③ 三个控件收进一条 `.od-toolbar`：分组筛选靠左、排列居中、搜索靠右，高度统一 28px。
   =========================================================================== */
html[data-paper] #view > #modalBody.od-page .od-title {
  display: flex !important; align-items: baseline !important; gap: 10px !important;
  flex-wrap: wrap !important; width: 100% !important; margin: 0 0 2px !important;
}
html[data-paper] #view > #modalBody.od-page .od-title h3 {
  font-size: 17px !important; font-weight: 800 !important; letter-spacing: -.2px !important;
}
html[data-paper] #view > #modalBody.od-page .od-title .sub { font-size: 12px !important; }
/* KPI 栅格：五列等宽、标签在上值在下、竖线分隔 */
html[data-paper] #view > #modalBody.od-page .od-kpis {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  padding: 6px 0 !important;
  border-top: 1px solid var(--ui-line-100) !important;
  border-bottom: 1px solid var(--ui-line-100) !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important;
  justify-content: center !important; gap: 2px !important;
  padding: 0 14px !important; min-height: 42px !important;
  border-left: 1px solid var(--ui-line-100) !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-main {
  display: flex !important; flex-direction: column-reverse !important; align-items: flex-start !important; gap: 1px !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-main .v {
  font-size: 16px !important; font-weight: 700 !important; line-height: 1.25 !important;
  color: var(--sk-ink) !important; font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-main .l {
  font-size: 11px !important; color: var(--sk-ink-3) !important; letter-spacing: .06em !important;
}
/* 第 5 格：当前工序（胶囊可能不止一个，允许换行） */
html[data-paper] #view > #modalBody.od-page .odkpi-cur .od-status-chips { display: flex !important; gap: 4px !important; flex-wrap: wrap !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-cur .badge { font-size: 11px !important; padding: 1px 7px !important; }
/* KPI 的"副读数"：主值下面的那条小字（在制 N 行 / 剩 N 天 / 平均 OD / 最久停留）
   —— 光有主值看不出所以然，副读数把"这个数意味着什么"写出来；带状态时按档着色。 */
html[data-paper] #view > #modalBody.od-page .odkpi-sub {
  font-style: normal !important; font-size: 11px !important;
  color: var(--sk-ink-3) !important; margin-top: 2px !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
  max-width: 100% !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-sub.is-warn { color: var(--ui-warn-solid) !important; font-weight: 600 !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-sub.is-over { color: var(--ui-danger-solid) !important; font-weight: 600 !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-sub.is-coop { color: var(--ui-brand-700) !important; font-weight: 600 !important; }
/* 进度那格的双色条：深＝已入库、浅＝在制（0% 时也不会只剩一条莫名其妙的空滑轨） */
html[data-paper] #view > #modalBody.od-page .odkpi-bar {
  display: flex !important; width: 100% !important; max-width: 170px !important; height: 5px !important;
  margin-top: 4px !important; border-radius: 99px !important; background: var(--ui-line-100) !important; overflow: hidden !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-bar > i { display: block !important; height: 100% !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-bar > i.ok { background: var(--ui-brand-600) !important; }
html[data-paper] #view > #modalBody.od-page .odkpi-bar > i.run { background: rgba(26,123,217,.30) !important; }
/* 行可点：身份格右缘一枚小箭头（悬停/展开时变色）—— 让"这行能点开"看得见 */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row > th.mx-id { position: relative !important; padding-right: 18px !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row > th.mx-id::after {
  content: '▸' !important; position: absolute !important; right: 6px !important; top: 50% !important;
  transform: translateY(-50%) !important; font-size: 10px !important; color: var(--ui-line-200) !important;
  transition: color .15s !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row:hover > th.mx-id::after { color: var(--ui-brand-600) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row[aria-expanded="true"] > th.mx-id::after { content: '▾' !important; color: var(--ui-brand-600) !important; }
/* 工具栏：一条线，左中右对齐，控件高度统一 */
html[data-paper] #view > #modalBody.od-page .od-toolbar {
  display: flex !important; align-items: center !important; gap: 10px 14px !important;
  flex-wrap: wrap !important; margin: 8px 0 10px !important;
}
html[data-paper] #view > #modalBody.od-page .od-toolbar .search {
  margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important;
}
html[data-paper] #view > #modalBody.od-page .od-toolbar .od-search {
  margin-left: auto !important;   /* 搜索靠右 */
}
html[data-paper] #view > #modalBody.od-page .od-search input {
  flex: 0 0 auto !important; width: 260px !important; max-width: 260px !important;
  height: 28px !important; padding: 0 10px !important;
  border: 1px solid var(--ui-line-200) !important; border-radius: 8px !important;
  font-size: 12.5px !important; background: #fff !important;
}
html[data-paper] #view > #modalBody.od-page .od-search input:focus {
  outline: none !important; border-color: var(--ui-brand-500) !important;
  box-shadow: 0 0 0 3px rgba(26,123,217,.12) !important;
}
html[data-paper] #view > #modalBody.od-page .od-search #rowSearchCount { font-size: 11.5px !important; color: var(--sk-ink-3) !important; }
html[data-paper] #view > #modalBody.od-page .od-toolbar .chip { height: 28px !important; display: inline-flex !important; align-items: center !important; }
html[data-paper] #view > #modalBody.od-page .od-toolbar .mx-sortctl { margin: 0 !important; }
html[data-paper] #view > #modalBody.od-page .od-toolbar .mx-sortctl button { height: 28px !important; padding: 0 12px !important; }
/* 排列方式切换（板号分组 / 按工序聚堆）：跟筛选胶囊同一排，轻轻的 */
/* ── 第六轮：聚堆分段、命中高亮、空态、键盘态 ─────────────────────────── */
/* 聚堆模式的分段行：换一道工序就一条（▶ 工序名 | 条数 · 排序说明） */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > th,
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > td {
  background: #F4F8FD !important; border-top: 1px solid var(--ui-line-200) !important;
  padding: 5px 8px 5px 10px !important; text-align: left !important; font-weight: 400 !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > th.mx-sep-k {
  font-size: 12px !important; font-weight: 700 !important; color: var(--ui-brand-700) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > th.mx-sep-k i {
  font-style: normal !important; margin-right: 5px !important; font-size: 10px !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > td.mx-sep-m {
  font-family: inherit !important; font-size: 11px !important; color: var(--sk-ink-3) !important;
}
/* 段头里的"最久停留"：卡得久要看得出来（<1天 灰 / 1~3天 琥珀 / >3天 红） */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > td.mx-sep-m .mx-seg-stay {
  margin-left: 10px !important; padding: 1px 7px !important; border-radius: 999px !important;
  background: rgba(23,32,43,.05) !important; color: var(--sk-ink-2) !important; font-weight: 600 !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > td.mx-sep-m .mx-seg-stay.is-warn {
  background: rgba(169,78,8,.12) !important; color: var(--ui-warn-solid) !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-sep > td.mx-sep-m .mx-seg-stay.is-over {
  background: rgba(179,32,46,.12) !important; color: var(--ui-danger-solid) !important;
}
/* 「整单统一」的 +N 省略号：可悬停 */
html[data-paper] #view > #modalBody.od-page .od-const .od-const-more { cursor: help !important; color: var(--ui-brand-700) !important; opacity: 1 !important; }
/* ── 行详情（点矩阵里任意一行就地展开）───────────────────────────────────── */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row { cursor: pointer !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row:focus-visible {
  outline: 2px solid var(--ui-brand-500) !important; outline-offset: -2px !important;
}
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-row[aria-expanded="true"] > th.mx-id b { color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-rd > td {
  padding: 0 !important; border-bottom: 1px solid var(--ui-line-200) !important;
  background: #F7FAFE !important;
}
html[data-paper] #view > #modalBody.od-page .mx-rd-wrap {
  display: flex !important; flex-direction: column !important; gap: 8px !important;
  padding: 11px 14px 13px !important; border-left: 3px solid var(--ui-brand-600) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-rd-seq { display: flex !important; align-items: center !important; gap: 12px !important; }
/* ⚠ 类名要带前缀：第一版这里写的是 `.lb`，被 app.css:2383 那条通用的
   `.lb{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;cursor:pointer}` 命中，
   "序列 88 nt" 被挤成了三行竖排。同理 `.dot` 也有同名规则（app.css:139）。 */
html[data-paper] #view > #modalBody.od-page .mx-rd-seq .mx-rd-lbl {
  flex: none !important; font-size: 11px !important; color: var(--sk-ink-3) !important;
  white-space: nowrap !important;
}
html[data-paper] #view > #modalBody.od-page .mx-rd-seq .mx-rd-lbl b { color: var(--sk-ink) !important; }
html[data-paper] #view > #modalBody.od-page .mx-rd-bases {
  flex: 1 1 auto !important; min-width: 0 !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 12px !important; letter-spacing: .1px !important; color: var(--sk-ink) !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html[data-paper] #view > #modalBody.od-page .mx-rd-bases .sq { display: inline-block !important; }
html[data-paper] #view > #modalBody.od-page .mx-rd-bases .sq + .sq { margin-left: 6px !important; }
html[data-paper] #view > #modalBody.od-page .mx-rd-copy {
  flex: none !important; font: inherit !important; font-size: 11.5px !important;
  padding: 3px 10px !important; border-radius: 7px !important; cursor: pointer !important;
  border: 1px solid var(--ui-line-200) !important; background: #fff !important; color: var(--ui-brand-700) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-rd-copy:hover { border-color: var(--ui-brand-500) !important; background: rgba(26,123,217,.06) !important; }
/* 参数行：标签 + 值，一列一列排 */
html[data-paper] #view > #modalBody.od-page .mx-rd-params {
  display: flex !important; flex-wrap: wrap !important; gap: 4px 22px !important;
  font-size: 12px !important; color: var(--sk-ink-2) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-rd-params .kv i {
  font-style: normal !important; color: var(--sk-ink-3) !important; margin-right: 5px !important; font-size: 11px !important;
}
/* 八站时间轴：每站一块（站名 / 时间 / 停留） */
html[data-paper] #view > #modalBody.od-page .mx-rd-tl { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl {
  flex: 1 1 96px !important; min-width: 96px !important;
  display: flex !important; flex-direction: column !important; gap: 1px !important;
  padding: 5px 8px !important; border-radius: 8px !important;
  background: #fff !important; border: 1px solid var(--ui-line-100) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-tl em { font-style: normal !important; font-size: 10.5px !important; color: var(--sk-ink-3) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl b {
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 11.5px !important; font-weight: 700 !important; color: var(--sk-ink) !important;
}
html[data-paper] #view > #modalBody.od-page .mx-tl i { font-style: normal !important; font-size: 10px !important; color: var(--sk-ink-3) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl.is-done { background: rgba(26,123,217,.06) !important; border-color: rgba(26,123,217,.22) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl.is-done b { color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl.is-cur { background: rgba(26,123,217,.13) !important; border-color: var(--ui-brand-600) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl.is-cur b { color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl.is-skip { background: rgba(23,32,43,.028) !important; }
html[data-paper] #view > #modalBody.od-page .mx-tl.is-todo { background: transparent !important; border-style: dashed !important; opacity: .75 !important; }
/* 搜索命中：把命中的那几个字符圈出来 */
html[data-paper] #view > #modalBody.od-page #mxTbl .mx-mark {
  background: rgba(169,78,8,.16) !important; color: inherit !important;
  border-radius: 2px !important; padding: 0 1px !important;
}
/* 组头键盘焦点：给个看得见的环（只在键盘操作时出现） */
html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr.mx-grp:focus-visible {
  outline: 2px solid var(--ui-brand-500) !important; outline-offset: -2px !important;
}
/* 空结果提示 */
html[data-paper] #view > #modalBody.od-page .mx-empty {
  padding: 22px 14px !important; text-align: center !important;
  font-size: 13px !important; color: var(--sk-ink-3) !important;
  background: var(--panel-2, #F7FAFE) !important; border: 1px dashed var(--ui-line-200) !important; border-radius: 12px !important;
}
html[data-paper] #view > #modalBody.od-page .mx-empty .mx-clear {
  margin-left: 6px !important; font: inherit !important; font-size: 12.5px !important;
  color: var(--ui-brand-700) !important; background: none !important; border: 0 !important;
  cursor: pointer !important; text-decoration: underline !important;
}
html[data-paper] #view > #modalBody.od-page .mx-sortctl {
  display: inline-flex !important; align-items: center !important; gap: 0 !important;
  margin: 6px 0 8px !important; vertical-align: middle !important;
}
html[data-paper] #view > #modalBody.od-page .mx-sortctl .lbl { font-size: 12px !important; color: var(--sk-ink-3) !important; margin-right: 6px !important; }
html[data-paper] #view > #modalBody.od-page .mx-sortctl button {
  font: inherit !important; font-size: 12px !important;
  padding: 3px 10px !important; cursor: pointer !important;
  background: #fff !important; color: var(--sk-ink-2) !important;
  border: 1px solid var(--ui-line-200) !important; border-left-width: 0 !important;
}
html[data-paper] #view > #modalBody.od-page .mx-sortctl button:first-of-type { border-left-width: 1px !important; border-radius: 6px 0 0 6px !important; }
html[data-paper] #view > #modalBody.od-page .mx-sortctl button:last-of-type { border-radius: 0 6px 6px 0 !important; }
html[data-paper] #view > #modalBody.od-page .mx-sortctl button:hover { color: var(--ui-brand-700) !important; }
html[data-paper] #view > #modalBody.od-page .mx-sortctl button.on {
  background: var(--ui-brand-600) !important; border-color: var(--ui-brand-600) !important;
  color: #fff !important; font-weight: 700 !important;
}
/* ---------------------------------------------------------------------------
   打印：实验室会想把这单打出来对照着做。打印时只留明细页本体 ——
   侧栏/顶栏/页签/筛选/搜索/图例都不要，矩阵占满 A4 横向，字号收到 10px。
   --------------------------------------------------------------------------- */
/* ⚠ 打印规则必须把选择器写得和屏幕规则**一样长**（甚至更长）再带 !important ——
   @media 不会给规则任何"优先级加成"，第一版写短了（少一个 html[data-paper]）就被屏幕规则压住了。 */
@media print {
  @page { size: A4 landscape; margin: 10mm; }
  html, body { background: #fff !important; }
  .sidebar, .topbar, .app-tabs, .drawer, #toasts, .modal-bg, #dlg,
  html[data-paper] #view > #modalBody.od-page .od-back,
  html[data-paper] #view > #modalBody.od-page .close,
  html[data-paper] #view > #modalBody.od-page #odTabs,
  html[data-paper] #view > #modalBody.od-page .search,
  html[data-paper] #view > #modalBody.od-page .mx-foot { display: none !important; }
  html[data-paper] .app, html[data-paper] .main, html[data-paper] #view {
    display: block !important; overflow: visible !important; height: auto !important; max-height: none !important;
  }
  html[data-paper] #view > #modalBody.od-page {
    position: static !important; height: auto !important; padding: 0 !important; margin: 0 !important;
  }
  html[data-paper] #view > #modalBody.od-page .detail-section {
    box-shadow: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important;
  }
  html[data-paper] #view > #modalBody.od-page .od-h4 { margin: 0 0 4px !important; }
  /* 打印页眉：屏幕上藏起来的那一行，打印时放到最上面 */
  html[data-paper] #view > #modalBody.od-page .mx-print-only {
    display: block !important;
    font-size: 11px !important; color: #333 !important;
    border-bottom: 1px solid #B9C6D6 !important; padding-bottom: 4px !important; margin-bottom: 8px !important;
  }
  /* 打印页脚：行数 · 打印时间 · 数据源 */
  html[data-paper] #view > #modalBody.od-page .mx-print-only.mx-print-foot {
    border-bottom: 0 !important; border-top: 1px solid #B9C6D6 !important;
    padding: 4px 0 0 !important; margin: 8px 0 0 !important;
  }
  html[data-paper] #view > #modalBody.od-page .mx-sortctl { display: none !important; }
  html[data-paper] #view > #modalBody.od-page .mx-wrap {
    max-height: none !important; overflow: visible !important; border: 1px solid #B9C6D6 !important;
  }
  html[data-paper] #view > #modalBody.od-page #mxTbl { font-size: 10px !important; }
  html[data-paper] #view > #modalBody.od-page #mxTbl thead th,
  html[data-paper] #view > #modalBody.od-page #mxTbl tfoot th,
  html[data-paper] #view > #modalBody.od-page #mxTbl tfoot td { position: static !important; }
  html[data-paper] #view > #modalBody.od-page #mxTbl tbody th.mx-id b { font-size: 10.5px !important; }
  html[data-paper] #view > #modalBody.od-page #mxTbl tbody th.mx-id em,
  html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.mx-cell { font-size: 9.5px !important; }
  html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-done,
  html[data-paper] #view > #modalBody.od-page #mxTbl tfoot .mx-bar i.done {
    background: #E4EEFA !important; -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important;
  }
  html[data-paper] #view > #modalBody.od-page #mxTbl tbody td.is-cur {
    background: #D8E8F8 !important; -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important;
  }
  html[data-paper] #view > #modalBody.od-page #mxTbl tbody tr { break-inside: avoid !important; }
}


/* ===========================================================================
   96. 左栏浮岛 · 两处交付前漏检的回归（2026-10-11 · 用户："带点脑子干活，交付前都不验证一下的吗"）
   ---------------------------------------------------------------------------
   用户截图上的两个坏点，都能在无头浏览器里复现（不靠"看着还行"就交付）：
     ① **浮岛图标被撑成 ~78px 的巨型描边**，正好压在页面「实时数据 / 本地台账」那一行上。
        实测链：`.nav-panel-h` 里是 `iconFor()` 直接吐出来的裸 `<svg>`，而全站没有任何规则
        给它定尺寸（现成的尺寸规则全写在 `.nav-item svg` / `.nr-btn svg` / `.nav-panel-h > i` 上）
        ⇒ 无尺寸 SVG 在 flex 行里按"撑满"处理。定位命令：`node _qctest/big-glyph.cjs`（打祖先链）、
        `node _qctest/fly-css-why.cjs`（CDP 打命中规则 —— 这枚 svg 的命中列表是**空的**）。
     ② **浮岛被页面内容盖住**（KPI 卡、今日实况条直接压在浮岛上面，浮岛像被切碎）。
        实测链：skin.css 的 `html[data-skin="E"]:not([data-theme="dark"]) .sidebar > * { position: relative; z-index: 1 }`
        把 `<nav>` 变成一个 **z-index:1 的层叠上下文**；页面里 `.ov-kpis-dark` 也是 `z-index:1`
        且在 DOM 更靠后 ⇒ 同级后者胜，浮岛（在 nav 内部 z-index:60）被整体压下去。
        修法：**浮岛打开时**把 `<nav>` 抬到 z-index:5 —— 页面内容 ≤1、模态/抽屉遮罩 ≥55，仍在它之下。
   验收：`node _qctest/fly-verify.cjs`（1920×956 冷启动 + 浮岛打开 + 十类目逐个过）。
   =========================================================================== */
/* ① 浮岛头部：图标定死尺寸（借条目图标时，外壳由 iconFor() 统一给 viewBox） */
html[data-paper] .sidebar .nav-panel-h { align-items: center !important; }
html[data-paper] .sidebar .nav-panel-h > svg {
  flex: 0 0 auto !important; width: 15px !important; height: 15px !important;
  color: var(--n5-txt-2) !important;
}
/* 兜底：浮岛里任何"没人管"的 SVG 都不许超过 26px（下次再塞裸 svg 也不会再撑爆布局）。
   （26 而不是 20：§97 的"图标砖"是 15px 图标 + 内边距 = 22~23px，得让它过得去。） */
/* ⚠ 排除 §97 的连线层（`.fan-layer`，上一版扇形留下的，可能还挂在旧缓存里）。 */
html[data-paper] .sidebar .nav-panel svg:not(.fan-layer) { max-width: 26px !important; max-height: 26px !important; }
/* ② 浮岛打开时整条左栏抬到页面内容之上。
   ★★ 2026-10-12 v32（用户：「我这个程序导航条会被遮挡」）：**5 → 10001**。
   旧值 5 有个致命陷阱：z-index 会**创建层叠上下文**，浮岛面板自己的 z-index:10001
   被关在 nav 这个 z-index:5 的上下文里，于是页面里任何 z-index:5 的粘性表头都能盖住它 ——
   midqc.css 的 `.mqz-lg-hd`（送检台账表头：批次号 + 全选）正好是 sticky + z-index:5，
   而 .main 在 DOM 里排在 .sidebar 之后 ⇒ 同级后者胜，浮岛被整块压住。
   实测（_qctest/_nav-chain.cjs）：elementFromPoint 打浮岛正中，命中的就是 `.mqz-lg-hd > i`。
   10001 与「页面模态遮罩」同值：同值时 DOM 靠后者胜 ⇒ 模态仍然盖得住导航（符合预期），
   而页面内容与各类浮层（抽屉 9000 / 菜单 9999 / 报表 2000 …）一律在导航之下，
   toast(99999) 仍在最上。 */
html.nav-fly .sidebar > nav { z-index: 10001 !important; }


/* ===========================================================================
   97. 左栏：收缩态「石墨灰」＋ 扇形浮岛（2026-10-11 · 用户："我这个收缩后的导航条颜色看着
       很不清晰，能不能改成高级的石墨灰，还有点开的交互方式太占用空间了，完全可以做成那种
       炫酷的扇形交互方式"）
   ---------------------------------------------------------------------------
   ① **石墨灰**：把 §95 那套"浅灰底 + 深字"整套翻回**冷调石墨**，但不用纯黑（纯黑＝廉价，
      用户上一次已经否过）：底 #262B33 → #1C2027 的竖向渐变，字只分三档
      （#E8ECF2 / #AEB7C2 / #7E8794），线 rgba(255,255,255,.08)，图标砖 rgba(255,255,255,.06)，
      选中＝品牌蓝淡底 + 2px 左竖条。实测对比度：标签/图标 #AEB7C2 on #22262C ≈ 7.4:1。
      ⚠ §95 里有一批**写死的深色**（品牌标题 #111827、底部"在线" #4B5563、退出按钮 #111827 +
      rgba(17,24,39,.05) 底）——那是给浅灰底配的，翻回石墨底必须一起翻，否则就是黑底黑字。
   ② **扇形浮岛**：不再往右铺一整条竖面板（那才是"占空间"的来源），改成从被点的坞砖右侧
      **呈扇形散开**的胶囊片：左缘落在一条以坞砖为圆心的圆弧上，片与片垂直净距 ≥ 片高 + 缝
      （几何与兜底见 nav-collapse.js 的 layoutFan()），逐片错时 24ms 从坞砖"长"出来，
      后面跟一层 14% 的极淡遮罩（点一下即收），不占位、不推挤页面。
      ⚠ 坞要压在遮罩**上面**（否则点不到坞砖）——见 `.nav-rail{z-index:61}`。
      ⚠ ≤760px 的老面板/抽屉形态在本节末尾还原，别让它跟着变成扇形。
   回退：删本节 ⇒ 回到 §95 的浅灰 + 右侧竖面板。
   =========================================================================== */
/* 深色主题下这张卡片用"深玻璃"，否则 --nav-glass 在这套作用域里没有定义（会变透明） */
html[data-paper][data-theme="dark"] {
  --nav-glass: rgba(28, 34, 46, .96);
  --nav-glass-line: rgba(255, 255, 255, .13);
  --nav-glass-ink: #E7ECF5;
  --nav-glass-ink-2: #9AA6B8;
  --nav-badge-bg: rgba(214, 158, 46, .26);
  --nav-badge-ink: #FFDCA6;
  --nav-badge-ring: rgba(224, 176, 96, .30);
  --nav-row-hover-bg: rgba(255, 255, 255, .08);
  --nav-row-on-bg: rgba(255, 255, 255, .12);
  --nav-plate-bg: radial-gradient(closest-side circle at 0% 50%,
        rgba(22, 28, 40, .88) 0%, rgba(22, 28, 40, .62) 58%,
        rgba(22, 28, 40, .26) 88%, rgba(22, 28, 40, .06) 100%);
  --nav-plate-line: rgba(255, 255, 255, .16);
  --nav-chip-bg: rgba(255, 255, 255, .16);
  --nav-chip-ring: rgba(255, 255, 255, .14);
  --nav-row-hover2: rgba(255, 255, 255, .18);
  --nav-row-active-bg: linear-gradient(90deg, rgba(255, 255, 255, .20) 0%, rgba(122, 150, 255, .26) 100%);
  --nav-row-active-ring: rgba(140, 165, 255, .35);
  --nav-strip-bg: rgba(255, 255, 255, .10);
  --nav-strip-line: rgba(255, 255, 255, .10);
  /* 深色主题下这套也得有值：坞砖名字/选中条/卡片强调色都引用它们（否则 var() 解析失败） */
  --nav-ink: #C3CDE8;
  --nav-ink-2: #9FABCF;
  --nav-ink-hi: #F2F5FF;
  --nav-accent: #8AA2FF;
  --nav-on-2: #A9BBFF;
}

/* ── ① 左栏配色「墨玉青」：整套只认下面这组 `--nav-*`（换色只改这几行） ──────────
   为什么不再用石墨：用户原话「还是很怪异」。灰阶底 + **深色**胶囊片压在纸白页面上，
   既像"浮着的黑条"，又跟页面里的品牌蓝打架。现在改成"**有色的深底 + 浅玻璃片**"：
     · 坞＝墨玉青（petrol）#0F3B3E → #0A2A2C —— 生物/医药场景里干净、专业的冷绿，
       而且**不是品牌蓝**，选中态那枚青绿砖才显得出来。
     · 砖：白 7%；悬停白 13%；选中＝青绿砖 + 2px 亮青左竖条。
     · 扇形片＝半透明白玻璃（深字）—— 落在纸白页面上读作"菜单"，不再是一块黑。
   对比度实测：坞上图标/标签 #B7D2D1 on #123B3E ≈ 7.7:1；扇形片深字 #1E2A32 on #FFFFFF ≈ 14:1。
   换配色：只改 `--nav-rail-1/2`、`--nav-ink*`、`--nav-on-1/2`、`--nav-accent` 这几行即可。 */
html[data-paper]:not([data-theme="dark"]) {
  /* ★ 用户看过五套样张后选了 **B 靛蓝**（2026-10-11）：坞 #1B2350→#141A3D，选中砖 #5C7BEE→#2C46B4 */
  --nav-rail-1: #1B2350;
  --nav-rail-2: #141A3D;
  /* 坞砖底面：和面板**同源**的冷白（带一点靛蓝），左侧轨道与右侧面板才像一套（用户 ③） */
  --nav-tile: rgba(222, 232, 255, .11);
  --nav-tile-hover: rgba(226, 236, 255, .19);
  --nav-ink: #BEC7EC;
  --nav-ink-2: #96A1CC;
  --nav-ink-hi: #F0F3FF;
  --nav-on-1: #5C7BEE;
  --nav-on-2: #2C46B4;
  --nav-accent: #7C96FF;
  --nav-dot-ring: #191F44;
  --nav-glass: rgba(255, 255, 255, .96);
  --nav-glass-line: rgba(16, 40, 45, .14);
  --nav-glass-ink: #1E2A32;
  --nav-glass-ink-2: #6C7C86;
  --nav-badge-bg: rgba(206, 74, 60, .13);
  --nav-badge-ink: #A8372A;
  /* 计数角标：数字是"待处理量"，不是"报警" ⇒ 从玫红改成**琥珀**（有指向性又不刺眼） */
  --nav-badge-bg: rgba(206, 150, 40, .15);
  --nav-badge-ink: #8A5A12;
  --nav-badge-ring: rgba(206, 150, 40, .22);
  --nav-row-hover-bg: rgba(20, 45, 90, .07);
  --nav-row-on-bg: rgba(20, 45, 90, .10);
  /* 半圆盘的面：浅色主题＝白玻璃；深色主题另配（否则浅字会落在白玻璃上） */
  /* 用户："好多了，但还是有点不清楚" —— 原因是**页面上的彩色内容透过来**（截图里"返工处理"
     后面那团红就是页面上的红条）把菜单搅浑了。所以玻璃要"磨得更实"：中心 96% → 边缘 52%，
     仍然透（看得见形状），但不再让颜色糊进来。 */
  /* 面板面：**暖白、几乎不透**（用户："按你的思路优化" ①②）——
     96% → 99% 把"灰白雾"压掉，色相偏暖（#FFFDFB → #FFF6EE）让琥珀计数角标更协调。 */
  /* ★ 方案 A（实心白卡，用户选定）：**不透底**的纯白面 + 1px 淡灰描边 + 收敛投影；
     行不再各自描边，改成"发丝分隔线 + hover 淡灰底"，就是 Notion / macOS 菜单那一套。 */
  --nav-plate-bg: linear-gradient(180deg, #FFFFFF 0%, #FDFDFE 100%);
  /* 盘缘那道线：在白页面上，**纯白线等于看不见** ⇒ 换成冷灰蓝的细线，弧的形状才读得出来 */
  --nav-plate-line: rgba(70, 104, 156, .26);
  /* 条目"芯片/悬停/选中"三处的底色（浅色主题：白玻璃；深色主题另配，否则浅字落白芯片上） */
  --nav-chip-bg: rgba(16, 24, 40, .05);
  --nav-chip-ring: rgba(16, 24, 40, .06);
  /* ★「更贵一点」：hover 从纯灰改**淡靛**（带一点品牌色，不再是"灰蒙蒙"）；分隔线压细到 .06 */
  --nav-row-hover2: rgba(92, 123, 238, .075);
  --nav-row-active-bg: linear-gradient(90deg, rgba(92, 123, 238, .16) 0%, rgba(92, 123, 238, .05) 100%);
  --nav-row-active-ring: rgba(92, 123, 238, .30);
  --nav-strip-bg: transparent;                   /* 方案 A：行本身不铺底（只留 hover） */
  --nav-strip-line: transparent;
  --nav-row-divider: rgba(16, 24, 40, .06);      /* 行间发丝分隔线（更细） */
  --nav-card-line: rgba(20, 28, 44, .09);        /* 卡描边（比原来柔一点） */
  --nav-card-shadow: 0 18px 44px -26px rgba(16, 24, 40, .42), 0 2px 5px rgba(16, 24, 40, .05);
  /* ── 落到皮肤已有变量上（这些名字是 §33/§40/§95 定的，别改名） ── */
  --n5-rail-bg: linear-gradient(180deg, var(--nav-rail-1) 0%, var(--nav-rail-2) 100%);
  --n5-panel-bg: var(--nav-rail-2);
  --n5-line: rgba(255, 255, 255, .09);
  --n5-txt: var(--nav-ink);
  --n5-txt-2: var(--nav-ink-2);
  --n5-txt-hi: var(--nav-ink-hi);
  --n5-btn: var(--nav-tile);
  --n5-btn-hover: var(--nav-tile-hover);
  --n5-active-bg: rgba(86, 214, 202, .18);
  --n5-active-bar: var(--nav-accent);
  --sk-rail-txt: var(--nav-ink);
  --sk-rail-txt-2: var(--nav-ink-2);
  --sk-rail-txt-hi: var(--nav-ink-hi);
  --sk-rail-hover: var(--nav-tile-hover);
  --sk-rail-line: rgba(255, 255, 255, .09);
  --sk-rail-field: rgba(255, 255, 255, .07);
  --sk-rail-1: #10403F;
  --sk-rail-2: #0D3335;
  --sk-rail-rail-bg: #0D3335;
  --n4-rail-bg: transparent;
  --n4-rail-btn: var(--nav-tile);
  --n4-ink: var(--nav-ink-hi);
  --n4-ink2: var(--nav-ink);
  --n4-ink3: var(--nav-ink-2);
  --n4-line: rgba(255, 255, 255, .09);
  --n4-hover: var(--nav-tile-hover);
  --n4-active: rgba(86, 214, 202, .18);
  --n4-accent: var(--nav-accent);
}
/* §95 给浅灰底补的那些"深字"必须翻回浅字（否则深底深字） */
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand h1 { color: var(--nav-ink-hi) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .brand .sub { color: var(--nav-ink-2) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .conn,
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .conn span { color: var(--nav-ink) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .btn-ghost {
  color: var(--nav-ink-hi) !important; background: var(--nav-tile) !important;
  border-color: rgba(255, 255, 255, .14) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .side-foot .btn-ghost:hover {
  background: var(--nav-tile-hover) !important; color: #FFFFFF !important;
  border-color: var(--nav-accent) !important;
}
/* 坞砖：底透明、字浅色；悬停那口"白砖"（§33 写死 #E4EDF8）在深底上是一块白斑，压掉 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn { color: var(--nav-ink) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover { color: var(--nav-ink-hi) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover > svg {
  background: var(--nav-tile-hover) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > span { color: inherit !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on {
  color: var(--nav-accent) !important; box-shadow: inset 2px 0 0 var(--nav-accent) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on > svg {
  background: linear-gradient(160deg, var(--nav-on-1) 0%, var(--nav-on-2) 100%) !important;
  color: #FFFFFF !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on::before {
  background: var(--n4-accent) !important;
}
/* 红点的描边原来跟着坞底变量走，石墨底上要换成本身的底色 */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn .nr-dot {
  background: #F0565F !important; box-shadow: 0 0 0 2px var(--nav-dot-ring) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-body { background: transparent !important; border: 0 !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail { background: transparent !important; }

/* ── ② 浮岛＝贴着坞砖的紧凑卡片（只在 >760px 生效；手机走老面板，见本节末尾） ─────────
   第三轮的"扇形散开"用户否掉了（"这种扇形展开怎么能行呢，太怪异了"）：
   卡片**高度＝内容**（头 30 + 每条 34），位置由 nav-collapse.js 的 layoutFly() 写 inline；
   `left/top/width/max-height/transform-origin` 必须带 `important` 写（§33/§40/§95 把同名属性占了）。 */
@media (min-width: 761px) {
  /* ⚠ 这一节的每条都要写成「html[data-paper](:not([data-theme="dark"])|[data-theme="dark"])
     + body」两级 —— §33/§40 那批面板规则是 `html[data-paper]:not([data-theme="dark"]) body …`
     （0,5,2），只写 `html[data-paper] body …`（0,3,2）会被它们按特异性压掉：实测第一版把
     遮罩那条压丢了，整块 `--n5-panel-bg` 铺满视口 ⇒ 页面全黑（截图里"整屏石墨"就是这么来的）。 */
  /* 浮岛＝一整层遮罩（inset:0，不占布局）；坞抬到它上面，否则点不到坞砖 */
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel {
    /* ★ 第五轮：**透明的半圆盘**（用户："点击后的交互能不能改成透明的半圆形"）。
       面板本身只是"内容列"（尺寸/位置由 JS 写 inline-important），半圆由 ::before 画：
       左缘是直径的平边、贴着坞砖右缘；右缘是一段半径 R（--plate-r，跟内容高走）的弧。
       盘面是半透明白玻璃（不遮页面），条目在盘内**沿弧排**（缩进由 JS 逐行写 margin-left）。 */
    position: fixed !important;
    /* padding 必须为 0：绝对定位子元素的 `top/left` 是相对**内边距盒**的，
       留 10px 内边距等于把条目整体下推 10px（实测条目组比坞砖心低 27px）。 */
    padding: 0 !important;
    /* 面板盒子＝半圆外接框（宽 R、高 2R），内容（类目容器）在框里**垂直居中** ⇒ 盘心＝坞砖心 */
    justify-content: center !important;
    background: none !important; border: 0 !important; border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
    /* ⚠ overflow 必须 visible：半圆盘在面板盒子外面（滚动交给 .nav-cat） */
    overflow: visible !important;
    z-index: 60 !important;
    opacity: 0; pointer-events: none;
    transform: scale(.94) translateX(-8px);
    transition: opacity .16s ease, transform .24s cubic-bezier(.22, .9, .24, 1);
  }
  html.nav-fly .sidebar .nav-panel { opacity: 1 !important; transform: none !important; pointer-events: auto !important; }
  /* ══ 半圆盘本体：width = R、height = 2R，右半边圆角 50%/100% ⇒ 正好一个半圆；
        左缘贴着坞砖右缘（-gapX）。半透明 + 背板模糊 ⇒ "透明的半圆形"。 ══ */
  /* ══ 盘面：尺寸/形状全部由 JS 给的变量决定 ══════════════════════════════════
     --plate-a 宽、--plate-b 高、--plate-radius 形状（半圆 / 四分之一扇）。
     左缘永远贴着坞砖右缘（面板 left = 坞右缘 + 2），所以"平边"始终在坞侧。 */
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel::before,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel::before {
    content: "" !important; position: absolute !important;
    left: 0 !important; top: 0 !important;
    width: var(--plate-a, 170px) !important; height: var(--plate-b, 340px) !important;
    transform: none !important;
    border-radius: var(--plate-radius, 12px) !important;
    background: var(--nav-plate-bg) !important;
    /* ★ 方案 A（实心白卡）：1px 淡灰描边 + 收敛投影；不再用"玻璃内圈亮线 / 毛玻璃" */
    border: 1px solid var(--nav-card-line, rgba(16, 24, 40, .10)) !important;
    box-shadow: var(--nav-card-shadow, 0 10px 30px -18px rgba(16, 24, 40, .38)) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    /* ★ 必须压在条目**下面**：面板自己就是层叠上下文（fixed + z-index:60），
       ::before 用 -1 就落在"本层的背景"位置 ⇒ 玻璃在条目底下、页面在上面看到透。 */
    z-index: -1 !important;
    pointer-events: none !important;
  }
  /* 盘缘那圈细弧线（只描边、不填色，压在最底层；直径那侧正好贴着坞砖，看不到硬边） */
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel::after,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel::after {
    content: "" !important; position: absolute !important;
    left: 0 !important; top: 0 !important;
    width: var(--plate-a, 170px) !important; height: var(--plate-b, 340px) !important;
    transform: none !important;
    border-radius: var(--plate-radius, 0 100% 100% 0 / 0 50% 50% 0) !important;
    border: 1px solid var(--nav-plate-line, rgba(255, 255, 255, .5)) !important;
    border-left-color: transparent !important;
    background: none !important;
    pointer-events: none !important; z-index: -1 !important;
  }
  /* 条目区自己滚（卡片不滚，才留得住尖角） */
  html[data-paper] body .sidebar .nav-panel .nav-cat {
    max-height: calc(100vh - 160px) !important;
    overflow-y: auto !important; overflow-x: hidden !important;
  }
  /* 半圆盘里不再放抬头条：坞砖上已经有类目名了，而半圆的**上缘很窄**，
     抬头条会从盘子上边缘"探出去"（截图里就那样）。移动端（≤760px）仍然显示这张头。 */
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h {
    display: none !important;
  }
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel-h > span,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel-h > span {
    font-size: 12.5px !important; color: var(--nav-glass-ink) !important;
  }
  /* 类目图标给一枚"图标砖"（和坞砖同一套语言），15px 图标 + 7px 内边距 */
  html[data-paper] body .sidebar .nav-panel-h > svg {
    box-sizing: content-box !important;
    width: 15px !important; height: 15px !important;
    max-width: none !important; max-height: none !important;
    padding: 4px !important; border-radius: 8px !important;
    background: rgba(92, 123, 238, .16) !important;
    color: var(--nav-on-2) !important;
  }
  html[data-paper] body .sidebar .nav-panel-h > i {
    margin-left: auto !important; padding: 1px 7px !important; border-radius: 999px !important;
    background: rgba(92, 123, 238, .14) !important;
    font-size: 10.5px !important; font-style: normal !important; font-weight: 800 !important;
    color: #3D4F9E !important;
  }
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-cat,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-cat { position: static !important; min-width: 0 !important; }
  /* 条目行：正常文档流（不再绝对定位、不再算弧）—— 图标 + 名字 + 计数 */
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item {
    /* ★ 第八轮：行＝最朴素的一行三件套（**图标 → 文字 → 角标**，用户明确要求），
       宽度按内容（fit-content，永不省略）；弧改由 layoutFly 的**逐行左缩进**实现
       （行在该高度的弦上居中）—— 不牺牲可读性也能看出扇面。 */
    position: static !important; margin: 0 0 3px !important;
    display: flex !important; align-items: center !important; gap: 8px !important;
    flex-direction: row !important;      /* DOM 顺序即视觉顺序：svg → 文字 → 角标 */
    height: 36px !important; min-height: 36px !important;   /* 「更贵」：行高 34 → 36，更透气 */
    /* ★ 宽度**跟着内容走**（`width:auto`），缩进由 JS 按"这一行的实际宽度在该高度的弦上居中"算 ——
       否则短条目（没有计数角标那些）右边会空一大截，整块内容贴左、盘子鼓右，显得别扭。 */
    /* ⚠ 必须是 `fit-content` 不能是 `auto`：行是块级 flex，`auto` 会撑满父宽；
       也不能改 inline-flex —— 那样两条窄条目会挤到同一行。 */
    /* 方案 A：行铺满面板内容宽（不按弧切）⇒ 发丝分隔线与角标都对齐成一条线 */
    width: auto !important; max-width: none !important;
    padding: 0 10px 0 6px !important; border-radius: 999px !important;   /* 圆盘里用全圆角，比方角柔 */
    background: transparent !important; border: 0 !important; box-shadow: none !important;
    /* 条目文字：13px / 700 / 更深的墨 + 一层白晕 —— 磨砂面上这样最"清楚"（用户："还是有点不清楚"） */
    color: #1A2430 !important; font-size: 13px !important; font-weight: 700 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .8) !important;
    /* ★ 条目本身就是"贴在圆面上的那条带子"：给一条极淡的白色填充 + 发丝边，
       它才看得见（否则带子透明，屏幕上还是"一盘空白里飘着几行字"，用户会说没贴上去）。
       悬停/选中再压深一档。 */
    background: var(--nav-strip-bg, transparent) !important;
    box-shadow: none !important;
    border-bottom: 1px solid var(--nav-row-divider, rgba(16, 24, 40, .07)) !important;
    justify-content: flex-start !important;  /* 图标靠左成列；角标用 margin-right:auto 顶到最右 */
    white-space: nowrap !important; overflow: hidden !important;
    /* 整卡出现时条目顺次落下（--dl 由 layoutFly 逐行写） */
    opacity: 0; transform: translateY(-4px); pointer-events: auto;
    transition: opacity .18s ease var(--dl, 0ms), transform .18s ease var(--dl, 0ms),
                background .12s ease, color .12s ease;
  }
  html.nav-fly .sidebar .nav-panel .nav-item { opacity: 1 !important; transform: none !important; }
  /* 条目图标：15px 图标 + 3.5px 内边距 = 22px **圆形**芯片（跟半圆的语言一致） */
  html[data-paper] body .sidebar .nav-panel .nav-item svg {
    box-sizing: content-box !important;
    width: 15px !important; height: 15px !important;
    max-width: none !important; max-height: none !important;
    order: 1 !important;                       /* 图标在最前（左） */
    padding: 4.5px !important; border-radius: 999px !important;   /* 芯片 22 → 24px */
    background: var(--nav-chip-bg, rgba(255, 255, 255, .58)) !important;
    box-shadow: inset 0 0 0 1px var(--nav-chip-ring, rgba(20, 45, 90, .07)),
                0 2px 5px -2px rgba(9, 20, 45, .28) !important;   /* 落在玻璃上的小投影，芯片更"实" */
    color: #1B2A38 !important; opacity: 1 !important; flex: none !important;
    margin-left: 0 !important;                                  /* 图标在最前，不需要额外左外边距 */
    transition: background .12s ease, transform .14s ease, box-shadow .14s ease !important;
  }
  /* 文字：吃掉中间剩余宽度（行宽跟着弧走，所以这里必须可伸可缩） */
  html[data-paper] body .sidebar .nav-panel .nav-item > span:not(.nav-badge) {
    overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
    order: 2 !important;
    /* ⚠ 必须 `flex: 0 0 auto`：行的宽度是"弦长"（外面写死的），文字要按自然宽度，
       否则它会被拉伸、下一次量 contentW 时又把 R 撑大（自我强化的棘轮）。 */
    flex: 0 0 auto !important; min-width: 0 !important;
    margin-right: auto !important;            /* 把数字角标顶到条带最右（图标在左、角标在右） */
    text-align: left !important;
    letter-spacing: .01em !important; font-variant-numeric: tabular-nums !important;
  }
  /* 数字角标：在最右端（用户："数字角标在最后面"） */
  html[data-paper] body .sidebar .nav-panel .nav-item > .nav-badge {
    /* ⚠ 两端都写 auto 会把角标推到中间（实测卡面上 23/69 就停在文字后面）。
       方案 A：只留"文字右外边距 auto"来顶，角标自己的 auto 归零 ⇒ 固定贴右。 */
    order: 3 !important; margin-left: 0 !important; margin-right: 0 !important;
    /* ⚠ 不要给 display 加 !important：那会把 `[hidden]`（没数字的条目）也画出来，
       屏幕上就是一排空的粉红药丸（实测）。min-width/对齐只对"显示出来的"生效即可。 */
    min-width: 22px !important; text-align: center !important;
    letter-spacing: .02em !important; font-variant-numeric: tabular-nums !important;
  }
  /* 没有数字的一律不画（`hidden` 或被清空 textContent 的两种情况都盖住）——
     否则屏幕上会出现一排空的粉红药丸（本文件 app.css 里那条 `[hidden]{display:none}` 不是 !important）。 */
  html[data-paper] body .sidebar .nav-panel .nav-item > .nav-badge[hidden],
  html[data-paper] body .sidebar .nav-panel .nav-item > .nav-badge:empty {
    display: none !important;
  }
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item:hover,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item:hover {
    background: var(--nav-row-hover2, rgba(255, 255, 255, .62)) !important; color: var(--nav-glass-ink) !important;
    box-shadow: 0 6px 16px -10px rgba(9, 20, 45, .45) !important;
  }
  html[data-paper] body .sidebar .nav-panel .nav-item:hover > svg { background: rgba(255, 255, 255, .9) !important; }
  /* 悬停时芯片轻轻"弹"一下（0.14s），是这套菜单里最小的一个动作反馈 */
  html[data-paper] body .sidebar .nav-panel .nav-item:hover > svg { transform: scale(1.07) !important; }
  /* ⚠ 行上的 color 管不到子 `<span>`：§33 有一条 `.nav-item.active :is(svg, span){color:var(--n4-accent)}`
     （0,4,3）在压着 —— 不显式写，选中行的字会被它染成浅色（实测：白底上像"没写完"）。 */
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item:hover > span,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item:hover > span {
    color: var(--nav-glass-ink) !important;
  }
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item.active > span,
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item.on > span,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item.active > span,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item.on > span {
    color: #0B1622 !important;
  }
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item.active,
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-item.on,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item.active,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-item.on {
    background: var(--nav-row-active-bg) !important;
    color: var(--nav-glass-ink) !important; font-weight: 800 !important;
    /* 当前页那一条：左边一条 3px 强调竖条（比纯底色更清楚"我在哪"）+ 细靛蓝内圈 */
    box-shadow: inset 3px 0 0 var(--nav-accent), 0 8px 18px -12px rgba(9, 20, 45, .5),
                inset 0 0 0 1px var(--nav-row-active-ring, rgba(92, 123, 238, .22)) !important;
  }
  html[data-paper] body .sidebar .nav-panel .nav-item.active > svg,
  html[data-paper] body .sidebar .nav-panel .nav-item.on > svg {
    background: linear-gradient(160deg, var(--nav-on-1) 0%, var(--nav-on-2) 100%) !important;
    color: #FFFFFF !important; opacity: 1 !important;
    box-shadow: 0 4px 10px -6px rgba(9, 20, 45, .6) !important;
  }
  /* 键盘焦点：卡片是白底，原来那枚"浅底焦点环"看不见，这里换成一枚蓝环 */
  html[data-paper] body .sidebar .nav-panel .nav-item:focus-visible {
    outline: 2px solid var(--nav-accent) !important; outline-offset: -2px !important;
    background: rgba(255, 255, 255, .66) !important;
  }
  html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-panel .nav-badge,
  html[data-paper][data-theme="dark"] body .sidebar .nav-panel .nav-badge {
    margin-left: auto !important; height: 16px !important; line-height: 15px !important;
    background: var(--nav-badge-bg) !important; color: var(--nav-badge-ink) !important;
    border: 0 !important; border-radius: 999px !important; padding: 0 6px !important;
    box-shadow: inset 0 0 0 1px var(--nav-badge-ring, rgba(206, 74, 60, .18)) !important;
    font-size: 10px !important; font-weight: 800 !important;
  }
  /* 旧的"辐条 + 弧"连线层已撤（第四轮不做扇形了）。留一条 display:none 兜底：
     万一浏览器里还混着上一版 nav-collapse.js，它插进来的 .fan-layer 也不会画出来。 */
  html[data-paper] body .sidebar .nav-panel .fan-layer { display: none !important; }
  /* 「贴合内容的面板」模式下没有"盘缘刻度"这回事（那道弧是给半圆用的） */
  html[data-paper] body .sidebar .nav-panel[data-fan="panel"] .nav-tick { display: none !important; }

  /* ══「联动」两件套：扇形高亮（转到光标那一条）+ 跟光束 ══════════════════════
     两件都装在 **.nav-lights** 里：它自己就是半圆（裁切用），但不参与旋转 ——
     旋转只作用在里面的 `.nav-wedge > i`（一个 2R×2R 的方块、conic 出一片 30° 扇区）。
     第一版把 rotate 直接加在"半圆形状"上 ⇒ 那条**直径边**跟着转，盘里多出一道硬斜线
     （截图里能看到），所以必须拆成"裁切层固定 + 光效层旋转"。 */
  html[data-paper] body .sidebar .nav-panel .nav-lights {
    position: absolute !important; left: 0 !important;
    width: var(--plate-a, 170px) !important; height: var(--plate-b, 340px) !important;
    border-radius: var(--plate-radius, 0 100% 100% 0 / 0 50% 50% 0) !important;
    overflow: hidden !important;
    opacity: 0; pointer-events: none !important; z-index: 0;
    transition: opacity .22s ease;
  }
  /* 扇心（＝.nav-lights 内坐标原点）：半圆在盘中；往下开在左上角；往上开在左下角 */
  html[data-paper] body .sidebar .nav-panel[data-fan="half"] .nav-lights { top: 50% !important; transform: translateY(-50%) !important; }
  html[data-paper] body .sidebar .nav-panel[data-fan="qdown"] .nav-lights { top: 0 !important; transform: none !important; }
  html[data-paper] body .sidebar .nav-panel[data-fan="qup"] .nav-lights { top: 100% !important; transform: translateY(-100%) !important; }
  html.nav-fly .sidebar .nav-panel .nav-lights { opacity: 1 !important; }
  html[data-paper] body .sidebar .nav-panel .nav-wedge > i {
    position: absolute !important;
    left: calc(var(--plate-a, 170px) * -1) !important; top: 0 !important;
    width: calc(var(--plate-a, 170px) * 2) !important; height: calc(var(--plate-b, 340px) * 2) !important;
    transform: rotate(0deg);
    /* ⚠ 必须做成"两端都收到 0 的鼓包"：conic-gradient 的起止处是**硬接缝**，
       第一版 0deg 直接跳到 .26 ⇒ 盘里多出一条硬斜线（截图里那道光边）。 */
    background: conic-gradient(at 50% 50%,
      rgba(92, 123, 238, 0) 56deg, rgba(92, 123, 238, .05) 72deg,
      rgba(92, 123, 238, .26) 90deg, rgba(92, 123, 238, .05) 108deg,
      rgba(92, 123, 238, 0) 124deg, rgba(92, 123, 238, 0) 360deg) !important;
    pointer-events: none !important;
    transition: transform .34s cubic-bezier(.22, .9, .24, 1);
  }
  html[data-paper] body .sidebar .nav-panel .nav-glow {
    position: absolute !important; left: 0 !important; top: 0 !important;
    width: 168px !important; height: 168px !important;
    border-radius: 999px !important;
    background: radial-gradient(closest-side circle, rgba(255, 255, 255, .95), rgba(255, 255, 255, .30) 60%, rgba(255, 255, 255, 0) 100%) !important;
    pointer-events: none !important;
    transition: transform .34s cubic-bezier(.22, .9, .24, 1) !important;
  }
  /* 条目压在两层光效上面 */
  html[data-paper] body .sidebar .nav-panel .nav-item { z-index: 1; }
  /* ② 盘缘那道"刻度弧"：窄窄一条亮青弧（仪表盘的指针位），停在**当前页那一条**的角度。
     做法：2R×2R 方块 + conic 出一条 12° 的亮弧，再用 radial 遮罩只留"半径 68%~94%"这一圈 ⇒
     只画出弧、不画径向的扇形，所以旋转时不会带出任何硬边（也不用裁切）。 */
  html[data-paper] body .sidebar .nav-panel .nav-tick {
    position: absolute !important; left: 0 !important; top: 50% !important;
    width: calc(var(--plate-a, 170px) * 2) !important; height: calc(var(--plate-b, 340px) * 2) !important;
    transform: translate(-50%, -50%) rotate(0deg);
    background: conic-gradient(at 50% 50%,
      rgba(86, 110, 238, 0) 82deg, rgba(86, 110, 238, .55) 87deg,
      rgba(132, 158, 255, .95) 90deg, rgba(86, 110, 238, .55) 93deg,
      rgba(86, 110, 238, 0) 98deg) !important;
    -webkit-mask-image: radial-gradient(closest-side circle, transparent 0 62%, #000 70%, #000 93%, transparent 100%) !important;
    mask-image: radial-gradient(closest-side circle, transparent 0 62%, #000 70%, #000 93%, transparent 100%) !important;
    pointer-events: none !important;
    transition: transform .34s cubic-bezier(.22, .9, .24, 1);
  }
}

/* ── ≤760px：还原成"坞 + 抽屉里的竖列表"（扇形是桌面形态） ─────────────────── */
@media (max-width: 760px) {
  html[data-paper] body .sidebar .nav-panel {
    position: static !important; inset: auto !important; width: auto !important; height: auto !important;
    padding: 8px !important; background: var(--n5-panel-bg) !important;
    border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    opacity: 1 !important; pointer-events: auto !important; overflow-y: auto !important;
  }
  html[data-paper] .sidebar .nav-panel-h { display: flex !important; }
  html[data-paper] .sidebar .nav-panel .fan-layer { display: none !important; }
  html[data-paper] body .sidebar .nav-panel .nav-item {
    position: static !important; margin: 0 0 1px !important; height: auto !important; min-height: 34px !important;
    display: flex !important; padding: 8px 9px !important; border-radius: 8px !important;
    background: transparent !important; border: 0 !important; box-shadow: none !important;
    color: var(--n5-txt) !important; opacity: 1 !important; transform: none !important;
    pointer-events: auto !important; white-space: normal !important; overflow: visible !important;
  }
  html[data-paper] body .sidebar .nav-panel .nav-item.active,
  html[data-paper] body .sidebar .nav-panel .nav-item.on {
    background: var(--n5-active-bg) !important; color: var(--n5-txt-hi) !important;
  }
}


/* ===========================================================================
   98. 收缩态坞砖补回"字"（2026-10-11 · 用户："这种模式下左侧导航栏不点击不知道是什么功能"）
   ---------------------------------------------------------------------------
   §95 把坞做成"纯图标 68px 窄轨"（类目名 `display:none`，只有 title 悬停才看得到），
   用户实测：**不点不知道那枚图标是什么功能**。这里把类目名放回坞砖里（图标 16px + 名字 9.5px），
   砖高 42 → 52；10 个类目 + 品牌 + 底部在 1920×956 下依旧装得下（见验收）。
   名字只用砖宽 54px：4 字 ≈ 38px、最长的「物料与设备」≈ 47.5px —— 都不换行、不截断。
   =========================================================================== */
/* ⚠ 第一版把字切了（用户："字体有点显示不全"），两个原因叠在一起：
     ① 名字 `line-height: 1.05`（≈10px）比中文字身还矮，再配 `overflow:hidden` 直接切字底；
     ② 更要命的：这条 `.nr-btn` 的老规则写在 §40（**主题限定** `html[data-paper]:not([data-theme="dark"]) body …`
        = 0,5,2 + !important），而本节原来只写了 `html[data-paper] body …`（0,4,2）⇒ 我的 padding/gap/图标内边距
        **全被它按住**（实测按钮 padding 还是 6px、gap 4px、图标砖 8px）：
        砖里要塞 图标砖 32 + 缝 4 + 名字 14 + 内边距 12 = 62px，而砖高只有 56 ⇒ 名字（唯一的可压缩项）
        被 flex 压到 10.19px，字底被切。
   ⇒ 本节所有坞砖规则都写成**主题限定 + body**（0,5,2，且更靠后）才压得住；名字再加 `flex:none`
      兜底，从根上不让它再被压扁。现在实测：图标砖 31 + 缝 2 + 名字 14 < 砖高 56 ✓ */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn {
  height: 56px !important; min-height: 56px !important;
  padding: 3px 2px !important; gap: 2px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > svg {
  width: 17px !important; height: 17px !important; padding: 6px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > span,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > span {
  display: block !important; flex: none !important; height: 14px !important;
  font-size: 10px !important; font-weight: 700 !important; line-height: 14px !important;
  white-space: nowrap !important; letter-spacing: 0 !important;
  max-width: 52px !important; overflow: hidden !important; text-overflow: ellipsis !important;
  color: var(--nav-ink-2) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:hover > span { color: var(--nav-ink-hi) !important; }
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn.on > span { color: var(--nav-accent) !important; }
/* 砖变高了，红点跟着往下挪一点，别再贴边 */
html[data-paper] body .sidebar .nav-rail .nr-btn .nr-dot { top: 6px !important; right: 7px !important; }


/* ===========================================================================
   19. 工序看板：顶部压缩、看板加高（2026-10-11 · 用户："下面的看板界面可以再往上提点高度，
       顶部的布局更紧凑一点"）
   ---------------------------------------------------------------------------
   实测（1920×956 / 页面 zoom 0.9 / 布局单位，`_qctest/board-probe.cjs`）：
     #view 高 967，**顶部四块吃掉 204px** ——
       · 数据源行 `.ov-hero` 56px（里面 `button.tbtn` 34px 在撑高）+ 缝 14
       · KPI 带 `.grid.kpis` 104px（`.pk-card` = 上内边距 14 + `.pk-body` 84 + 进度条 3，
         `.pk-body` 里 `.pk-ring` 48px 在撑高）+ 缝 30
     看板卡 `.board-panel` 只剩 719（`.panel-h` 35 + 内边距 18×2 + 列本体 629）。
   本节把四块压到 ~118px、卡内边距与卡头再收 21px ⇒ 列本体涨到 ~700（约多出一整行卡）。
   只对本页生效（`#view:has(.board-panel)`），其余 40 多页不动。
   =========================================================================== */
html[data-paper] body #view:has(.board-panel) .ov-hero { padding: 6px 14px !important; }
html[data-paper] body #view:has(.board-panel) .ov-hero .tbtn {
  height: 26px !important; padding: 0 10px !important; font-size: 11.5px !important;
}
html[data-paper] body #view:has(.board-panel) .ov-hero label { font-size: 11px !important; }
html[data-paper] body #view:has(.board-panel) .grid.kpis { margin: 8px 0 0 !important; }
/* ⚠ 瓷砖高度不是 padding 撑的：app.css 里 `.grid.kpis .pk-card{min-height:128px}`，
   光收内边距不会变矮 —— 必须同时把 min-height 归零，高度才会跟着内容走。 */
html[data-paper] body #view:has(.board-panel) .pk-card {
  padding: 8px 12px 0 !important; min-height: 0 !important; max-height: none !important;
}
html[data-paper] body #view:has(.board-panel) .pk-body { padding-bottom: 6px !important; }
html[data-paper] body #view:has(.board-panel) .pk-label {
  margin-bottom: 3px !important; font-size: 10.5px !important;
}
html[data-paper] body #view:has(.board-panel) .pk-val { font-size: 22px !important; line-height: 1.12 !important; }
html[data-paper] body #view:has(.board-panel) .pk-sub { font-size: 10.5px !important; }
html[data-paper] body #view:has(.board-panel) .pk-ring,
html[data-paper] body #view:has(.board-panel) .pk-ring svg,
html[data-paper] body #view:has(.board-panel) .pk-ring-pct { width: 38px !important; height: 38px !important; }
html[data-paper] body #view:has(.board-panel) .pk-ring-pct { font-size: 10px !important; }
html[data-paper] body #view:has(.board-panel) .board-panel { padding: 10px 12px 12px !important; }
html[data-paper] body #view:has(.board-panel) .board-panel > .panel-h {
  padding-bottom: 6px !important; margin-bottom: 6px !important;
}
html[data-paper] body #view:has(.board-panel) .board-panel > .board { min-height: 0 !important; }

/* ══ 2026-10-11 工序看板 · 订单卡片调小（用户："订单卡片我认为可以把尺寸调小一点"）══
   卡片类名 `.ocard`（app.css:3092）。这里按"更紧凑"收一档：
   内边距 12→9、卡间距 10→7、订单号 13→12、客户 12→11（仍两行截断）、元信息 12→11、
   进度条 6→4 高、上边距 6→4。信息一个没删，只是密度上来、一屏能多看 1~2 张。
   ⚠ 挂在 #view 下提特异度（皮肤里还有别处的 .ocard 规则），并且**只调尺寸不调颜色**。 */
html[data-paper] #view .board .ocard { padding: 9px 10px !important; margin-bottom: 7px !important; }
html[data-paper] #view .board .ocard .od { font-size: 12px !important; }
html[data-paper] #view .board .ocard .oc { font-size:11px !important; line-height: 1.3 !important; }
html[data-paper] #view .board .ocard .ometa { font-size:11px !important; }
html[data-paper] #view .board .ocard .pbar { height: 4px !important; margin-top: 4px !important; }

/* ══ 2026-10-11 工序看板卡片「再收矮一档」（用户："变化不大，我觉得可以收矮一点"）══
   上一版只压了字号/内边距，实测 151px 高，用户觉得变化不大。这一版动的是**行数**：
   · 客户名从两行截断（-webkit-line-clamp:2）收成**一行** —— 这是最占高的一处；
   · 全卡行高统一压到 1.25，内边距 9→7、卡间距 7→6，进度条 4→3 高。
   信息仍然一个没删（客户名截断后悬停仍可看全，title 里带着）。 */
html[data-paper] #view .board .ocard { padding: 7px 9px !important; margin-bottom: 6px !important; line-height: 1.25 !important; }
html[data-paper] #view .board .ocard .od { font-size:11.5px !important; line-height: 1.25 !important; }
html[data-paper] #view .board .ocard .oc {
  font-size:10.5px !important; line-height: 1.25 !important;
  -webkit-line-clamp: 1 !important;   /* ← 两行收一行 */
}
html[data-paper] #view .board .ocard .ometa { font-size:10.5px !important; line-height: 1.25 !important; }
html[data-paper] #view .board .ocard .pbar { height: 3px !important; margin-top: 3px !important; }

/* ══ 2026-10-11 工序看板卡片 · 第三档（把上一条没压住的补齐）══
   量出来的真相：这张卡在**本文件 1825/1828 行**早就有一组 `html[data-paper] #view .board .ocard …`
   的 `!important` 规则（`.oc` margin-top 2、`.ometa` margin-top 6、`.pbar` margin-top 6），
   而我在文件末尾用**同级**选择器追加 —— 同级后写的本该赢，但 `padding` 一直没生效，
   说明还有一条用了 `#view#view`（双 id）提特异度的规则在压着。
   这里照抄它那套写法（`#view#view`）把内边距与三处 margin-top 一起收掉。 */
html[data-paper] body #view#view .board .ocard { padding: 6px 8px !important; margin-bottom: 5px !important; }
html[data-paper] body #view#view .board .ocard .oc { margin-top: 1px !important; font-size:10.5px !important; line-height: 1.22 !important; -webkit-line-clamp: 1 !important; }
html[data-paper] body #view#view .board .ocard .ometa { margin-top: 3px !important; font-size:10.5px !important; line-height: 1.22 !important; }
html[data-paper] body #view#view .board .ocard .pbar { margin-top: 3px !important; height: 3px !important; }
html[data-paper] body #view#view .board .ocard .od { font-size:11.5px !important; line-height: 1.25 !important; }

/* ══ 2026-10-11 工序看板卡片 · 第四档（用户："你看着再优化一下"）══
   量下来还剩下的空隙有两处，都是别人写的固定 margin，一并收掉：
   · `.otags`（板号胶囊那一行）在 app.css:2460 写死 `margin-top:6px; margin-bottom:2px` → 收成 2/0；
   · `.odue`（交期行）与上一行之间再压 2px，并把「已放置 / 合作」那行的上边距也收一档。
   静态文字一个字没动，只动空隙。 */
html[data-paper] body #view#view .board .ocard .otags { margin-top: 2px !important; margin-bottom: 0 !important; }
html[data-paper] body #view#view .board .ocard .odue { margin-top: 2px !important; }
html[data-paper] body #view#view .board .ocard .odeck { margin-top: 2px !important; }
html[data-paper] body #view#view .board .ocard > *:last-child { margin-bottom: 0 !important; }

/* ===========================================================================
   99. 左栏导航 · 窄轨可读性与浮出菜单精修（2026-10-11）
   保留用户已选的「图标轨 + 贴边子菜单」交互；不改侧栏占位宽度、不重排主内容。
   轨标统一四字且不裁字；图标/文字节奏更清楚；悬停和键盘焦点有稳定反馈。
   =========================================================================== */
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > span,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > span {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 54px !important;
  height: 15px !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 15px !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn {
  cursor: pointer !important;
  outline-offset: 1px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:focus-visible,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:focus-visible {
  outline: 2px solid var(--nav-accent) !important;
  outline-offset: -2px !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn:not(.on):hover,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn:not(.on):hover {
  background: var(--nav-tile-hover) !important;
}
html[data-paper]:not([data-theme="dark"]) body .sidebar .nav-rail .nr-btn > svg,
html[data-paper][data-theme="dark"] body .sidebar .nav-rail .nr-btn > svg {
  flex: 0 0 auto !important;
}
@media (prefers-reduced-motion: reduce) {
  html[data-paper] body .sidebar .nav-rail .nr-btn,
  html[data-paper] body .sidebar .nav-panel,
  html[data-paper] body .sidebar .nav-panel .nav-item,
  html[data-paper] body .sidebar .nav-panel .nav-item > svg {
    transition: none !important;
    animation: none !important;
  }
}

/* ===========================================================================
   100. 左栏主类目 · 点击后就地展开（2026-10-11）
   旧的 fixed 浮岛会盖住工作区；桌面改为扩展侧栏本身的 flex-basis，
   内容区同步平滑让位。窄屏仍走既有抽屉，不挤压小视口。
   =========================================================================== */
@media (min-width: 761px) {
  html[data-paper] body .sidebar {
    transition: width .26s cubic-bezier(.22,.75,.25,1), flex-basis .26s cubic-bezier(.22,.75,.25,1);
  }
  html.nav-inline[data-paper][data-paper][data-paper] { --n4-w: 284px !important; }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar {
    width: var(--n4-w) !important;
    flex: 0 0 var(--n4-w) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar nav {
    display: flex !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-body {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--n5-line) !important;
    border-radius: 12px !important;
    background: var(--n5-panel-bg) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-rail {
    display: flex !important;
    flex: 0 0 60px !important;
    width: 60px !important;
    min-width: 60px !important;
    height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border-right: 1px solid var(--n5-line) !important;
    transition: flex-basis .26s ease, width .26s ease;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel {
    position: relative !important;
    inset: auto !important;
    flex: 1 1 0% !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 9px 9px 10px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: opacity .2s ease, transform .26s cubic-bezier(.22,.75,.25,1) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h {
    display: flex !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    margin: 0 0 7px !important;
    padding: 4px 5px 9px !important;
    border-bottom: 1px solid var(--n5-line) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > svg {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > span {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--n5-txt-hi) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > i {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    color: var(--n5-txt-2) !important;
    background: var(--n5-btn) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-cat {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-height: none !important;
    overflow: auto !important;
    scrollbar-width: thin;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-cat.is-current {
    animation: navSubmenuReveal .22s cubic-bezier(.22,.75,.25,1) both;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 9px !important;
    margin: 0 0 3px !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    border-radius: 9px !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item > span:not(.nav-badge) {
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-shadow: none !important;   /* 同上：小字不要白色压印阴影 */
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item .nav-badge {
    flex: 0 0 auto !important;
    position: static !important;
    margin: 0 0 0 auto !important;
    color: var(--n5-warn-txt, #F5CE86) !important;
  }
  /* ⚠ 空角标必须真藏起来：nav-collapse.js 给每个条目都补了一枚 `.nav-badge` 占位
     （`hidden` 属性），但作者样式里的 `display` 声明会**压过浏览器对 `[hidden]` 的
     `display:none`**（作者样式优先于 UA 样式）⇒ 实测 5 个条目右侧各挂了一颗 20×16 的
     空药丸。这里显式兜回来。 */
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item .nav-badge[hidden] {
    display: none !important;
  }
  /* ⚠ 图标看不见的根因：`.nav-item` 的文字色是浅色，但 `svg` 自己被另一条规则染成了
     `rgb(27,42,56)`（深色），而图标是 `stroke="currentColor"` ⇒ 深色描边压在深底上，
     等于没画。这里让图标跟随条目文字色。 */
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item > svg {
    color: inherit !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
  }
  /* 点开主类目之后，这列子模块就是**主操作区**了 —— 文字要比坞上的次级灰亮一档
     （坞上标签 #F0F3FF，面板条目原来只有 #96A1CC，实测整列"灰蒙蒙"）。 */
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item {
    color: var(--n5-item-txt, #DCE4F7) !important;
    transition: background .14s ease, color .14s ease;
    /* ⚠ 皮肤给深色侧栏的文字加了一层白色 `text-shadow: 0 1px 0`（浅底深字的"压印"效果）。
       坞上是 11px 粗体还撑得住，这列 11px 常规字重下会让笔画发虚、看着像重影 —— 去掉。 */
    text-shadow: none !important;
    font-size: 12px !important;
    letter-spacing: .01em !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover {
    background: rgba(255, 255, 255, .085) !important;
    color: #FFFFFF !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active,
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active:hover {
    background: rgba(124, 150, 255, .24) !important;
    color: #FFFFFF !important;
  }
  /* ★ 正文必须真的让位：§57 给 `#view` 钉了 `min-width:1480px !important`
     （设计意图是"窗口拖窄时不重排、宁可横向滚动"）。但侧栏一加宽，1480 这个下限
     就把整页顶出横向滚动条（实测 1440 下 scrollWidth 1440→1588）。
     只在展开态临时放开这个下限 —— `#view` 收窄后，里面带 `overflow:auto` 的内容区
     （`.view-fade`）会自己出横向滚动条，页面本身不滚；收回侧栏即恢复原约束。 */
  html.nav-inline[data-paper][data-paper][data-paper] body #view {
    min-width: 0 !important;
  }
}
@keyframes navSubmenuReveal {
  from { opacity: .55; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-paper] body .sidebar,
  html[data-paper] body .sidebar .nav-body,
  html[data-paper] body .sidebar .nav-rail,
  html[data-paper] body .sidebar .nav-panel,
  html[data-paper] body .sidebar .nav-panel .nav-cat.is-current {
    transition: none !important;
    animation: none !important;
  }
}

/* ===========================================================================
   2026-10-12 侧边导航精修：子菜单按内容收拢
   左侧类目轨仍占满可用高度；右侧只围住当前类目，避免长空面板抢占视觉。
   =========================================================================== */
@media (min-width: 761px) {
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-body {
    align-items: flex-start !important;
    gap: 8px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow: visible !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-rail {
    align-self: stretch !important;
    flex: 0 0 60px !important;
    border-right: 1px solid rgba(255,255,255,.11) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel {
    align-self: flex-start !important;
    flex: 1 1 0% !important;
    height: auto !important;
    max-height: calc(100% - 4px) !important;
    margin: 2px 0 0 !important;
    padding: 9px 8px 8px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 13px !important;
    background: linear-gradient(160deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
    box-shadow: 0 10px 28px -22px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.045) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel::before,
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel::after {
    display: none !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h {
    min-height: 35px !important;
    margin: 0 0 6px !important;
    padding: 1px 3px 8px !important;
    border-bottom-color: rgba(255,255,255,.11) !important;
    gap: 8px !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > svg {
    box-sizing: border-box !important;
    flex: 0 0 26px !important;
    width: 26px !important;
    height: 26px !important;
    padding: 5px !important;
    border: 1px solid rgba(124,150,255,.2) !important;
    border-radius: 8px !important;
    background: rgba(92,123,238,.16) !important;
    color: #C7D2FF !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > span {
    color: #F4F6FF !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    letter-spacing: .02em !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > i {
    padding: 1px 7px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.07) !important;
    color: #ADB8E3 !important;
    font-size: 10px !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-cat {
    flex: 0 1 auto !important;
    max-height: calc(100vh - 180px) !important;
    overscroll-behavior: contain;
    scrollbar-color: rgba(190,199,236,.28) transparent;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item {
    min-height: 35px !important;
    height: 35px !important;
    margin-bottom: 2px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover {
    background: rgba(255,255,255,.075) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active {
    background: linear-gradient(90deg, rgba(92,123,238,.30), rgba(92,123,238,.15)) !important;
    box-shadow: inset 2px 0 0 #8EA4FF, inset 0 0 0 1px rgba(142,164,255,.12) !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item .nav-badge:not([hidden]) {
    min-width: 20px !important;
    height: 18px !important;
    padding: 0 6px !important;
    border: 1px solid rgba(255,190,92,.2) !important;
    border-radius: 999px !important;
    background: rgba(255,190,92,.10) !important;
    color: #FFD38B !important;
    font-size: 10px !important;
    line-height: 16px !important;
  }
}
@media (min-width: 761px) {
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel {
    display: flex !important;
    flex-direction: column !important;
  }
  html.nav-inline[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-cat {
    min-height: 0 !important;
  }
}

/* 2026-10-12 分类导航统一为锚定式小菜单：不扩宽侧栏、不铺遮罩、不保留整屏空面板 */
html.nav-fly[data-paper][data-paper][data-paper] body::before { display: none !important; }
html[data-paper] body .sidebar .nav-panel-h { display: flex !important; }
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel {
  position: fixed !important;
  /* ★ 2026-10-12 v31（用户：「导航条会被其他页面的显示内容给遮挡，这绝对是不可以的」）：
     1000 → 10001。页面浮层（.mqs-menu / .mgw-recent / .mgw-pop / .drawer / 各 modal-mask）
     全是挂 body 的 position:fixed + z-index 9999，与导航面板一旦相交就会盖住它（实测复现：
     zoom .9 下 midqc 的浮层偏左约 11%，正压在面板上）。10001 高于全部页面浮层、
     仍低于 toast(99999)；模态场景下点开浮层时导航本就自动收起，不受影响。 */
  z-index: 10001 !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 13px !important;
  background: linear-gradient(160deg, #20294F 0%, #171E40 100%) !important;
  box-shadow: 0 16px 38px -18px rgba(5,10,28,.72), inset 0 1px 0 rgba(255,255,255,.07) !important;
  overflow: hidden !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel::before,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel::after,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-lights {
  display: none !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  margin: 0 0 6px !important;
  padding: 0 3px 7px !important;
  border-bottom: 1px solid rgba(255,255,255,.11) !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > span {
  color: #F4F6FF !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > i { color: #ADB8E3 !important; }
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-cat {
  max-height: calc(100vh - 110px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item {
  min-height: 35px !important;
  height: 35px !important;
  padding: 0 8px !important;
  border-radius: 8px !important;
  color: #DCE4F7 !important;
  font-size: 12px !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover {
  background: rgba(255,255,255,.075) !important;
  color: #FFFFFF !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active {
  background: linear-gradient(90deg, rgba(92,123,238,.30), rgba(92,123,238,.15)) !important;
  color: #FFFFFF !important;
  box-shadow: inset 2px 0 0 #8EA4FF !important;
}

/* 2026-10-12 锚定菜单状态对比度：旧的浅色菜单子级文字色会压过深色行底 */
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:focus-visible {
  background: rgba(124,150,255,.16) !important;
  color: #FFFFFF !important;
  box-shadow: inset 0 0 0 1px rgba(160,178,255,.22) !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover > span:not(.nav-badge),
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:focus-visible > span:not(.nav-badge),
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active > span:not(.nav-badge),
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.on > span:not(.nav-badge) {
  color: #FFFFFF !important;
  text-shadow: none !important;
  opacity: 1 !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:hover > svg,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:focus-visible > svg,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active > svg,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.on > svg {
  color: #FFFFFF !important;
  background: rgba(124,150,255,.30) !important;
  box-shadow: inset 0 0 0 1px rgba(176,190,255,.24) !important;
  transform: none !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active,
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.on {
  background: linear-gradient(90deg, rgba(92,123,238,.42), rgba(92,123,238,.24)) !important;
  color: #FFFFFF !important;
  font-weight: 750 !important;
  box-shadow: inset 3px 0 0 #A7B8FF, inset 0 0 0 1px rgba(167,184,255,.20) !important;
}
html.nav-fly[data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:focus-visible {
  outline: 2px solid #A7B8FF !important;
  outline-offset: -2px !important;
}

/* ★ 2026-10-12 v31 兜底（用户：「导航条会被其他页面的显示内容给遮挡，这绝对是不可以的」）：
   导航浮层张开期间，把页面侧已知的 body 级浮层压到 app 外壳（.app{z-index:2}）之下。
   JS 那条线（nav-collapse.js closeStrayPageFloats）打开导航时就会把它们收掉，
   这里防的是漏网情况：hover 打开的 .mgw-pop、以及"先开菜单再快捷键开导航"这类时序。
   它们本就该在导航张开时不可见 —— 压到底不会误伤正常页面（选择器只在 html.nav-fly 下生效）。 */
html.nav-fly body > .mgw-recent,
html.nav-fly body > .mgw-pop,
html.nav-fly body > .mqs-menu,
html.nav-fly body > #mqMoreMenu { z-index: 1 !important; }


/* account identity chip */
.topbar .account-chip{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:220px;padding:5px 9px 5px 6px;border:1px solid rgba(92,123,238,.18);border-radius:12px;background:rgba(238,243,255,.76);color:#17264b;box-shadow:0 1px 2px rgba(27,47,94,.05);}
.topbar .account-chip:hover{background:#e8efff;border-color:rgba(92,123,238,.34);color:#14234b;}
.topbar .account-chip:focus-visible{outline:2px solid #7794f5;outline-offset:2px;}
.account-avatar{display:grid;place-items:center;position:relative;flex:none;width:28px;height:28px;border-radius:9px;background:linear-gradient(145deg,#e4ebff,#d5e0ff);color:#3858ba;}
.account-avatar svg{display:block;}
.account-meta{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;line-height:1.1;text-align:left;}
.account-meta strong{display:block;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#17264b;font-size:12px;font-weight:750;}
.account-meta small{display:flex;align-items:center;gap:5px;color:#63728f;font-size:10px;font-weight:600;white-space:nowrap;}
.account-state-dot{display:inline-block;flex:none;width:6px;height:6px;border-radius:50%;background:#159765;box-shadow:0 0 0 2px rgba(21,151,101,.12);}
.account-chevron{display:block;flex:none;margin-left:1px;color:#7887a4;opacity:.8;}
@media(max-width:760px){.topbar .account-chip{gap:6px;padding:4px 6px;max-width:118px;border-radius:10px;}.account-avatar{width:25px;height:25px;border-radius:8px;}.account-meta strong{max-width:68px;font-size:11px;}.account-meta small span{display:none;}.account-chevron{display:none;}}

/* 2026-10-14 顶栏信息区：账号、实时班次、预警按语义分组。 */
html[data-paper] .topbar{gap:8px!important;}
html[data-paper] .topbar .account-chip{height:40px!important;padding:4px 10px 4px 5px!important;border-color:#d9e2f1!important;background:#fff!important;border-radius:10px!important;box-shadow:0 2px 8px rgba(27,47,94,.05)!important;}
html[data-paper] .topbar .account-chip .account-avatar{width:31px;height:31px;border-radius:8px;background:#edf2ff;color:#3359bc;}
html[data-paper] .topbar .account-chip .account-meta strong{font-size:12px;line-height:14px;color:#15223d;}
html[data-paper] .topbar .account-chip .account-meta small{font-size:10px;color:#77839a;}
html[data-paper] .topbar #shiftPill{height:40px;padding:4px 10px!important;gap:7px!important;border-color:#d9e2f1!important;background:#fff!important;border-radius:10px!important;box-shadow:0 2px 8px rgba(27,47,94,.05)!important;}
html[data-paper] .topbar #shiftPill .lbl{font-size:10px!important;color:#7b879b!important;}
html[data-paper] .topbar #shiftPill b{font-size:12px!important;color:#176d52!important;white-space:nowrap;}
html[data-paper] .topbar #shiftPill .shift-cnt{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:6px;background:#e8f5ef;color:#116447;font-size:11px;font-weight:800;}
html[data-paper] .shift-pop{width:360px;max-width:calc(100vw - 24px);padding:0;border-radius:14px;overflow:hidden;border-color:#d9e2f1;box-shadow:0 18px 50px rgba(36,55,91,.18);}
html[data-paper] .shift-pop .sp-head{margin:0;padding:14px 16px 10px;border-bottom:1px solid #e8edf5;}
html[data-paper] .shift-pop .sp-cur{display:flex;justify-content:space-between;gap:12px;margin:12px 14px 6px;padding:10px 12px;background:#eaf6f0;color:#155f48;}
html[data-paper] .shift-pop .sp-mine{margin:0 14px 10px;padding:0 2px;color:#526078;font-size:11px;}
html[data-paper] .shift-pop .sp-sec{margin:0;padding:10px 16px;border-top:1px solid #eef2f7;}
html[data-paper] .shift-pop .sp-sec.on{background:#f7fbf9;box-shadow:inset 3px 0 #2b8a68;}
html[data-paper] .shift-pop .sp-sec-h{gap:7px;}
html[data-paper] .shift-pop .sp-sec-h .tm{margin-right:auto;}
html[data-paper] .shift-pop .sp-now,html[data-paper] .shift-pop .sp-self{padding:2px 6px;border-radius:5px;font-size:10px;font-weight:700;}
html[data-paper] .shift-pop .sp-now{background:#dff2e9;color:#176d52;}
html[data-paper] .shift-pop .sp-self{background:#e7edff;color:#3157b7;}
html[data-paper] .shift-pop .chip{padding:4px 9px;border-radius:6px;background:#f2f5fa;border-color:#e5eaf2;color:#2b3a55;}
html[data-paper] .shift-pop .sp-head{background:linear-gradient(135deg,#f8faff 0%,#f1f5fc 100%);}
html[data-paper] .shift-pop .sp-head>div{display:grid;grid-template-columns:auto auto;align-items:end;column-gap:10px;row-gap:2px;}
html[data-paper] .shift-pop .sp-kicker{grid-column:1/-1;color:#70809d;font-size:9px;font-weight:800;letter-spacing:.18em;}
html[data-paper] .shift-pop .sp-title{font-size:16px;font-weight:850;color:#17233d;}
html[data-paper] .shift-pop .sp-date{padding-bottom:1px;color:#7d899e;font-size:11px;font-variant-numeric:tabular-nums;}
html[data-paper] .shift-pop .sp-close{display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid #dce4f0;border-radius:8px;background:#fff;color:#758197;font-size:18px;line-height:1;cursor:pointer;}
html[data-paper] .shift-pop .sp-close:hover{border-color:#b8c7dc;color:#243654;background:#f7f9fc;}
html[data-paper] .shift-pop .sp-live{display:flex;align-items:center;gap:6px;}
html[data-paper] .shift-pop .sp-live i{width:7px;height:7px;border-radius:50%;background:#18a16f;box-shadow:0 0 0 4px rgba(24,161,111,.12);}
html[data-paper] .shift-pop .sp-total{padding-left:10px;border-left:1px solid rgba(21,95,72,.18);}
html[data-paper] .shift-pop .sp-mine{display:flex;align-items:center;min-height:28px;padding:6px 10px;border:1px solid #e3e9f3;border-radius:8px;background:#fafbfd;}
html[data-paper] .shift-pop .sp-sec{padding:11px 14px;}
html[data-paper] .shift-pop .sp-sec-h{display:grid;grid-template-columns:28px auto 1fr auto auto auto;align-items:center;}
html[data-paper] .shift-pop .sp-shift-icon{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;background:#eef2f8;color:#52627c;font-size:11px;font-weight:850;}
html[data-paper] .shift-pop .sp-shift-name{font-size:12px;font-weight:800;color:#273650;}
html[data-paper] .shift-pop .sp-sec.on .sp-shift-icon{background:#dff1e8;color:#176d52;}
html[data-paper] .shift-pop .sp-sec.on .sp-shift-name{color:#176d52;}
html[data-paper] .shift-pop .sp-chips{margin-left:35px;gap:6px;}
html[data-paper] .shift-pop .chip{display:inline-flex;align-items:center;gap:5px;}
html[data-paper] .shift-pop .chip-dot{width:5px;height:5px;border-radius:50%;background:#8da0bc;}
html[data-paper] .shift-pop .sp-sec.on .chip-dot{background:#28a075;}
html[data-paper] .shift-pop .shift-休:not(.on){background:#fafbfd;}

/* 2026-10-18 班次顶栏与人员面板收口：短状态胶囊 + 紧凑名单，避免空班次撑出大块虚线卡。 */
html[data-paper] .topbar #shiftPill{
  position:relative!important;display:inline-flex!important;align-items:center!important;gap:8px!important;
  height:34px!important;min-height:34px!important;padding:0 10px!important;border:1px solid #dce5f1!important;
  border-radius:9px!important;background:#fff!important;box-shadow:0 1px 3px rgba(27,47,94,.045)!important;
  color:#31415c!important;transition:background .16s,border-color .16s,box-shadow .16s!important;
}
html[data-paper] .topbar #shiftPill::before{content:"";width:7px;height:7px;flex:none;border-radius:50%;background:#24a176;box-shadow:0 0 0 3px #e7f5ef;}
html[data-paper] .topbar #shiftPill:hover{border-color:#b9d9cd!important;background:#f7fbf9!important;box-shadow:0 2px 7px rgba(31,103,79,.08)!important;}
html[data-paper] .topbar #shiftPill .lbl{display:none!important;}
html[data-paper] .topbar #shiftPill b{font-size:12px!important;font-weight:750!important;letter-spacing:.01em;color:#176d52!important;white-space:nowrap;}
html[data-paper] .topbar #shiftPill .shift-cnt{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:6px;background:#e8f5ef;color:#116447;font-size:10px;font-weight:800;line-height:1;}
html[data-paper] .topbar #shiftPill .shift-cnt:empty{display:none!important;}
html[data-paper] .topbar #shiftPill .sh-arrow{width:10px;height:10px;margin-left:0;color:#8794a8;opacity:.8;}
html[data-paper] .shift-pop{
  width:360px;max-width:calc(100vw - 24px);max-height:calc(100vh - 96px);overflow-x:hidden;overflow-y:auto;
  padding:0;border:1px solid #dce5f0;border-radius:13px;background:#fff;color:#263650;
  box-shadow:0 14px 38px rgba(35,55,91,.16);scrollbar-width:thin;scrollbar-color:#c8d3e2 transparent;
}
html[data-paper] .shift-pop .sp-head{position:sticky;top:0;z-index:2;margin:0;padding:11px 14px 9px;border-bottom:1px solid #e9eef5;background:#f8faff;}
html[data-paper] .shift-pop .sp-head>div{display:grid;grid-template-columns:auto auto;align-items:end;column-gap:9px;row-gap:1px;}
html[data-paper] .shift-pop .sp-kicker{grid-column:1/-1;color:#8491a6;font-size:8px;font-weight:800;letter-spacing:.16em;}
html[data-paper] .shift-pop .sp-title{font-size:15px;font-weight:800;color:#1d2d49;}
html[data-paper] .shift-pop .sp-date{padding-bottom:1px;color:#8793a6;font-size:10px;font-variant-numeric:tabular-nums;}
html[data-paper] .shift-pop .sp-close{width:26px;height:26px;border-radius:7px;}
html[data-paper] .shift-pop .sp-cur{display:flex;justify-content:space-between;gap:8px;margin:9px 11px 5px;padding:7px 9px;border-radius:8px;background:#eef7f2;color:#22664f;font-size:11px;}
html[data-paper] .shift-pop .sp-live{gap:6px;}
html[data-paper] .shift-pop .sp-total{padding-left:8px;border-left:1px solid #cfe5d9;white-space:nowrap;}
html[data-paper] .shift-pop .sp-mine{min-height:26px;margin:0 11px 5px;padding:5px 8px;border:1px solid #e8edf4;border-radius:7px;background:#fbfcfe;font-size:11px;}
html[data-paper] .shift-pop .sp-sec{padding:7px 12px;border-top:1px solid #edf1f6;}
html[data-paper] .shift-pop .sp-sec.on{background:#f6fbf8;box-shadow:inset 3px 0 #278467;}
html[data-paper] .shift-pop .sp-sec-h{grid-template-columns:24px auto 1fr auto auto auto;gap:7px;font-size:11px;}
html[data-paper] .shift-pop .sp-shift-icon{width:22px;height:22px;border-radius:6px;font-size:10px;}
html[data-paper] .shift-pop .sp-shift-name{font-size:11px;}
html[data-paper] .shift-pop .sp-sec-h .tm{margin-right:auto;font-size:10px;}
html[data-paper] .shift-pop .sp-sec-h .n{font-size:10px;white-space:nowrap;}
html[data-paper] .shift-pop .sp-now,html[data-paper] .shift-pop .sp-self{padding:2px 5px;border-radius:5px;font-size:9px;}
html[data-paper] .shift-pop .sp-chips{display:flex;flex-wrap:wrap;gap:4px;margin:5px 0 0 31px;}
html[data-paper] .shift-pop .sp-chips:has(.sp-empty){display:none!important;}
html[data-paper] .shift-pop .chip{padding:3px 7px;border-radius:6px;font-size:10px;}
html[data-paper] .shift-pop .chip-dot{width:4px;height:4px;}
html[data-paper] .shift-pop .sp-empty{display:inline!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;color:#99a3b2!important;font-size:10px!important;line-height:1.3!important;}
html[data-paper] .shift-pop .sp-empty::before,html[data-paper] .shift-pop .sp-empty::after{display:none!important;content:none!important;}
html[data-paper] .shift-pop .sp-conflict{margin:0 11px 6px;padding:7px 9px;border:1px solid #f0d19d;border-radius:7px;background:#fff8eb;color:#94601a;font-size:10px;font-weight:700;line-height:1.4;}
html[data-paper] .shift-pop .chip.has-conflict{border-color:#e8bd72!important;background:#fff4dd!important;color:#85520c!important;}
html[data-paper] .shift-pop .chip-conflict-mark{display:inline-grid;place-items:center;width:13px;height:13px;margin-left:2px;border-radius:50%;background:#d58b25;color:white;font-size:9px;line-height:1;}

/* 2026-10-12 order-detail-redesign final cascade overrides */
html[data-paper] #view > #modalBody.od-page { padding:14px 20px 18px !important; }
html[data-paper] #view > #modalBody.od-page > .od-back {
  position:static !important; inset:auto !important; display:inline-flex !important;
  width:auto !important; max-width:max-content !important; height:30px !important;
  margin:0 8px 10px 0 !important; padding:0 12px !important; float:none !important;
}
html[data-paper] #view > #modalBody.od-page > .od-print { float:right !important; margin-left:auto !important; margin-right:0 !important; }
html[data-paper] #view > #modalBody.od-page .od-head {
  clear:both !important; display:grid !important; grid-template-columns:minmax(260px,.8fr) minmax(760px,2.2fr) !important;
  flex-direction:initial !important; flex-wrap:initial !important; align-items:center !important;
  gap:20px !important; margin:0 !important; padding:10px 0 14px !important; border-bottom:1px solid var(--line) !important;
}
html[data-paper] #view > #modalBody.od-page .od-title { display:block !important; }
html[data-paper] #view > #modalBody.od-page .od-kpis {
  display:grid !important; grid-template-columns:1.05fr 1.2fr .75fr .8fr 1.2fr !important;
  flex:none !important; width:auto !important; gap:0 !important; margin:0 !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi {
  min-height:64px !important; height:auto !important; padding:7px 14px !important;
  border:0 !important; border-left:1px solid var(--line) !important; border-radius:0 !important;
  background:transparent !important; box-shadow:none !important;
}
html[data-paper] #view > #modalBody.od-page .odkpi-main .v { font-size:20px !important; }
html[data-paper] #view > #modalBody.od-page #odTabs { margin:0 !important; padding:8px 0 0 !important; }
html[data-paper] #view > #modalBody.od-page #odTabs .tab { padding:9px 14px !important; border-radius:0 !important; }
@media(max-width:1250px){
 html[data-paper] #view > #modalBody.od-page .od-head{grid-template-columns:1fr !important}
 html[data-paper] #view > #modalBody.od-page .od-kpis{grid-template-columns:repeat(5,minmax(0,1fr)) !important}
}

/* ===========================================================================
   § 2026-10-12 v33 左栏配色精修（**保留** 2026-10-11 选定的「B 靛蓝」底色，只修缺陷）
   ---------------------------------------------------------------------------
   用户问「导航条的颜色有没有更好的推荐」。先把现状量出来（_qctest/_navpal.cjs）：
     坞底 linear-gradient(#1B2350 → #141A3D)（靛蓝，用户选定）；
     轨道标签 #BEC7EC 10px；次级文字 #96A1CC；
     **选中态：底色 rgba(86,214,202,.18) ＝ 墨玉青时期留下的【青绿】，
              而选中文字/竖条是 #7C96FF periwinkle【蓝紫】** —— 一个状态两种色相。
   青绿洗在靛蓝底上发灰发绿，就是"看着不清晰、有点脏"的实因（不是底色不好）。
   本层只改三处，底色一行不动：
     ① 选中态色相归一：青绿 → 靛蓝族（rgba(92,123,238,.34) + #A7B8FF）；
     ② 次级文字 #96A1CC → #A6B1D6（对比度 6.1:1 → 7.6:1），主文字 → #C6CFF0；
     ③ 三层反馈重新拉开：砖底 .11 → 悬停 .22 → 选中 .34 + 亮条（原来 .11/.19 只差一档，几乎分不出）。
   换配色：整块删掉即回到现状；想试青绿/提亮见 `_qctest/_navpal.cjs` 的 PALS.B / PALS.C。
   =========================================================================== */
html[data-paper]:not([data-theme="dark"]) {
  --n5-active-bg: rgba(92, 123, 238, .34);
  --n5-active-bar: #A7B8FF;
  --n5-txt: #C6CFF0;
  --n5-txt-2: #A6B1D6;
  --n5-txt-hi: #FFFFFF;
  --n5-btn: rgba(222, 232, 255, .13);
  --n5-btn-hover: rgba(226, 236, 255, .22);
  --nav-tile: rgba(226, 236, 255, .14);
  --nav-tile-hover: rgba(226, 236, 255, .22);
  --nav-ink: #C6CFF0;
  --nav-ink-2: #A6B1D6;
  --nav-accent: #A7B8FF;
}
/* 深色主题同理：同一处青绿遗留，一起归一到靛蓝族（深色下再亮一档） */
html[data-paper][data-theme="dark"] {
  --n5-active-bg: rgba(122, 150, 255, .30);
  --n5-active-bar: #B9C7FF;
}

/* ===========================================================================
   发货出库 · 视觉精修 v1（2026-10-16）
   只作用于台账视图，不改数据、排序和操作行为。
   方向：冷白纸面 + 靛蓝结构色 + 青绿完成态；把「概览 / 操作 / 明细」三层拉开。
   =========================================================================== */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger {
  --ship-blue: #3568d4;
  --ship-ink: #172b4d;
  --ship-muted: #6b7b93;
  --ship-line: #dfe7f2;
  gap: 14px;
}

/* 概览横幅：增加轻微方向感，右侧指标像一组摘要，而不是散落数字。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero {
  min-height: 88px;
  padding: 16px 24px 16px 26px;
  border-color: #d7e2f0;
  border-radius: 16px;
  background:
    radial-gradient(circle at 78% 0%, rgba(87, 132, 220, .10), transparent 30%),
    linear-gradient(110deg, #ffffff 0%, #f8fbff 58%, #f1f6fc 100%);
  box-shadow: 0 10px 24px -18px rgba(30, 64, 110, .42), inset 0 1px 0 #fff;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero::before {
  width: 5px;
  background: linear-gradient(180deg, #4f7fe0, #234fa9);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero-title {
  font-size: 23px;
  font-weight: 850;
  color: var(--ship-ink);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero-sub {
  color: var(--ship-muted);
  letter-spacing: 1.35px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero-stat {
  min-width: 108px;
  padding: 0 20px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero-stat:first-child {
  min-width: 202px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hs-val {
  font-size: 28px;
  letter-spacing: -.35px;
}

/* KPI：每张卡用一条身份色做导航，避免六张白卡看起来没有主次。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid {
  gap: 12px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card {
  min-height: 102px;
  padding: 15px 17px 14px;
  border-color: #dfe7f2;
  border-radius: 14px;
  box-shadow: 0 6px 16px -14px rgba(30, 64, 110, .50), inset 0 1px 0 #fff;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card::before {
  display: block;
  top: 0;
  left: 0;
  right: 0;
  width: auto;
  height: 3px;
  border-radius: 14px 14px 0 0;
  background: var(--ship-blue);
  opacity: 1;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(2)::before { background: #159a86; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(3)::before { background: #94a3b8; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(4)::before { background: #6b5dd3; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(5)::before { background: #d08a2e; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(6)::before { background: #d05b71; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:hover {
  transform: translateY(-3px);
  border-color: #bfd0e6;
  box-shadow: 0 12px 22px -16px rgba(30, 64, 110, .48), inset 0 1px 0 #fff;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-label {
  color: #60708a;
  font-size: 11px;
  letter-spacing: .25px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-val {
  color: var(--ship-ink);
  font-size: 36px;
  letter-spacing: -.7px;
}

/* 操作层：工具栏做成独立的纸面工作区，按钮和筛选自然分组。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-actionbar {
  padding: 11px 13px;
  border-color: #d7e2ef;
  border-radius: 15px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 8px 20px -17px rgba(30, 64, 110, .55), inset 0 1px 0 #fff;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-ab-row2 {
  padding-top: 10px;
  border-top-color: #e8eef6;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-seg {
  background: #eef3fa;
  border-color: #d8e2ef;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-seg-item.active {
  color: #fff;
  background: linear-gradient(180deg, #4778dc, #2f5fc2);
  box-shadow: 0 4px 10px -6px rgba(47, 95, 194, .7);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-btn.primary {
  background: linear-gradient(180deg, #4778dc, #2f5fc2);
  border-color: #2f5fc2;
  box-shadow: 0 5px 12px -8px rgba(47, 95, 194, .9);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-btn.ghost {
  color: #355b9c;
  border-color: #cbd9eb;
  background: #fff;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-search {
  background: #fff;
  border-color: #cddbeb;
}

/* 明细层：表头更像固定的阅读基线，数据行保留轻微斑马纹和悬停反馈。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-panel {
  border-color: #d6e1ee;
  border-radius: 15px;
  box-shadow: 0 10px 24px -20px rgba(30, 64, 110, .58);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed thead th {
  height: 40px;
  color: #3c5272;
  background: linear-gradient(180deg, #f5f8fc 0%, #edf3fa 100%);
  border-bottom-color: #cbd9e9;
  font-size: 11px;
  letter-spacing: .25px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed tbody td {
  height: 44px;
  color: #40516b;
  border-bottom-color: #e7edf5;
  font-size: 11px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed tbody tr:hover {
  background: #edf5ff;
  box-shadow: inset 3px 0 0 #4c7bdc;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-cell-oid b {
  color: #193a78;
  letter-spacing: .15px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-cell-cyc {
  color: #263e68;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

@media(max-width:1280px){
  html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero-stat { padding: 0 11px; }
  html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-hero-stat:first-child { min-width: 150px; }
}

/* 表格列宽再平衡：客户单位要能读全，三个人员列保持等宽，操作列只保留按钮所需空间。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-seq { width: 3.5%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-oid { width: 12%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-cust { width: 17%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-puri { width: 8%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-p { width: 6.2%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-time { width: 11%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-cyc { width: 7%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-note { width: 5%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-st { width: 7%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed col.c-ops { width: 10.5%; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed tbody td:not(.sp-cell-cust) {
  white-space: nowrap;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed .sp-cell-cust {
  white-space: normal;
  line-height: 1.35;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger .sp-table-fixed .sp-cell-ops {
  white-space: nowrap;
  padding-left: 8px;
  padding-right: 8px;
}

/* KPI 卡片精修：降低空白感，让每张卡有自己的语义色和信息节奏。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card {
  min-height: 116px;
  padding: 18px 18px 16px;
  align-items: center;
  border: 1px solid #dbe5f1;
  border-radius: 16px;
  background: linear-gradient(145deg, #ffffff 0%, #f7faff 100%) !important;
  box-shadow: 0 8px 20px -16px rgba(31, 62, 109, .55), inset 0 1px 0 #fff;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card::before {
  top: 0;
  left: 0;
  right: 0;
  width: auto;
  height: 4px;
  border-radius: 16px 16px 0 0;
  background: linear-gradient(90deg, #4d83e4, #78a2ef);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(2) {
  background: linear-gradient(145deg, #ffffff 0%, #f4fcfa 100%) !important;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(2)::before {
  background: linear-gradient(90deg, #159a86, #53c5aa);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(3) {
  background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%) !important;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(3)::before {
  background: linear-gradient(90deg, #9aa8ba, #c1cad6);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(4) {
  background: linear-gradient(145deg, #ffffff 0%, #f7f6ff 100%) !important;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(4)::before {
  background: linear-gradient(90deg, #675bd0, #9a8fea);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(5) {
  background: linear-gradient(145deg, #ffffff 0%, #fffbf4 100%) !important;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(5)::before {
  background: linear-gradient(90deg, #d08a2e, #efbd65);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(6) {
  background: linear-gradient(145deg, #ffffff 0%, #fff7f8 100%) !important;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(6)::before {
  background: linear-gradient(90deg, #d05b71, #ee9bab);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-body {
  position: relative;
  z-index: 2;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #65758e;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .25px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-label::before {
  content: "";
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: #4d83e4;
  box-shadow: 0 0 0 3px rgba(77, 131, 228, .12);
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(2) .sp-kpi-label::before { background: #159a86; box-shadow: 0 0 0 3px rgba(21, 154, 134, .12); }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(3) .sp-kpi-label::before { background: #9aa8ba; box-shadow: 0 0 0 3px rgba(154, 168, 186, .16); }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(4) .sp-kpi-label::before { background: #675bd0; box-shadow: 0 0 0 3px rgba(103, 91, 208, .12); }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(5) .sp-kpi-label::before { background: #d08a2e; box-shadow: 0 0 0 3px rgba(208, 138, 46, .13); }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(6) .sp-kpi-label::before { background: #d05b71; box-shadow: 0 0 0 3px rgba(208, 91, 113, .13); }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-val {
  margin: 7px 0 4px;
  color: #172b4d;
  font-size: 39px;
  font-weight: 850;
  line-height: .95;
  letter-spacing: -1px;
  font-variant-numeric: tabular-nums;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-sub {
  max-width: 205px;
  color: #718098;
  font-size: 10px;
  line-height: 1.35;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-left: 10px;
  border: 1px solid #dbe5f1;
  border-radius: 12px;
  color: #657da8;
  background: rgba(255, 255, 255, .72);
  opacity: 1;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(4) .sp-kpi-icon { color: #675bd0; background: #f1efff; border-color: #ddd9fb; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(5) .sp-kpi-icon { color: #c17c21; background: #fff6e6; border-color: #f3dfb9; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring {
  width: 48px;
  height: 48px;
  margin-left: 10px;
  opacity: 1;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring svg { width: 48px; height: 48px; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring circle:first-child { stroke: #e3eaf3; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring circle:nth-child(2) { stroke: #3d82df; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-pct { color: #486181; font-size: 10px; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-delta {
  width: max-content;
  margin: 2px 0 5px;
  padding: 3px 7px;
  border: 1px solid #d9eee5;
  border-radius: 999px;
  background: #ecf9f3;
  color: #13815e;
  font-size: 10px;
  line-height: 1;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-delta.up-bad {
  border-color: #f4d4d9;
  background: #fff0f2;
  color: #c43e55;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-bar {
  height: 3px;
  background: #4d83e4;
  opacity: .75;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(2) .sp-kpi-bar { background: #159a86; }
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card:nth-child(6) .sp-kpi-bar { background: #d05b71; }

/* KPI 紧凑高度：让更多空间留给筛选区和订单明细。 */
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-card {
  min-height: 104px;
  height: 104px;
  padding: 12px 15px 11px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-label {
  font-size: 10px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-val {
  margin: 4px 0 3px;
  font-size: 33px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-delta {
  margin: 1px 0 3px;
  padding: 2px 6px;
  font-size: 9px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-sub {
  display: -webkit-box;
  max-width: 215px;
  overflow: hidden;
  font-size: 9px;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-icon {
  width: 34px;
  height: 34px;
  margin-left: 8px;
  border-radius: 10px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring,
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring svg {
  width: 42px;
  height: 42px;
}
html:not([data-theme="dark"]) #view .sp-page.sp-page-ledger > .sp-kpi-grid .sp-kpi-ring {
  margin-left: 8px;
}

/* 2026-10-17 · 返工处理工作台重排：压缩页头、把筛选收成一条、列表成为主工作区。 */
html[data-paper] #view .rework-page {
  gap: 10px !important;
  margin-top: 6px !important;
}
html[data-paper] #view .rework-hero {
  grid-template-columns: minmax(0, 1fr) minmax(520px, .9fr) !important;
  gap: 22px !important;
  min-height: 0 !important;
  padding: 12px 16px !important;
  border: 1px solid var(--ui-line-200) !important;
  border-radius: 14px !important;
  background: var(--ui-bg-card) !important;
  box-shadow: 0 2px 8px rgba(19, 42, 71, .045) !important;
  color: var(--ui-ink-900) !important;
}
html[data-paper] #view .rework-hero-main {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-content: center !important;
  align-items: center !important;
  gap: 4px 10px !important;
}
html[data-paper] #view .rework-hero-badge {
  grid-column: 1;
  grid-row: 1;
  width: fit-content !important;
  padding: 3px 8px !important;
  border: 1px solid var(--ui-line-200) !important;
  background: var(--ui-bg-soft) !important;
  color: var(--ui-brand-700) !important;
  font-size: 10px !important;
  letter-spacing: .02em !important;
}
html[data-paper] #view .rework-hero-badge .dot { width: 6px; height: 6px; }
html[data-paper] #view .rework-hero h2 {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  color: var(--ui-ink-900) !important;
  font-size: 19px !important;
  line-height: 1.2 !important;
}
html[data-paper] #view .rework-hero p {
  grid-column: 1 / -1;
  grid-row: 2;
  max-width: none !important;
  color: var(--ui-ink-500) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}
html[data-paper] #view .rework-hero-meta {
  grid-column: 1 / -1;
  grid-row: 3;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--ui-ink-500) !important;
  font-size: 10px !important;
}
html[data-paper] #view .rework-hero-meta .meta-label,
html[data-paper] #view .rework-hero-meta .meta-value,
html[data-paper] #view .rework-hero-meta .meta-time { color: var(--ui-ink-500) !important; }
html[data-paper] #view .rework-hero-meta .meta-value strong { color: var(--ui-brand-700) !important; font-size: 12px !important; }
html[data-paper] #view .rework-hero-side {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  grid-template-rows: 34px !important;
  align-items: center !important;
  gap: 8px !important;
}
html[data-paper] #view .rework-segments {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-column: 1;
  grid-row: 1;
  align-self: stretch !important;
  gap: 3px !important;
  padding: 3px !important;
  border: 1px solid var(--ui-line-200) !important;
  border-radius: 9px !important;
  background: var(--ui-bg-page) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
html[data-paper] #view .rework-segment {
  min-width: 0 !important;
  padding: 0 8px !important;
  border-radius: 6px !important;
  color: var(--ui-ink-500) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  white-space: nowrap;
}
html[data-paper] #view .rework-segment.active {
  background: var(--ui-bg-card) !important;
  color: var(--ui-brand-700) !important;
  box-shadow: 0 1px 3px rgba(19, 42, 71, .12) !important;
}
html[data-paper] #view .rework-segment .count,
html[data-paper] #view .rework-segment.active .count {
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  background: var(--ui-brand-050) !important;
  color: var(--ui-brand-700) !important;
  font-size: 10px !important;
}
html[data-paper] #view .rework-refresh-btn {
  grid-row: 1;
  align-self: stretch !important;
  width: auto !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 11px !important;
  border: 1px solid var(--ui-line-200) !important;
  border-radius: 8px !important;
  background: var(--ui-bg-card) !important;
  color: var(--ui-ink-700) !important;
  font-size: 11px !important;
  backdrop-filter: none !important;
}
html[data-paper] #view #rw-categ-btn { margin-top: 0 !important; }
html[data-paper] #view .rework-refresh-btn:hover { background: var(--ui-bg-soft) !important; border-color: var(--ui-brand-100) !important; color: var(--ui-brand-700) !important; transform: none !important; }
html[data-paper] #view .rework-stats-v3 {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}
html[data-paper] #view .rework-stats-v3 > .rework-stat-card {
  min-height: 86px !important;
  gap: 3px !important;
  padding: 9px 12px 8px !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 3px rgba(19, 42, 71, .04) !important;
}
html[data-paper] #view .rework-stat-card .rework-stat-glow,
html[data-paper] #view .rework-stat-card .rework-stat-shine { display: none !important; }
html[data-paper] #view .rework-stat-head { min-height: 20px; }
html[data-paper] #view .rework-stat-icon { width: 20px !important; height: 20px !important; border-radius: 6px !important; background: var(--ui-bg-soft) !important; color: var(--ui-brand-700) !important; backdrop-filter: none !important; }
html[data-paper] #view .rework-stat-icon svg { width: 14px !important; height: 14px !important; }
html[data-paper] #view .rework-stat-trend { padding: 0 6px !important; background: transparent !important; color: var(--ui-ink-400) !important; font-size: 9px !important; }
html[data-paper] #view .rework-stat-label { color: var(--ui-ink-500) !important; font-size: 10px !important; letter-spacing: 0 !important; }
html[data-paper] #view .rework-stat-value { color: var(--ui-ink-900) !important; font-size: 23px !important; line-height: 1 !important; }
html[data-paper] #view .rework-stat-sub { min-height: 12px; margin-top: 0 !important; color: var(--ui-ink-400) !important; font-size: 9px !important; }
html[data-paper] #view .rework-stat-bar { height: 3px !important; margin-top: auto !important; background: var(--ui-bg-page) !important; }
html[data-paper] #view .rework-stat-bar i { background: var(--ui-brand-600) !important; }
html[data-paper] #view .rework-toolbar-v4 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
html[data-paper] #view .rework-toolbar-v4 .rework-filter { min-width: 0; margin: 0 !important; }
html[data-paper] #view .rework-toolbar-v4 .rework-search-wrap {
  height: 36px !important;
  padding: 0 10px !important;
  border: 1px solid var(--ui-line-200) !important;
  border-radius: 8px !important;
  background: var(--ui-bg-card) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-search-wrap:focus-within { border-color: var(--ui-brand-600) !important; box-shadow: 0 0 0 3px rgba(18, 128, 139, .10) !important; }
html[data-paper] #view .rework-filter-tools { margin: 0 !important; }
html[data-paper] #view .rework-station-filter-lbl { gap: 6px !important; color: var(--ui-ink-500) !important; font-size: 11px !important; }
html[data-paper] #view .rework-station-filter { height: 36px !important; min-width: 170px !important; border-color: var(--ui-line-200) !important; border-radius: 8px !important; background: var(--ui-bg-card) !important; font-size: 11px !important; }
html[data-paper] #view .rework-table-wrap {
  max-height: min(68vh, calc(100vh - 430px)) !important;
  min-height: clamp(180px, calc(100vh - 680px), 360px);
  border: 1px solid var(--ui-line-200) !important;
  border-radius: 11px !important;
  box-shadow: 0 1px 3px rgba(19, 42, 71, .04) !important;
}
html[data-paper] #view .rework-table-v3 th { padding: 9px 11px !important; font-size: 11px !important; }
html[data-paper] #view .rework-table-v3 td { padding: 8px 11px !important; font-size: 12px !important; }
html[data-paper] #view .cell-remake-link { white-space: nowrap; }
html[data-paper] #view .rework-remake-state { display: inline-flex; align-items: center; margin-right: 7px; padding: 2px 7px; border-radius: 999px; font-size: 10px; font-weight: 700; }
html[data-paper] #view .rework-remake-state.is-done { background: var(--ui-ok-bg); color: var(--ui-ok-ink); }
html[data-paper] #view .rework-remake-state.is-pending { background: var(--ui-warn-bg); color: var(--ui-warn-ink); }
html[data-paper] #view .rework-remake-state.is-empty { background: var(--ui-bg-soft); color: var(--ui-ink-500); }
html[data-paper] #view .rework-remake-link { height: 25px; padding: 0 8px; border: 1px solid var(--ui-line-200); border-radius: 6px; background: var(--ui-bg-card); color: var(--ui-brand-700); font-size: 10px; font-weight: 700; cursor: pointer; }
html[data-paper] #view .rework-remake-link:hover { border-color: var(--ui-brand-600); background: var(--ui-brand-050); }
html[data-paper] #view .rework-empty {
  display: flex !important;
  min-height: inherit;
  align-items: center !important;
  justify-content: center !important;
  color: var(--ui-ink-400) !important;
}
html[data-paper] #view .rw-pagination { position: sticky; bottom: 0; z-index: 4; }
@media (max-width: 1200px) {
  html[data-paper] #view .rework-hero { grid-template-columns: 1fr !important; gap: 10px !important; }
  html[data-paper] #view .rework-hero-side { grid-template-columns: minmax(0, 1fr) auto auto !important; }
}
@media (max-width: 760px) {
  html[data-paper] #view .rework-hero { padding: 10px !important; }
  html[data-paper] #view .rework-hero-main { grid-template-columns: 1fr auto !important; }
  html[data-paper] #view .rework-hero-badge { display: none !important; }
  html[data-paper] #view .rework-hero h2 { grid-column: 1 / -1; grid-row: 1; }
  html[data-paper] #view .rework-hero p { grid-row: 2; }
  html[data-paper] #view .rework-hero-meta { grid-row: 3; }
  html[data-paper] #view .rework-hero-side { grid-template-columns: 1fr 1fr !important; grid-template-rows: auto auto !important; }
  html[data-paper] #view .rework-segments { grid-column: 1 / -1; grid-row: 1; }
  html[data-paper] #view .rework-segment { padding: 0 4px !important; font-size: 10px !important; }
  html[data-paper] #view .rework-refresh-btn { justify-content: center !important; }
  html[data-paper] #view .rework-stats-v3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px !important; }
  html[data-paper] #view .rework-stats-v3 > .rework-stat-card { min-height: 82px !important; }
  html[data-paper] #view .rework-toolbar-v4 { grid-template-columns: 1fr; gap: 7px; }
  html[data-paper] #view .rework-filter-tools { justify-content: flex-end; }
  html[data-paper] #view .rework-table-wrap { max-height: 64vh !important; }
}

/* 2026-10-17 · 返工处理细节：搜索框只保留外层控件边界，统一表单与工具栏质感。 */
html[data-paper] #view .rework-toolbar-v4 .rework-search-wrap {
  gap: 9px !important;
  border-color: #C8D7E8 !important;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-search-wrap:hover {
  border-color: #AFC4DC !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .rework-toolbar-v4 .rework-search-wrap .rework-search-input {
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ui-ink-800) !important;
  font-size: 12px !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view .rework-toolbar-v4 .rework-search-wrap .rework-search-input:focus {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-search-icon {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  color: var(--ui-ink-400) !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-search-input::placeholder {
  color: var(--ui-ink-400) !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-filter-tools {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-station-filter {
  transition: border-color .16s ease, box-shadow .16s ease !important;
}
html[data-paper] #view .rework-toolbar-v4 .rework-station-filter:focus {
  border-color: var(--ui-brand-600) !important;
  box-shadow: 0 0 0 3px rgba(18, 128, 139, .10) !important;
}
html[data-paper] #view .rework-table-v3 tbody tr {
  transition: background-color .14s ease;
}
html[data-paper] #view .rework-table-v3 tbody tr:hover td {
  background: #F0F6FD !important;
}

/* 2026-10-18：重合引物行必须整行保持一致的琥珀色标记；覆盖全局隔行底色。 */
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view table tbody tr.mk-overlap-row > td {
  background: #FFF0D2 !important;
}
html[data-paper][data-paper][data-paper]:not([data-theme="dark"]) #view table tbody tr.mk-overlap-row > td:first-child {
  box-shadow: inset 4px 0 #C46A00 !important;
}

/* 2026-10-19：线边物料目录按现场查找顺序重排，减少宽表阅读负担。 */
html[data-paper] body #view #pdContent > .lm-body:not(.is-dock) > #pdLineMatWrap {
  flex: 1 1 0 !important; min-height: 0 !important; display: flex !important;
}
html[data-paper] #pdLineMatWrap .lm-catalog {
  flex: 1 1 0; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 0;
  overflow: hidden; border: 1px solid #D7E3F2; border-radius: 14px; background: #FFF;
  box-shadow: 0 2px 8px rgba(29, 62, 102, .045);
}
html[data-paper] #pdLineMatWrap .lm-catalog-tools {
  flex: 0 0 auto; display: flex; align-items: end; gap: 18px; flex-wrap: wrap;
  padding: 12px 14px; border-bottom: 1px solid #E5EDF7; background: linear-gradient(180deg,#FBFDFF,#F7FAFE);
}
html[data-paper] #pdLineMatWrap .lm-catalog-search { width: min(330px,100%); display: grid; gap: 5px; }
html[data-paper] #pdLineMatWrap .lm-catalog-search label,
html[data-paper] #pdLineMatWrap .lm-catalog-filter > span { color:#536981; font-size:11px; font-weight:750; }
html[data-paper] #pdLineMatWrap .lm-catalog-search input {
  width:100%; height:36px; box-sizing:border-box; border:1px solid #CBD9EA; border-radius:9px;
  padding:0 11px; background:#FFF; color:#182B42; font-size:12px; outline:none;
}
html[data-paper] #pdLineMatWrap .lm-catalog-search input:focus { border-color:#2876C7; box-shadow:0 0 0 3px rgba(40,118,199,.12); }
html[data-paper] #pdLineMatWrap .lm-catalog-filter { display:flex; align-items:center; gap:7px; flex-wrap:wrap; flex:1 1 580px; }
html[data-paper] #pdLineMatWrap .lm-filter-chip {
  height:30px; display:inline-flex; align-items:center; gap:7px; padding:0 10px; border:1px solid #D5E1EF;
  border-radius:8px; background:#FFF; color:#40556E; font-size:11px; font-weight:650; cursor:pointer;
}
html[data-paper] #pdLineMatWrap .lm-filter-chip b { color:#687C94; font-size:10px; }
html[data-paper] #pdLineMatWrap .lm-filter-chip:hover { border-color:#8EB8E5; color:#155DA5; }
html[data-paper] #pdLineMatWrap .lm-filter-chip.is-active { border-color:#7FB0E3; background:#EDF5FF; color:#075DAE; }
html[data-paper] #pdLineMatWrap .lm-filter-chip.is-active b { color:#075DAE; }
html[data-paper] #pdLineMatWrap .lm-catalog-count {
  margin-left:auto; display:flex; align-items:baseline; gap:5px; color:#61758D; font-size:11px; white-space:nowrap;
}
html[data-paper] #pdLineMatWrap .lm-catalog-count b { color:#1766B1; font-size:18px; }
html[data-paper] #pdLineMatWrap .lm-table-caption {
  min-height:42px; flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:0 14px; border-bottom:1px solid #E7EEF7; color:#6B7E94; font-size:10px;
}
html[data-paper] #pdLineMatWrap .lm-table-caption > div { display:flex; align-items:baseline; gap:10px; min-width:0; }
html[data-paper] #pdLineMatWrap .lm-table-caption strong { color:#223A55; font-size:12px; }
html[data-paper] #pdLineMatWrap .lm-table-caption > div span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-paper] #pdLineMatWrap .lm-catalog-table { margin:0 !important; border:0 !important; border-radius:0 !important; }
html[data-paper] #pdLineMatWrap .lm-catalog-table table { width:100%; min-width:1100px; table-layout:fixed; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th { height:34px; padding:0 10px; white-space:nowrap; }
html[data-paper] #pdLineMatWrap .lm-catalog-table td { height:48px; padding:6px 10px; vertical-align:middle; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(1) { width:105px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(2) { width:120px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(3) { width:210px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(4) { width:135px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(5) { width:175px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(6) { width:210px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(7) { width:260px; }
html[data-paper] #pdLineMatWrap .lm-catalog-table th:nth-child(8) { width:76px; text-align:center; }
html[data-paper] #pdLineMatWrap .lm-catalog-table td:nth-child(8) { text-align:center; }
html[data-paper] #pdLineMatWrap .lm-catalog-table tbody tr:hover td { background:#F1F7FE !important; }
html[data-paper] #pdLineMatWrap .lm-area-chip,
html[data-paper] #pdLineMatWrap .lm-spec-chip {
  display:inline-flex; align-items:center; min-height:23px; padding:0 8px; border:1px solid #DFE8F3;
  border-radius:7px; background:#F7FAFE; color:#38516E; font-size:10px; font-weight:650;
}
html[data-paper] #pdLineMatWrap .lm-area-chip { border-color:#D6E5F7; background:#EFF6FE; color:#1763AA; }
html[data-paper] #pdLineMatWrap .lm-code-cell { color:#183B62; font-size:10px; font-weight:750; white-space:nowrap; }
html[data-paper] #pdLineMatWrap .lm-name-cell strong,
html[data-paper] #pdLineMatWrap .lm-brand-cell strong,
html[data-paper] #pdLineMatWrap .lm-location-cell strong { display:block; color:#243B55; font-size:11px; font-weight:750; line-height:1.45; }
html[data-paper] #pdLineMatWrap .lm-name-cell small,
html[data-paper] #pdLineMatWrap .lm-brand-cell small,
html[data-paper] #pdLineMatWrap .lm-location-cell small,
html[data-paper] #pdLineMatWrap .lm-detail-cell small { display:block; margin-top:3px; color:#8796A8; font-size:9px; line-height:1.35; }
html[data-paper] #pdLineMatWrap .lm-detail-cell { color:#445A73; font-size:10px; overflow-wrap:anywhere; }
html[data-paper] #pdLineMatWrap .lm-location-cell { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-paper] #pdLineMatWrap .lm-edit-btn { min-width:48px; padding:5px 9px; }
html[data-paper] #pdLineMatWrap .lm-no-results { height:150px; text-align:center; color:#77889C; font-size:12px; }
html[data-paper] #pdLineMatWrap .lm-catalog-note,
html[data-paper] #pdLineMatWrap .lm-catalog-more {
  flex:0 0 auto; display:flex; align-items:center; justify-content:center; gap:10px; min-height:38px;
  border-top:1px solid #E8EEF6; color:#6E8095; font-size:10px; background:#FBFCFE;
}
html[data-paper] #pdLineMatWrap .lm-catalog-note button,
html[data-paper] #pdLineMatWrap .lm-catalog-more button {
  border:1px solid #CBDCED; border-radius:7px; padding:5px 9px; background:#FFF; color:#1765B0; font-size:10px; font-weight:700; cursor:pointer;
}
@media (max-width:1100px) {
  html[data-paper] #pdLineMatWrap .lm-catalog-tools { align-items:stretch; gap:10px; }
  html[data-paper] #pdLineMatWrap .lm-catalog-count { margin-left:0; }
  html[data-paper] #pdLineMatWrap .lm-catalog-search { width:100%; }
}

/* 2026-10-19 · 领用登记向导：放大关键信息并固定候选项网格，确保名称始终清晰可见。 */
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-head h3{font-size:19px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-head p{font-size:13px!important;line-height:1.5!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-eyebrow{font-size:10px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-stepper-item{font-size:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-stepper-item i{width:24px!important;height:24px!important;font-size:10px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-section-title b{font-size:14px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-section-title small{font-size:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-field{font-size:12.5px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-field em{font-size:11px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-field :is(input,select){height:40px!important;min-height:40px!important;font-size:14px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-options{max-height:min(350px,48vh)!important;padding:5px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option{display:grid!important;grid-template-columns:116px minmax(0,1fr)!important;grid-template-rows:minmax(22px,auto) minmax(18px,auto)!important;grid-template-areas:"code name" "code detail"!important;align-items:center!important;gap:3px 12px!important;min-height:58px!important;padding:9px 11px!important;border-bottom:1px solid #E6EDF5!important;border-radius:7px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-code{grid-area:code!important;align-self:center!important;font-size:12px!important;letter-spacing:.1px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-name{display:block!important;grid-area:name!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;color:#183B5B!important;font-size:15px!important;line-height:1.35!important;font-weight:800!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option small{display:block!important;grid-area:detail!important;min-width:0!important;overflow:hidden!important;color:#687F96!important;font-size:12px!important;line-height:1.35!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-selected-material{gap:11px!important;padding:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-selected-material small{font-size:11px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-selected-material b{font-size:12px!important;color:#567087!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-selected-name{display:block!important;max-width:360px!important;overflow:hidden!important;color:#1B5438!important;font-size:15px!important;line-height:1.35!important;font-weight:800!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-selected-brand{font-size:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-pick-hint{font-size:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-auto-meta small{font-size:11px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-auto-meta b{font-size:12.5px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-step-hint{font-size:12px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-register-foot{font-size:12px!important}
@media(max-width:700px){
  html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option{grid-template-columns:88px minmax(0,1fr)!important;gap:3px 9px!important}
  html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-code{font-size:11px!important}
  html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-name{font-size:14px!important}
  html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option small{font-size:11px!important}
}
html[data-paper] body #view #pdContent .lm-register-overlay #pdLrMatCount{display:inline-flex!important;align-items:center!important;min-height:22px!important;padding:2px 9px!important;border:1px solid #D9E8F7!important;border-radius:999px!important;background:#F1F7FE!important;color:#246BAA!important;font-size:11px!important;font-variant-numeric:tabular-nums!important;font-weight:800!important;white-space:nowrap!important}
html[data-paper] body #view #pdContent .lm-register-overlay #pdLrMatSearch{padding-right:38px!important;background:linear-gradient(180deg,#FFFFFF,#FBFDFF)!important;box-shadow:0 1px 2px rgba(32,66,101,.04)!important}
html[data-paper] body #view #pdContent .lm-register-overlay #pdLrMatSearch::placeholder{color:#91A1B3!important;font-size:12.5px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-search-glyph{top:10px!important;color:#4C83B7!important;font-size:19px!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-options{border-color:#D1E0EF!important;box-shadow:0 16px 36px rgba(24,53,83,.19),0 2px 8px rgba(24,53,83,.06)!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option{position:relative!important;transition:background-color .14s ease,border-color .14s ease,transform .14s ease!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option:hover{background:#F2F8FF!important;border-bottom-color:#D8E9FA!important;transform:translateX(2px)!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option:focus-visible{outline:2px solid #80B7ED!important;outline-offset:-2px!important;background:#F2F8FF!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option[data-match-quality="approximate"]{background:#FBFAFF!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option[data-match-quality="approximate"] .lm-mat-code{color:#6856A8!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option[data-match-quality="approximate"]:after{content:"近似"!important;position:absolute!important;top:8px!important;right:9px!important;padding:2px 7px!important;border:1px solid #E4DDF7!important;border-radius:999px!important;background:#F4F0FF!important;color:#6956A6!important;font-size:10px!important;font-weight:800!important;line-height:1.35!important;pointer-events:none!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option[data-match-quality="approximate"] .lm-mat-name{padding-right:48px!important}
/* Keep hidden search results out of the dropdown; the grid display rule above must not override [hidden]. */
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-option[hidden],
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-empty[hidden],
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-options[hidden]{display:none!important}
html[data-paper] body #view #pdContent .lm-register-overlay #pdLrMatCount[data-empty="1"]{border-color:#F3D5D2!important;background:#FFF6F4!important;color:#B5473D!important}
html[data-paper] body #view #pdContent .lm-register-overlay .lm-mat-empty{padding:22px 14px!important;color:#6E8196!important;font-size:13px!important;line-height:1.55!important}

/* 2026-10-19 · 线边物料目录：提升常用信息字号与行距，增强表格层次和点击反馈。 */
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-tools{gap:16px!important;padding:14px 16px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-search{width:min(360px,100%)!important;gap:6px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-search label,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-filter>span{font-size:12px!important;color:#405875!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-search input{height:40px!important;padding:0 13px!important;font-size:14px!important;border-radius:10px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-filter-chip{height:34px!important;padding:0 12px!important;font-size:12px!important;border-radius:9px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-filter-chip b{font-size:11px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-count{font-size:12px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-count b{font-size:21px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-table-caption{min-height:46px!important;padding:0 16px!important;font-size:12px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-table-caption strong{font-size:14px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-table th{height:40px!important;padding:0 12px!important;font-size:12px!important;font-weight:800!important;letter-spacing:.1px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-table td{height:54px!important;padding:7px 12px!important;font-size:13px!important;line-height:1.45!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-table tbody tr:nth-child(even) td{background:#F8FBFF!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-table tbody tr:hover td{background:#EDF5FF!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-area-chip,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-spec-chip{min-height:27px!important;padding:0 10px!important;font-size:12px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-code-cell{font-size:12px!important;font-weight:800!important;letter-spacing:.1px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-name-cell strong,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-brand-cell strong,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-location-cell strong{font-size:13px!important;line-height:1.45!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-name-cell small,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-brand-cell small,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-location-cell small,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-detail-cell small{font-size:11px!important;line-height:1.4!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-detail-cell{font-size:12px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-edit-btn{min-width:56px!important;min-height:32px!important;padding:5px 10px!important;font-size:12px!important;font-weight:750!important;border-radius:8px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more{min-height:42px!important;font-size:12px!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note button,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more button{padding:7px 11px!important;font-size:12px!important;border-radius:8px!important}
@media (max-width:1100px){
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-tools{gap:10px!important;padding:12px!important}
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-table th,
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-table td{padding-left:9px!important;padding-right:9px!important}
}

/* 2026-10-19 · 线边物料目录底部提示与列表扩展操作统一成清晰的工具栏。 */
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more{
  box-sizing:border-box!important;flex:0 0 auto!important;display:flex!important;align-items:center!important;
  justify-content:flex-start!important;gap:10px!important;padding:8px 16px!important;
  border-top:1px solid #E4ECF6!important;background:#F7FAFE!important;color:#526981!important;
  font-size:12px!important;line-height:1.4!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note{min-height:48px!important;background:#F4F8FD!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note>span,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more>span{
  display:inline-flex!important;align-items:center!important;gap:8px!important;min-width:0!important;
  color:#506781!important;font-size:12px!important;font-weight:600!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note>span:before{
  content:"i"!important;flex:0 0 20px!important;width:20px!important;height:20px!important;display:inline-flex!important;
  align-items:center!important;justify-content:center!important;border:1px solid #CFE0F3!important;border-radius:50%!important;
  background:#EAF3FD!important;color:#1768B2!important;font-size:12px!important;font-weight:800!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note button,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more button{
  flex:0 0 auto!important;min-height:34px!important;padding:0 13px!important;border:1px solid #C8D9EC!important;
  border-radius:9px!important;background:#FFF!important;color:#1765B0!important;font-size:12px!important;
  font-weight:750!important;box-shadow:0 1px 2px rgba(24,55,88,.05)!important;transition:all .15s ease!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note button{margin-left:auto!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more{min-height:54px!important;background:#FFF!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more>span{margin-right:auto!important;color:#60748B!important}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more>span:before{
  content:"列表"!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  height:23px!important;padding:0 8px!important;border-radius:6px!important;background:#EDF4FC!important;
  color:#35658F!important;font-size:11px!important;font-weight:750!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more button:last-child{
  border-color:#1769B4!important;background:linear-gradient(180deg,#247BC8,#1768B2)!important;color:#FFF!important;
  box-shadow:0 3px 8px rgba(23,104,178,.18)!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note button:hover,
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more button:hover{
  transform:translateY(-1px)!important;border-color:#7FB0E3!important;box-shadow:0 3px 9px rgba(24,75,126,.12)!important
}
html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more button:last-child:hover{background:#105B9D!important}
@media(max-width:720px){
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note,
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more{flex-wrap:wrap!important;gap:7px!important;padding:9px 11px!important}
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-note button{margin-left:28px!important}
  html[data-paper] body #view #pdContent #pdLineMatWrap .lm-catalog-more>span{width:100%!important}
}

/* 2026-10-19 · 左侧导航配色：深海军蓝 + 清晰蓝色选中态
   保留既有两级导航结构与尺寸，只统一轨道、面板、条目和交互色。 */
html[data-paper] body .sidebar {
  background: #18264B !important;
  border-right: 1px solid rgba(255,255,255,.08) !important;
  color: #C5D2EA !important;
}
html[data-paper] body .sidebar .nav-rail {
  background: #121E3C !important;
  border-right: 1px solid rgba(255,255,255,.07) !important;
}
html[data-paper] body .sidebar .nav-panel {
  background: #18264B !important;
  color: #C5D2EA !important;
}
html[data-paper] body .sidebar .brand {
  border-bottom-color: rgba(255,255,255,.10) !important;
}
html[data-paper] body .sidebar .brand h1,
html[data-paper] body .sidebar .nav-panel-h,
html[data-paper] body .sidebar .nav-panel-h > span {
  color: #F5F8FF !important;
}
html[data-paper] body .sidebar .brand .sub,
html[data-paper] body .sidebar .nav-group > .gt,
html[data-paper] body .sidebar .nav-pin .np-h,
html[data-paper] body .sidebar .nav-pin .np-h em,
html[data-paper] body .sidebar .nav-panel-h > i,
html[data-paper] body .sidebar .nav-rail .nr-btn {
  color: #8294B8 !important;
}
html[data-paper] body .sidebar .nav-item {
  color: #C5D2EA !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .nav-item:hover,
html[data-paper] body .sidebar .nav-rail .nr-btn:hover {
  background: rgba(255,255,255,.08) !important;
  color: #FFFFFF !important;
}
html[data-paper] body .sidebar .nav-item.active,
html[data-paper] body .sidebar .nav-item.on {
  background: #2F6FD6 !important;
  border-color: rgba(143,197,255,.35) !important;
  color: #FFFFFF !important;
  box-shadow: 0 3px 10px rgba(5,17,48,.22) !important;
}
html[data-paper] body .sidebar .nav-item.active::before,
html[data-paper] body .sidebar .nav-item.on::before {
  background: #8FC5FF !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .nav-item.active > svg,
html[data-paper] body .sidebar .nav-item.on > svg,
html[data-paper] body .sidebar .nav-item.active > span,
html[data-paper] body .sidebar .nav-item.on > span {
  color: #FFFFFF !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on {
  background: rgba(47,111,214,.24) !important;
  color: #FFFFFF !important;
  box-shadow: inset 0 0 0 1px rgba(143,197,255,.26) !important;
}
html[data-paper] body .sidebar .nav-pin {
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.10) !important;
}
html[data-paper] body .sidebar .nav-search,
html[data-paper] body .sidebar .nav-search input {
  background: rgba(7,18,44,.42) !important;
  border-color: rgba(255,255,255,.13) !important;
  color: #F5F8FF !important;
}
html[data-paper] body .sidebar .nav-search input::placeholder {
  color: #9AABCA !important;
}
html[data-paper] body .sidebar .nav-search:focus-within {
  border-color: #70A9F6 !important;
  box-shadow: 0 0 0 3px rgba(47,111,214,.24) !important;
}
html[data-paper] body .sidebar .nav-badge:not([hidden]) {
  background: #EF5965 !important;
  color: #FFFFFF !important;
}
html[data-paper] body .sidebar .side-foot {
  border-top-color: rgba(255,255,255,.10) !important;
  color: #C5D2EA !important;
}
html[data-paper] body .sidebar :is(.side-foot button, .side-foot a):hover {
  background: rgba(255,255,255,.08) !important;
  color: #FFFFFF !important;
}
html[data-paper] body .sidebar :is(.nav-item, .nr-btn, .nav-search button):focus-visible {
  outline: 2px solid #8FC5FF !important;
  outline-offset: 2px !important;
}

/* 2026-10-19 · 原窄栏细修：保留图标在上、类目名在下的熟悉布局。 */
html[data-paper] body .sidebar .nav-rail .nr-btn {
  min-height: 58px !important;
  padding: 6px 2px !important;
  gap: 5px !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  color: #C5D2EA !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn > span {
  max-width: 100% !important;
  color: inherit !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  text-align: center !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn > svg {
  width: 18px !important;
  height: 18px !important;
  opacity: .88 !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:not(.on):hover {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.09) !important;
  color: #FFFFFF !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on,
html[data-paper] body .sidebar .nav-rail .nr-btn.on:hover {
  background: #2F6FD6 !important;
  border-color: rgba(143,197,255,.40) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 12px rgba(5,17,48,.24) !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on > svg { opacity: 1 !important; }
html[data-paper] body .sidebar .nav-rail .nr-btn .nr-dot {
  background: #EF5965 !important;
  box-shadow: 0 0 0 2px #18264B !important;
}

/* 2026-10-19 · 浮出菜单细节：标题层级、点击面积、悬停与当前项反馈统一。 */
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel {
  padding: 10px !important;
  border: 1px solid rgba(143,197,255,.24) !important;
  border-radius: 14px !important;
  background: linear-gradient(155deg, #1D2D55 0%, #172449 100%) !important;
  box-shadow: 0 18px 42px -20px rgba(4,10,28,.78), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel-h {
  min-height: 38px !important;
  margin: 0 0 7px !important;
  padding: 1px 3px 8px !important;
  align-items: center !important;
  gap: 8px !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > svg {
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  color: #8FC5FF !important;
  opacity: 1 !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > span {
  color: #F5F8FF !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel-h > i {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  padding: 3px 7px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  color: #B8C8E7 !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item {
  min-height: 38px !important;
  height: 38px !important;
  margin: 2px 0 !important;
  padding: 0 10px !important;
  gap: 10px !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  color: #C5D2EA !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  transition: background .14s ease, border-color .14s ease, color .14s ease !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item > svg {
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  color: #9FB5DE !important;
  opacity: .95 !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item > span:not(.nav-badge) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  color: inherit !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:not(.active):hover,
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:not(.active):focus-visible {
  border-color: rgba(143,197,255,.22) !important;
  background: rgba(255,255,255,.09) !important;
  color: #FFFFFF !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active,
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.on {
  border-color: rgba(143,197,255,.42) !important;
  background: linear-gradient(90deg, rgba(47,111,214,.56), rgba(47,111,214,.32)) !important;
  color: #FFFFFF !important;
  box-shadow: inset 3px 0 0 #8FC5FF !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.active > svg,
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item.on > svg {
  color: #FFFFFF !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item .nav-badge:not([hidden]) {
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  background: #EF5965 !important;
  color: #FFFFFF !important;
  font-size: 10px !important;
  font-weight: 750 !important;
}
html.nav-fly[data-paper][data-paper][data-paper][data-paper] body .sidebar .nav-panel .nav-item:focus-visible {
  outline: 2px solid #8FC5FF !important;
  outline-offset: 1px !important;
}
@media (prefers-reduced-motion: reduce) {
  html.nav-fly[data-paper] body .sidebar .nav-panel .nav-item { transition: none !important; }
}

/* 2026-10-19 · 底部收口：类目、连接状态与安全入口形成同一组轻量控制区。 */
html[data-paper] body .sidebar .nav-rail .nr-btn:last-child {
  margin-bottom: 8px !important;
  position: relative !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:last-child::after {
  content: "" !important;
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: -6px !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(190,211,248,.22), transparent) !important;
  pointer-events: none !important;
}
html[data-paper] body .sidebar .side-foot {
  flex: 0 0 auto !important;
  margin-top: auto !important;
  padding: 10px 5px 8px !important;
  gap: 8px !important;
  align-items: center !important;
  border-top: 1px solid rgba(190,211,248,.13) !important;
  background: linear-gradient(180deg, rgba(8,17,42,.05), rgba(8,17,42,.22)) !important;
}
html[data-paper] body .sidebar .side-foot .conn {
  width: 38px !important;
  height: 27px !important;
  min-height: 27px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid rgba(190,211,248,.10) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.035) !important;
}
html[data-paper] body .sidebar .side-foot .conn > span:not(.dot) { display: none !important; }
html[data-paper] body .sidebar .side-foot .conn .dot {
  position: relative !important;
  display: block !important;
  flex: 0 0 8px !important;
  width: 8px !important;
  min-width: 8px !important;
  height: 8px !important;
  min-height: 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 3px rgba(42,190,132,.12), 0 0 9px rgba(42,190,132,.36) !important;
}
html[data-paper] body .sidebar .side-foot .conn .dot::after {
  content: "" !important;
  position: absolute !important;
  inset: -4px !important;
  border: 1px solid currentColor !important;
  border-radius: inherit !important;
  opacity: .24 !important;
  animation: side-status-ring 2.4s ease-out infinite !important;
}
html[data-paper] body .sidebar .side-foot #loginBtn {
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid rgba(190,211,248,.22) !important;
  border-radius: 11px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035)) !important;
  color: #DCE8FF !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 3px 9px rgba(3,9,27,.18) !important;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
}
html[data-paper] body .sidebar .side-foot #loginBtn > svg {
  flex: 0 0 17px !important;
  width: 17px !important;
  height: 17px !important;
  opacity: .94 !important;
}
html[data-paper] body .sidebar .side-foot #loginBtn:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(143,197,255,.60) !important;
  background: linear-gradient(145deg, rgba(47,111,214,.34), rgba(47,111,214,.14)) !important;
  color: #FFFFFF !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 5px 13px rgba(3,9,27,.28) !important;
}
html[data-paper] body .sidebar .side-foot #loginBtn:active { transform: translateY(0) scale(.97) !important; }
html[data-paper] body .sidebar .side-foot #loginBtn:focus-visible {
  outline: 2px solid #8FC5FF !important;
  outline-offset: 2px !important;
}
@keyframes side-status-ring {
  0% { transform: scale(.72); opacity: .28; }
  80%, 100% { transform: scale(1.45); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-paper] body .sidebar .side-foot .conn .dot::after { animation: none !important; }
  html[data-paper] body .sidebar .side-foot #loginBtn { transition: none !important; }
}

/* 2026-10-20 · 企业标志适配：提取蓝、红、绿飘带形态并增强窄栏识别度。 */
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  isolation: isolate !important;
  translate: 3px 0 !important;
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  overflow: hidden !important;
  border: 1px solid rgba(208,238,255,.48) !important;
  border-radius: 13px !important;
  background: radial-gradient(circle at 28% 16%, #29487B 0%, #1D3260 45%, #111F42 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), inset 0 -5px 10px rgba(3,10,28,.22), 0 7px 16px rgba(4,14,39,.34), 0 0 0 3px rgba(106,177,236,.12), 0 0 20px rgba(64,143,220,.26) !important;
}
html[data-paper] body .sidebar .brand .logo::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 3px !important;
  border: 1px solid rgba(219,241,255,.11) !important;
  border-radius: 8px !important;
  background: radial-gradient(circle at 50% 45%, rgba(179,230,255,.13), transparent 68%) !important;
  pointer-events: none !important;
}
html[data-paper] body .sidebar .brand .logo svg {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 31px !important;
  height: 31px !important;
  overflow: visible !important;
  filter: drop-shadow(0 1px 2px rgba(5,25,54,.38)) !important;
}
@media (hover: hover) {
  html[data-paper] body .sidebar .brand .logo {
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
  }
  html[data-paper] body .sidebar .brand .logo:hover {
    transform: translateY(-1px) !important;
    filter: brightness(1.08) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.38), inset 0 -5px 10px rgba(6,35,78,.17), 0 9px 20px rgba(4,14,39,.4), 0 0 0 3px rgba(106,177,236,.13), 0 0 22px rgba(77,156,228,.3) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html[data-paper] body .sidebar .brand .logo { transition: none !important; }
}

/* 2026-10-19 · 导航图标统一置于同尺寸图标座中，修正线稿视觉重心不齐。 */
html[data-paper] body .sidebar .nav-rail .nr-btn > .nr-icon-well {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 1px solid rgba(190,211,248,.11) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.055) !important;
  color: #B8C9E7 !important;
  font-style: normal !important;
  line-height: 0 !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn > .nr-icon-well > svg {
  display: block !important;
  flex: 0 0 17px !important;
  width: 17px !important;
  height: 17px !important;
  overflow: visible !important;
  stroke: currentColor !important;
  stroke-width: 1.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn:not(.on):hover > .nr-icon-well {
  border-color: rgba(143,197,255,.28) !important;
  background: rgba(143,197,255,.10) !important;
  color: #E9F4FF !important;
}
html[data-paper] body .sidebar .nav-rail .nr-btn.on > .nr-icon-well,
html[data-paper] body .sidebar .nav-rail .nr-btn.on:hover > .nr-icon-well {
  border-color: rgba(200,229,255,.24) !important;
  background: rgba(255,255,255,.13) !important;
  color: #FFFFFF !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 2px 6px rgba(5,17,48,.16) !important;
}
@media (prefers-reduced-motion: reduce) {
  html[data-paper] body .sidebar .nav-rail .nr-btn > .nr-icon-well { transition: none !important; }
}


/* 2026-10-20 · 侧栏直接使用企业原始透明标志，完整呈现图形与 BIOLIGO 字标。 */
html[data-paper] body .sidebar .brand .logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 54px !important;
  width: 54px !important;
  height: 34px !important;
  box-sizing: border-box !important;
  margin-inline: auto !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid rgba(207,220,241,.72) !important;
  border-radius: 8px !important;
  background: #F8FAFC !important;
  box-shadow: 0 2px 5px rgba(3,12,35,.2), inset 0 1px 0 rgba(255,255,255,.9) !important;
  transform: translateX(3px) !important;
}
html[data-paper] body .sidebar .brand .logo::before { display: none !important; }
html[data-paper] body .sidebar .brand .logo > img {
  display: block !important;
  flex: 0 0 auto !important;
  width: 50px !important;
  height: 27px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  filter: none !important;
}

/* 2026-10-20 · 60px 导航轨内优先放大企业图形，避免横版字标缩成不可读的小字。 */
html[data-paper] body .sidebar .brand .logo {
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 7px rgba(3,12,35,.28), inset 0 0 0 1px rgba(207,220,241,.9) !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
  width: 84px !important;
  height: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  object-fit: unset !important;
}

/* 2026-10-20 · 回退过度裁切：完整显示原始 BIOLIGO 横版标志，保持居中与留白。 */
html[data-paper] body .sidebar .brand .logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 58px !important;
  width: 58px !important;
  height: 38px !important;
  box-sizing: border-box !important;
  margin-inline: auto !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid rgba(207,220,241,.72) !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 6px rgba(3,12,35,.24), inset 0 1px 0 rgba(255,255,255,.95) !important;
  transform: none !important;
}
html[data-paper] body .sidebar .brand .logo::before { display: none !important; }
html[data-paper] body .sidebar .brand .logo > img {
  position: static !important;
  display: block !important;
  flex: 0 1 56px !important;
  width: 56px !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}

/* 2026-10-20 · Logo 衬底改为品牌浅蓝，保留原始图形配色并融入深色导航。 */
html[data-paper] body .sidebar .brand .logo {
  border-color: rgba(103,164,231,.78) !important;
  background: linear-gradient(145deg, #EAF4FF 0%, #F8FBFF 58%, #E6F3FF 100%) !important;
  box-shadow: 0 2px 7px rgba(3,12,35,.24), inset 0 1px 0 rgba(255,255,255,.96), 0 0 0 1px rgba(77,145,220,.14) !important;
}

/* 2026-10-20 · 加强品牌徽标衬底对比，让 Logo 位在深色导航中更醒目。 */
html[data-paper] body .sidebar .brand .logo {
  border: 2px solid #58A9FF !important;
  background: linear-gradient(145deg, #D8EEFF 0%, #F6FBFF 52%, #DDF2FF 100%) !important;
  box-shadow: 0 2px 8px rgba(3,12,35,.3), inset 0 1px 0 rgba(255,255,255,.98), 0 0 0 2px rgba(48,143,237,.24), 0 0 15px rgba(39,143,246,.42) !important;
}

/* 2026-10-20 · 导航窄栏使用原始 Logo 图形区域作大徽标；关键是从左上裁切，避免居中后只剩彩色边缘。 */
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  display: block !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  box-sizing: border-box !important;
  margin-inline: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 2px solid #58A9FF !important;
  border-radius: 11px !important;
  background: linear-gradient(145deg, #E5F5FF 0%, #FFFFFF 55%, #D8F2FF 100%) !important;
  box-shadow: 0 2px 8px rgba(3,12,35,.32), inset 0 0 0 1px rgba(255,255,255,.9), 0 0 0 2px rgba(48,143,237,.24), 0 0 13px rgba(39,143,246,.35) !important;
  transform: none !important;
}
html[data-paper] body .sidebar .brand .logo::before { display: none !important; }
html[data-paper] body .sidebar .brand .logo > img {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  display: block !important;
  flex: none !important;
  width: 112px !important;
  height: auto !important;
  max-width: none !important;
  object-fit: unset !important;
  object-position: left top !important;
  filter: none !important;
}

/* 2026-10-20 · 按用户要求回退局部裁切，恢复完整原始横版 Logo 与上一版品牌底牌。 */
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 58px !important;
  width: 58px !important;
  height: 38px !important;
  box-sizing: border-box !important;
  margin-inline: auto !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 2px solid #58A9FF !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, #D8EEFF 0%, #F6FBFF 52%, #DDF2FF 100%) !important;
  box-shadow: 0 2px 8px rgba(3,12,35,.3), inset 0 1px 0 rgba(255,255,255,.98), 0 0 0 2px rgba(48,143,237,.24), 0 0 15px rgba(39,143,246,.42) !important;
  transform: none !important;
}
html[data-paper] body .sidebar .brand .logo::before { display: none !important; }
html[data-paper] body .sidebar .brand .logo > img {
  position: static !important;
  display: block !important;
  flex: 0 1 56px !important;
  width: 56px !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}

/* 2026-10-20 · Logo 可读性：纯白中性衬底衬出深蓝字标，取消蓝色染底与光晕。 */
html[data-paper] body .sidebar .brand .logo {
  border: 1px solid #D7E1EF !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 6px rgba(3,12,35,.26), inset 0 1px 0 rgba(255,255,255,.98) !important;
}

/* 2026-10-20 · Logo 周围的导航品牌区提亮为蓝靛渐变，主体导航继续保持深海军蓝。 */
html[data-paper] body .sidebar .brand {
  background: radial-gradient(ellipse at 50% 12%, rgba(91,160,238,.22) 0%, rgba(91,160,238,0) 78%),
              linear-gradient(145deg, #244879 0%, #1B3766 58%, #172D56 100%) !important;
  border-bottom-color: rgba(166,202,245,.3) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 -1px 0 rgba(8,19,42,.18) !important;
}

/* 2026-10-20 · 60px 导航轨的可读性处理：原始横版标志按左上锚点放大，展示彩色图形区域。 */
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  display: block !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  box-sizing: border-box !important;
  margin-inline: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid #D7E1EF !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 6px rgba(3,12,35,.26), inset 0 1px 0 rgba(255,255,255,.98) !important;
  transform: none !important;
}
html[data-paper] body .sidebar .brand .logo::before { display: none !important; }
html[data-paper] body .sidebar .brand .logo > img {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  display: block !important;
  width: 98px !important;
  height: auto !important;
  max-width: none !important;
  object-fit: unset !important;
  object-position: left top !important;
  filter: none !important;
}

/* 2026-10-20 · 撤销局部放大裁切，恢复完整比例显示原始 BIOLIGO 标志。 */
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 58px !important;
  width: 58px !important;
  height: 38px !important;
  box-sizing: border-box !important;
  margin-inline: auto !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid #D7E1EF !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 6px rgba(3,12,35,.26), inset 0 1px 0 rgba(255,255,255,.98) !important;
  transform: none !important;
}
html[data-paper] body .sidebar .brand .logo::before { display: none !important; }
html[data-paper] body .sidebar .brand .logo > img {
  position: static !important;
  display: block !important;
  flex: 0 1 56px !important;
  width: 56px !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}

/* 2026-10-20 · 品牌区整体重做：清晰的企业蓝顶栏 + 白色标志牌 + 三色识别线。 */
html[data-paper] body .sidebar .brand {
  position: relative !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: 64px !important;
  box-sizing: border-box !important;
  padding: 6px 1px 12px !important;
  margin: 0 -4px 4px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 0 12px 12px !important;
  background: linear-gradient(145deg, #1F5F9D 0%, #19477C 48%, #142F59 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 4px 10px rgba(5,17,42,.24) !important;
}
html[data-paper] body .sidebar .brand::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 5px !important;
  width: 30px !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: linear-gradient(90deg, #E51B36 0 20%, #08A7E5 20% 58%, #17A54A 58% 100%) !important;
  opacity: .95 !important;
  transform: translateX(-50%) !important;
}
html[data-paper] body .sidebar .brand .logo {
  flex: 0 0 56px !important;
  width: 56px !important;
  height: 36px !important;
  margin: 0 auto !important;
  padding: 2px !important;
  border: 1px solid rgba(220,233,249,.92) !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 5px rgba(3,12,35,.26), inset 0 1px 0 rgba(255,255,255,.98) !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  position: static !important;
  width: 52px !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  flex: 0 1 52px !important;
}

/* 2026-10-20 · BIOLIGO 品牌区精修：保留完整横版标志，以浅色顶牌、白色标志底和企业三色识别线提高小导航中的辨识度。 */
html[data-paper] body .sidebar .brand {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 74px !important;
  min-height: 74px !important;
  box-sizing: border-box !important;
  padding: 7px 1px 12px !important;
  margin: 0 -4px 4px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 0 13px 13px !important;
  background: linear-gradient(155deg, #F7FBFF 0%, #EAF3FC 60%, #DCEAF8 100%) !important;
  box-shadow: inset 0 1px 0 #FFFFFF, 0 4px 10px rgba(5,17,42,.18) !important;
}
html[data-paper] body .sidebar .brand::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 7px !important;
  width: 40px !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: linear-gradient(90deg, #E51B36 0 20%, #08A7E5 20% 58%, #17A54A 58% 100%) !important;
  transform: translateX(-50%) !important;
}
html[data-paper] body .sidebar .brand::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: auto 9px 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(32,92,150,.26), transparent) !important;
}
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 58px !important;
  width: 58px !important;
  height: 36px !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid #D5E2F0 !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 5px rgba(25,57,93,.15), inset 0 1px 0 #FFFFFF !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  position: static !important;
  display: block !important;
  flex: 0 1 54px !important;
  width: 54px !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}

/* 2026-10-20 · 品牌栏形态修正：撤掉凸起的浅色圆角底块，改为与侧栏直线结构一致的平直色带。 */
html[data-paper] body .sidebar .brand {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 62px !important;
  min-height: 62px !important;
  box-sizing: border-box !important;
  padding: 5px 1px 7px !important;
  margin: 0 -4px 4px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #24355F 0%, #202F56 100%) !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .brand::before {
  display: none !important;
  content: none !important;
}
html[data-paper] body .sidebar .brand::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 9px !important;
  right: 9px !important;
  bottom: 0 !important;
  height: 1px !important;
  background: rgba(194,215,243,.2) !important;
  transform: none !important;
}
html[data-paper] body .sidebar .brand .logo {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 54px !important;
  width: 54px !important;
  height: 32px !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid #D9E3EF !important;
  border-radius: 7px !important;
  background: #FFFFFF !important;
  box-shadow: 0 1px 3px rgba(4,12,31,.2) !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  position: static !important;
  display: block !important;
  flex: 0 1 50px !important;
  width: 50px !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}

/* 2026-10-20 · 窄栏 Logo 可读性：扩大白底承载牌与原始完整标志，压缩两侧多余内边距。 */
html[data-paper] body .sidebar .brand .logo {
  flex: 0 0 60px !important;
  width: 60px !important;
  height: 38px !important;
  padding: 1px !important;
  border-radius: 6px !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  flex: 0 1 58px !important;
  width: 58px !important;
}

/* 2026-10-20 · 品牌栏白底方案：用整片纯白衬出企业色标志，移除内层白牌并保留直线边界。 */
html[data-paper] body .sidebar .brand {
  background: #FFFFFF !important;
  border-bottom: 1px solid #D9E2EE !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .brand .logo {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .brand::after {
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 1px !important;
  background: #D9E2EE !important;
}

/* 2026-10-20 · 按用户反馈将完整 Logo 上移，缩小白色品牌栏顶部留白。 */
html[data-paper] body .sidebar .brand .logo {
  transform: translateY(-6px) !important;
}

/* 2026-10-20 · 按用户澄清上移整片白色品牌栏至侧栏顶端，保持下方导航原有位置。 */
html[data-paper] body .sidebar .brand {
  margin: -12px -4px 16px !important;
}
html[data-paper] body .sidebar .brand .logo {
  transform: none !important;
}

/* 2026-10-20 · 收紧白色 Logo 底块：白底仅包住完整标志，品牌栏恢复深色并保持顶端位置。 */
html[data-paper] body .sidebar .brand {
  background: linear-gradient(180deg, #24355F 0%, #202F56 100%) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .brand::after {
  left: 9px !important;
  right: 9px !important;
  bottom: 0 !important;
  height: 1px !important;
  background: rgba(194,215,243,.2) !important;
}
html[data-paper] body .sidebar .brand .logo.logo {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #D9E3EF !important;
  border-radius: 6px !important;
  box-shadow: 0 1px 3px rgba(4,12,31,.2) !important;
}
html[data-paper] body .sidebar .brand .logo {
  transform: none !important;
}

/* 2026-10-20 · Logo 白牌与侧栏边缘一体化：窄白牌无描边、无圆角，顶边与左右边缘齐平。 */
html[data-paper] body .sidebar .brand.brand {
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  margin: -12px -4px 36px !important;
  background: #202F56 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .brand .logo.logo {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 66px !important;
  width: 66px !important;
  height: 40px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: translateX(2px) !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  flex: 0 1 58px !important;
  width: 58px !important;
  max-width: 100% !important;
}
html[data-paper] body .sidebar .brand::after {
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 1px !important;
  background: rgba(194,215,243,.2) !important;
}

/* 2026-10-20 · 边缘贴合收尾：白牌与侧栏顶框统一尺寸，并做半像素居中校正。 */
html[data-paper] body .sidebar .brand.brand {
  overflow: visible !important;
}
html[data-paper] body .sidebar .brand .logo.logo {
  z-index: 1 !important;
  transform: translateX(1.5px) !important;
}

/* 2026-10-20 · 白牌与侧栏顶框同尺寸：消除刷新后仍可见的边缘细缝。 */
html[data-paper] body .sidebar .brand.brand {
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  margin: -12px -5.1px 12px -4px !important;
  overflow: visible !important;
  background: #202F56 !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-paper] body .sidebar .brand .logo.logo {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 68px !important;
  width: 68px !important;
  height: 42px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: translateX(1.5px) !important;
}
html[data-paper] body .sidebar .brand .logo > img {
  flex: 0 1 58px !important;
  width: 58px !important;
  max-width: 100% !important;
}
html[data-paper] body .sidebar .brand::after {
  display: none !important;
}

/* 2026-10-20 · 顶栏右侧工具区精修：统一控件尺寸、间距与圆角，突出账号/班次状态，并为时钟加入分隔层级。 */
html[data-paper] body .topbar {
  gap: 8px !important;
  align-items: center !important;
}
html[data-paper] body .topbar #refreshBtn,
html[data-paper] body .topbar #deliveryAlert,
html[data-paper] body .topbar #accountBtn,
html[data-paper] body .topbar #shiftPill,
html[data-paper] body .topbar #themeToggleBtn {
  height: 38px !important;
  min-height: 38px !important;
  box-sizing: border-box !important;
  border-radius: 10px !important;
}
html[data-paper] body .topbar #refreshBtn,
html[data-paper] body .topbar #deliveryAlert {
  padding: 0 12px !important;
  gap: 7px !important;
  border: 1px solid #D7E2F0 !important;
  background: #FFFFFF !important;
  color: #365579 !important;
  box-shadow: 0 1px 3px rgba(32,57,92,.06) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
html[data-paper] body .topbar #refreshBtn:hover,
html[data-paper] body .topbar #deliveryAlert:hover {
  border-color: #AFC2DC !important;
  background: #F7FAFE !important;
  color: #20436B !important;
  box-shadow: 0 3px 8px rgba(32,57,92,.1) !important;
}
html[data-paper] body .topbar #accountBtn {
  height: 38px !important;
  padding: 3px 10px 3px 5px !important;
  border-color: #D7E2F0 !important;
  border-radius: 11px !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F9FBFE 100%) !important;
  box-shadow: 0 1px 3px rgba(32,57,92,.06) !important;
}
html[data-paper] body .topbar #accountBtn .account-avatar {
  width: 27px !important;
  height: 27px !important;
  border-radius: 8px !important;
  background: #EDF3FF !important;
  color: #315DB8 !important;
}
html[data-paper] body .topbar #accountBtn .account-meta { gap: 1px !important; }
html[data-paper] body .topbar #accountBtn .account-meta strong {
  font-size: 12px !important;
  line-height: 14px !important;
  color: #1B2D49 !important;
}
html[data-paper] body .topbar #accountBtn .account-meta small {
  font-size: 10px !important;
  line-height: 12px !important;
  color: #77849A !important;
}
html[data-paper] body .topbar #shiftPill {
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 10px !important;
  gap: 8px !important;
  border-color: #D8E5DE !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F9FCFA 100%) !important;
  box-shadow: 0 1px 3px rgba(31,103,79,.06) !important;
}
html[data-paper] body .topbar .clock {
  height: 38px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 1px !important;
  padding-left: 10px !important;
  border-left: 1px solid #DCE4EF !important;
  text-align: left !important;
  line-height: 1.1 !important;
}
html[data-paper] body .topbar .clock .t {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  color: #263B5B !important;
}
html[data-paper] body .topbar .clock .d {
  font-size: 10px !important;
  letter-spacing: .03em !important;
  color: #7B879A !important;
}
html[data-paper] body .topbar #themeToggleBtn {
  width: 38px !important;
  min-width: 38px !important;
  padding: 0 !important;
  justify-content: center !important;
  border: 1px solid #D7E2F0 !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  color: #435675 !important;
  box-shadow: 0 1px 3px rgba(32,57,92,.06) !important;
}
html[data-paper] body .topbar #themeToggleBtn span { font-size: 17px !important; }
@media (max-width: 760px) {
  html[data-paper] body .topbar .clock { display: none !important; }
}

/* 2026-10-20 · 账号登录态与班次信息卡升级：状态更醒目，班次人数明确标注为在岗人数。 */
html[data-paper] body .topbar #accountBtn {
  height: 44px !important;
  min-height: 44px !important;
  padding: 4px 10px 4px 6px !important;
  gap: 8px !important;
  border: 1px solid #C8D7EC !important;
  border-radius: 12px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 6px rgba(35,70,120,.08), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
html[data-paper] body .topbar #accountBtn:hover {
  border-color: #9FB9DD !important;
  background: #FBFDFF !important;
  box-shadow: 0 4px 10px rgba(35,70,120,.12) !important;
}
html[data-paper] body .topbar #accountBtn .account-avatar {
  width: 30px !important;
  height: 30px !important;
  border-radius: 9px !important;
  background: linear-gradient(145deg,#EEF4FF,#E5EEFF) !important;
  color: #2861C5 !important;
}
html[data-paper] body .topbar #accountBtn .account-meta { gap: 1px !important; }
html[data-paper] body .topbar #accountBtn .account-meta strong {
  font-size: 12px !important;
  line-height: 15px !important;
  font-weight: 750 !important;
  color: #1A2D49 !important;
}
html[data-paper] body .topbar #accountBtn .account-meta small {
  display: inline-flex !important;
  align-items: center !important;
  align-self: flex-start !important;
  gap: 4px !important;
  padding: 1px 6px !important;
  border-radius: 5px !important;
  background: #EAF7F0 !important;
  color: #138052 !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 12px !important;
}
html[data-paper] body .topbar #accountBtn .account-state-dot {
  width: 6px !important;
  height: 6px !important;
  background: #20A36B !important;
  box-shadow: 0 0 0 2px rgba(32,163,107,.12) !important;
}
html[data-paper] body .topbar #accountBtn .account-chevron { color: #8494AA !important; }

html[data-paper] body .topbar #shiftPill {
  display: grid !important;
  grid-template-columns: 24px minmax(42px,1fr) auto 10px !important;
  grid-template-rows: 12px 16px !important;
  align-content: center !important;
  align-items: center !important;
  column-gap: 7px !important;
  row-gap: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 3px 9px !important;
  border: 1px solid #C7E2D3 !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg,#F5FBF7 0%,#FFFFFF 100%) !important;
  box-shadow: 0 2px 6px rgba(31,103,79,.07) !important;
  cursor: pointer !important;
}
html[data-paper] body .topbar #shiftPill::before {
  content: "" !important;
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  justify-self: center !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #1E9A66 !important;
  box-shadow: 0 0 0 5px #E4F4EA, 0 0 0 6px #CDE9D8 !important;
}
html[data-paper] body .topbar #shiftPill .lbl {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  color: #718176 !important;
  font-size: 9px !important;
  font-weight: 650 !important;
  line-height: 11px !important;
}
html[data-paper] body .topbar #shiftPill b {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  color: #176B48 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 15px !important;
}
html[data-paper] body .topbar #shiftPill .shift-cnt {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  min-width: 49px !important;
  height: 22px !important;
  box-sizing: border-box !important;
  padding: 0 6px !important;
  border: 1px solid #D2EBDD !important;
  border-radius: 7px !important;
  background: #EAF7F0 !important;
  color: #16754F !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
html[data-paper] body .topbar #shiftPill .shift-cnt::before {
  content: "在岗" !important;
  font-size: 9px !important;
  font-weight: 650 !important;
}
html[data-paper] body .topbar #shiftPill .shift-cnt::after {
  content: "人" !important;
  font-size: 9px !important;
  font-weight: 650 !important;
}
html[data-paper] body .topbar #shiftPill .sh-arrow {
  grid-column: 4 !important;
  grid-row: 1 / 3 !important;
  color: #7C9487 !important;
}
html[data-paper] body .topbar #shiftPill:hover {
  border-color: #9ACBAE !important;
  background: #F2FAF5 !important;
  box-shadow: 0 4px 10px rgba(31,103,79,.12) !important;
}
@media (max-width: 760px) {
  html[data-paper] body .topbar #accountBtn,
  html[data-paper] body .topbar #shiftPill { height: 36px !important; min-height: 36px !important; }
  html[data-paper] body .topbar #shiftPill {
    display: flex !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    gap: 6px !important;
    padding: 0 8px !important;
  }
  html[data-paper] body .topbar #shiftPill .lbl { display: none !important; }
  html[data-paper] body .topbar #shiftPill .shift-cnt::before,
  html[data-paper] body .topbar #shiftPill .shift-cnt::after { display: none !important; }
}

/* 2026-10-20 · 账号卡二次打磨：加强身份层级与登录状态辨识度。 */
html[data-paper] body .topbar #accountBtn {
  min-width: 136px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 4px 11px 4px 8px !important;
  gap: 8px !important;
  border: 1px solid #BFD1EB !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg,#F6F9FF 0%,#FFFFFF 78%) !important;
  box-shadow: inset 3px 0 0 #4778D4, 0 2px 7px rgba(35,70,120,.09) !important;
}
html[data-paper] body .topbar #accountBtn:hover {
  border-color: #91ACD4 !important;
  background: linear-gradient(135deg,#EEF4FF 0%,#FFFFFF 85%) !important;
  box-shadow: inset 3px 0 0 #3468C8, 0 4px 11px rgba(35,70,120,.14) !important;
}
html[data-paper] body .topbar #accountBtn .account-avatar {
  width: 31px !important;
  height: 31px !important;
  flex: 0 0 31px !important;
  border: 1px solid #D4E1F7 !important;
  border-radius: 10px !important;
  background: linear-gradient(145deg,#EAF1FF,#DDE9FF) !important;
  color: #285FBF !important;
  box-shadow: 0 1px 2px rgba(45,89,157,.08) !important;
}
html[data-paper] body .topbar #accountBtn .account-meta { gap: 2px !important; }
html[data-paper] body .topbar #accountBtn .account-meta strong {
  font-size: 13px !important;
  line-height: 15px !important;
  font-weight: 780 !important;
  letter-spacing: .01em !important;
  color: #182B49 !important;
}
html[data-paper] body .topbar #accountBtn .account-meta small {
  display: inline-flex !important;
  align-items: center !important;
  align-self: flex-start !important;
  gap: 5px !important;
  padding: 1px 7px !important;
  border: 1px solid #CBEAD8 !important;
  border-radius: 6px !important;
  background: #E6F6ED !important;
  color: #0C7047 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 13px !important;
}
html[data-paper] body .topbar #accountBtn .account-state-dot {
  width: 6px !important;
  height: 6px !important;
  background: #15965B !important;
  box-shadow: 0 0 0 2px rgba(21,150,91,.13) !important;
}
html[data-paper] body .topbar #accountBtn .account-chevron {
  width: 13px !important;
  height: 13px !important;
  color: #7386A2 !important;
}
@media (max-width: 760px) {
  html[data-paper] body .topbar #accountBtn {
    min-width: 0 !important;
    padding: 3px 8px 3px 5px !important;
  }
  html[data-paper] body .topbar #accountBtn .account-meta strong { font-size: 12px !important; }
  html[data-paper] body .topbar #accountBtn .account-meta small { font-size: 9px !important; }
}

/* 2026-10-20 · 账号姓名与登录状态改为并排，压缩卡片高度内的信息层级。 */
html[data-paper] body .topbar #accountBtn { min-width: 166px !important; }
html[data-paper] body .topbar #accountBtn .account-meta {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 7px !important;
  white-space: nowrap !important;
}
html[data-paper] body .topbar #accountBtn .account-meta strong {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}
html[data-paper] body .topbar #accountBtn .account-meta small {
  flex: 0 0 auto !important;
  align-self: center !important;
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  html[data-paper] body .topbar #accountBtn { min-width: 0 !important; }
  html[data-paper] body .topbar #accountBtn .account-meta { gap: 5px !important; }
}

/* 2026-10-20 · 顶栏快捷退出与时间卡：复用原退出流程，并提升时钟的识别层级。 */
html[data-paper] body .topbar #topLogoutBtn {
  display: none !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 10px !important;
  gap: 6px !important;
  border: 1px solid #E6D6D3 !important;
  border-radius: 10px !important;
  background: #FFFCFB !important;
  color: #9A5148 !important;
  box-shadow: 0 1px 3px rgba(121,61,52,.06) !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}
html[data-paper] body .topbar #accountBtn:not([style*="none"]) + #topLogoutBtn {
  display: inline-flex !important;
}
html[data-paper] body .topbar #topLogoutBtn:hover {
  border-color: #D6AAA4 !important;
  background: #FFF4F2 !important;
  color: #883E36 !important;
  box-shadow: 0 3px 8px rgba(121,61,52,.12) !important;
}
html[data-paper] body .topbar .clock {
  height: 40px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 3px 10px 3px 6px !important;
  border: 1px solid #DCE5F1 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg,#F7FAFF 0%,#FFFFFF 85%) !important;
  box-shadow: 0 1px 4px rgba(37,66,109,.06) !important;
  text-align: left !important;
  line-height: 1.1 !important;
}
html[data-paper] body .topbar .clock-icon {
  width: 25px !important;
  height: 25px !important;
  display: inline-flex !important;
  flex: 0 0 25px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #DFE9FA !important;
  border-radius: 8px !important;
  background: #EDF3FF !important;
  color: #436FB9 !important;
}
html[data-paper] body .topbar .clock-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 2px !important;
}
html[data-paper] body .topbar .clock .t {
  color: #203A61 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .035em !important;
  line-height: 15px !important;
  font-variant-numeric: tabular-nums !important;
}
html[data-paper] body .topbar .clock .d {
  color: #75839A !important;
  font-size: 9px !important;
  letter-spacing: .025em !important;
  line-height: 11px !important;
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  html[data-paper] body .topbar #topLogoutBtn { padding: 0 7px !important; }
  html[data-paper] body .topbar #topLogoutBtn span { display: none !important; }
}

/* 2026-10-20 · 提高日期可读性，并移除班次卡中重复的小标题。 */
html[data-paper] body .topbar .clock .d {
  color: #536782 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: .02em !important;
  line-height: 12px !important;
}
html[data-paper] body .topbar #shiftPill { grid-template-rows: 1fr !important; }
html[data-paper] body .topbar #shiftPill::before,
html[data-paper] body .topbar #shiftPill b,
html[data-paper] body .topbar #shiftPill .shift-cnt,
html[data-paper] body .topbar #shiftPill .sh-arrow {
  grid-row: 1 !important;
  align-self: center !important;
}
html[data-paper] body .topbar #shiftPill .lbl { display: none !important; }

/* 2026-10-20 · 提高班次名称与在岗人数的前景/背景对比度。 */
html[data-paper] body .topbar #shiftPill {
  border-color: #A9CEB7 !important;
  background: linear-gradient(135deg,#EEF8F1 0%,#FFFFFF 88%) !important;
  box-shadow: 0 2px 7px rgba(28,91,58,.1) !important;
}
html[data-paper] body .topbar #shiftPill::before {
  background: #16804A !important;
  box-shadow: 0 0 0 5px #D9F0E0, 0 0 0 6px #A8D4B8 !important;
}
html[data-paper] body .topbar #shiftPill b {
  color: #14532D !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}
html[data-paper] body .topbar #shiftPill .shift-cnt {
  border-color: #A9D1B7 !important;
  background: #DFF2E5 !important;
  color: #0E5A35 !important;
  font-weight: 850 !important;
}
html[data-paper] body .topbar #shiftPill .shift-cnt::before,
html[data-paper] body .topbar #shiftPill .shift-cnt::after {
  color: #245E3D !important;
  font-weight: 750 !important;
}
html[data-paper] body .topbar #shiftPill .sh-arrow { color: #526D5C !important; }

/* 2026-10-20 · 撤销看板整体左内边距；只让顶部标题栏与侧导航之间留出小缝。 */
html[data-paper] body:has(#view .board-panel) .topbar {
  margin-left: 8px !important;
}
@media (max-width:760px) {
  html[data-paper] body:has(#view .board-panel) .topbar { margin-left: 5px !important; }
}


/* 2026-10-22 订单中心对齐复核：板号与工序左对齐；类别居中；订单操作固定起点。 */
#view .oc-live-table thead th.oc-col-board,#view .oc-live-table thead th.oc-col-category,#view .oc-live-table thead th.oc-col-station{ text-align:left; padding-left:16px }
#view .oc-live-table tbody td.oc-col-board,#view .oc-live-table tbody td.oc-col-category,#view .oc-live-table tbody td.oc-col-station{ text-align:left!important; padding-left:16px; padding-right:8px }
#view .oc-live-table tbody td.oc-col-board .board-cell{ justify-content:flex-start!important; width:max-content!important; max-width:100%; margin:0 auto 0 0!important }
#view .oc-live-table tbody td.oc-col-category,#view .oc-live-table tbody td.oc-col-station{ white-space:nowrap }
#view .oc-live-table tbody td.oc-col-category .badge,#view .oc-live-table tbody td.oc-col-category .flag,#view .oc-live-table tbody td.oc-col-station .badge{ margin:0 5px 0 0!important; vertical-align:middle }
#view .oc-live-table .oc-col-order{ padding-left:12px; padding-right:10px }
#view .oc-live-table .oc-order-line{ display:grid; grid-template-columns:92px minmax(0,1fr); align-items:center; gap:5px; min-width:0; width:100% }
#view .oc-live-table .oc-order-line>b{ display:block; min-width:0; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:800; color:#173B60; font-variant-numeric:tabular-nums }
#view .oc-live-table .oc-order-actions{ display:flex; align-items:center; justify-content:flex-start; gap:4px; min-width:0; white-space:nowrap }
#view .oc-live-table .oc-order-actions .oc-ship-btn,#view .oc-live-table .oc-order-actions .oc-preship-btn,#view .oc-live-table .oc-order-actions .oc-preship-badge{ height:20px; margin:0; padding:0 7px; border-radius:5px; font-size:10px; line-height:18px }
#view .oc-live-table .oc-order-actions .oc-trace-btn{ display:inline-flex; flex:0 0 18px; align-items:center; justify-content:center; width:18px; height:18px; margin:0; border-radius:5px; background:#F1F6FC; color:#57799A }
#view .oc-live-table .oc-order-actions .oc-trace-btn:hover{ background:#E3EEF9; color:#155A96 }
@media(max-width:1100px){#view .oc-live-table tbody td.oc-col-board,#view .oc-live-table tbody td.oc-col-category,#view .oc-live-table tbody td.oc-col-station{padding-left:10px;padding-right:6px}#view .oc-live-table .oc-order-line{grid-template-columns:84px minmax(0,1fr);gap:4px}#view .oc-live-table .oc-order-actions{gap:3px}}

/* 2026-10-22 订单中心对齐微调：预发货跟在追溯后；多板号首项沿用普通板号标签；类别居中。 */
#view .oc-live-table thead th.oc-col-category{ text-align:center; padding-left:0 }
#view .oc-live-table tbody td.oc-col-category{ text-align:center!important; padding-left:8px; padding-right:8px }
#view .oc-live-table tbody td.oc-col-category .badge,#view .oc-live-table tbody td.oc-col-category .flag{ margin-left:2px!important; margin-right:2px!important }
#view .oc-live-table tbody td.oc-col-board .board-cell.has-more{ display:flex!important; align-items:center!important; justify-content:flex-start!important; width:max-content!important; max-width:100%; margin:0 auto 0 0!important; gap:6px }
#view .oc-live-table tbody td.oc-col-board .board-cell.has-more .board-text{ display:inline-flex; align-items:center; box-sizing:border-box; flex:0 1 auto; min-width:0; max-width:100%; padding:3px 8px; border:1px solid #DCE6F0; border-radius:6px; background:#F5F8FC; color:#29445F; font-size:11px; font-weight:650; line-height:1.25; font-variant-numeric:tabular-nums; cursor:pointer }
#view .oc-live-table .oc-order-actions .oc-ship-btn{ order:1 }
#view .oc-live-table .oc-order-actions .oc-trace-btn{ order:2 }
#view .oc-live-table .oc-order-actions .oc-preship-btn,#view .oc-live-table .oc-order-actions .oc-preship-badge{ order:3 }

/* 2026-10-22 返工处理：列表填充视口下方剩余空间，记录多时在列表内滚动。 */
@media (min-width: 1100px) and (min-height: 700px) {
  html[data-paper] #view .rework-page {
    box-sizing: border-box;
    min-height: calc(100vh - 140px);
  }
  html[data-paper] #view #rework-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
  }
  html[data-paper] #view #rework-content .rework-table-wrap {
    flex: 1 1 auto;
    min-height: 180px;
    max-height: none !important;
  }
}

/* ★ 2026-10-24 分装第 2 步：用行号和行线组成规整、紧凑的引物编号粘贴清单。 */
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-primer-layout { align-items: start !important; gap: 14px !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-primer-entry {
  box-sizing: border-box; display: flex !important; align-self: start; flex-direction: column;
  min-width: 0; min-height: 0 !important; height: auto !important; padding: 14px !important;
  border: 1px solid #cbdbea !important; border-radius: 11px !important;
  background: linear-gradient(155deg, #f8fbff 0%, #f1f6fb 100%) !important;
  box-shadow: 0 4px 13px rgba(32, 74, 112, .06);
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head { align-items: center !important; gap: 10px !important; margin: 0 0 11px !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head > div { gap: 4px !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head b { color: #183d5e !important; font-size: 14px !important; line-height: 1.35; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head span { color: #657d93 !important; font-size: 11px !important; line-height: 1.45; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head strong {
  flex: none; min-width: 54px; box-sizing: border-box; padding: 5px 8px !important;
  border: 1px solid #c4d8e9 !important; border-radius: 6px !important; background: #fff !important;
  color: #1d659b !important; font-size: 11px !important; font-variant-numeric: tabular-nums; text-align: center;
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet {
  display: grid; grid-template-columns: 42px minmax(0, 1fr); width: 100%; height: 148px;
  box-sizing: border-box; overflow: hidden; border: 1px solid #b9cde0; border-radius: 8px;
  background: #fff; box-shadow: inset 0 1px 3px rgba(28, 67, 103, .05);
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-gutter {
  box-sizing: border-box; min-width: 0; overflow: hidden; padding: 8px 8px 8px 0;
  border-right: 1px solid #d9e4ee; background-color: #f3f7fb;
  background-image: linear-gradient(to bottom, transparent 27px, #e2eaf2 27px, #e2eaf2 28px);
  background-size: 100% 28px; background-position: 0 8px; background-repeat: repeat-y;
  color: #91a3b4; font: 11px/28px "Cascadia Code", Consolas, monospace;
  text-align: right; white-space: pre; user-select: none;
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet textarea {
  display: block; width: 100% !important; height: 100% !important; min-width: 0 !important;
  min-height: 0 !important; box-sizing: border-box; overflow: auto !important; margin: 0 !important;
  padding: 8px 12px !important; resize: none !important; border: 0 !important; border-radius: 0 !important;
  outline: none !important; background-color: #fff !important;
  background-image: linear-gradient(to bottom, transparent 27px, #e6edf4 27px, #e6edf4 28px) !important;
  background-size: 100% 28px !important; background-position: 0 8px !important; background-repeat: repeat-y !important;
  color: #193b58 !important; font: 600 13px/28px "Cascadia Code", Consolas, "Courier New", monospace !important;
  letter-spacing: .015em; white-space: pre !important; overflow-wrap: normal; box-shadow: none !important;
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet textarea::placeholder {
  color: #91a2b2 !important; font: 400 12px/28px "Segoe UI", "Microsoft YaHei", sans-serif !important; letter-spacing: 0;
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet textarea:focus { box-shadow: inset 0 0 0 2px rgba(49, 119, 171, .16) !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet textarea#v4PrimerInput { cursor: default !important; caret-color: #1769aa !important; user-select: text !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button { cursor: pointer !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 6px !important; margin: 10px 0 0 !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button {
  box-sizing: border-box; min-height: 40px !important; margin: 0 !important; padding: 8px 7px !important;
  border-radius: 7px !important; font-size: 11.5px !important; font-weight: 750 !important; line-height: 1.35;
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button:not(.secondary) {
  border-color: #1e68a2 !important; background: #1e68a2 !important; color: #fff !important; box-shadow: 0 2px 7px rgba(30, 104, 162, .15);
}
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button:not(.secondary):hover { border-color: #185582 !important; background: #185582 !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button.secondary { border-color: #cbd9e5 !important; background: #fff !important; color: #49657d !important; }
html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-hint { margin: 9px 0 0 !important; padding: 8px 1px 0 !important; border-top: 1px solid #dbe6ef; color: #647b90 !important; font-size: 10px !important; line-height: 1.4; }
@media (max-width: 1280px) { html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet { height: 142px; } }
@media (max-width: 600px) {
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-primer-entry { padding: 12px !important; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head { gap: 7px !important; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-entry-head span { font-size: 10px !important; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet { grid-template-columns: 36px minmax(0, 1fr); height: 132px; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-gutter { padding-right: 6px; font-size: 10px; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-sheet textarea { padding-right: 8px !important; padding-left: 9px !important; font-size: 12px !important; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions { gap: 6px !important; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button:last-child { grid-column: 1 / -1; }
  html[data-paper] body #view #pdContent .v4.v5.v6 .v6-paste-actions button { padding-right: 9px !important; padding-left: 9px !important; font-size: 11px !important; }
}