/* P2-①-2 第 3 批断点归并（2026-10-01，收官批）：只动 @media 条件文本，规则体未改
     max-width 1100 → 1280
     max-width 1280 → （不变）
     max-width 1500 → 1440
     max-width 1279 → 1280
     min-width 1500 → 1440
     max-width 1400 → 1440
     max-width 1024 → 1280
     max-width 1300 → 1280
     max-width 1200 → 1280
     max-width 1240 → 1280
     max-width 1340 → 1280 */
/* ============================================================
   交付主题层 theme.css（2026-08-31 · 百力格生物）
   加载于 app.css / ops.css 之后，仅做覆盖与精修：
   1) 统一品牌色板（医药深蓝 var(--sk-accent-deep) + 亮蓝 #5e5e5e，青/蓝绿辅助）
   2) 侧边栏深色指挥舱化（深海军蓝渐变 + 发光选中态）
   3) 顶栏 / 按钮 / 面板 / 滚动条 / 弹窗 / 抽屉细节精修
   4) 登录页与主界面配色统一
   5) 门面 v3 Bento / 中间质检工具台 / 登录页 v2
   不改动任何布局尺寸与 DOM 结构，风险面最小。
   ============================================================ */

/* ---------- 1. 品牌变量精修 ---------- */
/* ★★ 2026-10-01 P2-①-1：本段是这九个老变量的**唯一来源**（app.css 里那份重复定义已删除）。
   与 tokens.css 的对应关系（后续 P2-③ 做深色主题时按这张表改一处即可）：
     --brand        ≈ --ui-brand-900      --brand-2     ≈ --ui-brand-600
     --brand-glow   → rgba(115,115,115, .20)（--ui-ring 的 0.16 是同族，未强合并）
     --grad         → 135deg, --ui-brand-600 → --ui-brand-900
     --bg-0/--bg-1  ≈ --ui-bg-page / 更深的页面底
     --line         ≈ --ui-line-200（原 rgba 写法保留，避免边框观感变化）
     --line-strong  → 深一档描边      --shadow → token 的 --ui-sh-2/3 同族
   ⚠ 本轮**只做去重**，不改这九个值本身 —— 值一变会影响全站边框与主色，属于另一批回归。 */
:root{
  --brand:var(--sk-accent-deep);
  --brand-2:var(--ui-brand-600);
  --brand-glow:rgba(115,115,115, .20);
  --grad:linear-gradient(135deg,var(--ui-brand-600),var(--sk-accent-deep));
  --bg-0:var(--ui-bg-page);
  --bg-1:var(--ui-line-200);
  --line:rgba(68,68,68, .12);
  --line-strong:rgba(68,68,68, .24);
  --shadow:0 1px 0 rgba(255,255,255,.85) inset,0 14px 38px -22px rgba(68,68,68, .30);
}

/* ---------- 2. 全局底色与文字渲染 ---------- */
body{
  background-image:
    radial-gradient(1100px 720px at 2% -10%, rgba(115,115,115, .09), transparent 52%),
    radial-gradient(1000px 760px at 104% -4%, rgba(12,154,184,.07), transparent 50%),
    linear-gradient(180deg,var(--ui-bg-page),var(--ui-line-200) 55%,var(--ui-bg-page));
}
::selection{background:rgba(115,115,115, .22)}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(68,68,68, .22);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:rgba(68,68,68, .38)}

/* ---------- 3. 侧边栏 · 深色指挥舱 ---------- */
.sidebar{
  background:linear-gradient(188deg,var(--ui-ink-900) 0%,var(--ui-ink-900) 48%,var(--ui-ink-900) 100%);
  border-right:1px solid rgba(179,179,179, .15);
  box-shadow:inset 1px 0 0 rgba(255,255,255,.04), 18px 0 44px -30px rgba(28,28,28, .60);
}
.brand h1{color:var(--ui-brand-050);text-shadow:0 1px 12px rgba(134,134,134, .25)}
.brand .sub{display:block;font-size:11px;color:var(--ui-ink-400);letter-spacing:1px;margin-top:2px;white-space:nowrap}
.brand{border-bottom:1px solid rgba(179,179,179, .14);padding-bottom:14px;margin-bottom:4px}
.logo{
  background:linear-gradient(135deg,var(--ui-brand-600),var(--sk-accent-deep));
  border:1px solid rgba(198,198,198, .38);
  box-shadow:0 10px 26px -8px rgba(115,115,115, .65), inset 0 1px 0 rgba(255,255,255,.28);
}
.nav-group .gt{color:var(--ui-ink-500);letter-spacing:2.6px}
.nav-item{color:var(--ui-ink-300)}
.nav-item svg{opacity:.9}
.nav-item:hover{background:rgba(198,198,198, .10);color:var(--ui-brand-050)}
.nav-item.active{
  background:linear-gradient(90deg,rgba(115,115,115, .36),rgba(115,115,115, .12));
  color:#FFFFFF;border-color:rgba(198,198,198, .32);
  box-shadow:0 8px 22px -12px rgba(115,115,115, .60), inset 0 1px 0 rgba(255,255,255,.08);
}
.nav-item.active::before{
  background:linear-gradient(180deg,#c6c6c6,var(--ui-brand-600));
  box-shadow:0 0 12px rgba(198,198,198, .85);
}
/* 对标参考平台：导航实时徽标（工序待上机=蓝 / 偏高=橙 / 很高=红 / 待办待处理=红） */
.nav-item .nav-badge{
  margin-left:auto;min-width:20px;height:18px;padding:0 6px;border-radius:999px;
  background:rgba(220,38,38,.94);color:#fff;font-size:11px;font-weight:800;line-height:18px;
  text-align:center;letter-spacing:0;font-variant-numeric:tabular-nums;flex:none;
  box-shadow:0 2px 8px -2px rgba(220,38,38,.55);
}
.nav-item .nav-badge.is-total{
  background:rgba(115,115,115, .92);
  box-shadow:0 2px 8px -2px rgba(115,115,115, .55);
}
/* ★ 2026-10-03 角标数值分级（沿用系统既有色，不新增颜色）：
   低（≤20）＝上面的蓝 #5e5e5e · 偏高（21~100）＝这里的橙 #EA580C · 很高（>100）＝基色红 #E04553。
   阈值与判定写在 app.js refreshNavBadges() 的 LV_MID / LV_HIGH 常量处。 */
.nav-item .nav-badge.is-warn{
  background:rgba(217,119,6,.94);
  box-shadow:0 2px 8px -2px rgba(217,119,6,.55);
}
.nav-item:hover .nav-badge.is-warn{
  box-shadow:0 2px 10px -2px rgba(217,119,6,.75);
}
.side-foot{border-top:1px solid rgba(179,179,179, .15)}
.conn{color:var(--ui-ink-300)}
.conn .dot.demo{box-shadow:0 0 10px rgba(217,119,6,.7)}
.sidebar .btn-ghost{
  color:var(--ui-brand-100);background:rgba(198,198,198, .12);border-color:rgba(198,198,198, .30);
}
.sidebar .btn-ghost:hover{
  background:rgba(198,198,198, .22);color:#fff;
  box-shadow:0 0 18px rgba(115,115,115, .38);
}
nav{scrollbar-color:rgba(198,198,198, .28) transparent}
nav::-webkit-scrollbar-thumb{background:rgba(198,198,198, .26)}
nav::-webkit-scrollbar-thumb:hover{background:rgba(198,198,198, .42)}

/* ---------- 4. 顶栏 ---------- */
.topbar{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.86));
  border-bottom:1px solid rgba(68,68,68, .10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 10px 30px -24px rgba(68,68,68, .38);
}
.crumb .mt{font-size:16px;letter-spacing:.5px}
.crumb .ms{color:var(--ui-ink-400)}
.clock .t{color:var(--brand)}
.tbtn{
  background:var(--ui-bg-card);border-color:rgba(68,68,68, .15);
  box-shadow:0 2px 8px -4px rgba(68,68,68, .20);
}
.tbtn:hover{
  transform:translateY(-1px);color:var(--brand);
  border-color:rgba(115,115,115, .45);
  box-shadow:0 7px 18px -9px rgba(68,68,68, .35);
}
.tbtn.primary{
  background:linear-gradient(135deg,var(--ui-brand-600),var(--sk-accent-deep));
  box-shadow:0 8px 20px -8px rgba(115,115,115, .55);
}

/* ---------- 5. 面板 / 卡片 / 按钮 ---------- */
.panel{box-shadow:var(--shadow)}
.btn-primary{
  background:linear-gradient(135deg,var(--ui-brand-600),var(--sk-accent-deep));
  border-color:transparent;
  box-shadow:0 8px 20px -10px rgba(115,115,115, .55);
}
.btn-primary:hover{box-shadow:0 12px 26px -10px rgba(115,115,115, .65)}
.export-btn-csv{background:linear-gradient(135deg,var(--ui-brand-600),var(--sk-accent-deep))}

/* ---------- 6. 弹窗 / 抽屉 / 气泡 ---------- */
.modal{border-radius:16px;box-shadow:0 40px 90px -32px rgba(28,28,28, .55)}
.drawer-panel{box-shadow:-26px 0 64px -32px rgba(28,28,28, .48)}
.toast-wrap .toast{box-shadow:0 18px 44px -18px rgba(28,28,28, .42)}

/* ---------- 7. 登录页与主界面统一 ---------- */
.fosun-mark{
  background:linear-gradient(145deg,var(--sk-accent-deep),var(--ui-brand-600));
  box-shadow:0 9px 22px -7px rgba(115,115,115, .75), inset 0 0 0 1px rgba(255,255,255,.18);
}
.auth-btn{
  background:linear-gradient(135deg,var(--sk-accent-deep),var(--ui-brand-600) 55%,var(--ui-brand-500));
  box-shadow:0 14px 30px -10px rgba(115,115,115, .65);
}
.auth-input:focus-within{
  border-color:var(--ui-brand-600);
  box-shadow:0 0 0 4px rgba(115,115,115, .15);
}
.auth-input:focus-within svg{color:var(--ui-brand-600)}
.auth-foot a{color:var(--ui-brand-600)}
.auth-slogan b{color:var(--ui-brand-600)}
.auth-enc svg{color:var(--ui-brand-600)}

/* ---------- 8. 焦点可达性（交付检查项） ---------- */
.nav-item:focus-visible,
.tbtn:focus-visible,
.btn-ghost:focus-visible,
.btn-primary:focus-visible{
  outline:2px solid rgba(198,198,198, .75);
  outline-offset:2px;
}

/* ---------- 9. 48h 流转停滞提醒条 ---------- */
.ov-stuckbar{
  display:flex;align-items:center;gap:14px;margin:0 0 14px;padding:14px 18px;border-radius:14px;
  background:linear-gradient(90deg,var(--pl-pink-bg),var(--ui-danger-bg) 60%,var(--ui-danger-bg));
  border:1px solid rgba(220,38,38,.28);cursor:pointer;user-select:none;
  box-shadow:0 8px 22px -14px rgba(179,32,46,.35);
}
.ov-stuckbar:hover{border-color:rgba(220,38,38,.5);box-shadow:0 10px 26px -12px rgba(179,32,46,.45)}
.ov-stuck-ico{
  width:38px;height:38px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--ui-danger-solid),var(--ui-danger-ink));color:#fff;font-size:16px;
  box-shadow:0 6px 16px -6px rgba(179,32,46,.6);
}
.ov-stuck-main{flex:1;min-width:0}
.ov-stuck-main b{display:block;font-size:14px;font-weight:800;color:var(--ui-ink-700);letter-spacing:.4px}
.ov-stuck-main span{font-size:12px;color:var(--pl-pink-ink)}
.ov-stuck-act{flex:none;font-size:12px;font-weight:700;color:var(--ui-danger-ink)}
.ov-stucklist{
  margin:-6px 0 14px;padding:6px 14px;border-radius:12px;max-height:320px;overflow:auto;
  background:var(--ui-bg-card);border:1px solid rgba(220,38,38,.18);
}
.ov-stuck-row{
  display:flex;align-items:center;gap:12px;padding:8px 4px;font-size:12px;
  border-bottom:1px dashed rgba(68,68,68, .08);
}
.ov-stuck-row:last-child{border-bottom:none}
.ov-stuck-od{font-weight:800;color:var(--brand);min-width:110px}
.ov-stuck-cust{flex:1;color:var(--txt-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov-stuck-h{flex:none;font-weight:700;color:var(--ui-danger-ink);font-variant-numeric:tabular-nums}

/* ---------- 10. 返工分类维护弹窗 ---------- */
.rw-categ-table{width:100%;border-collapse:collapse;font-size:13px}
.rw-categ-table th{padding:8px 10px;background:rgba(68,68,68, .06);color:var(--txt-2);font-weight:700;text-align:left;border-bottom:1px solid var(--line)}
.rw-categ-table td{padding:8px 10px;border-bottom:1px dashed rgba(68,68,68, .08);color:var(--txt)}
.rw-categ-add{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;align-items:center}
.rw-categ-add select,.rw-categ-add input{
  padding:8px 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--ui-bg-card);
  font-size:13px;color:var(--txt);outline:none;
}
.rw-categ-add input{flex:1;min-width:140px}
.rw-categ-add input:focus,.rw-categ-add select:focus{border-color:var(--ui-brand-600);box-shadow:0 0 0 3px rgba(115,115,115, .12)}
.ov-b.ov-b-green{background:rgba(10,112,67,.12);color:var(--ui-ok-solid);border:1px solid rgba(10,112,67,.35)}
.ov-b.ov-b-gray{background:rgba(118,118,118, .12);color:var(--sk-ink-2);border:1px solid rgba(118,118,118, .3)}

/* ════════════════════════════════════════════════════════════
   生产总览 · 门面精修（告警分级 / KPI 仪表化 / 面板韵律）
   ════════════════════════════════════════════════════════════ */
.ov-stuckbar{
  background:var(--ui-bg-card)!important;
  border:1px solid rgba(220,38,38,.22)!important;
  border-left:4px solid var(--ui-danger-solid)!important;
  border-radius:12px!important;
  padding:10px 16px!important;
  box-shadow:0 6px 18px -14px rgba(179,32,46,.4)!important;
}
.ov-stuckbar:hover{border-color:rgba(220,38,38,.45)!important;box-shadow:0 8px 22px -12px rgba(179,32,46,.45)!important}
.ov-stuck-ico{
  width:32px!important;height:32px!important;border-radius:8px!important;font-size:14px!important;
  box-shadow:0 4px 12px -6px rgba(179,32,46,.55)!important;
}
.ov-stuck-main b{font-size:13px!important}
.ov-stuck-main span{font-size:12px!important}
.bp-alert{border-radius:12px!important;padding:12px 18px!important}
.bp-alert .bp-alert-go{white-space:nowrap}
.bp-kpi{padding:16px 20px!important;border-radius:14px!important;gap:14px!important;border-top:3px solid transparent!important;transition:transform .18s,box-shadow .18s,border-color .18s!important}
.bp-kpi:hover{transform:translateY(-2px)!important;box-shadow:0 16px 36px -20px rgba(68,68,68, .45)!important}
.bp-kpi:nth-child(1){border-top-color:var(--ui-brand-600)!important}
.bp-kpi:nth-child(2){border-top-color:var(--ui-danger-solid)!important}
.bp-kpi:nth-child(3){border-top-color:var(--pl-cyan)!important}
.bp-kpi:nth-child(4){border-top-color:var(--ui-ok-solid)!important}
.bp-kpi .bp-kpi-ico{width:42px!important;height:42px!important;border-radius:10px!important}
.bp-kpi-val b{font-size:32px!important;letter-spacing:-.6px!important}
.bp-kpi-label{font-size:12px!important;letter-spacing:.3px!important}
.bp-kpi-sub{font-size:11px!important}
.bp-home{gap:12px!important}
.bp-row{gap:12px!important}
.bp-col-8,.bp-col-4,.bp-col-7,.bp-col-5{gap:12px!important}
.bp-card{padding:16px 18px 16px!important;border-radius:14px!important}
.bp-card-h{padding-bottom:10px!important;margin-bottom:12px!important;border-bottom:1px solid rgba(68,68,68, .08)!important}
.bp-card-h h3{font-size:14px!important;letter-spacing:.2px!important}
.bp-card-en{font-size:11px!important;letter-spacing:1.6px!important}
.bp-chart{min-height:252px!important}
.bp-card .bpcComposition{max-width:430px;margin:0 auto}
.bp-card .bpcDevices{min-height:220px}
.bp-rank-row{padding:6px 0!important;gap:10px!important}
.bp-rank-i{font-weight:800!important}
.bp-card ::-webkit-scrollbar{width:6px;height:6px}

/* ════════════════════════════════════════════════════════════
   生产总览 · 门面 v3 · Bento 瓷砖全新布局
   ════════════════════════════════════════════════════════════ */
.bp-home.ov3{gap:10px!important}
.ov3-kpis{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:10px!important}
.ov3-kpis .bp-kpi{
  flex-direction:column!important;align-items:flex-start!important;gap:4px!important;
  padding:16px 18px 18px!important;border:none!important;border-radius:16px!important;
  background:var(--ui-bg-card)!important;
  box-shadow:0 1px 2px rgba(28,28,28, .05),0 12px 32px -22px rgba(28,28,28, .28)!important;
}
.ov3-kpis .bp-kpi-ico{display:none!important}
.ov3-kpis .bp-kpi::after{content:"";position:absolute;left:18px;bottom:0;width:46px;height:4px;border-radius:4px 4px 0 0;background:var(--ui-brand-600)}
.ov3-kpis .bp-kpi:nth-child(2)::after{background:var(--ui-danger-solid)}
.ov3-kpis .bp-kpi:nth-child(3)::after{background:var(--pl-cyan)}
.ov3-kpis .bp-kpi:nth-child(4)::after{background:var(--ui-ok-solid)}
.ov3-kpis .bp-kpi-val b{font-size:40px!important;letter-spacing:-.8px!important}
.ov3-kpis .bp-kpi-label{font-size:12px!important;font-weight:800!important;color:var(--txt-2)!important}
.ov3-kpis .bp-kpi-sub{font-size:11px!important;margin-top:2px!important}
.ov3-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px}
.ov3-card{
  background:var(--ui-bg-card);border:none;border-radius:16px;padding:14px 16px 16px;
  box-shadow:0 1px 2px rgba(28,28,28, .05),0 14px 36px -26px rgba(28,28,28, .30);
  display:flex;flex-direction:column;min-width:0;min-height:0;
}
.ov3-h{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex:none}
.ov3-h i{width:4px;height:16px;border-radius:4px;background:var(--grad);flex:none}
.ov3-h h3{margin:0;font-size:14px;font-weight:800;color:var(--txt);letter-spacing:.2px}
.ov3-h span{margin-left:auto;font-size:11px;font-weight:800;letter-spacing:1.6px;color:var(--ui-ink-300)}
.ov3-b{flex:1;min-width:0;min-height:0}
/* ★ 2026-09-29 第三十八轮：上面两张并排的图（近 N 日订单趋势 / 交付达成）画的是同一份每日条数，
   用户要求「两张卡改成各占一半」—— 两卡跨度 8+4 改成 6+6，横向密度也一致，左右可以直接比。 */
.ov3-card.c-t7{grid-column:span 6}
.ov3-card.c-comp{grid-column:span 4}
.ov3-card.c-load,.ov3-card.c-dur,.ov3-card.c-risk,
.ov3-card.c-todo,.ov3-card.c-qc,.ov3-card.c-dev{grid-column:span 4}
.ov3-card.c-work{grid-column:span 7}
.ov3-card.c-due{grid-column:span 5}
.ov3-card.c-t30{grid-column:span 12}
@media (max-width:1280px){
  .ov3-grid{grid-template-columns:repeat(2,1fr)}
  .ov3-card{grid-column:span 1!important}
  .ov3-card.c-t30{grid-column:span 2!important}
}
.ov3-h320{height:320px}
.ov3-h280{height:280px}
.ov3-h250{height:250px}
.ov3-card.c-risk .ov3-b,
.ov3-card.c-todo .ov3-b{max-height:260px;overflow:auto}

/* ════════════════════════════════════════════════════════════
   中间质检查询 · 工具台精修
   ════════════════════════════════════════════════════════════ */
.mqx-wrap{gap:10px!important;padding-bottom:16px!important}
.mqx-hero{
  border-radius:14px!important;
  background:linear-gradient(120deg,var(--ui-ink-900) 0%,var(--sk-accent-deep) 58%,var(--ui-brand-600) 130%)!important;
  box-shadow:0 18px 44px -26px rgba(28,28,28, .65)!important;
}
.mqx-hero-orb,.mqx-hero-grid{display:none!important}
.mqx-hero-in{
  flex-direction:row!important;align-items:center!important;gap:16px!important;
  padding:12px 18px!important;flex-wrap:wrap!important;
}
.mqx-brand{gap:12px!important;flex:none}
.mqx-logo{width:36px!important;height:36px!important;border-radius:10px!important;font-size:16px!important;box-shadow:none!important}
.mqx-brand-txt h1{font-size:16px!important;text-shadow:none!important;letter-spacing:.3px!important}
.mqx-brand-txt p{font-size:11px!important;margin:2px 0 4px!important;letter-spacing:.8px!important}
.mqx-indexchip{padding:2px 10px!important;font-size:11px!important;gap:6px!important}
.mqx-search{flex:1!important;min-width:300px;flex-direction:row!important;align-items:center!important;gap:10px!important}
.mqx-search-box{flex:1!important;padding:4px 6px 4px 14px!important;border-radius:10px!important;box-shadow:0 6px 18px -10px rgba(0,0,0,.5)!important}
.mqx-search-box input{font-size:13px!important}
.mqx-searchbtn{height:36px!important;padding:0 18px!important;font-size:13px!important;border-radius:8px!important;letter-spacing:.5px!important;flex:none}
.mqx-btools{padding:8px 12px!important;border-radius:12px!important;gap:8px!important}
.mqx-btab{padding:6px 12px!important;font-size:11px!important;border-radius:999px!important}
.mqx-src-cards{gap:8px!important}
.mqx-src-card{padding:8px 12px!important;border-radius:10px!important}
#view .q-grid{gap:10px!important}
#view .q-card{border-radius:12px!important;box-shadow:0 1px 2px rgba(28,28,28, .05),0 10px 28px -24px rgba(28,28,28, .30)!important}
#view .q-card-head{padding:10px 14px!important}
/* 切图/换页防滚动锚定跳动 */
.mqx-wrap,.mqx-wrap *{overflow-anchor:none}

/* ════════════════════════════════════════════════════════════
   登录页 v2 · 沉浸式分栏 + 表单精修
   ════════════════════════════════════════════════════════════ */
.auth-bg{background:linear-gradient(160deg,var(--ui-line-200) 0%,var(--ui-line-100) 45%,var(--ui-line-100) 100%)!important}
.auth-split{border-radius:20px!important;box-shadow:0 50px 120px -40px rgba(68,68,68, .5),0 0 0 1px rgba(255,255,255,.65) inset!important}
.auth-left{background:var(--ui-ink-900)!important}
.auth-left-bg img{filter:saturate(1.05) brightness(1.02)}
.auth-left-veil{background:linear-gradient(180deg,rgba(28,28,28, .5) 0%,rgba(28,28,28, .12) 30%,rgba(28,28,28, .2) 55%,rgba(0,0,0,.86) 88%,rgba(0,0,0,.97) 100%)!important}
.auth-left-content{padding:0 44px 52px!important}
.auth-left-mark{width:52px!important;height:52px!important;border-radius:14px!important}
.auth-left-mark svg{width:34px!important;height:34px!important}
.auth-left-name{font-size:32px!important;font-weight:900!important;letter-spacing:2px!important;margin-bottom:10px!important}
.auth-left-name::after{display:none!important}
.auth-left-dept{font-size:13px!important;letter-spacing:2.5px!important;color:var(--pl-cyan-line)!important;margin-bottom:18px!important}
.auth-left-slogan{font-size:13px!important;color:rgba(242,242,242, .85)!important;border-left:2px solid rgba(198,198,198, .55)!important;padding-left:12px!important}
.auth-left-slogan b{letter-spacing:3px!important}
.auth-top-badge{font-size:11px!important;padding:6px 14px!important}
.auth-right{padding:44px 48px!important}
.auth-brand{margin-bottom:18px!important}
.fosun-mark{width:44px!important;height:44px!important;border-radius:12px!important}
.fosun-mark svg{width:25px!important;height:25px!important}
.auth-name{font-size:16px!important;letter-spacing:1px!important}
.auth-dept{font-size:11px!important}
.auth-right h1{font-size:24px!important;margin:10px 0 6px!important;letter-spacing:1px!important}
.auth-right .sub{font-size:12px!important;margin-bottom:22px!important}
.auth-err{font-size:12px!important}
.auth-fld label{font-size:12px!important;color:var(--ui-ink-500)!important;margin-bottom:8px!important}
.auth-input{height:50px!important;border-radius:12px!important;background:var(--ui-bg-soft)!important;border:1.5px solid var(--ui-line-200)!important;transition:border-color .18s,box-shadow .18s,background .18s!important}
.auth-input input{font-size:14px!important}
.auth-input:focus-within{background:var(--ui-bg-card)!important;border-color:var(--ui-brand-600)!important;box-shadow:0 0 0 4px rgba(115,115,115, .13),0 8px 22px -14px rgba(115,115,115, .4)!important}
.auth-btn{height:50px!important;border-radius:12px!important;font-size:14px!important;letter-spacing:6px!important;background:linear-gradient(135deg,var(--sk-accent-deep),var(--ui-brand-600) 60%,var(--ui-brand-500))!important;box-shadow:0 16px 34px -12px rgba(115,115,115, .65)!important;margin-top:10px!important}
.auth-btn:hover{transform:translateY(-2px)!important;box-shadow:0 22px 44px -12px rgba(115,115,115, .75)!important}
.auth-foot{margin-top:18px!important}
.auth-enc{margin-top:16px!important;padding:8px 12px!important;border-radius:8px!important;background:var(--ui-bg-soft)!important;font-size:11px!important}
.auth-slogan{margin-top:14px!important;padding-top:12px!important;border-top:1px dashed var(--ui-line-100)!important;font-size:11px!important;color:var(--ui-ink-300)!important}
.auth-right-close{background:var(--ui-brand-100)!important}

/* ═══════════════════════════════════════════════════════════
   ★ 2026-09-05 视觉升级层 v3 —— 设计令牌 + 全局外壳精修
   （本层位于加载链末位，同等特异性下优先生效）
   ═══════════════════════════════════════════════════════════ */
:root{
  --shadow-card:0 1px 2px rgba(68,68,68, .05),0 6px 22px rgba(68,68,68, .07);
  --shadow-hover:0 10px 30px rgba(68,68,68, .15);
  --radius-lg:16px;
  --line-soft:rgba(68,68,68, .09);
}
html{scroll-behavior:smooth}
/* 全局滚动条精修 */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(68,68,68, .20);border-radius:8px;border:2.5px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(68,68,68, .36);background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}
::selection{background:rgba(115,115,115, .18)}

/* ── 侧栏：深邃夜蓝渐变 + 品牌光晕 + 导航微交互 ── */
.sidebar{
  background:linear-gradient(175deg,var(--ui-brand-900) 0%,var(--ui-brand-900) 48%,var(--ui-brand-700) 100%);
  box-shadow:4px 0 28px rgba(28,28,28, .35);
}
.sidebar::before{
  content:'';position:absolute;top:-60px;left:-40px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,rgba(134,134,134, .22),transparent 65%);pointer-events:none;
}
.sidebar .brand h1{letter-spacing:.5px}
.nav-group .gt{color:rgba(198,198,198, .52);font-size:11px;font-weight:800;letter-spacing:2.4px;margin:14px 16px 6px;text-transform:uppercase}
.nav-item{
  border-radius:10px;margin:2px 10px;transition:background .18s,transform .18s,box-shadow .18s;
  position:relative;overflow:hidden;
}
.nav-item::after{
  content:'';position:absolute;left:0;top:50%;transform:translateY(-50%) scaleY(0);
  width:3px;height:60%;border-radius:0 4px 4px 0;background:#c6c6c6;transition:transform .2s;
}
.nav-item:hover{background:rgba(255,255,255,.075);transform:translateX(2px)}
.nav-item:hover::after{transform:translateY(-50%) scaleY(1)}
.nav-item.active{
  background:linear-gradient(92deg,rgba(134,134,134, .30),rgba(134,134,134, .08) 80%);
  box-shadow:inset 0 0 0 1px rgba(198,198,198, .22),0 4px 16px rgba(115,115,115, .28);
}
.nav-item.active::after{transform:translateY(-50%) scaleY(1);height:72%}
.nav-badge{box-shadow:0 2px 8px rgba(220,38,38,.45)}

/* ── 顶栏：玻璃拟态 + 悬浮微抬 ── */
.topbar{
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(1.4) blur(14px);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid rgba(68,68,68, .10);
  box-shadow:0 1px 14px rgba(68,68,68, .06);
}
.tbtn{transition:transform .16s,box-shadow .16s,background .16s}
.tbtn:hover{transform:translateY(-1.5px);box-shadow:0 4px 14px rgba(68,68,68, .13)}

/* ── 主视图与面板卡片：统一圆角阴影体系 ── */
#view>.panel,.panel{
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  border:1px solid var(--line-soft);
}
.modal{
  border-radius:16px;
  box-shadow:0 28px 80px rgba(68,68,68, .30),0 4px 18px rgba(68,68,68, .14);
}
/* 表格通用（app.css 侧）行悬停 */
table tbody tr{transition:background .14s}

/* ── 全局按钮质感 ── */
.btn-primary,.auth-btn{
  background:linear-gradient(135deg,var(--ui-brand-600),var(--ui-brand-700)) !important;
  box-shadow:0 3px 12px rgba(86,86,86, .32);
  transition:transform .16s,box-shadow .16s,filter .16s;
}
.btn-primary:hover,.auth-btn:hover{transform:translateY(-1.5px);box-shadow:0 6px 20px rgba(86,86,86, .40);filter:brightness(1.06)}
.btn-primary:active,.auth-btn:active{transform:translateY(0)}

/* ================= ★ 2026-09-26 生产概览精修层（卡片 / KPI / 图表容器 / 表格统一语言） =================
   方向：白瓷砖 + 发丝边 + 柔和投影；数字一律等宽；颜色只表达状态（红=延期、绿=正常、蓝=主色）。
   卡头右侧新增 .ov3-meta「本卡口径」小注、图下新增 .ov3-foot 口径脚注——每张图说的口径都写在脸上。 */
.ov3-card{border:1px solid rgba(28,28,28, .075);border-radius:16px;padding:14px 16px;box-shadow:0 1px 2px rgba(28,28,28, .04),0 10px 26px -22px rgba(28,28,28, .35);transition:box-shadow .18s ease,transform .18s ease}
.ov3-card:hover{transform:translateY(-1px);box-shadow:0 2px 5px rgba(28,28,28, .05),0 18px 40px -26px rgba(28,28,28, .45)}
.ov3-h{margin-bottom:10px;gap:8px;align-items:center}
.ov3-h i{width:3px;height:14px;border-radius:4px}
.ov3-h h3{font-size:13px;font-weight:800;color:var(--txt);letter-spacing:0}
/* 卡头图标徽标（替换原来那根 3px 竖条） */
.ov3-h .ov3-ico{width:22px;height:22px;flex:none;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border:1px solid var(--ui-brand-100);color:var(--ui-brand-700)}
.ov3-h .ov3-ico svg{width:13px;height:13px}
.ov3-card.c-risk .ov3-h .ov3-ico{background:linear-gradient(160deg,var(--ui-danger-bg),var(--ui-danger-bg));border-color:var(--ui-danger-line);color:var(--ui-danger-solid)}
.ov3-card.c-due .ov3-h .ov3-ico{background:linear-gradient(160deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:var(--ui-warn-line);color:var(--ui-warn-ink)}
.ov3-card.c-qc .ov3-h .ov3-ico{background:linear-gradient(160deg,var(--ui-bg-soft),var(--ui-ok-bg));border-color:var(--ui-ok-line);color:var(--ui-ok-solid)}
.ov3-h .ov3-en{font-size:11px;font-weight:800;letter-spacing:1.4px;color:var(--ui-ink-300);margin-left:8px;white-space:nowrap}
.ov3-h .ov3-meta{font-size:11px;font-weight:700;color:var(--sk-ink-2);background:var(--ui-bg-page);border:1px solid rgba(28,28,28, .07);border-radius:6px;padding:2px 8px;margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.ov3-b{position:relative;min-width:0}
.ov3-foot{margin-top:8px;font-size:11px;color:var(--ui-ink-400);line-height:1.5;letter-spacing:.01em}
.ov3-foot b{color:var(--ui-ink-500);font-weight:700;font-variant-numeric:tabular-nums}
.ov3-empty{display:flex;align-items:center;justify-content:center;min-height:120px;height:100%;color:var(--ui-ink-400);font-size:12px}
.ov3-note{font-size:11px;color:var(--ui-ink-400);line-height:1.6}
/* KPI 行：数字等宽、可点进详情、底部主色小条压细 */
.ov3-kpis .bp-kpi{cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.ov3-kpis .bp-kpi:hover{transform:translateY(-1px)}
.ov3-kpis .bp-kpi::after{height:3px;width:40px;border-radius:4px 4px 0 0}
.ov3-kpis .bp-kpi-val{display:flex;align-items:baseline;gap:6px}
.ov3-kpis .bp-kpi-val b{font-variant-numeric:tabular-nums;line-height:1.02}
.ov3-kpis .bp-kpi-unit{font-size:11px;font-weight:700;color:var(--ui-ink-400);letter-spacing:.02em}
.ov3-kpis .bp-kpi-sub{color:var(--ui-ink-400);line-height:1.5}
.ov3-kpis .bp-kpi-sub b{color:var(--sk-ink);font-weight:700;font-variant-numeric:tabular-nums}
/* KPI 迷你结构条：5px 高的构成条 + 一行口径说明 */
.ov-kstack{display:flex;height:5px;border-radius:4px;overflow:hidden;background:rgba(28,28,28, .07);margin-top:10px}
.ov-kstack i{height:100%;display:block}
.ov-kstack-cap{margin-top:6px;font-size:11px;color:var(--ui-ink-400);letter-spacing:.01em;font-variant-numeric:tabular-nums}
/* KPI 迷你折线（SVG）：最近 14 天真实走势 + 一行口径 */
.ov-spark-wrap{margin-top:8px}
.ov-spark{display:block;width:100%;height:30px;overflow:visible}
.ov-spark-wrap .ov-kstack-cap{margin-top:4px}
/* 顶部状态带（看板 hero）：关键数 + 口径版本 + 刷新控制 */
.ov-hero{margin-bottom:14px;padding:10px 14px;border-radius:12px;background:linear-gradient(180deg,var(--ui-brand-050),var(--ui-brand-050));border:1px solid rgba(198,198,198, .24);color:var(--txt-2);font-size:12px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ov-hero-k{color:var(--sk-ink-2);white-space:nowrap}
.ov-hero-k b{color:var(--ui-ink-900);font-weight:800;font-size:13px;font-variant-numeric:tabular-nums;margin-left:2px}
.ov-hero-tag{margin-left:4px;font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--ui-ink-500);background:var(--ui-brand-050);border:1px solid var(--ui-brand-100);border-radius:6px;padding:2px 8px}
.ov-st-row .bp-rank-v{color:var(--sk-ink-3)}
/* 图表容器高度：原来 320/280/250 混排，横向不齐 */
.ov3-h320{height:288px}
.ov3-h280{height:258px}
.ov3-h250{height:236px;flex:1 1 auto;min-height:220px}
/* 表格：发丝线行、数字右对齐等宽、无竖线 */
.ov3-card .bp-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;table-layout:fixed}
.ov3-card .bp-table th{font-size:11px;font-weight:700;color:var(--ui-ink-400);letter-spacing:.04em;padding:0 10px 8px;text-align:left;border-bottom:1px solid var(--ui-line-100);white-space:nowrap}
.ov3-card .bp-table td{padding:8px 10px;border-bottom:1px solid var(--ui-bg-page);color:var(--ui-ink-700);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov3-card .bp-table tbody tr:last-child td{border-bottom:0}
.ov3-card .bp-table tbody tr:hover td{background:var(--ui-bg-soft)}
.ov3-card .bp-table .num{text-align:right}
.bp-tbl-nm{font-weight:700;color:var(--ui-ink-700)}
.bp-tbl-bar{height:6px;border-radius:4px;background:rgba(28,28,28, .07);overflow:hidden;min-width:44px}
.bp-tbl-fill{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--sk-accent),var(--ui-brand-700))}
.bp-tbl-fill.tone-a{background:linear-gradient(90deg,var(--ui-ink-300),var(--pl-pink))}
.bp-tbl-fill.tone-c{background:linear-gradient(90deg,#c6c6c6,var(--ui-brand-500))}
.bp-tbl-tags{display:flex;flex-wrap:wrap;gap:4px}
.bp-tag{display:inline-flex;align-items:center;font-size:11px;font-weight:700;border-radius:6px;padding:2px 8px;background:var(--ui-bg-soft);color:var(--sk-ink-2);font-variant-numeric:tabular-nums}
.bp-tag.tone-a{background:var(--ui-danger-bg);color:var(--ui-danger-solid)}
.bp-tag.tone-c{background:var(--ui-warn-bg);color:var(--ui-warn-ink)}
/* ★ 2026-09-26 合作订单逾期豁免标签（灰蓝色，不做告警色，只作提示） */
.bp-tag.tone-q{background:var(--ui-line-100);color:var(--sk-ink-3);border:1px dashed var(--ui-line-200)}
/* Top 风险客户：名次 + 名称 + 比例条 + 计数 */
.bp-rank{list-style:none;margin:0;padding:0}
.bp-rank-row{display:grid;grid-template-columns:18px minmax(0,1fr) 72px 116px;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--ui-bg-page)}
/* ★ 2026-09-26 目检发现：只放 HTML 列表的卡片（在制工序分布 / 设备状态 / 质检空态）内容顶在上面，
   卡片下半截全空。列表行按卡片高度分摊，纯内容卡整体垂直居中。 */
.ov3-card.c-stage .bp-rank-row{padding:14px 0}
.ov3-card.c-stage .ov3-b{display:flex}
.ov3-card.c-stage .bp-rank{flex:1;display:flex;flex-direction:column;justify-content:space-around}
.ov3-card.c-dev .ov3-b,.ov3-card.c-qc .ov3-b{display:flex;flex-direction:column;justify-content:center}
.bp-rank-row:last-child{border-bottom:0}
.bp-rank-i{width:18px;height:18px;border-radius:6px;background:var(--ui-bg-soft);color:var(--sk-ink-3);font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.bp-rank-row.has-over .bp-rank-i{background:var(--ui-danger-bg);color:var(--ui-danger-solid)}
.bp-rank-n{font-size:12px;color:var(--sk-ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bp-rank-b{height:6px;border-radius:4px;background:rgba(28,28,28, .07);overflow:hidden}
.bp-rank-fill{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#c6c6c6,var(--ui-brand-700))}
.bp-rank-row.has-over .bp-rank-fill{background:linear-gradient(90deg,var(--ui-danger-line),var(--pl-pink))}
.bp-rank-v{text-align:right;font-variant-numeric:tabular-nums;font-size:11px;color:var(--sk-ink-3);white-space:nowrap}
.bp-rank-v b{color:var(--ui-ink-700);font-size:12px;font-weight:800}
.bp-rank-v i{font-style:normal;margin-left:4px;color:var(--ui-ink-400)}
.bp-chip-over{display:inline-flex;align-items:center;font-style:normal;font-size:11px;font-weight:700;color:var(--ui-danger-solid);background:var(--ui-danger-bg);border-radius:4px;padding:0 6px;margin-left:6px;vertical-align:middle}
/* 设备状态条（替换「全是待机」的单色环形图） */
.ov3-devbar{display:flex;flex-direction:column;gap:14px;padding-top:2px}
.ov3-devbar-track{display:flex;height:12px;border-radius:6px;overflow:hidden;background:rgba(28,28,28, .06)}
.ov3-devbar-seg{height:100%}
.ov3-devbar-legend{display:flex;flex-wrap:wrap;gap:16px}
.ov3-devbar-li{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--sk-ink-2)}
.ov3-devbar-li i{width:8px;height:8px;border-radius:4px;display:inline-block}
.ov3-devbar-li b{color:var(--ui-ink-700);font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}
.ov3-devlist{display:flex;flex-direction:column;gap:6px}
.ov3-devrow{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--sk-ink-2);padding:6px 10px;border:1px solid var(--ui-line-100);border-radius:8px;background:var(--ui-bg-card)}
.ov3-devrow b{color:var(--sk-ink);font-weight:700}
.ov3-devrow .st{margin-left:auto;font-weight:700}
.ov3-devrow .st.on{color:var(--ui-ok-solid)}
.ov3-devrow .st.off{color:var(--ui-ink-400)}
@media (max-width:1280px){ .ov3-card.c-work,.ov3-card.c-due{grid-column:span 2!important} }
/* ★ 2026-09-26 第二轮：新增「在制订单工序分布」并把 30 日趋势与设备状态并排，bento 层次更清楚 */
.ov3-card.c-stage{grid-column:span 4}
.ov3-card.c-t30{grid-column:span 8}
.ov3-card.c-dev{grid-column:span 4}
.ov3-card.c-deliver{grid-column:span 12}
@media (max-width:1280px){ .ov3-card.c-t30{grid-column:span 2!important} .ov3-card.c-deliver{grid-column:span 2!important} }
/* 看板画布加深一档：KPI 与卡片浮在浅蓝灰底上，层次更清楚（只作用于生产概览，不影响其它页） */
.bp-home.ov3{padding:14px;border-radius:16px;background:linear-gradient(180deg,var(--ui-bg-soft) 0%,var(--ui-bg-soft) 100%);border:1px solid rgba(198,198,198, .16)}
.bp-home.ov3 .ov3-kpis{margin-bottom:0}

/* ================= ★ 2026-09-26 第五轮：版式大改（深色 KPI 带 + 分组标题 + 无边框卡片） =================
   目的：跳出「一排白卡 + 小标题」的老样子，让数据层级一眼可见。
   1) 顶部状态带升级成深蓝渐变「指挥带」，4 个 KPI 直接放进深色带上（白字 + 迷你折线）；只作用于生产概览。
   2) 卡片区按「交付 / 产能 / 客户风险」分成三条带（.ov-band 小节标题）。
   3) 卡片去边框、圆角 18px、层次全靠阴影。 */
.ov-hero{display:block;padding:0;border:0;background:transparent;margin-bottom:12px}
.ov-hero-band{border-radius:20px;padding:16px 20px 14px;background:linear-gradient(125deg,var(--ui-brand-900) 0%,var(--ui-brand-900) 46%,var(--ui-brand-900) 100%);box-shadow:0 20px 44px -30px rgba(68,68,68, .9),inset 0 1px 0 rgba(255,255,255,.13);color:var(--ui-brand-100);position:relative;overflow:hidden;display:block}
.ov-hero-band::after{content:"";position:absolute;right:-70px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(12,154,184,.26),transparent 62%);pointer-events:none}
.ov-hero-top{position:relative;display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--ui-ink-300)}
.ov-hero-top .badge{background:rgba(255,255,255,.14)!important;color:var(--ui-brand-050)!important;border-color:rgba(255,255,255,.18)!important}
.ov-hero-top b{color:#fff;font-variant-numeric:tabular-nums;font-size:13px;margin-left:2px}
.ov-hero-top .ov-hero-tag{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.2);color:var(--ui-brand-100)}
.ov-hero-top .tbtn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:var(--ui-brand-050)}
.ov-hero-top label{color:#c6c6c6}
/* 深色带上的 4 个 KPI（替换原来的白色 KPI 瓷砖） */
.ov-kpis-dark{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px}
.ov-kpi-d{position:relative;padding:12px 14px 12px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(2px)}
.ov-kpi-d.tone-a{background:rgba(220,38,38,.16);border-color:rgba(246,211,226,.34)}
.ov-kpi-d .k-lb{font-size:11px;font-weight:700;color:var(--ui-ink-300);letter-spacing:.02em}
.ov-kpi-d .k-vl{display:flex;align-items:baseline;gap:8px;margin-top:2px}
.ov-kpi-d .k-vl b{font-size:32px;font-weight:800;color:#fff;letter-spacing:-1px;line-height:1.04;font-variant-numeric:tabular-nums}
.ov-kpi-d .k-vl span{font-size:11px;font-weight:700;color:var(--ui-ink-300)}
.ov-kpi-d .k-sb{font-size:11px;color:#c6c6c6;margin-top:4px;line-height:1.5}
.ov-kpi-d .k-sb b{color:#fff;font-weight:800;font-variant-numeric:tabular-nums}
.ov-kpi-d .k-viz{margin-top:10px;height:28px}
.ov-kpi-d .k-viz svg{display:block;width:100%;height:28px;overflow:visible}
.ov-kpi-d .k-cap{font-size:11px;color:var(--ui-ink-300);margin-top:4px;font-variant-numeric:tabular-nums}
.ov-kpi-d .k-bar{display:flex;height:5px;border-radius:4px;overflow:hidden;background:rgba(255,255,255,.14);margin-top:12px}
.ov-kpi-d .k-bar i{height:100%}
/* 分组标题带 */
.ov-band{grid-column:span 12;display:flex;align-items:center;gap:10px;margin:4px 0 -2px}
.ov-band i{width:4px;height:15px;border-radius:4px;background:linear-gradient(180deg,var(--sk-accent),var(--ui-brand-700));flex:none}
.ov-band h4{margin:0;font-size:12px;font-weight:800;color:var(--ui-ink-900);letter-spacing:.02em}
.ov-band em{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--ui-ink-300)}
.ov-band span{flex:1;height:1px;background:linear-gradient(90deg,rgba(28,28,28, .12),rgba(28,28,28, 0))}
/* 卡片：去边框、大圆角、层次靠阴影 */
.ov3-card{border:0;border-radius:16px;box-shadow:0 1px 2px rgba(28,28,28, .04),0 14px 32px -26px rgba(28,28,28, .55)}
.ov3-card:hover{box-shadow:0 2px 6px rgba(28,28,28, .06),0 24px 46px -28px rgba(28,28,28, .5)}
.ov3-h{margin-bottom:12px}
.ov3-h .ov3-ico{width:24px;height:24px;border-radius:8px}
.ov3-h .ov3-ico svg{width:14px;height:14px}
.bp-home.ov3{padding:0;background:transparent;border:0}
.ov3-card.c-pressure,.ov3-card.c-cycle,.ov3-card.c-funnel,.ov3-card.c-output,.ov3-card.c-pareto{grid-column:span 4}
.ov3-card.c-deliver{grid-column:span 4}
.ov3-card.c-t30{grid-column:span 12}
@media (max-width:1280px){ .ov-kpis-dark{grid-template-columns:repeat(2,1fr)} .ov3-card.c-pressure,.ov3-card.c-cycle,.ov3-card.c-funnel,.ov3-card.c-output,.ov3-card.c-pareto{grid-column:span 2!important} }

/* ================= ★ 2026-09-26 第六轮：环比 chip / 交期日历 / 客户下钻 ================= */
/* 顶部指挥带里的环比 chip（近 7 日 vs 上周） */
.ov-delta{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:#c6c6c6;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.13);border-radius:999px;padding:4px 10px;font-variant-numeric:tabular-nums}
.ov-delta b{color:#fff;font-weight:800;font-size:12px}
.ov-delta i{font-style:normal;color:var(--ui-ink-300);font-size:11px}
.ov-delta.up{color:var(--ui-ok-line)}
.ov-delta.down{color:var(--pl-pink-line)}
/* 交期日历（未来 14 天） */
.ov-cal{margin-top:12px;border-top:1px solid var(--ui-bg-soft);padding-top:10px}
.ov-cal-hd{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--ui-ink-400);margin-bottom:8px}
.ov-cal-hd em{font-style:normal;font-weight:700;margin-left:auto;border-radius:6px;padding:2px 8px}
.ov-cal-hd em.late{color:var(--ui-danger-solid);background:var(--ui-danger-bg)}
.ov-cal-hd em.ok{color:var(--ui-ok-solid);background:var(--ui-bg-soft)}
.ov-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.ov-cal-cell{position:relative;border-radius:8px;padding:6px 8px;min-height:52px;background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);display:flex;flex-direction:column;gap:2px}
.ov-cal-cell .d{font-size:11px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.ov-cal-cell .w{font-size:11px;color:var(--ui-ink-300)}
.ov-cal-cell .n{margin-top:auto;font-size:12px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.ov-cal-cell .p{font-size:11px;color:var(--ui-ink-400);font-variant-numeric:tabular-nums}
.ov-cal-cell.t-a{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.ov-cal-cell.t-a .n{color:var(--ui-brand-600)}
.ov-cal-cell.t-b{background:var(--ui-brand-100);border-color:var(--ui-brand-100)}
.ov-cal-cell.t-b .n{color:var(--ui-brand-700)}
.ov-cal-cell.t-c{background:linear-gradient(180deg,var(--ui-warn-bg),var(--ui-warn-line));border-color:var(--ui-warn-line)}
.ov-cal-cell.t-c .n{color:var(--ui-warn-ink)}
.ov-cal-cell.today{box-shadow:inset 0 0 0 2px rgba(86,86,86, .35)}
.ov-cal-cell.z .n{color:var(--ui-line-200);font-weight:700}
/* 客户下钻清单 */
.ov-drill{display:flex;flex-direction:column;gap:8px;height:100%}
.ov-drill-hd{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ui-ink-700);padding-bottom:8px;border-bottom:1px solid var(--ui-bg-soft)}
.ov-drill-hd b{font-size:13px;color:var(--ui-ink-900)}
.ov-drill-hd span{color:var(--ui-ink-400);font-variant-numeric:tabular-nums}
.ov-drill-back{margin-left:auto;border:1px solid var(--ui-line-200);background:var(--ui-bg-card);border-radius:8px;padding:4px 10px;font-size:11px;font-weight:700;color:var(--ui-brand-700);cursor:pointer;font-family:inherit}
.ov-drill-back:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.ov-drill-body{display:flex;flex-direction:column;max-height:196px;overflow:auto}
.ov-drill-row{display:grid;grid-template-columns:96px minmax(0,1fr) 54px 62px 96px;gap:8px;align-items:center;font-size:11px;color:var(--sk-ink-2);padding:6px 2px;border-bottom:1px solid var(--ui-bg-page)}
.ov-drill-row:last-child{border-bottom:0}
.ov-drill-row b{color:var(--ui-ink-700);font-family:Consolas,monospace;font-size:11px}
.ov-drill-row .n{text-align:right;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums}
.ov-drill-row .st{text-align:right;color:var(--ui-warn-ink);font-weight:700}
.ov-drill-row.ok .st{color:var(--ui-ok-solid)}

/* ================= ★ 2026-09-26 第七轮：时间窗切换 / 纯化方式对比 / 入库滞留 ================= */
/* 时间窗切换（跟随趋势类卡片） */
.ov-win{display:inline-flex;gap:2px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:2px}
.ov-win button{border:0;background:transparent;border-radius:6px;height:22px;padding:0 10px;font-size:11px;font-weight:700;color:#c6c6c6;cursor:pointer;font-family:inherit;transition:.14s}
.ov-win button:hover{color:#fff}
.ov-win button.on{background:rgba(255,255,255,.92);color:var(--ui-brand-900)}
/* ★ 2026-09-26 白底卡上的「累计 / 在产」口径切换（.ov-win 是深色指挥带专用，这里做浅色版） */
.ov-wkmode{display:inline-flex;align-items:center;gap:2px;background:rgba(68,68,68, .055);border:1px solid rgba(68,68,68, .09);border-radius:8px;padding:2px;margin-bottom:10px}
.ov-wkmode button{border:0;background:transparent;border-radius:6px;height:22px;padding:0 12px;font-size:11px;font-weight:700;color:var(--sk-ink-2);cursor:pointer;font-family:inherit;transition:.14s}
.ov-wkmode button:hover{color:var(--ui-brand-900)}
.ov-wkmode button.on{background:var(--ui-bg-card);color:var(--ui-brand-900);box-shadow:0 1px 3px rgba(28,28,28, .16)}
.ov-wkmode em{font-style:normal;font-size:11px;color:var(--ui-ink-400);margin-left:8px}
/* 交付周期按纯化方式对比 */
.ov-cmp{margin-top:12px;border-top:1px solid var(--ui-bg-soft);padding-top:10px;display:flex;flex-direction:column;gap:8px}
.ov-cmp-hd{font-size:11px;color:var(--ui-ink-400)}
.ov-cmp-row{display:grid;grid-template-columns:58px minmax(0,1fr) 96px auto;align-items:center;gap:10px;font-size:11px;color:var(--sk-ink-2)}
.ov-cmp-row .k{font-weight:800;color:var(--sk-ink)}
.ov-cmp-row .b{position:relative;height:8px;border-radius:4px;background:rgba(28,28,28, .06)}
.ov-cmp-row .b i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--sk-accent),var(--ui-brand-700))}
.ov-cmp-row .b u{position:absolute;top:-3px;width:2px;height:14px;background:var(--ui-warn-solid);border-radius:4px}
.ov-cmp-row .v{text-align:right;font-variant-numeric:tabular-nums}
.ov-cmp-row .v b{color:var(--ui-ink-900);font-weight:800;font-size:12px}
.ov-cmp-row .v i{font-style:normal;color:var(--ui-ink-400);display:block;font-size:11px}
.ov-cmp-row .tag{font-size:11px;font-weight:800;color:var(--ui-warn-ink);background:var(--ui-warn-bg);border-radius:6px;padding:2px 6px;white-space:nowrap}
/* 入库滞留 */
.ov-wh{margin-top:12px;border-top:1px solid var(--ui-bg-soft);padding-top:10px}
.ov-wh-hd{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--ui-ink-400);margin-bottom:8px}
.ov-wh-hd em{font-style:normal;margin-left:auto;color:var(--sk-ink-2);font-weight:700;font-variant-numeric:tabular-nums}
.ov-wh-bars{display:flex;align-items:flex-end;gap:10px;height:56px;margin-bottom:10px}
.ov-wh-b{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;height:100%}
.ov-wh-b i{width:100%;max-width:38px;border-radius:4px 4px 0 0;display:block}
.ov-wh-b span{font-size:11px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.ov-wh-b em{font-style:normal;font-size:11px;color:var(--ui-ink-300)}
.ov-wh-top{display:flex;flex-direction:column}
.ov-wh-row{display:grid;grid-template-columns:104px minmax(0,1fr) 54px 50px;gap:8px;align-items:center;font-size:11px;color:var(--sk-ink-2);padding:6px 2px;border-bottom:1px solid var(--ui-bg-page)}
.ov-wh-row:last-child{border-bottom:0}
.ov-wh-row b{font-family:Consolas,monospace;font-size:11px;color:var(--ui-ink-700)}
.ov-wh-row .n{text-align:right;font-weight:800;color:var(--ui-danger-solid);font-variant-numeric:tabular-nums}
.ov-wh-row .st{text-align:right;color:var(--ui-danger-solid);font-weight:700}
.ov-wh-row.ok .n{color:var(--ui-ink-500)}
.ov-wh-row.ok .st{color:var(--ui-ok-solid)}
.ov-cal-cell{cursor:pointer;transition:box-shadow .14s,transform .14s}
.ov-cal-cell:hover{transform:translateY(-1px);box-shadow:0 6px 14px -8px rgba(68,68,68, .5)}

/* ================= ★ 2026-09-26 第八轮：今日动态 / 今日要点 / 纯化方式下钻 / 滞留分组 ================= */
/* 深色指挥带底部的「今日」条 */
.ov-today{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.12)}
.ov-today-c{display:flex;align-items:baseline;gap:8px;font-variant-numeric:tabular-nums}
.ov-today-c .k{font-size:11px;color:var(--ui-ink-300);font-weight:700}
.ov-today-c b{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.4px}
.ov-today-c em{font-style:normal;font-size:11px;color:var(--ui-ink-300)}
/* 今日要点（自动结论条） */
.ov-insight{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding:10px 14px;border-radius:14px;background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft));border:1px solid var(--ui-line-100);box-shadow:0 1px 2px rgba(28,28,28, .04)}
.ov-insight .lb{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ui-ink-500);background:var(--ui-brand-050);border:1px solid var(--ui-brand-100);border-radius:6px;padding:2px 8px}
.ov-insight .it{display:inline-flex;flex-direction:column;gap:2px;padding:6px 12px;border-radius:10px;background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);cursor:default}
.ov-insight .it b{font-size:12px;font-weight:700;color:var(--sk-ink)}
.ov-insight .it i{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.ov-insight .it.warn{border-color:var(--ui-warn-line);background:var(--ui-warn-bg)}
.ov-insight .it.warn b{color:var(--ui-warn-ink)}
.ov-insight .it.danger{border-color:var(--ui-danger-line);background:var(--ui-danger-bg)}
.ov-insight .it.danger b{color:var(--ui-danger-ink)}
.ov-insight .it.ok{border-color:var(--ui-ok-line);background:var(--ui-bg-page)}
.ov-insight .it.ok b{color:var(--ui-ok-solid)}
.ov-insight .it[onclick]{cursor:pointer;transition:transform .14s,box-shadow .14s}
.ov-insight .it[onclick]:hover{transform:translateY(-1px);box-shadow:0 8px 18px -12px rgba(68,68,68, .6)}
/* 纯化方式下钻：各工段平均耗时 */
.ov-kind-stage{display:flex;flex-direction:column;gap:6px;padding:4px 0 10px;border-bottom:1px solid var(--ui-bg-soft);margin-bottom:8px}
.ov-kind-s{display:grid;grid-template-columns:54px minmax(0,1fr) 74px;align-items:center;gap:10px;font-size:11px;color:var(--sk-ink-2)}
.ov-kind-s .k{font-weight:700;color:var(--ui-ink-700)}
.ov-kind-s .b{height:7px;border-radius:4px;background:rgba(28,28,28, .06)}
.ov-kind-s .b i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--sk-accent),var(--ui-brand-700))}
.ov-kind-s .v{text-align:right;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums}
.ov-kind-s .v i{font-style:normal;font-weight:600;color:var(--ui-ink-400);margin-left:6px;font-size:11px}
.ov-cmp-row{cursor:pointer}
.ov-cmp-row:hover .k{color:var(--ui-brand-700)}
/* 入库滞留按纯化方式分组 */
.ov-wh-grp{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.ov-wh-g{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--sk-ink-2);background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);border-radius:8px;padding:4px 10px;font-variant-numeric:tabular-nums}
.ov-wh-g b{color:var(--sk-ink);font-weight:800}
.ov-wh-g i{font-style:normal;color:var(--ui-ink-400);font-size:11px}

/* ================= ★ 2026-09-26 第九轮：分屏（按键切换视图，一屏一组图） ================= */
.ov-tabs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;padding:10px 12px;border-radius:14px;background:var(--ui-bg-card);border:1px solid var(--ui-line-100);box-shadow:0 1px 2px rgba(28,28,28, .04)}
.ov-tabs-lb{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ui-ink-300);margin-right:2px}
.ov-tabs button{display:flex;flex-direction:column;align-items:flex-start;gap:0;border:1px solid transparent;background:var(--ui-bg-page);border-radius:10px;padding:6px 14px;cursor:pointer;font-family:inherit;transition:.16s}
.ov-tabs button b{font-size:12px;font-weight:800;color:var(--ui-ink-500);line-height:1.25}
.ov-tabs button i{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ui-ink-300)}
.ov-tabs button:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.ov-tabs button:hover b{color:var(--ui-brand-700)}
.ov-tabs button.on{background:linear-gradient(180deg,var(--ui-brand-900),var(--ui-brand-900));border-color:transparent;box-shadow:0 6px 16px -10px rgba(68,68,68, .85)}
.ov-tabs button.on b{color:#fff}
.ov-tabs button.on i{color:var(--ui-ink-300)}
.ov-tabs-note{margin-left:auto;font-size:11px;color:var(--ui-ink-400)}
/* ================= ★ 2026-09-29 第三十九轮：右卡「按时交付率」的精致化（用户：「可视化图表做的更高大上一些」）
   只加两处：① 卡头把「率」做成大数（三段式：口径 / 大数 / 分母分子）；
   ② 交付率表的柱/线用渐变 + 投影 + 今日底纹（样式写在 app.js 的 option 里）。 */
.ov3-card.c-deliver .ov3-h .ov3-meta{
  display:inline-flex;align-items:baseline;gap:8px;padding:4px 12px;
  background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border:1px solid rgba(115,115,115, .16);
  box-shadow:0 1px 2px rgba(28,28,28, .04),inset 0 1px 0 rgba(255,255,255,.9);
}
.ov3-card.c-deliver .ov3-h .ov3-meta em{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.5px;color:var(--ui-ink-400)}
.ov3-card.c-deliver .ov3-h .ov3-meta b{font-size:16px;font-weight:900;letter-spacing:-.3px;color:var(--ui-brand-900);line-height:1.1}
.ov3-card.c-deliver .ov3-h .ov3-meta i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400);border-left:1px solid rgba(28,28,28, .1);padding-left:8px}

/* ================= ★ 2026-09-29 第四十轮：生产概览的「卡头不被挤爆 + 脚注只留一行」
   用户：「注释的文字太多了，尤其是右卡右上角都有遮挡了」。两件事：
   ① 卡头：标题可省略号、英文小标不可压缩、口径胶囊不撑破 —— 右卡的大数胶囊变短后，右上角不再被顶出去；
   ② 脚注：可见一行（最多两行兜底），完整口径在 title 里（见 app.js 的 foot1）。
   作用域限定在 .bp-home.ov3（生产概览），不动其它页面。 */
.bp-home.ov3 .ov3-h h3{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bp-home.ov3 .ov3-h .ov3-en{flex:none;margin-left:8px}
.bp-home.ov3 .ov3-h .ov3-meta{flex:0 0 auto;max-width:52%}
.bp-home.ov3 .ov3-card .ov3-foot{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ov3-foot .ov-foot-1{cursor:help}
.ov3-foot .ov-foot-i{font-style:normal;color:var(--ui-ink-300);border-bottom:1px dashed rgba(144,144,144, .5);padding-bottom:2px}
.ov3-foot .ov-foot-i:hover{color:var(--sk-ink-2);border-bottom-color:var(--sk-ink-2)}

/* 每个分屏的栅格（一行最多 3 张，行内等宽等高） */
.ov3-grid[data-tab="overview"] .c-t7{grid-column:span 6}
.ov3-grid[data-tab="overview"] .c-deliver{grid-column:span 6}
.ov3-grid[data-tab="overview"] .c-pressure,.ov3-grid[data-tab="overview"] .c-cycle{grid-column:span 6}
.ov3-grid[data-tab="capacity"] .c-funnel,.ov3-grid[data-tab="capacity"] .c-output,.ov3-grid[data-tab="capacity"] .c-stage{grid-column:span 4}
.ov3-grid[data-tab="capacity"] .c-dur,.ov3-grid[data-tab="capacity"] .c-wh{grid-column:span 6}
.ov3-grid[data-tab="capacity"] .c-work{grid-column:span 12}
.ov3-grid[data-tab="customer"] .c-pareto,.ov3-grid[data-tab="customer"] .c-risk,.ov3-grid[data-tab="customer"] .c-due,.ov3-grid[data-tab="customer"] .c-todo{grid-column:span 6}
.ov3-grid[data-tab="quality"] .c-comp,.ov3-grid[data-tab="quality"] .c-qc,.ov3-grid[data-tab="quality"] .c-dev{grid-column:span 4}
.ov3-grid[data-tab="quality"] .c-t30{grid-column:span 12}
/* 卡片列表型内容撑满高度，避免行内参差 */
.ov3-grid[data-tab="capacity"] .c-wh .ov3-b{min-height:236px}
@media (max-width:1280px){
  .ov-tabs button{padding:6px 10px}
  .ov-tabs-note{display:none}
  .ov3-grid[data-tab] .ov3-card{grid-column:span 2!important}
}
/* 构成环右侧数值图例（替代底部图例，卡片更饱满） */
.ov3-comp-list{display:flex;flex-direction:column;gap:10px;padding-top:4px}
.ov3-comp-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:10px;font-size:12px;color:var(--ui-ink-700)}
.ov3-comp-row i{width:10px;height:10px;border-radius:4px;display:inline-block}
.ov3-comp-row b{font-variant-numeric:tabular-nums;font-weight:800;color:var(--ui-ink-700)}
.ov3-comp-row em{font-style:normal;color:var(--ui-ink-400);font-size:11px;margin-left:6px;font-variant-numeric:tabular-nums}
.ov3-comp-foot{margin-top:auto;padding-top:10px;border-top:1px solid var(--ui-bg-soft);font-size:11px;color:var(--ui-ink-400)}

/* ================= ★ 2026-09-26 第二十六轮：「交期预警」（dashboardTab=diagnosis）整体重做 =================
   设计语言全部沿用现有件：卡片＝.ov3-card（16px 圆角 + 发丝边 + 柔和投影）、表＝.ov3-card .bp-table、
   标签＝.bp-tag（豁免态用既有的 .bp-tag.tone-q 中性灰蓝）、筛选＝.diag-fbtn、渐变＝var(--grad)。
   本段只加「今日行动砖 / 无风险空态 / 下钻面板 / 14 天逐日柱 / 折叠工具头」这五个新结构，不引新的设计体系。 */
/* 页面竖排白卡 */
.dg-page{display:flex;flex-direction:column;gap:12px}
/* 卡头：主题层里 `.ov3-h span{margin-left:auto}` 会把第一个子元素（图标徽标）也推向右，
   本页复位一下，让「图标 + 标题 …… 口径小注 + 英文小标」回到正常排布（不动生产概览）。 */
.dg-page .ov3-h .ov3-ico{margin-left:0}
/* ① 今日行动：可点行动砖（0 的分组不渲染 → auto-fit 自适应列数，不留一堆 0） */
.dg-acts{display:grid;grid-template-columns:repeat(auto-fit,minmax(206px,1fr));gap:10px}
.dg-g{display:flex;flex-direction:column;gap:4px;text-align:left;font-family:inherit;cursor:pointer;
  border:1px solid var(--ui-line-100);border-radius:14px;padding:12px 14px;background:var(--ui-bg-soft);
  transition:transform .16s ease,box-shadow .16s ease}
.dg-g:hover{transform:translateY(-1px);box-shadow:0 12px 24px -18px rgba(68,68,68, .65)}
.dg-g-k{font-size:11px;font-weight:800;letter-spacing:.03em;color:var(--sk-ink-2)}
.dg-g-v{display:flex;align-items:baseline;gap:6px;font-variant-numeric:tabular-nums}
.dg-g-v b{font-size:28px;font-weight:800;line-height:1.04;letter-spacing:-.7px;color:var(--ui-ink-900)}
.dg-g-v i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.dg-g-v em{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400);margin-left:2px}
.dg-g-s{font-size:11px;color:var(--ui-ink-400)}
.dg-g-go{margin-top:4px;font-size:11px;font-weight:800;color:var(--ui-brand-600)}
.dg-g.tone-a{background:var(--ui-bg-soft);border-color:var(--ui-danger-line)}
.dg-g.tone-a .dg-g-v b,.dg-g.tone-a .dg-g-go{color:var(--ui-danger-solid)}
.dg-g.tone-c{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.dg-g.tone-c .dg-g-v b,.dg-g.tone-c .dg-g-go{color:var(--ui-warn-ink)}
.dg-g.tone-b{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.dg-g.tone-b .dg-g-v b,.dg-g.tone-b .dg-g-go{color:var(--ui-brand-700)}
/* 空状态：真·无风险用绿，合作豁免无逾期用中性灰蓝（都不留 0） */
.dg-none{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;
  background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-ok-bg));border:1px solid var(--ui-ok-line)}
.dg-none.is-q{background:linear-gradient(180deg,var(--sk-soft),var(--ui-line-100));border-color:var(--ui-line-200)}
.dg-none-ico{width:26px;height:26px;border-radius:8px;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:var(--ui-ok-bg);color:var(--ui-ok-solid);font-weight:800;font-size:14px}
.dg-none.is-q .dg-none-ico{background:var(--ui-line-100);color:var(--sk-ink-3)}
.dg-none b{display:block;font-size:13px;font-weight:800;color:var(--ui-ok-solid)}
.dg-none.is-q b{color:var(--ui-ink-500)}
.dg-none i{font-style:normal;display:block;font-size:11px;line-height:1.6;color:var(--ui-ink-500);margin-top:2px}
.dg-none.is-q i{color:var(--ui-ink-400)}
/* 下钻面板：点行动砖 / 点柱子 → 就地看订单明细（订单号 / 客户 / 条数 / 预计完成时间 / 当前工序） */
.dg-drill{margin-top:10px;border:1px solid var(--ui-line-100);border-radius:14px;background:var(--ui-bg-card);overflow:hidden}
.dg-drill-hd{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--ui-line-100);background:var(--ui-bg-soft);flex-wrap:wrap}
.dg-drill-hd b{font-size:12px;font-weight:800;color:var(--ui-ink-700)}
.dg-drill-hd span{font-size:11px;color:var(--ui-ink-400);font-variant-numeric:tabular-nums}
.dg-drill-hd button{margin-left:auto;border:1px solid var(--line);background:var(--ui-bg-card);border-radius:8px;
  padding:4px 10px;font-size:11px;font-weight:700;color:var(--sk-ink-2);cursor:pointer;font-family:inherit}
.dg-drill-hd button:hover{border-color:var(--line-strong);color:var(--txt)}
.dg-drill-b{max-height:300px;overflow:auto;padding:0 12px 4px}
.dg-drill-b .ov3-empty{min-height:64px}
/* 明细表行可点（沿用 .bp-table 行样式，只加手型与 hover） */
.dg-row{cursor:pointer}
.dg-row:hover td{background:var(--ui-brand-050)!important}
.dg-sub{font-style:normal;display:block;font-size:11px;color:var(--ui-ink-400);font-weight:600}
/* ② 未来趋势：未来 14 天逐日到期柱（纯 CSS，不引图表库 → 切页没有 init 时序风险） */
.dg-trend-sum{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:10px}
.dg-ts{display:inline-flex;align-items:baseline;gap:4px;font-size:11px;color:var(--sk-ink-2);font-variant-numeric:tabular-nums}
.dg-ts b{color:var(--ui-ink-900);font-weight:800;font-size:13px}
.dg-ts.dim{color:var(--ui-ink-400)}
.dg-trend{display:flex;align-items:stretch;gap:6px;height:146px;padding:0 2px}
.dg-td{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;
  cursor:pointer;border-radius:8px;padding-bottom:2px;transition:background .14s}
.dg-td:hover{background:var(--ui-brand-050)}
.dg-td-v{font-size:11px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums;line-height:1}
.dg-td-b{width:100%;border-radius:6px 6px 4px 4px;background:linear-gradient(180deg,var(--ui-brand-500),var(--sk-accent))}
.dg-td.win .dg-td-b{background:linear-gradient(180deg,var(--ui-warn-line),var(--ui-warn-solid))}
.dg-td.today .dg-td-b{background:linear-gradient(180deg,var(--ui-danger-solid),var(--ui-danger-solid))}
.dg-trendlb{display:flex;gap:6px;padding:6px 2px 0;border-top:1px solid var(--ui-bg-soft);margin-top:6px}
.dg-td-lb{flex:1;min-width:0;text-align:center;font-size:11px;color:var(--ui-ink-400)}
.dg-td-lb b{display:block;font-size:11px;font-weight:700;color:var(--sk-ink-3);font-variant-numeric:tabular-nums}
.dg-td-lb i{font-style:normal;font-size:11px}
.dg-td-lb.today b{color:var(--ui-danger-solid)}
.dg-td-lb.win b{color:var(--ui-warn-ink)}
/* ③ 合作单逾期豁免区头（中性灰蓝，与 .bp-tag.tone-q 同一色系：要被看见，但不被追责） */
.dg-coop-hd{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:0 0 10px;margin-bottom:2px;border-bottom:1px solid var(--ui-bg-soft)}
.dg-coop-hd b{font-size:14px;font-weight:800;color:var(--ui-ink-500);font-variant-numeric:tabular-nums}
.dg-coop-hd i{font-style:normal;font-size:11px;color:var(--ui-ink-400);line-height:1.6}
/* ④ 交期试算工具（V4）折叠区：保留功能，不再占满整页 */
.dg-tool-hd{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.dg-tool-hd:hover h3{color:var(--ui-brand-700)}
.dg-tool-hd h3{margin:0;font-size:13px;font-weight:800;color:var(--txt)}
.dg-tool-hd .ov3-ico{width:22px;height:22px;flex:none;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border:1px solid var(--ui-brand-100);color:var(--ui-brand-700)}
.dg-tool-hd .ov3-ico svg{width:13px;height:13px}
.dg-tool-note{margin-left:auto;font-size:11px;color:var(--ui-ink-400)}
.dg-tool-arrow{font-size:11px;color:var(--ui-ink-400);transition:transform .18s}
.c-dg-tool.is-open .dg-tool-arrow{transform:rotate(180deg)}
#dgToolBody{margin-top:12px;padding-top:12px;border-top:1px solid var(--ui-bg-soft)}
@media (max-width:1280px){ .dg-tool-note{display:none} }
/* 交期分布：合作单逾期豁免提示条 + 明细脚注（与「交期预警」同一套文案与配色） */
.td-coop-hint{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 0;
  padding:10px 14px;border-radius:14px;background:var(--sk-soft);border:1px solid var(--ui-line-200)}
.td-coop-hint b{font-size:13px;font-weight:800;color:var(--ui-ink-500);font-variant-numeric:tabular-nums}
.td-coop-hint i{font-style:normal;font-size:11px;color:var(--ui-ink-400);line-height:1.6}
.td-coop-go{margin-left:auto;font-size:11px;font-weight:800;color:var(--sk-ink-2);cursor:pointer}
.td-coop-go:hover{color:var(--ui-brand-700)}
.td-tab-waive{margin-left:4px;font-size:11px;font-weight:800;color:var(--sk-ink-3);background:var(--ui-line-100);
  border:1px dashed var(--ui-line-200);border-radius:4px;padding:0 4px}
.td-coop-foot{margin-top:12px;font-size:11px;color:var(--ui-ink-400);line-height:1.7}
.td-coop-foot b{color:var(--ui-ink-500);font-weight:800;font-variant-numeric:tabular-nums}

/* ================= ★ 2026-09-26 第二十七轮：「指挥驾驶舱」剩余页签（工序看板 / 生产动态 / 在制订单 /
   交付周期达成 / 按时交付率 / 订单构成）统一精修 =================
   设计语言不新增体系：卡片＝.ov3-card、表＝.bp-table、标签＝.bp-tag、行动砖＝.diag 的 .dg-* 、
   页头＝.ov-hero、空态＝.dg-none。这里只补 5 个新增结构的小样式。 */
/* ① 行动砖新增两个色阶：q＝豁免/次要（与 .bp-tag.tone-q 同色系），d＝已完成（中性蓝灰） */
.dg-g.tone-q{background:var(--sk-soft);border-color:var(--ui-line-200)}
.dg-g.tone-q .dg-g-v b,.dg-g.tone-q .dg-g-go{color:var(--sk-ink-3)}
.dg-g.tone-d{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.dg-g.tone-d .dg-g-v b,.dg-g.tone-d .dg-g-go{color:var(--ui-ok-solid)}
/* ② 工序看板卡片新增的「交期」行（原来卡片上完全没有预计完成时间） */
.ocard .ometa.ck-eta{align-items:center;gap:6px;font-size:11px;color:var(--ui-ink-500)}
.ocard .ometa.ck-eta.is-near{color:var(--ui-warn-ink);font-weight:700}
.ocard .ometa.ck-eta.is-over{color:var(--ui-danger-solid);font-weight:700}
.ocard .ometa .ometa-qty{font-variant-numeric:tabular-nums}
/* ③ 负载条：条数小注 + 空工序灰显（看热闹的 0 不再和热点同权） */
.lb .lbl i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400);margin-left:6px;font-variant-numeric:tabular-nums}
.lb.is-idle .lbl{color:var(--ui-ink-300)}
.lb.is-idle .track i{background:var(--ui-line-200);box-shadow:none}
/* ④ 在制订单 / 生产动态页：紧凑统计条与分组小节头（沿用卡片内小标题的语言） */
.ck-strip{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:10px}
.ck-s{display:inline-flex;align-items:baseline;gap:4px;font-size:11px;color:var(--sk-ink-2);font-variant-numeric:tabular-nums}
.ck-s b{color:var(--ui-ink-900);font-weight:800;font-size:14px}
.ck-s.dim{color:var(--ui-ink-400)}
/* ⑤ 明细截断提示（原来悄悄 slice(0,60)，用户以为看到了全部） */
.ck-more{margin-top:10px;font-size:11px;color:var(--ui-ink-400)}
.ck-more b{color:var(--ui-ink-500);font-weight:800}
/* ⑥ 生产动态：事件卡上的「条数/交期/工序」小行 + 重复模块提示 */
.live-facts{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:6px;font-size:11px;color:var(--sk-ink-2)}
.live-facts b{color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.live-dup{margin-left:8px;font-size:11px;font-weight:700;color:var(--ui-ink-400);background:var(--ui-bg-soft);
  border:1px dashed var(--ui-line-200);border-radius:4px;padding:0 6px}
/* ⑦ 「在制订单」页：可点负载行、条数小注、卡片条数行、豁免/临期/未投产旗标 */
.pm-station-row.is-click{cursor:pointer}
.pm-station-row.is-click:hover{background:var(--ui-brand-050)}
.pm-station-count .pm-station-p{font-style:normal;display:block;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.pm-oc-qty{font-size:11px;color:var(--sk-ink-2);margin-bottom:6px;font-variant-numeric:tabular-nums}
.pm-oc-qty b{font-size:13px;font-weight:800;color:var(--ui-ink-700)}
.pm-oc-qty i{font-style:normal;margin-left:6px;color:var(--ui-ink-400)}
.pm-flag-coop{background:linear-gradient(135deg,rgba(118,118,118, .14),rgba(118,118,118, .07));
  color:var(--sk-ink-3);border:1px dashed var(--ui-line-200)}
.pm-flag-amber{background:linear-gradient(135deg,rgba(217,119,6,.15),rgba(217,119,6,.08));
  color:var(--ui-warn-ink);border:1px solid rgba(217,119,6,.22)}
.pm-flag-gray{background:linear-gradient(135deg,rgba(144,144,144, .16),rgba(144,144,144, .08));
  color:var(--sk-ink-3);border:1px solid rgba(144,144,144, .25)}
/* ⑧ 「交付周期达成」页：周卡片的「无逾期」小注 / 折叠掉的空周 / 明细脚注 */
.cyc-week-note{margin-top:8px;font-size:11px;color:var(--ui-ink-400);line-height:1.6}
.cyc-ws-ok{font-size:11px;font-weight:700;color:var(--ui-ok-solid);background:var(--ui-bg-soft);border:1px solid var(--ui-ok-line);
  border-radius:6px;padding:2px 8px}
.cyc-week-card.is-blank{background:var(--ui-bg-card);border-style:dashed;opacity:.9}
.cyc-week-card.is-blank .cyc-week-range{color:var(--ui-ink-400);margin-bottom:4px}
.cyc-foot{margin-top:12px;font-size:11px;color:var(--ui-ink-400);line-height:1.7}
.cyc-foot b{color:var(--ui-ink-500);font-weight:800;font-variant-numeric:tabular-nums}
.cyc-ocard.coopover{border-color:var(--ui-line-200);background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft))}
.cyc-ocard-qty{font-size:11px;font-weight:700;color:var(--sk-ink-2);font-variant-numeric:tabular-nums}
.cyc-ocard-waive{font-size:11px;font-weight:800;color:var(--sk-ink-3);background:var(--ui-line-100);
  border:1px dashed var(--ui-line-200);border-radius:4px;padding:0 4px}
/* ⑨ 「按时交付率」页：页头口径条 + 今日行动区（沿用 .ach-panel 内部的块间距） */
.ach-rowact{margin:14px 0 0}
.ach-rowact .sec-hd{margin-bottom:10px}
.ach-panel .ov-hero{margin:12px 0 0}
.ach-panel .td-coop-hint{margin:10px 0 0}
/* ⑩ 「订单构成」页：明细区筛选条 + 卡片条数/豁免 */
.cat-cat-hd{margin-bottom:10px;font-size:11px;color:var(--sk-ink-2)}
.cat-cat-hd b{color:var(--ui-ink-700);font-weight:800;font-variant-numeric:tabular-nums}
.cat-ocard.coopover{border-color:var(--ui-line-200);background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft))}
.cat-ocard-qty{font-size:11px;font-weight:700;color:var(--sk-ink-2);font-variant-numeric:tabular-nums}
.cat-ocard-waive{font-size:11px;font-weight:800;color:var(--sk-ink-3);background:var(--ui-line-100);
  border:1px dashed var(--ui-line-200);border-radius:4px;padding:0 4px}
.cat-ocard{cursor:pointer}

/* ★ 2026-09-26 第二十八轮：「在制订单」页内分段切换（原「工序看板」页签已并入本页） */
.pm-seg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 12px}
.pm-seg-lb{font-size:11px;font-weight:800;color:var(--ui-ink-400);letter-spacing:.04em}
.pm-seg-btn{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel-solid);color:var(--txt-2);font-size:12px;font-weight:700;cursor:pointer;transition:.18s}
.pm-seg-btn:hover{border-color:var(--line-strong);color:var(--txt)}
.pm-seg-btn.active{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 6px 16px -8px rgba(68,68,68, .45)}
.pm-seg-n{font-variant-numeric:tabular-nums;background:var(--ui-line-100);color:var(--sk-ink-2);border-radius:6px;padding:0 6px;font-size:11px;font-weight:800}
.pm-seg-btn.active .pm-seg-n{background:rgba(255,255,255,.22);color:#fff}
.pm-seg-hint{font-size:11px;color:var(--ui-ink-400)}
.pm-seg-hint b{color:var(--sk-ink-2);font-weight:800}

/* ★ 2026-09-26 第二十八轮：「订单构成」第三张图拆成「合成种类 / 五端修饰」两张 → 图表区改 2×2，
   并把覆盖率低的「五端修饰」降权重（虚线边 + 更淡的底 + 更矮的图），不与「合成种类」同权呈现。 */
.cat-charts-row.is-quad{grid-template-columns:1fr 1fr}
.cat-chart-card.is-weak{background:linear-gradient(180deg,var(--ui-bg-card),var(--sk-soft));border-style:dashed}
.cat-cov-chip{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:var(--ui-ink-700);background:var(--ui-warn-bg);border:1px dashed var(--ui-warn-line);border-radius:6px;padding:2px 8px;margin-left:8px}
.cat-cov-chip.is-ok{color:var(--ui-ok-solid);background:var(--ui-bg-soft);border-color:var(--ui-ok-line)}

/* ★ 2026-09-26 第二十八轮：「交付周期达成 / 交期分布」删掉与「按时交付率」重复的达成率表盘后，
   原位补一张纯文字结论卡（避免 3 列网格留空洞），表盘只在「按时交付率」页保留一处。 */
.chart-merged-note{display:flex;flex-direction:column;justify-content:center;gap:8px;height:100%;min-height:240px;padding:6px 4px}
.chart-merged-num{font-size:40px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.chart-merged-num.is-good{color:var(--ui-ok-solid)}
.chart-merged-num.is-warn{color:var(--ui-warn-ink)}
.chart-merged-num.is-bad{color:var(--ui-danger-solid)}
.chart-merged-txt{font-size:12px;line-height:1.85;color:var(--sk-ink-2)}
.chart-merged-txt b{color:var(--ui-ink-700);font-weight:800}
.chart-merged-go{font-size:12px;font-weight:700;color:var(--brand-2)}
/* ★ 2026-09-26 第二十八轮：「交付周期达成」月度统计的纯文字结论块。
   不能用 .ov3-empty（display:flex → 内联 <b> 各自成 flex item，长句被拉散成散字，
   真机截图实测到这个坑），这里用块级文字块，行高放大、最小高度对齐旁边的图卡。 */
.cyc-text-note{min-height:236px;padding:26px 4px;color:var(--sk-ink-2);font-size:12px;line-height:1.95}
.cyc-text-note b{color:var(--ui-ink-700);font-weight:800;font-variant-numeric:tabular-nums}

/* ==========================================================================================
   ★ 2026-09-27 第四十轮：7 个页签（生产动态 / 在制订单 / 交期预警 / 交期分布 / 交付周期达成 /
   按时交付率 / 订单构成）统一成「精美数据可视化」版式 —— 与「生产概览」同一套视觉语言。
   只追加必要类，命名沿用 .ov3-* / .ovz-*；不覆盖任何既有类。
   ========================================================================================== */
/* 通用 12 列跨度（配 .ov3-grid 用；比原来按 data-tab 逐个写死 span 更好复用） */
.ov3-card.ov3-g12{grid-column:span 12}
.ov3-card.ov3-g9{grid-column:span 9}
.ov3-card.ov3-g8{grid-column:span 8}
.ov3-card.ov3-g6{grid-column:span 6}
.ov3-card.ov3-g4{grid-column:span 4}
.ov3-card.ov3-g3{grid-column:span 3}
/* 图表容器高度档（补齐 .ov3-h250 / 280 / 320 之外的档位） */
.ov3-h160{height:160px}
.ov3-h190{height:190px}
.ov3-h210{height:210px}
.ov3-h230{height:230px}
.ov3-h260{height:260px}
.ov3-h300{height:300px}
@media (max-width:1440px){
  .ov3-card.ov3-g3,.ov3-card.ov3-g4{grid-column:span 6}
  .ov3-card.ov3-g8,.ov3-card.ov3-g9{grid-column:span 12}
  .ov3-h300{height:270px}
}
@media (max-width:1280px){
  .ov3-card.ov3-g3,.ov3-card.ov3-g4,.ov3-card.ov3-g6{grid-column:span 12}
  .ov3-h300,.ov3-h260{height:240px}
}
/* 排名条（ovzRankHtml）：右列加宽，长数字 + 单数不挤在一起 */
.ovz-rank .bp-rank-row{grid-template-columns:18px minmax(0,1fr) 74px 142px}
.ovz-rank .bp-rank-v i{white-space:nowrap}
.ovz-rank .bp-rank-row:last-child{border-bottom:0}
/* 横向迷你条组（ovzMiniHtml）：「工艺 / 修饰覆盖率」这类低覆盖分布，不与主图同权比较 */
.ovz-mini{display:flex;flex-direction:column;gap:10px}
.ovz-mini-i{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;align-items:baseline}
.ovz-mini-i .k{font-size:12px;color:var(--sk-ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ovz-mini-i .v{font-size:11px;color:var(--sk-ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.ovz-mini-i .v b{color:var(--ui-ink-700);font-size:12px;font-weight:800;margin-right:4px}
.ovz-mini-i .v i{font-style:normal;margin-left:6px;color:var(--ui-ink-400)}
.ovz-mini-i .b{grid-column:1/-1;height:6px;border-radius:4px;background:rgba(28,28,28, .07);overflow:hidden;display:block}
.ovz-mini-i .b i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#c6c6c6,var(--ui-brand-700))}
.ovz-mini-i.is-weak .k,.ovz-mini-i.is-weak .v{color:var(--ui-ink-400)}
.ovz-mini-i.is-click{cursor:pointer;border-radius:8px;padding:2px 4px;margin:-2px -4px}
.ovz-mini-i.is-click:hover{background:var(--ui-brand-050)}
/* 卡片内小节标题（同一张卡里放两块内容时用，视觉重量低于 .ov3-h） */
.ovz-sub{display:flex;align-items:center;gap:8px;margin:12px 0 8px;font-size:11px;font-weight:800;color:var(--sk-ink-2)}
.ovz-sub i{width:3px;height:12px;border-radius:4px;background:linear-gradient(180deg,var(--sk-accent),var(--ui-brand-700));flex:none}
.ovz-sub em{font-style:normal;font-size:11px;font-weight:800;letter-spacing:1.2px;color:var(--ui-ink-300)}
.ovz-sub u{margin-left:auto;text-decoration:none;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.ovz-sub:first-child{margin-top:0}
/* 页签内「口径脚注条」：多张卡共用一个总口径时，放在网格最后一张（跨 12 列） */
.ovz-footbar{grid-column:span 12;padding:10px 14px;background:var(--ui-bg-card);border:1px solid var(--ui-line-100);border-radius:14px;
  font-size:11px;color:var(--ui-ink-400);line-height:1.6}
.ovz-footbar b{color:var(--ui-ink-500);font-weight:700;font-variant-numeric:tabular-nums}
/* 深色指挥带上的「单位/口径」副标里的小徽标（豁免/口径标签） */
.ov-kpi-d .k-sb .ovz-waive{display:inline-flex;align-items:center;font-size:11px;font-weight:800;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:0 6px;color:var(--ui-brand-100)}
/* 明细表里的进度条（.pbar 自带 min-width:80px，放不进窄列，这里用一套不设最小宽度的） */
.ovz-pg{display:flex;align-items:center;gap:8px}
.ovz-pg .b{flex:1;min-width:0;height:7px;border-radius:999px;background:rgba(68,68,68, .10);overflow:hidden}
.ovz-pg .b i{display:block;height:100%;border-radius:999px}
.ovz-pg b{font-variant-numeric:tabular-nums;font-size:11px;font-weight:800;min-width:36px;text-align:right}
.ovz-pg.is-unprod b{color:var(--ui-ink-400);font-weight:700}

/* ==========================================================================================
   ★ 2026-09-27 第四十一轮：「精致度精修 + 生产动态减噪」
   本段只做三件事，**不改任何取数与口径**：
   ① 尺寸/间距统一：网格 gap 12、卡内 padding 14/16、图表容器一律 240px、脚注视口 3 行；
   ② 字号/用色收敛：卡片内只用 14.5 / 13 / 12 / 11.5 四档，5 个语义色相族 + 中性灰；
   ③ 「生产动态」事件行减噪：47px → 40px，一行只留 4 段文字。
   为什么全部写在 theme.css（它在 index.html 里最后加载）：这样不必去动 CRLF 的 app.css，
   旧的 .live-* 规则自然被这里的同名规则覆盖，回滚只需删掉本段。
   ========================================================================================== */
/* —— ① 栅格与卡片：gap / padding / 卡头 / 脚注 —— */
/* td-page / cat-page / cyc-page 三个页签的包裹层也加了 dg-page 类（app.js 里各加一处），
   这样 7 个页签共用同一套尺寸、字号、间距；页面竖排间距也统一到 12px。 */
.dg-page{gap:12px}
.dg-page .ov3-grid{gap:12px}
.dg-page .ov3-card{padding:14px 16px 16px}
/* app.css 里 .bp-chart 有 min-height:240px、主题层有 min-height:252px!important，
   会让图容器比 240px 档高 12px（实测卡片 375 而非 363）—— 这两条都要在这里复位。 */
.dg-page .ov3-card .bp-chart{min-height:0!important}
.dg-page .ov3-h{margin-bottom:10px;gap:8px}
.dg-page .ov3-h .ov3-ico{width:24px;height:24px;border-radius:8px}
.dg-page .ov3-h h3{font-size:14px;font-weight:800;letter-spacing:.2px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-page .ov3-h .ov3-en{font-size:11px;font-weight:800;letter-spacing:.9px;color:var(--ui-ink-300);margin-left:8px;white-space:nowrap}
.dg-page .ov3-h .ov3-meta{font-size:11px;font-weight:700;color:var(--sk-ink-2);background:var(--ui-bg-page);border:1px solid rgba(28,28,28, .07);border-radius:6px;padding:2px 8px;margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
/* 脚注：视口固定 3 行（11.5px × 1.45 × 3 ≈ 50px）——**这是全站图表卡等高**的关键一条：
   脚注长短不再改变卡高；全文写进 .ov3-foot 的 title，悬停可读，信息不丢。 */
.dg-page .ov3-card .ov3-foot{height:51px;margin-top:8px;font-size:11px;line-height:1.45;color:var(--ui-ink-400);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.dg-page .ov3-card .ov3-foot b{color:var(--ui-ink-500);font-weight:700;font-variant-numeric:tabular-nums}
/* 图表容器统一 240px（替代原来的 250/260/280/300/320 五档） */
.ov3-h240{height:240px}
/* 非图表卡（概况 / 对账 / 覆盖率 / 合作豁免）卡身定高 240px＝与图容器同高，超出卡内滚动。
   注意必须写 flex-basis：.ov3-b 自带 `flex:1`（＝flex-basis:0%），此时 height 会被忽略、
   卡片仍按内容高（实测 240 / 264 / 292 三种）。改成 flex:0 0 240px 才真正定高。 */
.dg-page .ov3-b.ovz-fix{flex:0 0 240px;height:240px;overflow:auto;overflow-x:hidden}
/* —— ② 字号收敛：卡片内只用 14.5 / 13 / 12 / 11.5 —— */
.dg-page .ov3-card .bp-table{font-size:12px}
.dg-page .ov3-card .bp-table th{font-size:11px}
.dg-page .ov3-card .bp-table td{font-size:12px}
.dg-page .ov3-card .bp-tag{font-size:11px}
.dg-page .ovz-mini-i .k{font-size:12px}
.dg-page .ovz-mini-i .v{font-size:11px}
.dg-page .ovz-mini-i .v b{font-size:12px}
.dg-page .ovz-sub{font-size:12px}
.dg-page .ovz-sub em{font-size:11px}
.dg-page .ovz-sub u{font-size:11px}
.dg-page .ck-s{font-size:12px}
.dg-page .ck-s b{font-size:12px}
.dg-page .ovz-pg b{font-size:12px}
.dg-page .ovz-rank .bp-rank-n{font-size:12px}
.dg-page .ovz-rank .bp-rank-v b{font-size:12px}
.dg-page .ovz-rank .bp-rank-v i{font-size:11px}
.dg-page .dg-none b{font-size:12px}
.dg-page .dg-none i{font-size:11px}
.dg-page .dg-sub{font-size:11px}
.dg-page .ov3-empty{font-size:12px;min-height:120px}
/* 订单卡片 / 分桶页签 / 下钻头 / 合作提示：原来各自 9.5~14px，统一到 12 与 11.5 两档 */
.dg-page .td-ocard-id,.dg-page .cyc-ocard-id,.dg-page .cat-ocard-id{font-size:12px}
.dg-page .td-ocard-cust,.dg-page .cyc-ocard-cust,.dg-page .cat-ocard-cust{font-size:12px}
.dg-page .td-ocard-date,.dg-page .cyc-ocard-date,.dg-page .td-ocard-pct,.dg-page .cyc-ocard-pct,.dg-page .cat-ocard-pct{font-size:12px}
.dg-page .td-ocard-st,.dg-page .cyc-ocard-st,.dg-page .cat-ocard-st{font-size:11px}
.dg-page .td-ocard-qty,.dg-page .cyc-ocard-qty,.dg-page .cat-ocard-qty{font-size:11px}
.dg-page .td-tab-waive,.dg-page .cyc-ocard-waive,.dg-page .cat-ocard-waive{font-size:11px}
.dg-page .td-tab,.dg-page .cyc-tab,.dg-page .cat-tab{font-size:12px;padding:6px 14px}
.dg-page .td-tab-count,.dg-page .cyc-tab-count,.dg-page .cat-tab-count{font-size:12px}
.dg-page .td-coop-hint b{font-size:12px}
.dg-page .td-coop-hint i{font-size:11px}
.dg-page .dg-coop-hd i{font-size:11px}
.dg-page .dg-coop-hd b{font-size:12px}
.dg-page .dg-drill-hd b{font-size:12px}
.dg-page .dg-drill-hd span{font-size:11px}
.dg-page .dg-drill-hd button{font-size:11px}
.dg-page .dg-none b{font-size:12px}
.dg-page .dg-none i{font-size:11px}
.dg-page .dg-none-ico{font-size:12px}
.dg-page .bp-rank-i{font-size:11px}
.dg-page .ovz-footbar{font-size:11px;line-height:1.55;color:var(--ui-ink-400)}
.dg-page .ovz-footbar b{color:var(--ui-ink-500);font-weight:700}
/* 空状态统一：一句灰字 +（可选）小字解释，不留空白卡 */
.dg-page .ov3-empty,.dg-page .live-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;min-height:120px;height:100%;padding:18px 12px;text-align:center;color:var(--ui-ink-400);font-size:12px;line-height:1.6}
.dg-page .live-empty svg{width:22px;height:22px;opacity:.45;margin-bottom:2px}
.dg-page .live-empty div{font-size:12px;font-weight:700;color:var(--sk-ink-3)}
.dg-page .live-empty p{font-size:11px;margin:0;max-width:420px;color:var(--ui-ink-300)}
/* 卡内滚动条（定高卡身）保持细弱，不抢视线 */
.dg-page .ov3-b.ovz-fix::-webkit-scrollbar{width:8px}
.dg-page .ov3-b.ovz-fix::-webkit-scrollbar-thumb{background:rgba(28,28,28, .14);border-radius:8px}
/* —— ③ 页首紧凑工具条 .ovz-strip（今日行动砖 + 筛选片 + 下钻容器；不是 .ov3-card） ——
   实测总高：8(pad) + 54(砖) + 6(gap) + 30(筛选片) + 8(pad) = 106px ≤ 120px 目标。 */
.ovz-strip{display:flex;flex-direction:column;gap:6px;padding:8px 12px;border-radius:14px;background:var(--ui-bg-card);
  border:1px solid rgba(28,28,28, .075);box-shadow:0 1px 2px rgba(28,28,28, .04),0 10px 26px -24px rgba(28,28,28, .35)}
.ovz-strip .dg-acts{gap:8px}
.ovz-strip .dg-g.is-compact{padding:6px 12px;gap:2px;border-radius:10px;min-height:54px;justify-content:center}
.ovz-strip .dg-g.is-compact .dg-g-d1{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0}
.ovz-strip .dg-g.is-compact .dg-g-k{font-size:11px;font-weight:800;color:var(--sk-ink-2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ovz-strip .dg-g.is-compact .dg-g-go{margin-top:0;flex:none;font-size:11px;font-weight:800}
.ovz-strip .dg-g.is-compact .dg-g-d2{display:flex;align-items:baseline;gap:8px;min-width:0}
/* 砖上的数值用 14.5px —— 与卡片标题同档，整页字号种类因此收敛到 4 档（11.5 / 12 / 13 / 14.5） */
.ovz-strip .dg-g.is-compact .dg-g-v b{font-size:14px;line-height:1.15;letter-spacing:-.2px}
.ovz-strip .dg-g.is-compact .dg-g-v i,.ovz-strip .dg-g.is-compact .dg-g-v em{font-size:11px}
.ovz-strip .dg-g.is-compact .dg-g-s{font-size:11px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ui-ink-400)}
.ovz-strip .sp-seg{flex-wrap:wrap;gap:6px}
.ovz-strip .sp-seg-item{font-size:12px;padding:4px 12px}
.ovz-strip .live-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:17px;padding:0 6px;
  border-radius:999px;background:rgba(68,68,68, .07);color:inherit;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}
.ovz-strip .sp-seg-item.active .live-count{background:rgba(68,68,68, .10);color:var(--brand)}
.ovz-strip .dg-drill{margin-top:0}
/* 交期试算工具卡（页尾工具，不是看板卡）：外观与 .ov3-card 同款，但不计入「卡片」统计 */
.dg-page .ovz-tool{background:var(--ui-bg-card);border-radius:16px;padding:14px 16px;
  box-shadow:0 1px 2px rgba(28,28,28, .04),0 14px 32px -26px rgba(28,28,28, .55)}
.dg-page .c-dg-tool h3{font-size:14px}
.dg-page .c-dg-tool .dg-tool-note{font-size:11px}
/* —— ④ 「生产动态」事件行减噪：47px → 40px，一行只剩 4 段文字 ——
   第四十轮的行有 9 段（chip / 订单号 / 客户 / 当前工序 / 交期+相对天数 / 条数 / 说明长句 /
   提交人·节点 / 时间 + 明细），每行 91~104 字符、47px，扫读要横穿 9 列。
   本轮：chip → 订单号 → 客户 → 一句关键信息 →〔弹性留白〕→ 时间 + 明细 = 6 个元素、~46 字符。
   被删的三样（条数 / 提交人·节点 / 说明）进了行 title 与「明细 →」抽屉，信息不丢。 */
.dg-page .live-rows{border:1px solid rgba(28,28,28, .075);border-radius:12px;background:var(--ui-bg-card);overflow:hidden}
.dg-page .live-group{height:24px;padding:0 14px;font-size:11px;gap:6px}
.dg-page .live-group b{font-size:11px}
.dg-page .live-group i{font-size:11px}
.dg-page .live-row{height:40px;gap:8px;padding:0 12px 0 14px}
.dg-page .live-row:hover{background:var(--ui-brand-050)}
.dg-page .live-chip{flex:0 0 64px;height:18px;padding:0 6px;border-radius:4px;font-size:12px;font-weight:700}
.dg-page .live-oid{flex:0 0 96px;font-size:13px;font-weight:800;color:var(--ui-ink-900);font-family:var(--mono);letter-spacing:.2px}
.dg-page .live-cust{flex:0 1 220px;min-width:110px;font-size:12px;font-weight:600;color:var(--ui-ink-700)}
.dg-page .live-key{flex:0 1 auto;min-width:0;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--sk-ink-2);white-space:nowrap;overflow:hidden}
.dg-page .live-key .live-dot{font-style:normal;color:var(--ui-line-200);flex:none}
.dg-page .live-key .live-k1,.dg-page .live-key .live-k2{color:var(--sk-ink-2)}
.dg-page .live-key .live-k3{font-weight:800;color:var(--ui-ink-500)}
.dg-page .live-key .live-k3.is-over{color:var(--ui-danger-solid)}
.dg-page .live-key .live-k3.is-coop{color:var(--ui-ink-500)}
.dg-page .live-key .live-k0{color:var(--ui-ink-300)}
.dg-page .live-key .live-flag{flex:none;height:18px;padding:0 6px;border-radius:4px;font-size:11px;font-weight:800;
  background:rgba(118,118,118, .12);color:var(--ui-ink-500);display:inline-flex;align-items:center}
.dg-page .live-when{flex:0 0 56px;font-size:12px;color:var(--ui-ink-400);text-align:right}
.dg-page .live-open{flex:0 0 52px;font-size:12px;font-weight:800;color:var(--brand);text-align:right}
.dg-page .ck-more{font-size:11px;line-height:1.6}
/* 窄屏只让「客户」和「关键信息」让位，chip / 订单号 / 时间 / 明细 始终在 */
@media (max-width:1280px){
  .dg-page .live-cust{flex:0 1 150px}
  .dg-page .live-key{flex:0 1 260px}
}
/* —— ⑤ 用色收敛：语义 chip / 标签 / 行动砖统一到 5 个色相族（红 橙 蓝 青 灰蓝）+ 中性灰 ——
   把第四十轮散布的 #DC2626 / #c62828 / #0A7391 / #5e5e5e / #7b7b7b / var(--sk-ink-3) 全部归并，
   同一屏出现的彩色元素不再各说各话（每页彩色色相族 ≤5）。 */
.ovz-strip .dg-g.tone-a{background:var(--ui-bg-soft);border-color:var(--pl-pink-bg)}
.ovz-strip .dg-g.tone-a .dg-g-v b,.ovz-strip .dg-g.tone-a .dg-g-go{color:var(--ui-danger-solid)}
.ovz-strip .dg-g.tone-c{background:var(--ui-bg-soft);border-color:var(--ui-warn-line)}
.ovz-strip .dg-g.tone-c .dg-g-v b,.ovz-strip .dg-g.tone-c .dg-g-go{color:var(--ui-warn-ink)}
.ovz-strip .dg-g.tone-b{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.ovz-strip .dg-g.tone-b .dg-g-v b,.ovz-strip .dg-g.tone-b .dg-g-go{color:var(--sk-accent)}
.ovz-strip .dg-g.tone-n{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.ovz-strip .dg-g.tone-n .dg-g-v b,.ovz-strip .dg-g.tone-n .dg-g-go{color:var(--pl-cyan)}
.ovz-strip .dg-g.tone-q{background:var(--sk-soft);border-color:var(--ui-line-200)}
.ovz-strip .dg-g.tone-q .dg-g-v b,.ovz-strip .dg-g.tone-q .dg-g-go{color:var(--ui-ink-500)}
.ovz-strip .dg-g.tone-u{background:var(--sk-soft);border-color:var(--ui-line-200)}
.ovz-strip .dg-g.tone-u .dg-g-v b,.ovz-strip .dg-g.tone-u .dg-g-go{color:var(--ui-ink-500)}
.dg-page .bp-tag.tone-a{color:var(--ui-danger-solid)!important;background:rgba(220,38,38,.10)!important;border-color:rgba(220,38,38,.22)!important}
.dg-page .bp-tag.tone-c{color:var(--ui-warn-ink)!important;background:rgba(217,119,6,.13)!important;border-color:rgba(217,119,6,.28)!important}
.dg-page .bp-tag.tone-b{color:var(--sk-accent)!important;background:rgba(134,134,134, .10)!important;border-color:rgba(134,134,134, .22)!important}
.dg-page .bp-tag.tone-q{color:var(--ui-ink-500)!important;background:rgba(118,118,118, .11)!important;border-color:rgba(118,118,118, .22)!important}
.dg-page .live-row.tone-late{--live-stripe:var(--ui-danger-solid);--live-ink:var(--ui-danger-solid);--live-soft:rgba(220,38,38,.10)}
.dg-page .live-row.tone-coop{--live-stripe:rgba(118,118,118, .85);--live-ink:var(--ui-ink-500);--live-soft:rgba(118,118,118, .12)}
.dg-page .live-row.tone-audit{--live-stripe:var(--pl-cyan);--live-ink:var(--pl-cyan);--live-soft:rgba(12,154,184,.10)}
.dg-page .live-row.tone-flow{--live-stripe:var(--sk-accent);--live-ink:var(--sk-accent);--live-soft:rgba(134,134,134, .10)}
/* 「最新一条」行脚那条 ck-more / 分组小字保持中性灰 */
.dg-page .ck-more,.dg-page .ck-more b{color:var(--ui-ink-400)}
.dg-page .ck-more b{color:var(--ui-ink-500)}
/* —— ⑥「在制概况」卡里的「缺失工序」胶囊行（替代原来 8 行 0 单空条，一屏读完不裁行） —— */
.pm-miss{display:flex;flex-wrap:wrap;gap:6px}
.pm-miss-i{display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:6px;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;font-weight:700;white-space:nowrap}
.pm-miss.is-ok .pm-miss-i{background:var(--ui-bg-page);border-color:var(--ui-line-200);color:var(--ui-ink-500)}

/* ============================================================================
   ★ 2026-09-27 工序信息流页签（dashboard tab=flow · public/flow.js）
   设计语言不新增体系：卡片＝.ov3-card、表＝.bp-table、标签＝.bp-tag、工具条＝.ovz-strip、
   色相族仍只用 红 #E04553 / 橙 #E8A33D / 蓝 var(--sk-accent) / 青 #0C9AB8 / 灰蓝 #5e5e5e 五个。
   本段只做三件事：① 让本页的定高卡装得下长表；② 流转单元表与五工序链小片；
   ③ 对账等式与缺口清单的排版。所有规则都限定在 .flow-page 作用域内，不影响其它页签。
   ============================================================================ */
/* ① 定高卡：本页的「流转单元 / 异常路径 / 缺口」三张卡内容高度差异大，
      统一改成内容自适应 + 卡内滚动（第四十一轮的 240px 定高是给图表卡的，套在长表上会只露 4 行）。 */
.dg-page.flow-page .ov3-b.ovz-fix{flex:0 0 auto!important;height:auto!important;max-height:none!important;overflow:visible!important}
.dg-page.flow-page .ov3-card .bp-table{font-size:12px}
/* 异常路径 11 行 / 缺口 6 项都要能一屏读完，不留半截行 */
.flow-scroll{max-height:382px;overflow:auto}

/* ② 流转单元卡：筛选/搜索/翻页条 + 表格 */
.flow-unit-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:0 0 10px;border-bottom:1px solid var(--ui-line-100);font-size:11px;color:var(--ui-ink-500)}
.flow-filters{font-weight:700;color:var(--ui-ink-500)}
.flow-tools{display:flex;align-items:center;gap:6px;margin-left:auto}
.flow-input{height:26px;width:200px;padding:0 10px;border-radius:8px;border:1px solid var(--ui-line-200);
  background:var(--ui-bg-card);font-size:11px;color:inherit;font-family:inherit}
.flow-input:focus{outline:none;border-color:var(--sk-accent);box-shadow:0 0 0 3px rgba(134,134,134, .12)}
.flow-pg{height:26px;padding:0 10px;border-radius:8px;border:1px solid var(--ui-line-200);background:var(--sk-soft);
  color:var(--ui-ink-500);font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap}
.flow-pg:hover:not(:disabled){background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
.flow-pg:disabled{opacity:.45;cursor:not-allowed}
.flow-pg.is-on{background:rgba(134,134,134, .12);border-color:rgba(134,134,134, .34);color:var(--ui-brand-600)}
.flow-muted{color:var(--ui-ink-400);font-size:11px}
/* 工段队列「上游已下机」列：可能有多路来源（氨解后按路由分流），用紧凑片并排 */
.flow-up{display:inline-flex;align-items:baseline;gap:4px;margin-right:8px;white-space:nowrap}
.flow-up i{font-style:normal;font-size:11px;color:var(--ui-ink-300);font-weight:700}
.flow-up b{font-size:13px;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-stuck{color:var(--ui-danger-solid);font-weight:700}
.dg-page.flow-page .dg-row.is-stuck .bp-tbl-nm{color:var(--ui-danger-solid)}
/* 行内写动作按钮（本页唯一的两个写入口） */
.flow-btn{height:24px;padding:0 10px;border-radius:6px;border:1px solid var(--ui-line-200);background:var(--ui-bg-card);
  color:var(--ui-ink-500);font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap}
.flow-btn:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
.flow-btn.is-primary{background:linear-gradient(135deg,var(--sk-accent),var(--pl-cyan));border-color:transparent;color:#fff}
.flow-btn.is-primary:hover{filter:brightness(1.06)}

/* 五工序链路小片：合成›氨解›接酯›纯化›分装，当前工段描边加粗，
   已完成＝青色实底、进行中＝蓝色描边、待上机＝橙色描边、挂起＝红色描边、不经过＝极浅灰虚线 */
.flow-chain{display:inline-flex;align-items:center;gap:2px}
.flow-ch{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;border-radius:6px;
  font-size:11px;font-weight:700;background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--ui-ink-300)}
.flow-ch.is-na{background:var(--sk-soft);border-style:dashed;border-color:var(--ui-line-100);color:var(--ui-line-200)}
.flow-ch.is-done{background:rgba(12,154,184,.13);border-color:rgba(12,154,184,.30);color:var(--pl-cyan)}
.flow-ch.is-run{background:rgba(134,134,134, .13);border-color:rgba(134,134,134, .34);color:var(--sk-accent)}
.flow-ch.is-pend{background:rgba(217,119,6,.14);border-color:rgba(217,119,6,.36);color:var(--ui-warn-ink)}
.flow-ch.is-hold{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.34);color:var(--ui-danger-solid)}
.flow-ch.is-cur{box-shadow:0 0 0 2px rgba(118,118,118, .20);font-weight:800}
.flow-ch-sep{font-style:normal;color:var(--ui-line-200);font-size:11px;line-height:1}

/* ③ 跨工段对账：每条等式一行三栏（左值 / 等号 / 右值之和 + 差值）。
   宽屏（≥1500px）排两列：实测单列时这张卡 2,253px＝两屏多，两列后约 1,150px，一屏能读大半。
   窄屏自动退回单列，不引入第二种卡片高度（等式块高度自适应，行内等高由 grid 保证）。 */
.flow-eqs{display:flex;flex-direction:column;gap:10px}
@media (min-width:1440px){
  .flow-eqs{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch}
  .flow-eqs .flow-eq{display:flex;flex-direction:column}
  .flow-eqs .flow-eq .ov3-foot{margin-top:auto;padding-top:8px}
}
.flow-eq{border:1px solid var(--ui-line-100);border-radius:12px;padding:10px 12px;background:var(--ui-bg-card)}
.flow-eq.is-ok{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.flow-eq.is-bad{background:var(--ui-danger-bg);border-color:var(--ui-danger-line)}
.flow-eq.is-info{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.flow-eq-hd{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ui-ink-700);margin-bottom:8px}
.flow-eq-badge{display:inline-flex;align-items:center;height:19px;padding:0 8px;border-radius:6px;
  font-size:11px;font-weight:800;background:var(--ui-line-100);color:var(--ui-ink-500);white-space:nowrap}
.flow-eq.is-ok .flow-eq-badge{background:rgba(12,154,184,.13);color:var(--pl-cyan)}
.flow-eq.is-bad .flow-eq-badge{background:rgba(220,38,38,.12);color:var(--ui-danger-solid)}
.flow-eq.is-info .flow-eq-badge{background:rgba(134,134,134, .10);color:var(--ui-ink-500)}
.flow-eq-bd{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}
.flow-eq-l,.flow-eq-r{display:flex;flex-direction:column;gap:2px;font-size:11px;color:var(--ui-ink-400);line-height:1.5}
.flow-eq-l b,.flow-eq-r b{font-size:13px;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-eq-rs{display:flex;flex-direction:column;gap:4px}
.flow-eq-op{font-size:14px;font-weight:800;color:var(--ui-ink-400);padding-top:2px}
.flow-eq-df{margin-left:auto;font-size:11px;color:var(--ui-ink-400);white-space:nowrap}
.flow-eq-df b{font-size:14px;font-variant-numeric:tabular-nums;color:var(--ui-ink-500)}
.flow-eq.is-ok .flow-eq-df b{color:var(--pl-cyan)}
.flow-eq.is-bad .flow-eq-df b{color:var(--ui-danger-solid)}
.flow-eq .ov3-foot{margin-top:8px}

/* ④ 异常路径 / 缺口清单 */
.flow-exc-note{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.flow-cnt{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 10px;border-radius:6px;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;font-weight:700;white-space:nowrap}
.flow-cnt b{color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-gap{border:1px solid var(--ui-bg-page);border-radius:12px;padding:10px 12px;margin-bottom:8px;background:var(--ui-bg-card)}
/* 6 条缺口在宽屏排两列：单列时整卡 1,100px 以上，两列约 620px，与「异常路径」卡高度接近 */
.flow-gaps{display:flex;flex-direction:column}
@media (min-width:1440px){
  .flow-gaps{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:start}
  .flow-gaps .flow-gap{margin-bottom:0}
}
.flow-gap-t{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ui-ink-700);margin-bottom:6px}
.flow-gap-n{display:inline-flex;align-items:center;height:19px;padding:0 8px;border-radius:6px;
  background:rgba(217,119,6,.14);color:var(--ui-warn-ink);font-size:11px;font-weight:800;white-space:nowrap}
.flow-gap-r{display:flex;gap:8px;font-size:11px;line-height:1.6;color:var(--ui-ink-400)}
.flow-gap-r>span{flex:0 0 68px;font-weight:700;color:var(--ui-ink-400)}
.flow-gap-r>div{flex:1;min-width:0}
.flow-gap-r.is-need>span{color:var(--pl-cyan)}
.flow-gap-r.is-need>div{color:var(--ui-ink-500)}
/* ★ 2026-09-27 本轮：缺口卡按「能否本地实现」分三档着色（已实现=青、部分实现=橙、需平台补=灰蓝），
   并给出「依据（实测）/ 本轮做了什么 / 仍需平台补」三段。只加类，不改既有版式。 */
.flow-gap.is-done{border-color:var(--ui-line-200);background:var(--ui-bg-soft)}
.flow-gap.is-partial{border-color:var(--ui-warn-line);background:var(--ui-warn-bg)}
.flow-gap-n.is-done{background:rgba(12,154,184,.14);color:var(--pl-cyan)}
.flow-gap-n.is-partial{background:rgba(217,119,6,.18);color:var(--ui-warn-ink)}
.flow-gap-n.is-need{background:rgba(118,118,118, .12);color:var(--ui-ink-500)}
.flow-gap-r.is-done>span{color:var(--pl-cyan)}
.flow-gap-r.is-done>div{color:var(--ui-ink-500)}
/* 溯源与运行区间（异常路径卡内的一块，紧跟在返工/补合/重合/交接表之后） */
.flow-trace{margin-top:10px;border-top:1px dashed var(--ui-line-100);padding-top:8px}
.flow-trace-hd{font-size:11px;font-weight:800;color:var(--sk-ink-2);margin-bottom:6px}
.flow-trace .bp-table{margin-top:6px}

/* ⑤ 口径总说明 */
.flow-meta{font-size:12px;line-height:1.85;color:var(--ui-ink-500)}
.flow-meta-i{margin-top:6px;font-size:11px;color:var(--ui-ink-300)}

/* ============================================================================
   ★ 2026-09-27 第二轮：按参考平台 viewConfig 出列「工段 × 视图键」卡片
   平台每个工段的状态卡取值集合与卡名都不同（合成 completed=待氨解、氨解 completed=已测OD、
   纯化 collected=待分装 …），因此工段队列不再是 5×5 矩阵，而是**每工段一行、行内放它自己的卡**。
   色相族沿用同一套：挂起＝红、补合待确认＝橙、待上机/待处理＝蓝、待测OD/待测量＝青、完成类＝青绿实底。
   ============================================================================ */
.flow-vc{display:inline-flex;align-items:baseline;gap:6px;height:30px;padding:0 10px;margin:0 6px 4px 0;
  border-radius:8px;border:1px solid var(--ui-line-100);background:var(--sk-soft);cursor:pointer;white-space:nowrap;
  font-size:11px;color:var(--sk-ink-2);font-weight:700;transition:background .12s,border-color .12s}
.flow-vc:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
.flow-vc b{font-size:14px;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-vc i{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.flow-vc.is-on{background:rgba(134,134,134, .12);border-color:rgba(134,134,134, .34);color:var(--ui-brand-600)}
.flow-vc.is-done{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.flow-vc.is-done b{color:var(--pl-cyan)}
.flow-vc.is-hold{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.flow-vc.is-hold b{color:var(--ui-danger-solid)}
.flow-vc.is-od{background:var(--ui-bg-soft);border-color:var(--pl-cyan-bg)}
.flow-vc.is-od b{color:var(--pl-cyan)}
.flow-vc.is-supp{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-vc.is-supp b{color:var(--ui-warn-ink)}
.flow-vc.is-gap{background:var(--ui-bg-card);border-style:dashed;border-color:var(--ui-line-100);color:var(--ui-ink-300);cursor:not-allowed}
.flow-vc.is-gap b{color:var(--ui-line-200)}
.flow-vc.is-zero b{color:var(--ui-ink-400)}
/* 工段行：工段名 + 该工段自己的视图卡 + 队列存量 + 上游已下机 */
.flow-qrow td{vertical-align:middle}
.flow-qst{font-weight:800;color:var(--ui-ink-700);font-size:12px;white-space:nowrap}
.flow-qst i{display:block;font-style:normal;font-size:11px;color:var(--ui-ink-400);font-weight:600}
.flow-vwrap{display:flex;flex-wrap:wrap;align-items:center}
.flow-note{font-size:11px;color:var(--ui-ink-400);line-height:1.55;margin-top:2px;max-width:760px}
/* 动作栏：本页唯一写入口。need='gap' 的按钮一律禁用并把平台实现写进 title。 */
.flow-acts{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.flow-btn.is-gap{background:var(--ui-bg-card);border-style:dashed;border-color:var(--ui-line-100);color:var(--ui-line-200);cursor:not-allowed}
.flow-btn.is-gap:hover{background:var(--ui-bg-card);border-color:var(--ui-line-100);color:var(--ui-line-200)}
.flow-holdhint{font-size:11px;color:var(--ui-ink-400);line-height:1.5;max-width:210px;display:inline-block}
/* 流转单元卡里的一级筛选：当前工段的视图键 */
.flow-viewbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;width:100%;padding-top:8px;
  border-top:1px dashed var(--ui-line-100);margin-top:2px}
.flow-viewbar>span.lb{font-size:11px;font-weight:700;color:var(--ui-ink-400);margin-right:2px}

/* ============================================================================
   ★ 2026-09-28 第四十五轮：「跨工段对账」页（dashboard tab=flow · public/flow.js）
   ------------------------------------------------------------
   上一轮本页被做成了**第二个工序作业台**（工序切换 + 左设备网格 + 右上四状态计数 +
   动作按钮 + 搜索筛选 + 主表），而左侧「产线执行」下早有合成/氨解/接酯/纯化/分装五个
   真实作业台 —— 属于重复建设，用户明确批评过。本轮把这些与产线执行重复的作业功能
   连同它们的 CSS **全部删除**，本页退化为单一的对账页。
   删除的规则块：.wb-wrap/.wb-left/.wb-right/.wb-dev*/.wb-dot/.wb-slot*/.wb-actbar/
   .wb-selinfo/.wb-act/.wb-hint/.wb-searchbar/.wb-tablewrap/.wb-ck*/.wb-tr/.wb-st*/.wb-num/
   .wb-last/.wb-batch/.wb-fold*（共 90 余条，全部限定在 .dg-page.flow-page 作用域内）。
   保留并继续使用的规则：.flow-eqs/.flow-eq*（守恒等式）、.flow-vc*/.flow-qrow/.flow-qst/
   .flow-vwrap/.flow-note（工段队列状态卡）、.flow-gap*（缺口清单）、.flow-exc-note/
   .flow-cnt/.flow-trace*（异常路径与溯源）、.flow-unit-meta/.flow-filters/.flow-tools/
   .flow-input/.flow-pg/.flow-muted/.flow-up/.flow-scroll（下钻工具条与只读列表）、
   .flow-page 的定高卡修正。色相族仍只用红 var(--ui-danger-solid) / 橙 var(--ui-warn-solid) / 蓝 var(--sk-accent) /
   青 var(--pl-cyan) / 灰蓝 var(--ui-ink-500) 五个，不新增体系。
   ============================================================================ */
/* 只读下钻区：紧跟在页首工具条下方，用一条浅色分隔线把它与「工具条」分开 */
.dg-page.flow-page .dg-drill{padding-top:2px}
.dg-page.flow-page .dg-drill .flow-unit-meta{margin-bottom:6px}
/* 对账等式的差值在本页是主角：数字放大一档，便于一眼看出非 0 */
.dg-page.flow-page .flow-eq-df b{font-size:14px;font-weight:800}

/* ============================================================================
   ★ 2026-09-28 第四十六轮：「跨工段对账」页（dashboard tab=flow · public/flow.js）可视化精修
   ----------------------------------------------------------------------------
   用户批评（原话）：「跨工段对账这个模块好好优化一下，真的太乱了，全是一堆文字」。
   改前那一屏里有：两条状态行（app.js statusBanner 的 .ov-hero + flow.js 的 .ovz-strip）、
   10 个等式块（每块下面压一段解释小字）、工段队列表（每行一段机制说明）、缺口卡 1,660px 高的清单。
   本轮**只做呈现层重构**（口径与后端计算一律不动，数字与说明文字只搬家/折叠）：
     ① 顶上两条状态行合并成一行 chip：.ov-hero 的子节点被 flowAdoptTopBar() 原样搬进 #flowSrcRow，
        口径说明改由 .flow-chip-i 的 ⓘ 悬停 + 页底折叠区承载
     ② 新增 KPI 数字带 .flow-kpis（7 张大数字卡：大号 tabular 数字 + 单位 + 一行口径 + 状态灯）
     ③ 新增跨工段流向图 .flow-pipe（五段管道 合成→氨解→接酯→纯化→分装，段间「移交 N 条」+ 箭头，
        节点带状态灯，点开 .flow-pdetail 看差异构成）
     ④ 守恒等式改成表 .flow-eqtab（一行一条：状态灯 | 工段/等式 | 上游投入(左值口径) | 左值 |
        本段完成·在制(右值构成) | 差 | ⓘ）
     ⑤ 工段队列：状态卡按「在列 / 缺口 / 其它」分组(.flow-vgrp)、新增「本段待办」列、机制说明两行截断(.flow-clamp2)
     ⑥ 页底折叠区 .flow-notes（默认收起，展开见全部原文）
   色相族仍只用系统既有五个：红 #E04553 / 橙 #E8A33D(#B8791A) / 蓝 var(--sk-accent) / 青 #0C9AB8 / 灰蓝 #5e5e5e；
   圆角与阴影沿用 .ov3-card（18px / 无边框 / 同款阴影）与 .ovz-strip（14px），强调色用 var(--grad)，不新增卡片皮肤。
   注：上一轮的 .flow-eqs / .flow-eq / .flow-eq-hd / .flow-eq-bd / .flow-eq-l / .flow-eq-rs / .flow-eq-op /
   .flow-eq-df 规则（等式块版式）本轮已无引用，规则块保留未删，仅作历史留痕。
   ============================================================================ */
/* —— ① 页首一行 chip：数据源 · 更新时间 · 自动刷新 · 口径说明 ⓘ —— */
.dg-page.flow-page .ovz-strip{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 12px}
.dg-page.flow-page .ovz-strip-acts{flex:1 1 auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-width:0}
.dg-page.flow-page .ovz-strip-seg{flex:0 0 auto;margin-left:auto}
.dg-page.flow-page #flowDrill{flex:1 0 100%}
.flow-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-width:0;font-size:12px;color:var(--sk-ink-2)}
.flow-chips>*{white-space:nowrap}
.flow-chips label{display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none;color:var(--sk-ink-2)}
.flow-chip-i{flex:0 0 auto;display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:6px;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;font-weight:700;cursor:help;white-space:nowrap}
.flow-chip-i:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
/* 1366 宽度下这一行要挤得下「数据源 + 更新时间 + 自动刷新 + 口径说明 + 作业台跳转」全部 chip，
   故窄屏缩小字号与间距（内容一个不少，只压间距）—— 实测 1366 仍为一行。 */
@media (max-width:1440px){
  .dg-page.flow-page .ovz-strip{gap:6px 8px;padding:6px 10px}
  .dg-page.flow-page .ovz-strip-acts{gap:6px 8px}
  .flow-chips{gap:4px 8px;font-size:11px}
  .flow-chips label{font-size:11px}
  .flow-chip-i{height:20px;padding:0 8px;font-size:11px}
  .dg-page.flow-page .ovz-strip .sp-seg-item{font-size:11px;padding:4px 8px}
}

/* —— ② KPI 数字带：7 张大数字卡（大号 tabular 数字 + 单位 + 一行口径 + 状态灯） —— */
.flow-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(198px,1fr));gap:10px;margin:0 0 12px}
.flow-kpic{position:relative;padding:10px 12px 10px;border-radius:14px;background:var(--ui-bg-card);
  border:1px solid rgba(28,28,28, .075);box-shadow:0 1px 2px rgba(28,28,28, .04),0 10px 26px -22px rgba(28,28,28, .35)}
.flow-kpic.is-ok{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.flow-kpic.is-a{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-kpic.is-x{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.flow-kpic.is-q{background:var(--ui-bg-card)}
.flow-kpic-t{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:var(--sk-ink-2);white-space:nowrap}
.flow-dot{width:7px;height:7px;border-radius:50%;background:var(--ui-ink-400);flex:none}
.flow-kpic.is-ok .flow-dot{background:var(--pl-cyan);box-shadow:0 0 0 3px rgba(12,154,184,.14)}
.flow-kpic.is-a .flow-dot{background:var(--ui-warn-solid);box-shadow:0 0 0 3px rgba(217,119,6,.18)}
.flow-kpic.is-x .flow-dot{background:var(--ui-danger-solid);box-shadow:0 0 0 3px rgba(220,38,38,.16)}
.flow-kpic.is-n .flow-dot{background:var(--ui-ink-500)}
.flow-kpic.is-q .flow-dot{background:var(--ui-line-200)}
.flow-kpic-v{display:flex;align-items:baseline;gap:6px;margin-top:4px}
.flow-kpic-v b{font-size:28px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.9px;line-height:1.06;
  font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1}
.flow-kpic-v i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-300)}
.flow-kpic-s{font-size:11px;color:var(--ui-ink-300);line-height:1.5;margin-top:4px}

/* —— ③ 跨工段流向图：横向五段管道（>1500px）—— */
.flow-pipe-lg{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px}
.flow-lg{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 10px;border-radius:6px;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;font-weight:700;white-space:nowrap}
.flow-lg::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ui-ink-400);flex:none}
.flow-lg.is-ok::before{background:var(--pl-cyan)}
.flow-lg.is-warn::before{background:var(--ui-warn-solid)}
.flow-lg.is-mute::before{background:var(--ui-line-200);border:1px dashed var(--ui-ink-300);background:transparent}
.flow-lg.is-n{background:var(--ui-bg-card);border-style:dashed}
.flow-lg.is-n::before{display:none}
.flow-pipe{display:flex;align-items:stretch;padding:2px 2px 6px}
.flow-pnode{flex:1 1 0;min-width:130px;border:1px solid var(--ui-line-100);border-radius:14px;background:var(--ui-bg-card);
  padding:10px 10px;cursor:pointer;transition:box-shadow .15s ease,border-color .15s ease}
.flow-pnode:hover{border-color:var(--ui-brand-100);box-shadow:0 8px 20px -16px rgba(28,28,28, .55)}
.flow-pnode.is-ok{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.flow-pnode.is-warn{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-pnode.is-mute{background:var(--ui-bg-card);border-style:dashed;border-color:var(--ui-line-100)}
.flow-pnode-hd{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px}
.flow-pnode-hd b{font-size:13px;font-weight:800;color:var(--ui-ink-700)}
.flow-pnode-dot{width:9px;height:9px;border-radius:50%;background:var(--ui-ink-400);flex:none}
.flow-pnode.is-ok .flow-pnode-dot{background:var(--pl-cyan);box-shadow:0 0 0 3px rgba(12,154,184,.14)}
.flow-pnode.is-warn .flow-pnode-dot{background:var(--ui-warn-solid);box-shadow:0 0 0 3px rgba(217,119,6,.18)}
.flow-pnode.is-mute .flow-pnode-dot{background:var(--ui-line-200);box-shadow:none}
.flow-pnode-n{display:flex;align-items:baseline;justify-content:space-between;gap:6px;padding:2px 0;border-bottom:1px dashed var(--ui-bg-page)}
.flow-pnode-n i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.flow-pnode-n b{font-size:16px;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1;letter-spacing:-.3px}
.flow-pnode-n.is-wip b{color:var(--sk-accent)}
.flow-pnode-n.is-out b{color:var(--pl-cyan)}
.flow-pnode-f{margin-top:6px;font-size:11px;font-weight:800;color:var(--sk-ink-2)}
.flow-pnode-f b{font-size:14px;font-variant-numeric:tabular-nums}
.flow-pnode-f.is-ok,.flow-pnode-f.is-ok b{color:var(--pl-cyan)}
.flow-pnode-f.is-warn,.flow-pnode-f.is-warn b{color:var(--ui-warn-ink)}
.flow-pnode-f.is-mute,.flow-pnode-f.is-mute b{color:var(--ui-ink-400)}
.flow-pnode-x{font-size:11px;color:var(--ui-ink-300);margin-top:4px;line-height:1.4}
.flow-plink{flex:0 0 96px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0 4px;text-align:center}
.flow-plink.has-split{flex:0 0 154px}
.flow-plink-ar{font-size:14px;font-weight:800;color:var(--ui-ink-300);line-height:1}
.flow-plink-n{font-size:11px;color:var(--ui-ink-400);white-space:nowrap}
.flow-plink-n b{font-size:13px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-plink-s{font-size:11px;color:var(--ui-ink-300);line-height:1.35;max-width:154px}
/* 窄屏（≤1500px）降级：横向管道 → 竖向管道，节点变一行一行，箭头旋转 90°，不裁切、不横向滚动 */
@media (max-width:1440px){
  .flow-pipe{flex-direction:column;padding:2px 0 6px}
  .flow-pnode{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;padding:8px 12px}
  .flow-pnode-hd{flex:0 0 84px;margin:0}
  .flow-pnode-n{display:inline-flex;align-items:baseline;gap:6px;border:0;padding:0}
  .flow-pnode-f{flex:1 1 auto;margin:0;text-align:right;border-left:1px solid var(--ui-line-100);padding-left:12px}
  .flow-pnode-x{flex:1 0 100%;margin:0}
  .flow-plink{flex:0 0 auto;width:100%;flex-direction:row;justify-content:flex-start;gap:8px;padding:2px 0 2px 16px;text-align:left}
  .flow-plink.has-split{flex:0 0 auto}
  .flow-plink-ar{transform:rotate(90deg)}
  .flow-plink-s{max-width:none}
}
/* 节点展开的差异构成（默认收起） */
.flow-pdetail{margin-top:10px;border:1px solid var(--ui-line-100);border-radius:14px;background:var(--ui-bg-card);padding:10px 12px}
.flow-pd-hd{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:12px}
.flow-pd-hd b{font-weight:800;color:var(--ui-ink-700)}
.flow-pd-hd span{font-size:11px;color:var(--ui-ink-400)}
.flow-pd-x{margin-left:auto;cursor:pointer;font-size:11px;font-weight:800;color:var(--sk-ink-2)}
.flow-pd-x:hover{color:var(--ui-brand-600)}
.flow-pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:1440px){.flow-pd-grid{grid-template-columns:1fr}}
.flow-pd-b{border:1px solid var(--ui-line-100);border-radius:12px;background:var(--ui-bg-card);padding:8px 10px}
.flow-pd-b.is-warn{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-pd-t{font-size:11px;font-weight:800;color:var(--sk-ink-2);margin-bottom:6px}
.flow-pd-p{font-size:11px;line-height:1.7;color:var(--ui-ink-500)}
.flow-pd-r{display:flex;gap:8px;font-size:11px;line-height:1.65;color:var(--ui-ink-500);margin-top:4px}
.flow-pd-r>i{flex:0 0 auto;font-style:normal;font-weight:800;color:var(--ui-ink-400)}
.flow-pd-eq{font-size:12px;color:var(--ui-ink-500);font-variant-numeric:tabular-nums}
.flow-pd-eq b{font-size:14px;font-weight:800;color:var(--ui-ink-900)}
.flow-pd-s{font-size:11px;color:var(--ui-ink-300);line-height:1.6;margin-top:4px}
.flow-pd-eq2{border-top:1px dashed var(--ui-line-100);padding-top:6px;margin-top:6px}
.flow-pd-eq2h{font-size:11px;font-weight:800;color:var(--ui-ink-700);line-height:1.5}
.flow-pd-eq2n{font-size:11px;color:var(--sk-ink-2);font-variant-numeric:tabular-nums;margin:4px 0}
.flow-pd-need{color:var(--ui-warn-ink)}
.flow-pd-vs{display:flex;flex-wrap:wrap}

/* —— ④ 守恒等式对照表：一行一条等式 —— */
.flow-eqwrap{overflow-x:auto}
.flow-eqtab{table-layout:fixed}
.flow-eqtab th{font-size:11px;font-weight:800;color:var(--sk-ink-2);white-space:nowrap}
.flow-eqtr td{vertical-align:top;padding-top:10px;padding-bottom:10px}
.flow-eqtr.is-bad{background:var(--ui-bg-card)}
.flow-eqlight{display:inline-flex;align-items:center;gap:6px;height:21px;padding:0 8px;border-radius:6px;
  background:var(--ui-line-100);color:var(--ui-ink-500);font-size:11px;font-weight:800;white-space:nowrap}
.flow-eqlight::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ui-ink-400);flex:none}
.flow-eqlight.is-ok{background:rgba(12,154,184,.13);color:var(--pl-cyan)}
.flow-eqlight.is-ok::before{background:var(--pl-cyan)}
.flow-eqlight.is-bad{background:rgba(220,38,38,.12);color:var(--ui-danger-solid)}
.flow-eqlight.is-bad::before{background:var(--ui-danger-solid)}
.flow-eqlight.is-info{background:rgba(134,134,134, .10);color:var(--ui-ink-500)}
.flow-eqlight.is-info::before{background:var(--ui-ink-500)}
.flow-eqst b{display:block;font-size:12px;font-weight:800;color:var(--ui-ink-700)}
.flow-eqst i{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-style:normal;font-size:11px;color:var(--ui-ink-300);line-height:1.45;margin-top:2px}
.flow-eql i{font-style:normal;font-size:11px;color:var(--ui-ink-400);line-height:1.5}
.flow-eqnum{font-size:14px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-eqrs{display:flex;flex-wrap:wrap;gap:6px}
.flow-eqc{display:inline-flex;align-items:baseline;gap:6px;padding:2px 8px;border-radius:8px;background:var(--ui-bg-soft);border:1px solid var(--ui-line-100)}
.flow-eqc i{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.flow-eqc b{font-size:12px;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.flow-eqdiff{font-size:18px;font-weight:800;color:var(--ui-ink-500);font-variant-numeric:tabular-nums;line-height:1.2}
.flow-eqdiff.is-ok{color:var(--pl-cyan)}
.flow-eqdiff.is-bad{color:var(--ui-danger-solid)}
.flow-eqdiff.is-info{color:var(--ui-ink-500)}
.flow-eqinfo{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;cursor:help}
.flow-eqinfo:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}

/* —— ⑤ 工段队列：状态卡分组 + 本段待办列 + 两行截断 —— */
.flow-qtab{table-layout:fixed}
.flow-qrow td{vertical-align:top;padding-top:10px;padding-bottom:10px}
.flow-vgrp{display:flex;align-items:flex-start;gap:6px;margin-bottom:4px}
.flow-vgrp-lb{flex:0 0 30px;font-size:11px;font-weight:800;color:var(--ui-ink-300);padding-top:8px;letter-spacing:.04em}
.flow-vgrp .flow-vwrap{flex:1;min-width:0}
.flow-qinfo{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;cursor:help;margin-top:6px}
.flow-qinfo:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
.flow-qnote .flow-clamp2{font-size:11px;color:var(--ui-ink-400);line-height:1.5}
.flow-qnote .flow-qledger{color:var(--ui-ink-300);margin-top:4px}
.flow-muted{color:var(--ui-ink-300)}
/* 通用两行截断（悬停由调用方的 title 给全文） */
.flow-clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* —— ⑥ 页底折叠区：本页口径总说明 · 口径与差异说明（默认收起） —— */
.flow-notes-tg{flex:0 0 auto;height:24px;padding:0 12px;border-radius:8px;border:1px solid var(--ui-brand-100);
  background:var(--ui-brand-050);color:var(--ui-brand-600);font-size:11px;font-weight:800;cursor:pointer}
.flow-notes-tg:hover{background:var(--ui-brand-050)}
.flow-notes-g{margin-bottom:10px;break-inside:avoid}
.flow-notes-gh{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;color:var(--sk-ink-2);margin-bottom:6px}
.flow-notes-gh::before{content:"";width:4px;height:13px;border-radius:4px;background:var(--grad);flex:none}
.flow-notes-i{border:1px solid var(--ui-line-100);border-radius:12px;background:var(--ui-bg-card);padding:8px 12px;margin-bottom:6px}
.flow-notes-ih{display:flex;align-items:baseline;gap:8px;font-size:11px;color:var(--ui-ink-700);margin-bottom:4px}
.flow-notes-ih b{font-weight:800}
.flow-notes-ih span{font-size:11px;color:var(--ui-ink-300);white-space:nowrap}
.flow-notes-ix{font-size:11px;line-height:1.75;color:var(--ui-ink-500)}
@media (min-width:1440px){
  #flowNotesBody{columns:2;column-gap:12px}
}

/* ============================================================================
   ★ 2026-09-28 第四十七轮：「缺口清单」1,660px 纯文字块 → 五段对照表（public/flow.js ③）
   ----------------------------------------------------------------------------
   用户上一轮原话「真的太乱了，全是一堆文字」；上一轮留了一处没动 —— 缺口清单 12 条 × 6 段长句。
   本轮把它改成表（行＝工段，五段齐全 + 跨工段；列＝状态灯 | 工段 | 缺口/差异条数 | 类型 |
   涉及板号/订单 | 责任归属 | 建议动作 | ⓘ），长句整条进 ⓘ（悬停浮层 + 点击行内展开）与页底折叠区。
   色相族仍只用系统既有五个：红 #E04553 / 橙 #E8A33D(#B8791A) / 蓝 var(--sk-accent) / 青 #0C9AB8 / 灰蓝 #5e5e5e。
   组件全部复用本页既有语言：表＝.bp-table、legend＝.flow-lg、chip＝.flow-vc 家族、原文块＝.flow-pd-r。
   ============================================================================ */
/* —— 图例：把本页三段语义 + 灰补全（红=真缺口 是本轮缺口表新增的一档，色值仍是既定红） —— */
.flow-lg.is-x::before{background:var(--ui-danger-solid)}
.flow-gapt-lg{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px}

/* —— 对照表本体：一行一个工段；表头/行高沿用 .bp-table，数字列右对齐 —— */
.flow-gaptab{table-layout:fixed}
/* 关键：全局 `.ov3-card .bp-table td`（特异度 0,2,1）有 overflow:hidden + white-space:nowrap
   + text-overflow:ellipsis，会把 chips 截成「…」、把 ⓘ 的悬停浮层裁掉 ——
   本表的单元格选择器必须**高于**那个特异度（.dg-page.flow-page .flow-gaptab td ＝ 0,3,1），
   否则「悬停读全文」根本看不到（本轮实测踩过这个坑）。 */
.dg-page.flow-page .flow-gaptab th{font-size:11px;font-weight:800;color:var(--sk-ink-2);white-space:nowrap}
.dg-page.flow-page .flow-gaptab td{overflow:visible;white-space:normal;vertical-align:top;padding-top:10px;padding-bottom:10px}
.flow-gapt-row.is-bad{background:var(--ui-bg-card)}

/* —— 状态灯（四档：青绿=无缺口 / 橙=口径差异·部分实现 / 红=真缺口 / 灰=本段暂无数据） —— */
.flow-glight{display:inline-flex;align-items:center;gap:6px;height:21px;padding:0 8px;border-radius:6px;
  background:var(--ui-line-100);color:var(--ui-ink-500);font-size:11px;font-weight:800;white-space:nowrap;cursor:help}
.flow-glight::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ui-ink-400);flex:none}
.flow-glight.is-ok{background:rgba(12,154,184,.13);color:var(--pl-cyan)}
.flow-glight.is-ok::before{background:var(--pl-cyan)}
.flow-glight.is-a{background:rgba(217,119,6,.15);color:var(--ui-warn-ink)}
.flow-glight.is-a::before{background:var(--ui-warn-solid)}
.flow-glight.is-x{background:rgba(220,38,38,.12);color:var(--ui-danger-solid)}
.flow-glight.is-x::before{background:var(--ui-danger-solid)}
.flow-glight.is-n{background:var(--ui-bg-page);color:var(--ui-ink-400);border:1px dashed var(--ui-line-200)}
.flow-glight.is-n::before{background:var(--ui-line-200)}
.flow-gmini{display:inline-flex;align-items:center;gap:4px;height:19px;margin-top:4px;padding:0 8px;border-radius:6px;
  font-size:11px;font-weight:800;white-space:nowrap;cursor:help;
  background:var(--ui-bg-page);color:var(--ui-ink-400);border:1px dashed var(--ui-line-200)}
.flow-gmini.is-n::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ui-line-200);flex:none}

/* —— 工段列 —— */
.flow-gapt-st b{display:block;font-size:12px;font-weight:800;color:var(--ui-ink-700)}
.flow-gapt-st i{display:block;font-style:normal;font-size:11px;color:var(--ui-ink-300);margin-top:2px}

/* —— 缺口/差异条数：大号等宽数字（tabular）+ 两行小字 —— */
.flow-gapt-n{display:flex;align-items:baseline;justify-content:flex-end;gap:4px}
.flow-gapt-n b{font-size:24px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.8px;line-height:1.05;
  font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1}
.flow-gapt-n i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-300)}
.flow-gapt-sub{font-size:11px;color:var(--ui-ink-300);text-align:right;line-height:1.5;margin-top:2px}
.flow-gapt-sub.is-warn{color:var(--ui-warn-ink);font-weight:800}

/* —— 类型 / 责任归属 chips（沿用 .flow-vc 家族尺寸，不另起皮） —— */
.flow-gc{display:inline-flex;align-items:center;gap:4px;height:19px;padding:0 8px;border-radius:6px;margin:0 4px 4px 0;
  font-size:11px;font-weight:800;white-space:nowrap;background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2)}
.flow-gc.is-x{background:rgba(220,38,38,.10);border-color:rgba(220,38,38,.22);color:var(--ui-danger-solid)}
.flow-gc.is-a{background:rgba(217,119,6,.13);border-color:rgba(217,119,6,.28);color:var(--ui-warn-ink)}
.flow-gc.is-ok{background:rgba(12,154,184,.12);border-color:rgba(12,154,184,.26);color:var(--pl-cyan)}

/* —— 涉及板号/订单：chips（前 3 个 + N，title 给全量） —— */
.flow-gcu{display:flex;align-items:flex-start;gap:6px;margin-bottom:4px}
.flow-gcu-lb{flex:0 0 26px;font-size:11px;font-weight:800;color:var(--ui-ink-300);padding-top:4px;letter-spacing:.04em}
.flow-gwrap{flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:4px}
.flow-gchip{display:inline-flex;align-items:center;height:19px;padding:0 6px;border-radius:6px;cursor:help;
  background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);color:var(--ui-ink-500);font-size:11px;font-weight:700;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.flow-gchip.is-more{background:rgba(134,134,134, .10);border-color:rgba(134,134,134, .22);color:var(--ui-brand-600);font-weight:800}
.flow-gapd-s{font-size:11px;color:var(--ui-ink-300);line-height:1.5;text-align:right}
.flow-gapd-s.is-muted{color:var(--ui-warn-ink);font-weight:700}

/* —— 建议动作 chips —— */
.flow-gact{display:block;padding:4px 8px;border-radius:6px;margin-bottom:4px;cursor:pointer;
  background:var(--sk-soft);border:1px solid var(--ui-line-100);color:var(--ui-ink-500);font-size:11px;font-weight:700;line-height:1.45}
.flow-gact:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
.flow-gact.is-none{background:var(--ui-bg-card);border-style:dashed;color:var(--ui-ink-300);cursor:help}

/* —— ⓘ：悬停读全文（浮层）+ 点击行内展开 —— */
.flow-gapt-cell{position:relative}
.flow-gapt-i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;
  background:var(--ui-bg-page);border:1px solid var(--ui-line-100);color:var(--sk-ink-2);font-size:11px;cursor:pointer}
.flow-gapt-i:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-600)}
.flow-gapt-cell:hover .flow-gapt-pop{display:block}
.flow-gapt-pop{display:none;position:absolute;right:0;top:100%;z-index:70;width:560px;max-width:70vw;max-height:360px;
  overflow:auto;overscroll-behavior:contain;padding:10px 12px;border-radius:12px;background:var(--ui-bg-card);
  border:1px solid var(--ui-line-100);box-shadow:0 20px 44px -18px rgba(28,28,28, .5)}
.flow-gapd-h2{font-size:11px;font-weight:800;color:var(--sk-ink-2);margin-bottom:6px}

/* —— 行内明细（点击 ⓘ / 点建议动作条目）：默认全收起，同时只开一行 —— */
.flow-gapd-row>td.flow-gapd-td{padding:10px 12px 12px;background:var(--ui-bg-card);border-top:1px dashed var(--ui-line-100)}
.flow-gapd-hd{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:12px}
.flow-gapd-hd b{font-weight:800;color:var(--ui-ink-700)}
.flow-gapd-hd span{font-size:11px;color:var(--ui-ink-400)}
.flow-gapd-x{margin-left:auto;cursor:pointer;font-size:11px;font-weight:800;color:var(--sk-ink-2)}
.flow-gapd-x:hover{color:var(--ui-brand-600)}
.flow-gapd-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:1440px){.flow-gapd-grid{grid-template-columns:1fr}}
.flow-gapd-i{border:1px solid var(--ui-line-100);border-radius:12px;background:var(--ui-bg-card);padding:8px 10px}
.flow-gapd-i.is-warn{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-gapd-h{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.flow-gapd-h b{font-size:11px;font-weight:800;color:var(--ui-ink-700);line-height:1.5}
.flow-gapd-h .flow-gap-n{flex:0 0 auto}
.flow-gapd-i .is-done i{color:var(--pl-cyan)}
.flow-gapd-i .is-need i{color:var(--ui-warn-ink)}
.flow-gapd-note{margin-top:8px;font-size:11px;color:var(--ui-ink-400);line-height:1.55}
/* 一行式空态条：替代本页 .ov3-empty 的 120px min-height（那 120px 只装一句话） */
.flow-empty1{padding:10px 12px;border-radius:10px;border:1px dashed var(--ui-line-200);background:var(--ui-bg-card);
  color:var(--ui-ink-300);font-size:11px;line-height:1.6;text-align:center}

/* —— 异常路径数字带（第四十七轮：chips → 大号数字 + 状态灯，与页首 KPI 同一套语言） —— */
.flow-exck{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-bottom:10px}
.flow-exck-c{padding:8px 10px;border-radius:12px;background:var(--ui-bg-card);border:1px solid rgba(28,28,28, .075)}
.flow-exck-c.is-ok{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.flow-exck-c.is-a{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-exck-c.is-x{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.flow-exck-c.is-n{background:var(--ui-bg-card);border-color:var(--ui-line-100)}
.flow-exck-t{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:var(--sk-ink-2);white-space:nowrap}
.flow-exck-c.is-ok .flow-dot{background:var(--pl-cyan);box-shadow:0 0 0 3px rgba(12,154,184,.14)}
.flow-exck-c.is-a .flow-dot{background:var(--ui-warn-solid);box-shadow:0 0 0 3px rgba(217,119,6,.18)}
.flow-exck-c.is-x .flow-dot{background:var(--ui-danger-solid);box-shadow:0 0 0 3px rgba(220,38,38,.16)}
.flow-exck-c.is-n .flow-dot{background:var(--ui-line-200)}
.flow-exck-v{display:flex;align-items:baseline;gap:4px;margin-top:2px}
.flow-exck-v b{font-size:20px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.6px;line-height:1.06;
  font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1}
.flow-exck-v i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-300)}
.flow-exck-s{font-size:11px;color:var(--ui-ink-300);line-height:1.5;margin-top:4px}

/* —— 1366 及以下：字号/间距整体收一档，8 列仍全部在列（不裁列、不横向滚动） —— */
@media (max-width:1440px){
  .dg-page.flow-page .flow-gaptab th{font-size:11px}
  .dg-page.flow-page .flow-gaptab td{padding-top:8px;padding-bottom:8px}
  .flow-gapt-n b{font-size:20px}
  .flow-gapt-st b{font-size:11px}
  .flow-gc,.flow-gchip{font-size:11px;height:18px;padding:0 6px}
  .flow-gact{font-size:11px;padding:2px 6px}
  .flow-gcu-lb{flex:0 0 22px;font-size:11px}
  .flow-gapt-lg{gap:6px}
  .flow-exck{grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:6px}
  .flow-gapt-pop{width:440px}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v4 生产概览 · 重设计层（本层位于文件末尾，覆盖前面各轮逐步累积的精修规则）
   设计目标：一屏之内「先看结论 → 再看图 → 口径全部收进悬停」。
     ① 指挥带：状态行 / KPI 砖 / 今日实况 三段式；KPI 砖 5 等宽等高，副标与底注各只留一行；
     ② 行动条：优先级订单 + 48h 停滞 + 今日要点 合并成一行等宽卡，红只留给真正超期的那张；
     ③ 卡片：卡头层级收紧、脚注恒为一行（完整口径进 title）、图表容器统一高度；
     ④ 响应式：修掉 ≤1280 时「每张卡只占 1/6 宽」的栅格塌陷。
   作用域：只作用于首页看板（.ov-hero / .bp-home.ov3 / .ov-act / .ov-tabs），其它页面不受影响。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 指挥带 ---------------- */
.ov-hero.is-dash{margin:0 0 12px}
.ov-hero-band{
  position:relative;overflow:hidden;border-radius:20px;padding:14px 20px 16px;color:var(--ui-brand-100);
  background:
    radial-gradient(760px 300px at 92% -60%, rgba(12,154,184,.30), transparent 62%),
    radial-gradient(520px 260px at -6% 130%, rgba(134,134,134, .24), transparent 62%),
    linear-gradient(118deg,var(--ui-ink-900) 0%,var(--ui-brand-900) 50%,var(--ui-brand-900) 100%);
  box-shadow:0 26px 52px -36px rgba(28,28,28, .95), inset 0 1px 0 rgba(255,255,255,.14);
}
.ov-hero-band::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:linear-gradient(115deg,rgba(0,0,0,.9),transparent 66%);
          mask-image:linear-gradient(115deg,rgba(0,0,0,.9),transparent 66%);
}
.ov-hero-band>*{position:relative;z-index:1}

/* 顶部：左＝数据状态，右＝控制；窄屏右区整体折到第二行 */
.ov-hero-top{
  display:flex;align-items:center;gap:10px 12px;flex-wrap:wrap;
  padding-bottom:12px;margin-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.11);font-size:12px;color:var(--ui-ink-300);
}
.ov-hs{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;min-width:0;flex:1 1 540px}
.ov-hc{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin-left:auto}
.ov-hs .ov-live{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;
  color:var(--ui-ok-line);background:rgba(10,112,67,.16);border:1px solid rgba(10,112,67,.34);border-radius:999px;padding:2px 10px;white-space:nowrap}
.ov-hs .ov-live i{width:6px;height:6px;border-radius:50%;background:var(--ui-ink-400);box-shadow:0 0 0 3px rgba(144,144,144, .22);animation:ovLivePulse 2.2s ease-in-out infinite}
@keyframes ovLivePulse{0%,100%{opacity:1}50%{opacity:.32}}
.ov-hero-top .badge{background:rgba(255,255,255,.12)!important;color:var(--ui-brand-050)!important;border-color:rgba(255,255,255,.18)!important}
.ov-hs-k{color:var(--ui-ink-300);white-space:nowrap}
.ov-hs-k b{color:#fff;font-weight:800;font-size:13px;font-variant-numeric:tabular-nums;margin-left:2px}
.ov-hs-k i{font-style:normal;opacity:.7}
.ov-hero-top .ov-hero-tag{margin-left:0;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  color:var(--ui-brand-100);font-size:11px;font-weight:800;letter-spacing:.06em;border-radius:6px;padding:2px 8px;white-space:nowrap}
.ov-hero-top .ov-ar{display:inline-flex;align-items:center;gap:6px;color:#c6c6c6;font-size:11px;cursor:pointer;user-select:none;white-space:nowrap;margin:0}
.ov-hero-top .ov-ar input{accent-color:var(--pl-cyan);margin:0}
.ov-hero-top .ov-hc-btn{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2);color:var(--ui-brand-050)}
.ov-hero-top .ov-hc-btn:hover{background:rgba(255,255,255,.2)}

/* KPI 砖：5 等宽等高 */
/* ★★ 2026-10-01 v6：KPI 砖那一排改成 auto-fit —— 有几块砖就铺满几列。
   改前写死 repeat(5,1fr)：生产概览刚好 5 块所以看着正常，但 ovzBand 的 6 个页签
   （生产动态 4 块 / 按时交付率 / 交付周期达成 / 订单构成 / 在制订单 / 交期预警）传的砖数各不相同，
   在 5 栏里就会「4 块砖占前 4 栏、最后一栏空着」。auto-fit 会自动塌掉空轨道，
   砖多砖少都铺满，窄屏再按 190px 折行。 */
.ov-kpis-dark{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:0}
.ov-kpi-d{
  display:flex;flex-direction:column;min-width:0;padding:12px 14px 14px;border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.045));
  border:1px solid rgba(255,255,255,.12);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.ov-kpi-d:hover{transform:translateY(-1.5px);border-color:rgba(255,255,255,.26);box-shadow:0 16px 30px -22px rgba(0,0,0,.85)}
.ov-kpi-d.tone-a{background:linear-gradient(180deg,rgba(220,38,38,.22),rgba(220,38,38,.09));border-color:rgba(246,211,226,.36)}
.ov-kpi-d.tone-b{background:linear-gradient(180deg,rgba(134,134,134, .20),rgba(134,134,134, .07));border-color:rgba(198,198,198, .30)}
.ov-kpi-d .k-lb{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:#c6c6c6;white-space:nowrap}
.ov-kpi-d .k-lb em{font-style:normal;font-size:11px;font-weight:800;color:var(--ui-brand-100);background:rgba(255,255,255,.14);border-radius:4px;padding:2px 6px}
.ov-kpi-d .k-vl{display:flex;align-items:baseline;gap:6px;margin-top:4px}
.ov-kpi-d .k-vl b{font-size:32px;font-weight:800;color:#fff;letter-spacing:-1px;line-height:1.05;font-variant-numeric:tabular-nums}
.ov-kpi-d .k-vl span{font-size:11px;font-weight:700;color:var(--ui-ink-300)}
.ov-kpi-d .k-sb{margin-top:4px;font-size:11px;color:#c6c6c6;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov-kpi-d .k-sb b{color:#fff;font-weight:800;font-variant-numeric:tabular-nums}
.ov-kpi-d .k-viz{margin-top:auto;padding-top:10px;height:36px;display:flex;align-items:flex-end}
.ov-kpi-d .k-viz svg{display:block;width:100%;height:30px;overflow:visible}
.ov-kpi-d .k-bar{position:relative;display:flex;width:100%;height:6px;border-radius:4px;overflow:hidden;background:rgba(255,255,255,.14)}
.ov-kpi-d .k-bar i{height:100%;border-radius:4px}
.ov-kpi-d .k-bar.k-bar-rate i{background:linear-gradient(90deg,var(--pl-cyan),var(--pl-cyan))}
.ov-kpi-d .k-bar.k-bar-rate u{position:absolute;top:-3px;width:2px;height:12px;background:rgba(255,255,255,.78);border-radius:4px}
.ov-kpi-d .k-cap{margin-top:6px;font-size:11px;color:var(--ui-ink-300);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 今日实况 */
.ov-today{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.11)}
.ov-today-lb{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ui-ink-300);background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.13);border-radius:6px;padding:2px 8px;white-space:nowrap}
.ov-today-c{display:flex;align-items:baseline;gap:8px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ov-today-c .k{font-size:11px;color:var(--ui-ink-300);font-weight:700}
.ov-today-c b{font-size:18px;font-weight:800;color:#fff;letter-spacing:-.4px}
.ov-today-c em{font-style:normal;font-size:11px;color:var(--ui-ink-300)}
.ov-today-c em i{font-style:normal;margin-left:4px;color:var(--ui-ink-400)}
.ov-today-zero{font-size:11px;color:var(--ui-ink-300)}

/* ---------------- ② 行动条（优先级 / 48h / 今日要点） ---------------- */
.ov-act-wrap{margin-bottom:12px}
.ov-act{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px}
.ov-act-c{
  display:flex;align-items:center;gap:12px;min-width:0;height:66px;padding:0 14px;
  border-radius:14px;background:var(--ui-bg-card);border:1px solid var(--ui-line-100);text-decoration:none;color:inherit;font-family:inherit;
  box-shadow:0 1px 2px rgba(28,28,28, .04),0 10px 24px -22px rgba(28,28,28, .45);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.ov-act-c[role="button"],a.ov-act-c{cursor:pointer}
.ov-act-c:hover{transform:translateY(-1.5px);box-shadow:0 2px 6px rgba(28,28,28, .06),0 18px 34px -24px rgba(28,28,28, .6)}
.ov-act-ico{width:30px;height:30px;flex:none;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--ui-brand-050);border:1px solid var(--ui-brand-100);color:var(--ui-brand-700)}
.ov-act-ico svg{width:16px;height:16px}
.ov-act-tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}
.ov-act-tx b{font-size:12px;font-weight:800;color:var(--ui-ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov-act-tx i{font-style:normal;font-size:11px;color:var(--ui-ink-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov-act-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex:none}
.ov-act-meta b{font-size:14px;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums;letter-spacing:-.3px;white-space:nowrap}
.ov-act-meta i{font-style:normal;font-size:11px;color:var(--ui-ink-400);white-space:nowrap}
.ov-act-go{flex:none;font-size:11px;font-weight:800;color:var(--ui-brand-600);white-space:nowrap}
.ov-act-c.is-danger{background:linear-gradient(120deg,var(--ui-danger-bg),var(--ui-danger-bg));border-color:var(--ui-danger-line)}
.ov-act-c.is-danger .ov-act-ico{background:linear-gradient(160deg,var(--ui-danger-bg),var(--ui-danger-bg));border-color:var(--ui-danger-line);color:var(--ui-danger-solid)}
.ov-act-c.is-danger .ov-act-tx b,.ov-act-c.is-danger .ov-act-meta b{color:var(--ui-danger-ink)}
.ov-act-c.is-danger .ov-act-go{color:var(--ui-danger-solid)}
.ov-act-c.is-warn{background:linear-gradient(120deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:var(--ui-warn-line)}
.ov-act-c.is-warn .ov-act-ico{background:linear-gradient(160deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:var(--ui-warn-line);color:var(--ui-warn-ink)}
.ov-act-c.is-warn .ov-act-tx b,.ov-act-c.is-warn .ov-act-meta b{color:var(--ui-warn-ink)}
.ov-act-c.is-ok{background:linear-gradient(120deg,var(--ui-bg-soft),var(--ui-line-100));border-color:var(--ui-line-200)}
.ov-act-c.is-ok .ov-act-ico{background:linear-gradient(160deg,var(--ui-bg-soft),var(--ui-ok-bg));border-color:var(--ui-ok-line);color:var(--ui-ok-solid)}
.ov-act-c.is-ok .ov-act-tx b{color:var(--ui-ok-solid)}

/* 48h 明细（就地展开） */
.ov-act-wrap .ov-stucklist{margin-top:10px;background:var(--ui-bg-card);border:1px solid var(--ui-line-100);border-radius:14px;padding:6px 12px;box-shadow:0 1px 2px rgba(28,28,28, .04)}

/* ---------------- ③ 视图切换 ---------------- */
.ov-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:12px;padding:8px 10px;
  border-radius:14px;background:var(--ui-bg-card);border:1px solid var(--ui-line-100);box-shadow:0 1px 2px rgba(28,28,28, .04)}
.ov-tabs-lb{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ui-ink-300);padding:0 4px}
.ov-tabs button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:1px solid transparent;
  background:var(--ui-bg-page);border-radius:10px;padding:6px 14px;cursor:pointer;font-family:inherit;transition:.16s}
.ov-tabs button b{font-size:12px;font-weight:800;color:var(--ui-ink-500);line-height:1.25;white-space:nowrap}
.ov-tabs button i{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--ui-ink-300);white-space:nowrap}
.ov-tabs button:hover{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.ov-tabs button:hover b{color:var(--ui-brand-700)}
.ov-tabs button.on{background:linear-gradient(180deg,var(--ui-brand-900),var(--ui-brand-900));border-color:transparent;box-shadow:0 8px 18px -12px rgba(68,68,68, .9)}
.ov-tabs button.on b{color:#fff}
.ov-tabs button.on i{color:var(--ui-ink-300)}
.ov-tabs-note{margin-left:auto;font-size:11px;color:var(--ui-ink-400)}

/* ---------------- ④ 卡片：卡头 / 卡体 / 脚注 ---------------- */
.bp-home.ov3{gap:12px}
.ov3-grid{grid-template-columns:repeat(12,1fr);gap:12px}
.ov3-card{border-radius:16px;padding:16px 18px 16px}
.ov3-h{gap:8px;margin-bottom:14px}
.ov3-h h3{font-size:13px;letter-spacing:0}
.ov3-h .ov3-ico{width:24px;height:24px;border-radius:8px}
.ov3-h .ov3-en{font-size:11px;letter-spacing:.9px}
.ov3-h .ov3-meta{font-size:11px;background:var(--ui-bg-page);border:1px solid rgba(28,28,28, .07);border-radius:8px;padding:2px 8px}
/* 卡头排布：图标 / 标题 /（自动靠右）口径胶囊 / 英文小标。
   标题与胶囊**都可压缩**（各自省略号），英文小标不压缩 —— 任何宽度下卡头都不会被挤爆，
   也不会出现「标题只剩两个字」的情况（标题至少留 5 个字的位置）。 */
.bp-home.ov3 .ov3-h .ov3-ico{margin-left:0}
.bp-home.ov3 .ov3-h h3{margin-left:0;flex:0 1 auto;min-width:72px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bp-home.ov3 .ov3-h .ov3-meta{margin-left:auto;flex:0 1 auto;min-width:0;max-width:62%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bp-home.ov3 .ov3-h .ov3-en{margin-left:0;flex:none}
/* 脚注恒为一行：完整口径在 ov3Card 写入的 title 里（鼠标停上去就读得到），卡面因此不再被小字淹没 */
.bp-home.ov3 .ov3-card .ov3-foot{display:block!important;-webkit-line-clamp:unset!important;font-size:11px;color:var(--ui-ink-400);
  line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 图表容器：统一档位，同排卡片横平竖直 */
.ov3-h320{height:300px}
.ov3-h280{height:262px}
.ov3-h250{height:246px}
/* 交期日历表头：提示语可省略、两个状态胶囊各占一段且不换行（原来两个胶囊都带 margin-left:auto，
   在窄卡里被挤成两行、还压住了提示语） */
.ov-cal-hd{display:flex;align-items:center;gap:8px}
.ov-cal-hd>span{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov-cal-hd em{flex:none;margin-left:0!important;white-space:nowrap}
/* 清单型卡片（Top 风险客户 / 优先待办）不再用固定 max-height 内部滚动 ——
   卡片高度已经由同一行的伙伴卡撑开，再加一层滚动会把最后一行切成半截。 */
.ov3-card.c-risk .ov3-b,.ov3-card.c-todo .ov3-b{max-height:none;overflow:visible}
/* 设备状态卡：内容是一张固定高度的图，同排伙伴卡更高时把图垂直居中，别让空白全堆在下面 */
.ov3-card.c-dev .ov3-b{display:flex;flex-direction:column;justify-content:center}

/* ---------------- ⑤ 响应式（修掉 ≤1280 栅格塌陷） ---------------- */
/* 第一档（≤1400）：仍然一行 5 块，只把字号与内距收一档 —— 指挥带保持「一遍读完」的高度。 */
@media (max-width:1440px){
  .ov-kpi-d{padding:12px 12px 12px}
  .ov-kpi-d .k-lb{font-size:11px}
  .ov-kpi-d .k-vl b{font-size:28px}
  .ov-kpi-d .k-sb{font-size:11px}
  .ov-kpi-d .k-cap{font-size:11px}
}
/* 第二档：交给 auto-fit 自己折行（见 .ov-kpis-dark 的 track 定义），不再手写档位 */
@media (max-width:1280px){
  .ov-tabs-note{display:none}
  /* 老规则在这一档把每张卡压成 12 栏里的 2 栏（≈1/6 宽）→ 图表被挤成竖排。
     这里复位成「一行两张」；整幅宽卡（.ov3-g12，例如「动态流水」）必须仍占满一行，
     否则行列表被压到半宽、客户名全部截断。 */
  .ov3-grid[data-tab] .ov3-card{grid-column:span 6!important}
  .ov3-grid[data-tab] .ov3-card.ov3-g12{grid-column:span 12!important}
}
@media (max-width:1280px){
  .ov-kpis-dark{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ov-kpi-d{grid-column:auto!important}
  .ov3-grid[data-tab]{grid-template-columns:repeat(2,1fr)}
  .ov3-grid[data-tab] .ov3-card{grid-column:span 1!important}
  .ov3-grid[data-tab] .c-t30{grid-column:span 2!important}
  .ov-hero-top .ov-hc{margin-left:0}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v5 工序看板 · 精修层（只作用于「指挥驾驶舱 → 工序看板」这一页）
   改的是三件具体的事，不动页面结构、不动业务口径：
     ① KPI 行：第二排原来是一个长年为 0 的「标准品」砖 → 换成「在制条数」；
        六块砖去掉重复色（原来两个蓝、两个绿），各占一个语义色；装饰圆改成柔和高光；
        环形进度 56→48px，不再压到「大数 / 副标」；每块的 ring 都写明分母（title）。
     ② 列头长到每一列身上：工序名 + 在制单数 + 负载条（原顶部 .loadbar 里数字与标签分居两端，
        读起来像是下一列的；而且列本身没有表头，横向滚动后不知道在看哪一列）。
     ③ 空列改成一张虚线占位卡，不再撑成一大块空白；逾期卡取消无限呼吸动画，改静态左侧红条。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① KPI 行 ---------------- */
.grid.kpis{gap:12px;margin-bottom:14px}
.grid.kpis .pk-card{
  border-radius:16px;padding:14px 16px 0;min-height:118px;
  box-shadow:0 1px 2px rgba(28,28,28, .06),0 14px 30px -24px rgba(28,28,28, .55);
}
/* 原来两个装饰圆叠在右上角，像一块脏印；换成一层柔和高光 + 一道斜向提亮 */
.grid.kpis .pk-card::before{
  content:"";position:absolute;top:-52px;right:-34px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle at 34% 34%,rgba(255,255,255,.32),rgba(255,255,255,0) 68%);
}
.grid.kpis .pk-card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(118deg,rgba(255,255,255,.14),rgba(255,255,255,0) 48%);
}
.grid.kpis .pk-card>*{position:relative;z-index:1}
.grid.kpis .pk-label{font-size:12px;opacity:.92;margin-bottom:6px;letter-spacing:.02em}
.grid.kpis .pk-val{font-size:28px;letter-spacing:-.6px;line-height:1.06;text-shadow:0 1px 2px rgba(0,0,0,.10)}
.grid.kpis .pk-sub{font-size:11px;opacity:.8;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grid.kpis .pk-body{padding-bottom:12px}
.grid.kpis .pk-ring{width:48px;height:48px}
.grid.kpis .pk-ring-bg{stroke-width:3.5}
.grid.kpis .pk-ring-fg{stroke-width:3.5}
.grid.kpis .pk-ring-pct{font-size:11px;font-weight:800}
/* 底部进度条压到卡片下沿，左右出血 */
.grid.kpis .pk-bar{height:3px;margin:0 -16px;border-radius:0;background:rgba(255,255,255,.20)}
.grid.kpis .pk-bar i{border-radius:0;box-shadow:none;background:rgba(255,255,255,.92)}

/* ---------------- ② 8 列看板 ---------------- */
.board-panel{position:relative}
.board-hint{display:none;margin-left:2px;font-size:11px;color:var(--ui-ink-400)}
@media (max-width:1440px){ .board-hint{display:inline} }
.board-stat{font-size:12px;color:var(--txt-3)}
.board-stat b{color:var(--txt);font-weight:800;font-variant-numeric:tabular-nums}
.board-stat b.hot{color:var(--red)}

/* ★★ 2026-10-01 v5.1（用户：「看着有点乱，不够规整」）：
   改前每一列各自按内容长高 —— 有 6 张卡的「入库」拖到一屏之外，空列只在顶上浮一张小占位卡，
   八列的底边参差不齐，整块看板像一段锯齿；空列下面还留着一大片死白。
   改后：**八列等高**（看板给一个确定高度，正好吃掉首屏剩余空间），列体超出就内部滚动；
   列改成浅灰「托盘」、卡是白卡（层次一眼分清）；空列不再浮一张小卡，改成整列居中的一行灰字。 */
.board{
  grid-template-columns:repeat(8,minmax(176px,1fr));gap:12px;align-items:stretch;
  /* 八列等高：高度吃掉首屏剩余空间，但封顶 760px（再高就只剩空托盘了），
     低于 340px 就保底并让页面自己滚动。 */
  height:clamp(340px,calc(100vh - 340px),760px);
  overflow-x:auto;overflow-y:hidden;padding-bottom:2px;
}
.stcol{
  display:flex;flex-direction:column;padding:0;height:100%;min-height:0;
  background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);border-radius:14px;overflow:hidden;
  box-shadow:0 1px 2px rgba(28,28,28, .04);
}
.sthd{display:flex;align-items:center;gap:8px;padding:10px 12px;cursor:pointer;user-select:none;
  background:var(--ui-bg-card);border-bottom:1px solid var(--ui-line-100);transition:background .15s}
.sthd:hover{background:var(--ui-brand-050)}
.sthn{font-size:12px;font-weight:800;color:var(--ui-ink-900);white-space:nowrap}
.sthc{margin-left:auto;font-size:11px;font-weight:800;color:var(--ui-brand-700);background:var(--ui-bg-soft);
  border-radius:999px;padding:2px 8px;font-variant-numeric:tabular-nums}
.sthc.is-zero{color:var(--ui-ink-400);background:var(--ui-bg-page)}
.sthb{height:4px;background:rgba(28,28,28, .06);overflow:hidden}
.sthb i{display:block;height:100%;background:linear-gradient(90deg,var(--ui-brand-700),var(--ui-brand-500));transition:width .4s ease}
.stcb{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:8px;padding:10px;overflow-y:auto}
/* 空列：整列居中的一行灰字，不再浮一张小占位卡 */
.stcol.is-empty .stcb{align-items:center;justify-content:center;padding:12px}
.stcol-empty{border:0;background:transparent;padding:0;text-align:center;color:var(--ui-ink-300);font-size:11px;line-height:1.6}
.stcb::-webkit-scrollbar{width:6px}
.stcb::-webkit-scrollbar-thumb{background:rgba(198,198,198, .35);border-radius:4px}
.stcb::-webkit-scrollbar-thumb:hover{background:rgba(198,198,198, .55)}

/* ---------------- ③ 订单卡 ---------------- */
.board .ocard{margin-bottom:0;position:relative}
/* 逾期卡原来 1.6s 无限呼吸（一屏 6 张一起闪，很吵）：改静态左侧红条 + 极淡红底 */
.board .ocard.over{animation:none;border-color:rgba(220,38,38,.45);
  background:linear-gradient(180deg,var(--ui-bg-card),var(--pl-pink-bg))}
.board .ocard.over::after{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;
  border-radius:0 4px 4px 0;background:var(--ui-danger-solid)}

/* ---------------- ④ 响应式 ---------------- */
@media (max-width:1440px){
  .board{grid-template-columns:repeat(8,minmax(170px,1fr));gap:10px}
}
@media (max-width:1280px){
  /* 这一档 KPI 行是两排，看板相应让出一排的高度 */
  .board{height:clamp(340px,calc(100vh - 484px),700px)}
}
@media (max-width:1280px){
  /* 折成 4 列 × 2 行：不再固定高度，每列各自封顶 */
  .board{grid-template-columns:repeat(4,minmax(160px,1fr));height:auto;align-items:start}
  .stcol{height:auto;max-height:400px}
}
/* ---------------- ⑤ 页头浅色状态带（v5.2） ----------------
   工序看板不在 ovzBandTabs() 名单里，页头走的是 statusBanner() 的 .ov-hero 浅色条。
   但 2026-09-26「第五轮」为了让位给深色指挥带，把 .ov-hero 整条清成了
   `display:block;padding:0;border:0;background:transparent` —— 于是这一页的状态带
   变成一段没有底色、没有分栏的连排文字（「订单总数 112发货率（考核） 92.4%近 7 日完成…」）。
   现在把外观还给 .ov-hero，同时显式复位深色指挥带外壳 .ov-hero.is-dash（它的外观在 .ov-hero-band 上）。 */
.ov-hero{
  display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;
  margin-bottom:14px;padding:10px 14px;border-radius:12px;
  background:linear-gradient(180deg,var(--ui-brand-050),var(--ui-brand-050));border:1px solid rgba(198,198,198, .22);
  box-shadow:0 1px 2px rgba(28,28,28, .04);font-size:12px;color:var(--txt-2);
}
.ov-hero .ov-hero-k{white-space:nowrap;font-size:12px}
.ov-hero .ov-hero-k b{font-size:13px;margin-left:2px}
.ov-hero .badge{flex:none}
.ov-hero.is-dash{display:block;padding:0;border:0;background:transparent;box-shadow:none;margin-bottom:12px}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v6「生产动态」可视化重做（只作用于 .feed-page）
   为什么重做选型：这一页的真实数据是**稀疏且极不对称**的 —— 30 条事件 / 5 类（最大一类 70%）/
   7 天里只有 2 天有记录 / 8 个工段里只有 2~3 个有事件。
   原来的三张图都是按「数据饱满」选的型，于是：小扇区标签叠在一起、4 天空柱、一根满格柱带三根看不见的短柱。
     ① 事件类型分布 → 环只表达构成，数值全部交给右侧排行榜（可点下钻）；
     ③ 各工段推进量 → 换成 8 道工序的流向卡（两行四列，顺序＝产线实际流向），空工段明确标灰。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 事件类型分布：左环 + 右排行榜 ---------------- */
.evt-mix{display:flex;align-items:stretch;gap:10px;height:240px}
.evt-donut{flex:0 0 42%;height:240px;min-width:0}
.evt-list{flex:1 1 auto;min-width:0;margin:0;padding:0;list-style:none;
  display:flex;flex-direction:column;justify-content:center;gap:2px}
.evt-li{display:grid;grid-template-columns:9px 60px minmax(0,1fr) 66px;align-items:center;gap:8px;
  padding:4px 6px;border-radius:8px;cursor:pointer;transition:background .14s ease}
.evt-li:hover{background:var(--ui-brand-100)}
.evt-dot{width:9px;height:9px;border-radius:4px;background:var(--c,var(--ui-ink-400));flex:none}
.evt-n{font-size:11px;font-weight:700;color:var(--ui-ink-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.evt-b{position:relative;height:6px;border-radius:4px;background:rgba(28,28,28, .06);overflow:hidden}
.evt-b i{display:block;height:100%;border-radius:4px;background:var(--c,var(--ui-ink-400));opacity:.9;
  transition:width .5s cubic-bezier(.4,0,.2,1)}
.evt-v{display:flex;align-items:baseline;justify-content:flex-end;gap:2px;white-space:nowrap;font-variant-numeric:tabular-nums}
.evt-v b{font-size:13px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.2px}
.evt-v em{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.evt-v u{text-decoration:none;font-size:11px;color:var(--ui-ink-300);margin-left:4px;min-width:36px;text-align:right}

/* ---------------- ③ 工段事件流向（8 道工序，两行四列） ---------------- */
.pp{display:flex;flex-direction:column;justify-content:center;gap:10px;height:240px}
.pp-row{display:flex;align-items:stretch;gap:4px}
.pp-sep{flex:none;align-self:center;width:11px;text-align:center;font-style:normal;font-size:13px;color:var(--ui-line-200);line-height:1}
.pp-node{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:4px;
  padding:10px 10px 8px;border-radius:12px;background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.pp-node.is-on{background:linear-gradient(180deg,var(--ui-brand-050),var(--ui-brand-050));border-color:var(--ui-brand-100);
  box-shadow:0 1px 2px rgba(28,28,28, .04),0 10px 22px -20px rgba(68,68,68, .6)}
.pp-node:hover{transform:translateY(-1.5px);box-shadow:0 2px 6px rgba(28,28,28, .06),0 14px 26px -20px rgba(28,28,28, .5)}
.pp-n{font-size:11px;font-weight:800;color:var(--ui-ink-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-node.is-on .pp-n{color:var(--ui-brand-700)}
.pp-v{display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}
.pp-v b{font-size:18px;font-weight:800;line-height:1;letter-spacing:-.5px;color:var(--ui-line-200)}
.pp-node.is-on .pp-v b{color:var(--ui-ink-900)}
.pp-v em{font-style:normal;font-size:11px;color:var(--ui-ink-300)}
.pp-b{height:4px;border-radius:4px;background:rgba(28,28,28, .06);overflow:hidden}
.pp-b i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--sk-accent),#c6c6c6);
  transition:width .5s cubic-bezier(.4,0,.2,1)}
.pp-extra{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.pp-chip{font-size:11px;color:var(--ui-ink-500);background:var(--ui-bg-page);border:1px solid var(--ui-line-100);border-radius:999px;padding:2px 8px;white-space:nowrap}
.pp-chip b{color:var(--ui-ink-700);font-variant-numeric:tabular-nums}

@media (max-width:1440px){
  .evt-mix{gap:8px}
  .evt-donut{flex:0 0 40%}
  .evt-li{grid-template-columns:9px 52px minmax(0,1fr) 58px;gap:6px}
  .pp-node{padding:8px 8px 8px}
}
@media (max-width:1280px){
  .evt-mix{flex-direction:column;height:auto}
  .evt-donut{flex:none;width:100%}
  .pp{height:auto}
}


/* v6 feed 窄屏：三张图在第 3 张之后落单，让第 3 张（工段事件流向）独占一行，
   免得右半屏空着；同时给 8 道工序更多横向空间。 */
@media (max-width:1280px){
  .feed-page .ov3-grid[data-tab="feed"]>.ov3-card.ov3-g4:nth-child(3){grid-column:span 12!important}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v8「生产动态」图表与流水换形态（不是换配色）
   用户原话：「我说的是可视化图表和动态流水换一种全新的样式，不是主题颜色」。
   四件东西都换了形态，配色仍是本页原来那五色语义（红/橙/蓝/青/灰蓝）：
     ① 事件类型分布：环图 → **华夫饼格**（一格＝一条事件）
     ② 近 7 日事件趋势：ECharts 柱状 → **七根液柱**（圆角胶囊 + 柱顶浮数）
     ③ 工段事件流向：八张卡 → **单向工序流带**（八道工序串成一条线）+ 落点占比色带
     ④ 动态流水：平铺行 → **两级聚类流**（日期 → 事件类型，两级可折叠）
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 华夫饼格 ---------------- */
.wf-mix{display:flex;align-items:center;gap:12px;height:240px}
.wf-side{flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;gap:8px}
.wf{display:grid;grid-template-columns:repeat(6,18px);grid-auto-rows:18px;gap:6px}
.wf-c{display:block;border-radius:4px;background:var(--c,var(--ui-ink-400));opacity:.92;cursor:pointer;
  transition:transform .12s ease,opacity .12s ease}
.wf-c:hover{transform:scale(1.22);opacity:1}
.wf-cap{font-size:11px;color:var(--ui-ink-400);line-height:1.5;text-align:center}
.wf-cap b{color:var(--ui-ink-700);font-weight:800;font-variant-numeric:tabular-nums}

/* ---------------- ② 七根液柱 ---------------- */
.ht{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;height:240px;padding:6px 2px 0}
.ht-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.ht-tr{position:relative;width:32px;height:150px;border-radius:16px;background:rgba(28,28,28, .055);
  display:flex;flex-direction:column-reverse;overflow:visible}
.ht-oth,.ht-crit{display:block;width:100%;border-radius:16px}
.ht-oth{background:linear-gradient(180deg,var(--ui-brand-500),var(--sk-accent))}
.ht-crit{background:linear-gradient(180deg,var(--ui-warn-line),var(--ui-warn-solid));border-radius:16px 16px 0 0}
.ht-crit:first-child{border-radius:16px}
.ht-v{position:absolute;left:-6px;right:-6px;text-align:center;font-size:12px;font-weight:800;color:var(--ui-ink-900);
  font-variant-numeric:tabular-nums;letter-spacing:-.2px}
.ht-v.is-zero{position:static;margin-bottom:8px;color:var(--ui-ink-300);font-weight:700}
.ht-col.is-zero .ht-tr{background:transparent;border:1px dashed var(--ui-line-200)}
.ht-d{font-size:11px;font-weight:800;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.ht-w{font-size:11px;color:var(--ui-ink-300);white-space:nowrap}
.ht-col.is-zero .ht-d{color:var(--ui-ink-300)}
.ht-col.is-today .ht-tr{background:rgba(134,134,134, .10);box-shadow:0 0 0 2px rgba(134,134,134, .22)}
.ht-col.is-today .ht-w{color:var(--sk-accent);font-weight:800}

/* ---------------- ③ 单向工序流带 ---------------- */
.pf{display:flex;flex-direction:column;gap:10px;height:240px;justify-content:center}
.pf-rail{display:flex;align-items:center;justify-content:space-between;gap:2px;padding:0 2px}
.pf-node{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}
.pf-c{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--ui-bg-card);border:1.5px dashed var(--ui-line-200);transition:transform .14s ease,box-shadow .14s ease}
.pf-c b{font-size:13px;font-weight:800;color:var(--ui-ink-300);font-variant-numeric:tabular-nums}
.pf-node.is-on .pf-c{background:linear-gradient(160deg,var(--sk-accent),var(--ui-brand-700));border:1.5px solid transparent;
  box-shadow:0 6px 14px -8px rgba(68,68,68, .75)}
.pf-node.is-on .pf-c b{color:#fff}
.pf-node:hover .pf-c{transform:translateY(-2px);box-shadow:0 10px 18px -10px rgba(68,68,68, .8)}
.pf-l{font-size:11px;font-weight:700;color:var(--ui-ink-400);white-space:nowrap}
.pf-node.is-on .pf-l{color:var(--ui-ink-700)}
.pf-link{flex:0 0 10px;height:2px;border-radius:4px;background:linear-gradient(90deg,var(--ui-line-200),var(--ui-line-200));align-self:center;margin-top:-16px}
.pf-bar{display:flex;height:10px;border-radius:4px;overflow:hidden;background:rgba(28,28,28, .055)}
.pf-bar i{display:block;height:100%}
.pf-cap{font-size:11px;color:var(--ui-ink-300);line-height:1.5;text-align:center}
.pf-cap b{color:var(--ui-ink-700);font-weight:800;font-variant-numeric:tabular-nums}
.pf-extra{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.pf-chip{font-size:11px;color:var(--ui-ink-500);background:var(--ui-bg-page);border:1px solid var(--ui-line-100);border-radius:999px;padding:2px 8px;white-space:nowrap}
.pf-chip b{color:var(--ui-ink-700);font-variant-numeric:tabular-nums}

/* ---------------- ④ 两级聚类流 ---------------- */
.tl2{display:flex;flex-direction:column;gap:10px}
.tl2-day{border:1px solid var(--ui-line-100);border-radius:14px;overflow:hidden;background:var(--ui-bg-card)}
.tl2-dh{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;background:var(--ui-bg-soft);
  font-family:inherit;cursor:pointer;text-align:left;transition:background .14s ease}
.tl2-dh:hover{background:var(--ui-brand-050)}
.tl2-dn{font-size:12px;font-weight:800;color:var(--ui-ink-900);white-space:nowrap}
.tl2-dv{font-size:16px;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums;letter-spacing:-.4px;line-height:1}
.tl2-du{font-style:normal;font-size:11px;color:var(--ui-ink-300)}
.tl2-dcs{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.tl2-dc{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--sk-ink-2);
  background:var(--ui-bg-card);border:1px solid var(--ui-line-100);border-radius:999px;padding:2px 8px;white-space:nowrap}
.tl2-dc::before{content:"";width:7px;height:7px;border-radius:4px;background:var(--c,var(--ui-ink-400));flex:none}
.tl2-dc b{color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.tl2-caret{flex:none;width:0;height:0;border-left:4.5px solid transparent;border-right:4.5px solid transparent;
  border-top:5.5px solid var(--ui-ink-300);transition:transform .18s ease}
.tl2-day.is-fold .tl2-caret,.tl2-grp.is-fold .tl2-caret{transform:rotate(-90deg)}
.tl2-dbody{padding:6px 8px 8px}
.tl2-day.is-fold .tl2-dbody{display:none}

.tl2-grp{border:1px solid var(--ui-bg-page);border-radius:10px;margin-top:6px;overflow:hidden;background:var(--ui-bg-card)}
.tl2-grp:first-child{margin-top:0}
.tl2-gh{display:flex;align-items:center;gap:8px;width:100%;padding:6px 10px;border:0;background:var(--ui-bg-card);
  font-family:inherit;cursor:pointer;text-align:left;transition:background .14s ease}
.tl2-gh:hover{background:var(--ui-bg-soft)}
.tl2-dot{width:8px;height:8px;border-radius:4px;background:var(--sk-accent);flex:none}
.tl2-gn{font-size:11px;font-weight:800;color:var(--ui-ink-700);white-space:nowrap}
.tl2-gv{font-size:13px;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums}
.tl2-gu{font-style:normal;font-size:11px;color:var(--ui-ink-300)}
.tl2-gcaret{margin-left:auto}
.tl2-grp.tone-late .tl2-dot{background:var(--ui-danger-solid)}
.tl2-grp.tone-late .tl2-gn{color:var(--ui-danger-ink)}
.tl2-grp.tone-audit .tl2-dot{background:var(--pl-cyan)}
.tl2-grp.tone-audit .tl2-gn{color:var(--pl-cyan-ink)}
.tl2-grp.tone-flow .tl2-dot{background:var(--sk-accent)}
.tl2-grp.tone-unprod .tl2-dot{background:var(--ui-brand-500)}
.tl2-grp.is-fold .tl2-rows{display:none}

/* 组内事件行：左侧时间 / 色条 / 类型 chip / 订单号 / 客户 / 一句关键信息 / 明细 */
.tl2-rows{padding:2px 6px 6px}
.tl-row{
  --c:var(--sk-accent);
  position:relative;display:grid;
  grid-template-columns:62px 10px 78px 122px minmax(0,1.3fr) minmax(0,1fr) 58px;
  align-items:center;gap:10px;height:40px;padding:0 6px;border-radius:8px;box-sizing:border-box;cursor:pointer;
  transition:background .13s ease;
}
.tl-row:hover{background:var(--ui-brand-050)}
.tl-row.tone-late{--c:var(--ui-danger-solid)}
.tl-row.tone-coop{--c:var(--ui-ink-400)}
.tl-row.tone-audit{--c:var(--pl-cyan)}
.tl-row.tone-flow{--c:var(--sk-accent)}
.tl-row.tone-unprod{--c:var(--ui-brand-500)}
.tl-time{font-size:11px;color:var(--ui-ink-300);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tl-rail{position:relative;width:10px;height:40px;display:flex;align-items:center;justify-content:center}
.tl-rail::before{content:"";position:absolute;top:0;bottom:0;width:2px;border-radius:4px;background:var(--ui-line-100)}
.tl-rail i{position:relative;width:8px;height:8px;border-radius:50%;background:var(--c);
  box-shadow:0 0 0 3px #fff}
.tl-chip{justify-self:start;max-width:100%;font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;background:rgba(134,134,134, .10);color:var(--ui-brand-700);border:1px solid rgba(134,134,134, .18)}
.tl-row.tone-late .tl-chip{background:rgba(220,38,38,.10);color:var(--ui-danger-ink);border-color:rgba(220,38,38,.20)}
.tl-row.tone-coop .tl-chip{background:rgba(144,144,144, .16);color:var(--ui-ink-500);border-color:rgba(144,144,144, .26)}
.tl-row.tone-audit .tl-chip{background:rgba(12,154,184,.10);color:var(--pl-cyan-ink);border-color:rgba(12,154,184,.20)}
.tl-row.tone-unprod .tl-chip{background:rgba(134,134,134, .10);color:var(--ui-brand-600);border-color:rgba(134,134,134, .20)}
.tl-oid{font-family:Consolas,ui-monospace,Menlo,monospace;font-size:11px;font-weight:700;color:var(--ui-ink-900);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-cust{font-size:11px;color:var(--sk-ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-dash{color:var(--ui-line-200)}
.tl-key{display:flex;align-items:center;gap:6px;min-width:0;font-size:11px;color:var(--ui-ink-400);white-space:nowrap;overflow:hidden}
.tl-k1{color:var(--sk-ink-2)}
.tl-dot{font-style:normal;color:var(--ui-line-200)}
.tl-k2{color:var(--ui-ink-400)}
.tl-k3{color:var(--ui-ink-400)}
.tl-k3.is-over{color:var(--ui-danger-solid);font-weight:800}
.tl-k3.is-coop{color:var(--ui-ink-500)}
.tl-flag{flex:none;font-size:11px;font-weight:700;color:var(--ui-ink-500);background:rgba(144,144,144, .18);
  border:1px solid rgba(144,144,144, .28);border-radius:4px;padding:0 6px}
.tl-k0{color:var(--ui-ink-300)}
.tl-go{justify-self:end;font-size:11px;font-weight:700;color:var(--sk-accent);white-space:nowrap;opacity:.7;transition:opacity .13s ease}
.tl-go b{font-weight:800}
.tl-row:hover .tl-go{opacity:1}

@media (max-width:1440px){
  .wf{grid-template-columns:repeat(6,16px);grid-auto-rows:16px;gap:4px}
  .tl-row{grid-template-columns:56px 10px 70px 110px minmax(0,1.2fr) minmax(0,1fr) 54px;gap:8px}
  .ht-tr{width:28px;height:132px}
}
@media (max-width:1280px){
  .wf-mix{flex-direction:column;height:auto;gap:10px}
  .ht{height:auto}
  .pf{height:auto}
  .tl-row{grid-template-columns:52px 10px 66px 104px minmax(0,1fr) 50px;height:auto;padding:8px 6px}
  .tl-cust{display:none}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v9「在制订单」图表与明细换形态（与「生产动态」v8 同一套思路）
   真实数据：「在制 11 单 / 316 条」里 316 条全压在「入库」一道工序、272 条全落在「已过交期」一格 ——
   原来的竖柱图只能画出一根顶到天花板的柱 + 八根空柱。这一轮把四张图和明细表全部换成
   「看得见稀疏与集中」的形态：横向工序条 / 交期刻度尺 / 客户条带榜 / 八格仪表 / 订单卡+工序轨道。
   配色仍用本页既有的五个语义色（红 #E04553 / 橙 #E8A33D / 蓝 var(--sk-accent) / 青 #0C9AB8 / 灰蓝 #5e5e5e）。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 横向工序堆叠条 ---------------- */
.ps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.ps-row{display:grid;grid-template-columns:76px minmax(0,1fr) 84px;align-items:center;gap:10px;
  padding:4px 6px;border-radius:8px;cursor:pointer;transition:background .13s ease}
.ps-row:hover{background:var(--ui-brand-050)}
.ps-n{font-size:11px;font-weight:800;color:var(--ui-ink-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ps-b{display:flex;height:14px;border-radius:6px;overflow:hidden;background:rgba(28,28,28, .05)}
.ps-b i{display:block;height:100%}
.ps-b i:first-child{border-radius:6px 0 0 6px}
.ps-b i:last-child{border-radius:0 6px 6px 0}
.ps-b i:only-child{border-radius:6px}
.ps-row.is-zero .ps-n{color:var(--ui-ink-300)}
.ps-empty{width:100%;background:repeating-linear-gradient(135deg,rgba(28,28,28, .05) 0 6px,transparent 6px 12px)}
.ps-v{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;font-variant-numeric:tabular-nums}
.ps-v b{font-size:13px;font-weight:800;color:var(--ui-ink-900)}
.ps-row.is-zero .ps-v b{color:var(--ui-line-200)}
.ps-v em{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.ps-lg{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:8px;padding-top:8px;border-top:1px solid var(--ui-bg-page)}
.ps-lg-i{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--ui-ink-400)}
.ps-lg-i i{width:9px;height:9px;border-radius:4px;flex:none}

/* ---------------- ② 交期刻度尺 ---------------- */
.dr{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;height:240px;align-items:stretch}
.dr-c{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:10px 4px 10px;border-radius:10px;
  background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);cursor:default}
.dr-c{justify-content:center}
.dr-c b{font-size:14px;font-weight:800;color:var(--ui-line-200);font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.dr-c u{text-decoration:none;font-size:11px;color:var(--ui-ink-300);font-variant-numeric:tabular-nums}
.dr-c .dr-lb{font-size:11px;font-weight:700;color:var(--ui-ink-400);white-space:nowrap;text-align:center;line-height:1.25}
.dr-b{width:100%;height:5px;border-radius:4px;background:rgba(28,28,28, .06);overflow:hidden}
.dr-b i{display:block;height:100%;border-radius:4px;background:var(--sk-accent)}
.dr-c.is-x{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.dr-c.is-x b{color:var(--ui-danger-ink)}
.dr-c.is-x .dr-b i{background:var(--ui-danger-solid)}
.dr-c.is-x .dr-lb{color:var(--ui-danger-ink)}
.dr-c.is-a{background:var(--ui-warn-bg);border-color:var(--ui-bg-soft)}
.dr-c.is-a b{color:var(--ui-warn-ink)}
.dr-c.is-a .dr-b i{background:var(--ui-warn-solid)}
.dr-c.is-a .dr-lb{color:var(--ui-warn-ink)}
.dr-c.is-b b{color:var(--ui-ink-900)}
.dr-c.is-b .dr-lb{color:var(--ui-ink-700)}
.dr-c.is-z{background:var(--ui-bg-card)}

/* ---------------- ③ 客户条带榜 ---------------- */
.cr{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.cr-row{display:grid;grid-template-columns:20px minmax(0,1fr) minmax(70px,1.1fr) 92px;align-items:center;gap:10px;
  padding:6px 8px;border-radius:8px;cursor:pointer;transition:background .13s ease}
.cr-row:hover{background:var(--ui-brand-050)}
.cr-i{width:20px;height:20px;border-radius:6px;background:var(--ui-line-100);color:var(--ui-ink-400);font-size:11px;font-weight:800;
  display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}
.cr-row.is-top .cr-i{background:linear-gradient(160deg,var(--sk-accent),var(--ui-brand-700));color:#fff}
.cr-n{font-size:11px;font-weight:700;color:var(--ui-ink-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cr-b{height:9px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden}
.cr-b i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--sk-accent),#c6c6c6)}
.cr-row.is-top .cr-b i{background:linear-gradient(90deg,var(--ui-brand-700),var(--sk-accent))}
.cr-v{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;font-variant-numeric:tabular-nums}
.cr-v b{font-size:13px;font-weight:800;color:var(--ui-ink-900)}
.cr-v em{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.cr-v u{text-decoration:none;font-size:11px;color:var(--ui-ink-300);margin-left:4px}

/* ---------------- ④ 八格仪表 ---------------- */
.sg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sg-c{position:relative;padding:10px 12px 8px;border-radius:12px;background:var(--ui-bg-soft);border:1px solid var(--ui-line-100);overflow:hidden}
.sg-c::before{content:"";position:absolute;left:11px;right:11px;top:0;height:2px;border-radius:4px;background:var(--ui-line-200)}
.sg-c b{font-size:20px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.6px;line-height:1.1;
  font-variant-numeric:tabular-nums;font-feature-settings:'tnum' 1}
.sg-c em{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400);margin-left:4px}
.sg-c span{display:block;font-size:11px;color:var(--ui-ink-400);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-c.is-z b{color:var(--ui-ink-300)}
.sg-c.is-a{background:var(--ui-warn-bg);border-color:var(--ui-bg-soft)}
.sg-c.is-a::before{background:var(--ui-warn-solid)}
.sg-c.is-a b{color:var(--ui-warn-ink)}
.sg-c.is-b{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.sg-c.is-b::before{background:var(--sk-accent)}
.sg-c.is-b b{color:var(--ui-brand-700)}
.sg-c.is-x{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.sg-c.is-x::before{background:var(--ui-danger-solid)}
.sg-c.is-x b{color:var(--ui-danger-ink)}

/* ---------------- ⑤ 订单卡 + 八点位工序轨道 ---------------- */
.wc{display:grid;grid-template-columns:repeat(auto-fit,minmax(430px,1fr));gap:10px}
.wc-card{border:1px solid var(--ui-line-100);border-radius:14px;background:var(--ui-bg-card);padding:12px 14px 10px;cursor:pointer;
  box-shadow:0 1px 2px rgba(28,28,28, .04);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.wc-card:hover{transform:translateY(-1.5px);border-color:var(--ui-brand-100);
  box-shadow:0 2px 6px rgba(28,28,28, .06),0 16px 30px -24px rgba(68,68,68, .6)}
.wc-hd{display:flex;align-items:center;gap:8px}
.wc-id{font-family:Consolas,ui-monospace,Menlo,monospace;font-size:13px;font-weight:800;color:var(--ui-ink-900)}
.wc-flags{display:flex;flex-wrap:wrap;gap:4px;min-width:0}
.wc-go{margin-left:auto;font-size:11px;font-weight:700;color:var(--sk-accent);white-space:nowrap;opacity:.65;transition:opacity .14s ease}
.wc-card:hover .wc-go{opacity:1}
.wc-cust{font-size:11px;color:var(--sk-ink-2);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wc-trk{display:flex;align-items:center;gap:4px;margin:8px 0 8px;overflow:hidden}
.wc-st{flex:0 0 auto;font-size:11px;font-weight:700;line-height:1;padding:4px 6px;border-radius:6px;white-space:nowrap;
  background:var(--ui-bg-page);color:var(--ui-ink-300);border:1px solid var(--ui-line-100)}
.wc-st.is-done{background:var(--ui-brand-050);color:var(--ui-brand-700);border-color:var(--ui-brand-100)}
.wc-st.is-now{background:linear-gradient(160deg,var(--sk-accent),var(--ui-brand-700));color:#fff;border-color:transparent;
  box-shadow:0 4px 10px -6px rgba(68,68,68, .9)}
.wc-ar{flex:0 0 5px;height:1px;background:var(--ui-line-200)}
.wc-ft{display:flex;align-items:center;gap:12px;padding-top:8px;border-top:1px solid var(--ui-bg-page)}
.wc-k{font-size:11px;color:var(--ui-ink-400);white-space:nowrap}
.wc-k b{font-size:12px;font-weight:800;color:var(--sk-ink);font-variant-numeric:tabular-nums;margin-left:2px}
.wc-k b.hot{color:var(--ui-danger-solid)}
.wc-pg{flex:1 1 auto;min-width:40px;height:5px;border-radius:4px;background:rgba(28,28,28, .06);overflow:hidden;margin-left:auto}
.wc-pg i{display:block;height:100%;border-radius:4px}
.wc-pg.is-unprod{background:repeating-linear-gradient(135deg,rgba(28,28,28, .06) 0 5px,transparent 5px 10px)}
.wc-pv{font-size:11px;font-weight:800;color:var(--sk-ink);font-variant-numeric:tabular-nums;min-width:38px;text-align:right}

/* ---------------- ⑥ 响应式 ---------------- */
@media (max-width:1440px){
  .wc{grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}
  .wc-st{font-size:11px;padding:4px 6px}
  .sg{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .sg-c b{font-size:18px}
  .dr-c b{font-size:12px}
  .dr-c .dr-lb{font-size:11px}
}
@media (max-width:1280px){
  .wc{grid-template-columns:1fr}
  .sg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ps-row{grid-template-columns:64px minmax(0,1fr) 70px;gap:8px}
  .cr-row{grid-template-columns:18px minmax(0,1fr) minmax(60px,1fr) 78px;gap:8px}
  .dr{grid-template-columns:repeat(4,1fr);height:auto;row-gap:8px}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v9.1「在制订单」精细打磨（用户：「已经好了太多了，可以做的更精美一些吗」）
   形态不再动，这一层只做「精度」：对齐、留白、层级、微交互、数字排版。
     ① 工序堆叠条：零工序收成一条细灰线（不再占一行的注意力）；偶数行浅底便于横扫；
        右侧补「单数」；条内色段之间加发丝白缝。
     ② 交期刻度尺：八格改成**高度即条数**的柱卡（38%~100%），空档位只占最矮一档，
        整行底部对齐 → 一眼看出分布形状，而不是八个一样高的空盒子。
     ③ 客户榜：补占比%，第一名整行浅底 + 名次牌描金边。
     ④ 八格仪表：等高、发丝分隔、进度格内嵌迷你条。
     ⑤ 全局：本页数字统一表格数字（tnum）、卡片头加重、发丝边与阴影统一到同一档。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 工序堆叠条 ---------------- */
.ps{gap:2px}
.ps-row{grid-template-columns:78px minmax(0,1fr) 108px;padding:6px 8px;border-radius:10px}
.ps-row:nth-child(even){background:rgba(28,28,28, .018)}
.ps-row:hover{background:var(--ui-brand-050)}
.ps-n{font-size:11px;letter-spacing:.01em}
.ps-b{height:15px;border-radius:8px;box-shadow:inset 0 1px 2px rgba(28,28,28, .05)}
.ps-b i{box-shadow:inset -1px 0 0 rgba(255,255,255,.65)}
.ps-b i:last-child{box-shadow:none}
/* 零工序：一条细灰线，不再用满宽斜纹占注意力 */
.ps-row.is-zero .ps-b{height:3px;border-radius:4px;background:rgba(28,28,28, .055);box-shadow:none}
.ps-empty{width:100%;background:transparent}
.ps-v{gap:2px}
.ps-v u{text-decoration:none;font-size:11px;color:var(--ui-ink-300);margin-left:6px;min-width:34px;text-align:right}
.ps-row.is-zero .ps-v u{color:var(--ui-line-200)}
.ps-lg{margin-top:10px;padding-top:10px;gap:6px 14px}
.ps-lg-i{font-size:11px}
.ps-lg-i i{width:10px;height:10px;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(28,28,28, .06)}

/* ---------------- ② 交期刻度尺（高度即条数） ---------------- */
.dr{align-items:end;gap:6px;padding-bottom:2px;
  background-image:linear-gradient(180deg,rgba(28,28,28, .035) 0 1px,transparent 1px);
  background-size:100% 25%;background-position:0 0;background-repeat:repeat-y}
.dr-c{height:var(--h,100%);justify-content:space-between;gap:4px;padding:10px 4px 8px;border-radius:10px;
  transition:transform .16s ease,box-shadow .16s ease}
.dr-c:hover{transform:translateY(-2px);box-shadow:0 10px 22px -16px rgba(28,28,28, .55)}
.dr-c b{font-size:14px;letter-spacing:-.3px}
.dr-c u{letter-spacing:.02em}
.dr-c .dr-lb{font-size:11px;font-weight:800;letter-spacing:.02em}
.dr-b{height:4px}
.dr-c.is-z{background:rgba(28,28,28, .022);border-color:rgba(28,28,28, .06)}
.dr-c.is-z b{font-size:13px}
.dr-c.is-x{box-shadow:inset 0 0 0 1px rgba(220,38,38,.10),0 8px 20px -18px rgba(179,32,46,.9)}
.dr-c.is-a{box-shadow:inset 0 0 0 1px rgba(217,119,6,.12)}

/* ---------------- ③ 客户条带榜 ---------------- */
.cr-row{grid-template-columns:22px minmax(0,1fr) minmax(70px,1.05fr) 132px;padding:6px 8px;border-radius:10px}
.cr-row.is-top{background:rgba(134,134,134, .045)}
.cr-row.is-top:hover{background:var(--ui-brand-050)}
.cr-i{width:21px;height:21px;border-radius:6px;font-size:11px;
  box-shadow:inset 0 0 0 1px rgba(28,28,28, .05)}
.cr-row.is-top .cr-i{box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 3px 8px -5px rgba(68,68,68, .9)}
.cr-row:nth-child(1) .cr-i{background:linear-gradient(160deg,var(--ui-brand-700),var(--ui-brand-900))}
.cr-b{height:10px;border-radius:4px}
.cr-b i{min-width:6px}
.cr-v{gap:2px}
.cr-v s{text-decoration:none;font-size:11px;color:var(--ui-ink-300);margin-left:6px;min-width:38px;text-align:right;font-variant-numeric:tabular-nums}

/* ---------------- ④ 八格仪表 ---------------- */
.sg{gap:10px}
.sg-c{padding:12px 12px 10px;border-radius:12px;background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(28,28,28, .03)}
.sg-c::before{left:12px;right:12px;height:2.5px;border-radius:0 0 4px 4px}
.sg-c b{font-size:24px;font-feature-settings:'tnum' 1,'ss01' 1}
.sg-c em{margin-left:4px}
.sg-c span{margin-top:4px;letter-spacing:.01em}
.sg-c.is-b .sg-c-i,.sg-c.is-x .sg-c-i{position:absolute;right:10px;top:10px;width:6px;height:6px;border-radius:50%}
.sg-c.is-b .sg-c-i{background:var(--sk-accent)}
.sg-c.is-x .sg-c-i{background:var(--ui-danger-solid);box-shadow:0 0 0 3px rgba(220,38,38,.14)}
.sg-mb{margin-top:6px;height:4px;border-radius:4px;background:rgba(28,28,28, .06);overflow:hidden}
.sg-mb i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--sk-accent),#c6c6c6)}

/* ---------------- ⑤ 全局精度层（只作用于本页 .dg-page[data-tab="table"] 内的卡片） ---------------- */
.dg-page .ov3-card{border-radius:16px;
  box-shadow:0 1px 2px rgba(28,28,28, .04),0 18px 40px -34px rgba(68,68,68, .55)}
.dg-page .ov3-h h3{letter-spacing:.01em}
.dg-page .ov3-h .ov3-ico{box-shadow:inset 0 1px 0 rgba(255,255,255,.85)}
.dg-page .ov3-h .ov3-meta{box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.dg-page .ov3-foot{color:var(--ui-ink-300)}
.dg-page .ov3-foot b{color:var(--ui-ink-500)}
/* 本页所有数字统一等宽对齐（表格数字），避免数位抖动 */
.ps-v b,.cr-v b,.sg-c b,.dr-c b,.wc-k b,.wc-pv,.dr-c u,.cr-v u{font-variant-numeric:tabular-nums}

/* ---------------- ⑥ 订单卡再精修 ---------------- */
.wc-card{border-radius:14px;padding:12px 14px 12px;background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-card))}
.wc-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.wc-card{position:relative}
.wc-id{letter-spacing:-.2px}
.wc-trk{gap:4px}
.wc-st{border-radius:6px;letter-spacing:.01em}
.wc-st.is-now{box-shadow:0 5px 12px -7px rgba(68,68,68, .95),inset 0 1px 0 rgba(255,255,255,.28)}
.wc-ft{gap:14px;padding-top:10px}
.wc-k b{letter-spacing:-.1px}
.wc-pg{height:6px;border-radius:4px}
.wc-pv{min-width:42px}

@media (max-width:1440px){
  .ps-row{grid-template-columns:70px minmax(0,1fr) 96px}
  .cr-row{grid-template-columns:20px minmax(0,1fr) minmax(60px,1fr) 118px}
  .dr-c b{font-size:13px}
}
@media (max-width:1280px){
  .ps-row{grid-template-columns:62px minmax(0,1fr) 84px}
  .cr-row{grid-template-columns:18px minmax(0,1fr) minmax(56px,1fr) 96px}
  .dr{align-items:stretch;background-image:none}
  .dr-c{height:auto}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v10「跨工段对账」重设计层（只作用于 .flow-page）
   这一页要回答的唯一问题是：「每一环闭合了吗？没闭合的是哪一环、差多少、为什么。」
   旧版把答案打散成 7 张同权重 KPI 卡 + 5 张大空盒子 + 一张 7 列表，真正的结论
   （10 条等式 9 条闭合、1 条差 +1）埋在满屏「守恒 差 0」胶囊与 8 个一模一样的 0 之间。
   本层把顺序倒过来：**先给结论**（页首深色结论带）→ 再给恒等式（一条算式）→
   再给流程（一条紧凑轨道，空段收声）→ 最后给逐环证据（差异在前、闭合折叠）。
   配色沿用本页既有语义色（青 #0C9AB8 闭合 / 琥珀 #E8A33D 提示 / 红 #E04553 差异 / 蓝 var(--sk-accent) 主色）。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 页首结论带（整页主角） ---------------- */
.flow-page .fl-verdict{
  display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);
  border-radius:16px;overflow:hidden;margin-bottom:14px;color:#fff;
  background:linear-gradient(188deg,var(--ui-ink-900) 0%,var(--ui-ink-900) 48%,var(--ui-ink-900) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 22px 44px -34px rgba(28,28,28, .95);
}
.flow-page .fl-verdict.is-bad{
  background:linear-gradient(188deg,var(--ui-ink-900) 0%,var(--ui-ink-700) 48%,var(--ui-ink-900) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 22px 44px -34px rgba(62,62,62, .95);
}
.flow-page .fl-vd-l{padding:18px 22px 18px;border-right:1px solid rgba(255,255,255,.10)}
.flow-page .fl-verdict.is-bad .fl-vd-l{border-right-color:rgba(255,255,255,.14)}
.flow-page .fl-vd-k{font-size:11px;font-weight:800;letter-spacing:.06em;color:rgba(255,255,255,.72)}
.flow-page .fl-vd-k em{font-style:normal;font-weight:600;letter-spacing:.10em;color:rgba(255,255,255,.38);margin-left:8px}
.flow-page .fl-vd-v{display:flex;align-items:baseline;gap:6px;margin-top:8px}
.flow-page .fl-vd-v b{font-size:40px;font-weight:800;line-height:1;letter-spacing:-1.6px;
  font-variant-numeric:tabular-nums;text-shadow:0 0 34px rgba(190,227,235,.35)}
.flow-page .fl-verdict.is-bad .fl-vd-v b{text-shadow:0 0 34px rgba(246,211,226,.40)}
.flow-page .fl-vd-v i{font-style:normal;font-size:20px;font-weight:700;color:rgba(255,255,255,.55);letter-spacing:-.4px}
.flow-page .fl-vd-v span{font-size:12px;font-weight:700;color:rgba(255,255,255,.80);margin-left:4px}
.flow-page .fl-vd-s{margin-top:8px;font-size:11px;color:rgba(255,255,255,.58);line-height:1.5}
.flow-page .fl-vd-s b{color:rgba(255,255,255,.92);font-variant-numeric:tabular-nums}

/* 右侧：唯一没闭合的那一条（可点击 → 滚到该行并高亮） */
.flow-page .fl-vd-r{
  position:relative;padding:18px 22px 16px;cursor:pointer;
  display:flex;flex-direction:column;justify-content:center;gap:6px;
  background:rgba(255,255,255,.035);transition:background .16s ease;
}
.flow-page .fl-vd-r:hover{background:rgba(255,255,255,.075)}
.flow-page .fl-vd-r.is-ok{cursor:default}
.flow-page .fl-vd-r.is-ok:hover{background:rgba(255,255,255,.035)}
.flow-page .fl-vd-badge{
  align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.04em;
  padding:4px 10px;border-radius:999px;background:rgba(246,211,226,.20);
  border:1px solid rgba(246,211,226,.42);color:var(--pl-pink-line);font-variant-numeric:tabular-nums;
}
.flow-page .fl-verdict.is-ok .fl-vd-badge{background:rgba(179,179,179, .18);border-color:rgba(179,179,179, .42);color:var(--ui-ok-line)}
.flow-page .fl-vd-t{font-size:14px;font-weight:800;color:#fff;letter-spacing:-.2px;line-height:1.35}
.flow-page .fl-vd-e{font-size:12px;color:rgba(255,255,255,.70);font-variant-numeric:tabular-nums;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}
.flow-page .fl-vd-e b{font-size:14px;font-weight:800;color:#fff;letter-spacing:-.3px}
.flow-page .fl-vd-op{color:rgba(255,255,255,.34)}
.flow-page .fl-vd-go{
  position:absolute;right:22px;bottom:16px;font-size:11px;font-weight:800;
  color:var(--pl-cyan-line);white-space:nowrap;opacity:.85;transition:opacity .16s ease;
}
.flow-page .fl-verdict.is-bad .fl-vd-go{color:var(--pl-pink-line)}
.flow-page .fl-vd-r:hover .fl-vd-go{opacity:1}
.flow-page .fl-vd-go b{font-weight:800}

/* ---------------- ② 守恒恒等式 + 辅助指标 ---------------- */
.flow-page .fl-id{
  background:var(--ui-bg-card);border:1px solid rgba(68,68,68, .10);border-radius:16px;margin-bottom:14px;
  box-shadow:0 1px 2px rgba(28,28,28, .04);
}
.flow-page .fl-id-eq{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:10px 14px;
  padding:16px 20px 14px;border-bottom:1px solid rgba(68,68,68, .10);
}
.flow-page .fl-id-v,.flow-page .fl-id-t{display:inline-flex;align-items:baseline;gap:6px}
.flow-page .fl-id-v b,.flow-page .fl-id-t b{
  font-size:28px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.9px;
  line-height:1;font-variant-numeric:tabular-nums;
}
.flow-page .fl-id-t b{font-size:24px;letter-spacing:-.7px}
.flow-page .fl-id-v i,.flow-page .fl-id-t i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-500)}
.flow-page .fl-id-v em,.flow-page .fl-id-t em{font-style:normal;font-size:11px;color:var(--sk-ink-2);margin-left:2px}
.flow-page .fl-id-op{font-size:18px;font-weight:700;color:var(--ui-line-200);align-self:center}
.flow-page .fl-id-ok{
  margin-left:auto;align-self:center;font-size:11px;font-weight:800;padding:4px 12px;border-radius:999px;
  background:rgba(12,154,184,.10);border:1px solid rgba(12,154,184,.24);color:var(--pl-cyan);white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.flow-page .fl-id-ok.is-bad{background:rgba(220,38,38,.10);border-color:rgba(220,38,38,.26);color:var(--ui-danger-solid)}
.flow-page .fl-id-sub{display:flex;flex-wrap:wrap;gap:6px 18px;padding:12px 20px 12px}
.flow-page .fl-ids{font-size:11px;color:var(--sk-ink-2);white-space:nowrap}
.flow-page .fl-ids b{font-size:13px;font-weight:800;color:var(--sk-ink);font-variant-numeric:tabular-nums;margin-left:4px}
.flow-page .fl-ids i{font-style:normal;font-size:11px;color:var(--ui-ink-400);margin-left:2px}
.flow-page .fl-ids.is-dim{color:var(--ui-ink-400)}
.flow-page .fl-ids.is-dim b{color:var(--ui-ink-300)}

/* ---------------- ③ 跨工段流向轨道（空段收声） ---------------- */
.flow-page .fl-rail-lg{
  display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;
  padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid rgba(68,68,68, .10);
}
.flow-page .fl-lg{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--ui-ink-400);white-space:nowrap}
.flow-page .fl-lg i{width:9px;height:9px;border-radius:4px;flex:none}
.flow-page .fl-lg i.is-ok{background:var(--pl-cyan)}
.flow-page .fl-lg i.is-warn{background:var(--ui-warn-solid)}
.flow-page .fl-lg i.is-mute{background:var(--ui-line-200)}
.flow-page .fl-lg-sp{flex:1 1 20px}
.flow-page .fl-lg-t{font-size:11px;color:var(--sk-ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.flow-page .fl-lg-t b{color:var(--sk-ink);font-weight:800}
.flow-page .fl-lg-t.is-dim{color:var(--ui-ink-400)}
.flow-page .fl-rail{display:flex;align-items:stretch;gap:0;min-height:168px}
.flow-page .fl-rn{
  flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px;cursor:pointer;
  padding:12px 14px 12px;border-radius:12px;border:1px solid rgba(68,68,68, .10);background:var(--ui-bg-card);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.flow-page .fl-rn:hover{transform:translateY(-1.5px);border-color:var(--ui-brand-100);
  box-shadow:0 2px 6px rgba(28,28,28, .06), 0 16px 30px -24px rgba(68,68,68, .6)}
/* 空段：不加边框、降对比、内容收窄 —— 让有料的那一段自己跳出来 */
.flow-page .fl-rn.is-mute{background:var(--ui-bg-soft);border-color:rgba(68,68,68, .10);box-shadow:none}
.flow-page .fl-rn.is-mute:hover{border-color:rgba(68,68,68, .16);background:var(--ui-bg-card)}
.flow-page .fl-rn.is-warn{background:var(--ui-warn-bg);border-color:var(--ui-bg-soft)}
.flow-page .fl-rn.is-ok{background:var(--ui-bg-card);border-color:var(--ui-line-100)}
.flow-page .fl-rn-hd{display:flex;align-items:center;gap:8px}
.flow-page .fl-rn-hd b{font-size:12px;font-weight:800;color:var(--ui-ink-900);letter-spacing:.01em}
.flow-page .fl-rn.is-mute .fl-rn-hd b{color:var(--ui-ink-400)}
.flow-page .fl-rn-dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--pl-cyan);
  box-shadow:0 0 0 3px rgba(12,154,184,.12)}
.flow-page .fl-rn-dot.is-warn{background:var(--ui-warn-solid);box-shadow:0 0 0 3px rgba(217,119,6,.14)}
.flow-page .fl-rn-dot.is-mute{background:var(--ui-line-200);box-shadow:none}
.flow-page .fl-rn-wip{display:flex;align-items:baseline;gap:6px}
.flow-page .fl-rn-wip b{font-size:28px;font-weight:800;line-height:1;color:var(--ui-ink-900);letter-spacing:-1.1px;
  font-variant-numeric:tabular-nums}
.flow-page .fl-rn.is-mute .fl-rn-wip b{font-size:20px;color:var(--ui-line-200);letter-spacing:-.5px}
.flow-page .fl-rn-wip i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-500)}
.flow-page .fl-rn-io{display:flex;gap:12px;font-size:11px;color:var(--ui-ink-400);font-variant-numeric:tabular-nums}
.flow-page .fl-rn-io b{font-weight:800;color:var(--ui-ink-700)}
.flow-page .fl-rn.is-mute .fl-rn-io b{color:var(--ui-ink-400)}
.flow-page .fl-rn-f{margin-top:auto;font-size:11px;font-weight:700;padding-top:8px;border-top:1px dashed rgba(68,68,68, .10);
  color:var(--pl-cyan);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flow-page .fl-rn.is-warn .fl-rn-f{color:var(--ui-warn-ink);border-top-color:var(--ui-bg-soft)}
.flow-page .fl-rn.is-mute .fl-rn-f{color:var(--ui-ink-300);border-top-color:var(--ui-bg-page)}
/* 段间连接：等宽发丝线，只写真实存在的「移交 N 条」，不按任何编造流量加粗 */
.flow-page .fl-rl{
  flex:0 0 66px;position:relative;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;
}
.flow-page .fl-rl i{width:100%;height:2px;border-radius:4px;
  background:linear-gradient(90deg,var(--ui-line-200),var(--ui-brand-100),var(--ui-line-200))}
.flow-page .fl-rl span{font-size:11px;color:var(--ui-ink-400);white-space:nowrap;font-variant-numeric:tabular-nums}
.flow-page .fl-rl span b{color:var(--sk-ink-2);font-weight:800}

/* ---------------- ④ 守恒等式列表（差异在前 / 闭合折叠） ---------------- */
.flow-page .fl-recon{display:flex;flex-direction:column;gap:8px}
.flow-page .fl-grp{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  padding:8px 12px;border:1px solid var(--ui-bg-page);border-radius:10px;background:var(--ui-bg-card);
  font-family:inherit;font-size:11px;color:var(--ui-ink-400);
}
.flow-page button.fl-grp{cursor:pointer;transition:background .14s ease}
.flow-page button.fl-grp:hover{background:var(--ui-bg-soft)}
.flow-page .fl-grp.is-bad{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.flow-page .fl-grp.is-info{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.flow-page .fl-gd{width:8px;height:8px;border-radius:4px;flex:none;background:var(--ui-line-200)}
.flow-page .fl-grp.is-bad .fl-gd{background:var(--ui-danger-solid)}
.flow-page .fl-grp.is-ok .fl-gd{background:var(--pl-cyan)}
.flow-page .fl-grp.is-info .fl-gd{background:var(--sk-accent)}
.flow-page .fl-gn{font-weight:800;color:var(--ui-ink-700);white-space:nowrap}
.flow-page .fl-grp.is-bad .fl-gn{color:var(--ui-danger-ink)}
.flow-page .fl-grp b{font-size:14px;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums}
.flow-page .fl-grp i{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.flow-page .fl-gnote{margin-left:auto;font-size:11px;color:var(--ui-ink-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flow-page .fl-caret{flex:none;width:0;height:0;border-left:4.5px solid transparent;border-right:4.5px solid transparent;
  border-top:5.5px solid var(--ui-ink-400);transition:transform .18s ease}
.flow-page .fl-grp.is-open .fl-caret{transform:rotate(180deg)}
.flow-page .fl-eqs{display:flex;flex-direction:column;gap:6px}
.flow-page .fl-eqs.is-fold{display:none}

.flow-page .fl-eq{
  display:grid;grid-template-columns:22px minmax(0,1fr) auto 24px;
  grid-template-rows:auto auto;align-items:center;gap:6px 12px;
  padding:10px 12px;border:1px solid rgba(68,68,68, .10);border-radius:12px;background:var(--ui-bg-card);
  transition:box-shadow .16s ease,border-color .16s ease;
}
.flow-page .fl-eq.is-ok{background:var(--ui-bg-card);border-color:var(--ui-line-100)}
.flow-page .fl-eq.is-info{background:var(--ui-bg-card);border-color:var(--ui-brand-100)}
.flow-page .fl-eq.is-bad{background:var(--pl-pink-bg);border-color:var(--pl-pink-line);
  box-shadow:0 2px 6px rgba(220,38,38,.06), 0 14px 28px -24px rgba(179,32,46,.7)}
/* ★ 2026-10-09 性能收口：这条"闪一下"原来直接动 box-shadow（非合成）。
   改成：静态闪环挂在 ::after 上，只让它的 opacity 走关键帧（1.6s 后由 flow.js 摘掉 class）。 */
.flow-page .fl-eq.is-flash{position:relative}
.flow-page .fl-eq.is-flash::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:0 0 0 4px rgba(220,38,38,.20), 0 14px 28px -18px rgba(179,32,46,.9);
  opacity:0;will-change:opacity;animation:flflash 1.6s ease;
}
@keyframes flflash{
  0%,100%{opacity:0}
  25%,75%{opacity:1}
}
.flow-page .fl-eglyph{
  grid-row:1/3;align-self:center;width:22px;height:22px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;background:var(--ui-line-100);color:var(--ui-ink-400);
}
.flow-page .fl-eglyph.is-ok{background:rgba(12,154,184,.12);color:var(--pl-cyan)}
.flow-page .fl-eglyph.is-bad{background:rgba(220,38,38,.14);color:var(--ui-danger-solid)}
.flow-page .fl-eglyph.is-info{background:rgba(134,134,134, .10);color:var(--sk-accent)}
.flow-page .fl-ehd{grid-column:2;display:flex;align-items:baseline;gap:8px;min-width:0}
.flow-page .fl-ehd b{font-size:12px;font-weight:800;color:var(--ui-ink-900);white-space:nowrap}
.flow-page .fl-etitle{font-size:11px;color:var(--ui-ink-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flow-page .fl-ehot{
  flex:none;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;
  background:rgba(220,38,38,.12);border:1px solid rgba(220,38,38,.28);color:var(--ui-danger-ink);white-space:nowrap;
}
.flow-page .fl-ebody{grid-column:2;display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0}
.flow-page .fl-et{display:inline-flex;align-items:baseline;gap:6px;min-width:0;
  padding:2px 8px;border-radius:6px;background:var(--ui-bg-page);border:1px solid rgba(68,68,68, .10)}
.flow-page .fl-et b{font-size:12px;font-weight:800;color:var(--sk-ink);font-variant-numeric:tabular-nums;letter-spacing:-.2px}
.flow-page .fl-et i{font-style:normal;font-size:11px;color:var(--ui-ink-500);max-width:260px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flow-page .fl-et.is-left{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.flow-page .fl-et.is-left b{color:var(--ui-brand-700);font-size:14px}
.flow-page .fl-eq.is-ok .fl-et{background:var(--ui-bg-page);border-color:var(--ui-bg-page)}
.flow-page .fl-eop{font-size:12px;font-weight:800;color:var(--ui-line-200)}
.flow-page .fl-eop.is-eq{color:var(--ui-ink-400);font-size:14px}
.flow-page .fl-ediff{
  grid-column:3;grid-row:1/3;justify-self:end;align-self:center;
  min-width:52px;text-align:right;font-size:12px;font-weight:800;
  font-variant-numeric:tabular-nums;color:var(--ui-ink-500);
}
.flow-page .fl-ediff.is-bad b{font-size:20px;font-weight:800;color:var(--ui-danger-solid);letter-spacing:-.6px}
.flow-page .fl-ediff.is-bad{color:var(--ui-danger-solid)}
.flow-page .fl-ediff.is-ok{color:var(--ui-ink-400)}
.flow-page .fl-ediff.is-info{font-size:11px;font-weight:700;color:var(--sk-accent)}
.flow-page .fl-einfo{
  grid-column:4;grid-row:1/3;align-self:center;text-align:center;
  width:20px;height:20px;line-height:20px;border-radius:6px;font-size:11px;color:var(--ui-ink-400);
  background:var(--ui-bg-page);cursor:help;
}
.flow-page .fl-eq:hover .fl-einfo{background:var(--ui-brand-050);color:var(--sk-accent)}

/* 折叠组内的行更收一点：它们是「同一句话重复 N 遍」 */
.flow-page .fl-eqs.is-fold + .fl-eqs,
.flow-page .fl-eqs .fl-eq.is-ok{padding:8px 12px}

/* ---------------- ⑤ 响应式 ---------------- */
@media (max-width:1440px){
  .flow-page .fl-vd-v b{font-size:40px}
  .flow-page .fl-id-v b{font-size:24px}
  .flow-page .fl-id-t b{font-size:20px}
  .flow-page .fl-rl{flex-basis:44px}
  .flow-page .fl-et i{max-width:180px}
}
@media (max-width:1280px){
  .flow-page .fl-verdict{grid-template-columns:1fr}
  .flow-page .fl-vd-l{border-right:0;border-bottom:1px solid rgba(255,255,255,.10)}
  .flow-page .fl-vd-go{position:static;align-self:flex-start;margin-top:2px}
  .flow-page .fl-rail{flex-wrap:wrap;gap:8px}
  .flow-page .fl-rn{flex:1 1 200px}
  .flow-page .fl-rl{flex:0 0 100%;flex-direction:row;gap:10px;height:22px}
  .flow-page .fl-rl i{width:2px;height:100%;background:linear-gradient(180deg,var(--ui-line-200),var(--ui-brand-100))}
  .flow-page .fl-eq{grid-template-columns:22px minmax(0,1fr) auto 24px}
  .flow-page .fl-et i{max-width:140px}
}


/* ---------------- ⑤b v10 修正：≤1280px 的栅格塌陷 ----------------
   theme.css 第 557 行遗留规则 `.ov3-card.c-t30{grid-column:span 2!important}`（≤1280px）
   会把本页 5 张宽卡全部压成 2/12 宽，卡片头挤成一行、正文互相压叠。
   本页每张卡都是一张宽表，窄屏应该是「整屏一张卡」而不是六张挤一行。 */
@media (max-width:1280px){
  .flow-page .ov3-grid .ov3-card.c-t30{grid-column:span 12!important}
}
/* 轨道节点：内容不许把卡片撑宽（nowrap 的标签是横向溢出的根因） */
.flow-page .fl-rn{min-width:0;overflow:hidden}
.flow-page .fl-rn-io{flex-wrap:wrap}
.flow-page .fl-rn-f{max-width:100%}
.flow-page .fl-rl{min-width:0}
.flow-page .fl-id-eq,.flow-page .fl-id-sub{min-width:0}
.flow-page .fl-id-sub{row-gap:8px}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v11「跨工段对账」收敛层（只作用于 .flow-page）
   用户原话：「重新推翻重做，太乱了」。v10 把结论提上来了，但主视野还留着三块「文档」：
   ① 五段各一块 380px 的大牌子（4 段是 0，等于 4/5 的版面在说「这里什么都没有」）；
   ② 点开任一段就在流程图下面铺一屏密集长文（参考平台卡名 / 上游构成 / 台账口径 / 状态卡）；
   ③ 缺口清单 6 行 × 6 段长文、异常路径 19 行记录表。
   这一层把 ①②③ 全部移出主视野（详情进抽屉、长文进页底折叠区、记录表进 <details>），
   主视野只留数字：一条在制构成条 + 五段一行一段的数字表。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 在制构成条 ---------------- */
.flow-page .fl-wip{
  border:1px solid rgba(68,68,68, .10);border-radius:14px;background:var(--ui-bg-card);padding:14px 16px 14px;margin-bottom:14px;
}
.flow-page .fl-wip-hd{display:flex;align-items:baseline;gap:6px;font-size:12px;color:var(--sk-ink-2);font-weight:700}
.flow-page .fl-wip-hd b{font-size:24px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-.9px;line-height:1;
  font-variant-numeric:tabular-nums}
.flow-page .fl-wip-hd i{font-style:normal;font-size:11px;color:var(--ui-ink-500)}
.flow-page .fl-wip-note{margin-left:auto;font-size:11px;font-weight:600;color:var(--ui-ink-400)}
.flow-page .fl-wip-note b{font-size:11px;color:var(--sk-ink-2);letter-spacing:0}
.flow-page .fl-wip-bar{display:flex;height:22px;border-radius:6px;overflow:hidden;margin-top:12px;
  background:rgba(28,28,28, .05);box-shadow:inset 0 1px 2px rgba(28,28,28, .05)}
.flow-page .fl-wb-s{display:block;height:100%;transition:filter .15s ease}
.flow-page .fl-wb-s + .fl-wb-s{box-shadow:inset 2px 0 0 rgba(255,255,255,.85)}
.flow-page .fl-wb-s:hover{filter:brightness(1.08)}
.flow-page .fl-wip-lg{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px}
.flow-page .fl-wlg-i{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--sk-ink-2);
  white-space:nowrap;font-variant-numeric:tabular-nums}
.flow-page .fl-wlg-i i{width:9px;height:9px;border-radius:4px;flex:none}
.flow-page .fl-wlg-i b{font-size:12px;font-weight:800;color:var(--sk-ink)}
.flow-page .fl-wlg-i em{font-style:normal;font-size:11px;color:var(--ui-ink-400)}
.flow-page .fl-wlg-i.is-dim{color:var(--ui-ink-400)}

/* ---------------- ② 五段数字表 ---------------- */
.flow-page .fl-stab{margin-top:0}
.flow-page .fl-stab thead th{font-size:11px;color:var(--ui-ink-500);font-weight:700;white-space:nowrap;
  padding-top:0;padding-bottom:8px}
.flow-page .fl-srow{cursor:pointer;transition:background .13s ease}
.flow-page .fl-srow:hover{background:var(--ui-brand-050)}
.flow-page .fl-srow.is-mute{background:var(--ui-bg-card)}
.flow-page .fl-srow.is-mute .fl-sn b{color:var(--ui-ink-400)}
.flow-page .fl-sn b{font-size:12px;font-weight:800;color:var(--ui-ink-900)}
.flow-page .fl-stag{margin-left:6px;font-size:11px;font-weight:700;color:var(--ui-ink-400);
  background:var(--ui-bg-page);border:1px solid rgba(68,68,68, .10);border-radius:4px;padding:0 6px}
.flow-page .fl-sw b{font-size:14px;font-weight:800;color:var(--ui-ink-900);font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.flow-page .fl-srow.is-mute .fl-sw b{color:var(--ui-line-200);font-weight:700}
.flow-page .fl-dim{color:var(--ui-line-200)}
.flow-page .fl-sd{display:inline-block;min-width:34px;text-align:right;font-size:12px;font-weight:800;
  font-variant-numeric:tabular-nums}
.flow-page .fl-sd.is-ok{color:var(--ui-ink-400)}
.flow-page .fl-sd.is-warn{color:var(--ui-warn-ink)}
.flow-page .fl-sd.is-n{color:var(--sk-ink-2)}
.flow-page .fl-slight{display:inline-flex;align-items:center;font-size:11px;font-weight:700;white-space:nowrap}
.flow-page .fl-slight::before{content:"";width:7px;height:7px;border-radius:50%;margin-right:6px;flex:none}
.flow-page .fl-slight.is-ok{color:var(--pl-cyan)}
.flow-page .fl-slight.is-ok::before{background:var(--pl-cyan)}
.flow-page .fl-slight.is-warn{color:var(--ui-warn-ink)}
.flow-page .fl-slight.is-warn::before{background:var(--ui-warn-solid)}
.flow-page .fl-slight.is-mute{color:var(--ui-ink-300)}
.flow-page .fl-slight.is-mute::before{background:var(--ui-line-200)}

/* ---------------- ③ 缺口摘要（代替 6×6 长文对照表） ---------------- */
.flow-page .fl-sum{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;padding:4px 0 6px}
.flow-page .fl-sum-big{display:flex;align-items:baseline;gap:4px}
.flow-page .fl-sum-big b{font-size:32px;font-weight:800;color:var(--ui-ink-900);letter-spacing:-1.2px;line-height:1;
  font-variant-numeric:tabular-nums}
.flow-page .fl-sum-big i{font-style:normal;font-size:12px;font-weight:700;color:var(--ui-ink-500)}
.flow-page .fl-sum-big span{font-size:12px;color:var(--sk-ink-2);font-weight:700;margin-left:4px}
.flow-page .fl-sum-cells{display:flex;gap:8px}
.flow-page .fl-sum-cells span{display:flex;flex-direction:column;gap:2px;min-width:74px;
  padding:8px 12px;border-radius:10px;background:var(--ui-bg-soft);border:1px solid rgba(68,68,68, .10)}
.flow-page .fl-sum-cells b{font-size:16px;font-weight:800;line-height:1.1;color:var(--sk-ink);font-variant-numeric:tabular-nums}
.flow-page .fl-sum-cells i{font-style:normal;font-size:11px;color:var(--ui-ink-500)}
.flow-page .fl-sum-cells .is-plat b{color:var(--ui-danger-solid)}
.flow-page .fl-sum-cells .is-part b{color:var(--ui-warn-ink)}
.flow-page .fl-sum-cells .is-done b{color:var(--pl-cyan)}
.flow-page .fl-sum-cells .is-open b{color:var(--ui-ink-900)}
.flow-page .fl-sum-chips{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 320px}
.flow-page .fl-gchip{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;
  color:var(--sk-ink-2);background:var(--ui-bg-soft);border:1px solid rgba(68,68,68, .10);border-radius:999px;padding:4px 10px;white-space:nowrap}
.flow-page .fl-gchip b{font-size:12px;font-weight:800;color:var(--sk-ink);font-variant-numeric:tabular-nums}
.flow-page .fl-gchip em{font-style:normal;font-size:11px;font-weight:800;color:var(--ui-danger-ink);
  background:rgba(220,38,38,.12);border-radius:999px;padding:0 6px}
.flow-page .fl-gchip.is-done{border-color:var(--ui-line-100)}
.flow-page .fl-gchip.is-done b{color:var(--pl-cyan)}
.flow-page .fl-sum-note{flex:1 1 100%;font-size:11px;color:var(--ui-ink-400);line-height:1.55;
  padding-top:10px;border-top:1px dashed var(--ui-bg-page)}
.flow-page .fl-sum-note b{color:var(--ui-ink-400);font-weight:700}
.flow-page .fl-sum.is-ok{font-size:12px;color:var(--pl-cyan);font-weight:700}
.flow-page .fl-sum.is-ok b{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
.flow-page .fl-sum.is-ok i{font-style:normal;font-size:11px}

/* ---------------- ④ 异常路径：记录表收进原生 <details> ---------------- */
.flow-page .fl-det{margin-top:12px;border:1px solid rgba(68,68,68, .10);border-radius:12px;background:var(--ui-bg-card);overflow:hidden}
.flow-page .fl-det>summary{
  cursor:pointer;list-style:none;padding:10px 14px;font-size:11px;font-weight:700;color:var(--sk-ink-2);
  background:var(--ui-bg-soft);transition:background .14s ease;
}
.flow-page .fl-det>summary::-webkit-details-marker{display:none}
.flow-page .fl-det>summary::before{content:"▸";display:inline-block;margin-right:8px;color:var(--ui-ink-400);
  transition:transform .18s ease}
.flow-page .fl-det[open]>summary::before{transform:rotate(90deg)}
.flow-page .fl-det>summary:hover{background:var(--ui-brand-050);color:var(--sk-accent)}
.flow-page .fl-det-b{padding:10px 14px 12px}
.flow-page .fl-det-b .bp-table{margin-top:0}

/* ---------------- ⑤ 响应式 ---------------- */
@media (max-width:1440px){
  .flow-page .fl-wip-hd b{font-size:20px}
  .flow-page .fl-sum-big b{font-size:24px}
  .flow-page .fl-sum-cells span{min-width:64px;padding:6px 10px}
}
@media (max-width:1280px){
  .flow-page .fl-wip-note{margin-left:0;flex:1 1 100%;margin-top:4px}
  .flow-page .fl-sum{gap:10px 14px}
  .flow-page .fl-sum-chips{flex:1 1 100%}
  .flow-page .fl-stab thead th:nth-child(4),.flow-page .fl-stab tbody td:nth-child(4){display:none}
}
/* v11 修正：窄屏下「19 条 在制，按工段摊开」会被挤成两行 */
.flow-page .fl-wip-hd{flex-wrap:wrap}
.flow-page .fl-wip-hd>b,.flow-page .fl-wip-hd>i{flex:none}
.flow-page .fl-wip-hd{row-gap:2px}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v12「跨工段对账」图表化层（只作用于 .flow-page）
   用户要求：「全都做成高端可视化图表的样式」。
   这一页的真实数据形状是「一条独大 + 大量 0」（4/5 段为 0、唯一差异 +1/297＝0.3%），
   所以**按比例画长度是没用的**：297 与 296 画出来一样长、0 画出来是看不见的线。
   本层只用三种在这里真正传达信息的图形，全部纯 SVG（不引图表库）：
     · 环形占比（在制按工段 / 缺口按状态）—— 0 值不画弧、不留空槽
     · 环形量表（7/8 环闭合）—— 闭合绿弧 + 差异红弧，环心写分数
     · 迷你条（五段在制）—— 只在同一列内比大小，不做跨列比例
   环形用 stroke-dasharray 画弧，旋转 -90° 从 12 点起，段与段之间留发丝白缝。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 环形基础 ---------------- */
.flow-page .fl-ring{display:block;width:100%;height:auto;overflow:visible}
.flow-page .fl-ring-bg{fill:none;stroke:rgba(28,28,28, .055);stroke-width:11}
.flow-page .fl-arc{
  fill:none;stroke-width:11;stroke-linecap:butt;
  transition:stroke-width .18s ease,opacity .18s ease;
  /* 段间白缝：靠 dash 的起止各自内缩视觉上完成，这里用描边端点处理 */
  paint-order:stroke;
}
.flow-page .fl-arc:hover{stroke-width:14}
.flow-page .fl-arc.is-empty{stroke:rgba(28,28,28, .06);stroke-linecap:round}
.flow-page .fl-ring-b{
  text-anchor:middle;dominant-baseline:middle;
  font-size:24px;font-weight:800;fill:var(--ui-ink-900);letter-spacing:-1px;
  font-variant-numeric:tabular-nums;
}
.flow-page .fl-ring-s{
  text-anchor:middle;dominant-baseline:middle;
  font-size:11px;font-weight:700;fill:var(--ui-ink-500);
}
/* 深色底上的环（结论带里那个） */
.flow-page .fl-ring.is-dark .fl-ring-bg{stroke:rgba(255,255,255,.14)}
.flow-page .fl-ring.is-dark .fl-ring-b{fill:#fff;font-size:24px}
.flow-page .fl-ring.is-dark .fl-ring-s{fill:rgba(255,255,255,.62)}

/* ---------------- ② 结论带里的量表 ---------------- */
.flow-page .fl-vd-vwrap{display:flex;align-items:center;gap:16px;margin-top:6px}
.flow-page .fl-vd-ring{flex:0 0 86px;width:86px;margin-top:0}
.flow-page .fl-vd-vc{min-width:0}
.flow-page .fl-vd-v{margin-top:0}
.flow-page .fl-vd-v b{font-size:40px}

/* ---------------- ③ 在制构成：环形 + 图例 ---------------- */
.flow-page .fl-wip{
  display:flex;align-items:center;gap:20px;
  border:1px solid rgba(68,68,68, .10);border-radius:16px;background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft));
  padding:14px 20px;margin-bottom:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.flow-page .fl-wip-ring{flex:0 0 118px;width:118px}
.flow-page .fl-wip-side{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:10px}
.flow-page .fl-wip-hd{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;
  font-size:13px;color:var(--ui-ink-700);font-weight:800;letter-spacing:.01em;
}
.flow-page .fl-wip-note{margin-left:auto;font-size:11px;font-weight:600;color:var(--ui-ink-400)}
.flow-page .fl-wip-note b{font-size:11px;color:var(--sk-ink-2);font-weight:800;letter-spacing:0}
.flow-page .fl-wip-lg{display:flex;flex-wrap:wrap;gap:8px 18px}
.flow-page .fl-wlg-i{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--sk-ink-2);
  white-space:nowrap;font-variant-numeric:tabular-nums}
.flow-page .fl-wlg-i i{width:10px;height:10px;border-radius:4px;flex:none;
  box-shadow:inset 0 0 0 1px rgba(28,28,28, .06)}
.flow-page .fl-wlg-i b{font-size:14px;font-weight:800;color:var(--sk-ink);letter-spacing:-.3px}
.flow-page .fl-wlg-i em{font-style:normal;font-size:11px;color:var(--ui-ink-400);
  background:var(--ui-bg-page);border-radius:999px;padding:2px 8px}
.flow-page .fl-wlg-i.is-dim{color:var(--ui-ink-400)}

/* ---------------- ④ 五段表的迷你条 ---------------- */
.flow-page .fl-sw{position:relative;padding-right:14px}
.flow-page .fl-mini{
  display:block;height:4px;border-radius:4px;background:rgba(28,28,28, .06);
  margin-top:4px;overflow:hidden;
}
.flow-page .fl-mini i{display:block;height:100%;border-radius:4px;
  background:linear-gradient(90deg,var(--ui-brand-700),var(--sk-accent));transition:width .3s ease}
.flow-page .fl-srow.is-warn .fl-mini i{background:linear-gradient(90deg,var(--ui-warn-ink),var(--ui-warn-solid))}
.flow-page .fl-srow.is-mute .fl-mini{background:transparent}
.flow-page .fl-srow.is-mute .fl-mini i{background:var(--ui-line-200)}

/* ---------------- ⑤ 缺口摘要：环形 + 计数格 ---------------- */
.flow-page .fl-sum{align-items:center;gap:16px 22px}
.flow-page .fl-sum-ring{flex:0 0 104px;width:104px}
.flow-page .fl-sum-cells span{
  min-width:78px;padding:8px 12px;border-radius:10px;
  background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(28,28,28, .03);
}
.flow-page .fl-sum-cells b{font-size:18px}

/* ---------------- ⑥ 响应式 ---------------- */
@media (max-width:1440px){
  .flow-page .fl-vd-ring{flex-basis:74px;width:74px}
  .flow-page .fl-vd-v b{font-size:32px}
  .flow-page .fl-wip-ring{flex-basis:100px;width:100px}
  .flow-page .fl-sum-ring{flex-basis:90px;width:90px}
  .flow-page .fl-ring-b{font-size:24px}
}
@media (max-width:1280px){
  .flow-page .fl-wip{flex-direction:column;align-items:flex-start;gap:14px}
  .flow-page .fl-wip-ring{flex:none;width:104px;align-self:center}
  .flow-page .fl-wip-note{margin-left:0}
  .flow-page .fl-sum{flex-wrap:wrap}
  .flow-page .fl-sum-ring{flex:none;width:92px}
}


/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v13「跨工段对账」第一屏运维化层（只作用于 .flow-page）
   用户（DNA 引物合成实验室）第三次说「太乱了，乍一看都不知道是干嘛的」。
   根因（已与用户确认）：本页挂在左侧导航「交期与考核」组里、同组都是运维页，
   首屏却先给一份数据迁移审计（守恒等式 / 缺口清单 / 口径原文）。用户选定方向：
   **第一屏＝运维，第二屏＝收起的审计**。本层只加三样新东西，其余全部复用
   v10 / v11 / v12 既有类（.fl-verdict .fl-id .fl-wip .fl-ring .fl-stab .fl-srow
   .fl-mini .fl-sum .fl-det .fl-recon .fl-eq .fl-grp .fl-eqs 的原规则一律不动）：
     ① 页首一句白话     .fl-purpose
     ② 折叠的「数据一致性核对」外壳  .fl-audit / .fl-audit-h / .fl-audit-b
     ③ 交接账末列「压在哪个状态」的胶囊 .fl-stc ＋「对账不为 0」的行标记 .is-off
   另外把 v11 在 ≤1280px 藏掉 .fl-stab 第 4 列的规则**收窄到旧表**：
   v13 的交接账是 6 列、末列是运维要点，六列必须齐全（见第 ④ 段）。
   回滚：删掉本层 + 用 .snapshots/flow-pre-v13.js 覆盖 server/public/flow.js 即回到 v12。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 页首一句白话（这页是什么 · 数据从哪来） ---------------- */
.flow-page .fl-purpose{
  display:flex;align-items:center;gap:10px;min-width:0;
  margin:0 0 10px;padding:8px 14px;
  font-size:12px;line-height:1.5;font-weight:600;color:var(--ui-ink-500);
  background:linear-gradient(180deg,var(--ui-brand-050),var(--ui-brand-100));
  border:1px solid var(--ui-brand-100);border-radius:12px;
}
.flow-page .fl-purpose::before{
  content:"";flex:none;width:3px;height:14px;border-radius:4px;
  background:linear-gradient(180deg,var(--sk-accent),var(--pl-cyan));
}

/* ---------------- ② 交接账末列：压在哪个状态 ---------------- */
.flow-page .fl-sst{white-space:normal;word-break:keep-all;line-height:1.95;min-width:0}
.flow-page .fl-stc{
  display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap;
  font-size:11px;font-weight:700;color:var(--sk-ink-2);
  background:var(--ui-bg-soft);border:1px solid rgba(68,68,68, .10);border-radius:999px;padding:2px 10px;
}
.flow-page .fl-stc + .fl-stc{margin-left:6px}
.flow-page .fl-stc + .fl-stc::before{
  content:"·";margin-right:4px;font-weight:800;color:var(--ui-line-200);
}
.flow-page .fl-stc b{font-size:12px;font-weight:800;color:var(--sk-ink);font-variant-numeric:tabular-nums}
.flow-page .fl-stc.is-done{background:var(--ui-bg-page);border-color:var(--ui-line-200)}
.flow-page .fl-stc.is-done b{color:var(--pl-cyan)}
.flow-page .fl-stc.is-hold{background:var(--pl-pink-bg);border-color:var(--pl-pink-line)}
.flow-page .fl-stc.is-hold b{color:var(--ui-danger-solid)}
.flow-page .fl-stc.is-od{background:var(--ui-bg-soft);border-color:var(--pl-cyan-bg)}
.flow-page .fl-stc.is-od b{color:var(--pl-cyan)}
.flow-page .fl-stc.is-supp{background:var(--ui-warn-bg);border-color:var(--ui-warn-line)}
.flow-page .fl-stc.is-supp b{color:var(--ui-warn-ink)}

/* 对账不为 0 的行：全表只此一处「异常标记」，做成极淡底色 + 首格 2px 琥珀发丝线，
   不换字色、不加重边框（审计状态已移到折叠区，这里只提示「这一行没对上」）。 */
.flow-page .fl-srow.is-off{background:var(--ui-warn-bg)}
.flow-page .fl-srow.is-off:hover{background:var(--ui-warn-bg)}
.flow-page .fl-srow.is-off>.fl-sn{box-shadow:inset 2px 0 0 var(--ui-warn-solid)}
.flow-page .fl-sd.is-bad{color:var(--ui-danger-ink)}
.flow-page .fl-ledger tbody td{vertical-align:middle}
.flow-page .fl-ledger tbody .fl-sst{padding-top:6px;padding-bottom:6px}

/* ---------------- ③ 默认收起的「数据一致性核对」区 ---------------- */
.flow-page .fl-audit{grid-column:span 12;min-width:0}
.flow-page .fl-audit-h{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;font-family:inherit;
  cursor:pointer;padding:14px 18px;border:1px solid var(--ui-line-100);border-radius:16px;background:var(--ui-bg-card);
  box-shadow:0 1px 2px rgba(28,28,28, .04);
  transition:background .15s ease,box-shadow .15s ease;
}
.flow-page .fl-audit-h:hover{background:var(--ui-brand-050);box-shadow:0 2px 12px -8px rgba(28,28,28, .45)}
.flow-page .fl-audit-h:focus-visible{outline:2px solid var(--sk-accent);outline-offset:2px}
.flow-page .fl-audit-h>b{flex:none;font-size:14px;font-weight:800;color:var(--ui-ink-900);letter-spacing:.2px}
.flow-page .fl-audit-h.is-open .fl-caret{transform:rotate(180deg)}
.flow-page .fl-audit-m{
  font-size:11px;color:var(--ui-ink-400);font-variant-numeric:tabular-nums;
  background:var(--ui-bg-soft);border:1px solid rgba(68,68,68, .10);border-radius:999px;padding:2px 10px;
}
.flow-page .fl-audit-t{margin-left:auto;font-size:11px;font-weight:800;color:var(--sk-accent);white-space:nowrap}
.flow-page .fl-audit-en{font-size:11px;font-weight:800;letter-spacing:1.6px;color:var(--ui-ink-300);white-space:nowrap}

.flow-page .fl-audit-b{margin-top:10px;min-width:0}
.flow-page .fl-audit-b.is-fold{display:none}
/* 收起的审计区里，内在卡片不再各套一层卡片皮（避免「卡中卡」看花眼）：
   一律去底色、去边框、去投影，只用一条虚线分隔，省下的版面留给正文。 */
.flow-page .fl-audit-b>.ov3-card{
  background:transparent;border:0;box-shadow:none;border-radius:0;padding:0 2px;
}
.flow-page .fl-audit-b>.ov3-card+.ov3-card{
  margin-top:14px;padding-top:14px;border-top:1px dashed var(--ui-line-100);
}

/* ---------------- ④ 响应式：第一屏在 1280px 不许横向溢出 ---------------- */
@media (max-width:1280px){
  /* v11 的老规则把 .fl-stab 第 4 列隐藏（那是给 8 列旧表腾地方的）。
     v13 的交接账是 6 列，「本道转出」与末列「压在哪个状态」都是运维要点，必须齐全 —— 这里显式恢复。 */
  .flow-page .fl-stab thead th:nth-child(4),
  .flow-page .fl-stab tbody td:nth-child(4){display:table-cell}
  .flow-page .fl-ledger thead th,
  .flow-page .fl-ledger tbody td{padding-left:6px;padding-right:6px}
  .flow-page .fl-stc{font-size:11px;padding:2px 8px}
  .flow-page .fl-stc + .fl-stc{margin-left:4px}
  .flow-page .fl-audit-m{font-size:11px;padding:2px 8px}
  .flow-page .fl-audit-en{display:none}
}
@media (max-width:1280px){
  .flow-page .fl-audit{grid-column:span 2}
  .flow-page .fl-audit-h{flex-wrap:wrap;row-gap:6px}
  .flow-page .fl-audit-t{margin-left:0}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v14「跨工段对账」主题色对齐 + 需要跟进的层（只作用于 .flow-page）
   这一层只做两件事，都很机械：
   ① 主题色对齐（说明，不含规则）：v10–v13 四层里手挑的那批色值已**就地**换回项目
      design token —— 旧值共 14 个（青 / 红 / 橙 / 蓝 / 深蓝两种 / 蓝灰 / 红字 / 橙字两种 /
      粉），完整旧→新对照表见 .snapshots/v14-配色映射.md（此处不写旧值，以免污染全库检索）；
      换回后的 token：青 #0D94B0、红 #e11d48、橙 #d97706、蓝 #5e5e5e、深蓝 var(--sk-accent-deep)、
      红字 #be123c、橙字 #b45309、粉 #fda4af，以及同色相的 rgba() 写法；结论带换成
      侧栏同一套深海军蓝，卡面统一用 --card（#ffffff→#f9f9f9），
      发丝线统一 rgba(68,68,68, .10)/.16，三档灰字统一 --txt-3 / #777777 / #828282。
      就地换色是为了「本页作用域内零残留」，故本层不再重复声明颜色；
      theme.css 侧整轮回滚请用 .snapshots/theme-pre-v14.css 覆盖。
   ② 新块「需要跟进的」（#flowTodo）：第一屏排在「现在什么情况」数字带与交接账之间，
      只回答「有没有需要我去跟的东西？」—— 滞留（合作单豁免 · 仅提示不计考核）＋
      重合 / 补合 ＋ 工段交接（副标：绑定流转单元）＋ 溯源自段。
      它**不替代、不去重**折叠审计区里的「异常路径」卡：那块仍由 flowExcKpisHtml 与
      原生 <details> 记录表原样渲染，一个字未改。本层新增的类一律 .fl-todo*；
      0 一律渲染成灰的 0（绝不隐藏），字段缺失写「—」（绝不把缺失当 0）。
   回滚：删掉本层即撤销 ② 的全部样式（① 是就地换色，靠 theme-pre-v14.css 快照回滚）。
   ════════════════════════════════════════════════════════════════════════════ */

/* ---------------- ① 「需要跟进的」横条（第一屏摘要） ---------------- */
.flow-page .fl-todo{
  display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;min-width:0;
  margin-bottom:14px;padding:12px 18px;
  background:linear-gradient(180deg,var(--ui-bg-card),var(--ui-bg-soft));
  border:1px solid rgba(68,68,68, .10);border-radius:14px;
  box-shadow:0 1px 2px rgba(28,28,28, .04);
}
.flow-page .fl-todo-hd{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 12px;min-width:0;flex:1 1 auto}
.flow-page .fl-todo-h{font-size:20px;font-weight:800;letter-spacing:-.5px;line-height:1.25;color:var(--ui-ink-900)}
.flow-page .fl-todo-h.is-zero{color:var(--ui-ok-solid)}
.flow-page .fl-todo-h.is-todo{color:var(--ui-danger-solid)}
.flow-page .fl-todo-h.is-unknown{font-size:13px;font-weight:700;color:var(--ui-ink-400)}
/* 合作单滞留那半句：永远渲染（0 也是灰的 0，不隐藏），鼠标悬停给豁免规则原文 */
.flow-page .fl-todo-ex{font-size:11px;font-weight:700;color:var(--ui-ink-400);white-space:nowrap;cursor:help}
.flow-page .fl-todo-ex b{font-size:13px;font-weight:800;color:var(--ui-ink-500);font-variant-numeric:tabular-nums;margin:0 2px}
.flow-page .fl-todo-ex.is-zero b{color:var(--ui-ink-400)}
.flow-page .fl-todo-ex.is-unknown b{color:var(--ui-ink-300)}
/* 三块紧凑小砖：重合 / 补合 · 工段交接（带副标） · 溯源自段 */
.flow-page .fl-todo-tiles{display:flex;align-items:stretch;flex-wrap:wrap;gap:8px;flex:0 1 auto;min-width:0}
.flow-page .fl-todo-t{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 6px;min-width:0;white-space:nowrap;
  padding:6px 12px;border-radius:10px;cursor:help;
  background:var(--ui-bg-soft);border:1px solid rgba(68,68,68, .10);
}
.flow-page .fl-todo-tn{font-size:11px;font-weight:700;color:var(--sk-ink-2)}
.flow-page .fl-todo-tv{display:inline-flex;align-items:baseline;gap:2px}
.flow-page .fl-todo-tv b{font-size:16px;font-weight:800;color:var(--sk-ink);letter-spacing:-.4px;font-variant-numeric:tabular-nums}
.flow-page .fl-todo-tv i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.flow-page .fl-todo-ts{flex:1 1 100%;font-size:11px;font-weight:600;color:var(--ui-ink-400)}
.flow-page .fl-todo-ts b{font-weight:800;color:var(--ui-ink-500);font-variant-numeric:tabular-nums;margin:0 2px}
/* 0 = 灰的 0（绝不隐藏）；字段缺失 = 灰的「—」（绝不假设成 0） */
.flow-page .fl-todo-t.is-zero .fl-todo-tv b{color:var(--ui-ink-400)}
.flow-page .fl-todo-t.is-zero .fl-todo-tv i{color:var(--ui-ink-300)}
.flow-page .fl-todo-t.is-zero .fl-todo-ts,
.flow-page .fl-todo-ts.is-zero{color:var(--ui-ink-400)}
.flow-page .fl-todo-ts.is-zero b{color:var(--ui-ink-400)}
.flow-page .fl-todo-t.is-unknown .fl-todo-tv b,
.flow-page .fl-todo-ts.is-unknown b{color:var(--ui-ink-300)}

/* ---------------- ② 响应式：第一屏在 1280px 不许横向溢出 ---------------- */
@media (max-width:1440px){
  .flow-page .fl-todo{padding:12px 16px;gap:10px 16px}
  .flow-page .fl-todo-h{font-size:18px}
}
@media (max-width:1280px){
  .flow-page .fl-todo{padding:12px 14px;gap:8px 14px}
  .flow-page .fl-todo-h{font-size:16px}
  .flow-page .fl-todo-hd{flex:1 1 100%}
  .flow-page .fl-todo-tiles{flex:1 1 100%}
  .flow-page .fl-todo-ex{white-space:normal}
  .flow-page .fl-todo-t{padding:6px 10px}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v15 结论带底色改为**全站统一的深色 KPI 带**
   用户指出：v14 我把结论带的差异态调成了「跟 --red 同族的深红」，但深红这个底色
   在主题里根本不存在 —— 全站深色带只有一种：.ov-hero-band 的
   `linear-gradient(125deg,#282828 0%,#434343 46%,#4d4d4d 100%)`
   （深海军蓝 → 亮蓝，配 rgba(56,189,248,.26) 的右上辉光）。
   结论带是**容器**，状态该由里面的徽标/标题表达，不该整块换底。
   所以：底色恒定 = 全站同款；「有差异」只染 ①差异徽标 ②异常标题。
   ════════════════════════════════════════════════════════════════════════════ */

.flow-page .fl-verdict,
.flow-page .fl-verdict.is-bad,
.flow-page .fl-verdict.is-load{
  position:relative;overflow:hidden;
  background:linear-gradient(125deg,var(--ui-brand-900) 0%,var(--ui-brand-900) 46%,var(--ui-brand-900) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13), 0 20px 44px -30px rgba(68,68,68, .9);
}
/* 右上角青色辉光：与 .ov-hero-band::after 同款 */
.flow-page .fl-verdict::after{
  content:"";position:absolute;right:-70px;top:-90px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(12,154,184,.26),transparent 62%);
  pointer-events:none;
}
.flow-page .fl-verdict > *{position:relative;z-index:1}

/* 状态只染这两处：差异徽标 + 异常标题。底色不动。 */
.flow-page .fl-verdict.is-bad .fl-vd-badge{
  background:rgba(220,38,38,.26);border-color:rgba(246,211,226,.55);color:var(--pl-pink-line);
}
.flow-page .fl-verdict.is-bad .fl-vd-t{color:var(--pl-pink-bg)}
/* 大数字的光晕跟着海军蓝走（原来 is-bad 下是红光） */
.flow-page .fl-verdict.is-bad .fl-vd-v b{text-shadow:0 0 34px rgba(12,154,184,.45)}
.flow-page .fl-verdict .fl-vd-go{color:var(--pl-cyan-line)}
.flow-page .fl-verdict .fl-vd-r{background:rgba(255,255,255,.05)}
.flow-page .fl-verdict .fl-vd-r:hover{background:rgba(255,255,255,.10)}
.flow-page .fl-verdict.is-bad .fl-vd-r:hover{background:rgba(255,255,255,.10)}

/* ════════════════════════════════════════════════════════════════════════════
   ★★ 2026-10-01 v16 回滚 v14 ① —— 语义色换回本项目真实色板（只作用于 .flow-page）
   v14 ① 把 v10–v13 里手挑的那批色值「就地」换成了 app.css :root 的 token，
   但那些 token 在本项目交付主题（theme.css + app.js）里基本不用 —— 结果本页
   成了全站唯一一套配色。v16 把 ① 逐色回滚；v14 ②「需要跟进的」块与 v15 结论带
   一律保留。v14 值 → 本项目真实值：
     #0D94B0 → #0C9AB8（青 / ok）      #e11d48 → #E04553（红 / danger）
     #be123c → #B4232F（红深）          #d97706 → #E8A33D（橙 / warn）
     #b45309 → #B8791A（橙深）          #5e5e5e → var(--sk-accent)（蓝 / accent）
     var(--sk-accent-deep) → var(--sk-ink) / #626262 / #535353（只在该处作深蓝**文字**色时）
     #fda4af → #FFC9D0（粉）            #10b981 → #34D399（绿）
   同色相 rgba() 一并回滚：rgba(13,148,176,*)→rgba(12,154,184,*)、
   rgba(225,29,72,*)→rgba(224,69,83,*)、rgba(190,18,60,*)→rgba(180,35,47,*)、
   rgba(217,119,6,*)→rgba(232,163,61,*)、rgba(17,115,212,*)→rgba(46,134,222,*)。
   **保留**（不回滚）：#5e5e5e / var(--sk-accent-deep) 的品牌用法（:root 品牌蓝、侧栏、v15 结论带
   的深海军蓝 #282828→#434343→#4d4d4d 与青色辉光、结论带上的红徽标）；v14 的非配色
   工作（发丝线 rgba(68,68,68, .10)/.16、卡面 #ffffff→#f9f9f9、灰字
   #5e5e5e / #777777 / #828282）；v15 全部；v14 ②「需要跟进的」块的结构与逻辑。
   注：上面 v14 层 banner 里列的 token 是那一轮的历史记录，不代表本层现状。
   回滚本层：用 .snapshots/theme-pre-v16.css 覆盖整个文件（含 v14/v15）；
   只回滚 v14 ①：用 .snapshots/theme-pre-v14.css。
   ════════════════════════════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v18：「交期预警」页 —— 图标卡片式改版（只作用于 .dg-due）
   接 v17（同一天稍早那一层）：v17 把三张图换成了 HTML 形态，v18 按用户要求
   「都设计成可视化图标的样式」，把每一块都做成「图标底座 + 数字 + 迷你图」的看板砖。

   本层覆盖/新增五组东西（v17 层的其余部分仍生效，本层写在最后、同名规则以后者为准）：

     ① 深色带 KPI 砖（.dg-kp）：数值左侧一枚 30px 彩色图标底座（未发货＝箱、逾期＝警示、
        风险窗＝沙漏、交付率＝仪表），.k-viz 从空槽改成读得出信息的迷你图 ——
        占比条（我方 / 合作单）、逾期占在产比、风险窗四格（0 也画成虚线空槽）、
        交付率条 + 旧口径白线刻度。
     ② 行动砖（.dg-gk）：图标底座 + 标签 + 条数/单数 + 迷你条 + 副标，四块砖的迷你条
        共用一个刻度（＝四块里最大的那条），这一排本身就是一张小条形图。
     ③ 工段排行（.dg-stn-ico）：每行一枚工序图标底座（合成＝烧瓶 / 氨解＝水滴 / 接酯＝链接 /
        纯化＝漏斗 / 分装＝箱 / MS＝文档 / HPLC＝折线 / 入库＝托盘 / 未投产＝待办），
        底色跟这一行的主导风险层走 —— 看图标颜色就知道这行是什么性质，不必回头对图例。
     ④ 卡片头图标按语义上色（标尺＝蓝、工段＝橙、明细＝石板灰、合作豁免＝中性灰）。
     ⑤ 对比度维持 v17 的标准（脚注/表头 ≥4.5:1），零态仍刻意低一档。

   全部用 HTML/CSS 实现，不引入 ECharts：零数据时不会出现空画布，也不会出现轴/标签裁切。
   作用域只有 .dg-due（本页），另外 6 个页签的 .dg-page 与 .dg-g / .ovz-strip 全部不受影响。
   回滚：删掉本层 + 用 .snapshots/app.js/20261001-103538-pre-dgv17.js 覆盖 app.js
   （v18 的结构也在 app.js 的 dg-* 段里，样式层单独回滚会留下无样式的砖）。
   ════════════════════════════════════════════════════════════════════════════ */

/* —— ① 深色带 KPI 砖：图标底座 + 迷你图 —— */
.dg-due .dg-kp .k-vl{align-items:center;gap:10px}
.dg-due .dg-kp .k-vl b{font-size:32px}
.dg-due .dg-kp .k-viz{height:42px;align-items:stretch}
.dg-due .dg-kp-ico{width:30px;height:30px;border-radius:10px;flex:none;display:inline-flex;align-items:center;
  justify-content:center;align-self:center;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.19);color:var(--ui-brand-100)}
.dg-due .dg-kp-ico svg{width:17px;height:17px}
.dg-due .dg-kp.tone-a .dg-kp-ico{background:rgba(220,38,38,.24);border-color:rgba(246,211,226,.42);color:var(--pl-pink-bg)}
.dg-due .dg-kp.tone-c .dg-kp-ico{background:rgba(217,119,6,.22);border-color:rgba(247,220,176,.42);color:var(--ui-warn-bg)}
.dg-due .dg-kp.tone-b .dg-kp-ico{background:rgba(134,134,134, .24);border-color:rgba(198,198,198, .42);color:var(--ui-brand-100)}
/* 迷你图共用件 */
.dg-due .dg-kv{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;width:100%;min-width:0}
.dg-due .dg-kv-t{display:flex;height:9px;border-radius:4px;overflow:hidden;background:rgba(255,255,255,.14)}
.dg-due .dg-kv-t i{display:block;height:100%}
.dg-due .dg-kv-n{font-size:11px;color:#c6c6c6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
/* 风险窗四格（液体柱）：0 也留格，写 0 */
.dg-due .dg-kv-strip{flex-direction:row;align-items:flex-end;gap:6px}
.dg-due .dg-kv-c{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;min-width:0}
.dg-due .dg-kv-c b{font-size:11px;font-weight:800;color:var(--ui-brand-050);font-variant-numeric:tabular-nums;line-height:1}
.dg-due .dg-kv-c.is-zero b{color:var(--ui-ink-300)}
.dg-due .dg-kv-t2{position:relative;width:100%;height:15px;border-radius:4px;border:1px dashed rgba(255,255,255,.24);
  display:flex;align-items:flex-end;overflow:hidden}
.dg-due .dg-kv-t2 i{display:block;width:100%;border-radius:4px;background:linear-gradient(180deg,var(--ui-warn-line),var(--ui-warn-solid))}
.dg-due .dg-kv-c.is-today .dg-kv-t2 i{background:linear-gradient(180deg,var(--ui-danger-solid),var(--ui-danger-solid))}
.dg-due .dg-kv-c em{font-style:normal;font-size:11px;color:var(--ui-ink-300);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-kv-c.is-today em{color:var(--ui-danger-line)}
.dg-due .dg-kv .k-bar{margin:0}

/* —— ② 行动砖：图标卡片（覆盖 v17 的 .is-compact 形态，本页不再用 is-compact） —— */
.dg-due .ovz-strip .dg-acts{gap:8px}
.dg-due .dg-gk{padding:8px 12px 10px;border-radius:12px;gap:6px;min-height:86px;justify-content:space-between;
  background:var(--ui-bg-soft);border:1px solid var(--ui-line-100)}
.dg-due .dg-gk:hover{transform:translateY(-1px)}
.dg-due .dg-gk-h{display:flex;align-items:center;gap:8px;min-width:0}
.dg-due .dg-gk-ico{width:24px;height:24px;border-radius:8px;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:var(--ui-line-100);color:var(--sk-ink-2);border:1px solid rgba(28,28,28, .06)}
.dg-due .dg-gk-ico svg{width:14px;height:14px}
.dg-due .dg-gk-t{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex:1;min-width:0}
.dg-due .dg-gk-h .dg-g-k{font-size:11px;font-weight:800;color:var(--sk-ink-2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-gk-h .dg-g-go{flex:none;font-size:11px;font-weight:800;color:var(--ui-brand-600)}
.dg-due .dg-gk-v{display:flex;align-items:baseline;gap:8px;min-width:0}
.dg-due .dg-gk-v .dg-g-v{flex:none;display:flex;align-items:baseline;gap:6px}
.dg-due .dg-gk-v .dg-g-v b{font-size:24px;font-weight:800;letter-spacing:-.6px;line-height:1.05;color:var(--ui-ink-900)}
.dg-due .dg-gk-v .dg-g-v i{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.dg-due .dg-gk-v .dg-g-v em{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400);margin-left:2px}
.dg-due .dg-gk-v .dg-g-s{flex:1 1 auto;min-width:0;text-align:right;font-size:11px;color:var(--sk-ink-3);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-gk-bar{display:block;width:100%;height:6px;border-radius:4px;background:rgba(28,28,28, .07);overflow:hidden}
.dg-due .dg-gk-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#c6c6c6,var(--sk-accent))}
.dg-due .dg-gk-bar.is-zero{border:1px dashed var(--ui-line-200);background:transparent}
.dg-due .dg-gk.tone-a{background:var(--ui-bg-soft);border-color:var(--pl-pink-bg)}
.dg-due .dg-gk.tone-a .dg-gk-ico{background:var(--ui-danger-bg);border-color:var(--ui-danger-line);color:var(--ui-danger-solid)}
.dg-due .dg-gk.tone-a .dg-gk-v .dg-g-v b,.dg-due .dg-gk.tone-a .dg-gk-h .dg-g-go{color:var(--ui-danger-solid)}
.dg-due .dg-gk.tone-a .dg-gk-bar i{background:linear-gradient(90deg,var(--ui-danger-solid),var(--ui-danger-solid))}
.dg-due .dg-gk.tone-c{background:var(--ui-bg-soft);border-color:var(--ui-warn-line)}
.dg-due .dg-gk.tone-c .dg-gk-ico{background:var(--ui-warn-bg);border-color:var(--ui-warn-line);color:var(--ui-warn-ink)}
.dg-due .dg-gk.tone-c .dg-gk-v .dg-g-v b,.dg-due .dg-gk.tone-c .dg-gk-h .dg-g-go{color:var(--ui-warn-ink)}
.dg-due .dg-gk.tone-c .dg-gk-bar i{background:linear-gradient(90deg,var(--ui-warn-line),var(--ui-warn-solid))}
.dg-due .dg-gk.tone-b{background:var(--ui-brand-050);border-color:var(--ui-brand-100)}
.dg-due .dg-gk.tone-b .dg-gk-ico{background:var(--ui-brand-050);border-color:var(--ui-brand-100);color:var(--ui-brand-700)}
.dg-due .dg-gk.tone-b .dg-gk-v .dg-g-v b,.dg-due .dg-gk.tone-b .dg-gk-h .dg-g-go{color:var(--sk-accent)}
.dg-due .dg-gk.is-zero{background:var(--sk-soft);border-color:var(--ui-line-100);cursor:default}
.dg-due .dg-gk.is-zero:hover{transform:none;box-shadow:none}
.dg-due .dg-gk.is-zero .dg-gk-ico{background:var(--ui-bg-soft);border-color:var(--ui-line-200);color:var(--ui-ink-300)}
.dg-due .dg-gk.is-zero .dg-gk-h .dg-g-k,.dg-due .dg-gk.is-zero .dg-gk-h .dg-g-go{color:var(--ui-ink-400)}
.dg-due .dg-gk.is-zero .dg-gk-v .dg-g-v b{color:var(--sk-ink-3)}
.dg-due .dg-gk.is-zero .dg-gk-v .dg-g-v i,.dg-due .dg-gk.is-zero .dg-gk-v .dg-g-v em{color:var(--ui-ink-400)}
.dg-due .dg-gk.is-zero .dg-gk-v .dg-g-s{color:var(--ui-ink-400)}
.dg-due .dg-gk:focus-visible,.dg-due .dg-rl:focus-visible,.dg-due .dg-stn-r:focus-visible,
.dg-due .diag-fbtn:focus-visible,.dg-due .dg-drill-hd button:focus-visible{
  outline:2px solid var(--sk-accent);outline-offset:2px;border-radius:10px}

/* —— ③ 一句话结论带 —— */
.dg-ins{display:flex;flex-wrap:wrap;align-items:baseline;margin-top:4px;padding-top:6px;
  border-top:1px solid var(--ui-bg-soft);font-size:11px;line-height:1.65;color:var(--sk-ink-2)}
.dg-ins span{display:inline-flex;align-items:baseline}
.dg-ins span+span::before{content:"·";margin:0 10px;color:var(--ui-line-200)}
.dg-ins b{color:var(--ui-ink-900);font-weight:800;font-variant-numeric:tabular-nums}

/* —— ④ 交期标尺 —— */
.dg-due .ov3-b{display:flex;flex-direction:column}
.dg-ruler{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:4px;
  flex:1;min-height:190px;font-variant-numeric:tabular-nums}
.dg-rl{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;
  appearance:none;-webkit-appearance:none;border:0;background:none;font:inherit;color:inherit;
  padding:6px 0 4px;border-radius:8px;cursor:pointer;min-width:0;overflow:hidden}
.dg-rl:hover{background:var(--ui-brand-050)}
.dg-rl.is-zero{cursor:default}
.dg-rl.is-zero:hover{background:transparent}
.dg-rl-v{font-size:11px;font-weight:800;color:var(--ui-ink-700);line-height:1;font-variant-numeric:tabular-nums}
.dg-rl.is-zero .dg-rl-v{color:var(--sk-ink-3);font-weight:700}
.dg-rl-t{position:relative;width:100%;flex:1;min-height:0;border-radius:6px;overflow:hidden;
  border:1px solid var(--ui-line-100);background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-bg-soft))}
.dg-rl.is-zero .dg-rl-t{border-style:dashed;border-color:var(--ui-line-200);background:transparent}
.dg-rl-t i{position:absolute;left:0;right:0;bottom:0;border-radius:4px;
  background:linear-gradient(180deg,var(--ui-brand-500),var(--sk-accent));box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.dg-rl.in-win .dg-rl-t i{background:linear-gradient(180deg,var(--ui-warn-line),var(--ui-warn-solid))}
.dg-rl.is-today .dg-rl-t{border-color:var(--ui-warn-line);background:linear-gradient(180deg,var(--ui-warn-bg),var(--ui-warn-bg))}
.dg-rl.is-today .dg-rl-t i{background:linear-gradient(180deg,var(--ui-danger-solid),var(--ui-danger-solid))}
.dg-rl-d{font-size:11px;font-weight:700;color:var(--sk-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-rl-w{font-size:11px;color:var(--ui-ink-400);white-space:nowrap}
.dg-rl.is-today .dg-rl-d{color:var(--ui-danger-solid)}
.dg-rl.in-win:not(.is-today) .dg-rl-d{color:var(--ui-warn-ink)}

/* —— ⑤ 工段排行：图标底座 + 堆叠条 —— */
.dg-stn{display:flex;flex-direction:column;gap:2px;flex:1;justify-content:space-between}
.dg-stn-r{display:grid;grid-template-columns:24px 56px minmax(0,1fr) 92px;align-items:center;gap:10px;
  width:100%;appearance:none;-webkit-appearance:none;border:0;background:none;font:inherit;color:inherit;
  text-align:left;padding:6px 8px;border-radius:8px;cursor:pointer;min-width:0}
.dg-stn-r:hover{background:var(--ui-brand-050)}
.dg-stn-r.is-zero{cursor:default;padding:4px 8px}
.dg-stn-r.is-zero:hover{background:transparent}
.dg-stn-ico{width:22px;height:22px;border-radius:6px;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:var(--ui-bg-soft);color:var(--sk-ink-3)}
.dg-stn-ico svg{width:13px;height:13px}
.dg-si-0{background:var(--ui-brand-050);color:var(--sk-accent)}
.dg-si-1{background:var(--ui-warn-bg);color:var(--ui-warn-ink)}
.dg-si-2{background:var(--ui-danger-bg);color:var(--ui-danger-solid)}
.dg-si-3{background:var(--ui-line-100);color:var(--sk-ink-3)}
.dg-si-4{background:var(--ui-bg-soft);color:var(--ui-ink-400)}
.dg-stn-r.is-zero .dg-stn-ico{background:var(--ui-bg-page);color:var(--ui-ink-300)}
.dg-stn-k{font-size:12px;font-weight:700;color:var(--sk-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-stn-r.is-zero .dg-stn-k{color:var(--ui-ink-400);font-weight:600}
.dg-stn-b{display:flex;height:12px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:0}
.dg-stn-r.is-zero .dg-stn-b{height:9px;border:1px dashed var(--ui-line-200);background:transparent}
.dg-stn-b i{display:block;height:100%;flex:none;min-width:6px}
.dg-stn-v{text-align:right;font-size:11px;color:var(--sk-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-stn-v b{font-size:12px;font-weight:800;color:var(--ui-ink-700);margin-right:2px}
.dg-stn-v em{font-style:normal;margin-left:6px;color:var(--ui-ink-400)}
.dg-stn-r.is-zero .dg-stn-v b,.dg-stn-r.is-zero .dg-stn-v em{color:var(--ui-ink-400)}
.dg-stn-lg{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:10px;padding-top:8px;
  border-top:1px solid var(--ui-bg-soft);font-size:11px;color:var(--sk-ink-3)}
.dg-stn-lg span{display:inline-flex;align-items:center;gap:6px}
.dg-stn-lg i{width:9px;height:9px;border-radius:4px;flex:none}

/* —— ⑥ 卡片头图标按语义上色 —— */
.dg-due .dg-c-ruler .ov3-ico{background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border-color:var(--ui-brand-100);color:var(--ui-brand-700)}
.dg-due .dg-c-stn .ov3-ico{background:linear-gradient(160deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:var(--ui-warn-line);color:var(--ui-warn-ink)}
.dg-due .dg-c-list .ov3-ico{background:linear-gradient(160deg,var(--ui-bg-page),var(--ui-line-100));border-color:var(--ui-line-200);color:var(--ui-ink-500)}
.dg-due .dg-c-coop .ov3-ico{background:linear-gradient(160deg,var(--sk-soft),var(--ui-line-100));border-color:var(--ui-line-200);color:var(--sk-ink-3)}

/* —— ⑦ 对比度与密度（本页） —— */
.dg-due .ov3-card .ov3-foot{height:35px;font-size:11px;line-height:1.5;color:var(--sk-ink-2);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dg-due .ov3-card .ov3-foot b{color:var(--ui-ink-700)}
.dg-due .ov3-card .bp-table th{font-size:11px;color:var(--ui-ink-500);letter-spacing:.03em}
.dg-due .ov3-card .bp-table td{color:var(--ui-ink-700)}
.dg-due .dg-sub{color:var(--sk-ink-2)}
.dg-due .ov3-empty{color:var(--ui-ink-500)}
.dg-due .ovz-footbar{font-size:11px;line-height:1.7;color:var(--sk-ink-2);background:var(--ui-bg-card)}
.dg-due .ovz-footbar b{color:var(--ui-ink-700)}
.dg-due #dgChips{margin:0 0 8px}
.dg-due .dg-row:focus-visible{outline:2px solid var(--sk-accent);outline-offset:-2px}
.dg-due .dg-tool-note{color:var(--ui-ink-500)}
.dg-due .ov3-h .ov3-en{color:var(--ui-ink-300)}
.dg-due .ov-kpi-d .k-lb{white-space:normal;line-height:1.35}
.dg-due .ov-kpi-d .k-sb{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dg-due .ov-kpi-d .k-cap{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* —— ⑨ ★ v19：底部「交期明细 / 合作豁免 / 口径说明」区域重做 ——
   用户指出这一区在宽屏上像电子表格：客户名到条数之间有 1500px 空白、两张几乎一样的表竖着摞、
   最后是一整段灰色长句。三件事：
     ① 明细从 <table> 改成**行列表**：网格定宽 + 「条数条」吸收多余宽度（宽屏长在条上，不长在空白上），
        并按紧急度分组（组头带本组单数/条数/占比条/口径小注）；
     ② 合作单豁免从 6 列表格改成**紧凑清单**（这一区只是「仅提示」），与明细并排成 8+4；
     ③ 口径总说明从一整段长句改成**定义列表**，右列最后一张卡撑满整行高度，宽屏不留空地。 */
.dg-col4{grid-column:span 4;display:flex;flex-direction:column;gap:12px;min-width:0}
.dg-col4 > .ov3-card:last-child{flex:1}
/* 表头行（列名）与列宽：订单号 118 | 客户 140~260 | 条数条 余量 | 条数 86 | 交期 104 | 状态 92 */
.dg-due .dg-lh,.dg-due .dg-lr{display:grid;grid-template-columns:118px minmax(140px,260px) minmax(60px,1fr) 86px 104px 92px;
  align-items:center;gap:10px}
.dg-due .dg-lh{padding:0 10px 8px;border-bottom:1px solid var(--ui-line-100);font-size:11px;font-weight:700;color:var(--ui-ink-500);letter-spacing:.03em}
.dg-due .dg-list{display:flex;flex-direction:column}
.dg-due .dg-lr{width:100%;appearance:none;-webkit-appearance:none;border:0;background:none;font:inherit;color:inherit;
  text-align:left;padding:8px 10px;border-bottom:1px solid var(--ui-bg-page);cursor:pointer;min-width:0;border-radius:8px}
.dg-due .dg-lr:hover{background:var(--ui-brand-050)}
.dg-due .dg-lr:last-child{border-bottom:0}
.dg-due .dg-lr:focus-visible{outline:2px solid var(--sk-accent);outline-offset:-2px}
.dg-due .dg-lr-id{font-size:12px;font-weight:700;color:var(--sk-ink);font-variant-numeric:tabular-nums;letter-spacing:.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-lr-cust{font-size:12px;color:var(--ui-ink-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-lr-bar{display:block;height:10px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:0}
.dg-due .dg-lr-bar i{display:block;height:100%;border-radius:4px;min-width:5px;background:linear-gradient(90deg,#c6c6c6,var(--sk-accent))}
.dg-due .dg-lr.is-late .dg-lr-bar i{background:linear-gradient(90deg,var(--ui-danger-line),var(--pl-pink))}
.dg-due .dg-lr.is-today .dg-lr-bar i{background:linear-gradient(90deg,var(--ui-warn-line),var(--ui-danger-solid))}
.dg-due .dg-lr.is-near .dg-lr-bar i{background:linear-gradient(90deg,var(--ui-warn-line),var(--ui-warn-solid))}
.dg-due .dg-lr.is-coop .dg-lr-bar i{background:linear-gradient(90deg,var(--ui-line-200),var(--ui-ink-300))}
.dg-due .dg-lr-p{text-align:right;font-size:11px;color:var(--sk-ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.dg-due .dg-lr-p b{font-size:12px;font-weight:800;color:var(--ui-ink-700);margin-right:2px}
.dg-due .dg-lr-p em{font-style:normal;display:block;font-size:11px;color:var(--ui-ink-500);font-weight:600}
.dg-due .dg-lr-due{font-size:11px;color:var(--ui-ink-700);font-variant-numeric:tabular-nums;white-space:nowrap}
.dg-due .dg-lr-st{justify-self:end}
/* 分组头：左侧主题色竖条 + 组名 + 本组单数/条数 + 占最大组的比例条 + 口径小注 */
.dg-due .dg-gh{position:relative;display:flex;align-items:center;gap:10px;padding:10px 10px 8px 12px;margin-top:2px;min-width:0}
.dg-due .dg-gh::before{content:"";position:absolute;left:0;top:7px;bottom:5px;width:3px;border-radius:4px;background:var(--gc,var(--ui-ink-300))}
.dg-due .dg-gh-t{font-size:12px;font-weight:800;color:var(--ui-ink-700);white-space:nowrap}
.dg-due .dg-gh-n{font-size:11px;color:var(--sk-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-gh-n b{color:var(--ui-ink-700);font-weight:800;font-size:12px}
.dg-due .dg-gh-bar{flex:0 1 160px;height:6px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:40px}
.dg-due .dg-gh-bar i{display:block;height:100%;border-radius:4px;background:var(--gc,var(--ui-ink-300))}
.dg-due .dg-gh-s{margin-left:auto;font-size:11px;color:var(--ui-ink-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-lr:first-child,.dg-due .dg-gh:first-of-type{margin-top:0}
/* 合作单豁免：紧凑清单（不是表格）+ 判据脚注 */
.dg-due .dg-cl{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column}
.dg-due .dg-cl-i{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;
  padding:8px 8px;border-bottom:1px solid var(--ui-bg-page);border-radius:8px;cursor:pointer}
.dg-due .dg-cl-i:hover{background:var(--ui-brand-050)}
.dg-due .dg-cl-i:last-child{border-bottom:0}
.dg-due .dg-cl-i:focus-visible{outline:2px solid var(--sk-accent);outline-offset:-2px}
.dg-due .dg-cl-id{font-size:12px;font-weight:700;color:var(--sk-ink);font-variant-numeric:tabular-nums}
.dg-due .dg-cl-cust{grid-column:1;font-size:11px;color:var(--sk-ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-cl-p{grid-column:2;grid-row:1;justify-self:end;font-size:11px;color:var(--sk-ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.dg-due .dg-cl-tag{grid-column:2;grid-row:2;justify-self:end}
.dg-due .dg-cl-note{margin-top:10px;padding-top:10px;border-top:1px solid var(--ui-bg-soft);font-size:11px;line-height:1.6;color:var(--ui-ink-500)}
/* 口径总说明：定义列表 + 风险分层图例 */
.dg-due .dg-cal{display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px 10px;margin:0;font-size:11px;line-height:1.55}
.dg-due .dg-cal dt{font-weight:800;color:var(--sk-ink-2);white-space:nowrap}
.dg-due .dg-cal dd{margin:0;color:var(--ui-ink-700)}
.dg-due .dg-cal dd b{font-variant-numeric:tabular-nums}
.dg-due .dg-lgd{margin-top:12px;padding-top:12px;border-top:1px solid var(--ui-bg-soft);display:flex;flex-direction:column;gap:2px}
.dg-due .dg-lgd-h{font-size:11px;font-weight:800;color:var(--sk-ink-2);margin-bottom:4px}
.dg-due .dg-lgd-h b{color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.dg-due .dg-lgd-r{display:grid;grid-template-columns:9px minmax(0,1fr) 46px 34px;align-items:center;gap:8px;
  padding:4px 0;font-size:11px;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.dg-due .dg-lgd-r .c{width:9px;height:9px;border-radius:4px;display:block}
.dg-due .dg-lgd-r .k{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ui-ink-700)}
.dg-due .dg-lgd-r .p{text-align:right;font-weight:800;color:var(--ui-ink-700)}
.dg-due .dg-lgd-r .n{text-align:right;color:var(--ui-ink-400)}
.dg-due .dg-lgd-r .b{grid-column:2/-1;height:5px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;margin-top:-2px}
.dg-due .dg-lgd-r .b i{display:block;height:100%;border-radius:4px}
.dg-due .dg-lgd-r.is-zero .k,.dg-due .dg-lgd-r.is-zero .p,.dg-due .dg-lgd-r.is-zero .n{color:var(--ui-ink-400);font-weight:600}
.dg-due .dg-lgd-r.is-zero .b{border:1px dashed var(--ui-line-200);background:transparent}

/* —— ⑧ 窄屏兜底：标尺 14 格在 1100~1240px 会挤到「10/14」放不下；
      底部 8+4 并排要 ≥1500px 才放得下明细的六列，否则整行铺开 ——
      （★ v20/v21：三个页签「交期预警」diagnosis /「交期分布」trend /「交付周期达成」deliverycycle 共用这套断点） */
@media (max-width:1440px){
  .ov3-grid[data-tab="diagnosis"] .dg-c-list,
  .ov3-grid[data-tab="diagnosis"] .dg-col4,
  .ov3-grid[data-tab="trend"] .dg-c-list,
  .ov3-grid[data-tab="trend"] .dg-col4,
  .ov3-grid[data-tab="deliverycycle"] .dg-c-list,
  .ov3-grid[data-tab="gauge"] .dg-c-gwk,
  .ov3-grid[data-tab="gauge"] .dg-c-brk,
  .ov3-grid[data-tab="gauge"] .dg-col4,
  .ov3-grid[data-tab="category"] .dg-col4,
  .ov3-grid[data-tab="deliverycycle"] .dg-col4{grid-column:span 12!important}
  /* 本页四张「图卡」在 ≤1500px 两两并排（6+6）：否则主题层那条 .ov3-g8{span 12} 会让
     「周达成率 / 周节奏」各占一整行、而「分档 / 月度」只剩半行，页面出现两行半空。 */
  .ov3-grid[data-tab="deliverycycle"] .dg-c-rate,
  .ov3-grid[data-tab="deliverycycle"] .dg-c-cyb,
  .ov3-grid[data-tab="deliverycycle"] .dg-c-wkr,
  .ov3-grid[data-tab="deliverycycle"] .dg-c-month{grid-column:span 6!important}
  .dg-col4{flex-direction:row;align-items:flex-start}
  .dg-col4 > .ov3-card,.dg-col4 > .ov3-card:last-child{flex:1 1 0;min-width:0}
}
@media (max-width:1280px){
  .ov3-grid[data-tab="diagnosis"] .dg-c-ruler,
  .ov3-grid[data-tab="diagnosis"] .dg-c-stn,
  .ov3-grid[data-tab="trend"] .dg-c-ruler,
  .ov3-grid[data-tab="trend"] .dg-c-stn{grid-column:span 12!important}
  .dg-ruler{min-height:170px}
  .dg-ruler23{min-height:150px}
}
@media (max-width:1280px){
  .ov3-grid[data-tab="diagnosis"] .dg-c-ruler,
  .ov3-grid[data-tab="diagnosis"] .dg-c-stn{grid-column:span 12!important}
  .dg-ruler{min-height:170px}
}
@media (max-width:1280px){
  .dg-due .dg-lh,.dg-due .dg-lr{grid-template-columns:104px minmax(0,1fr) 60px 74px}
  .dg-due .dg-lh-bar,.dg-due .dg-lh-due,.dg-due .dg-lr-bar,.dg-due .dg-lr-due{display:none}
  .dg-col4{flex-direction:column}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v20：「交期分布」（dashboardTab=trend）重做 —— 只补 4 个新结构
   本页整页套用 .dg-due（与「交期预警」同一套件：KPI 图标砖 / 标尺 / 行列表 / 口径卡），
   这里只加它自己的四种东西：
     ① 到期日标尺（23 格：已过交期 + 今天 + 未来 20 天逐日 + 20 天以后）
     ② 周排行（一行一个自然周）
     ③ 客户排行（一行一个客户，堆叠层＝交期紧急度；名字横排，超长省略号 + title）
     ④ 客户卡的图标底色
   回滚：删掉本段即可（结构在 app.js 的 td* 段）。
   ════════════════════════════════════════════════════════════════════════════ */
/* ① 到期日标尺 */
.dg-due .dg-ruler23{grid-template-columns:repeat(23,minmax(0,1fr));gap:2px;min-height:180px}
.dg-due .dg-rl-td{gap:4px;padding:6px 0 4px}
.dg-due .dg-rl-td .dg-rl-d{font-size:11px}
.dg-due .dg-rl.is-late .dg-rl-t{border-color:var(--ui-danger-line);background:linear-gradient(180deg,var(--ui-danger-bg),var(--ui-danger-bg))}
.dg-due .dg-rl.is-late .dg-rl-t i{background:linear-gradient(180deg,var(--ui-danger-solid),var(--ui-danger-solid))}
.dg-due .dg-rl.is-late .dg-rl-d{color:var(--ui-danger-solid)}
.dg-due .dg-rl.is-tail .dg-rl-d{color:var(--ui-ink-400)}
.dg-due .dg-rl.is-tail .dg-rl-v{color:var(--ui-ink-400)}
/* ② 周排行 */
.dg-due .dg-wk{display:flex;flex-direction:column;gap:2px;flex:1;justify-content:space-between}
.dg-due .dg-wk-r{display:grid;grid-template-columns:98px minmax(0,1fr) 88px 42px;align-items:center;gap:10px;
  padding:6px 8px;border-radius:8px;min-width:0}
.dg-due .dg-wk-k{font-size:11px;font-weight:700;color:var(--sk-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-wk-b{height:12px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:0}
.dg-due .dg-wk-b i{display:block;height:100%;border-radius:4px;min-width:5px}
.dg-due .dg-wk-v{text-align:right;font-size:11px;color:var(--sk-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-wk-v b{font-size:12px;font-weight:800;color:var(--ui-ink-700);margin-right:2px}
.dg-due .dg-wk-v em{font-style:normal;margin-left:6px;color:var(--ui-ink-400)}
.dg-due .dg-wk-t{text-align:right;font-size:11px;color:var(--ui-ink-400);font-variant-numeric:tabular-nums}
.dg-due .dg-wk-r.is-zero .dg-wk-k,.dg-due .dg-wk-r.is-zero .dg-wk-v b,
.dg-due .dg-wk-r.is-zero .dg-wk-v em,.dg-due .dg-wk-r.is-zero .dg-wk-t{color:var(--ui-ink-400);font-weight:600}
.dg-due .dg-wk-r.is-zero .dg-wk-b{height:9px;border:1px dashed var(--ui-line-200);background:transparent}
/* 0 的那一行不能再吃「最小可见宽度」—— 否则 0 条也会冒出一个 5px 的小色块，读成「有一点」 */
.dg-due .dg-wk-r.is-zero .dg-wk-b i{min-width:0}
/* ③ 客户排行（复用 .dg-stn 的行骨架，把图标列换成客户名列） */
.dg-due .dg-cst-r{grid-template-columns:minmax(120px,210px) minmax(0,1fr) 96px;cursor:default}
.dg-due .dg-cst-r:hover{background:transparent}
.dg-due .dg-cst-k{font-size:12px;font-weight:600;color:var(--ui-ink-700)}
.dg-due .dg-cst-more{margin-top:8px;font-size:11px;color:var(--ui-ink-500)}
/* ④ 客户卡图标底色 */
.dg-due .dg-c-cust .ov3-ico{background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border-color:var(--ui-brand-100);color:var(--ui-brand-700)}

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v21：「交付周期达成」（dashboardTab=deliverycycle）重做 —— 补 4 个新结构
   本页同样整页套用 .dg-due（KPI 图标砖 / 行列表 / 口径卡 / 分层图例全部复用），另加：
     ① 周达成率条（bullet：条长＝达成率，竖虚线＝目标 95%，无到期订单的周留行）
     ② 交付周期分档排行（一行一档）
     ③ 周订单节奏排行（一行一周，堆叠＝新单 / 发货 / 逾期 / 合作豁免）
     ④ 「已发货 · 按时」的绿色标签 + 四张卡的图标底色
   回滚：删掉本段即可（结构在 app.js 的 cy* 段）。
   ════════════════════════════════════════════════════════════════════════════ */
.dg-due .bp-tag.tone-ok{background:var(--ui-ok-bg);color:var(--ui-ok-solid)}
/* ★ 本页的明细覆盖全部 112 单（含已发货），必须限高内滚 —— 否则页面会被拉成 6000px。
   限高不隐藏信息：卡头写着总数，行数在组头，滚动即达。 */
.dg-due #cyList{max-height:540px;overflow:auto;overflow-x:hidden}
.dg-due #cyList::-webkit-scrollbar{width:8px}
.dg-due #cyList::-webkit-scrollbar-thumb{background:rgba(28,28,28, .14);border-radius:8px}
/* ① 周达成率条 */
.dg-due .dg-rate{display:flex;flex-direction:column;gap:2px;flex:1;justify-content:space-between}
.dg-due .dg-rate-r{display:grid;grid-template-columns:110px minmax(0,1fr) 74px 172px;align-items:center;gap:10px;
  padding:6px 8px;border-radius:8px;min-width:0}
.dg-due .dg-rate-r.is-cur{background:var(--ui-brand-050)}
.dg-due .dg-rate-k{font-size:11px;font-weight:700;color:var(--sk-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-rate-b{position:relative;height:16px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:0}
.dg-due .dg-rate-b i{display:block;height:100%;border-radius:4px;min-width:3px}
.dg-due .dg-rate-b::after{content:"";position:absolute;top:0;bottom:0;left:95%;width:0;
  border-left:1px dashed var(--ui-ok-solid);opacity:.9}
.dg-due .dg-rate-v{text-align:right;font-size:12px;font-weight:800;color:var(--ui-ink-700);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.dg-due .dg-rate-v .is-na{font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.dg-due .dg-rate-n{font-size:11px;color:var(--sk-ink-3);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-rate-r.is-zero .dg-rate-k{color:var(--ui-ink-400);font-weight:600}
.dg-due .dg-rate-r.is-zero .dg-rate-b{border:1px dashed var(--ui-line-200);background:transparent}
.dg-due .dg-rate-r.is-zero .dg-rate-b::after{display:none}
/* ② 交付周期分档排行 */
.dg-due .dg-cyb{display:flex;flex-direction:column;gap:2px;flex:1;justify-content:space-between}
.dg-due .dg-cyb-r{display:grid;grid-template-columns:62px minmax(0,1fr) 96px;align-items:center;gap:10px;
  padding:6px 8px;border-radius:8px;min-width:0}
.dg-due .dg-cyb-k{font-size:11px;font-weight:700;color:var(--sk-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-cyb-b{height:14px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:0}
.dg-due .dg-cyb-b i{display:block;height:100%;border-radius:4px;min-width:5px}
.dg-due .dg-cyb-v{text-align:right;font-size:11px;color:var(--sk-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-cyb-v b{font-size:12px;font-weight:800;color:var(--ui-ink-700);margin-right:2px}
.dg-due .dg-cyb-v em{font-style:normal;margin-left:6px;color:var(--ui-ink-400)}
.dg-due .dg-cyb-r.is-zero .dg-cyb-k,.dg-due .dg-cyb-r.is-zero .dg-cyb-v b{color:var(--ui-ink-400);font-weight:600}
.dg-due .dg-cyb-r.is-zero .dg-cyb-b{height:10px;border:1px dashed var(--ui-line-200);background:transparent}
.dg-due .dg-cyb-f{margin-top:10px;padding-top:8px;border-top:1px solid var(--ui-bg-soft);font-size:11px;color:var(--ui-ink-500);font-variant-numeric:tabular-nums}
.dg-due .dg-cyb-f b{color:var(--ui-ink-700);font-weight:800}
/* ③ 周订单节奏排行 */
.dg-due .dg-wkr{display:flex;flex-direction:column;gap:2px;flex:1;justify-content:space-between}
.dg-due .dg-wkr-r{display:grid;grid-template-columns:118px minmax(0,1fr) 214px;align-items:center;gap:10px;
  padding:6px 8px;border-radius:8px;min-width:0}
.dg-due .dg-wkr-r.is-cur{background:var(--ui-brand-050)}
.dg-due .dg-wkr-k{font-size:11px;font-weight:700;color:var(--sk-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-wkr-b{display:flex;height:14px;border-radius:4px;background:rgba(28,28,28, .055);overflow:hidden;min-width:0}
.dg-due .dg-wkr-b i{display:block;height:100%;flex:none;min-width:4px}
.dg-due .dg-wkr-n{display:flex;gap:10px;justify-content:flex-end;font-size:11px;color:var(--ui-ink-700);
  white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-wkr-n span{display:inline-flex;align-items:baseline;gap:4px}
.dg-due .dg-wkr-n b{font-weight:800;color:var(--ui-ink-700)}
.dg-due .dg-wkr-n span.dim,.dg-due .dg-wkr-n span.dim b{color:var(--ui-ink-300);font-weight:600}
.dg-due .dg-wkr-r.is-zero .dg-wkr-k{color:var(--ui-ink-400);font-weight:600}
.dg-due .dg-wkr-r.is-zero .dg-wkr-b{border:1px dashed var(--ui-line-200);background:transparent}
.dg-due .dg-wkr-lg{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:10px;padding-top:8px;
  border-top:1px solid var(--ui-bg-soft);font-size:11px;color:var(--sk-ink-3)}
.dg-due .dg-wkr-lg span{display:inline-flex;align-items:center;gap:6px}
.dg-due .dg-wkr-lg i{width:9px;height:9px;border-radius:4px;flex:none}
/* ④ 卡片图标底色 */
.dg-due .dg-c-rate .ov3-ico{background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border-color:var(--ui-brand-100);color:var(--ui-brand-700)}
.dg-due .dg-c-cyb .ov3-ico{background:linear-gradient(160deg,var(--ui-bg-soft),var(--ui-ok-bg));border-color:var(--ui-ok-line);color:var(--ui-ok-solid)}
.dg-due .dg-c-wkr .ov3-ico{background:linear-gradient(160deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:var(--ui-warn-line);color:var(--ui-warn-ink)}
.dg-due .dg-c-month .ov3-ico{background:linear-gradient(160deg,var(--sk-soft),var(--ui-line-100));border-color:var(--ui-line-200);color:var(--sk-ink-3)}

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v22：图表质感升级（用户 2026-10-01 对「交付周期达成」三张图：
   「这种可视化图表我不满意，不够高大上」）—— 本层**不改任何结构**，只换皮。
   六个动作，全部用 CSS 画（不引图表库，零数据也不会出现空画布）：
     ① 仪表化分区轨道：周达成率的条底按目标阈值分三段极淡色区（<80% 红区 / 80~95% 橙区 / ≥95% 绿区），
        横轴刻度 80% / 目标 95% 直接标在轨道上方 —— 分区既是装饰，也是口径本身；
     ② 渐变条 + 顶部高光 + 同色投影：条身一律「横向渐变 + 上半段 46% 白色高光 + 同色柔和投影」；
     ③ 目标旗标：目标位一枚实心竖线 + 菱形小旗 + 白描边，压住条身但不遮数字；
     ④ 数值徽标 + 环比 delta：百分比做成彩色玻璃徽标（绿/橙/红跟档位），右侧给「较近 6 周均值 ±N pt」；
     ⑤ 标尺柱 / 排行条 / 周节奏条统一换肤：轨道内阴影、柱顶高光、柱底同色投影、堆叠段 1px 白缝 + 首尾圆角；
     ⑥ KPI 迷你图同一套皮肤（轨道内阴影 + 柱顶高光）。
   配色仍是原来那几族（绿=达标、橙=风险窗/偏慢、红=不按时、蓝=在产、灰=豁免/零），没有新增色相。
   回滚：删掉本段即可（结构在 app.js 的 cy*/dg* 段）。
   ════════════════════════════════════════════════════════════════════════════ */

/* —— ① 周达成率：仪表化分区条 —— */
.dg-due .dg-rate{gap:4px}
.dg-due .dg-rate-tl{display:grid;grid-template-columns:110px minmax(0,1fr) 96px 172px;gap:10px;
  padding:0 8px;height:17px;align-items:end}
.dg-due .dg-rate-tlz{position:relative;display:block;height:100%}
.dg-due .dg-rate-tlz b{position:absolute;bottom:2px;transform:translateX(-50%);font-size:11px;font-weight:800;
  color:var(--ui-ink-300);white-space:nowrap;letter-spacing:.02em}
.dg-due .dg-rate-tlz b.is-t{color:var(--ui-ok-solid)}
.dg-due .dg-rate-r{grid-template-columns:110px minmax(0,1fr) 96px 172px;padding:6px 8px;border-radius:10px}
.dg-due .dg-rate-r.is-cur{background:linear-gradient(90deg,var(--ui-brand-050),var(--ui-bg-card));box-shadow:inset 0 0 0 1px rgba(134,134,134, .10)}
.dg-due .dg-rate-b{height:20px;border-radius:10px;overflow:hidden;
  background:linear-gradient(180deg,var(--ui-line-100),var(--ui-line-200));
  box-shadow:inset 0 1px 3px rgba(28,28,28, .10), inset 0 -1px 0 rgba(255,255,255,.65)}
.dg-due .dg-rate-b::before{content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(90deg,
    rgba(220,38,38,.10) 0 80%,
    rgba(217,119,6,.13) 80% 95%,
    rgba(10,112,67,.14) 95% 100%)}
.dg-due .dg-rate-b::after{display:none}
.dg-due .dg-rate-b i{position:relative;z-index:1;border-radius:10px;min-width:4px;
  box-shadow:0 3px 9px -2px rgba(28,28,28, .30), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-rate-b i::after{content:"";position:absolute;left:1px;right:1px;top:1px;height:46%;
  border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}
.dg-due .dg-rate-b .dg-rate-tm{position:absolute;z-index:2;top:-3px;bottom:-3px;width:2px;border-radius:4px;
  background:var(--ui-ok-solid);box-shadow:0 0 0 2px rgba(255,255,255,.92), 0 2px 6px rgba(10,112,67,.45)}
.dg-due .dg-rate-b .dg-rate-tm::after{content:"";position:absolute;top:-6px;left:-4px;width:0;height:0;
  border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--ui-ok-solid)}
.dg-due .dg-rate-v{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.dg-due .dg-rate-v b{min-width:52px;height:23px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:8px;font-size:12px;font-weight:900;letter-spacing:-.2px;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,var(--ui-bg-page),var(--ui-ok-bg));border:1px solid rgba(10,112,67,.24);color:var(--ui-ok-solid);
  box-shadow:inset 0 1px 0 #fff, 0 1px 2px rgba(28,28,28, .05)}
.dg-due .dg-rate-r.is-warn .dg-rate-v b{background:linear-gradient(180deg,var(--ui-warn-bg),var(--ui-warn-bg));
  border-color:rgba(217,119,6,.30);color:var(--ui-warn-ink)}
.dg-due .dg-rate-r.is-bad .dg-rate-v b{background:linear-gradient(180deg,var(--ui-danger-bg),var(--ui-danger-bg));
  border-color:rgba(220,38,38,.28);color:var(--ui-danger-solid)}
.dg-due .dg-rate-v b.is-na{min-width:auto;padding:0 10px;background:var(--sk-soft);border-color:var(--ui-line-200);color:var(--ui-ink-400);
  font-size:11px;font-weight:800}
.dg-due .dg-rate-v em{font-style:normal;font-size:11px;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-rate-v em.up{color:var(--ui-ok-solid)}
.dg-due .dg-rate-v em.down{color:var(--ui-danger-solid)}
.dg-due .dg-rate-r.is-zero .dg-rate-b{background:transparent;box-shadow:inset 0 0 0 1px var(--ui-line-200)}
.dg-due .dg-rate-r.is-zero .dg-rate-b::before{display:none}
.dg-due .dg-rate-r.is-zero .dg-rate-b .dg-rate-tm{display:none}

/* —— ② 交付周期分档：换肤 + 均值档小旗 + 占比 —— */
.dg-due .dg-cyb-r{grid-template-columns:72px minmax(0,1fr) 122px;padding:6px 8px}
.dg-due .dg-cyb-k{display:flex;align-items:center;gap:6px}
.dg-due .dg-cyb-avg{font-style:normal;font-size:11px;font-weight:800;line-height:15px;padding:0 4px;border-radius:4px;
  color:var(--ui-ok-solid);background:var(--ui-ok-bg);border:1px solid rgba(10,112,67,.24);white-space:nowrap}
.dg-due .dg-cyb-b{height:18px;border-radius:8px;background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-line-100));
  box-shadow:inset 0 1px 3px rgba(28,28,28, .09)}
.dg-due .dg-cyb-b i{position:relative;border-radius:8px;
  box-shadow:0 3px 9px -2px rgba(28,28,28, .30), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-cyb-b i::after{content:"";position:absolute;left:1px;right:1px;top:1px;height:46%;border-radius:8px 8px 4px 4px;
  background:linear-gradient(180deg,rgba(255,255,255,.48),rgba(255,255,255,0))}
.dg-due .dg-cyb-v{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;flex-wrap:wrap}
.dg-due .dg-cyb-v b{font-size:12px;font-weight:900;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.dg-due .dg-cyb-v em{font-style:normal;font-size:11px;color:var(--ui-ink-400);font-variant-numeric:tabular-nums}
.dg-due .dg-cyb-v u{text-decoration:none;font-size:11px;font-weight:800;color:var(--sk-ink-2);font-variant-numeric:tabular-nums;
  background:var(--ui-bg-page);border-radius:4px;padding:0 6px;line-height:15px}
.dg-due .dg-cyb-r.is-zero .dg-cyb-b{background:transparent;box-shadow:none;border:1px dashed var(--ui-line-200)}

/* —— ③ 周订单节奏：段间白缝 + 首尾圆角 + 合计徽标 —— */
.dg-due .dg-wkr-r{grid-template-columns:118px minmax(0,1fr) 214px 46px;padding:6px 8px}
.dg-due .dg-wkr-k em{font-style:normal;font-size:11px;font-weight:800;color:var(--sk-accent);background:var(--ui-brand-100);
  border-radius:4px;padding:0 4px;margin-left:6px;line-height:15px}
.dg-due .dg-wkr-b{height:18px;border-radius:8px;background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-line-100));
  box-shadow:inset 0 1px 3px rgba(28,28,28, .09)}
.dg-due .dg-wkr-b i{position:relative;box-shadow:inset 1px 0 0 rgba(255,255,255,.85), inset 0 1px 0 rgba(255,255,255,.3)}
.dg-due .dg-wkr-b i:first-child{border-radius:8px 0 0 8px}
.dg-due .dg-wkr-b i:last-child{border-radius:0 8px 8px 0}
.dg-due .dg-wkr-b i:only-child{border-radius:8px}
.dg-due .dg-wkr-n span i{width:7px;height:7px;border-radius:4px;display:inline-block;flex:none}
.dg-due .dg-wkr-t{text-align:right}
.dg-due .dg-wkr-t b{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:20px;border-radius:6px;
  background:linear-gradient(180deg,var(--ui-brand-050),var(--ui-brand-100));border:1px solid rgba(134,134,134, .20);color:var(--ui-brand-900);
  font-weight:900;font-size:11px;font-variant-numeric:tabular-nums;box-shadow:inset 0 1px 0 #fff}
.dg-due .dg-wkr-t em{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-300)}
.dg-due .dg-wkr-r.is-zero .dg-wkr-b{background:transparent;box-shadow:none;border:1px dashed var(--ui-line-200)}

/* —— ④ 标尺柱（交期预警 / 交期分布共用）换肤 —— */
.dg-due .dg-rl-t{border-radius:8px;border:1px solid var(--ui-line-200);
  background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-line-100));
  box-shadow:inset 0 1px 3px rgba(28,28,28, .08)}
.dg-due .dg-rl-t i{position:relative;border-radius:6px;
  box-shadow:0 3px 10px -2px rgba(134,134,134, .45), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-rl-t i::after{content:"";position:absolute;left:1px;right:1px;top:1px;height:38%;
  border-radius:6px 6px 4px 4px;background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,0))}
.dg-due .dg-rl.is-today .dg-rl-t i{box-shadow:0 4px 12px -2px rgba(220,38,38,.5), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-rl.in-win .dg-rl-t i{box-shadow:0 3px 10px -2px rgba(217,119,6,.5), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-rl.is-zero .dg-rl-t{background:transparent;box-shadow:none}

/* —— ⑤ 排行 / 分布横条（工段、客户、周、明细行）换肤 —— */
.dg-due .dg-stn-b,.dg-due .dg-wk-b{height:14px;border-radius:6px;
  background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-line-100));box-shadow:inset 0 1px 3px rgba(28,28,28, .08)}
.dg-due .dg-stn-b i,.dg-due .dg-wk-b i{position:relative;box-shadow:inset 1px 0 0 rgba(255,255,255,.85)}
.dg-due .dg-stn-b i::after,.dg-due .dg-wk-b i::after{content:"";position:absolute;left:0;right:0;top:0;height:45%;
  background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0))}
.dg-due .dg-lr-bar i{position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.dg-due .dg-lr-bar i::after{content:"";position:absolute;left:0;right:0;top:0;height:45%;
  background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,0))}
.dg-due .dg-gh-bar i{box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.dg-due .dg-lgd-r .b i,.dg-due .dg-lgd-r .b{border-radius:4px}

/* —— ⑥ KPI 迷你图同一套皮肤 —— */
.dg-due .dg-kv-t{height:10px;box-shadow:inset 0 1px 3px rgba(0,0,0,.28)}
.dg-due .dg-kv-t i{box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.dg-due .dg-kv-t2 i{box-shadow:0 1px 5px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.45)}

/* —— ⑦ 窄屏：周达成率收一列（delta 让位给条长），分档/周节奏同步收窄 —— */
@media (max-width:1440px){
  .dg-due .dg-rate-tl,.dg-due .dg-rate-r{grid-template-columns:100px minmax(60px,1fr) 88px 150px}
  .dg-due .dg-rate-v em{display:none}
  .dg-due .dg-cyb-r{grid-template-columns:70px minmax(50px,1fr) 112px}
  .dg-due .dg-wkr-r{grid-template-columns:110px minmax(60px,1fr) 190px 42px}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v23：图表皮肤续（「按时交付率」页专用结构 + KPI 双条迷你图）
   本页同样整页套用 .dg-due（质感皮肤全部继承），这里只补它自己的四种行结构：
     ① 周达成率 + 累计 双条行（共用 0~100% 轴与 95% 目标线）
     ② 按时率 bullet 行（分客户 / 分纯化方式共用）
     ③ 订单状态分解行
     ④ KPI 砖里的「两口径对照」双条迷你图
   ════════════════════════════════════════════════════════════════════════════ */

/* —— ① 周达成率 + 累计 —— */
.dg-due .dg-gwk{display:flex;flex-direction:column;gap:4px;flex:1;justify-content:space-between}
.dg-due .dg-gwk-hd,.dg-due .dg-gwk-r{display:grid;grid-template-columns:110px minmax(0,1fr) 104px 176px;gap:10px;
  align-items:center;padding:0 8px;min-width:0}
.dg-due .dg-gwk-hd{height:16px;align-items:end}
.dg-due .dg-gwk-hz{position:relative;display:block;height:100%}
.dg-due .dg-gwk-hz b{position:absolute;bottom:2px;transform:translateX(-50%);font-size:11px;font-weight:800;
  color:var(--ui-ok-solid);white-space:nowrap}
.dg-due .dg-gwk-r{padding:6px 8px;border-radius:10px}
.dg-due .dg-gwk-k{font-size:11px;font-weight:700;color:var(--sk-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-gwk-b{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0}
.dg-due .dg-gwk-t{position:relative;height:10px;border-radius:4px;overflow:hidden;
  background:linear-gradient(180deg,var(--ui-line-100),var(--ui-line-200));box-shadow:inset 0 1px 2px rgba(28,28,28, .08)}
.dg-due .dg-gwk-t i{display:block;height:100%;border-radius:4px;position:relative;
  box-shadow:0 2px 7px -2px rgba(28,28,28, .28), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-gwk-t i::after{content:"";position:absolute;left:1px;right:1px;top:1px;height:45%;border-radius:4px 4px 4px 4px;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}
.dg-due .dg-gwk-t.is-cum{height:7px;border-radius:4px}
.dg-due .dg-gwk-t.is-cum i{border-radius:4px;background:linear-gradient(90deg,#c6c6c6,var(--sk-accent))}
.dg-due .dg-gwk-tm{position:absolute;top:0;bottom:0;width:2px;border-radius:4px;background:var(--ui-ok-solid);
  box-shadow:0 0 0 1.5px rgba(255,255,255,.92)}
.dg-due .dg-gwk-v{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.dg-due .dg-gwk-v b{min-width:52px;height:22px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:8px;font-size:12px;font-weight:900;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,var(--ui-bg-page),var(--ui-ok-bg));border:1px solid rgba(10,112,67,.24);color:var(--ui-ok-solid);
  box-shadow:inset 0 1px 0 #fff, 0 1px 2px rgba(28,28,28, .05)}
.dg-due .dg-gwk-r.is-warn .dg-gwk-v b{background:linear-gradient(180deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:rgba(217,119,6,.3);color:var(--ui-warn-ink)}
.dg-due .dg-gwk-r.is-bad .dg-gwk-v b{background:linear-gradient(180deg,var(--ui-danger-bg),var(--ui-danger-bg));border-color:rgba(220,38,38,.28);color:var(--ui-danger-solid)}
.dg-due .dg-gwk-v b.is-na{min-width:auto;padding:0 10px;background:var(--sk-soft);border-color:var(--ui-line-200);color:var(--ui-ink-400);font-size:11px}
.dg-due .dg-gwk-v em{font-style:normal;font-size:11px;font-weight:800;color:var(--sk-accent);font-variant-numeric:tabular-nums}
.dg-due .dg-gwk-n{font-size:11px;color:var(--sk-ink-3);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-gwk-r.is-zero .dg-gwk-b .dg-gwk-t{background:transparent;box-shadow:inset 0 0 0 1px var(--ui-line-200)}
.dg-due .dg-gwk-r.is-zero .dg-gwk-tm{display:none}

/* —— ② 按时率 bullet 行（分客户 / 分纯化方式） —— */
.dg-due .dg-grate{display:flex;flex-direction:column;gap:4px;flex:1;justify-content:space-between}
.dg-due .dg-grate-hd,.dg-due .dg-grate-r{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) 74px 60px;
  gap:10px;align-items:center;padding:0 8px;min-width:0}
.dg-due .dg-grate-hd{height:16px;align-items:end}
.dg-due .dg-grate-hz{position:relative;display:block;height:100%}
.dg-due .dg-grate-hz b{position:absolute;bottom:2px;transform:translateX(-50%);font-size:11px;font-weight:800;
  color:var(--ui-ok-solid);white-space:nowrap}
.dg-due .dg-grate-r{padding:6px 8px;border-radius:10px}
.dg-due .dg-grate-r:hover{background:var(--ui-brand-050)}
.dg-due .dg-grate-k{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--ui-ink-700);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-grate-k em{font-style:normal;font-size:11px;font-weight:800;line-height:14px;padding:0 4px;border-radius:4px;
  color:var(--ui-warn-ink);background:var(--ui-warn-bg);border:1px solid rgba(217,119,6,.3);flex:none}
.dg-due .dg-grate-b{position:relative;height:16px;border-radius:8px;overflow:hidden;
  background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-line-100));box-shadow:inset 0 1px 3px rgba(28,28,28, .08);min-width:0}
.dg-due .dg-grate-b i{display:block;height:100%;border-radius:8px;position:relative;
  box-shadow:0 3px 9px -2px rgba(28,28,28, .28), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-grate-b i::after{content:"";position:absolute;left:1px;right:1px;top:1px;height:45%;border-radius:6px 6px 4px 4px;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}
.dg-due .dg-grate-tm{position:absolute;top:-2px;bottom:-2px;width:2px;border-radius:4px;background:var(--ui-ok-solid);
  box-shadow:0 0 0 1.5px rgba(255,255,255,.9)}
.dg-due .dg-grate-v{text-align:right}
.dg-due .dg-grate-v b{display:inline-flex;align-items:center;justify-content:center;min-width:56px;height:22px;padding:0 8px;
  border-radius:8px;font-size:12px;font-weight:900;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,var(--ui-bg-page),var(--ui-ok-bg));border:1px solid rgba(10,112,67,.24);color:var(--ui-ok-solid);
  box-shadow:inset 0 1px 0 #fff, 0 1px 2px rgba(28,28,28, .05)}
.dg-due .dg-grate-r.is-warn .dg-grate-v b{background:linear-gradient(180deg,var(--ui-warn-bg),var(--ui-warn-bg));border-color:rgba(217,119,6,.3);color:var(--ui-warn-ink)}
.dg-due .dg-grate-r.is-bad .dg-grate-v b{background:linear-gradient(180deg,var(--ui-danger-bg),var(--ui-danger-bg));border-color:rgba(220,38,38,.28);color:var(--ui-danger-solid)}
.dg-due .dg-grate-n{font-size:11px;color:var(--ui-ink-400);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-grate-r.is-thin{opacity:.72}
.dg-due .dg-grate-r.is-thin:hover{opacity:1}

/* —— ③ 订单状态分解 —— */
.dg-due .dg-brk{display:flex;flex-direction:column;gap:4px;flex:1;justify-content:space-between}
.dg-due .dg-brk-r{display:grid;grid-template-columns:minmax(130px,190px) minmax(0,1fr) 112px minmax(150px,240px);
  gap:10px;align-items:center;padding:6px 8px;border-radius:10px;min-width:0}
.dg-due .dg-brk-k{font-size:12px;font-weight:600;color:var(--ui-ink-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-brk-b{position:relative;height:16px;border-radius:8px;overflow:hidden;
  background:linear-gradient(180deg,var(--ui-bg-soft),var(--ui-line-100));box-shadow:inset 0 1px 3px rgba(28,28,28, .08);min-width:0}
.dg-due .dg-brk-b i{display:block;height:100%;border-radius:8px;position:relative;
  box-shadow:0 3px 9px -2px rgba(28,28,28, .26), inset 0 1px 0 rgba(255,255,255,.5)}
.dg-due .dg-brk-b i::after{content:"";position:absolute;left:1px;right:1px;top:1px;height:45%;border-radius:6px 6px 4px 4px;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}
.dg-due .dg-brk-v{text-align:right;font-size:11px;color:var(--sk-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-brk-v b{font-size:12px;font-weight:900;color:var(--ui-ink-700);margin-right:2px}
.dg-due .dg-brk-n{font-size:11px;color:var(--ui-ink-400);line-height:1.4}
.dg-due .dg-c-gwk .ov3-ico{background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border-color:var(--ui-brand-100);color:var(--ui-brand-700)}
.dg-due .dg-c-grate .ov3-ico{background:linear-gradient(160deg,var(--ui-bg-soft),var(--ui-ok-bg));border-color:var(--ui-ok-line);color:var(--ui-ok-solid)}
.dg-due .dg-c-brk .ov3-ico{background:linear-gradient(160deg,var(--ui-bg-page),var(--ui-line-100));border-color:var(--ui-line-200);color:var(--ui-ink-500)}
.dg-due .dg-c-ring .ov3-ico{background:linear-gradient(160deg,var(--pl-pink-bg),var(--pl-pink-bg));border-color:var(--pl-pink-line);color:var(--ui-brand-500)}

/* —— ④ KPI 砖里的「两口径对照」双条迷你图 —— */
.dg-due .dg-kv2{display:flex;flex-direction:column;gap:4px;width:100%}
.dg-due .dg-kv2-r{display:grid;grid-template-columns:34px minmax(0,1fr) 42px;align-items:center;gap:6px}
.dg-due .dg-kv2-l{font-style:normal;font-size:11px;font-weight:700;color:#c6c6c6;white-space:nowrap}
.dg-due .dg-kv2-b{height:7px;border-radius:4px;background:rgba(255,255,255,.15);overflow:hidden}
.dg-due .dg-kv2-b i{display:block;height:100%;border-radius:4px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.dg-due .dg-kv2-v{font-size:11px;font-weight:800;color:var(--ui-brand-050);text-align:right;font-variant-numeric:tabular-nums}

/* —— ⑤ 窄屏：让位给条长 —— */
@media (max-width:1440px){
  .dg-due .dg-gwk-hd,.dg-due .dg-gwk-r{grid-template-columns:100px minmax(60px,1fr) 98px 0}
  .dg-due .dg-gwk-n{display:none}
  .dg-due .dg-grate-hd,.dg-due .dg-grate-r{grid-template-columns:minmax(100px,150px) minmax(50px,1fr) 68px 54px}
  .dg-due .dg-brk-r{grid-template-columns:minmax(110px,160px) minmax(50px,1fr) 106px 0}
  .dg-due .dg-brk-n{display:none}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v24：「按时交付率」外观返工（用户：「做的可视化图表太丑了」）
   这一层做的是**减法**（设计评审第 8 条「kill the noise」）：
     ① 撤掉 v22 给每根条加的高光、同色投影、以及整条浅灰大轨道 ——
        改「细槽 + 发丝线」：轨道 1px 内描边、条身单一色系渐变、全页只留**一处 halo**（表盘主弧）；
     ② 周趋势改成**竖向液体柱**（8 根，柱高＝达成率，柱内蓝块＝累计，横贯 95% 目标虚线）；
     ③ 排行行加**列标题**（名称 / 轴 / 按时率 / 单数），四列对齐；
     ④ 配色整体降一档浮躁、升一档饱和：绿 #3ED39B→#0E8F5E｜橙 #FFC24D→#D9840A｜红 #FF7A6E→#C4303D｜蓝 #898989→#626262；
     ⑤ 卡片由「一行两张 = 一张图 + 一张图」改成**一行三张（4+4+4）**，条长从 ~800px 收到 ~300px；
        口径说明升为整行 g12 的宽卡（定义列表走 3 列网格），不再挤在侧栏。
   ════════════════════════════════════════════════════════════════════════════ */

/* —— ① 撤掉条上的高光/投影，轨道改成细槽（全站 .dg-due 生效，四页统一） —— */
.dg-due .dg-rate-b,.dg-due .dg-cyb-b,.dg-due .dg-wkr-b,.dg-due .dg-grate-b,.dg-due .dg-brk-b,
.dg-due .dg-gwk-t,.dg-due .dg-stn-b,.dg-due .dg-wk-b,.dg-due .dg-lr-bar{
  background:var(--ui-bg-page);box-shadow:inset 0 0 0 1px var(--ui-line-100);border-radius:6px}
.dg-due .dg-rate-b i,.dg-due .dg-cyb-b i,.dg-due .dg-wkr-b i,.dg-due .dg-grate-b i,.dg-due .dg-brk-b i,
.dg-due .dg-gwk-t i,.dg-due .dg-lr-bar i{
  box-shadow:none;border-radius:4px}
.dg-due .dg-rate-b i::after,.dg-due .dg-cyb-b i::after,.dg-due .dg-wkr-b i::after,.dg-due .dg-grate-b i::after,
.dg-due .dg-brk-b i::after,.dg-due .dg-gwk-t i::after,.dg-due .dg-stn-b i::after,.dg-due .dg-wk-b i::after,
.dg-due .dg-lr-bar i::after,.dg-due .dg-rl-t i::after{display:none}
.dg-due .dg-rl-t i,.dg-due .dg-stn-b i,.dg-due .dg-wk-b i{box-shadow:none}
/* 数值一律等宽数字 + 右对齐，形成一条干净的竖线 */
.dg-due .dg-grate-n,.dg-due .dg-grate-v b,.dg-due .dg-brk-v,.dg-due .dg-gwk-v b,
.dg-due .dg-cyb-v,.dg-due .dg-wkr-t b,.dg-due .dg-lr-p,.dg-due .dg-lr-due{font-variant-numeric:tabular-nums}

/* —— ② 周达成率：竖向液体柱 —— */
.dg-due .dg-wkc{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}
.dg-due .dg-wkc-plot{position:relative;display:flex;align-items:flex-end;gap:10px;height:196px;min-width:0}
.dg-due .dg-wkc-tl{position:absolute;left:0;right:0;display:flex;align-items:center;gap:6px;z-index:3;
  font-size:11px;font-weight:800;color:var(--ui-ok-solid);pointer-events:none;transform:translateY(50%)}
.dg-due .dg-wkc-tl i{flex:1;height:0;border-top:1px dashed rgba(10,112,67,.55)}
.dg-due .dg-wkc-t{position:relative;flex:1 1 0;min-width:0;height:100%;border-radius:6px;overflow:hidden;
  background:var(--ui-bg-page);box-shadow:inset 0 0 0 1px var(--ui-line-100)}
.dg-due .dg-wkc-t > i{position:absolute;left:0;right:0;bottom:0;border-radius:6px}
.dg-due .dg-wkc-t > b{position:absolute;left:0;right:0;text-align:center;font-size:12px;font-weight:900;
  color:var(--ui-ink-700);font-variant-numeric:tabular-nums;transform:translateY(-50%);z-index:2;
  text-shadow:0 1px 0 rgba(255,255,255,.75)}
.dg-due .dg-wkc-t > b.is-na{top:50%;color:var(--ui-ink-300);font-weight:700}
.dg-due .dg-wkc-t > u{position:absolute;left:7px;right:7px;height:3px;border-radius:4px;background:var(--ui-brand-700);
  box-shadow:0 0 0 1.5px #fff;z-index:2}
.dg-due .dg-wkc-t.is-zero{background:transparent;box-shadow:none;border:1px dashed var(--ui-line-200)}
.dg-due .dg-wkc-lbl{display:flex;gap:10px;min-width:0}
.dg-due .dg-wkc-lbl > span{flex:1 1 0;min-width:0;text-align:center;font-size:11px;font-weight:700;color:var(--sk-ink-2);
  font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-wkc-lbl > span em{display:block;font-style:normal;font-size:11px;font-weight:600;color:var(--ui-ink-400);margin-top:2px}
.dg-due .dg-wkc-lg{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:11px;color:var(--sk-ink-3);margin-top:2px}
.dg-due .dg-wkc-lg span{display:inline-flex;align-items:center;gap:6px}
.dg-due .dg-wkc-lg i{width:10px;height:10px;border-radius:4px;flex:none;display:inline-block}
.dg-due .dg-wkc-lg i.bar-ok{background:linear-gradient(180deg,var(--ui-ink-300),var(--ui-ok-solid))}
.dg-due .dg-wkc-lg i.cum{background:var(--ui-brand-700);height:4px;border-radius:4px}
.dg-due .dg-wkc-lg i.tgt{border-top:2px dashed rgba(10,112,67,.6);height:0;width:14px;border-radius:0}
.dg-due .dg-wkc-lg span.dim{color:var(--ui-ink-300)}
/* —— ③ 排行行的列标题 —— */
.dg-due .dg-grate-hd,.dg-due .dg-gwk-hd{font-size:11px;font-weight:800;color:var(--ui-ink-400);letter-spacing:.02em}
.dg-due .dg-grate-hd > span:last-child,.dg-due .dg-grate-hd > span:nth-child(3){text-align:right}
.dg-due .dg-grate-hd > span:first-child{padding-left:2px}
.dg-due .dg-grate{padding-bottom:6px}

/* —— ④ 排行卡变窄后，名称列收一点、条形轨道贴住右列 —— */
.dg-due .dg-grate-hd,.dg-due .dg-grate-r{grid-template-columns:minmax(96px,1.15fr) minmax(0,1.35fr) 62px 46px;gap:8px}
.dg-due .dg-grate-v b{min-width:0;width:100%;padding:0 6px;height:21px;font-size:11px}
.dg-due .dg-grate-r{padding:6px 6px}
.dg-due .dg-grate-k{font-size:11px}

/* —— ⑤ 口径宽卡：定义列表走三列 —— */
.dg-due .dg-cal.is-wide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 26px}
.dg-due .dg-cal.is-wide dt{grid-column:auto}
.dg-due .dg-cal.is-wide dd{grid-column:auto;margin-bottom:8px}
@media (max-width:1440px){ .dg-due .dg-cal.is-wide{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:1280px){ .dg-due .dg-cal.is-wide{grid-template-columns:1fr} }

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v25：「订单构成」重做 —— 补四种新结构（本页同样整页套用 .dg-due）
     ① .dg-tri   互斥三分：大数字 + 100% 堆叠条 + 图例行（替代 3.6% 读不出来的甜甜圈）
     ② .dg-mix   排行行：分组 / 条数占比 / 条数 / 单数（纯化方式、客户构成共用，可点）
     ③ .dg-cover 覆盖率计量条（0~100% 比值）+ 可点取值标签（替代 1600px 宽的空条）
     ④ .dg-fbrow 就地筛选的提示条
   ════════════════════════════════════════════════════════════════════════════ */

/* —— ① 互斥三分 —— */
.dg-due .dg-tri{display:flex;flex-direction:column;gap:14px;flex:1;justify-content:center}
.dg-due .dg-tri-hero{display:flex;align-items:baseline;gap:8px}
.dg-due .dg-tri-hero b{font-size:40px;font-weight:900;line-height:1;color:var(--ui-ink-900);letter-spacing:-.6px;
  font-variant-numeric:tabular-nums}
.dg-due .dg-tri-hero em{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-400)}
.dg-due .dg-tri-bar{display:flex;height:26px;border-radius:8px;overflow:hidden;background:var(--ui-bg-page);
  box-shadow:inset 0 0 0 1px var(--ui-line-100)}
.dg-due .dg-tri-bar span{position:relative;display:flex;align-items:center;justify-content:center;
  box-shadow:inset -2px 0 0 #fff}
.dg-due .dg-tri-bar span:last-child{box-shadow:none}
.dg-due .dg-tri-bar span b{font-size:11px;font-weight:900;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.22);
  font-variant-numeric:tabular-nums}
.dg-due .dg-tri-lg{display:flex;flex-direction:column;gap:8px}
.dg-due .dg-tri-lgr{display:grid;grid-template-columns:10px minmax(0,1fr) 46px 52px;align-items:center;gap:8px;
  font-size:12px;color:var(--ui-ink-700)}
.dg-due .dg-tri-lgr i{width:10px;height:10px;border-radius:4px}
.dg-due .dg-tri-lgt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-tri-lgr b{text-align:right;font-size:13px;font-weight:900;color:var(--ui-ink-700);font-variant-numeric:tabular-nums}
.dg-due .dg-tri-lgr em{font-style:normal;text-align:right;font-size:11px;font-weight:700;color:var(--ui-ink-400);
  font-variant-numeric:tabular-nums}
.dg-due .dg-tri-lgr.is-zero{color:var(--ui-ink-300)}
.dg-due .dg-tri-lgr.is-zero b{color:var(--ui-ink-300);font-weight:700}
.dg-due .dg-tri-f{font-size:11px;color:var(--ui-ink-400)}
.dg-due .dg-tri-f b{color:var(--sk-ink-2)}

/* —— ② 排行行（纯化方式 / 客户构成） —— */
.dg-due .dg-mix{display:flex;flex-direction:column;gap:2px;flex:1}
.dg-due .dg-mix-hd,.dg-due .dg-mix-r{display:grid;grid-template-columns:minmax(96px,1.2fr) minmax(0,1.2fr) 74px 56px;
  gap:8px;align-items:center;padding:0 8px;min-width:0}
.dg-due .dg-mix-hd{height:17px;align-items:end;font-size:11px;font-weight:800;color:var(--ui-ink-400);letter-spacing:.02em}
.dg-due .dg-mix-hd > span:nth-child(3),.dg-due .dg-mix-hd > span:nth-child(4){text-align:right}
.dg-due .dg-mix-hb{position:relative}
.dg-due .dg-mix-r{height:30px;border:0;background:transparent;border-radius:8px;cursor:pointer;text-align:left;
  font:inherit;transition:background .14s ease-out}
.dg-due .dg-mix-r:hover{background:var(--ui-brand-050)}
.dg-due .dg-mix-r:focus-visible{outline:2px solid var(--sk-accent);outline-offset:-2px}
.dg-due .dg-mix-k{font-size:11px;font-weight:600;color:var(--ui-ink-700);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;min-width:0}
.dg-due .dg-mix-b{position:relative;height:14px;border-radius:4px;background:var(--ui-bg-page);
  box-shadow:inset 0 0 0 1px var(--ui-line-100);min-width:0}
.dg-due .dg-mix-b i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#c6c6c6,var(--ui-brand-700))}
.dg-due .dg-mix-v{text-align:right;font-size:11px;color:var(--sk-ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-mix-v b{font-size:13px;font-weight:900;color:var(--ui-ink-700);margin-right:2px}
.dg-due .dg-mix-v em,.dg-due .dg-mix-n em{font-style:normal;font-size:11px;color:var(--ui-ink-400);margin-left:2px}
.dg-due .dg-mix-n{text-align:right;font-size:11px;color:var(--ui-ink-700);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-mix-rest{margin-top:8px;padding-top:8px;border-top:1px solid var(--ui-bg-soft);font-size:11px;color:var(--ui-ink-400)}
.dg-due .dg-mix-rest b{color:var(--ui-ink-700)}

/* —— ③ 覆盖率计量条 + 取值标签 —— */
.dg-due .dg-cover{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;flex:1}
.dg-due .dg-cover-f{display:flex;flex-direction:column;gap:10px;min-width:0}
.dg-due .dg-cover-hd{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px}
.dg-due .dg-cover-t{display:flex;align-items:baseline;gap:8px;font-size:13px;font-weight:800;color:var(--ui-ink-900);min-width:0}
.dg-due .dg-cover-t em{font-style:normal;font-size:11px;font-weight:700;color:var(--ui-ink-300);letter-spacing:.04em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-cover-c{font-size:11px;color:var(--sk-ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.dg-due .dg-cover-c b{color:var(--ui-ink-700);font-weight:900}
.dg-due .dg-cover-chip{font-size:11px;font-weight:800;line-height:18px;padding:0 8px;border-radius:6px;
  color:var(--ui-ok-solid);background:var(--ui-ok-bg);border:1px solid rgba(10,112,67,.24);white-space:nowrap}
.dg-due .dg-cover-f.is-weak .dg-cover-chip{color:var(--ui-warn-ink);background:var(--ui-warn-bg);border-color:rgba(217,119,6,.3)}
.dg-due .dg-cover-bar{position:relative;height:16px;border-radius:6px;background:var(--ui-bg-page);
  box-shadow:inset 0 0 0 1px var(--ui-line-100);overflow:hidden}
.dg-due .dg-cover-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--ui-ink-400),var(--ui-ok-solid))}
.dg-due .dg-cover-f.is-weak .dg-cover-bar i{background:linear-gradient(90deg,var(--ui-warn-line),var(--ui-warn-solid))}
.dg-due .dg-cover-bar u{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ui-ink-900);opacity:.35;border-radius:4px}
.dg-due .dg-cover-tags{display:flex;flex-wrap:wrap;gap:6px}
.dg-due .dg-cover-tag{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:6px;
  font-size:11px;font-weight:700;color:var(--ui-ink-700);background:var(--ui-bg-soft);border:1px solid var(--ui-line-200);cursor:pointer;
  font-family:inherit;transition:background .14s ease-out,border-color .14s ease-out}
.dg-due .dg-cover-tag:hover{background:var(--ui-brand-100);border-color:var(--ui-brand-100)}
.dg-due .dg-cover-tag:focus-visible{outline:2px solid var(--sk-accent);outline-offset:1px}
.dg-due .dg-cover-tag b{font-size:12px;font-weight:900;color:var(--ui-brand-700);font-variant-numeric:tabular-nums}
.dg-due .dg-cover-tags .dim{font-size:11px;color:var(--ui-ink-300)}
.dg-due .dg-cover-n{font-size:11px;line-height:1.5;color:var(--ui-ink-400)}
.dg-due .dg-cover-n b{color:var(--sk-ink-2)}
@media (max-width:1440px){ .dg-due .dg-cover{grid-template-columns:1fr;gap:18px} }

/* —— ④ 就地筛选提示条 + 明细列表限高 —— */
.dg-due .dg-fbrow{display:flex;align-items:center;gap:10px;min-height:0;margin-bottom:8px}
.dg-due .dg-fbrow:empty{display:none}
.dg-due .dg-fb{font-size:11px;color:var(--ui-ink-700);background:var(--ui-brand-100);border:1px solid var(--ui-brand-100);border-radius:8px;
  padding:4px 10px}
.dg-due .dg-fb b{color:var(--ui-brand-700);font-weight:900}
.dg-due #catList{max-height:520px;overflow:auto;overflow-x:hidden}
.dg-due #catList::-webkit-scrollbar{width:8px}
.dg-due #catList::-webkit-scrollbar-thumb{background:rgba(28,28,28, .14);border-radius:8px}
.dg-due #catChips{margin-bottom:0}
.dg-due .dg-c-tri .ov3-ico{background:linear-gradient(160deg,var(--ui-bg-soft),var(--ui-ok-bg));border-color:var(--ui-ok-line);color:var(--ui-ok-solid)}
.dg-due .dg-c-mix .ov3-ico{background:linear-gradient(160deg,var(--ui-brand-050),var(--ui-brand-100));border-color:var(--ui-brand-100);color:var(--ui-brand-700)}
.dg-due .dg-c-cover .ov3-ico{background:linear-gradient(160deg,var(--pl-pink-bg),var(--pl-pink-bg));border-color:var(--pl-pink-line);color:var(--ui-brand-500)}

/* —— ⑤ 窄屏：三张构成卡并排（4+4+4）—— 主题层在 ≤1500px 把 .ov3-g4 抬成 6 栏，
      会让第三张卡单独占半行；本页三张卡是「一组」，必须同一行。 —— */
@media (max-width:1440px){
  .ov3-grid[data-tab="category"] .dg-c-tri,
  .ov3-grid[data-tab="category"] .dg-c-mix{grid-column:span 4!important}
}

/* —— ⑥ ≤1340px：「订单构成」三张卡改成 12 + 6 + 6（排行条宽回到 ~200px） —— */
@media (max-width:1280px){
  .ov3-grid[data-tab="category"] .ov3-card{grid-column:span 12!important}
  .ov3-grid[data-tab="category"] .dg-c-mix{grid-column:span 6!important}
}

/* ════════════════════════════════════════════════════════════════════════════
   ★ 2026-10-01 v26：可视化层整体升级（用户：「可视化图标进行全面升级，高大上一点」）
   五个驾驶舱页签统一（全部挂在 .dg-due 作用域下），一次升三级：

   ① **图标底座升级成「应用图标」**：34px / 圆角 11px / 无描边，改「斜向渐变 + 上半 52% 白高光 +
      同色柔和投影」；每个卡片族有自己的色对（--icoA/--icoB/--icoS），图标描边加粗到 2.1px。
      深色 KPI 带上的图标改成**玻璃底座**（白 22%→5% 渐变 + 1px 白描边 + 同色外发光）——
      一处 halo 就落在 KPI 图标上，其余卡片保持发丝线。
   ② **字号层级整体抬一档**：KPI 主值 31→38px、卡头标题 13.5→14.5px、行内数值 12→14px 加粗到 900、
      三分大数字 38→46px —— 每张卡都要有一个「一眼看到」的数字。
   ③ **图形加厚 + 同色渐变**：条高统一加 2~4px（排行 14→16、分档 18→20、达成率 20→22、
      周节奏 18→20、堆叠条 26→32、KPI 迷你条 6→8），轨道保持细槽、条身单一渐变，不加高光（v24 的纪律不变）。
   ④ **卡片有深度**：卡片加 `0 20px 44px -38px` 的柔和投影 + 卡顶一条同色渐变细线（--acc），
      让每个分区的色彩身份从图标一直贯穿到卡顶。

   回滚：删掉本段即回到 v25 观感（图标回到浅色底座、字号回退）。
   ════════════════════════════════════════════════════════════════════════════ */

/* —— ① 图标底座：应用图标式 —— */
.dg-due .ov3-h .ov3-ico,
.dg-due .dg-tool-hd .ov3-ico{width:34px;height:34px;border-radius:10px;border:0;position:relative;overflow:hidden;
  background:linear-gradient(155deg,var(--icoA,#c6c6c6),var(--icoB,var(--ui-brand-700)));
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(0,0,0,.10),
    0 6px 14px -8px var(--icoS,rgba(86,86,86, .8))}
.dg-due .ov3-h .ov3-ico::after,
.dg-due .dg-tool-hd .ov3-ico::after{content:"";position:absolute;left:0;right:0;top:0;height:52%;
  background:linear-gradient(180deg,rgba(255,255,255,.30),rgba(255,255,255,0))}
.dg-due .ov3-h .ov3-ico svg,
.dg-due .dg-tool-hd .ov3-ico svg{width:18px;height:18px;stroke-width:2.1;position:relative;z-index:1}
.dg-due .ov3-h{margin-bottom:12px}
.dg-due .ov3-h h3{font-size:14px;font-weight:800;letter-spacing:0}
.dg-due .ov3-h .ov3-en{font-size:11px;letter-spacing:1.4px}
.dg-due .ov3-h .ov3-meta{font-size:11px;font-weight:600;color:var(--sk-ink-2)}
.dg-due .ov3-h .ov3-meta b{font-size:12px;font-weight:900;color:var(--ui-ink-700)}

/* 卡片族的色对（默认蓝；下面按族覆盖 --icoA/--icoB/--icoS/--acc） */
.dg-due .dg-c-ruler .ov3-ico,.dg-due .dg-c-rate .ov3-ico,.dg-due .dg-c-gwk .ov3-ico,
.dg-due .dg-c-mix .ov3-ico,.dg-due .dg-c-stn .ov3-ico,.dg-due .dg-c-grate .ov3-ico{
  --icoA:#c6c6c6;--icoB:var(--ui-brand-700);--icoS:rgba(86,86,86, .8)}
.dg-due .dg-c-ruler,.dg-due .dg-c-rate,.dg-due .dg-c-gwk,.dg-due .dg-c-mix,
.dg-due .dg-c-stn,.dg-due .dg-c-grate{--acc:var(--sk-accent)}
.dg-due .dg-c-cyb .ov3-ico,.dg-due .dg-c-tri .ov3-ico{--icoA:var(--ui-ink-300);--icoB:var(--ui-ok-solid);--icoS:rgba(10,112,67,.8)}
.dg-due .dg-c-cyb,.dg-due .dg-c-tri{--acc:var(--ui-ok-solid)}
.dg-due .dg-c-wkr .ov3-ico,.dg-due .dg-c-cust .ov3-ico{--icoA:var(--ui-warn-solid);--icoB:var(--ui-warn-solid);--icoS:rgba(217,119,6,.8)}
.dg-due .dg-c-wkr,.dg-due .dg-c-cust{--acc:var(--ui-warn-solid)}
.dg-due .dg-c-coop .ov3-ico,.dg-due .dg-c-cal .ov3-ico,.dg-due .dg-c-month .ov3-ico,
.dg-due .dg-c-list .ov3-ico,.dg-due .dg-c-brk .ov3-ico{--icoA:var(--ui-ink-300);--icoB:var(--sk-ink-3);--icoS:rgba(118,118,118, .75)}
.dg-due .dg-c-coop,.dg-due .dg-c-cal,.dg-due .dg-c-month,.dg-due .dg-c-list,.dg-due .dg-c-brk{--acc:var(--ui-ink-400)}
.dg-due .dg-c-cover .ov3-ico,.dg-due .dg-c-ring .ov3-ico{--icoA:#c6c6c6;--icoB:var(--ui-brand-500);--icoS:rgba(134,134,134, .8)}
.dg-due .dg-c-cover,.dg-due .dg-c-ring{--acc:var(--ui-brand-500)}
.dg-due .dg-c-cust .ov3-ico{--icoA:#c6c6c6;--icoB:var(--ui-brand-500);--icoS:rgba(134,134,134, .8)}
.dg-due .dg-c-cust{--acc:var(--ui-brand-500)}

/* —— 深色 KPI 带：玻璃底座 + 同色外发光（本页唯一 halo） —— */
.dg-due .dg-kp-ico{width:34px;height:34px;border-radius:10px;
  background:linear-gradient(155deg,rgba(255,255,255,.22),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.20);color:var(--ui-brand-050);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38), 0 8px 18px -12px rgba(0,0,0,.9)}
.dg-due .dg-kp-ico svg{width:19px;height:19px;stroke-width:2.05}
.dg-due .dg-kp.tone-a .dg-kp-ico{background:linear-gradient(155deg,rgba(179,179,179, .44),rgba(176,58,106,.16));
  border-color:rgba(245,198,204,.44);color:var(--ui-danger-bg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 0 20px -5px rgba(220,38,38,.6)}
.dg-due .dg-kp.tone-c .dg-kp-ico{background:linear-gradient(155deg,rgba(217,119,6,.44),rgba(217,119,6,.16));
  border-color:rgba(247,220,176,.44);color:var(--ui-warn-bg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 0 20px -5px rgba(217,119,6,.55)}
.dg-due .dg-kp.tone-b .dg-kp-ico{background:linear-gradient(155deg,rgba(198,198,198, .46),rgba(86,86,86, .18));
  border-color:rgba(198,198,198, .44);color:var(--ui-brand-100);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 0 20px -5px rgba(198,198,198, .55)}
.dg-due .dg-kp:not(.tone-a):not(.tone-c):not(.tone-b) .dg-kp-ico{
  background:linear-gradient(155deg,rgba(179,179,179, .42),rgba(10,112,67,.16));
  border-color:rgba(179,179,179, .42);color:var(--ui-bg-soft);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 0 20px -5px rgba(144,144,144, .5)}

/* —— ② 字号与层级 —— */
.dg-due .dg-kp .k-vl b{font-size:40px;letter-spacing:-.8px}
.dg-due .dg-kp .k-lb{font-size:12px;font-weight:700}
.dg-due .dg-kp .k-sb{font-size:11px}
.dg-due .dg-kp .k-cap{font-size:11px}
.dg-due .dg-tri-hero b{font-size:40px}
.dg-due .dg-cover-t{font-size:14px}
.dg-due .dg-cover-c{font-size:11px}
.dg-due .dg-mix-v b,.dg-due .dg-cyb-v b,.dg-due .dg-brk-v b,.dg-due .dg-lr-p b,
.dg-due .dg-tri-lgr b,.dg-due .dg-wkr-t b{font-size:14px}
.dg-due .dg-mix-v,.dg-due .dg-mix-n,.dg-due .dg-cyb-v,.dg-due .dg-brk-v,.dg-due .dg-lr-p{font-size:12px}
.dg-due .dg-mix-k,.dg-due .dg-grate-k,.dg-due .dg-lr-cust{font-size:12px}
.dg-due .dg-rate-v b,.dg-due .dg-grate-v b,.dg-due .dg-gwk-v b{font-size:13px;height:24px}
.dg-due .dg-tri-lgr{font-size:12px}

/* —— ③ 图形加厚（轨道仍是细槽、条身单一渐变，不加高光） —— */
.dg-due .dg-mix-b{height:16px}
.dg-due .dg-mix-r{height:32px}
.dg-due .dg-cyb-b{height:20px}
.dg-due .dg-rate-b{height:22px}
.dg-due .dg-grate-b{height:18px}
.dg-due .dg-brk-b{height:18px}
.dg-due .dg-wkr-b{height:20px}
.dg-due .dg-tri-bar{height:32px}
.dg-due .dg-cover-bar{height:18px}
.dg-due .dg-kv-t{height:8px}
.dg-due .dg-rl-t{border-radius:8px}
.dg-due .dg-lr-bar{height:12px}

/* —— ④ 卡片深度 + 卡顶同色细线 —— */
.dg-due .ov3-card{border-color:var(--ui-line-100);
  box-shadow:0 1px 2px rgba(28,28,28, .04), 0 20px 44px -38px rgba(68,68,68, .5)}
.dg-due .ov3-card::after{content:"";position:absolute;left:18px;right:18px;top:0;height:2px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,rgba(255,255,255,0),var(--acc,var(--sk-accent)),rgba(255,255,255,0));opacity:.5}
.dg-due .ov3-card{position:relative}
.dg-due .ov3-foot{font-size:11px}

/* —— ⑦ 「订单构成」重排后的栅格（三分/纯化/覆盖率 三张一行；客户 + 口径卡 各半行） —— */
.ov3-grid[data-tab="category"] .dg-col4{grid-column:span 6}
.dg-due .dg-cover{grid-template-columns:1fr;gap:16px}
@media (max-width:1440px){
  .ov3-grid[data-tab="category"] .dg-c-tri,
  .ov3-grid[data-tab="category"] .dg-c-mix,
  .ov3-grid[data-tab="category"] .dg-c-cover{grid-column:span 4!important}
  .ov3-grid[data-tab="category"] .dg-c-list,
  .ov3-grid[data-tab="category"] .dg-col4{grid-column:span 12!important}
}
@media (max-width:1280px){
  .ov3-grid[data-tab="category"] .ov3-card,
  .ov3-grid[data-tab="category"] .dg-col4{grid-column:span 12!important}
  .ov3-grid[data-tab="category"] .dg-c-mix{grid-column:span 6!important}
}

/* —— ⑧ 防栅格被内容撑破（grid blowout）：卡片与卡头一律允许收缩、超长标题省略号 —— */
.dg-due .ov3-card{min-width:0}
.dg-due .ov3-h{min-width:0}
.dg-due .ov3-h h3{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dg-due .ov3-h .ov3-meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-cover-t{min-width:0;flex-wrap:nowrap;overflow:hidden}
.dg-due .dg-cover-t em{min-width:0;overflow:hidden;text-overflow:ellipsis}
.dg-due .dg-cover-hd{grid-template-columns:minmax(0,1fr) auto auto}
/* 客户构成卡在本页是「g6 半行」，窄屏规则里要把它排除在外 */
@media (max-width:1440px){
  .ov3-grid[data-tab="category"] .dg-c-mix:not(.dg-c-cust){grid-column:span 4!important}
}

/* —— ⑨ 「订单构成」窄屏栅格收口（必须放在本文件最末：同特异性下以最后一条为准） ——
   ≤1500px：客户构成卡保持半行（它是 g6，不该跟着另外两张 mix 卡变 4 栏）；
   ≤1340px：三张构成卡整行、两张排行卡各半行、口径卡与明细整行。 */
@media (max-width:1440px){
  .ov3-grid[data-tab="category"] .dg-c-cust{grid-column:span 6!important}
}
@media (max-width:1280px){
  .ov3-grid[data-tab="category"] .ov3-card{grid-column:span 12!important}
  .ov3-grid[data-tab="category"] .dg-c-mix{grid-column:span 6!important}
}

/* —— ⑩ 「订单构成」栅格权威口径（本文件最后一块，前面几块的历史规则都被它收口） ——
   2300/1920：三分 + 纯化 + 覆盖率 一行三张（4/4/4）｜客户 + 口径卡 各半行（6/6）｜明细整行
   1440     ：同上（4/4/4 + 6/6 + 12）
   1280     ：三分整行、纯化 + 客户 各半行、覆盖率整行、口径卡整行、明细整行 */
@media (max-width:1440px){
  .ov3-grid[data-tab="category"] .dg-c-tri,
  .ov3-grid[data-tab="category"] .dg-c-cover,
  .ov3-grid[data-tab="category"] .dg-c-mix:not(.dg-c-cust){grid-column:span 4!important}
  .ov3-grid[data-tab="category"] .dg-c-cust{grid-column:span 6!important}
  .ov3-grid[data-tab="category"] .dg-col4{grid-column:span 6!important}
  .ov3-grid[data-tab="category"] .dg-c-list{grid-column:span 12!important}
}
@media (max-width:1280px){
  .ov3-grid[data-tab="category"] .ov3-card{grid-column:span 12!important}
  .ov3-grid[data-tab="category"] .dg-c-mix:not(.dg-c-cust),
  .ov3-grid[data-tab="category"] .dg-c-cust{grid-column:span 6!important}
  .ov3-grid[data-tab="category"] .dg-col4{grid-column:span 12!important}
}