:root {
  --ink: #172321;
  --muted: #66736f;
  --muted-2: #8a9692;
  --paper: #f3f5f2;
  --card: #ffffff;
  --line: #dfe5e1;
  --line-soft: #ecf0ed;
  --sidebar: #17221f;
  --sidebar-2: #20302b;
  --teal: #0c7d69;
  --teal-dark: #075f51;
  --teal-soft: #dff3ed;
  --orange: #ed7b2f;
  --orange-soft: #fff0e4;
  --red: #c33d37;
  --red-soft: #fbe8e6;
  --blue: #2f69a5;
  --blue-soft: #e8f0fa;
  --yellow: #b37a13;
  --yellow-soft: #fff5d9;
  --shadow: 0 12px 35px rgba(23, 35, 33, .07);
  --radius: 16px;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { background: var(--paper); font-size: 14px; }
button, input, select { font: inherit; }
button { color: inherit; }

/* ══════════════════════════════════════════════════════════════════
   DARK WAREHOUSE OS SHELL — 左侧导航 + 顶部系统栏
   ══════════════════════════════════════════════════════════════════
   视觉基准取自右侧「仓库运营指挥中心」：深海军蓝底 + cyan 高亮 +
   细蓝灰边线。目标是左/上/右看起来是**同一个产品**，而不是
   「老 ERP 菜单 + 普通后台 Header + 新科技驾驶舱」拼在一起。

   性能纪律（和作业终端同一套）：
     不用 Canvas / WebGL / 粒子 / 视频 / 大面积 blur / 常驻动画
     科技感来自结构、层次、边线、排版、极轻光效
     所有过渡 120~200ms，且尊重 prefers-reduced-motion
   ══════════════════════════════════════════════════════════════════ */
:root {
  --shell-bg: #071426;          /* Sidebar / Header 主底：深海军蓝 */
  --shell-bg-2: #0a1c31;        /* 二级背景 */
  --shell-panel: #0d2440;       /* 卡片/状态块 */
  --shell-line: #16324f;        /* 低亮度蓝灰边框 */
  --shell-line-2: #1f4468;
  --shell-text: #e6f1fb;        /* 高亮白 */
  --shell-dim: #8fabc6;         /* 浅蓝灰 */
  --shell-dim-2: #5d7c9c;       /* 低优先级灰蓝 */
  --shell-cyan: #3fd0e8;        /* 主高亮 */
  --shell-cyan-dim: #1a6b82;
  --shell-emerald: #3fd98a;
  --shell-amber: #f5b544;
  --shell-red: #ff6b6b;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 246px minmax(0, 1fr);
  background: var(--shell-bg);
}

/* ── Sidebar ──────────────────────────────────────────────────── */
.sidebar {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px 12px 14px;
  min-height: 100vh;
  background: linear-gradient(180deg, #08182c 0%, #071426 55%, #061120 100%);
  /* 右边一条细渐变线：像机柜边框，不是两个网页拼接的硬缝 */
  border-right: 1px solid var(--shell-line);
  box-shadow: 1px 0 0 rgba(63, 208, 232, .07);
}
/* 极轻的顶部 cyan 辉光 + 网格纹理。opacity 很低，绝不压过文字。 */
.sidebar::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 180px;
  background: radial-gradient(120% 60% at 50% 0%, rgba(63, 208, 232, .10), transparent 70%);
  pointer-events: none;
}
.sidebar::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(63, 208, 232, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(63, 208, 232, .028) 1px, transparent 1px);
  background-size: 34px 34px;
  pointer-events: none;
  opacity: .55;
}

/* 导航遮罩：只在窄屏抽屉打开时出现，桌面端根本不渲染 */
.nav-scrim { display: none; }

/* 品牌区：深色，不再是一整块亮蓝 */
.brand {
  position: relative; z-index: 1;
  display: grid; gap: 7px;
  padding: 4px 6px 14px;
  border-bottom: 1px solid var(--shell-line);
}
.brand-banner {
  width: 100%; height: auto; display: block;
  border-radius: 8px;
  /* 品牌图本身是浅色底，压一点亮度让它融进深色壳，但不失真 */
  filter: brightness(.92) contrast(1.04);
}
.brand::after {
  content: "WAREHOUSE OS";
  font-size: 9px; font-weight: 700; letter-spacing: .28em;
  color: var(--shell-dim-2);
  text-align: center;
}

/* ── 菜单 ─────────────────────────────────────────────────────── */
.nav-list {
  position: relative; z-index: 1;
  display: grid; gap: 2px; align-content: start;
  min-height: 0; overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--shell-line-2) transparent;
  padding-right: 2px;
}
/* 滚动条：不能再是一根白条 */
.nav-list::-webkit-scrollbar { width: 5px; }
.nav-list::-webkit-scrollbar-track { background: transparent; }
.nav-list::-webkit-scrollbar-thumb {
  background: var(--shell-line-2); border-radius: 3px;
}
.nav-list::-webkit-scrollbar-thumb:hover { background: var(--shell-cyan-dim); }

.nav-item {
  position: relative;
  width: 100%; min-height: 42px;
  display: grid; grid-template-columns: 22px 1fr auto;
  align-items: center; gap: 11px;
  padding: 0 11px;
  border: 1px solid transparent; border-radius: 9px;
  color: var(--shell-dim);
  background: transparent;
  cursor: pointer; text-align: left;
  font-size: 13.5px; font-weight: 600;
  transition: color .15s ease, background .15s ease, border-color .15s ease;
}
/* 左侧 rail：默认不占位（transparent），active 时亮起，不做位移 */
.nav-item::before {
  content: "";
  position: absolute; left: -1px; top: 50%;
  width: 2px; height: 0;
  background: var(--shell-cyan);
  border-radius: 0 2px 2px 0;
  transform: translateY(-50%);
  transition: height .16s ease;
}
.nav-item:hover {
  color: var(--shell-text);
  background: rgba(63, 208, 232, .055);
}
.nav-item:hover .nav-icon svg { stroke: var(--shell-cyan); }
.nav-item:hover::before { height: 40%; opacity: .5; }
.nav-item:focus-visible {
  outline: none;
  border-color: var(--shell-cyan-dim);
  box-shadow: 0 0 0 2px rgba(63, 208, 232, .22);
}

/* 当前项：深蓝半透明底 + cyan 边 + 发光 rail。绝不是一整块亮蓝，也没有红线 */
.nav-item.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(63, 208, 232, .16), rgba(63, 208, 232, .04));
  border-color: rgba(63, 208, 232, .30);
  box-shadow: inset 0 0 22px rgba(63, 208, 232, .07);
}
.nav-item.active::before {
  height: 62%;
  opacity: 1;
  box-shadow: 0 0 8px rgba(63, 208, 232, .85);
}
.nav-item.active .nav-icon svg { stroke: var(--shell-cyan); }

/* 图标统一：默认蓝灰，active/hover 才 cyan。不允许每个图标各有各的颜色 */
.nav-icon { display: inline-flex; align-items: center; justify-content: center; }
.nav-icon svg {
  width: 17px; height: 17px;
  stroke: var(--shell-dim-2); stroke-width: 1.7;
  fill: none;
  transition: stroke .15s ease;
}

/* 数字 Badge：HUD chip，不再是紫红。默认 cyan，语义色只给真正异常 */
.nav-item b {
  min-width: 22px; padding: 2px 7px;
  border-radius: 5px;
  font-size: 10.5px; font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
  color: var(--shell-cyan);
  background: rgba(63, 208, 232, .10);
  border: 1px solid rgba(63, 208, 232, .24);
}
.nav-item b:empty { display: none; }
.nav-item b.warn {
  color: var(--shell-amber);
  background: rgba(245, 181, 68, .10);
  border-color: rgba(245, 181, 68, .28);
}
.nav-item b.bad {
  color: var(--shell-red);
  background: rgba(255, 107, 107, .10);
  border-color: rgba(255, 107, 107, .30);
}
.nav-item.active b {
  color: #fff;
  background: rgba(63, 208, 232, .24);
  border-color: rgba(63, 208, 232, .45);
}

/* 分组：靠 divider + 间距，不新增文字标签，免得动到导航结构 */
.nav-divider {
  height: 1px; margin: 9px 8px;
  background: linear-gradient(90deg, transparent, var(--shell-line), transparent);
}

/* ── Sidebar 底部：小型终端状态 ─────────────────────────────── */
.sidebar-status {
  position: relative; z-index: 1;
  margin-top: auto;
  display: grid; gap: 6px;
  padding: 11px 12px;
  border: 1px solid var(--shell-line);
  border-radius: 10px;
  background: rgba(13, 36, 64, .55);
}
.sidebar-status::before {
  content: "SYSTEM STATUS";
  font-size: 8.5px; font-weight: 700; letter-spacing: .22em;
  color: var(--shell-dim-2);
}
.sidebar-status > div { display: grid; gap: 2px; }
.sidebar-status strong {
  display: flex; align-items: center; gap: 7px;
  color: var(--shell-text); font-size: 12px; font-weight: 700;
}
.sidebar-status small {
  color: var(--shell-dim-2); font-size: 10px;
  font-variant-numeric: tabular-nums; letter-spacing: .04em;
}
.status-dot {
  position: absolute; right: 12px; top: 12px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--shell-emerald);
  box-shadow: 0 0 7px rgba(63, 217, 138, .8);
}
/* 呼吸灯：频率低、幅度小，且尊重系统的减少动态设置 */
@media (prefers-reduced-motion: no-preference) {
  .status-dot { animation: shellPulse 3.2s ease-in-out infinite; }
}
@keyframes shellPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .62; }
}

/* ── 主区与顶栏 ───────────────────────────────────────────────── */
.main-shell {
  grid-column: 2; min-width: 0;
  background: var(--paper);
  /* 顶栏是深色，主体是浅色：交界处给一条 cyan 细线收口 */
  border-left: 1px solid rgba(63, 208, 232, .10);
}

.topbar {
  height: 66px;
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 0 22px;
  background: linear-gradient(180deg, #0a1c31, #071426);
  border-bottom: 1px solid var(--shell-line);
  box-shadow: 0 1px 0 rgba(63, 208, 232, .08);
}
.topbar-title { display: flex; align-items: center; gap: 12px; min-width: 0; }
.topbar-brand-logo {
  height: 26px; width: auto; display: block;
  border-radius: 5px; filter: brightness(.94) contrast(1.03);
}
.topbar-title h1 {
  margin: 0; font-size: 17px; font-weight: 700; letter-spacing: .01em;
  color: var(--shell-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* 模块名前面一个 cyan 竖条，强调「当前模块」 */
.topbar-title h1::before {
  content: ""; display: inline-block;
  width: 2px; height: 14px; margin-right: 10px;
  vertical-align: -2px;
  background: var(--shell-cyan); border-radius: 1px;
  box-shadow: 0 0 6px rgba(63, 208, 232, .7);
}

.topbar-actions { display: flex; align-items: center; gap: 9px; }

/* 作业仓：HUD selector */
.warehouse-picker {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px;
  border: 1px solid var(--shell-line-2); border-radius: 8px;
  background: rgba(13, 36, 64, .6);
  transition: border-color .15s ease;
}
.warehouse-picker:hover, .warehouse-picker:focus-within {
  border-color: rgba(63, 208, 232, .45);
}
.warehouse-picker span {
  color: var(--shell-dim-2); font-size: 9.5px;
  font-weight: 700; letter-spacing: .16em;
}
.warehouse-picker select {
  border: 0; outline: 0; cursor: pointer;
  color: var(--shell-cyan); background: transparent;
  font-weight: 700; font-size: 13px;
}
.warehouse-picker select option { color: var(--ink); background: #fff; }

.icon-button {
  position: relative;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border: 1px solid var(--shell-line-2); border-radius: 8px;
  background: rgba(13, 36, 64, .6);
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.icon-button:hover { border-color: rgba(63, 208, 232, .45); background: rgba(63, 208, 232, .08); }
.icon-button svg { stroke: var(--shell-dim); width: 16px; height: 16px; }
.icon-button:hover svg { stroke: var(--shell-cyan); }
.icon-button i {
  position: absolute; top: 6px; right: 6px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--shell-amber);
  border: 2px solid #0a1c31;
  box-shadow: 0 0 6px rgba(245, 181, 68, .7);
}

/* 账号：紧凑 chip，不占大面积 */
.account-button {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 9px 4px 4px;
  border: 1px solid var(--shell-line-2); border-radius: 8px;
  background: rgba(13, 36, 64, .6);
  text-align: left; cursor: pointer;
  transition: border-color .15s ease;
}
.account-button:hover { border-color: rgba(63, 208, 232, .45); }
.operator-avatar {
  width: 26px; height: 26px;
  display: grid; place-items: center; border-radius: 6px;
  color: #04202b; font-weight: 800; font-size: 12px;
  background: linear-gradient(145deg, var(--shell-cyan), #1a9fba);
}
.account-copy { display: grid; gap: 1px; }
.account-copy strong { color: var(--shell-text); font-size: 12px; font-weight: 700; }
.account-copy small {
  color: var(--shell-dim-2); font-size: 9px;
  letter-spacing: .14em; text-transform: uppercase;
}

/* 顶栏里的「退出」不能沿用浅色主按钮样式 */
.topbar .button.small {
  border: 1px solid var(--shell-line-2);
  background: rgba(13, 36, 64, .6);
  color: var(--shell-dim);
  box-shadow: none;
}
.topbar .button.small:hover {
  border-color: rgba(255, 107, 107, .45);
  color: var(--shell-red);
  background: rgba(255, 107, 107, .08);
}

.mobile-menu { display: none; width: 36px; padding: 8px; border: 0; background: transparent; }
.mobile-menu span { display: block; height: 2px; margin: 4px 0; background: var(--shell-dim); border-radius: 1px; }


.content { max-width: 1480px; margin: 0 auto; padding: 26px 32px 48px; }
.page-intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 0 0 20px; }
.page-intro h2 { margin: 0 0 6px; font-size: 19px; }
.page-intro p { max-width: 720px; margin: 0; color: var(--muted); line-height: 1.65; }
.intro-actions { flex: 0 0 auto; display: flex; gap: 9px; }
.button { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 14px; border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--ink); font-weight: 700; cursor: pointer; transition: .16s ease; }
.button:hover { transform: translateY(-1px); box-shadow: 0 6px 14px rgba(20,40,34,.08); }
.button.primary { color: white; border-color: var(--teal); background: var(--teal); }
.button.orange { color: white; border-color: var(--orange); background: var(--orange); }
.button.ghost { background: transparent; }
.button.small { min-height: 31px; padding: 0 10px; border-radius: 8px; font-size: 12px; }
.button:disabled { cursor: default; opacity: .55; transform: none; box-shadow: none; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.metric-card { position: relative; overflow: hidden; min-height: 126px; padding: 18px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--card); box-shadow: 0 2px 9px rgba(22,40,34,.035); }
.metric-card::after { content: ""; position: absolute; width: 70px; height: 70px; right: -24px; bottom: -28px; border-radius: 50%; background: var(--metric-soft, var(--teal-soft)); }
.metric-head { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 12px; }
.metric-head span:last-child { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: var(--metric, var(--teal)); background: var(--metric-soft, var(--teal-soft)); }
.metric-value { margin-top: 12px; font-size: 29px; font-weight: 800; letter-spacing: -.04em; }
.metric-foot { margin-top: 4px; color: var(--muted-2); font-size: 11px; }
.metric-foot strong { color: var(--metric, var(--teal)); }
.metric-card.orange { --metric: var(--orange); --metric-soft: var(--orange-soft); }
.metric-card.red { --metric: var(--red); --metric-soft: var(--red-soft); }
.metric-card.blue { --metric: var(--blue); --metric-soft: var(--blue-soft); }

.layout-2 { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(310px, .72fr); gap: 18px; }
.layout-2.equal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stack { display: grid; gap: 18px; align-content: start; }
.panel { border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--card); box-shadow: 0 2px 9px rgba(22,40,34,.035); }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 17px 18px; border-bottom: 1px solid var(--line-soft); }
.panel-header h3 { margin: 0; font-size: 15px; }
.panel-header p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.panel-body { padding: 18px; }
.panel-link { border: 0; color: var(--teal); background: none; font-size: 12px; font-weight: 700; cursor: pointer; }

.module-list { display: grid; gap: 10px; }
.module-row { display: grid; grid-template-columns: 43px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 12px; background: #fbfcfb; cursor: pointer; transition: .16s ease; }
.module-row:hover { border-color: #c9d8d2; transform: translateY(-1px); }
.module-symbol { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 11px; color: var(--teal); background: var(--teal-soft); }
.module-symbol.orange { color: var(--orange); background: var(--orange-soft); }
.module-symbol.blue { color: var(--blue); background: var(--blue-soft); }
.module-row strong { display: block; }
.module-row small { display: block; margin-top: 4px; color: var(--muted); }
.module-count { text-align: right; }
.module-count b { display: block; font-size: 19px; }
.module-count span { color: var(--muted-2); font-size: 10px; }

.occupancy-wrap { display: grid; grid-template-columns: 125px 1fr; align-items: center; gap: 18px; }
.donut { width:116px; aspect-ratio:1; display:grid; place-items:center; position:relative; }
.donut svg { position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.donut circle { fill:none; stroke-width:12; }
.donut-track { stroke:#e6ece8; }
.donut-progress { stroke:var(--teal); stroke-linecap:round; }
.donut div { position:relative; text-align:center; }
.donut b { display:block; font-size:23px; }
.donut span { color:var(--muted); font-size:10px; }
.legend { display: grid; gap: 10px; }
.legend-row { display: grid; grid-template-columns: 9px 1fr auto; align-items: center; gap: 8px; font-size: 11px; }
.legend-dot { width: 8px; height: 8px; border-radius: 2px; background: var(--teal); }
.legend-dot.empty { background:#dce5e0; }
.legend-dot.orange { background:var(--orange); }
.legend-row span:nth-child(2) { color: var(--muted); }

.alert-list { display: grid; gap: 11px; }
.alert-row { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 10px; }
.alert-mark { width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px var(--orange-soft); }
.alert-row.success .alert-mark { background: var(--teal); box-shadow: 0 0 0 4px var(--teal-soft); }
.alert-row.info .alert-mark { background: var(--blue); box-shadow: 0 0 0 4px var(--blue-soft); }
.alert-row strong { display: block; font-size: 12px; }
.alert-row small { display: block; margin-top: 3px; color: var(--muted); line-height: 1.45; }
.alert-row time { color: var(--muted-2); font-size: 10px; }

.toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin-bottom: 14px; }
.search-box { position: relative; flex: 1 1 260px; min-width: 210px; }
.search-box span { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--muted-2); }
.search-box input { width: 100%; height: 39px; padding: 0 12px 0 38px; border: 1px solid var(--line); border-radius: 10px; outline: none; background: white; }
.search-box input:focus { border-color: #85b5a8; box-shadow: 0 0 0 3px rgba(12,125,105,.08); }
.select-control { height: 39px; min-width: 120px; padding: 0 30px 0 11px; border: 1px solid var(--line); border-radius: 10px; outline: none; background: white; cursor: pointer; }
.range-control { display: flex; align-items: center; gap: 7px; height: 39px; padding: 0 9px 0 11px; border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--muted); font-size: 11px; }
.range-control select { border: 0; outline: 0; color: var(--ink); background: transparent; font-weight: 800; }

.tabs { display: flex; gap: 3px; padding: 4px; border-radius: 11px; background: #e9eeeb; }
.tab { min-height: 32px; padding: 0 12px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 12px; font-weight: 700; cursor: pointer; }
.tab.active { color: var(--ink); background: white; box-shadow: 0 2px 6px rgba(23,35,33,.08); }

.table-panel { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: white; }
.table-wrap { overflow: auto; max-height: calc(100vh - 335px); min-height: 280px; }
table { width: 100%; border-collapse: separate; border-spacing: 0; }
th { position: sticky; top: 0; z-index: 2; padding: 11px 13px; color: #68736f; background: #f7f9f7; border-bottom: 1px solid var(--line); font-size: 10px; letter-spacing: .04em; text-align: left; white-space: nowrap; }
td { padding: 12px 13px; border-bottom: 1px solid var(--line-soft); vertical-align: middle; }
tbody tr { cursor: pointer; transition: background .12s ease; }
tbody tr:hover { background: #f8fbf9; }
tbody tr.completed { opacity: .55; background: #f7f8f7; }
tbody tr:last-child td { border-bottom: 0; }
.sku-cell strong { display: block; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.sku-cell small { display: block; max-width: 260px; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 10px; }
.location-code { display: inline-flex; align-items: center; min-height: 25px; padding: 0 7px; border: 1px solid #cdd8d3; border-radius: 6px; color: #244c42; background: #f4f8f6; font-family: Consolas, monospace; font-size: 11px; white-space: nowrap; }
.location-arrow { display: inline-block; margin: 0 6px; color: var(--muted-2); }
.qty-main { font-size: 16px; font-weight: 800; }
.qty-sub { display: block; color: var(--muted); font-size: 10px; }
.badge { display: inline-flex; align-items: center; min-height: 23px; padding: 0 8px; border-radius: 999px; font-size: 10px; font-weight: 800; white-space: nowrap; }
.badge.urgent, .badge.low { color: var(--red); background: var(--red-soft); }
.badge.high { color: #b75d1d; background: var(--orange-soft); }
.badge.medium { color: var(--yellow); background: var(--yellow-soft); }
.badge.success, .badge.a, .badge.conf-high { color: var(--teal-dark); background: var(--teal-soft); }
.badge.b, .badge.conf-medium { color: var(--blue); background: var(--blue-soft); }
.badge.c { color: #6f7774; background: #edf0ee; }
.badge.info { color: var(--blue); background: var(--blue-soft); }
.trend-up { color: var(--red); font-weight: 800; }
.trend-down { color: var(--teal); font-weight: 800; }
.table-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 14px; border-top: 1px solid var(--line); color: var(--muted); background: #fbfcfb; font-size: 11px; }
.empty-state { min-height: 260px; display: grid; place-items: center; text-align: center; color: var(--muted); }
.empty-state b { display: block; margin-bottom: 5px; color: var(--ink); }

.order-banner { display: grid; grid-template-columns: 1.35fr repeat(4, minmax(90px, .45fr)); gap: 16px; align-items: center; padding: 19px; margin-bottom: 17px; border-radius: var(--radius); color: white; background: linear-gradient(120deg, #1d332d, #0d7765); box-shadow: var(--shadow); }
.order-banner .order-title small { display: block; color: #a9d1c6; font-size: 10px; letter-spacing: .08em; }
.order-banner .order-title strong { display: block; margin-top: 5px; font-size: 18px; }
.order-stat span { display: block; color: #a9d1c6; font-size: 10px; }
.order-stat b { display: block; margin-top: 4px; font-size: 17px; }

.flow-strip { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 12px; background: #fbfcfb; }
.flow-box { min-width: 0; }
.flow-box span { display: block; color: var(--muted); font-size: 10px; }
.flow-box strong { display: block; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; font-family: Consolas, monospace; white-space: nowrap; }
.flow-arrow { color: var(--orange); }

.source-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.source-card { padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: white; }
.source-card-head { display: flex; align-items: start; justify-content: space-between; gap: 8px; }
.source-card strong { display: block; }
.source-card code { display: block; margin-top: 7px; overflow: hidden; text-overflow: ellipsis; color: var(--muted); font-size: 10px; white-space: nowrap; }
.source-card-foot { display: flex; justify-content: space-between; margin-top: 15px; padding-top: 11px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 10px; }
.quality-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.quality-card { display: flex; gap: 11px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 12px; background: #fbfcfb; }
.quality-symbol { flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: var(--blue); background: var(--blue-soft); }
.quality-card.warning .quality-symbol { color: var(--orange); background: var(--orange-soft); }
.quality-card.success .quality-symbol { color: var(--teal); background: var(--teal-soft); }
.quality-card strong { display: block; font-size: 12px; }
.quality-card p { margin: 4px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.rule-table td:first-child { font-weight: 800; }
.rule-table td:last-child { color: var(--muted); }

.drawer-overlay { position: fixed; inset: 0; z-index: 80; display: flex; justify-content: flex-end; background: rgba(12,21,18,.38); opacity: 0; visibility: hidden; transition: .2s ease; }
.drawer-overlay.open { opacity: 1; visibility: visible; }
.drawer { width: min(510px, 94vw); height: 100%; overflow: auto; padding: 29px 26px 40px; background: white; box-shadow: -18px 0 60px rgba(10,25,20,.2); transform: translateX(24px); transition: .2s ease; }
.drawer-overlay.open .drawer { transform: none; }
.drawer-close { float: right; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--muted); font-size: 22px; cursor: pointer; }
.drawer-kicker { color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.drawer h2 { margin: 9px 50px 5px 0; font-size: 21px; }
.drawer .drawer-sub { margin: 0 0 21px; color: var(--muted); }
.detail-section { margin-top: 20px; }
.detail-section h4 { margin: 0 0 10px; font-size: 12px; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.detail-item { padding: 11px; border: 1px solid var(--line-soft); border-radius: 10px; background: #fbfcfb; }
.detail-item span { display: block; color: var(--muted); font-size: 9px; }
.detail-item strong { display: block; margin-top: 5px; font-size: 13px; }
.reason-box { padding: 13px; border-left: 3px solid var(--teal); border-radius: 0 10px 10px 0; color: #35524a; background: var(--teal-soft); line-height: 1.65; }
.reason-box.warning { border-color: var(--orange); color: #725139; background: var(--orange-soft); }
.bar-chart { display: grid; gap: 10px; }
.bar-row { display: grid; grid-template-columns: 48px 1fr 42px; align-items: center; gap: 8px; font-size: 10px; }
.bar-track { height:8px; overflow:hidden; border-radius:99px; background:#e8edea; }
.bar-fill { height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--teal),#4ab49f); }
.bar-progress { width:100%; height:8px; border:0; border-radius:99px; overflow:hidden; appearance:none; background:#e8edea; }
.bar-progress::-webkit-progress-bar { border-radius:99px; background:#e8edea; }
.bar-progress::-webkit-progress-value { border-radius:99px; background:linear-gradient(90deg,var(--teal),#4ab49f); }
.bar-progress::-moz-progress-bar { border-radius:99px; background:linear-gradient(90deg,var(--teal),#4ab49f); }
.flag-list { display: flex; flex-wrap: wrap; gap: 7px; }
.drawer-actions { display: flex; gap: 9px; margin-top: 24px; }
.drawer-actions .button { flex: 1; }

.toast-stack { position: fixed; z-index: 120; right: 22px; bottom: 22px; display: grid; gap: 8px; }
.toast { min-width: 240px; padding: 12px 14px; border-radius: 10px; color: white; background: #20302b; box-shadow: 0 12px 30px rgba(10,25,20,.2); animation: toast-in .2s ease; }
.toast.success { background: var(--teal-dark); }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

@media (max-width: 1120px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .layout-2 { grid-template-columns: 1fr; }
  .source-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .order-banner { grid-template-columns: 1.4fr repeat(2, 1fr); }
}

@media (max-width: 760px) {
  /* PDA 上侧栏必须是**脱离文档流**的抽屉。
     原来只写了 transform: translateX(-100%) —— transform 只是画到别处，
     不改变布局：侧栏仍然是 position:relative + min-height:100vh，照旧在
     主体上方占掉整整一屏。现场看到的就是顶部一大片空白、作业内容被顶下去，
     要点开菜单才看得到模块。改成 fixed 之后它彻底不占位。 */
  .app-shell { display: block; }
  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 60;
    width: min(284px, 84vw);
    min-height: 0;                  /* 盖掉基础规则里的 100vh，高度交给 inset */
    overflow-y: auto;
    overscroll-behavior: contain;   /* 抽屉滑到底不要带着整页一起滚 */
    transform: translateX(-100%);
    transition: transform .22s ease;
  }
  body.menu-open .sidebar {
    transform: none;
    box-shadow: 18px 0 44px rgba(2, 10, 22, .55);
  }
  .nav-scrim {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 55;
    background: rgba(3, 12, 24, .55);
    opacity: 0;
    visibility: hidden;
    transition: opacity .22s ease, visibility .22s ease;
  }
  body.menu-open .nav-scrim { opacity: 1; visibility: visible; }
  body.menu-open { overflow: hidden; }   /* 抽屉开着时底下不跟着滚 */

  .main-shell { min-width: 0; }
  .topbar { height: 58px; padding: 0 14px; }   /* 窄屏把纵向空间还给作业内容 */
  .mobile-menu { display: block; }
  .eyebrow, .operator-avatar { display: none; }
  .topbar-title h1 { font-size: 19px; }
  .warehouse-picker span { display: none; }
  .content { padding: 18px 14px 36px; }
  .page-intro { align-items: start; flex-direction: column; }
  .intro-actions { width: 100%; }
  .intro-actions .button { flex: 1; }
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .metric-card { min-height: 114px; padding: 14px; }
  .metric-value { font-size: 24px; }
  .layout-2.equal, .quality-grid { grid-template-columns: 1fr; }
  .source-grid { grid-template-columns: 1fr; }
  .order-banner { grid-template-columns: 1fr 1fr; }
  .order-title { grid-column: 1 / -1; }
  .tabs { width: 100%; overflow-x: auto; }
  .tab { flex: 1; white-space: nowrap; }
  .table-wrap { max-height: none; }
  .drawer { padding: 24px 18px 34px; }
}

@media (max-width: 430px) {
  .metric-grid { grid-template-columns: 1fr; }
  .topbar-actions { gap: 6px; }
  .icon-button { display: none; }
  .order-banner { grid-template-columns: 1fr 1fr; }
}

/* Multi-user shell */
.account-button { display:flex; align-items:center; gap:9px; padding:0; border:0; background:transparent; text-align:left; }
.account-copy { display:grid; line-height:1.15; }
.account-copy strong { font-size:13px; }
.account-copy small { margin-top:3px; color:var(--muted); font-size:11px; }
.operator-avatar { display:grid; place-items:center; flex:0 0 auto; }
.permission-note { display:flex; align-items:flex-start; gap:10px; padding:12px 14px; border:1px solid #c8ddd7; border-radius:11px; color:#255249; background:#edf7f4; font-size:13px; line-height:1.55; }
.permission-note.warning { border-color:#edd0b6; color:#75451f; background:#fff5eb; }
.upload-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.file-field { display:grid; gap:6px; padding:13px; border:1px dashed #bac8c3; border-radius:11px; background:#fafcfb; }
.file-field span { font-weight:800; font-size:13px; }
.file-field small { color:var(--muted); }
.file-field input { width:100%; font-size:12px; }
.upload-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:14px; }
.upload-progress { color:var(--muted); font-size:13px; }
.admin-grid { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr); gap:18px; }
.compact-form { display:grid; gap:12px; }
.compact-form label { display:grid; gap:6px; font-size:12px; font-weight:800; }
.compact-form input,.compact-form select { min-height:40px; padding:0 10px; border:1px solid var(--line); border-radius:9px; background:white; }
.operation-rule-grid { grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); align-items:end; }
.operation-rule-grid .button { min-height:40px; }
.status-pill { display:inline-flex; align-items:center; min-height:25px; padding:0 9px; border-radius:999px; color:#276052; background:#e1f1ec; font-size:11px; font-weight:800; }
.status-pill.off { color:#7c4c2d; background:#f8e8dc; }
.data-version { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.location-rule-toolbar { margin-bottom:12px; padding:0; border:0; background:transparent; }
.location-filter-label { display:grid; gap:4px; color:var(--muted); font-size:10px; font-weight:800; }
.location-filter-label select { min-height:38px; padding:0 9px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.location-size-filter > span,.location-batch-size > span { display:grid; grid-template-columns:repeat(3,58px); gap:5px; }
.location-size-filter input { min-width:0; width:58px; min-height:38px; padding:0 6px; border:1px solid var(--line); border-radius:8px; background:#fff; text-align:right; }
.location-batch-bar {
  display:flex; flex-wrap:wrap; align-items:end; gap:9px; margin:0 0 12px; padding:11px;
  border:1px solid #cbdde9; border-radius:11px; background:#f3f8fc;
}
.location-batch-bar > strong { align-self:center; margin-right:3px; color:#174b79; font-size:12px; }
.location-batch-bar label { display:grid; gap:4px; color:#607388; font-size:10px; font-weight:800; }
.location-batch-bar input,.location-batch-bar select { min-width:105px; min-height:35px; padding:0 8px; border:1px solid #cad8e4; border-radius:7px; background:#fff; }
.location-batch-bar .location-batch-size input { min-width:0; width:58px; text-align:right; }
.location-rule-table { max-height:520px; min-height:220px; border:1px solid var(--line); border-radius:11px; }
.location-rule-table th { white-space:nowrap; }
.location-rule-table td { min-width:86px; }
.location-rule-table td:nth-child(2) { min-width:185px; }
.location-rule-table td:nth-child(3) { min-width:145px; }
.location-rule-table td:nth-child(4) { min-width:130px; }
.location-check-cell { min-width:44px!important; width:44px; text-align:center; }
.location-check-cell input { width:17px; height:17px; accent-color:#0b58a2; }
.location-pagination { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 2px 0; color:var(--muted); font-size:12px; }
.location-pagination > div { display:flex; flex-wrap:wrap; gap:6px; }
.is-loading-soft { opacity:.7; transition:opacity .15s ease; }
.rule-cell-input { width:100%; min-width:82px; height:34px; padding:0 8px; border:1px solid #cad4d0; border-radius:7px; background:white; font-size:12px; }
.rule-cell-input.number { min-width:72px; text-align:right; }
.rule-cell-input:focus { border-color:var(--teal); outline:none; box-shadow:0 0 0 2px rgba(24,113,99,.09); }
.rule-cell-input:disabled { color:#6d7a76; background:#f2f4f3; }
.location-rule-table tr.rule-dirty td { background:#fff8ef; }

/* Login */
.login-body { min-height:100vh; overflow:auto; background:#eef2ef; }
.login-layout { min-height:100vh; display:grid; grid-template-columns:minmax(390px,1.08fr) minmax(420px,.92fr); }
.login-story { position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; min-height:100vh; padding:52px clamp(38px,6vw,90px); color:white; background:linear-gradient(145deg,#0e332d,#18594f); }
.login-story::after { content:""; position:absolute; width:540px; height:540px; right:-190px; bottom:-190px; border:90px solid rgba(255,255,255,.055); border-radius:50%; }
.login-brand { position:relative; z-index:1; padding:0; color:white; }
.login-story-copy { position:relative; z-index:1; max-width:650px; }
.login-story-copy .eyebrow { color:#9ed0c4; }
.login-story-copy h1 { max-width:620px; margin:14px 0 20px; font-size:clamp(38px,5vw,68px); line-height:1.08; letter-spacing:-.045em; }
.login-story-copy p { max-width:560px; margin:0; color:#cae1db; font-size:17px; line-height:1.8; }
.login-points { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:9px; }
.login-points span { padding:8px 12px; border:1px solid rgba(255,255,255,.18); border-radius:999px; color:#dcebe7; background:rgba(255,255,255,.06); font-size:12px; }
.login-panel { display:grid; place-items:center; min-height:100vh; padding:36px; }
.login-card { width:min(430px,100%); display:grid; gap:20px; padding:40px; border:1px solid rgba(200,211,206,.8); border-radius:18px; background:white; box-shadow:0 22px 65px rgba(28,54,46,.10); }
.login-card h2 { margin:7px 0 7px; font-size:30px; letter-spacing:-.03em; }
.login-card p { margin:0; color:var(--muted); }
.login-kicker { color:var(--orange); font-size:11px; font-weight:900; letter-spacing:.16em; }
.login-card label { display:grid; gap:7px; color:#334a43; font-size:13px; font-weight:800; }
.login-card input { min-height:48px; padding:0 13px; border:1px solid #c9d2ce; border-radius:10px; outline:none; }
.login-card input:focus { border-color:var(--teal); box-shadow:0 0 0 3px rgba(24,113,99,.1); }
.login-submit { min-height:48px; width:100%; }
.login-error { min-height:18px; color:#a53c32; font-size:13px; }
.login-help { color:var(--muted); line-height:1.5; text-align:center; }

@media (max-width: 900px) {
  .account-copy { display:none; }
  .admin-grid { grid-template-columns:1fr; }
  .login-layout { grid-template-columns:1fr; }
  .login-story { min-height:330px; padding:34px 28px; }
  .login-story-copy h1 { font-size:38px; }
  .login-story-copy p { display:none; }
  .login-panel { min-height:auto; padding:28px 18px 48px; }
}
@media (max-width: 620px) {
  .upload-grid { grid-template-columns:1fr; }
  .upload-actions { align-items:stretch; flex-direction:column; }
  .upload-actions .button { width:100%; }
  #logout-button { padding:0 8px; }
  .login-card { padding:28px 22px; }
  .account-button .operator-avatar { display:grid; }
}

/* Slotting routes + packing assistant */
.slot-category-grid { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); gap:9px; margin:0 0 14px; }
.slot-category { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:48px; padding:0 13px; border:1px solid var(--line); border-radius:10px; color:#31544b; background:white; cursor:pointer; }
.slot-category span { font-size:12px; font-weight:800; }
.slot-category b { display:grid; place-items:center; min-width:26px; height:26px; padding:0 6px; border-radius:999px; color:#176354; background:#e3f2ee; font-size:12px; }
.slot-category:hover,.slot-category.active { border-color:#61a596; background:#edf7f4; box-shadow:0 4px 16px rgba(27,84,70,.08); }
.conflict-row { display:flex; justify-content:space-between; gap:18px; padding:11px 0; border-bottom:1px solid var(--line); font-size:12px; }
.conflict-row:last-child { border-bottom:0; }
.conflict-row span { color:#945026; text-align:right; }
.packing-tabs { min-width:260px; }
.packing-workbench { margin-top:16px; }
.packing-order-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.packing-order-grid label,.packing-item-row label,.packing-choice-grid label { display:grid; gap:6px; color:#405a53; font-size:11px; font-weight:800; }
.packing-order-grid input,.packing-item-row input,.packing-choice-grid input,.packing-choice-grid select { width:100%; min-height:40px; padding:0 10px; border:1px solid var(--line); border-radius:9px; background:white; outline:none; }
.packing-order-grid input:focus,.packing-item-row input:focus,.packing-choice-grid input:focus,.packing-choice-grid select:focus { border-color:var(--teal); box-shadow:0 0 0 3px rgba(24,113,99,.08); }
.packing-item-row { display:grid; grid-template-columns:32px minmax(220px,2fr) 80px repeat(3,minmax(86px,.7fr)) 36px; align-items:end; gap:9px; padding:10px 0; border-bottom:1px solid #edf0ef; }
.packing-line { display:grid; place-items:center; width:28px; height:28px; margin-bottom:6px; border-radius:8px; color:#176354; background:#e8f3f0; font-size:11px; font-weight:900; }
.packing-item-row [data-pack-remove] { width:36px; min-width:36px; margin-bottom:2px; padding:0; font-size:18px; }
.packing-result { display:grid; grid-template-columns:220px minmax(0,1fr); gap:22px; align-items:center; margin-top:18px; padding:22px; border:1px solid #b9d9d1; border-radius:14px; background:linear-gradient(135deg,#f4fbf9,#fff); box-shadow:0 12px 34px rgba(30,85,72,.08); }
.packing-result.error { border-color:#ebc5bf; background:#fff6f4; }
.packing-result h3 { margin:8px 0 6px; font-size:24px; }
.packing-result p { margin:0; color:var(--muted); }
.packing-box-visual { display:grid; place-items:center; min-height:150px; padding:20px; border-radius:12px; color:white; text-align:center; background:linear-gradient(145deg,#165e52,#238171); }
.packing-box-visual span svg { width:48px; height:48px; }
.packing-box-visual small { margin-top:8px; color:#cde6e0; }
.packing-box-visual strong { margin-top:3px; font-size:23px; }
.packing-choice-grid { display:grid; grid-template-columns:1fr 1fr 1.2fr auto; align-items:end; gap:10px; margin-top:17px; }
.packing-choice-grid .button { min-height:40px; white-space:nowrap; }
.hidden { display:none !important; }

@media (max-width: 1100px) {
  .slot-category-grid { grid-template-columns:repeat(3,1fr); }
  .packing-item-row { grid-template-columns:28px minmax(190px,2fr) 72px repeat(3,minmax(76px,.7fr)) 36px; }
  .packing-choice-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 760px) {
  .slot-category-grid { grid-template-columns:repeat(2,1fr); }
  .packing-order-grid { grid-template-columns:1fr; }
  .packing-item-row { grid-template-columns:28px 1fr 72px 36px; }
  .packing-item-row label:nth-of-type(n+3) { display:none; }
  .packing-result { grid-template-columns:1fr; }
  .packing-choice-grid { grid-template-columns:1fr; }
}

/* ========================================================================== */
/* 枫筝国际 v3 · 品牌、智能打包、包材管理与收分货                         */
/* ========================================================================== */
:root {
  --ink:#14233a;
  --muted:#657389;
  --muted-2:#8b97a8;
  --paper:#f2f5f9;
  --line:#d8e1ec;
  --line-soft:#e8edf4;
  --sidebar:#062f70;
  --sidebar-2:#041f4c;
  --teal:#0b58a2;
  --teal-dark:#073b79;
  --teal-soft:#e3eefb;
  --blue:#0a4b91;
  --blue-soft:#e5eef9;
  --orange:#d93636;
  --orange-soft:#fdeaea;
  --red:#c92f35;
  --red-soft:#fce8ea;
  --shadow:0 14px 38px rgba(6,47,112,.08);
}
body { background:linear-gradient(180deg,#f7f9fc 0,#f1f5fa 100%); }
/* 这一段原来是亮蓝 Sidebar + 红线 active + 紫红 Badge。
   2026-09-05 全系统改成 Dark Warehouse OS Shell，配色统一收敛到文件
   开头那一套 --shell-* 变量里，这里不再二次覆盖 —— 留着只会形成
   「改了开头却不生效」的覆盖链。 */

.company-brand { gap:10px; align-items:center; }
.brand-monogram {
  position:relative; flex:0 0 auto; width:46px; height:42px; display:grid; place-items:center;
  border-radius:10px; color:#fff; background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.20); font-size:28px; font-weight:1000; font-style:italic;
  letter-spacing:-.14em; padding-right:4px; box-shadow:0 8px 24px rgba(0,0,0,.15);
}
.brand-monogram::after {
  content:""; position:absolute; right:4px; bottom:5px; width:0; height:0;
  border-left:8px solid transparent; border-right:8px solid transparent; border-bottom:13px solid #e43c3f;
  transform:rotate(30deg);
}
.brand-wordmark { min-width:0; line-height:1.05; }
.brand-wordmark strong { color:#fff; font-size:22px; font-style:italic; font-weight:1000; letter-spacing:.055em; }
.brand-wordmark span { display:block; margin-top:4px; color:#fff; font-size:16px; font-weight:900; letter-spacing:.04em; }
.brand-wordmark small { margin-top:4px; color:#a9c2e4; font-size:8.5px; letter-spacing:.08em; white-space:nowrap; }
.sidebar .company-brand { padding:0 5px 26px; }

/* 顶栏配色统一在 shell 段落定义，这里不再覆盖成浅色 */
.topbar-title { min-width:0; }
.topbar-company { display:block; color:#073b79; font-size:13px; font-weight:1000; letter-spacing:.065em; }
.topbar-company em { margin-left:7px; color:#d73338; font-style:normal; font-size:13px; letter-spacing:.04em; }
/* h1 颜色由 shell 段落统一给（深色栏上的高亮白） */
/* 头像配色统一在 shell 段落定义 */
.button.primary { border-color:#0b58a2; background:linear-gradient(135deg,#0b58a2,#073b79); }
.button.orange { border-color:#d73338; background:#d73338; }
.panel-link { color:#0b58a2; }
.panel,.metric-card,.table-panel { box-shadow:0 3px 14px rgba(6,47,112,.045); }

.brand-hero {
  position:relative; overflow:hidden; min-height:360px; display:flex; align-items:center;
  margin:0 0 24px; padding:42px clamp(26px,4vw,62px); border-radius:22px;
  background-color:#07377e;
  background-image:
    linear-gradient(90deg,rgba(4,35,83,.98) 0%,rgba(6,53,118,.93) 39%,rgba(6,53,118,.42) 64%,rgba(6,53,118,.05) 100%),
    url('/static/fengzheng-logistics.jpg');
  background-repeat:no-repeat;
  background-position:center,right center;
  background-size:100% 100%,auto 100%;
  box-shadow:0 22px 55px rgba(5,43,101,.23);
}
.brand-hero::after { content:""; position:absolute; inset:auto 0 0; height:5px; background:linear-gradient(90deg,#e33b3e 0 17%,#fff 17% 23%,transparent 23%); opacity:.95; }
.brand-hero-copy { position:relative; z-index:1; max-width:620px; color:#fff; text-shadow:0 2px 18px rgba(0,0,0,.20); }
.brand-hero-copy > span { display:block; font-size:clamp(42px,5vw,72px); line-height:.98; font-weight:1000; font-style:italic; letter-spacing:.06em; }
.brand-hero-copy > strong { display:block; margin-top:12px; font-size:clamp(28px,3vw,47px); line-height:1; letter-spacing:.08em; }
.brand-hero-copy > small { display:block; margin-top:12px; color:#d8e8ff; font-size:12px; font-weight:800; letter-spacing:.16em; }
.brand-hero-copy > p { max-width:540px; margin:24px 0 0; color:#f2f6fc; font-size:17px; line-height:1.75; }

/* 登录页：直接使用用户提供的枫筝国际头程物流图 */
.login-body { background:#edf2f8; }
.login-story {
  isolation:isolate;
  background-image:
    linear-gradient(145deg,rgba(3,29,70,.92),rgba(5,55,123,.70) 55%,rgba(3,28,67,.82)),
    url('/static/fengzheng-logistics.jpg');
  background-position:center;
  background-size:cover;
  box-shadow:inset -1px 0 rgba(255,255,255,.18);
}
.login-story::after { display:none; }
.login-story::before { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(2,20,50,.22),transparent 38%,rgba(2,20,50,.56)); }
.login-brand .brand-monogram { width:58px; height:52px; font-size:35px; background:rgba(255,255,255,.13); }
.login-brand .brand-wordmark strong { font-size:29px; }
.login-brand .brand-wordmark span { font-size:21px; }
.login-brand .brand-wordmark small { color:#d6e6fb; font-size:10px; }
.login-story-copy .eyebrow { color:#f0b7b8; font-weight:900; }
.login-story-copy h1 { text-shadow:0 4px 24px rgba(0,0,0,.28); }
.login-story-copy p { color:#e7f0fc; }
.login-points span { color:#fff; background:rgba(7,47,106,.46); backdrop-filter:blur(7px); }
.login-panel { background:linear-gradient(160deg,#f8fafc,#edf3fa); }
.login-card { border-color:#d6e0ec; box-shadow:0 24px 70px rgba(6,47,112,.13); }
.login-kicker { color:#d73338; }
.login-card input:focus { border-color:#0b58a2; box-shadow:0 0 0 3px rgba(11,88,162,.10); }

/* 智能打包 */
.packing-tabs { min-width:310px; }
.scan-workbench { overflow:hidden; border-color:#c8d8ea; }
.scan-workbench .panel-header { background:linear-gradient(90deg,#f4f8fd,#fff); }
.packing-scan-form { display:grid; grid-template-columns:minmax(240px,1fr) minmax(240px,1fr) auto; align-items:end; gap:16px; }
.packing-scan-form label { display:grid; gap:8px; color:#263b58; font-size:12px; font-weight:900; }
.packing-scan-form input {
  width:100%; height:58px; padding:0 16px; border:2px solid #c7d6e8; border-radius:12px;
  color:#102544; background:#fff; outline:none; font-size:18px; font-weight:800; letter-spacing:.02em;
}
.packing-scan-form input:focus { border-color:#0b58a2; box-shadow:0 0 0 4px rgba(11,88,162,.10); }
.scan-submit { min-height:58px; padding-inline:23px; }
.scan-result { align-items:stretch; border-color:#b9cee6; background:linear-gradient(135deg,#f2f7fd,#fff); }
.packing-box-visual { min-height:220px; background:linear-gradient(145deg,#0a4f98,#062f70); box-shadow:inset 0 0 0 1px rgba(255,255,255,.10); }
.packing-box-visual em { margin-top:8px; color:#cfe2fb; font-size:12px; font-style:normal; }
.packing-result-copy { min-width:0; }
.matched-order-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:17px 0; }
.matched-order-summary > div { padding:12px; border:1px solid #dbe5f0; border-radius:10px; background:#f8fbff; }
.matched-order-summary span { display:block; color:var(--muted); font-size:10px; }
.matched-order-summary strong { display:block; margin-top:5px; color:#12335c; font-size:15px; }
.compact-table { max-height:260px; min-height:0; margin-top:14px; border:1px solid var(--line); border-radius:10px; }
.scan-choice-grid { grid-template-columns:minmax(230px,1fr) minmax(220px,1.2fr) auto; }
.packing-upload-panel { margin-bottom:18px; }
.one-line-upload { grid-template-columns:1fr; }
.packing-import-metrics { margin-top:0; }
.packing-format-guide { display:flex; align-items:center; gap:10px; margin-top:12px; padding:12px 14px; border:1px solid #d8e5f2; border-radius:11px; background:#f6faff; }
.packing-format-guide > div { min-width:0; flex:1 1 0; }
.packing-format-guide b,.packing-format-guide span { display:block; }
.packing-format-guide b { color:#17375f; font-size:11px; }
.packing-format-guide span { margin-top:3px; color:#718198; font-size:9px; line-height:1.45; }
.packing-format-guide i { flex:0 0 auto; color:#0b58a2; font-size:17px; font-style:normal; font-weight:1000; }
.packing-detection-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:-5px 0 16px; padding:10px; border:1px solid #dce6f0; border-radius:12px; background:#fff; }
.packing-detection-strip > div { padding:9px 11px; border-radius:9px; background:#f5f8fb; }
.packing-detection-strip span,.packing-detection-strip strong { display:block; }
.packing-detection-strip span { color:#8592a1; font-size:8px; font-weight:800; }
.packing-detection-strip strong { margin-top:4px; overflow:hidden; color:#24415f; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.pack-log-filter { align-items:end; }
.filter-fields { display:flex; flex:1 1 600px; flex-wrap:wrap; gap:10px; }
.filter-fields label { display:grid; gap:5px; min-width:155px; color:#40506a; font-size:10px; font-weight:800; }
.filter-fields input { min-height:38px; padding:0 10px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.filter-fields label:last-child { flex:1 1 230px; }
.filter-actions { display:flex; flex-wrap:wrap; gap:8px; }

/* 包材管理与收分货规则 */
.material-create-form { display:grid; grid-template-columns:1.4fr .8fr repeat(3,.65fr) .7fr .8fr auto; align-items:end; gap:10px; border-bottom:1px solid var(--line-soft); background:#f8fbff; }
.material-create-form label { display:grid; gap:6px; color:#354c6a; font-size:11px; font-weight:800; }
.material-create-form input,.material-create-form select { min-height:40px; width:100%; padding:0 9px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.material-create-form .button { min-height:40px; }
.material-size-hint { grid-column:1/-1; margin:0; padding:8px 10px; border-radius:8px; background:#eef6ff; border:1px solid #cfe4ff; color:#20456f; font-size:12px; font-weight:700; }
.material-table-wrap { max-height:520px; min-height:180px; }
.material-table td { min-width:90px; }
.material-table td:nth-child(2) { min-width:190px; }
.material-table td:last-child { min-width:150px; }
.material-table tbody tr { cursor:default; }
.material-table tr.material-low-stock td { background:#fff7f7; }
.material-name-input { min-width:170px; }
.material-actions { display:flex; gap:6px; }
.material-empty { min-height:160px; }
.rule-section-title { grid-column:1/-1; display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:5px 0 10px; border-bottom:1px solid var(--line); }
.rule-section-title strong { color:#17375f; font-size:14px; }
.rule-section-title span { color:var(--muted); font-size:11px; }
.sorting-title { margin-top:8px; }
.sorting-positions { grid-column:span 2; }
.check-rule { min-height:40px; display:flex !important; flex-direction:row; align-items:center; gap:9px !important; padding:0 11px; border:1px solid var(--line); border-radius:9px; background:#f8fbff; }
.check-rule input { min-height:auto !important; width:16px; height:16px; margin:0; }
.operation-save { grid-column:1/-1; justify-self:end; min-width:260px; }

/* 收分货 */
.receiving-flow { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:9px; margin:0 0 18px; padding:16px; border-radius:14px; color:#fff; background:linear-gradient(110deg,#073b79,#0b58a2); box-shadow:0 10px 28px rgba(6,47,112,.16); }
.receiving-flow span { min-width:112px; padding:10px 14px; border:1px solid rgba(255,255,255,.22); border-radius:9px; background:rgba(255,255,255,.10); text-align:center; font-weight:900; }
.receiving-flow i { color:#f6a5a7; font-style:normal; font-size:19px; }
.receiving-start-layout { align-items:start; }
.asn-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.asn-summary > div { padding:12px; border:1px solid var(--line); border-radius:9px; background:#f8fbff; }
.asn-summary span { display:block; color:var(--muted); font-size:10px; }
.asn-summary strong { display:block; margin-top:5px; }
.receiving-start-button { width:100%; min-height:48px; }
.receiving-asn-upload { display:grid; gap:14px; }
.receiving-layout { display:grid; grid-template-columns:minmax(430px,1.08fr) minmax(360px,.92fr); gap:18px; }
.receiving-scan-panel { overflow:hidden; }
.receiving-scan-form { display:grid; grid-template-columns:1fr auto; align-items:end; gap:10px; }
.receiving-scan-form label { display:grid; gap:7px; color:#334b69; font-size:12px; font-weight:900; }
.receiving-scan-form input { min-height:54px; padding:0 15px; border:2px solid #c7d6e8; border-radius:11px; outline:none; font-size:18px; font-weight:800; }
.receiving-scan-form input:focus { border-color:#0b58a2; box-shadow:0 0 0 4px rgba(11,88,162,.10); }
.receiving-scan-form .button { min-height:54px; }
.receiving-instruction { min-height:300px; display:flex; flex-direction:column; align-items:center; justify-content:center; margin-top:16px; padding:28px; border-radius:16px; text-align:center; }
.receiving-instruction.waiting { color:#36516f; border:2px dashed #bfd0e4; background:#f7faff; }
.receiving-instruction.active { color:#fff; background:linear-gradient(145deg,#0b58a2,#062f70 72%); box-shadow:0 18px 44px rgba(6,47,112,.22); }
.receiving-instruction.complete { color:#fff; background:linear-gradient(145deg,#16745f,#0b5547); }
.receiving-instruction > span svg { width:44px; height:44px; }
.receiving-instruction small { font-size:12px; font-weight:900; letter-spacing:.12em; opacity:.82; }
.receiving-instruction > strong { margin-top:9px; font-size:clamp(34px,5vw,58px); line-height:1; }
.instruction-position { margin-top:18px; font-size:clamp(30px,4vw,48px); font-weight:1000; }
.instruction-layer { margin-top:7px; padding:8px 18px; border-radius:999px; color:#fff; background:#d9363b; font-size:20px; font-weight:900; }
/* 多入库单合并分货时，标明这一箱记到哪个单上 */
.instruction-source { margin-top:9px; padding:7px 16px; border-radius:10px; background:#0d4c98; color:#fff; font-size:16px; font-weight:800; }
.instruction-source strong { font-size:18px; }
.receiving-instruction p { margin:18px 0 8px; opacity:.88; }
.receiving-instruction b { font-size:15px; }
.receiving-session-actions { display:flex; justify-content:flex-end; margin-top:14px; }
.receiving-progress-table { min-height:320px; max-height:520px; }
.pallet-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; }
.pallet-card { padding:16px; border:1px solid #d6e1ee; border-radius:12px; background:linear-gradient(145deg,#f7faff,#fff); }
.pallet-card.warning { border-color:#efb8b9; background:#fff7f7; }
.pallet-card span { color:#0b58a2; font-size:11px; font-weight:900; }
.pallet-card strong { display:block; margin-top:5px; color:#15365f; font-size:23px; }
.pallet-card small { display:block; margin-top:5px; color:var(--muted); }
.pallet-card p { margin:12px 0 0; color:#526178; font-size:11px; line-height:1.55; }

@media (max-width:1200px) {
  .material-create-form { grid-template-columns:repeat(4,minmax(130px,1fr)); }
  .material-create-form .button { grid-column:span 1; }
  .receiving-layout { grid-template-columns:1fr; }
}
@media (max-width:900px) {
  .brand-hero { min-height:320px; background-size:100% 100%,auto 100%; }
  .brand-hero-copy { max-width:53%; }
  .brand-hero-copy > p { font-size:14px; }
  .packing-scan-form { grid-template-columns:1fr; }
  .scan-submit { width:100%; }
  .matched-order-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .scan-choice-grid { grid-template-columns:1fr; }
  .pack-log-filter { align-items:stretch; flex-direction:column; }
  .filter-actions { width:100%; }
  .material-create-form { grid-template-columns:repeat(2,minmax(130px,1fr)); }
  .operation-save { justify-self:stretch; width:100%; }
}
@media (max-width:760px) {
  .topbar-company { font-size:10px; }
  .topbar-company em { margin-left:3px; font-size:10px; }
  .brand-hero { min-height:390px; align-items:flex-end; padding:26px; background-image:linear-gradient(0deg,rgba(3,30,72,.98) 0%,rgba(4,43,99,.72) 55%,rgba(4,43,99,.05)),url('/static/fengzheng-logistics.jpg'); background-size:100% 100%,auto 100%; background-position:center,right center; }
  .brand-hero-copy { max-width:100%; }
  .brand-hero-copy > span { font-size:41px; }
  .brand-hero-copy > strong { font-size:29px; }
  .brand-hero-copy > p { margin-top:14px; }
  .packing-result { padding:14px; }
  .matched-order-summary { grid-template-columns:1fr 1fr; }
  .material-create-form { grid-template-columns:1fr; }
  .sorting-positions { grid-column:auto; }
  .rule-section-title { align-items:flex-start; flex-direction:column; }
  .receiving-flow { align-items:stretch; flex-direction:column; }
  .receiving-flow i { transform:rotate(90deg); text-align:center; }
  .receiving-flow span { width:100%; }
  .receiving-scan-form { grid-template-columns:1fr; }
  .receiving-instruction { min-height:270px; }
  .pallet-grid { grid-template-columns:1fr; }
}
@media (max-width:520px) {
  .company-brand .brand-monogram { width:40px; height:38px; font-size:25px; }
  .brand-wordmark strong { font-size:19px; }
  .brand-wordmark span { font-size:14px; }
  .filter-fields { display:grid; grid-template-columns:1fr; }
  .filter-fields label { min-width:0; }
  .filter-actions .button { flex:1 1 45%; }
  .matched-order-summary { grid-template-columns:1fr; }
  .asn-summary { grid-template-columns:1fr; }
}

/* 枫筝国际品牌图：直接使用用户提供的正式标识，避免文字重绘失真 */
.brand-banner {
  display:block;
  width:100%;
  max-width:214px;
  height:auto;
  border-radius:7px;
  box-shadow:0 8px 24px rgba(0,0,0,.13);
}
.sidebar .company-brand { justify-content:center; padding:0 0 25px; }
.topbar-title { display:grid; grid-template-columns:auto auto; align-items:center; gap:13px; }
.topbar-brand-logo {
  display:block;
  /* 深色顶栏里 180px 的品牌图会盖过「当前模块」标题，收到 128px；
     顶栏本身也从 86px 压到 66px，纵向空间要留给内容不是 chrome。 */
  width:128px;
  height:auto;
  border-radius:5px;
  filter:brightness(.94) contrast(1.03);
}
.topbar-title h1 { margin:0; }
.brand-hero {
  background-image:
    linear-gradient(90deg,rgba(4,35,83,.99) 0%,rgba(6,53,118,.94) 42%,rgba(6,53,118,.45) 66%,rgba(6,53,118,.06) 100%),
    url('/static/fengzheng-ship.jpg');
  background-size:100% 100%,auto 100%;
}
.brand-hero-logo {
  display:block;
  width:min(560px,100%);
  height:auto;
  border-radius:8px;
  box-shadow:0 12px 32px rgba(0,0,0,.20);
}
.brand-hero-copy > small { margin-top:16px; }
.login-brand { width:min(570px,92%); }
.login-brand-banner {
  display:block;
  width:100%;
  height:auto;
  border-radius:10px;
  box-shadow:0 18px 46px rgba(0,0,0,.28);
}
.login-story {
  background-image:
    linear-gradient(145deg,rgba(3,29,70,.88),rgba(5,55,123,.54) 55%,rgba(3,28,67,.82)),
    url('/static/fengzheng-ship.jpg');
}

.scan-sequence {
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 15px;
  color:#46617f;
  font-size:12px;
  font-weight:800;
}
.scan-sequence span {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 11px;
  border:1px solid #d6e2ef;
  border-radius:999px;
  background:#f8fbff;
}
.scan-sequence b {
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:#0b58a2;
  font-size:11px;
}
.scan-sequence i { color:#d93636; font-style:normal; font-size:16px; }
.scan-form-actions { display:flex; align-items:center; gap:8px; }
.packing-scan-form input[readonly] { color:#44617f; background:#edf3f9; }
.scan-locked-note { margin-top:12px; color:#0b58a2; font-size:12px; font-weight:800; }
.icon-button.no-alert i { display:none; }
.icon-button.has-alert i { display:block; background:#d93636; box-shadow:0 0 0 4px rgba(217,54,54,.12); }

@media (max-width:1100px) {
  .topbar-brand-logo { width:145px; }
  .topbar-title { gap:9px; }
  .topbar-title h1 { padding-left:9px; font-size:21px; }
}
@media (max-width:900px) {
  .brand-hero-logo { width:min(420px,100%); }
  .topbar-brand-logo { width:122px; }
  .scan-form-actions { width:100%; }
  .scan-form-actions .button { flex:1; }
}
@media (max-width:760px) {
  .topbar-title { grid-template-columns:1fr; gap:2px; }
  .topbar-brand-logo { width:108px; }
  .topbar-title h1 { padding:0; border:0; font-size:18px; }
  .brand-hero-logo { width:100%; }
  .scan-sequence { align-items:stretch; flex-direction:column; }
  .scan-sequence i { transform:rotate(90deg); text-align:center; }
}
.receiving-history-panel .table-wrap { max-height:360px; }
.receiving-history-panel td { white-space:nowrap; }
.receiving-history-empty { min-height:145px; }

/* v3.0 final brand prominence and operational readability */
@media (min-width:1101px) {
  .topbar-brand-logo { width:210px; }
}
.dimension-source-note { color:var(--muted); font-size:11px; }

.section-gap-top { margin-top:18px; }
.section-gap-bottom { margin-bottom:18px; }
.note-gap-top { margin-top:12px; }
.note-gap-bottom { margin-bottom:12px; }
.history-gap-top { margin-top:14px; }
.no-bottom-margin { margin-bottom:0; }
.rule-table-scroll { max-height:430px; }
.password-form-width { max-width:520px; }

/* =========================================================
   v5.0 仓库经营看板与管理层 AI 简报
   ========================================================= */
.dashboard-control-panel {
  display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:0 0 14px;
  padding:12px 14px; border:1px solid #d9e2ec; border-radius:14px;
  background:linear-gradient(135deg,#fff,#f6f9fc); box-shadow:0 4px 16px rgba(6,47,112,.035);
}
.dashboard-range-buttons { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.dashboard-range-buttons button {
  min-height:34px; padding:0 12px; border:1px solid #d9e2ec; border-radius:9px;
  color:#53647a; background:#fff; font-size:12px; font-weight:800; cursor:pointer;
}
.dashboard-range-buttons button:hover { border-color:#9bb4d2; color:#0b58a2; }
.dashboard-range-buttons button.active { color:#fff; border-color:#0b58a2; background:#0b58a2; box-shadow:0 5px 13px rgba(11,88,162,.18); }
.dashboard-custom-filter { display:flex; align-items:end; gap:7px; margin-left:auto; }
.dashboard-custom-filter label { display:grid; gap:4px; color:#6a788a; font-size:10px; font-weight:800; }
.dashboard-custom-filter input,.dashboard-group-picker select {
  min-height:34px; padding:0 9px; border:1px solid #d6e0eb; border-radius:8px; color:#24364e; background:#fff; outline:none;
}
.dashboard-custom-filter input:focus,.dashboard-group-picker select:focus { border-color:#0b58a2; box-shadow:0 0 0 3px rgba(11,88,162,.08); }
.dashboard-group-picker { display:flex; align-items:center; gap:7px; color:#6a788a; font-size:11px; font-weight:800; }
.dashboard-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 0 16px; padding:6px; border:1px solid #dce5ef; border-radius:14px; background:#edf3f9; }
.dashboard-tabs button { min-height:46px; display:flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:10px; color:#536a84; background:transparent; font-weight:900; cursor:pointer; }
.dashboard-tabs button svg { width:19px; height:19px; stroke:currentColor; fill:none; stroke-width:1.8; }
.dashboard-tabs button:hover { color:#0b58a2; background:rgba(255,255,255,.68); }
.dashboard-tabs button.active { color:#fff; background:linear-gradient(135deg,#0b58a2,#073b79); box-shadow:0 8px 18px rgba(6,47,112,.18); }
.ai-entry { color:#fff; border-color:#623bb0; background:linear-gradient(135deg,#7351bd,#3d277f); }
.ai-entry:hover { box-shadow:0 7px 18px rgba(83,53,150,.22); }
.dashboard-loading { min-height:440px; display:grid; place-items:center; align-content:center; gap:10px; color:#5d6d7e; text-align:center; }
.dashboard-loading strong { color:#17375f; font-size:17px; }
.dashboard-loading p { margin:0; font-size:12px; }
.loading-ring { width:30px; height:30px; display:inline-block; border:3px solid #dce7f3; border-top-color:#0b58a2; border-radius:50%; animation:dashboard-spin .75s linear infinite; }
@keyframes dashboard-spin { to { transform:rotate(360deg); } }
.dashboard-background-refresh {
  position:sticky; z-index:18; top:8px; width:max-content; max-width:calc(100% - 16px);
  display:flex; align-items:center; gap:8px; margin:0 8px -40px auto; padding:8px 11px;
  border:1px solid #cbdced; border-radius:999px; color:#31587f; background:rgba(255,255,255,.96);
  box-shadow:0 7px 20px rgba(19,54,91,.12); pointer-events:none;
}
.dashboard-background-refresh .loading-ring { width:17px; height:17px; border-width:2px; }
.dashboard-background-refresh strong { font-size:11px; }
.dashboard-background-refresh small { color:#78889a; font-size:10px; }

.dashboard-source-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0 0 16px; }
.dashboard-source-strip > div { display:grid; grid-template-columns:auto 1fr; gap:3px 10px; padding:13px 14px; border:1px solid #e0e7ef; border-radius:12px; background:#fff; }
.dashboard-source-strip span { grid-row:1/3; width:42px; height:42px; display:grid; place-items:center; border-radius:10px; color:#0b58a2; background:#e8f0fa; font-size:11px; font-weight:1000; }
.dashboard-source-strip strong { color:#243a57; font-size:12px; }
.dashboard-source-strip small { color:#7b8797; font-size:10px; line-height:1.45; }
.dashboard-period-label { padding:6px 10px; border-radius:999px; color:#0b58a2; background:#e8f0fa; font-size:11px; font-weight:900; }
.dashboard-section-heading { display:flex; align-items:end; justify-content:space-between; gap:15px; margin:4px 0 13px; }
.dashboard-section-heading h3 { margin:0; color:#17375f; font-size:17px; }
.dashboard-section-heading p { margin:4px 0 0; color:#718094; font-size:11px; }

.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; margin:0 0 16px; }
.dashboard-kpi-grid.six { grid-template-columns:repeat(3,minmax(0,1fr)); }
.dashboard-kpi-grid.eight { grid-template-columns:repeat(4,minmax(0,1fr)); }
.dashboard-kpi-grid.ten { grid-template-columns:repeat(5,minmax(0,1fr)); }
.dashboard-kpi-grid.eleven { grid-template-columns:repeat(6,minmax(0,1fr)); }
.dashboard-kpi-grid.customer-kpis { grid-template-columns:repeat(5,minmax(0,1fr)); }
.dashboard-kpi { min-height:134px; display:flex; flex-direction:column; padding:15px; border:1px solid #e0e7ef; border-radius:14px; background:#fff; box-shadow:0 3px 12px rgba(6,47,112,.035); overflow:hidden; position:relative; }
.dashboard-kpi::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:#8aa7c8; }
.dashboard-kpi.blue::before { background:#0b58a2; }
.dashboard-kpi.orange::before { background:#ed7b2f; }
.dashboard-kpi.red::before { background:#c33d37; }
.dashboard-kpi-head { display:flex; align-items:center; justify-content:space-between; gap:8px; color:#6e7d90; font-size:11px; font-weight:900; }
.dashboard-kpi-head svg { width:19px; height:19px; stroke:#7892b1; fill:none; stroke-width:1.8; }
.dashboard-kpi-value { display:flex; align-items:baseline; gap:6px; margin-top:14px; }
.dashboard-kpi-value strong { color:#132e50; font-size:clamp(21px,2.2vw,31px); line-height:1; letter-spacing:-.03em; }
.dashboard-kpi-value small { color:#8490a0; font-size:10px; font-weight:800; }
.dashboard-kpi-foot { min-height:22px; display:flex; align-items:end; margin-top:auto; padding-top:9px; }
.source-mini { color:#93a0ae; font-size:10px; }
.rate-badge { display:inline-flex; align-items:center; min-height:23px; padding:3px 8px; border-radius:999px; font-size:10px; font-weight:900; white-space:nowrap; }
.rate-badge.up { color:#10705c; background:#dff3ed; }
.rate-badge.down { color:#ad3935; background:#fbe8e6; }
.rate-badge.flat { color:#6a7480; background:#edf0f2; }
.rate-badge.neutral { color:#7d8894; background:#f0f2f4; }

.dashboard-layout-main { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.45fr); gap:16px; margin:0 0 16px; }
.dashboard-chart-panel { overflow:hidden; }
.dashboard-chart-panel .panel-body { padding:10px 14px 14px; }
.dashboard-chart { min-height:300px; overflow:hidden; }
.dashboard-chart svg { display:block; width:100%; min-width:620px; height:auto; }
.trend-small-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:12px; min-height:0; }
.trend-small-chart { min-width:0; padding:13px 13px 8px; border:1px solid #e0e8f0; border-radius:13px; background:linear-gradient(155deg,#fff,#f7fbfe); }
.trend-small-chart svg { width:100%; min-width:0; margin-top:4px; }
.trend-small-head { display:grid; grid-template-columns:1fr auto auto; align-items:baseline; gap:7px; }
.trend-small-head > span { display:flex; align-items:center; gap:7px; color:#52677f; font-size:11px; font-weight:900; }
.trend-small-head i { width:9px; height:9px; border-radius:50%; background:#0b58a2; box-shadow:0 0 0 4px rgba(11,88,162,.10); }
.trend-small-head strong { color:#17375f; font-size:20px; }
.trend-small-head small { color:#8a97a6; font-size:9px; }
.trend-small-meta { display:flex; gap:12px; margin:4px 0 0; color:#8290a0; font-size:9px; }
.trend-small-chart.series-green .trend-small-head i { background:#0c8b70; box-shadow:0 0 0 4px rgba(12,139,112,.10); }
.trend-small-chart.series-orange .trend-small-head i { background:#ed7b2f; box-shadow:0 0 0 4px rgba(237,123,47,.10); }
.trend-small-chart.series-red .trend-small-head i { background:#c33d37; box-shadow:0 0 0 4px rgba(195,61,55,.10); }
.chart-area { opacity:.09; }
.chart-area.series-blue { fill:#0b58a2; }
.chart-area.series-green { fill:#0c8b70; }
.chart-area.series-orange { fill:#ed7b2f; }
.chart-area.series-red { fill:#c33d37; }
.chart-value-label { fill:#294965; font-size:10px; font-weight:900; paint-order:stroke; stroke:#fff; stroke-width:3px; stroke-linejoin:round; }
.chart-grid-line { stroke:#e5ebf1; stroke-width:1; }
.chart-axis-text { fill:#8995a3; font-size:10px; }
.chart-line { fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.chart-dot { stroke:#fff; stroke-width:2; }
.chart-line.series-blue,.chart-dot.series-blue { stroke:#0b58a2; fill:#0b58a2; }
.chart-line.series-green,.chart-dot.series-green { stroke:#0c8b70; fill:#0c8b70; }
.chart-line.series-orange,.chart-dot.series-orange { stroke:#ed7b2f; fill:#ed7b2f; }
.chart-line.series-red,.chart-dot.series-red { stroke:#c33d37; fill:#c33d37; }
.chart-legend { display:flex; justify-content:flex-end; gap:13px; padding:8px 8px 0; }
.chart-legend span { display:flex; align-items:center; gap:5px; color:#657386; font-size:10px; font-weight:800; }
.chart-legend i { width:18px; height:3px; border-radius:2px; background:#7e95af; }
.chart-legend .series-blue i { background:#0b58a2; }
.chart-legend .series-green i { background:#0c8b70; }
.chart-legend .series-orange i { background:#ed7b2f; }
.chart-legend .series-red i { background:#c33d37; }
.dashboard-chart-empty { min-height:270px; display:grid; place-items:center; align-content:center; gap:9px; color:#8b98a6; text-align:center; }
.dashboard-chart-empty svg { width:37px; height:37px; stroke:#a8b5c3; fill:none; }
.dashboard-chart-empty strong { font-size:12px; }
.live-panel .panel-body { padding:12px 16px 16px; }
.live-indicator { display:flex; align-items:center; gap:6px; color:#0c7d69; font-size:10px; font-weight:900; }
.live-indicator i { width:8px; height:8px; border-radius:50%; background:#20b592; box-shadow:0 0 0 5px rgba(32,181,146,.12); animation:live-pulse 1.8s ease-in-out infinite; }
@keyframes live-pulse { 50% { box-shadow:0 0 0 9px rgba(32,181,146,0); } }
.live-stat-list { display:grid; gap:8px; }
.live-stat-list > div { display:grid; grid-template-columns:1fr auto; gap:2px 10px; padding:11px 12px; border:1px solid #e2e8ef; border-radius:10px; background:#f9fbfd; }
.live-stat-list > div.warning { border-color:#f0cbb0; background:#fff7f0; }
.live-stat-list span { color:#68788c; font-size:10px; font-weight:800; }
.live-stat-list strong { color:#17375f; font-size:18px; }
.live-stat-list small { grid-column:1/-1; color:#8793a1; font-size:9px; }
.live-stat-list p { margin:3px 2px 0; color:#8894a1; font-size:9px; line-height:1.55; }
.live-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:15px; }

.employee-live-board { margin:0 0 16px; overflow:hidden; border-color:#d8e4f0; box-shadow:0 7px 24px rgba(6,47,112,.06); }
.employee-live-header { align-items:flex-start; background:linear-gradient(90deg,#f6faff,#fff); }
.employee-live-summary { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:7px; }
.employee-live-summary > b { padding:5px 9px; border:1px solid #dbe5ef; border-radius:999px; color:#315271; background:#fff; font-size:9px; white-space:nowrap; }
.history-indicator { display:inline-flex; align-items:center; padding:5px 9px; border-radius:999px; color:#7a571c; background:#fff3d8; font-size:9px; font-weight:900; }
.employee-live-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 16px; border-top:1px solid #e4ebf2; background:#fff; }
.employee-live-toolbar > span { color:#758496; font-size:9px; line-height:1.5; text-align:right; }
.employee-live-date-filter { display:flex; align-items:flex-end; flex-wrap:wrap; gap:8px; }
.employee-live-date-filter label { display:grid; gap:4px; color:#68788c; font-size:9px; font-weight:900; }
.employee-live-date-filter input { min-width:145px; height:34px; padding:0 9px; border:1px solid #ced9e5; border-radius:8px; color:#26425f; background:#fff; font:inherit; }
.employee-summary-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; padding:0 14px 12px; background:#fff; }
.employee-summary-grid article { min-width:0; padding:11px 12px; border:1px solid #e0e8f0; border-radius:11px; background:linear-gradient(145deg,#f8fbfe,#fff); }
.employee-summary-grid article > span { display:block; color:#7d8b9a; font-size:9px; font-weight:900; }
.employee-summary-grid article > strong { display:block; margin-top:5px; color:#17375f; font-size:19px; }
.employee-summary-grid article > strong small { margin-left:4px; color:#708096; font-size:9px; }
.employee-summary-grid article > div { display:flex; flex-wrap:wrap; gap:4px; margin-top:7px; }
.employee-live-column-head,.employee-live-row { display:grid; grid-template-columns:minmax(135px,.9fr) minmax(150px,1.05fr) minmax(155px,1fr) minmax(95px,.62fr) minmax(190px,1.3fr) minmax(175px,1.15fr) minmax(90px,.58fr); gap:11px; align-items:center; }
.employee-live-column-head { padding:9px 18px; border-top:1px solid #e3eaf2; border-bottom:1px solid #dfe7ef; color:#8592a2; background:#f4f7fa; font-size:9px; font-weight:900; letter-spacing:.03em; }
.employee-live-viewport { height:auto; max-height:430px; overflow:hidden; padding:8px 10px; background:#f8fafc; }
.employee-live-viewport.is-rolling { height:430px; }
.employee-live-track { will-change:auto; }
.employee-live-group { display:grid; gap:8px; padding-bottom:8px; }
.employee-live-row { min-height:104px; padding:10px 12px; border:1px solid #e0e8f0; border-left:4px solid #9eacba; border-radius:11px; background:#fff; box-shadow:0 2px 8px rgba(8,50,105,.025); }
.employee-live-row.working { border-left-color:#11a47f; background:linear-gradient(90deg,#f1fcf8,#fff 18%); }
.employee-live-row.done { border-left-color:#2c74b8; }
.employee-live-row.summary { border-left-color:#e18a35; }
.employee-live-row.idle { opacity:.76; }
.employee-live-person { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:9px; min-width:0; }
.employee-avatar { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; color:#fff; background:linear-gradient(145deg,#0b58a2,#173d78); font-size:14px; font-weight:1000; }
.employee-live-person strong,.employee-live-person small { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.employee-live-person strong { color:#203a59; font-size:12px; }
.employee-live-person small { margin-top:2px; color:#8693a2; font-size:9px; }
.employee-status-dot { width:8px; height:8px; border-radius:50%; background:#aeb8c2; }
.employee-live-row.working .employee-status-dot { background:#18af8a; box-shadow:0 0 0 5px rgba(24,175,138,.12); animation:live-pulse 1.8s ease-in-out infinite; }
.employee-live-row.done .employee-status-dot { background:#3c83c5; }
.employee-live-row.summary .employee-status-dot { background:#e18a35; }
.employee-live-process { min-width:0; }
.employee-live-process > div { display:flex; flex-wrap:wrap; gap:5px; }
.employee-process-tag { display:inline-flex; padding:4px 7px; border-radius:999px; color:#0d5d9e; background:#e9f3fc; font-size:9px; font-weight:900; }
.employee-process-tag.idle { color:#778390; background:#eef1f4; }
.employee-live-process > small { display:block; max-width:100%; margin-top:6px; overflow:hidden; color:#728197; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.employee-live-metric span,.employee-live-metric strong,.employee-live-metric small { display:block; }
.employee-live-metric span { color:#8995a3; font-size:8px; font-weight:800; }
.employee-live-metric strong { margin-top:3px; color:#17375f; font-size:16px; }
.employee-live-metric small { margin-top:2px; color:#7f8d9d; font-size:8px; }
.employee-live-metric.efficiency strong { font-size:11px; white-space:nowrap; }
.employee-live-workload,.employee-live-tasks { min-width:0; }
.employee-live-workload > div:first-child,.employee-live-tasks > div:first-child { display:flex; align-items:baseline; justify-content:space-between; gap:6px; }
.employee-live-workload span,.employee-live-tasks span { color:#8995a3; font-size:8px; font-weight:800; }
.employee-live-workload strong,.employee-live-tasks strong { color:#17375f; font-size:15px; }
.employee-live-workload > small { display:block; margin-top:4px; color:#6f8092; font-size:8px; line-height:1.5; }
.employee-row-rates { display:flex; flex-wrap:wrap; gap:3px; margin-top:6px; }
.employee-row-rates .rate-badge { padding:3px 5px; font-size:7px; }
.employee-task-list { display:flex; flex-wrap:wrap; align-content:flex-start; gap:4px; max-height:58px; margin-top:6px; padding-right:2px; overflow:auto; }
.employee-task-list > span,.table-task-list > span { display:inline-flex; max-width:100%; padding:3px 5px; border-radius:6px; color:#315d88; background:#edf5fc; font-size:8px; font-weight:800; overflow-wrap:anywhere; }
.employee-task-list .task-timing-chip { display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:148px; }
.task-chip-head { display:flex; align-items:center; flex-wrap:wrap; gap:4px; width:100%; }
.task-timing-chip b { color:#174f86; font-size:9px; }
.task-timing-chip small { color:#647b91; font-size:7px; font-weight:700; white-space:normal; }
.task-ticket-type,.task-state-badge { display:inline-flex; padding:2px 4px; border-radius:999px; font-size:7px; font-style:normal; font-weight:900; }
.task-ticket-type { color:#6b4c13; background:#fff0c9; }
.task-state-badge { margin-left:auto; color:#9a5c00; background:#fff0d7; }
.task-timing-chip.completed { border-left:3px solid #2f80c5; }
.task-timing-chip.completed .task-state-badge { color:#175f99; background:#dceefa; }
.task-timing-chip.outbound { border-left:3px solid #14966f; }
.task-timing-chip.outbound .task-state-badge { color:#087258; background:#d9f5eb; }
.task-timing-chip.picking { border-left:3px solid #e39524; }
.employee-task-empty { display:block; margin-top:6px; color:#9aa5b0; font-size:8px; }
.employee-live-status { min-width:0; text-align:right; }
.employee-live-status b { display:inline-flex; padding:5px 8px; border-radius:999px; color:#6d7884; background:#eef1f4; font-size:9px; }
.employee-live-row.working .employee-live-status b { color:#08745d; background:#dff6ef; }
.employee-live-row.done .employee-live-status b { color:#1a5c96; background:#e4f0fa; }
.employee-live-row.summary .employee-live-status b { color:#9a581b; background:#fff0de; }
.employee-live-status small { display:block; margin-top:5px; overflow:hidden; color:#929da9; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.employee-hourly-panel { padding:14px 16px 8px; border-top:1px solid #e3eaf1; background:#fff; }
.employee-hourly-panel > div:first-child { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:4px; }
.employee-hourly-panel > div:first-child strong { color:#213c5d; font-size:12px; }
.employee-hourly-panel > div:first-child small { color:#8794a3; font-size:9px; }
.employee-hourly-panel .dashboard-chart { min-height:0; padding-top:2px; }
.employee-hourly-panel .dashboard-chart svg { max-height:225px; }
.employee-hourly-panel .chart-legend { padding:0 0 2px; }
.employee-hourly-empty { display:grid; place-items:center; min-height:85px; color:#8b98a6; font-size:10px; }
.employee-live-footer { display:flex; justify-content:space-between; gap:15px; padding:9px 16px 11px; border-top:1px solid #e3eaf1; color:#788696; background:#fff; font-size:9px; line-height:1.45; }
.employee-live-footer small { flex:0 0 auto; color:#9aa5b0; }
.employee-live-empty { display:grid; place-items:center; gap:5px; min-height:150px; color:#8794a2; text-align:center; }
.employee-live-empty strong { color:#52677f; font-size:12px; }
.employee-live-empty span { font-size:10px; }

.operation-stage-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:0 0 16px; }
.operation-stage-card { padding:18px; border:1px solid #dde6ef; border-radius:15px; background:linear-gradient(145deg,#fff,#f8fbfe); }
.stage-card-head { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; }
.stage-card-head > span { width:42px; height:42px; display:grid; place-items:center; border-radius:11px; color:#0b58a2; background:#e8f0fa; }
.stage-card-head svg { width:21px; height:21px; stroke:currentColor; fill:none; }
.stage-card-head strong,.stage-card-head small { display:block; }
.stage-card-head strong { color:#17375f; font-size:15px; }
.stage-card-head small { margin-top:2px; color:#8591a0; font-size:9px; }
.stage-card-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-top:16px; }
.stage-card-metrics > div { padding:11px; border-radius:10px; background:#f1f5f9; }
.stage-card-metrics > div.stage-backlog { background:#fff0e4; }
.stage-card-metrics span,.stage-card-metrics strong { display:block; }
.stage-card-metrics span { color:#7c8998; font-size:9px; }
.stage-card-metrics strong { margin-top:5px; color:#243b58; font-size:13px; }
.dashboard-table-panel { margin-bottom:16px; overflow:hidden; }
.table-task-list { display:flex; flex-wrap:wrap; gap:4px; min-width:150px; max-width:300px; max-height:76px; overflow:auto; }
.dashboard-table-panel .table-wrap { min-height:0; max-height:520px; }
.table-empty { padding:35px !important; color:#8a96a3; text-align:center; }

.dashboard-no-data { min-height:260px; display:flex; align-items:center; justify-content:center; gap:20px; padding:35px; border:1px dashed #bfcddd; border-radius:16px; background:linear-gradient(145deg,#f8fbfe,#fff); }
.dashboard-no-data > span { width:66px; height:66px; display:grid; place-items:center; flex:0 0 66px; border-radius:18px; color:#0b58a2; background:#e8f0fa; }
.dashboard-no-data svg { width:32px; height:32px; stroke:currentColor; fill:none; }
.dashboard-no-data strong { color:#17375f; font-size:18px; }
.dashboard-no-data p { max-width:720px; margin:7px 0 16px; color:#66778b; line-height:1.7; }

.comparison-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:0 0 16px; }
.comparison-strip > div { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px; border:1px solid #e1e7ee; border-radius:11px; background:#fff; }
.comparison-strip span:first-child { color:#6d7b8d; font-size:10px; font-weight:900; }
.comparison-strip strong { color:#17375f; font-size:16px; }
.rank-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.rank-panel { min-width:0; padding:15px; border:1px solid #e0e7ef; border-radius:14px; background:#fff; }
.rank-panel-title { display:flex; align-items:center; justify-content:space-between; padding-bottom:11px; border-bottom:1px solid #edf1f4; }
.rank-panel-title strong { color:#17375f; }
.rank-panel-title span { color:#8795a5; font-size:9px; font-weight:900; }
.rank-list { display:grid; gap:11px; margin-top:12px; }
.rank-row { display:grid; grid-template-columns:22px 1fr; gap:8px; align-items:center; }
.rank-row > b { width:22px; height:22px; display:grid; place-items:center; border-radius:7px; color:#58708e; background:#edf3f9; font-size:10px; }
.rank-row:nth-child(-n+3) > b { color:#fff; background:#0b58a2; }
.rank-row > div { min-width:0; }
.rank-row span { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.rank-row strong { overflow:hidden; color:#334760; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.rank-row em { color:#7c8998; font-size:9px; font-style:normal; white-space:nowrap; }
.rank-progress { width:100%; height:5px; display:block; margin-top:5px; border:0; border-radius:999px; overflow:hidden; appearance:none; background:#edf1f5; }
.rank-progress::-webkit-progress-bar { border-radius:999px; background:#edf1f5; }
.rank-progress::-webkit-progress-value { border-radius:999px; background:linear-gradient(90deg,#0b58a2,#4e8ac9); }
.rank-progress::-moz-progress-bar { border-radius:999px; background:linear-gradient(90deg,#0b58a2,#4e8ac9); }
.rank-empty { padding:30px 10px; color:#929da9; text-align:center; font-size:11px; }
/* ── 客户经营异常分析页 ────────────────────────────────────── */
.anomaly-filter-panel .filter-actions{display:flex;gap:8px}
.anomaly-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.anomaly-filter-grid label{display:grid;gap:5px;font-size:11px;font-weight:700;color:#2b4666}
.anomaly-filter-grid input,.anomaly-filter-grid select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;background:#fff}
.anomaly-issue-list{display:grid;gap:9px}
.anomaly-data-issue{display:grid;gap:3px;padding:11px 13px;border-left:4px solid #d38a18;border-radius:9px;background:rgba(255,248,232,.85)}
.anomaly-data-issue strong{color:#7a5310;font-size:12px}
.anomaly-data-issue span{color:#5e738a;font-size:11px;line-height:1.55}
.anomaly-level-strip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.anomaly-level-tab{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid #dde5ee;border-radius:9px;background:#fff;color:#5c7288;font-size:12px;font-weight:800;cursor:pointer}
.anomaly-level-tab b{padding:1px 7px;border-radius:6px;background:#eef3f9;color:#3d5a7d;font-size:11px}
.anomaly-level-tab:hover{border-color:#9fbcd8}
.anomaly-level-tab.active{border-color:#0b58a2;background:#0b58a2;color:#fff}
.anomaly-level-tab.active b{background:rgba(255,255,255,.22);color:#fff}
.anomaly-chip{display:inline-block;padding:2px 8px;margin-right:5px;border-radius:6px;background:#eef3f9;color:#3d5a7d;font-size:10px;font-weight:800;white-space:nowrap}
.anomaly-chip.lv-red{background:#fdecec;color:#a6231f}
.anomaly-chip.lv-orange{background:#fff4e3;color:#8a5510}
.anomaly-chip.lv-yellow{background:#fdf8e0;color:#7a6a12}
.anomaly-chip.lv-blue{background:#eaf3fd;color:#1b5794}
.anomaly-chip.impact-高{background:#fdecec;color:#a6231f}
.anomaly-chip.impact-中{background:#fff4e3;color:#8a5510}
.lv-orange-text{color:#a6231f}
.anomaly-focus-list{display:grid;gap:10px}
.anomaly-focus-item{padding:12px 14px;border:1px solid #f0d6d4;border-left:4px solid #c8352f;border-radius:10px;background:rgba(253,242,242,.7)}
.anomaly-focus-item>div{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:5px}
.anomaly-focus-item strong{color:#8f1f1b;font-size:13px;margin-right:4px}
.anomaly-focus-item p{margin:0;color:#4d6076;font-size:11px;line-height:1.6}
.anomaly-table-wrap{max-height:640px;overflow:auto}
.anomaly-table td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.anomaly-table .anomaly-reason{max-width:430px;white-space:normal;color:#55697f;font-size:10px;line-height:1.55}
.anomaly-missing{margin:8px 0 0;padding-left:19px;color:#5e738a;font-size:11px;line-height:1.7}

/* 客户经营看板：异常增长/异常下降的「全部 / 订单异常 / 库容异常」筛选 */
.anomaly-filter-tabs{display:flex;gap:6px;padding:0 17px 11px;border-bottom:1px solid #edf1f4}
.anomaly-filter-tab{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border:1px solid #dde5ee;
  border-radius:8px;background:#fff;color:#5c7288;font-size:11px;font-weight:700;cursor:pointer}
.anomaly-filter-tab b{padding:1px 6px;border-radius:6px;background:#eef3f9;color:#3d5a7d;font-size:10px}
.anomaly-filter-tab:hover{border-color:#9fbcd8}
.anomaly-filter-tab.active{border-color:#0b58a2;background:#0b58a2;color:#fff}
.anomaly-filter-tab.active b{background:rgba(255,255,255,.22);color:#fff}

/* 榜单只显示前 8 名，合计小于 KPI 总数时在底部说明差额来自哪里 */
.rank-foot { margin-top:11px; padding-top:9px; border-top:1px dashed #e3eaf1; color:#8795a5; font-size:9px; line-height:1.5; }

.customer-summary-row { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr); gap:14px; margin:0 0 16px; }
.abc-panel,.snapshot-panel { padding:17px; border:1px solid #e0e7ef; border-radius:14px; background:#fff; }
.abc-panel > div:first-child { display:flex; justify-content:space-between; gap:12px; }
.abc-panel > div:first-child span { color:#17375f; font-weight:900; }
.abc-panel > div:first-child strong { color:#7c8998; font-size:10px; }
.abc-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-top:13px; }
.abc-cards article { display:grid; grid-template-columns:auto 1fr; gap:3px 8px; padding:12px; border-radius:11px; background:#f3f6f9; }
.abc-cards b { grid-row:1/3; width:35px; height:35px; display:grid; place-items:center; border-radius:10px; color:#fff; font-size:17px; }
.abc-cards article.a b { background:#0b58a2; }
.abc-cards article.b b { background:#0c8b70; }
.abc-cards article.c b { background:#8b97a6; }
.abc-cards strong { color:#213a59; font-size:20px; }
.abc-cards span { color:#84909e; font-size:9px; }
.snapshot-panel { display:flex; flex-direction:column; }
.snapshot-panel > span { color:#7b899a; font-size:10px; font-weight:900; }
.snapshot-panel > strong { margin-top:8px; color:#17375f; font-size:23px; }
.snapshot-panel > small { margin-top:5px; color:#6d7b8d; font-size:10px; line-height:1.5; }
.snapshot-panel > i { margin-top:auto; padding-top:12px; color:#8995a3; font-size:9px; font-style:normal; line-height:1.5; }
.rank-number { width:24px; height:24px; display:grid; place-items:center; border-radius:7px; color:#0b58a2; background:#e8f0fa; }
.abc-tag { min-width:27px; display:inline-grid; place-items:center; padding:4px 7px; border-radius:7px; color:#fff; font-size:10px; font-weight:1000; }
.abc-tag.a { background:#0b58a2; }
.abc-tag.b { background:#0c8b70; }
.abc-tag.c { background:#8b97a6; }
.anomaly-tag { padding:4px 7px; border-radius:999px; font-size:9px; font-weight:900; }
.anomaly-tag.up { color:#0c725c; background:#dff3ed; }
.anomaly-tag.down { color:#ad3935; background:#fbe8e6; }
.anomaly-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.anomaly-list { display:grid; gap:8px; }
.anomaly-list article { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:10px 11px; border:1px solid #edf1f4; border-radius:10px; }
.anomaly-icon { width:29px; height:29px; display:grid; place-items:center; border-radius:9px; font-size:16px; font-weight:1000; }
.anomaly-icon.up { color:#0c725c; background:#dff3ed; }
.anomaly-icon.down { color:#ad3935; background:#fbe8e6; }
.anomaly-list strong,.anomaly-list small { display:block; }
.anomaly-list strong { color:#2b405c; font-size:11px; }
.anomaly-list small { margin-top:2px; color:#8793a1; font-size:9px; }
.anomaly-list article > b { color:#17375f; font-size:12px; }

.dashboard-data-management { overflow:hidden; border-color:#cddceb; }
.dashboard-data-management > .panel-header { background:linear-gradient(90deg,#eef5fc,#fff); }
.dashboard-import-form { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; }
.dashboard-file-drop { min-height:86px; display:flex; align-items:center; gap:13px; padding:14px; border:2px dashed #b9cbe0; border-radius:13px; background:#f8fbff; cursor:pointer; position:relative; }
.dashboard-file-drop:hover { border-color:#0b58a2; background:#f3f8fe; }
.dashboard-file-drop > span { width:47px; height:47px; display:grid; place-items:center; border-radius:12px; color:#0b58a2; background:#e3edf9; }
.dashboard-file-drop svg { width:24px; height:24px; stroke:currentColor; fill:none; }
.dashboard-file-drop strong,.dashboard-file-drop small { display:block; }
.dashboard-file-drop strong { color:#17375f; }
.dashboard-file-drop small { margin-top:4px; color:#758396; font-size:10px; }
.dashboard-file-drop input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.dashboard-import-form .upload-actions { min-width:300px; }
.dashboard-import-history { border-top:1px solid #edf1f4; }
.dashboard-import-list { display:grid; }
.dashboard-import-list article { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:12px; padding:12px 17px; border-bottom:1px solid #edf1f4; }
.dashboard-import-list article:last-child { border-bottom:0; }
.dashboard-import-list article > span:first-child { width:35px; height:35px; display:grid; place-items:center; border-radius:9px; color:#0b58a2; background:#e8f0fa; }
.dashboard-import-list svg { width:18px; height:18px; stroke:currentColor; fill:none; }
.dashboard-import-list strong,.dashboard-import-list small { display:block; }
.dashboard-import-list strong { color:#2a405e; font-size:11px; }
.dashboard-import-list small { margin-top:3px; color:#8a96a4; font-size:9px; }
.dashboard-import-counts { display:flex; gap:5px; }
.dashboard-import-counts b { min-width:48px; padding:7px 8px; border-radius:8px; color:#17375f; background:#f1f5f9; text-align:center; font-size:12px; }
.dashboard-import-counts small { margin-top:2px; color:#8290a0; font-size:8px; }

.drawer-overlay.ai-mode { justify-content:flex-end; background:rgba(6,17,34,.58); }
.drawer-overlay.ai-mode .drawer { width:min(790px,96vw); padding:34px 32px 45px; background:linear-gradient(160deg,#f7f9fd,#fff 38%); }
.ai-analysis-loading { min-height:70vh; display:grid; place-items:center; align-content:center; gap:11px; color:#69798c; text-align:center; }
.ai-analysis-loading > span { width:72px; height:72px; display:grid; place-items:center; border-radius:21px; color:#fff; background:linear-gradient(145deg,#7351bd,#35216f); box-shadow:0 16px 35px rgba(74,45,137,.24); }
.ai-analysis-loading svg { width:37px; height:37px; stroke:currentColor; fill:none; }
.ai-analysis-loading h2 { margin:4px 0 0; }
.ai-analysis-loading p { margin:0; }
.ai-analysis-head { padding:22px; border-radius:18px; color:#fff; background:linear-gradient(135deg,#0b397d,#2d246f 78%); box-shadow:0 16px 36px rgba(23,35,79,.19); }
.ai-analysis-head .drawer-kicker { color:#c7dcff; }
.ai-analysis-head h2 { margin:8px 0 8px; font-size:28px; }
.ai-analysis-head p { margin:0; color:#e6ecfa; font-size:14px; line-height:1.75; }
.ai-analysis-head > div { display:flex; gap:9px; margin-top:17px; }
.ai-count { display:flex; align-items:center; gap:7px; padding:8px 11px; border:1px solid rgba(255,255,255,.18); border-radius:10px; background:rgba(255,255,255,.09); font-size:10px; font-weight:800; }
.ai-count b { font-size:20px; }
.ai-insight-list { display:grid; gap:11px; margin-top:16px; }
.ai-insight { padding:17px 18px; border:1px solid #dce4ee; border-left:4px solid #7e8c9e; border-radius:13px; background:#fff; box-shadow:0 4px 14px rgba(6,47,112,.04); }
.ai-insight.high { border-left-color:#c33d37; }
.ai-insight.medium { border-left-color:#ed7b2f; }
.ai-insight.success { border-left-color:#0c8b70; }
.ai-insight.info { border-left-color:#0b58a2; }
.ai-insight-label { display:flex; justify-content:space-between; gap:10px; }
.ai-insight-label span { color:#6b4ab2; font-size:9px; font-weight:1000; letter-spacing:.08em; }
.ai-insight-label b { color:#8994a1; font-size:9px; }
.ai-insight h3 { margin:8px 0 6px; color:#1e3553; font-size:16px; }
.ai-insight > p { margin:0; color:#627287; line-height:1.65; }
.ai-insight > div:last-child { display:grid; grid-template-columns:auto 1fr; gap:8px; margin-top:13px; padding:10px 11px; border-radius:9px; background:#f4f7fa; }
.ai-insight > div:last-child strong { color:#17375f; font-size:10px; }
.ai-insight > div:last-child span { color:#5f7084; font-size:10px; line-height:1.5; }
.ai-method-note { display:flex; gap:11px; margin-top:16px; padding:14px; border:1px solid #e0e6ed; border-radius:12px; color:#6d7b8d; background:#f7f9fb; }
.ai-method-note > svg { width:21px; height:21px; flex:0 0 21px; stroke:#0b58a2; fill:none; }
.ai-method-note strong,.ai-method-note p,.ai-method-note small { display:block; }
.ai-method-note strong { color:#17375f; font-size:11px; }
.ai-method-note p { margin:4px 0; font-size:10px; line-height:1.5; }
.ai-method-note small { color:#919ca8; font-size:9px; }

/* 增加看板入口后压缩侧边栏间距，仍保持大按钮可点击性 */
.sidebar { padding-top:18px; padding-bottom:14px; }
.sidebar .company-brand { padding-bottom:17px; }
.nav-list { gap:4px; }
.nav-item { min-height:43px; }
.nav-divider { margin:8px 10px; }

@media (max-width:1280px) {
  .dashboard-kpi-grid.customer-kpis { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .rank-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-import-form { grid-template-columns:1fr; }
  .dashboard-import-form .upload-actions { min-width:0; }
}
@media (max-width:1050px) {
  .dashboard-kpi-grid,.dashboard-kpi-grid.six,.dashboard-kpi-grid.eight,.dashboard-kpi-grid.ten,.dashboard-kpi-grid.eleven,.dashboard-kpi-grid.customer-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-layout-main { grid-template-columns:1fr; }
  .live-panel .live-stat-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .live-stat-list p { grid-column:1/-1; }
  .employee-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .employee-live-column-head { display:none; }
  .employee-live-row { grid-template-columns:minmax(0,1fr) auto; gap:9px 14px; min-height:170px; align-items:start; }
  .employee-live-person { grid-column:1; grid-row:1; }
  .employee-live-status { display:block; grid-column:2; grid-row:1; }
  .employee-live-process { grid-column:1/-1; grid-row:2; }
  .employee-live-workload { grid-column:1; grid-row:3; }
  .employee-live-row > .employee-live-metric:not(.efficiency) { grid-column:2; grid-row:3; }
  .employee-live-tasks { grid-column:1/-1; grid-row:4; }
  .employee-live-metric.efficiency { grid-column:1/-1; grid-row:5; }
  .stage-card-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .customer-summary-row { grid-template-columns:1fr; }
  .dashboard-source-strip { grid-template-columns:1fr; }
  .dashboard-custom-filter { margin-left:0; }
}
@media (max-width:760px) {
  .packing-format-guide { align-items:stretch; flex-direction:column; }
  .packing-format-guide i { transform:rotate(90deg); align-self:center; }
  .packing-detection-strip { grid-template-columns:1fr 1fr; }
  .dashboard-control-panel { align-items:stretch; flex-direction:column; }
  .dashboard-range-buttons { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .dashboard-range-buttons button { width:100%; }
  .dashboard-custom-filter { display:grid; grid-template-columns:1fr 1fr; }
  .dashboard-custom-filter .button { grid-column:1/-1; }
  .dashboard-group-picker { justify-content:space-between; }
  .dashboard-tabs { grid-template-columns:1fr; }
  .dashboard-tabs button { justify-content:flex-start; padding-left:18px; }
  .dashboard-kpi-grid,.dashboard-kpi-grid.six,.dashboard-kpi-grid.eight,.dashboard-kpi-grid.ten,.dashboard-kpi-grid.eleven,.dashboard-kpi-grid.customer-kpis,.live-grid { grid-template-columns:1fr 1fr; }
  .operation-stage-grid,.anomaly-grid,.rank-grid { grid-template-columns:1fr; }
  .dashboard-chart { overflow:auto; }
  .dashboard-chart svg { min-width:650px; }
  .dashboard-no-data { align-items:flex-start; flex-direction:column; }
  .comparison-strip { grid-template-columns:1fr 1fr; }
  .employee-live-header { gap:10px; flex-direction:column; }
  .employee-live-summary { justify-content:flex-start; }
  .employee-live-toolbar { align-items:stretch; flex-direction:column; }
  .employee-live-toolbar > span { text-align:left; }
  .employee-live-date-filter { display:grid; grid-template-columns:1fr 1fr; align-items:end; }
  .employee-live-date-filter label { grid-column:1/-1; }
  .employee-live-date-filter input { width:100%; }
  .employee-summary-grid { grid-template-columns:1fr 1fr; }
  .employee-live-viewport,.employee-live-viewport.is-rolling { height:520px; padding:8px; }
  .employee-live-footer { flex-direction:column; }
  .employee-hourly-panel > div:first-child { align-items:flex-start; flex-direction:column; }
  .abc-cards { grid-template-columns:1fr; }
  .dashboard-import-list article { grid-template-columns:auto 1fr; }
  .dashboard-import-counts,.dashboard-import-list article > .badge { grid-column:2; }
  .drawer-overlay.ai-mode .drawer { padding:25px 18px 35px; }
}
@media (max-width:500px) {
  .dashboard-kpi-grid,.dashboard-kpi-grid.six,.dashboard-kpi-grid.eight,.dashboard-kpi-grid.ten,.dashboard-kpi-grid.eleven,.dashboard-kpi-grid.customer-kpis,.live-grid,.comparison-strip { grid-template-columns:1fr; }
  .dashboard-kpi { min-height:116px; }
  .dashboard-custom-filter { grid-template-columns:1fr; }
  .dashboard-custom-filter .button { grid-column:auto; }
  .live-panel .live-stat-list { grid-template-columns:1fr; }
  .employee-summary-grid,.employee-live-date-filter { grid-template-columns:1fr; }
  .employee-live-date-filter label { grid-column:auto; }
  .stage-card-head { grid-template-columns:auto 1fr; }
  .stage-card-head .rate-badge { grid-column:1/-1; justify-self:start; }
  .stage-card-metrics { grid-template-columns:1fr 1fr; }
  .dashboard-source-strip > div { grid-template-columns:auto 1fr; }
  .ai-analysis-head > div { align-items:stretch; flex-direction:column; }
}

/* V5.3 build marker: makes it immediately clear that the fee-optimized package is open. */
.edition-badge {
  display:flex; align-items:center; justify-content:center; gap:8px; margin:10px 14px 0;
  padding:7px 10px; border:1px solid rgba(255,255,255,.18); border-radius:999px;
  background:rgba(255,255,255,.09); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.edition-badge b { font-size:11px; letter-spacing:.08em; }
.edition-badge span { font-size:10px; font-weight:800; opacity:.92; }
.topbar-edition {
  display:inline-flex; align-items:center; min-height:25px; margin-left:9px; padding:4px 9px;
  border:1px solid #cddcf0; border-radius:999px; color:#0b4f96; background:#eef5ff;
  font-size:10px; font-weight:900; white-space:nowrap;
}
.dashboard-missing-banner {
  display:flex; align-items:flex-start; gap:12px; margin:0 0 16px; padding:13px 15px;
  border:1px solid #f1cf9f; border-left:4px solid #e67b22; border-radius:12px;
  background:#fff8ee; color:#72502f;
}
.dashboard-missing-banner > svg { width:22px; height:22px; flex:0 0 22px; stroke:#d66b19; fill:none; }
.dashboard-missing-banner strong { display:block; margin-bottom:3px; color:#784817; font-size:13px; }
.dashboard-missing-banner p { margin:0; font-size:11px; line-height:1.55; }
.dashboard-missing-banner .button { margin-left:auto; flex:0 0 auto; }
@media (max-width:760px) {
  .topbar-edition { display:none; }
  .dashboard-missing-banner { flex-wrap:wrap; }
  .dashboard-missing-banner .button { margin-left:34px; }
}

@media (prefers-reduced-motion: reduce) {
  .employee-live-track.rolling { animation:none; }
  .employee-live-viewport.is-rolling { overflow-y:auto; }
}

/* V5.3 pending-outbound replenishment basis */
.replenishment-basis-banner {
  display:flex; align-items:flex-start; gap:11px; margin:0 0 16px; padding:13px 15px;
  border:1px solid #bcded4; border-left:4px solid #0f9275; border-radius:12px;
  color:#28574d; background:linear-gradient(90deg,#eef9f6,#fbfefd);
}
.replenishment-basis-banner > svg { width:22px; height:22px; flex:0 0 22px; stroke:#0f9275; fill:none; }
.replenishment-basis-banner strong,.replenishment-basis-banner span { display:block; }
.replenishment-basis-banner strong { color:#185045; font-size:13px; }
.replenishment-basis-banner span { margin-top:4px; color:#5b716c; font-size:10px; line-height:1.55; }
.upload-grid.five-files { grid-template-columns:repeat(5,minmax(0,1fr)); }
.file-field.pending-file { border-color:#e4ae71; background:#fff9f1; }
.file-field.pending-file span { color:#975316; }
.pending-calculation-flow {
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:13px;
  padding:11px 13px; border:1px solid #dce5ed; border-radius:11px; color:#647589; background:#f5f8fb;
  font-size:10px; font-weight:850;
}
.pending-calculation-flow span,.pending-calculation-flow strong { padding:5px 9px; border-radius:8px; background:#fff; }
.pending-calculation-flow strong { color:#08755d; background:#ddf5ed; }
.pending-calculation-flow i { color:#0b58a2; font-size:15px; font-style:normal; font-weight:1000; }
.permission-note .button { margin-left:auto; flex:0 0 auto; }
@media (max-width:1350px) {
  .upload-grid.five-files { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .upload-grid.five-files { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  .upload-grid.five-files { grid-template-columns:1fr; }
  .pending-calculation-flow { justify-content:flex-start; }
  .permission-note .button { width:100%; margin:8px 0 0; justify-content:center; }
  .replenishment-basis-banner { padding:12px; }
}

.stock-deduction { color:#8b5a1f; font-weight:800; }

.custom-pack-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(90px, 1fr));
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px dashed rgba(11,57,125,.25);
  border-radius: 14px;
  background: rgba(11,57,125,.04);
}
.custom-pack-fields small {
  grid-column: 1 / -1;
  color: var(--muted);
  line-height: 1.5;
}
.single-scan-form {
  grid-template-columns: minmax(260px, 1fr) auto;
}
.fee-template-note {
  margin: 12px 18px 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(16,185,129,.08);
  color: var(--text);
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}
.fee-template-note span {
  color: var(--muted);
}
@media (max-width: 720px) {
  .custom-pack-fields,
  .single-scan-form {
    grid-template-columns: 1fr;
  }
}


/* V5.3.2 0723 correction: tracking-only packing and visible fee generation */
.custom-pack-fields.is-hidden { display:none; }
/* 通用隐藏：打印机名称的「手动输入」框平时收起来 */
.is-hidden { display:none !important; }
.fee-generation-proof {
  display:flex; flex-direction:column; justify-content:center; min-height:58px; padding:9px 13px;
  border:1px solid #aadfca; border-radius:12px; color:#075f48; background:#e9f8f2;
}
.fee-generation-proof b { font-size:12px; }
.fee-generation-proof span { margin-top:3px; font-size:11px; color:#31705e; }
.edition-badge b { white-space:nowrap; }
@media (max-width:900px) { .scan-choice-grid { grid-template-columns:1fr; } }

.packing-log-table { min-width:1900px; }
.fee-record-table { min-width:2150px; }
.fee-record-table td:last-child { min-width:460px; white-space:normal; line-height:1.6; }

/* V5.4.0 YunWMS data adapter */
.integration-center .panel-body { padding-top: 18px; }
.integration-status-strip { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:16px; padding:12px 14px; border:1px solid var(--border); border-radius:12px; background:var(--surface-soft, #f7f9fc); }
.integration-settings-form { display:grid; gap:14px; }
.integration-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; align-items:end; }
.integration-grid.wide { margin-top:12px; }
.integration-grid label { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:600; color:var(--muted); }
.integration-grid input,.integration-grid select,.integration-grid textarea,.integration-curl-card input,.integration-curl-card textarea,.integration-actions-grid input { width:100%; border:1px solid var(--border); border-radius:9px; padding:10px 11px; background:var(--surface); color:var(--text); font:inherit; }
.integration-grid textarea,.integration-curl-card textarea { resize:vertical; font-family:Consolas,"Courier New",monospace; font-size:12px; line-height:1.45; }
.integration-grid .span-2 { grid-column:span 2; }
.integration-cookie { grid-column:span 2; }
.integration-detail { border:1px solid var(--border); border-radius:12px; padding:0 14px 14px; background:var(--surface); }
.integration-detail summary { cursor:pointer; padding:13px 0; font-weight:700; color:var(--text); }
.integration-curl-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:18px; }
.integration-curl-card { border:1px dashed var(--border); border-radius:12px; padding:14px; display:grid; gap:9px; }
.integration-curl-card h4,.integration-history h4 { margin:0; }
.integration-curl-card p { margin:0; color:var(--muted); font-size:13px; }
.integration-actions-grid { display:grid; grid-template-columns:1fr 1.5fr 1.2fr; gap:12px; align-items:end; margin-top:16px; }
.integration-actions-grid form { display:flex; gap:8px; align-items:end; }
.integration-actions-grid button { min-height:42px; }
.integration-result { margin:16px 0 0; min-height:96px; max-height:360px; overflow:auto; white-space:pre-wrap; word-break:break-word; border:1px solid var(--border); border-radius:12px; padding:14px; background:#101827; color:#dce7ff; font:12px/1.55 Consolas,"Courier New",monospace; }
.integration-result.error { background:#2a1215; color:#ffd8dc; border-color:#8b3038; }
.integration-history { margin-top:18px; display:grid; gap:10px; }
.error-text { color:#b42318; }
@media (max-width: 1000px) {
  .integration-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .integration-actions-grid { grid-template-columns:1fr; }
  .integration-curl-grid { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
  .integration-grid { grid-template-columns:1fr; }
  .integration-grid .span-2,.integration-cookie { grid-column:span 1; }
  .integration-actions-grid form { flex-direction:column; align-items:stretch; }
}

/* V5.4.5 YunWMS direct-task fix and standalone connector */
.integration-browser-wizard {
  margin: 18px 0;
  border: 1px solid rgba(35, 143, 82, .28);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(237, 250, 243, .9), rgba(255,255,255,.98));
  overflow: hidden;
}
.integration-browser-wizard .panel-header.compact { padding: 16px 18px; }
.integration-browser-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 18px 18px;
}
.integration-browser-step {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 15px;
  border: 1px solid rgba(39, 67, 90, .13);
  border-radius: 12px;
  background: #fff;
}
.integration-browser-step b { font-size: 15px; }
.integration-browser-step span { min-height: 42px; color: var(--muted); line-height: 1.55; }
.integration-browser-step input { width: 100%; }
.integration-browser-status {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 18px;
  border-top: 1px solid rgba(39, 67, 90, .1);
  background: rgba(255,255,255,.72);
}
.integration-advanced { margin-top: 14px; }
@media (max-width: 900px) {
  .integration-browser-steps { grid-template-columns: 1fr; }
}

/* V5.4.5 YunWMS multi-interface center */
.integration-interface-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:4px; }
.integration-interface-heading h3,.integration-interface-heading p { margin:0; }
.integration-interface-heading p { margin-top:5px; color:var(--muted); font-size:13px; }
.integration-interface-list { display:grid; gap:12px; }
.integration-interface-card summary { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.integration-interface-summary { display:flex; align-items:center; gap:7px; margin-left:auto; }
.integration-interface-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:4px 0 2px; }
.integration-interface-toolbar-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.integration-interface-card [readonly] { background:var(--surface-soft, #f5f7fa); color:var(--muted); }
.integration-browser-steps.multi { grid-template-columns:repeat(3,minmax(0,1fr)); }
.integration-browser-step select,.integration-browser-step input,.integration-curl-single select,.integration-curl-single input,.integration-actions-grid.multi select {
  width:100%; border:1px solid var(--border); border-radius:9px; padding:10px 11px; background:var(--surface); color:var(--text); font:inherit;
}
.integration-curl-single { margin-top:8px; }
.integration-curl-single label { display:grid; gap:6px; color:var(--muted); font-size:13px; font-weight:600; }
.integration-actions-grid.multi { grid-template-columns:2fr 1fr; }
.integration-actions-grid.multi form:first-child { display:grid; grid-template-columns:minmax(180px,.8fr) minmax(220px,1.2fr) auto; }
.integration-actions-grid.multi form:last-child { justify-content:flex-end; }
@media (max-width: 1100px) {
  .integration-browser-steps.multi { grid-template-columns:1fr; }
  .integration-actions-grid.multi { grid-template-columns:1fr; }
  .integration-actions-grid.multi form:first-child { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
  .integration-interface-heading,.integration-interface-card summary,.integration-interface-toolbar { align-items:stretch; flex-direction:column; }
  .integration-interface-summary { margin-left:0; }
  .integration-interface-toolbar-actions { justify-content:flex-start; }
}

/* V5.5 background synchronization center */
.integration-v55-runtime{margin:0 0 24px;border:1px solid #d9e6f5;border-radius:18px;background:linear-gradient(180deg,#f7fbff,#fff);overflow:hidden}
.integration-v55-runtime>.panel-header{padding:18px 20px;border-bottom:1px solid #e6eef8}
#integration-runtime-status{padding:20px}
.integration-runtime-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.integration-runtime-head>div{display:grid;gap:6px}.integration-runtime-head strong{font-size:16px;color:#10233f}.integration-runtime-head small{color:#61718a}.integration-runtime-head>b{font-size:25px;color:#0b5da7}
.live-indicator.idle i{background:#57a773;box-shadow:0 0 0 4px rgba(87,167,115,.14)}
.integration-progress{height:12px;margin:16px 0 8px;border-radius:999px;background:#e7eef7;overflow:hidden}.integration-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0b5da7,#2d8be5);transition:width .3s ease}
.integration-progress-meta{display:flex;flex-wrap:wrap;gap:10px 22px;color:#61718a;font-size:12px}
.integration-dataset-grid,.integration-schedule-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:18px}
.integration-dataset-card,.integration-schedule-grid article{padding:13px;border:1px solid #dce7f4;border-radius:13px;background:#fff;display:grid;gap:4px}.integration-dataset-card.ready{border-color:#b9ddca;background:#f6fffa}.integration-dataset-card span,.integration-schedule-grid span{font-size:12px;color:#63738a}.integration-dataset-card strong,.integration-schedule-grid strong{font-size:18px;color:#17345b}.integration-dataset-card small,.integration-schedule-grid small{font-size:11px;color:#7b899d;line-height:1.4}
.integration-automation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0;padding:18px;border:1px solid #dce8f5;border-radius:15px;background:#f7fbff}.integration-automation-grid label{display:grid;gap:7px;font-size:12px;color:#52657f}.integration-automation-grid input{min-width:0}
.integration-actions-grid.v55{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:stretch}
.integration-actions-grid.v55 #integration-test-interface-form{display:grid;grid-template-columns:auto minmax(300px,1fr) minmax(190px,.45fr) auto auto;gap:10px;align-items:stretch;min-width:0}
.integration-actions-grid.v55 #integration-test-interface-form>*{min-width:0}
.integration-actions-grid.v55 #integration-test-interface-form .button{white-space:nowrap;padding-inline:15px}
.integration-manual-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:8px;width:100%}.integration-manual-buttons .button{white-space:normal;line-height:1.25;min-width:0}
@media(max-width:1200px){.integration-dataset-grid,.integration-schedule-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-automation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-actions-grid.v55 #integration-test-interface-form{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-actions-grid.v55 #integration-test-interface-form select{grid-column:1/-1}.integration-manual-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.integration-dataset-grid,.integration-schedule-grid,.integration-automation-grid{grid-template-columns:1fr}.integration-runtime-head{align-items:flex-start}.integration-progress-meta{display:grid}.integration-actions-grid.v55 #integration-test-interface-form,.integration-manual-buttons{grid-template-columns:1fr}.integration-actions-grid.v55 #integration-test-interface-form select{grid-column:auto}}

/* V5.6 FBA assistant */
.fba-tabs{display:flex;gap:10px;margin:0 0 18px;flex-wrap:wrap}.fba-tabs button{border:1px solid #d7e1ef;background:#fff;color:#304966;border-radius:12px;padding:11px 18px;font-weight:800;cursor:pointer}.fba-tabs button.active{background:#0d58a6;border-color:#0d58a6;color:#fff;box-shadow:0 8px 20px rgba(13,88,166,.18)}
.fba-work-panel{padding:22px}.fba-scan-line{display:grid;grid-template-columns:minmax(260px,1fr) auto;gap:14px;align-items:end;margin:16px 0}.fba-scan-line label,.fba-create-grid label,.fba-pallet-scan-box label{display:grid;gap:7px;font-weight:800;color:#263b55}.fba-scan-line input,.fba-create-grid input,.fba-create-grid select,.fba-pallet-scan-box input{border:2px solid #cbd8e8;border-radius:12px;min-height:48px;padding:10px 14px;font-size:17px;background:#fff}.fba-scan-line input:focus,.fba-pallet-scan-box input:focus{border-color:#0d58a6;box-shadow:0 0 0 4px rgba(13,88,166,.12);outline:0}
.fba-order-match{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:16px;background:#f4f8fd;border:1px solid #d7e3f1;border-radius:16px;margin:14px 0}.fba-order-match>div,.fba-outbound-status>div{display:grid;gap:5px}.fba-order-match span,.fba-outbound-status span{font-size:12px;color:#72829a}.fba-order-match strong,.fba-outbound-status strong{font-size:16px;color:#142b49;overflow-wrap:anywhere}.fba-create-grid{display:grid;grid-template-columns:minmax(160px,.5fr) minmax(250px,1fr) auto;gap:14px;align-items:end;padding:16px 0}
.fba-label-result{margin-top:18px;border-top:1px solid #e2e9f2;padding-top:18px}.fba-result-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:16px}.fba-result-head h4{font-size:21px;margin:0 0 5px}.fba-result-head p{margin:0;color:#6d7d93}.fba-label-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px}.fba-label-preview.a4{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.fba-label-card{background:#fff;border:2px solid #172436;border-radius:12px;min-height:340px;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden}.fba-label-brand{font-size:14px;font-weight:900;letter-spacing:1.6px}.fba-label-order{font-size:28px;font-weight:900;margin:7px 0 8px;overflow-wrap:anywhere}.fba-barcode{width:78%;max-width:260px;height:72px;fill:#000;display:block}.fba-label-code{font:14px Consolas,monospace;margin-top:4px;overflow-wrap:anywhere}.fba-label-index{font-size:22px;font-weight:800;margin-top:8px}.fba-label-index b{font-size:38px;margin-left:9px}.fba-label-meta{font-size:16px;font-weight:700;margin-top:6px;color:#3e4d61}
.fba-outbound-status{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;background:#f4f8fd;border:1px solid #d7e3f1;border-radius:16px;padding:16px;margin:14px 0}.fba-outbound-status strong{font-size:21px}.fba-pallet-progress{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 18px}.fba-pallet-progress span{min-width:58px;text-align:center;border:2px solid #d5deea;border-radius:10px;padding:9px;background:#fff;font-weight:800;color:#67758a}.fba-pallet-progress span.done{background:#e8f8ef;border-color:#2eaa67;color:#13733e}.fba-pallet-scan-box{display:grid;grid-template-columns:minmax(300px,1fr) auto auto;gap:12px;align-items:end;padding:18px;border:2px solid #0d58a6;border-radius:16px;background:#f7fbff}.fba-pallet-scan-box input{font-size:20px;font-weight:800;letter-spacing:.4px}.fba-complete-banner{display:flex;align-items:center;justify-content:center;gap:12px;padding:22px;border-radius:16px;background:#e6f8ed;color:#12713d;font-size:22px;font-weight:900;margin:18px 0}.fba-complete-banner svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:2}.fba-scan-list{margin-top:18px;border-top:1px solid #e2e9f2;padding-top:14px}.fba-scan-list h4{margin:0 0 10px}.fba-scan-list span{display:flex;align-items:center;gap:7px;padding:7px 0;color:#157543;font-weight:700}.fba-scan-list svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
.fba-scan-popup{position:fixed;inset:0;background:rgba(6,19,36,.55);display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px}.fba-scan-popup>div{width:min(520px,100%);border-radius:20px;background:#fff;padding:28px;text-align:center;box-shadow:0 24px 80px rgba(0,0,0,.28);border:5px solid #d9363e}.fba-scan-popup.complete>div,.fba-scan-popup.ok>div{border-color:#22a75b}.fba-scan-popup strong{display:block;font-size:28px;color:#c7202a;margin-bottom:12px}.fba-scan-popup.complete strong,.fba-scan-popup.ok strong{color:#16844a}.fba-scan-popup p{font-size:18px;line-height:1.6;color:#27364b}.fba-scan-popup button{min-width:130px;border:0;border-radius:10px;background:#173e72;color:#fff;font-weight:800;padding:12px 18px;cursor:pointer}
.integration-connection-guide{margin:18px 0;padding:18px;border:1px solid #dce5f0;border-radius:16px;background:#f8fbff}.integration-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.integration-guide-grid details{background:#fff;border:1px solid #dce5f0;border-radius:12px;padding:0 14px}.integration-guide-grid summary{cursor:pointer;padding:13px 0;font-weight:900;color:#173c6a}.integration-guide-grid p{margin:4px 0 8px;color:#52667f;line-height:1.55}.integration-guide-grid ol{margin:8px 0 15px;padding-left:20px;color:#52667f;line-height:1.65}
@media(max-width:900px){.fba-order-match{grid-template-columns:1fr 1fr}.fba-create-grid,.fba-pallet-scan-box{grid-template-columns:1fr}.fba-outbound-status{grid-template-columns:1fr 1fr}.integration-guide-grid{grid-template-columns:1fr}.fba-result-head{align-items:flex-start;flex-direction:column}}@media(max-width:620px){.fba-scan-line{grid-template-columns:1fr}.fba-order-match,.fba-outbound-status{grid-template-columns:1fr}.fba-label-preview{grid-template-columns:1fr}.fba-work-panel{padding:15px}}

/* V5.7 dual-warehouse isolation and live inbound scanning */
.warehouse-module-tabs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:12px 16px;border:1px solid #dbe7f4;border-radius:14px;background:#f7fbff}.warehouse-module-tabs>span{font-size:13px;font-weight:700;color:#5a6d85}.warehouse-module-tab{border:1px solid #bdd0e7;background:#fff;color:#174675;border-radius:10px;padding:9px 16px;font-weight:800;cursor:pointer}.warehouse-module-tab.active{background:#0a5aa6;color:#fff;border-color:#0a5aa6;box-shadow:0 5px 14px rgba(10,90,166,.18)}
.scan-lookup-form{display:grid;grid-template-columns:minmax(280px,1fr) auto auto;gap:14px;align-items:end}.scan-lookup-form label{display:grid;gap:7px;font-weight:700}.scan-lookup-form input{height:46px;border:1px solid #bdcce0;border-radius:10px;padding:0 14px;font-size:18px;font-weight:700;letter-spacing:.4px}.inbound-live-lookup,.receiving-live-lookup{border:1px solid #bcd5ef;background:linear-gradient(135deg,#fafdff,#edf7ff)}
@media(max-width:760px){.scan-lookup-form{grid-template-columns:1fr}.warehouse-module-tab{flex:1}}

/* V5.7.1 的货轮底图保留，但配合 Dark Warehouse OS Shell 重新调过：
   原来白色遮罩只有 .91，深色 Sidebar/Header 一上来，那张亮蓝照片就变成
   全屏最抢眼的东西，内容反而退到后面。现在加一层冷色叠加把它压成
   几乎看不见的水印 —— 背景永远不能压过内容，这是硬规矩。 */
.main-shell {
  background-color:#eff3f8;
  background-image:
    linear-gradient(rgba(239,243,248,.965),rgba(234,240,247,.975)),
    /* 与 Shell 同色系的极淡冷色罩，让左/上/右读起来是一套 */
    linear-gradient(160deg,rgba(7,20,38,.05),rgba(63,208,232,.03)),
    url('/static/fengzheng-ship.jpg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  background-attachment:fixed;
}
.login-story {
  background-position:center;
  background-size:cover;
}

/* =========================================================
   V5.9 数据库联动、补货修复与细分权限
   ========================================================= */
/* 这一条才是最终生效的那份主体背景（前面还有两条同名规则，改前面那两条
   不会有任何效果 —— 2026-09-05 我先改错了一条，记在这里免得下次再绕）。
   原来遮罩只有 .46，货轮照片几乎是原图亮度：深色 Shell 一上来，整屏最抢眼
   的变成那张照片，内容反而退到后面。现在压成低饱和冷色水印，
   并把底色收到与 Shell 同色系。 */
.main-shell {
  min-height:100vh;
  background-color:#eef3f9;
  background-image:
    linear-gradient(160deg,rgba(238,243,249,.955),rgba(232,239,248,.975)),
    linear-gradient(135deg,rgba(7,20,38,.05),rgba(63,208,232,.035)),
    url('/static/fengzheng-ship.jpg');
  background-position:center center;
  background-size:cover;
  background-attachment:fixed;
}
/* 玻璃拟态主题里的浅色顶栏同样让位给 Dark Shell */
.page-intro {
  padding:17px 20px;
  border:1px solid rgba(255,255,255,.50);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(247,252,255,.94),rgba(224,242,249,.88));
  box-shadow:0 10px 28px rgba(0,37,73,.15);
  backdrop-filter:blur(12px);
}
.page-intro h2 { color:#0d3156; }
.page-intro p { color:#45647c; }
.panel,.table-panel,.metric-card,.dashboard-control-panel,.dashboard-tabs,.dashboard-warehouse-tabs,.layer-scope-tabs,.slot-category-grid,.replenishment-basis-banner {
  box-shadow:0 10px 28px rgba(0,38,72,.10);
}
.dashboard-warehouse-tabs,.layer-scope-tabs {
  display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 14px; padding:8px;
  border:1px solid rgba(207,225,239,.95); border-radius:14px;
  background:rgba(241,248,252,.94); backdrop-filter:blur(10px);
}
.dashboard-warehouse-tabs button,.layer-scope-tabs button {
  min-height:38px; padding:0 17px; border:1px solid #c4d6e6; border-radius:10px;
  color:#275271; background:#fff; font-weight:900; cursor:pointer;
}
.dashboard-warehouse-tabs button.active,.layer-scope-tabs button.active {
  color:#fff; border-color:#086a91; background:linear-gradient(135deg,#0b77a4,#07527d);
  box-shadow:0 7px 17px rgba(4,83,123,.22);
}
.dashboard-kpi {
  width:100%; text-align:left; font:inherit; color:inherit; cursor:pointer;
}
.dashboard-kpi.clickable:hover { transform:translateY(-2px); border-color:#75a6c8; box-shadow:0 11px 24px rgba(6,72,112,.13); }
.abc-cards button {
  display:grid; grid-template-columns:auto 1fr; gap:3px 8px; padding:12px; border:1px solid transparent;
  border-radius:11px; background:#f3f6f9; text-align:left; cursor:pointer; font:inherit;
}
.abc-cards button:hover { border-color:#80aeca; transform:translateY(-1px); }
.abc-cards button.a b { background:#0b58a2; }
.abc-cards button.b b { background:#0c8b70; }
.abc-cards button.c b { background:#8b97a6; }
.detail-badge { border:0; cursor:pointer; }
.dashboard-detail-table { max-height:calc(100vh - 170px); overflow:auto; border:1px solid #dce6ef; border-radius:12px; }
.dashboard-detail-table th { position:sticky; top:0; z-index:2; background:#eaf3fa; }
.drawer-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; }
.drawer-head h2 { margin:0 0 5px; color:#153b60; }
.drawer-head p { margin:0; color:#718094; }
.integration-interface-card .permission-note { line-height:1.65; }
@media(max-width:760px){
  .dashboard-warehouse-tabs,.layer-scope-tabs{display:grid;grid-template-columns:1fr;}
  .drawer-head{align-items:flex-start;flex-direction:column;}
}

/* V5.9 船图颜色保留：业务卡片轻微透出海蓝背景，同时维持表格可读性。 */
.content { position:relative; }
.content::before {
  content:""; position:fixed; inset:86px 0 0 246px; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg,rgba(3,63,99,.08),rgba(1,83,113,.16));
}
.panel,.table-panel,.metric-card,.dashboard-control-panel,.integration-v55-runtime,.order-banner,.toolbar {
  background-color:rgba(248,252,255,.955);
  border-color:rgba(196,219,234,.94);
  backdrop-filter:blur(8px) saturate(1.08);
}
.metric-card,.dashboard-kpi { background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(235,247,252,.95)); }
.table-wrap table { background:rgba(255,255,255,.97); }
.table-wrap tbody tr:nth-child(even) { background:rgba(239,247,251,.7); }
@media(max-width:760px){.content::before{inset:70px 0 0 0}}
.clickable-rank{width:100%;border:0;background:transparent;text-align:left;font:inherit;color:inherit;cursor:pointer}.clickable-rank:hover,.clickable-stage:hover,.clickable-detail-row:hover{background:rgba(216,238,248,.72)!important}.clickable-stage,.clickable-detail-row{cursor:pointer;transition:.16s ease}.clickable-stage:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(4,78,113,.14)}

/* V5.9 inbound database assignment */
.inbound-assignment-editor{display:flex;gap:6px;align-items:center;min-width:260px}.inbound-assignment-editor input{min-width:155px;padding:8px 10px;border:1px solid rgba(35,72,118,.24);border-radius:8px;background:rgba(255,255,255,.9);font-weight:700}.inbound-assignment-editor input:disabled{background:rgba(230,238,248,.75);color:#51657d}
.user-module-permissions{grid-column:1/-1;border:1px solid rgba(35,72,118,.14);border-radius:12px;padding:12px;background:rgba(237,245,253,.7)}.user-module-permissions>strong{display:block;margin-bottom:8px}.module-permission-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}.module-permission-group{border:1px solid rgba(35,72,118,.12);border-radius:10px;padding:10px;background:rgba(255,255,255,.75)}.module-permission-group>label{font-weight:800}.module-permission-group .module-child{display:flex;gap:7px;align-items:center;margin-top:6px;font-size:13px}.module-permission-summary{max-width:420px;white-space:normal;color:#52657c;font-size:12px;line-height:1.45}

/* 账号列表的操作列：编辑权限 + 启用/停用并排，窄屏时自动换行 */
.user-row-actions{display:flex;flex-wrap:wrap;gap:6px}
/* 抽屉里的账号权限编辑表单。单列纵向排布，因为抽屉只有 510px 宽，
   两列会把模块勾选网格挤成一列一个字。 */
.user-edit-form{display:grid;gap:13px}
.user-edit-form>label{display:grid;gap:5px;font-weight:700;color:#2b4666}
.user-edit-form input,.user-edit-form select{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;font:inherit;background:#fff}
.user-edit-form>button[data-role-defaults]{justify-self:start}
.user-edit-form .user-module-permissions{grid-column:auto}
.user-edit-form .module-permission-grid{grid-template-columns:1fr}

/* V5.9 operational database bridge status */
.database-source-panel{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:12px 16px;border:1px solid rgba(18,75,132,.16);border-radius:14px;background:rgba(235,246,255,.9);box-shadow:0 8px 26px rgba(6,47,91,.06)}
.database-source-panel.connected{border-left:4px solid #16835b}.database-source-panel.waiting{border-left:4px solid #d38a18;background:rgba(255,248,232,.92)}
.database-source-panel .database-source-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#0b4b85;color:#fff;flex:0 0 auto}.database-source-panel svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8}
.database-source-panel>div{min-width:0;display:flex;flex-direction:column;gap:3px;flex:1}.database-source-panel strong{font-size:14px;color:#0c3157}.database-source-panel small{color:#5e738a;white-space:normal}.database-source-panel>b{font-size:18px;color:#0b4b85;white-space:nowrap}.database-source-panel .button{white-space:nowrap}
@media(max-width:800px){.database-source-panel{align-items:flex-start;flex-wrap:wrap}.database-source-panel .button{margin-left:50px}.database-source-panel>b{margin-left:auto}}

/* V5.11 飞书移除退件上架任务助手 */
.feishu-source-panel{margin-bottom:16px}.feishu-import-line{display:grid;grid-template-columns:minmax(320px,1fr) auto auto;gap:12px;align-items:end}.feishu-import-line label{display:grid;gap:6px;font-weight:700}.feishu-import-line input[type=file]{width:100%;padding:10px;border:1px solid #cfd9e8;border-radius:9px;background:rgba(255,255,255,.94)}.feishu-source-status{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:14px;padding:12px 14px;border-radius:10px;background:rgba(10,57,139,.06);font-size:13px}.feishu-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.feishu-summary-grid article{background:rgba(255,255,255,.9);border:1px solid rgba(23,75,139,.15);border-radius:14px;padding:16px;box-shadow:0 6px 22px rgba(10,35,70,.06)}.feishu-summary-grid span,.feishu-summary-grid small{display:block;color:#63748b}.feishu-summary-grid strong{display:block;font-size:28px;margin:5px 0;color:#0b397d}.feishu-batch-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.feishu-code-choice{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:800}.feishu-code-choice select{min-width:148px;padding:8px 34px 8px 10px;border:1px solid #bdcadb;border-radius:9px;background:#fff}.feishu-task-table .check-col{width:42px}.feishu-task-table td{vertical-align:top}.feishu-task-table .muted-row{opacity:.72;background:#f7f8fa}.feishu-sku-line{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px dashed #dbe3ef}.feishu-sku-line:last-child{border-bottom:0}.feishu-readable-code{font-family:Consolas,monospace}.feishu-thermal-label .fba-barcode{display:block;fill:#000}
@media(max-width:1000px){.feishu-summary-grid{grid-template-columns:1fr 1fr}.feishu-import-line{grid-template-columns:1fr 1fr}.feishu-import-line label{grid-column:1/-1}}@media(max-width:620px){.feishu-summary-grid,.feishu-import-line{grid-template-columns:1fr}.feishu-batch-actions{align-items:stretch;flex-direction:column}.feishu-batch-actions .button{width:100%}}
.feishu-source-status{background:rgba(10,57,125,.06)}
.integration-runtime-actions{display:flex!important;align-items:flex-end;justify-items:end;gap:8px}
.integration-runtime-actions>b{font-size:25px;color:#0b5da7;text-align:right}

/* V5.12 飞书移库位与收货拍照助手 */
.feishu-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}.feishu-tabs .sub-tab{border:1px solid rgba(20,71,136,.22);background:rgba(255,255,255,.8);color:#173f73;padding:10px 16px;border-radius:10px;font-weight:800;cursor:pointer}.feishu-tabs .sub-tab.active{background:#0d4c98;color:#fff;border-color:#0d4c98}.feishu-config-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.feishu-config-grid label{display:grid;gap:6px;font-weight:700}.feishu-config-grid input{width:100%}.feishu-config-grid .span-2{grid-column:1/-1}.feishu-field-map{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;border-radius:12px;background:rgba(9,58,126,.055)}.feishu-field-map>strong{grid-column:1/-1}.scan-workflow-panel{overflow:visible}.scan-two-step-form{display:grid;grid-template-columns:minmax(220px,1fr) 42px minmax(220px,1fr) auto;gap:12px;align-items:end}.scan-two-step-form label{display:grid;gap:7px;font-weight:800}.scan-two-step-form input{font-size:19px;font-family:Consolas,monospace;letter-spacing:.4px;padding:13px}.scan-arrow{font-size:26px;text-align:center;padding-bottom:12px;color:#0d4c98}.photo-intake-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center}.photo-drop{position:relative;display:grid;place-items:center;text-align:center;gap:5px;min-height:150px;border:2px dashed rgba(16,76,151,.35);border-radius:16px;background:rgba(255,255,255,.72);cursor:pointer;padding:20px}.photo-drop input{position:absolute;inset:0;opacity:0;cursor:pointer}.photo-drop strong{font-size:18px;color:#0b397d}.photo-drop strong svg{width:24px;height:24px;vertical-align:middle;margin-right:6px}.photo-drop span{color:#66778c}.receiving-review{border:1px solid rgba(20,93,155,.22)}.candidate-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0}.candidate-chips .chip{border:1px solid rgba(11,73,143,.22);background:#eef5ff;color:#123f79;border-radius:999px;padding:7px 11px;cursor:pointer}.ocr-preview{max-height:280px;overflow:auto;white-space:pre-wrap;background:#0e1b2c;color:#dcecff;padding:12px;border-radius:10px;font-size:11px}.form-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px}
@media(max-width:900px){.scan-two-step-form{grid-template-columns:1fr}.scan-arrow{transform:rotate(90deg);padding:0}.photo-intake-form{grid-template-columns:1fr}.feishu-config-grid,.feishu-field-map{grid-template-columns:1fr}.feishu-config-grid .span-2,.feishu-field-map>strong{grid-column:auto}}

/* V5.14 visible tracking and generic inbound number */
.feishu-one-click-panel{overflow:hidden}
.feishu-connected-card{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:14px 0 18px;padding:16px 18px;border:1px solid rgba(37,99,235,.2);border-radius:16px;background:linear-gradient(135deg,rgba(239,246,255,.96),rgba(255,255,255,.9))}
.feishu-connected-card>div:first-child{display:grid;gap:4px;min-width:0}.feishu-connected-card span{font-size:12px;color:#64748b}.feishu-connected-card strong{font-size:20px;color:#0f2f63}.feishu-connected-card small{color:#64748b;overflow-wrap:anywhere}.feishu-connected-actions{display:flex;gap:8px;flex-shrink:0}
.feishu-quick-connect-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.feishu-quick-connect-form label{display:grid;gap:7px}.feishu-quick-connect-form input{min-height:46px}.feishu-first-auth{border:1px solid rgba(15,47,99,.14);border-radius:14px;background:rgba(248,250,252,.78);padding:0 14px}.feishu-first-auth summary{cursor:pointer;padding:13px 0;font-weight:800;color:#0f2f63}.feishu-auth-grid{padding:0 0 14px}.feishu-connect-assurance{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px;border-radius:12px;background:rgba(15,47,99,.06);font-size:13px}.feishu-connect-assurance span{padding:5px 9px;border-radius:999px;background:#fff;border:1px solid rgba(15,47,99,.1)}
.feishu-auto-map{margin-top:18px;padding:15px;border-radius:14px;background:rgba(248,250,252,.82);border:1px solid rgba(15,47,99,.1)}.feishu-auto-map>div{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.mapping-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:10px;background:#fff;border:1px solid rgba(15,47,99,.12);font-size:12px}.mapping-chip b{color:#0f2f63}.feishu-auto-map small{color:#64748b}
.feishu-advanced-config{padding:0}.feishu-advanced-config>summary{cursor:pointer;padding:17px 20px;list-style-position:inside}.feishu-advanced-config>form{padding:0 20px 20px}
.button.large{min-height:46px;padding-left:24px;padding-right:24px;font-weight:800}
@media(max-width:760px){.feishu-quick-connect-form{grid-template-columns:1fr}.feishu-quick-connect-form .span-2{grid-column:auto}.feishu-connected-card{align-items:flex-start;flex-direction:column}.feishu-connected-actions{width:100%;flex-wrap:wrap}}

/* V5.15 专用飞书窗口连接 */
.feishu-browser-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}
.feishu-browser-steps article{display:grid;grid-template-columns:38px 1fr;column-gap:10px;align-items:center;padding:14px;border:1px solid rgba(21,83,154,.18);border-radius:14px;background:rgba(240,247,255,.82)}
.feishu-browser-steps article>b{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#0b5cab;color:#fff;font-size:17px}
.feishu-browser-steps article>span{font-weight:800;color:#12345b}.feishu-browser-steps article>small{color:#60758c;line-height:1.35}
.feishu-browser-status{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 16px}
.feishu-browser-status span{padding:8px 11px;border-radius:999px;background:rgba(11,92,171,.08);border:1px solid rgba(11,92,171,.13);color:#244b73}
.feishu-browser-actions{align-items:center;flex-wrap:wrap}
@media(max-width:900px){.feishu-browser-steps{grid-template-columns:1fr}.feishu-browser-actions .button{width:100%}}


/* V5.18 仓库看板全屏滚动模式 */
body.dashboard-fullscreen-open { overflow:hidden; }
.dashboard-fullscreen-overlay { position:fixed; inset:0; z-index:200; padding:18px; background:rgba(3,18,42,.92); backdrop-filter:blur(8px); }
.dashboard-fullscreen-shell { height:100%; display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(255,255,255,.18); border-radius:22px; background:#f4f8fb; box-shadow:0 28px 80px rgba(0,0,0,.42); }
.dashboard-fullscreen-top { flex:0 0 auto; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:18px 22px; color:white; background:linear-gradient(120deg,#062f70,#0b58a2); }
.dashboard-fullscreen-top span,.dashboard-fullscreen-top small { display:block; opacity:.82; font-size:11px; font-weight:800; letter-spacing:.08em; }
.dashboard-fullscreen-top strong { display:block; margin:4px 0; font-size:24px; }
.dashboard-fullscreen-top > div:last-child { display:flex; gap:9px; flex-wrap:wrap; }
.dashboard-fullscreen-scroll { flex:1 1 auto; overflow:auto; padding:18px 22px 34px; scroll-behavior:auto; }
.dashboard-fullscreen-body { display:grid; gap:16px; max-width:1680px; margin:0 auto; }
.dashboard-fullscreen-body .dashboard-kpi-grid { grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
.dashboard-fullscreen-body .dashboard-kpi-value strong { font-size:clamp(24px,2.4vw,44px); }
.dashboard-fullscreen-body .dashboard-chart-panel svg { min-height:330px; }
.dashboard-fullscreen-body .table-wrap { max-height:none; }
.dashboard-fullscreen-body .panel,.dashboard-fullscreen-body .dashboard-kpi,.dashboard-fullscreen-body .rank-panel,.dashboard-fullscreen-body .abc-panel,.dashboard-fullscreen-body .snapshot-panel { box-shadow:0 10px 28px rgba(6,47,112,.10); }
.dashboard-fullscreen-body .employee-live-viewport { max-height:520px; }
@media (max-width:900px){ .dashboard-fullscreen-overlay{padding:0}.dashboard-fullscreen-shell{border-radius:0}.dashboard-fullscreen-top{align-items:flex-start;flex-direction:column}.dashboard-fullscreen-scroll{padding:14px} }

/* ========================================================================== */
/* 客户异常明细 · 对比卡片与按天趋势                                          */
/* 全部沿用上面已有的 --teal/--red/--line 等变量，不引入新配色。              */
/* ========================================================================== */
.anomaly-group { margin-top: 22px; }
.anomaly-group > h3 {
  display: flex; align-items: baseline; gap: 10px;
  font-size: 15px; margin: 0 0 12px; padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.anomaly-group > h3 span { font-size: 12px; color: var(--muted); font-weight: 500; }

.anomaly-cards {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
}
.anomaly-card {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow);
  display: flex; flex-direction: column; gap: 10px;
}
.anomaly-card > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.anomaly-card > header > div { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.anomaly-card > header strong { font-size: 15px; }
.anomaly-why {
  margin: 0; font-size: 12.5px; line-height: 1.6; color: var(--muted);
  background: var(--line-soft); border-radius: 8px; padding: 8px 10px;
}
.anomaly-card > footer { margin-top: 2px; }

.delta { font-variant-numeric: tabular-nums; font-size: 14px; }
.delta.up   { color: var(--teal); }
.delta.down { color: var(--red); }
.delta.flat { color: var(--muted); }

.anomaly-metrics { display: flex; flex-direction: column; gap: 12px; }
.anomaly-metric-head {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12.5px; margin-bottom: 5px; color: var(--muted);
}
.anomaly-metric-head b { font-size: 12.5px; }
/* 条形：底色是槽，i 是长度，文字覆在上面 —— 长度即数值，一眼可比 */
.anomaly-bar {
  position: relative; height: 24px; border-radius: 6px;
  background: var(--line-soft); margin-bottom: 4px; overflow: hidden;
}
.anomaly-bar i {
  position: absolute; inset: 0 auto 0 0; display: block;
  background: var(--muted-2); opacity: .45; border-radius: 6px;
}
.anomaly-bar.current i { opacity: .9; background: var(--muted-2); }
.anomaly-bar.current.up i   { background: var(--teal); }
.anomaly-bar.current.down i { background: var(--red); }
.anomaly-bar span {
  position: relative; z-index: 1; display: block; padding: 0 9px;
  line-height: 24px; font-size: 12px; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ---------- 按天趋势 ---------- */
#anomaly-trend-host:empty { display: none; }
.trend-panel {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 12px; padding: 16px; margin-bottom: 18px; box-shadow: var(--shadow);
}
.trend-panel-head {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--line);
}
.trend-panel-head h3 { margin: 0; font-size: 15px; }
.trend-panel-head small { color: var(--muted); font-size: 12px; }
.trend-panel-head button { margin-left: auto; }

.trend-block + .trend-block { margin-top: 16px; }
.trend-head {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12.5px; margin-bottom: 6px;
}
.trend-head h4 { margin: 0; font-size: 13px; }
.trend-head span { color: var(--muted); font-variant-numeric: tabular-nums; }
.swatch {
  display: inline-block; width: 16px; height: 3px; border-radius: 2px;
  vertical-align: middle; margin-right: 4px;
}
.swatch.prev { background: var(--muted-2); }
.swatch.cur  { background: var(--teal); }

.trend-svg {
  width: 100%; height: 150px; display: block;
  background: var(--line-soft); border-radius: 8px;
}
.trend-svg .line { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; }
.trend-svg .line.prev { stroke: var(--muted-2); stroke-dasharray: 4 3; }
.trend-svg .line.cur  { stroke: var(--teal); }
.trend-axis {
  display: flex; justify-content: space-between;
  font-size: 11px; color: var(--muted); margin-top: 4px;
}

@media (max-width: 640px) {
  .anomaly-cards { grid-template-columns: 1fr; }
}

/* 业务形态占比条：一件代发 / FBA 两段。
   FBA 常常只占百分之几，渲染时给它最小宽度（见 app.js），
   否则细到看不见，会被误认为没渲染出来。 */
.mode-bar{display:flex;height:12px;border-radius:6px;overflow:hidden;background:var(--line);min-width:120px}
.mode-bar-drop{background:var(--teal);display:block}
.mode-bar-fba{background:var(--red);display:block}

/* 漏检审计里的「命中 / 未纳入」数字做成可点，点开列出到底是哪些客户。数字不能点等于没用 —— 用户看到「19 处未纳入」却不知道是谁。 */
.link-cell{border:0;background:transparent;font:inherit;color:inherit;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px;text-decoration-style:dotted}
.link-cell:hover{text-decoration-style:solid;color:#0b6ea8}

/* 「数据与规则」模块内部的页签（数据与规则 / 库位类型设定 / 在仓SKU属性）*/
.data-module-tabs { margin-bottom: 14px; }


/* 员工行上的 PDA 扫码覆盖率角标。公司要求全程用 PDA，扫一半就不扫的人
   只看效率反而排最前面，这个角标让违规看得见。 */
.scan-coverage { display:inline-block; margin:2px 0 0; padding:1px 7px; border-radius:9px;
  font-size:11px; font-weight:700; line-height:1.6; }
.scan-coverage.ok   { color:#1b6b3a; background:rgba(34,160,84,.14); }
.scan-coverage.warn { color:#8a5a00; background:rgba(230,150,20,.16); }
.scan-coverage.bad  { color:#9c2b21; background:rgba(192,57,43,.14); }

/* ── 飞书上架任务台账 / 扫码出标 / 打印机配置 ────────────────────────── */

.feishu-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:12px}
.feishu-stat-card{background:var(--surface-2,#f6f8fb);border:1px solid var(--border,#dfe4ec);border-radius:12px;
  padding:14px 16px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
.feishu-stat-card:hover,.feishu-stat-card:focus-visible{transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(20,40,80,.10);border-color:var(--accent,#2f6fed);outline:none}
.feishu-stat-card span{display:block;font-size:13px;color:var(--muted,#68758c)}
.feishu-stat-card strong{display:block;font-size:30px;line-height:1.15;margin:4px 0 2px}
.feishu-stat-card small{display:block;font-size:11px;color:var(--muted,#8b97ab)}
.feishu-stat-card.warn strong{color:#b7791f}
.feishu-stat-card.good strong{color:#1f8a53}

.feishu-stats-filter{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.feishu-stats-filter label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted,#68758c)}
.feishu-stats-filter input[type=date]{padding:6px 8px;border:1px solid var(--border,#dfe4ec);border-radius:8px}

/* 扫码结果：三种状态要一眼分得出，现场是低头扫码、抬头瞄一眼的节奏 */
.scan-result{display:flex;flex-direction:column;gap:4px;margin-top:12px;padding:14px 16px;
  border-radius:12px;border:1px solid transparent}
.scan-result b{display:flex;align-items:center;gap:6px;font-size:16px}
/* SVG 在 flex 里没有内在尺寸，不写死就会被拉伸到撑满整块 —— 2026-09-03
   现场那张截图里的黑色大三角就是这么来的。本文件里 .fba-scan-list svg 等
   几处都写了尺寸，唯独这里漏了。 */
.scan-result b svg{width:18px;height:18px;flex:0 0 auto;
  fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scan-result span{font-size:13px}
.scan-result.ok{background:#e9f7ef;border-color:#a9dfc0;color:#14532d}
.scan-result.warn{background:#fff6e5;border-color:#f0d19a;color:#7c4a03}
.scan-result.bad{background:#fdecea;border-color:#f2b8b5;color:#8a1c13}
.scan-confirm-list{display:flex;flex-direction:column;gap:2px;margin:6px 0;font-size:12px}
.scan-result .button{align-self:flex-start;margin-top:6px}

/* ── 模块日期回退提示 ──────────────────────────────────────────────
   只在某个模块当天没数据、退到更早日期时出现。不回退时完全不渲染。
   刻意做成轻量条而不是弹窗：它是「知会」不是「拦截」。 */
.module-date-banner{
  display:flex;flex-direction:column;gap:6px;
  margin:0 0 14px;padding:10px 14px;
  background:var(--warn-soft,#fff7e6);
  border:1px solid var(--warn-border,#ffd591);
  border-left:4px solid var(--warn-strong,#fa8c16);
  border-radius:8px;font-size:13px;line-height:1.5;
}
.module-date-banner strong{font-size:13px;color:var(--warn-strong,#ad6800);}
.module-date-banner>small{color:var(--text-muted,#6b7280);}
.module-date-list{display:flex;flex-wrap:wrap;gap:8px 18px;}
.module-date-list span{display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap;}
.module-date-list b{font-weight:600;color:var(--text-strong,#1f2937);}
.module-date-list small{color:var(--text-muted,#6b7280);}

/* 单张卡片上的小尾巴，跟在标题后面 */
.module-date-hint{
  display:inline-flex;align-items:baseline;gap:6px;
  margin-left:8px;padding:1px 8px;border-radius:10px;
  background:var(--warn-soft,#fff7e6);color:var(--warn-strong,#ad6800);
  font-size:12px;font-weight:500;white-space:nowrap;
}
.module-date-hint em{font-style:normal;color:var(--text-muted,#6b7280);font-weight:400;}

@media (max-width:768px){
  .module-date-banner{font-size:12px;padding:8px 10px;}
  .module-date-list{flex-direction:column;gap:4px;}
  .module-date-hint{margin-left:0;margin-top:4px;}
}

/* ── 数据质量面板 ────────────────────────────────────────────────── */
.dq-panel{margin-top:16px;}
.dq-table td,.dq-table th{vertical-align:top;}
.dq-value{white-space:nowrap;font-variant-numeric:tabular-nums;}
.dq-value b{font-size:15px;}
.dq-value small{margin-left:3px;color:var(--text-muted,#6b7280);}
.dq-unknown{color:var(--text-muted,#6b7280);font-weight:600;letter-spacing:.5px;}
.dq-reason{color:var(--text-muted,#6b7280);font-size:12px;line-height:1.5;}
.dq-source code{font-size:11px;color:var(--text-muted,#6b7280);word-break:break-all;}

@media (max-width:768px){
  .cockpit-kpi{padding:10px;}
  .cockpit-kpi-value{font-size:20px;}
  .dq-reason,.dq-source{display:none;}
}
@media (max-width:420px){
  .cockpit-kpi-value{font-size:18px;}
}

/* == 驾驶舱第一屏：三层，不是 11 张同权重的卡 ==================
   1440px 铺 9 列同级卡片，等于把「今天发了多少货」和「有几个整理任务」
   摆成一样重要。核心行做大，普通行次之，状态行最轻。 */
.cockpit-screen{display:flex;flex-direction:column;gap:10px;margin:0 0 16px;}
.cockpit-row{display:grid;gap:10px;}
.cockpit-core{grid-template-columns:repeat(4,1fr);}
.cockpit-normal{grid-template-columns:repeat(4,1fr);}
.cockpit-status{grid-template-columns:repeat(3,1fr);}

.cockpit-kpi{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  border-radius:10px;cursor:pointer;text-align:left;
  background:var(--surface,#fff);border:1px solid var(--border,#e5e7eb);
  border-left:4px solid var(--border,#e5e7eb);
  transition:box-shadow .15s ease,transform .15s ease;
}
.cockpit-kpi:hover{box-shadow:0 2px 10px rgba(0,0,0,.08);transform:translateY(-1px);}
.cockpit-kpi:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px;}
.cockpit-kpi.blue{border-left-color:#2563eb;}
.cockpit-kpi.green{border-left-color:#059669;}
.cockpit-kpi.orange{border-left-color:#f59e0b;}
.cockpit-kpi.red{border-left-color:#dc2626;}
.cockpit-kpi-label{color:var(--text-muted,#6b7280);line-height:1.3;}
.cockpit-kpi-value{font-weight:700;line-height:1.1;
  color:var(--text-strong,#111827);font-variant-numeric:tabular-nums;}
.cockpit-kpi-unit{color:var(--text-muted,#6b7280);}

/* 三层的权重差距靠尺寸拉开，不只靠颜色 */
.cockpit-kpi.is-core{padding:18px 20px;border-left-width:5px;}
.cockpit-kpi.is-core .cockpit-kpi-label{font-size:13px;}
.cockpit-kpi.is-core .cockpit-kpi-value{font-size:34px;}
.cockpit-kpi.is-core .cockpit-kpi-unit{font-size:13px;}
.cockpit-kpi.is-normal{padding:12px 14px;}
.cockpit-kpi.is-normal .cockpit-kpi-label{font-size:12px;}
.cockpit-kpi.is-normal .cockpit-kpi-value{font-size:22px;}
.cockpit-kpi.is-normal .cockpit-kpi-unit{font-size:12px;}
.cockpit-kpi.is-status{padding:10px 12px;background:var(--surface-soft,#f9fafb);}
.cockpit-kpi.is-status .cockpit-kpi-label{font-size:12px;}
.cockpit-kpi.is-status .cockpit-kpi-value{font-size:18px;}
.cockpit-kpi.is-status .cockpit-kpi-unit{font-size:11px;}

/* == 第二屏：趋势与结构 ======================================== */
.cockpit-screen-2{
  display:grid;gap:12px;margin:0 0 16px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
/* min-width:0 是关键：不给的话内容会把网格顶出横向溢出 */
.cockpit-panel{min-width:0;}
.cockpit-switches{display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.chip{
  padding:3px 10px;border-radius:12px;font-size:12px;cursor:pointer;
  background:var(--surface-soft,#f3f4f6);color:var(--text-muted,#6b7280);
  border:1px solid transparent;
}
.chip.active{background:var(--accent,#2563eb);color:#fff;font-weight:600;}
.chip:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px;}
.chip-sep{width:1px;height:14px;background:var(--border,#e5e7eb);margin:0 2px;}

.trend-chart{position:relative;padding:10px 0 0;}
.trend-chart svg{width:100%;height:120px;display:block;overflow:visible;}
.trend-line{fill:none;stroke:var(--accent,#2563eb);stroke-width:.8;
  vector-effect:non-scaling-stroke;stroke-linejoin:round;}
.trend-area{fill:var(--accent,#2563eb);opacity:.10;}
.trend-points{position:relative;height:0;}
.trend-point{position:absolute;top:-124px;width:14px;height:124px;
  transform:translateX(-7px);cursor:help;}
.trend-point.is-peak::after,.trend-point.is-nodata::after{
  content:"";position:absolute;left:5px;bottom:0;width:4px;height:4px;border-radius:50%;}
.trend-point.is-peak::after{background:var(--accent,#2563eb);}
/* 无数据画空心圈，与「真的是 0」区分开 */
.trend-point.is-nodata::after{background:transparent;border:1px solid var(--text-muted,#9ca3af);}
.trend-axis{display:flex;justify-content:space-between;align-items:center;
  margin-top:6px;font-size:11px;color:var(--text-muted,#6b7280);
  font-variant-numeric:tabular-nums;}
.trend-peak-label{color:var(--accent,#2563eb);font-weight:600;}
.chart-empty{padding:28px 0;text-align:center;color:var(--text-muted,#9ca3af);font-size:13px;}

.rank-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;}
.rank-bar-row{
  display:grid;width:100%;gap:2px 8px;padding:6px 8px;border-radius:6px;
  grid-template-columns:22px 1fr auto;align-items:baseline;
  background:none;border:0;cursor:pointer;text-align:left;
}
.rank-bar-row:hover{background:var(--surface-soft,#f9fafb);}
.rank-bar-row:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:-2px;}
.rank-index{color:var(--text-muted,#9ca3af);font-size:12px;font-weight:600;}
/* 长客户名换行而不是截断 —— 截了就看不出是谁 */
.rank-name{font-size:13px;color:var(--text-strong,#1f2937);
  overflow-wrap:anywhere;line-height:1.35;}
.rank-figure{white-space:nowrap;font-variant-numeric:tabular-nums;}
.rank-figure strong{font-size:14px;}
.rank-figure small{margin-left:2px;font-size:11px;color:var(--text-muted,#6b7280);}
.rank-track{grid-column:2 / -1;height:4px;border-radius:2px;
  background:var(--surface-soft,#f3f4f6);overflow:hidden;}
.rank-track i{display:block;height:100%;background:var(--accent,#2563eb);opacity:.55;}
.rank-sub{grid-column:2 / -1;font-size:11px;color:var(--text-muted,#6b7280);}

/* == 第三屏：经营异常中心 ====================================== */
.anomaly-grid{display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.anomaly-card{display:flex;flex-direction:column;gap:4px;padding:12px 14px;
  border-radius:10px;background:var(--surface,#fff);
  border:1px solid var(--border,#e5e7eb);border-left:4px solid var(--border,#e5e7eb);}
.anomaly-card.sev-high{border-left-color:#dc2626;}
.anomaly-card.sev-warn{border-left-color:#f59e0b;}
.anomaly-card.sev-low{border-left-color:#2563eb;}
.anomaly-card.sev-none{border-left-color:#d1d5db;}
.anomaly-head{display:flex;justify-content:space-between;align-items:center;gap:8px;}
.anomaly-label{font-size:13px;font-weight:600;color:var(--text-strong,#1f2937);}
.anomaly-sev{font-size:11px;padding:1px 8px;border-radius:10px;
  background:var(--surface-soft,#f3f4f6);color:var(--text-muted,#6b7280);}
.sev-high .anomaly-sev{background:#fee2e2;color:#b91c1c;}
.sev-warn .anomaly-sev{background:#fef3c7;color:#b45309;}
.anomaly-count{font-size:26px;font-weight:700;line-height:1.1;
  color:var(--text-strong,#111827);font-variant-numeric:tabular-nums;}
.anomaly-summary{margin:0;font-size:12px;line-height:1.5;
  color:var(--text-muted,#6b7280);overflow-wrap:anywhere;}
.anomaly-more{align-self:flex-start;margin-top:2px;padding:3px 10px;border-radius:6px;
  font-size:12px;cursor:pointer;background:var(--surface-soft,#f3f4f6);
  color:var(--accent,#2563eb);border:1px solid var(--border,#e5e7eb);}
.anomaly-more:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px;}

/* == 响应式 ==================================================== */
@media (max-width:1200px){
  .cockpit-screen-2{grid-template-columns:1fr;}
}
@media (max-width:1024px){
  .cockpit-core{grid-template-columns:repeat(2,1fr);}
  .cockpit-normal{grid-template-columns:repeat(2,1fr);}
  .cockpit-kpi.is-core .cockpit-kpi-value{font-size:28px;}
}
@media (max-width:768px){
  .cockpit-core,.cockpit-normal{grid-template-columns:repeat(2,1fr);}
  .cockpit-status{grid-template-columns:repeat(3,1fr);}
  .cockpit-kpi.is-core{padding:12px 14px;}
  .cockpit-kpi.is-core .cockpit-kpi-value{font-size:24px;}
  .cockpit-kpi.is-normal .cockpit-kpi-value{font-size:18px;}
  .cockpit-kpi.is-status .cockpit-kpi-value{font-size:16px;}
  .trend-chart svg{height:96px;}
  .trend-point{top:-100px;height:100px;}
  .anomaly-grid{grid-template-columns:repeat(2,1fr);}
  .dq-reason,.dq-source{display:none;}
}
@media (max-width:420px){
  .cockpit-core,.cockpit-normal{grid-template-columns:repeat(2,1fr);}
  .cockpit-status{grid-template-columns:1fr;}
  .cockpit-kpi.is-core .cockpit-kpi-value{font-size:22px;}
  .anomaly-grid{grid-template-columns:1fr;}
  .cockpit-switches{width:100%;}
  .rank-bar-row{grid-template-columns:20px 1fr auto;}
}

/* ══ UI V2 视觉降噪 ═══════════════════════════════════════════════
   页面主体不再压高对比仓库照片：深蓝大图 + 白字在数据密集的驾驶舱上
   会把注意力从数字上抢走，长时间看也累。照片降为顶部 Banner 的极淡水印。
   左侧导航已有 MATE Logo，顶部不再重复大型 Logo 图。 */
.brand-hero{
  min-height:auto;                       /* 原来 360px，纯占地方 */
  padding:16px clamp(16px,2.5vw,28px);
  margin:0 0 14px;
  border-radius:12px;
  background-color:var(--surface,#fff);
  /* 照片保留为极淡水印：8% 不透明度，只在右侧露出一点 */
  background-image:linear-gradient(90deg,
      var(--surface,#fff) 0%,
      var(--surface,#fff) 55%,
      rgba(255,255,255,.86) 100%),
    url('/static/fengzheng-logistics.jpg');
  background-repeat:no-repeat;
  background-position:center,right center;
  background-size:100% 100%,auto 130%;
  border:1px solid var(--border,#e5e7eb);
  box-shadow:none;                        /* 去掉那圈重阴影 */
}
.brand-hero::after{display:none;}         /* 底部红白条也一并撤掉 */
.brand-hero-copy{
  max-width:none;
  color:var(--text-strong,#1f2937);
  text-shadow:none;                       /* 浅底上不需要文字阴影 */
}
.brand-hero-copy > small{
  margin-top:0;color:var(--text-muted,#6b7280);
  font-size:11px;font-weight:700;letter-spacing:.14em;
}
.brand-hero-copy > p{
  max-width:none;margin:4px 0 0;
  color:var(--text-muted,#6b7280);font-size:13px;line-height:1.6;
}
.brand-hero-copy > span,
.brand-hero-copy > strong{display:none;}   /* 大字号标语挪走，驾驶舱不需要 */
.brand-hero-logo{display:none;}            /* 左侧已有 Logo，这里不重复 */

@media (max-width:768px){
  .brand-hero{
    padding:12px 14px;
    background-image:none;                 /* 手机上连水印都不要，省带宽也更干净 */
    background-color:var(--surface,#fff);
  }
  .brand-hero-copy > p{font-size:12px;}
}

/* ══ 归属率提示 / 员工 drawer / 表头 ⓘ ═══════════════════════════ */
.kpi-attribution{
  display:flex;flex-direction:column;gap:1px;margin-top:6px;
  font-size:11px;line-height:1.3;text-align:left;
}
.kpi-attribution em{font-style:normal;color:#b45309;font-weight:600;}
.kpi-attribution small{color:var(--text-muted,#6b7280);}

/* 计时规则只在表头出现一次，不再每行重复整段文字 */
.th-info{
  margin-left:4px;padding:0 3px;border:0;background:none;cursor:help;
  color:var(--text-muted,#9ca3af);font-size:12px;
}
.th-info:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:1px;}

.employee-drawer{
  margin:10px 0 0;padding:12px 14px;border-radius:10px;
  background:var(--surface-soft,#f9fafb);border:1px solid var(--border,#e5e7eb);
}
.drawer-head{display:flex;justify-content:space-between;align-items:center;
  gap:10px;margin-bottom:8px;}
.drawer-head strong{font-size:14px;}
.drawer-head small{margin-left:8px;color:var(--text-muted,#6b7280);font-size:12px;}
.drawer-close{padding:3px 12px;border-radius:6px;cursor:pointer;font-size:12px;
  background:var(--surface,#fff);border:1px solid var(--border,#e5e7eb);
  color:var(--text-muted,#6b7280);}
.drawer-close:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px;}
.drawer-table{width:100%;border-collapse:collapse;font-size:12px;}
.drawer-table th,.drawer-table td{padding:5px 8px;text-align:left;
  border-bottom:1px solid var(--border,#eef1f5);}
.drawer-table th{color:var(--text-muted,#6b7280);font-weight:600;}
.drawer-table code{font-size:11px;}
.drawer-timing{color:var(--text-muted,#6b7280);}
.drawer-empty{margin:0;color:var(--text-muted,#9ca3af);font-size:12px;}

@media (max-width:768px){
  .drawer-timing{display:none;}      /* 手机上藏计时依据，表头 ⓘ 仍可看 */
  .kpi-attribution{font-size:10px;}
}

/* 小时趋势的时间质量提示。两种计时精度不同，但不值得拆成两张图。 */
.time-quality{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;
  margin:2px 0 6px;padding:5px 10px;border-radius:8px;
  background:var(--surface-soft,#f9fafb);border:1px solid var(--border,#eef1f5);
  font-size:11px;line-height:1.4;cursor:help;
}
.time-quality b{color:var(--text-muted,#6b7280);font-weight:600;}
.time-quality em{font-style:normal;display:inline-flex;align-items:center;gap:4px;}
.time-quality em::before{content:"";width:6px;height:6px;border-radius:50%;}
.tq-app{color:#047857;}
.tq-app::before{background:#059669;}
.tq-fallback{color:#b45309;}
.tq-fallback::before{background:#f59e0b;}
@media (max-width:420px){ .time-quality{font-size:10px;} }

/* 从 innerHTML 模板里搬过来的固定样式。CSP 是 style-src 'self' 且无
   unsafe-inline，写在模板里的 style="" 会被静默丢弃、样式根本不生效，
   所以这些只能是类。动态尺寸不在这里，走 app.js 的 data-css-* + CSSOM。 */
.col-min-180{min-width:180px}
.col-min-160{min-width:160px}
.no-margin{margin:0}
.text-danger{color:#c0392b}
.field-grow{flex:1}
.gap-top-6{margin-top:6px}
.gap-top-8{margin:8px 0 0}

/* ══ FBA 作业：作业看板的独立第二版块 ═════════════════════════════
   与上方「一件代发 / 普通拣货」完全分开。用一条明显的分隔和独立标题
   把两块业务隔开 —— 混在一起看，迟早有人把 FBA 的件数算进拣货绩效。 */
.fba-section{
  margin-top:22px;padding-top:18px;
  border-top:2px solid var(--border,#e5e7eb);
}
.fba-heading{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.fba-heading h2{margin:0;font-size:17px;font-weight:700;color:var(--text-strong,#111827);}
.fba-heading small{color:var(--text-muted,#6b7280);font-size:12px;}

/* 第一行六项（任务总数/待下架/拣货中/待签出/已完成/备货完成率），第二行其余 */
.fba-row-1{grid-template-columns:repeat(6,1fr);}
.fba-row-2{grid-template-columns:repeat(6,1fr);}

.fba-grid{display:grid;gap:12px;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);margin-top:12px;}

/* 状态流：待下架 → 拣货中 → 待签出 → 已完成 */
.fba-flow{list-style:none;margin:0;padding:0;display:flex;align-items:stretch;gap:4px;}
.fba-flow li{display:flex;align-items:center;gap:4px;flex:1 1 0;min-width:0;}
.fba-node{
  flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;
  padding:10px 12px;border-radius:9px;cursor:pointer;text-align:left;
  background:var(--surface,#fff);border:1px solid var(--border,#e5e7eb);
  border-top:3px solid var(--border,#e5e7eb);
}
.fba-node:hover{box-shadow:0 2px 10px rgba(0,0,0,.08);}
.fba-node:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px;}
.fba-node.stage-unpicked{border-top-color:#9ca3af;}
.fba-node.stage-picking{border-top-color:#f59e0b;}
.fba-node.stage-ready{border-top-color:#2563eb;}
.fba-node.stage-shipped{border-top-color:#059669;}
.fba-node-label{font-size:12px;color:var(--text-muted,#6b7280);}
.fba-node-orders{font-size:22px;font-weight:700;line-height:1.1;
  color:var(--text-strong,#111827);font-variant-numeric:tabular-nums;}
.fba-node-orders small{margin-left:2px;font-size:11px;font-weight:500;color:var(--text-muted,#6b7280);}
.fba-node-pieces{font-size:11px;color:var(--text-muted,#6b7280);}
.fba-node-share{font-size:11px;font-weight:600;color:var(--accent,#2563eb);}
.fba-node-bar{display:block;height:3px;border-radius:2px;margin-top:4px;
  background:var(--surface-soft,#f3f4f6);overflow:hidden;}
.fba-node-bar i{display:block;height:100%;background:var(--accent,#2563eb);opacity:.5;}
.fba-arrow{color:var(--text-muted,#c4cad3);font-size:14px;flex:0 0 auto;}

.fba-flow-sum{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.fba-sum{
  padding:5px 12px;border-radius:8px;cursor:pointer;font-size:12px;
  background:var(--surface-soft,#f9fafb);border:1px solid var(--border,#e5e7eb);
  color:var(--text-muted,#6b7280);
}
.fba-sum strong{margin:0 2px;color:var(--text-strong,#1f2937);font-variant-numeric:tabular-nums;}
.fba-sum:hover{background:var(--surface,#fff);}
.fba-sum:focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px;}

.fba-notes{margin:8px 0 0;font-size:11px;line-height:1.6;color:var(--text-muted,#9ca3af);}

@media (max-width:1200px){
  .fba-grid{grid-template-columns:1fr;}
  .fba-row-1,.fba-row-2{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:768px){
  .fba-row-1,.fba-row-2{grid-template-columns:repeat(2,1fr);}
  /* 手机上状态流竖排，箭头转向下 */
  .fba-flow{flex-direction:column;}
  .fba-flow li{flex-direction:column;width:100%;}
  .fba-node{width:100%;}
  .fba-arrow{transform:rotate(90deg);}
  .fba-node-orders{font-size:18px;}
}
@media (max-width:420px){
  .fba-row-1,.fba-row-2{grid-template-columns:repeat(2,1fr);}
  .fba-heading h2{font-size:15px;}
}

/* ── 补货：建议 / 正式任务分区 ── */
.section-split-title{display:flex;align-items:baseline;gap:12px;margin:22px 0 10px;
  font-size:15px;font-weight:600;color:var(--ink,#131a1e)}
.section-split-title span{font-size:12.5px;font-weight:400;color:var(--muted,#5b6a72)}
.metric-card.clickable{cursor:pointer;transition:transform .12s,box-shadow .12s}
.metric-card.clickable:hover,.metric-card.clickable:focus-visible{
  transform:translateY(-1px);box-shadow:0 6px 18px -10px rgba(19,26,30,.4)}

.rep-task-card{border:1px solid var(--line,#dce3e6);border-radius:6px;margin:14px 0;
  padding:14px 16px;background:var(--surface,#fff)}
.rep-task-card header{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.rep-task-card header strong{font-size:15px}
.rep-task-card .pill{font-size:11px;padding:2px 8px;border-radius:10px;
  background:var(--surface-2,#edf1f3);color:var(--ink-2,#3c4a52)}
.rep-task-card .pill.muted{opacity:.75}
.rep-task-card .pill.warn{background:#f7efdc;color:#8e6c1c}
.rep-task-grid{display:grid;gap:8px 20px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  margin-bottom:12px}
.rep-task-grid i{display:block;font-style:normal;font-size:11.5px;color:var(--muted,#5b6a72)}
.rep-task-grid em{font-style:normal;font-size:11.5px;color:var(--muted,#5b6a72)}
.rep-alloc-title{font-size:12.5px;color:var(--muted,#5b6a72);margin:6px 0 6px}
.rep-task-times{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px;font-size:12px;
  color:var(--ink-2,#3c4a52)}
.rep-task-times i{display:inline;font-style:normal;color:var(--muted,#5b6a72);margin-right:5px}
.rep-task-card .pill.move{background:var(--primary-soft,#e2f0f3);color:var(--primary,#12697c);font-weight:600}

/* ── 补货：一层 / 高层两个现场队列 ── */
.rep-queue-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin:18px 0 14px}
.rep-queue-card{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:4px 18px;
  padding:16px 18px;border:1px solid var(--line,#dce3e6);border-radius:8px;background:var(--surface,#fff);
  cursor:pointer;text-align:left;font:inherit;color:inherit;transition:border-color .12s,box-shadow .12s}
.rep-queue-card:hover{border-color:var(--primary,#12697c)}
.rep-queue-card.active{border-color:var(--primary,#12697c);border-width:2px;
  box-shadow:0 4px 16px -8px rgba(18,105,124,.5)}
.rep-queue-card .q-title{grid-column:1;font-size:16px;font-weight:600}
.rep-queue-card .q-main,.rep-queue-card .q-sub{display:flex;flex-direction:column;align-items:center;line-height:1.15}
.rep-queue-card .q-main b{font-size:30px;font-weight:700;color:var(--primary,#12697c)}
.rep-queue-card .q-sub b{font-size:19px;font-weight:600}
.rep-queue-card i{font-style:normal;font-size:11.5px;color:var(--muted,#5b6a72)}
.rep-queue-panel{border:1px solid var(--line,#dce3e6);border-radius:8px;background:var(--surface,#fff);
  padding:16px 18px;margin-bottom:20px}
.rep-queue-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.rep-queue-head h3{margin:0 0 3px;font-size:16px}
.rep-queue-head p{margin:0;font-size:12.5px;color:var(--muted,#5b6a72);max-width:62ch}

/* 【PDA收货登记】是整页跳转，用 <a> 而不是 <button>，补齐链接自带的那几个样式差异 */
.feishu-tabs a.sub-tab{display:inline-block;text-decoration:none;font-size:inherit;font-family:inherit;line-height:normal}
.feishu-tabs a.sub-tab:hover{background:#0d4c98;color:#fff;border-color:#0d4c98}


/* ═══ 飞书集成任务中心 ═══════════════════════════════════════════════
 * 仓库运营控制台的观感：深色卡、细边框、大数字、小英文副标题、状态灯。
 * 克制使用发光——只有当前需要注意的卡才亮起来，否则整屏都在闪等于没有重点。
 */
.hub-wrap{background:#0b1620;border:1px solid #16303f;border-radius:16px;
  padding:16px;margin-bottom:8px}
.hub-head{background:linear-gradient(135deg,#0e2033 0%,#123047 55%,#0d2a3d 100%);
  border:1px solid #1d4562;border-radius:14px;padding:20px 24px;margin-bottom:18px;
  display:flex;flex-wrap:wrap;gap:20px;align-items:center;color:#eaf3f8}
.hub-head-id{margin-right:auto;min-width:0}
.hub-head-id h2{margin:0;font-size:23px;font-weight:800;letter-spacing:.3px;color:#fff}
.hub-head-id .en{display:block;font-size:11px;letter-spacing:.22em;color:#7fb4d4;
  margin-top:5px;font-weight:700}
.hub-head-id p{margin:9px 0 0;font-size:12.5px;color:#a8c6da;max-width:62ch;line-height:1.55}
.hub-stats{display:flex;gap:26px;flex-wrap:wrap}
.hub-stat{min-width:82px}
.hub-stat b{display:block;font-size:24px;font-weight:800;color:#fff;line-height:1.15;
  font-variant-numeric:tabular-nums}
.hub-stat span{display:block;font-size:11px;color:#8fb8d0;margin-top:4px;letter-spacing:.04em}
.hub-stat.warn b{color:#ffc66b}
.hub-stat.bad b{color:#ff8f7d}
.hub-stat small{display:block;font-size:10px;color:#6f97ae;margin-top:2px}

.hub-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;
  font-size:12px;font-weight:700;letter-spacing:.05em;border:1px solid transparent;white-space:nowrap}
.hub-pill i{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}
.hub-pill.online{background:rgba(63,191,127,.13);border-color:#2f7d57;color:#7fe0ae}
.hub-pill.online i{background:#3fbf7f;box-shadow:0 0 8px #3fbf7f}
.hub-pill.pending{background:rgba(224,168,60,.14);border-color:#8a6520;color:#f2c877}
.hub-pill.pending i{background:#e0a83c;box-shadow:0 0 8px #e0a83c}
.hub-pill.bad{background:rgba(224,92,74,.14);border-color:#8f3b2f;color:#ff9d8c}
.hub-pill.bad i{background:#e05c4a;box-shadow:0 0 8px #e05c4a}
.hub-pill.off{background:rgba(140,160,175,.12);border-color:#4a5c68;color:#a9bcc8}
.hub-pill.off i{background:#7f96a4}
.hub-gear{margin-left:10px;background:rgba(255,255,255,.08);border:1px solid #2a5878;
  color:#cfe6f4;border-radius:9px;padding:8px 13px;font-size:12.5px;font-weight:700;cursor:pointer}
.hub-gear:hover{background:rgba(255,255,255,.15);border-color:#3d7ba4}

.hub-note{font-size:11.5px;color:#8fb8d0;margin-top:10px;width:100%;
  border-top:1px solid rgba(125,175,205,.22);padding-top:10px;line-height:1.5}

/* ── 功能卡矩阵 ── */
.hub-grid{display:grid;gap:14px;margin-bottom:18px;
  grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1500px){.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.hub-grid{grid-template-columns:1fr}}
.hub-card{position:relative;background:#12212e;border:1px solid #1e3a4f;border-radius:13px;
  padding:17px 18px 15px;cursor:pointer;color:#e6f0f6;display:flex;flex-direction:column;
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}
.hub-card:hover{transform:translateY(-3px);border-color:#3b7ca6;
  box-shadow:0 10px 26px -14px rgba(0,0,0,.75),0 0 0 1px rgba(74,157,204,.25)}
.hub-card:focus-visible{outline:2px solid #4a9dcc;outline-offset:2px}
.hub-card.attention{border-color:#7d4436}
.hub-card-h{display:flex;align-items:flex-start;gap:11px;margin-bottom:14px}
.hub-card-h .ic{width:34px;height:34px;border-radius:9px;background:#173347;color:#6fb6e0;
  display:grid;place-items:center;flex:none}
.hub-card-h .ic svg{width:17px;height:17px}
.hub-card-t{min-width:0;flex:1}
.hub-card-t b{display:block;font-size:15px;font-weight:700;color:#fff;letter-spacing:.2px}
.hub-card-t span{display:block;font-size:10px;letter-spacing:.18em;color:#6f9ab5;
  margin-top:3px;font-weight:700}
.hub-badge{position:absolute;top:13px;right:13px;background:#7d2d22;color:#ffd9d1;
  border:1px solid #a8483a;border-radius:999px;padding:3px 9px;font-size:11px;font-weight:700}
.hub-badge:hover{background:#9c3a2b}
.hub-metrics{display:grid;grid-template-columns:1fr 1fr;gap:11px 8px;margin-bottom:13px}
.hub-metric b{display:block;font-size:21px;font-weight:800;line-height:1.1;color:#eaf4fa;
  font-variant-numeric:tabular-nums}
.hub-metric.ok b{color:#6ed6a4} .hub-metric.pending b{color:#f0c473}
.hub-metric.warn b{color:#f0c473} .hub-metric.bad b{color:#ff9484}
.hub-metric.none b{color:#5f7d8f;font-size:19px}
.hub-metric span{display:block;font-size:11px;color:#83a6bb;margin-top:3px}
.hub-metric.click{cursor:pointer;border-radius:6px;margin:-3px -5px;padding:3px 5px}
.hub-metric.click:hover{background:rgba(74,157,204,.14)}
.hub-svc{border-top:1px solid #1e3a4f;padding-top:10px;margin-top:auto;
  display:flex;flex-wrap:wrap;gap:5px 14px;align-items:center;font-size:11px;color:#83a6bb}
.hub-svc .s{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.hub-svc .s i{width:7px;height:7px;border-radius:50%;background:#3fbf7f;flex:none}
.hub-svc .s.pending i{background:#e0a83c} .hub-svc .s.bad i{background:#e05c4a}
.hub-svc .s.off i{background:#5f7d8f}
.hub-svc .go{margin-left:auto;color:#6fb6e0;font-weight:700;white-space:nowrap}
.hub-card:hover .go{color:#9ad4f2}
.hub-card:hover .go em{margin-left:6px;font-style:normal}
.hub-svc .go em{margin-left:3px;font-style:normal;transition:margin .14s ease}

/* ── 最近业务动态 ── */
.hub-feed{background:#12212e;border:1px solid #1e3a4f;border-radius:13px;overflow:hidden;
  margin-bottom:18px;color:#e6f0f6}
.hub-feed-h{padding:13px 17px;border-bottom:1px solid #1e3a4f;display:flex;
  align-items:baseline;gap:11px}
.hub-feed-h b{font-size:14px;color:#fff}
.hub-feed-h span{font-size:10px;letter-spacing:.18em;color:#6f9ab5;font-weight:700}
.hub-feed-h small{margin-left:auto;font-size:11px;color:#7fa3b8}
.hub-feed-row{display:grid;grid-template-columns:74px 88px 1fr auto;gap:12px;
  padding:9px 17px;border-top:1px solid #16293a;font-size:12.5px;align-items:center}
.hub-feed-row:first-child{border-top:0}
.hub-feed-row .tm{color:#7fa3b8;font-variant-numeric:tabular-nums;font-size:12px}
.hub-feed-row .md{color:#8fc0dc;font-size:11.5px}
.hub-feed-row .ti{color:#dceaf2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hub-feed-row .ti i{font-style:normal;color:#7fa3b8;margin-left:8px;font-size:11.5px}
.hub-feed-row .st{font-size:11.5px;white-space:nowrap}
.hub-feed-row .st.ok{color:#6ed6a4} .hub-feed-row .st.pending{color:#f0c473}
.hub-feed-row .st.bad{color:#ff9484}
.hub-feed-empty{padding:22px 17px;color:#7fa3b8;font-size:12.5px}

@media (max-width:640px){
  .hub-head{padding:16px}
  .hub-head-id h2{font-size:20px}
  .hub-stats{gap:16px}
  .hub-grid{grid-template-columns:1fr}
  .hub-feed-row{grid-template-columns:64px 1fr;gap:4px 10px}
  .hub-feed-row .md{grid-column:1} .hub-feed-row .ti{grid-column:2}
  .hub-feed-row .st{grid-column:2;justify-self:start}
}
@media (prefers-reduced-motion:reduce){.hub-card{transition:none}}


/* ── 指令类别看板 ── */
.ic-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  padding:0 2px 10px;margin-top:4px}
.ic-head b{font-size:15px;color:#fff}
.ic-head span{font-size:10px;letter-spacing:.18em;color:#6f9ab5;font-weight:700}
.ic-head .sum{margin-left:auto;display:flex;gap:18px;font-size:12px;color:#8fb8d0}
.ic-head .sum em{font-style:normal;color:#eaf4fa;font-weight:800;font-size:15px;
  margin-right:4px;font-variant-numeric:tabular-nums}
.ic-head .dq{color:#f0c473;cursor:pointer;border-bottom:1px dashed #8a6520}
.ic-head .dq:hover{color:#ffd894}

.ic-sync{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:0 2px 12px;margin-top:-4px;font-size:11.5px;color:#83a6bb}
.ic-sync .dot{width:7px;height:7px;border-radius:50%;background:#5f7d8f;flex:none}
.ic-sync .dot.ok{background:#3fbf7f;box-shadow:0 0 6px #3fbf7f}
.ic-sync .why{margin-left:auto;color:#6fb6e0;cursor:help;
  border-bottom:1px dashed #2a5878}
.ic-sync .cov{color:#6fb6e0;cursor:help}

.ic-grid{display:grid;gap:11px;margin-bottom:18px;
  grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1560px){.ic-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1120px){.ic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:820px){.ic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.ic-grid{grid-template-columns:1fr}}

.ic-card{position:relative;background:#12212e;border:1px solid #1e3a4f;border-radius:11px;
  padding:13px 14px 11px;cursor:pointer;color:#e6f0f6;
  transition:transform .13s ease,border-color .13s ease}
.ic-card:hover{transform:translateY(-2px);border-color:#3b7ca6}
.ic-card:focus-visible{outline:2px solid #4a9dcc;outline-offset:2px}
.ic-card.hot{border-color:#7a5a22}
.ic-card h4{margin:0 0 2px;font-size:13.5px;font-weight:700;color:#fff;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ic-card .en{display:block;font-size:9.5px;letter-spacing:.14em;color:#6f9ab5;
  font-weight:700;margin-bottom:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ic-nums{display:flex;gap:14px}
.ic-num{flex:1;min-width:0;border-radius:6px;padding:2px 4px;margin:-2px -4px;cursor:pointer}
.ic-num:hover{background:rgba(74,157,204,.14)}
.ic-num b{display:block;font-size:20px;font-weight:800;line-height:1.1;
  font-variant-numeric:tabular-nums;color:#f0c473}
.ic-num.done b{color:#6ed6a4}
.ic-num.none b{color:#5f7d8f;font-size:18px}
.ic-num span{display:block;font-size:10.5px;color:#83a6bb;margin-top:2px}
.ic-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-top:8px;padding-top:7px;border-top:1px solid #1a3245;
  font-size:10px;color:#6f8fa3;overflow:hidden}
.ic-foot .cov{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ic-foot .sync{display:flex;align-items:center;gap:5px;flex:none;white-space:nowrap}
.ic-foot .sync i{width:6px;height:6px;border-radius:50%;background:#5f7d8f;display:inline-block}
.ic-foot .sync i.ok{background:#3fbf7f}

/* ── Drawer ── */
.ic-mask{position:fixed;inset:0;background:rgba(4,10,15,.62);z-index:60}
.ic-drawer{position:fixed;top:0;right:0;bottom:0;width:min(760px,96vw);z-index:61;
  background:#0e1c27;border-left:1px solid #1e3a4f;color:#e6f0f6;
  display:flex;flex-direction:column}
.ic-dh{padding:16px 20px;border-bottom:1px solid #1e3a4f;display:flex;
  align-items:flex-start;gap:12px}
.ic-dh h3{margin:0;font-size:17px;color:#fff}
.ic-dh .en{display:block;font-size:10px;letter-spacing:.16em;color:#6f9ab5;
  font-weight:700;margin-top:3px}
.ic-dh button{margin-left:auto;background:#1b3243;border:1px solid #2a5878;color:#cfe6f4;
  border-radius:8px;padding:7px 13px;font-size:13px;cursor:pointer;flex:none}
.ic-dh button:hover{background:#254058}
.ic-tabs{display:flex;gap:8px;padding:12px 20px 0}
.ic-tab{background:#152836;border:1px solid #1e3a4f;color:#9dc0d6;border-radius:8px;
  padding:8px 14px;font-size:13px;cursor:pointer;font-weight:600}
.ic-tab.on{background:#1d3a4f;border-color:#3b7ca6;color:#fff}
.ic-search{padding:12px 20px 0}
.ic-search input{width:100%;padding:9px 12px;background:#0a151d;border:1px solid #1e3a4f;
  border-radius:8px;color:#e6f0f6;font:inherit;font-size:13px}
.ic-search input:focus{outline:none;border-color:#3b7ca6}
.ic-body{flex:1;overflow:auto;padding:12px 20px 20px}
.ic-note{font-size:11.5px;color:#7fa3b8;background:#122431;border:1px solid #1c3244;
  border-radius:8px;padding:10px 12px;margin-bottom:12px;line-height:1.55}
.ic-table{width:100%;border-collapse:collapse;font-size:12.5px}
.ic-table th{text-align:left;padding:8px 9px;color:#7fa3b8;font-size:10.5px;
  letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid #1e3a4f;
  position:sticky;top:0;background:#0e1c27;white-space:nowrap}
.ic-table td{padding:8px 9px;border-bottom:1px solid #16293a;vertical-align:top}
.ic-table tr:hover td{background:#132534}
.ic-table .mono{font-family:ui-monospace,Consolas,monospace;font-size:12px}
.ic-table .bad{color:#ff9484}
.ic-empty{padding:26px 4px;color:#7fa3b8;font-size:13px;line-height:1.6}
@media (prefers-reduced-motion:reduce){.ic-card{transition:none}}

/* ══════════════════════════════════════════════════════════════════════════
   智能打包控制台（2026-09-04 重做）
   ──────────────────────────────────────────────────────────────────────────
   上一版是把后台表单换了个蓝皮，信息架构没动，所以还是「KPI + input + 白卡」。
   这一版重做的是结构本身：

     顶部  一条 HUD：标题 + 系统状态灯 + 四个指标压成小格 + 数据引擎（可收起）
     左栏  深色控制台：状态行 → 巨型扫描靶区 → 五步决策链 → 手动匹配（弱化）
     右栏  决策面板：待机时 SYSTEM READY，命中后 BEST MATCH 深色大卡 + 线框箱
     底部  作业流水（不是表格）

   全部挂在 .packing-shell 下。metric-card / page-intro / database-source-panel
   是七八个模块共用的，一改就波及看板、收货、FBA。

   性能红线（扫码枪一秒十几个字符，主线程不能被装饰占着）：
     · 动画只有两处：状态灯 pulse、结果卡 180ms 淡入，都只动 opacity/transform
     · 没有 canvas / rAF / 3D 库 / 视频 / Lottie / 粒子
     · 没有 backdrop-filter；背景压暗用一层 fixed 纯色，不是 blur
     · 扫描线是 1px 线性渐变 + 极低 opacity，静态，不循环
     · 结果区不做等待动画 —— API 多快就多快显示
   ══════════════════════════════════════════════════════════════════════════ */
.packing-shell{
  --c-void:#061a33;        /* 控制台最深 */
  --c-deep:#0a2748;
  --c-deep-2:#103760;
  --c-edge:rgba(120,190,240,.16);
  --c-cyan:#3fd0f5;
  --c-cyan-dim:#1c7fa5;
  --c-ok:#2ed47a;
  --c-warn:#ffab3d;
  --c-bad:#ff6b5b;
  --c-txt:#e8f3fb;
  --c-txt-2:rgba(232,243,251,.62);
  --c-txt-3:rgba(232,243,251,.38);
  --c-r:14px; --c-r-s:10px;
  position:relative;
}
/* 背景压暗：直接给 shell 自己铺深色底，不用 fixed 遮罩。
   fixed 的包含块会被任何祖先的 transform/filter/contain 改掉，
   实测就是这么失效的；shell 自己的背景则一定生效。
   不用 blur —— 全屏 blur 会一直吃 GPU，扫码时不能给主线程添活。 */
.packing-shell{
  background:linear-gradient(180deg,#041226 0%,#061a33 60%,#04101f 100%);
  border-radius:var(--c-r); padding:12px;
  min-height:calc(100vh - 130px);
  box-shadow:inset 0 0 0 1px rgba(120,190,240,.10);
}
.packing-shell .mono{font-family:Consolas,"SF Mono",Menlo,monospace}

/* ══ 顶部 HUD ═════════════════════════════════════════════════════════ */
.packing-shell .hud{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:10px 14px; margin-bottom:10px;
  border:1px solid var(--c-edge); border-radius:var(--c-r);
  background:linear-gradient(180deg,rgba(16,55,96,.85),rgba(10,39,72,.85));
}
.packing-shell .hud-title{display:flex; align-items:baseline; gap:9px; min-width:0}
.packing-shell .hud-title b{font-size:17px; font-weight:800; color:var(--c-txt);
  letter-spacing:.6px; white-space:nowrap}
.packing-shell .hud-title small{font-size:11.5px; color:var(--c-txt-3);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
/* 系统状态灯：READY / PROCESSING / MATCHED / ERROR 四态，不看字也能分 */
.packing-shell .sysled{
  display:inline-flex; align-items:center; gap:7px; flex:none;
  font:800 11.5px/1 Consolas,monospace; letter-spacing:1.2px;
  padding:5px 11px; border-radius:999px; border:1px solid;
}
.packing-shell .sysled i{width:7px; height:7px; border-radius:50%; flex:none;
  animation:pk-led 2.2s ease-in-out infinite}
.packing-shell .sysled.ready{color:var(--c-cyan); border-color:rgba(63,208,245,.4);
  background:rgba(63,208,245,.1)}
.packing-shell .sysled.ready i{background:var(--c-cyan)}
.packing-shell .sysled.matched{color:var(--c-ok); border-color:rgba(46,212,122,.4);
  background:rgba(46,212,122,.1)}
.packing-shell .sysled.matched i{background:var(--c-ok); animation:none}
.packing-shell .sysled.error{color:var(--c-bad); border-color:rgba(255,107,91,.42);
  background:rgba(255,107,91,.1)}
.packing-shell .sysled.error i{background:var(--c-bad); animation:none}
@keyframes pk-led{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.packing-shell .sysled i{animation:none}}

/* 指标压成小格，不再是四张大白卡 */
.packing-shell .hud-stats{display:flex; gap:8px; margin-left:auto; flex-wrap:wrap}
.packing-shell .hud-stat{
  display:flex; align-items:baseline; gap:7px; padding:5px 11px;
  border-radius:var(--c-r-s); border:1px solid var(--c-edge);
  background:rgba(6,26,51,.5); white-space:nowrap;
}
.packing-shell .hud-stat span{font-size:11px; color:var(--c-txt-3)}
.packing-shell .hud-stat b{font-size:15px; font-weight:800; color:var(--c-txt);
  font-variant-numeric:tabular-nums}
.packing-shell .hud-stat.warn b{color:var(--c-warn)}
.packing-shell .hud-stat.bad b{color:var(--c-bad)}

/* 数据引擎：收成一行，点开才展开 */
.packing-shell .engine{
  border:1px solid var(--c-edge); border-radius:var(--c-r-s);
  background:rgba(6,26,51,.45); margin-bottom:10px; overflow:hidden;
}
.packing-shell .engine > summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; gap:9px;
  padding:7px 13px; font-size:11.5px; color:var(--c-txt-2);
}
.packing-shell .engine > summary::-webkit-details-marker{display:none}
.packing-shell .engine > summary::before{
  content:""; width:7px; height:7px; border-radius:50%; background:var(--c-ok);
  flex:none; animation:pk-led 2.6s ease-in-out infinite;
}
.packing-shell .engine.off > summary::before{background:var(--c-warn)}
.packing-shell .engine b{color:var(--c-txt); font-weight:800; letter-spacing:.8px;
  font-family:Consolas,monospace; font-size:11.5px}
.packing-shell .engine em{margin-left:auto; font-style:normal; color:var(--c-txt);
  font-variant-numeric:tabular-nums; font-weight:700}
.packing-shell .engine-body{padding:0 13px 11px; font-size:11.5px;
  color:var(--c-txt-3); display:flex; gap:10px; align-items:center; flex-wrap:wrap}

/* ══ 主体两栏 ═════════════════════════════════════════════════════════ */
.packing-shell .stage{display:grid; gap:12px; align-items:start}
.packing-shell .stage-main{min-width:0; display:grid; gap:12px}
.packing-shell .stage-side{min-width:0; display:grid; gap:12px; align-content:start}

/* 全局 .packing-scan-form 是三列 grid（旧表单布局），控制台里要按块排。
   input 的高度/描边也得压掉，不然会盖过靶区里的样式。 */
.packing-shell .packing-scan-form{display:block; margin:0; gap:0}
.packing-shell .packing-scan-form input{height:auto; border-width:1px}
.packing-shell .scan-submit{min-height:0}

/* ── 左：扫描控制台（深色设备面板）───────────────────────────────── */
.packing-shell .console{
  border:1px solid var(--c-edge); border-radius:var(--c-r); overflow:hidden;
  background:linear-gradient(180deg,var(--c-deep) 0%,var(--c-void) 100%);
}
.packing-shell .console-bar{
  display:flex; align-items:center; gap:10px; padding:9px 14px;
  border-bottom:1px solid var(--c-edge); background:rgba(16,55,96,.5);
}
.packing-shell .console-bar h3{margin:0; font:800 12px/1.2 Consolas,monospace;
  letter-spacing:2px; color:var(--c-cyan)}
.packing-shell .console-bar small{font-size:11px; color:var(--c-txt-3)}
.packing-shell .console-bar .tag{
  margin-left:auto; font:700 10.5px/1 Consolas,monospace; letter-spacing:1px;
  color:var(--c-txt-3); border:1px solid var(--c-edge); padding:4px 8px;
  border-radius:6px; white-space:nowrap;
}

/* 巨型扫描靶区 */
.packing-shell .target{
  margin:14px; padding:26px 18px; text-align:center; position:relative;
  border:2px dashed rgba(63,208,245,.34); border-radius:var(--c-r);
  background:radial-gradient(120% 90% at 50% 0%,rgba(63,208,245,.09),transparent 70%);
  transition:border-color .15s, box-shadow .15s;
}
/* 极低透明度的静态扫描线，纯 CSS，不循环 */
.packing-shell .target::after{
  content:""; position:absolute; left:8%; right:8%; top:50%; height:1px;
  background:linear-gradient(90deg,transparent,rgba(63,208,245,.5),transparent);
  opacity:.5; pointer-events:none;
}
.packing-shell .target:focus-within{
  border-style:solid; border-color:var(--c-cyan);
  box-shadow:0 0 0 4px rgba(63,208,245,.14), inset 0 0 30px rgba(63,208,245,.06);
}
.packing-shell .target.matched{border-style:solid; border-color:rgba(46,212,122,.6);
  background:radial-gradient(120% 90% at 50% 0%,rgba(46,212,122,.10),transparent 70%)}
.packing-shell .target.matched::after{background:linear-gradient(90deg,transparent,
  rgba(46,212,122,.5),transparent)}
/* 条码图标：纯 CSS 竖条 */
.packing-shell .bcode{
  width:76px; height:34px; margin:0 auto 12px; border-radius:2px;
  background:repeating-linear-gradient(90deg,
    var(--c-cyan) 0 3px, transparent 3px 6px, var(--c-cyan) 6px 8px,
    transparent 8px 13px, var(--c-cyan) 13px 15px, transparent 15px 19px);
  opacity:.8;
}
.packing-shell .target.matched .bcode{background:repeating-linear-gradient(90deg,
  var(--c-ok) 0 3px, transparent 3px 6px, var(--c-ok) 6px 8px,
  transparent 8px 13px, var(--c-ok) 13px 15px, transparent 15px 19px)}
.packing-shell .target-label{
  font:800 11px/1 Consolas,monospace; letter-spacing:2.4px; color:var(--c-cyan);
  opacity:.8; margin-bottom:12px;
}
.packing-shell .target.matched .target-label{color:var(--c-ok)}
/* 真实 input 还在，只是长得不像输入框 */
.packing-shell .target input[name="trackingNo"]{
  display:block; width:100%; max-width:520px; margin:0 auto; padding:12px;
  min-height:58px; text-align:center; border-radius:var(--c-r-s);
  border:1px solid var(--c-edge); background:rgba(4,18,38,.6);
  font:800 23px/1.25 Consolas,"SF Mono",Menlo,monospace; letter-spacing:1.5px;
  color:var(--c-txt); caret-color:var(--c-cyan);
}
.packing-shell .target input[name="trackingNo"]::placeholder{
  color:var(--c-txt-3); font-size:15px; letter-spacing:.5px; font-weight:600}
.packing-shell .target input[name="trackingNo"]:focus{outline:none;
  border-color:var(--c-cyan)}
.packing-shell .target input[name="trackingNo"][readonly]{
  color:var(--c-ok); border-color:rgba(46,212,122,.45)}
.packing-shell .target-hint{margin-top:11px; font:700 10.5px/1 Consolas,monospace;
  letter-spacing:1.6px; color:var(--c-txt-3)}

/* 五步决策链 */
.packing-shell .chain{
  display:grid; grid-template-columns:repeat(5,1fr); gap:6px;
  padding:0 14px 12px;
}
.packing-shell .link{
  display:grid; gap:5px; justify-items:center; padding:9px 4px;
  border-radius:var(--c-r-s); border:1px solid var(--c-edge);
  background:rgba(6,26,51,.45); min-width:0;
}
.packing-shell .link i{
  width:9px; height:9px; border-radius:50%; background:rgba(232,243,251,.2);
  border:1px solid rgba(232,243,251,.28); flex:none;
}
.packing-shell .link span{font-size:10.5px; color:var(--c-txt-3); text-align:center;
  line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:100%}
.packing-shell .link.on{border-color:rgba(46,212,122,.45);
  background:rgba(46,212,122,.09)}
.packing-shell .link.on i{background:var(--c-ok); border-color:var(--c-ok);
  box-shadow:0 0 6px rgba(46,212,122,.6)}
.packing-shell .link.on span{color:var(--c-ok)}
.packing-shell .link.fail{border-color:rgba(255,107,91,.45);
  background:rgba(255,107,91,.09)}
.packing-shell .link.fail i{background:var(--c-bad); border-color:var(--c-bad)}
.packing-shell .link.fail span{color:var(--c-bad)}

/* 手动匹配：弱化成备用入口 */
.packing-shell .console-foot{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:0 14px 14px;
}
.packing-shell .console-foot .scan-submit,
.packing-shell .console-foot .button{
  flex:none; padding:7px 14px; font-size:12px; font-weight:700; border-radius:8px;
  background:rgba(255,255,255,.06); border:1px solid var(--c-edge);
  color:var(--c-txt-2); box-shadow:none;
}
.packing-shell .console-foot .button:hover:not(:disabled),
.packing-shell .console-foot .scan-submit:hover:not(:disabled){
  background:rgba(63,208,245,.14); color:var(--c-cyan); border-color:var(--c-cyan)}
.packing-shell .console-foot .scan-submit:disabled{opacity:.4}
/* 窄屏下全局把 .button 拉成 100%，会让「手动匹配」看着像主操作 ——
   这个按钮只是备用入口，必须小。 */
.packing-shell .console-foot .button,
.packing-shell .console-foot .scan-submit{width:auto; min-width:0}
.packing-shell .console-foot em{font-style:normal; font-size:11px;
  color:var(--c-txt-3); margin-left:auto}

/* ── 右：智能决策面板 ─────────────────────────────────────────────── */
.packing-shell .panel-idle{
  border:1px solid var(--c-edge); border-radius:var(--c-r);
  background:rgba(6,26,51,.45); padding:34px 18px; text-align:center;
}
.packing-shell .panel-idle b{display:block; font:800 13px/1 Consolas,monospace;
  letter-spacing:2.4px; color:var(--c-cyan); margin-bottom:8px}
.packing-shell .panel-idle small{font-size:12px; color:var(--c-txt-3)}

.packing-shell .facts{
  border:1px solid var(--c-edge); border-radius:var(--c-r);
  background:rgba(6,26,51,.45); overflow:hidden;
}
.packing-shell .facts h4{margin:0; padding:9px 13px; font:800 11px/1 Consolas,monospace;
  letter-spacing:2px; color:var(--c-txt-3); border-bottom:1px solid var(--c-edge)}
.packing-shell .facts dl{margin:0; display:grid; grid-template-columns:1fr 1fr;
  gap:1px; background:var(--c-edge)}
.packing-shell .facts .cell{background:rgba(6,26,51,.9); padding:10px 13px;
  display:grid; gap:2px; min-width:0}
.packing-shell .facts dt{font-size:10.5px; color:var(--c-txt-3);
  letter-spacing:.4px}
.packing-shell .facts dd{margin:0; font-size:17px; font-weight:800; color:var(--c-txt);
  font-variant-numeric:tabular-nums; word-break:break-all}
.packing-shell .facts dd.sm{font-size:13px; font-weight:700}

/* BEST MATCH：全页最强焦点 */
.packing-shell .best{
  border:1px solid rgba(63,208,245,.4); border-radius:var(--c-r); overflow:hidden;
  background:linear-gradient(160deg,var(--c-deep-2) 0%,var(--c-void) 100%);
  box-shadow:0 0 0 1px rgba(63,208,245,.08), 0 10px 30px rgba(2,12,26,.5);
  animation:pk-in .18s ease-out;
}
@keyframes pk-in{from{opacity:0; transform:scale(.985)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){.packing-shell .best{animation:none}}
.packing-shell .best-bar{
  display:flex; align-items:center; gap:8px; padding:8px 14px;
  background:rgba(63,208,245,.14); border-bottom:1px solid rgba(63,208,245,.24);
  font:800 11px/1 Consolas,monospace; letter-spacing:2.4px; color:var(--c-cyan);
}
.packing-shell .best-body{display:flex; gap:14px; align-items:center; padding:16px 14px}
.packing-shell .best-copy{flex:1; min-width:0}
.packing-shell .best-name{font-size:31px; font-weight:800; color:#fff;
  letter-spacing:.5px; line-height:1.1; word-break:break-all}
.packing-shell .best-size{margin-top:4px; font:700 13px/1.3 Consolas,monospace;
  color:var(--c-cyan)}
.packing-shell .best-meta{margin-top:9px; display:flex; gap:8px; flex-wrap:wrap}
.packing-shell .best-meta span{font-size:11px; color:var(--c-txt-2);
  border:1px solid var(--c-edge); border-radius:6px; padding:3px 8px;
  font-variant-numeric:tabular-nums}
.packing-shell .best-meta span b{color:var(--c-txt); font-weight:800}
.packing-shell .wire{flex:none; width:92px; height:92px}
.packing-shell .best-note{padding:9px 14px; border-top:1px solid var(--c-edge);
  font-size:11.5px; color:var(--c-txt-2)}
.packing-shell .best.none{border-color:rgba(255,171,61,.45);
  background:linear-gradient(160deg,#5a3410,#2c1806)}
.packing-shell .best.none .best-bar{background:rgba(255,171,61,.16);
  border-bottom-color:rgba(255,171,61,.3); color:var(--c-warn)}
.packing-shell .best.none .best-size{color:var(--c-warn)}

/* ══ 底部作业流水（不是表格）══════════════════════════════════════════ */
.packing-shell .stream{
  border:1px solid var(--c-edge); border-radius:var(--c-r);
  background:rgba(6,26,51,.45); overflow:hidden; margin-top:12px;
}
.packing-shell .stream h4{margin:0; padding:9px 13px; font:800 11px/1 Consolas,monospace;
  letter-spacing:2px; color:var(--c-txt-3); border-bottom:1px solid var(--c-edge);
  display:flex; align-items:center; gap:8px}
.packing-shell .stream h4 a{margin-left:auto; color:var(--c-cyan); font-size:11px;
  letter-spacing:0; cursor:pointer; font-family:inherit}
.packing-shell .flowrow{
  display:grid; grid-template-columns:auto minmax(0,1.4fr) minmax(0,1fr) auto;
  gap:12px; align-items:center; padding:9px 13px;
  border-top:1px solid rgba(120,190,240,.08); font-size:12.5px;
}
.packing-shell .flowrow:first-of-type{border-top:none}
.packing-shell .flowrow time{font:600 11.5px/1 Consolas,monospace; color:var(--c-txt-3)}
.packing-shell .flowrow .trk{font-family:Consolas,monospace; color:var(--c-txt);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.packing-shell .flowrow .box{color:var(--c-cyan); font-weight:700;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.packing-shell .flowrow .st{font-size:11px; font-weight:800; color:var(--c-ok);
  white-space:nowrap}
.packing-shell .stream .none{padding:16px 13px; font-size:12px; color:var(--c-txt-3);
  text-align:center}

/* ══ 结果明细（SKU 表）：深色化，保留原表格结构 ═══════════════════════ */
.packing-shell .packing-result{
  border:1px solid var(--c-edge); border-radius:var(--c-r); overflow:hidden;
  background:rgba(6,26,51,.5); display:block; padding:0;
}
.packing-shell .packing-result.error{padding:16px; border-color:rgba(255,171,61,.5)}
.packing-shell .packing-result.error h3{color:var(--c-warn)}
.packing-shell .packing-result.error p{color:var(--c-txt-2)}
.packing-shell .res-bar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:10px 14px;
  border-bottom:1px solid var(--c-edge); background:rgba(16,55,96,.4);
}
.packing-shell .res-bar h3{margin:0; font:800 15px/1.2 Consolas,monospace;
  color:var(--c-txt); letter-spacing:.5px}
.packing-shell .res-bar p{margin:0; width:100%; font-size:11.5px; color:var(--c-txt-3)}
.packing-shell .reason-box{margin:12px 14px 0; padding:9px 12px; border-radius:var(--c-r-s);
  background:rgba(63,208,245,.09); border:1px solid var(--c-edge);
  font-size:12px; color:var(--c-txt-2)}
.packing-shell .reason-box.warning{background:rgba(255,171,61,.1);
  border-color:rgba(255,171,61,.32); color:var(--c-warn)}
.packing-shell .reason-box b{color:var(--c-txt)}
.packing-shell .packing-result .table-wrap{margin:12px 14px}
.packing-shell .packing-result table{color:var(--c-txt-2); font-size:12.5px}
.packing-shell .packing-result thead th{position:sticky; top:0; z-index:1;
  background:rgba(16,55,96,.95); color:var(--c-txt-3); border-bottom:1px solid var(--c-edge);
  font-size:11px; letter-spacing:.5px}
.packing-shell .packing-result tbody td{border-bottom:1px solid rgba(120,190,240,.08)}
.packing-shell .packing-result tbody tr:hover{background:rgba(63,208,245,.05)}
.packing-shell .packing-result tbody strong{color:var(--c-txt)}
.packing-shell .packing-choice-grid{padding:0 14px 14px; display:grid; gap:10px}
.packing-shell .packing-choice-grid label{display:grid; gap:5px; font-size:11.5px;
  color:var(--c-txt-3)}
.packing-shell .packing-choice-grid select,
.packing-shell .packing-choice-grid input{
  background:rgba(4,18,38,.6); border:1px solid var(--c-edge); color:var(--c-txt);
  border-radius:8px; padding:9px 10px; font-size:13px}
.packing-shell .fee-generation-proof{display:flex; gap:8px; align-items:baseline;
  font-size:11.5px; color:var(--c-txt-3)}
.packing-shell .fee-generation-proof b{color:var(--c-txt)}
.packing-shell [data-pack-save]{
  background:linear-gradient(180deg,#2ed47a,#1ba85c); border:none; color:#04240f;
  font-weight:800; padding:12px; border-radius:10px; justify-content:center}
.packing-shell .custom-pack-fields{display:grid;
  grid-template-columns:repeat(3,1fr); gap:8px; align-items:end}
.packing-shell .custom-pack-fields small{grid-column:1/-1; font-size:11px;
  color:var(--c-txt-3)}
.packing-shell .custom-pack-fields.is-hidden{display:none}

/* ══ 其它页签（订单 / 记录 / 费用 / 包材）：深色统一 ═══════════════════ */
.packing-shell .page-intro{
  border:1px solid var(--c-edge); border-radius:var(--c-r); padding:12px 14px;
  background:linear-gradient(180deg,rgba(16,55,96,.85),rgba(10,39,72,.85));
  margin-bottom:10px}
.packing-shell .page-intro h2{color:var(--c-txt); font-size:19px; letter-spacing:.5px}
.packing-shell .page-intro p{color:var(--c-txt-3); font-size:12px}
.packing-shell .tabs.packing-tabs{
  display:inline-flex; gap:2px; padding:3px; border:1px solid var(--c-edge);
  background:rgba(6,26,51,.55); border-radius:var(--c-r-s); margin:0}
.packing-shell .tabs.packing-tabs .tab{
  border:none; background:transparent; color:var(--c-txt-2); font-weight:700;
  padding:7px 14px; border-radius:8px; font-size:12.5px;
  transition:background .12s, color .12s}
.packing-shell .tabs.packing-tabs .tab:hover{background:rgba(63,208,245,.1);
  color:var(--c-cyan)}
.packing-shell .tabs.packing-tabs .tab.active{
  background:rgba(63,208,245,.18); color:var(--c-cyan);
  box-shadow:inset 0 -2px 0 var(--c-cyan)}
.packing-shell .panel{
  background:rgba(6,26,51,.5); border:1px solid var(--c-edge);
  border-radius:var(--c-r); box-shadow:none}
.packing-shell .panel h3{color:var(--c-txt)}
.packing-shell .panel p,.packing-shell .panel small{color:var(--c-txt-3)}
/* 打包记录整张表看不见，就是这里少了一个 background。
   全局那条 `.table-wrap table{background:rgba(255,255,255,.97)}` 是给
   浅色页面用的；智能打包整个模块是深色壳（.packing-shell 自己是
   #041226→#04101f 的渐变），只设 color 不设 background 的话，白底赢了，
   深色主题的浅色字直接糊在白底上 —— 表头是深的、表体是白的，
   看起来像"数据没加载出来"。
   同理下面要盖掉全局的偶数行浅蓝斑马纹，否则一行深一行白。 */
.packing-shell .table-wrap table{color:var(--c-txt-2); background:transparent}
.packing-shell .table-wrap tbody tr{background:rgba(6,26,51,.42)}
.packing-shell .table-wrap tbody tr:nth-child(even){background:rgba(9,34,64,.52)}
.packing-shell .table-wrap tbody td{color:var(--c-txt-2)}
.packing-shell .table-wrap tbody tr:hover td{color:var(--c-txt)}
.packing-shell .table-wrap thead th{position:sticky; top:0; z-index:1;
  background:rgba(16,55,96,.95); color:var(--c-txt-3);
  border-bottom:1px solid var(--c-edge); font-size:11px}
.packing-shell .table-wrap tbody td{border-bottom:1px solid rgba(120,190,240,.08)}
.packing-shell .table-wrap tbody tr:hover{background:rgba(63,208,245,.12)}
.packing-shell .table-wrap tbody strong{color:var(--c-txt)}
.packing-shell .empty-state{background:rgba(6,26,51,.45); border:1px dashed var(--c-edge);
  border-radius:var(--c-r); color:var(--c-txt-3)}
.packing-shell .empty-state b{color:var(--c-txt)}
.packing-shell .metric-grid{gap:8px}
.packing-shell .metric-card{background:rgba(6,26,51,.5); border:1px solid var(--c-edge);
  border-radius:var(--c-r); box-shadow:none}
.packing-shell .metric-head > span:first-child{color:var(--c-txt-3)}
.packing-shell .metric-value{color:var(--c-txt); font-variant-numeric:tabular-nums}
.packing-shell .metric-foot{color:var(--c-txt-3)}
.packing-shell label{color:var(--c-txt-3)}
.packing-shell input,.packing-shell select{background:rgba(4,18,38,.6);
  border:1px solid var(--c-edge); color:var(--c-txt)}
.packing-shell .permission-note{background:rgba(6,26,51,.5);
  border:1px solid var(--c-edge); color:var(--c-txt-2)}

/* 深色底下把浅色小组件调回可读 */
.packing-shell .location-code{background:rgba(63,208,245,.14); color:var(--c-cyan);
  border:1px solid var(--c-edge)}
.packing-shell .badge{background:rgba(255,255,255,.08); color:var(--c-txt-2);
  border:1px solid var(--c-edge)}
.packing-shell .badge.success{background:rgba(46,212,122,.14); color:var(--c-ok);
  border-color:rgba(46,212,122,.35)}
.packing-shell .badge.medium,.packing-shell .badge.high{background:rgba(255,171,61,.14);
  color:var(--c-warn); border-color:rgba(255,171,61,.35)}
.packing-shell .qty-sub{color:var(--c-txt-3)}
.packing-shell .button.small{background:rgba(255,255,255,.07); color:var(--c-txt-2);
  border:1px solid var(--c-edge)}

/* ══ 桌面：左 62 / 右 38 ══════════════════════════════════════════════ */
@media (min-width:1200px){
  .packing-shell .stage{grid-template-columns:minmax(0,62fr) minmax(0,38fr)}
}
@media (min-width:1600px){
  .packing-shell .target input[name="trackingNo"]{font-size:27px; min-height:64px}
  .packing-shell .best-name{font-size:36px}
}

/* ══ 平板 ══════════════════════════════════════════════════════════════ */
@media (max-width:1199px){
  .packing-shell .hud-stats{margin-left:0; width:100%}
}

/* ══ 手机 ══════════════════════════════════════════════════════════════ */
@media (max-width:560px){
  .packing-shell .hud{padding:9px 11px; gap:9px}
  .packing-shell .hud-title small{display:none}
  .packing-shell .hud-stats{gap:6px; overflow-x:auto; flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch; scrollbar-width:none}
  .packing-shell .hud-stats::-webkit-scrollbar{display:none}
  .packing-shell .hud-stat{flex:none}
  .packing-shell .chain{grid-template-columns:repeat(5,1fr); gap:4px; padding:0 10px 10px}
  .packing-shell .link{padding:7px 2px}
  .packing-shell .link span{font-size:9px}
  .packing-shell .tabs.packing-tabs{display:flex; overflow-x:auto; width:100%}
  .packing-shell .tabs.packing-tabs .tab{flex:none; white-space:nowrap}
  .packing-shell .flowrow{grid-template-columns:auto minmax(0,1fr) auto; gap:8px}
  .packing-shell .flowrow .box{display:none}
}

/* ══ PDA：像终端，不是缩小的网页 ═════════════════════════════════════ */
@media (max-width:400px){
  .packing-shell .hud{padding:8px 10px; margin-bottom:8px}
  .packing-shell .hud-title b{font-size:15px}
  .packing-shell .engine{margin-bottom:8px}
  .packing-shell .engine-body{display:none}
  .packing-shell .stage{gap:8px}
  .packing-shell .target{margin:10px; padding:18px 12px}
  .packing-shell .bcode{width:62px; height:28px; margin-bottom:9px}
  .packing-shell .target-label{letter-spacing:1.6px; margin-bottom:9px}
  .packing-shell .target input[name="trackingNo"]{font-size:19px; min-height:54px}
  .packing-shell .console-bar small{display:none}
  .packing-shell .console-bar .tag{display:none}
  .packing-shell .chain{padding:0 10px 10px}
  .packing-shell .console-foot{padding:0 10px 10px}
  .packing-shell .console-foot em{display:none}
  .packing-shell .best-name{font-size:26px}
  .packing-shell .wire{display:none}
  .packing-shell .facts dl{grid-template-columns:1fr 1fr}
  /* 流水只留 3 条 */
  .packing-shell .stream .flowrow:nth-of-type(n+4){display:none}
}

/* 队列明细抽屉：「待写入 / 异常」点开之后的清单 */
.hub-q-sub{margin-top:3px; font-size:12px; color:var(--muted)}
.hub-q-err{margin-top:5px; font-size:12px; line-height:1.5; color:var(--red);
  word-break:break-word}
.hub-q-act{white-space:nowrap; text-align:right}
.hub-q-locked{font-size:12px; color:var(--muted)}
/* 「已取消」要和系统失败一眼分得开 —— 前者是人主动停的，不是故障。
   .pill.warn 在别处是 .rep-task-card 作用域内的，这里自己定义一份。 */
.dashboard-detail-table .pill.warn{background:var(--orange-soft); color:var(--orange)}

/* staging 进程版本不一致时的提示条（仅 /api/build 带 stagingBuild:true 时出现；生产不会出现） */
.staging-build-banner { position: sticky; top: 0; z-index: 9999; padding: 6px 12px;
  background: #f5a524; color: #111; font-weight: 700; font-size: 13px; text-align: center; }

/* 飞书表清单（rc45）：主表钉在最上面、其他表一张一行。
   浅色后台主题，和上面「飞书连接管理」那几张卡同一套色。 */
.feishu-tables-panel{display:grid;gap:12px}
.feishu-table-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:start;padding:14px 16px;border:1px solid rgba(15,47,99,.12);border-radius:14px;background:rgba(255,255,255,.86)}
.feishu-table-row.is-primary{border-color:rgba(13,76,152,.35);background:rgba(13,76,152,.05)}
.feishu-table-row.is-off{opacity:.62}
.feishu-table-main{display:grid;gap:5px;min-width:0}
.feishu-table-main>strong{font-size:16px;color:#0b397d;word-break:break-all}
.feishu-table-main>.badge{justify-self:start}
.feishu-table-main small{color:#5b6b80;line-height:1.5;word-break:break-all}
.feishu-table-bad{color:#c0362c!important}
.feishu-table-usedby{display:flex;flex-wrap:wrap;gap:6px}
.feishu-table-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.feishu-table-actions .button.danger{color:#c0362c;border-color:rgba(192,54,44,.4)}
.feishu-table-preview{grid-column:1/-1;display:grid;gap:6px}
.feishu-table-preview .table-wrap{max-height:260px;overflow:auto}
.feishu-table-preview th,.feishu-table-preview td{font-size:12px;white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.feishu-table-empty{padding:12px 14px;border-radius:12px;background:rgba(15,47,99,.04);color:#5b6b80}
.feishu-table-add{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px;border-radius:12px;background:rgba(9,58,126,.055)}
.feishu-table-add label{display:grid;gap:6px;font-weight:700}
.feishu-table-add input{width:100%;min-height:42px}
.feishu-table-add .span-2{grid-column:1/-1}
@media(max-width:760px){.feishu-table-row{grid-template-columns:1fr}.feishu-table-actions{justify-content:flex-start}.feishu-table-add{grid-template-columns:1fr}.feishu-table-add .span-2{grid-column:auto}}

/* 飞书移除操作日志（rc45）。任务中心卡片上的一行说明 + 页签里的查询页。 */
.hub-card-desc{margin:6px 0 0;font-size:12px;color:#83a6bb;line-height:1.5}
.oplog-panel{display:grid;gap:12px}
.oplog-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px;padding:12px 14px;border-radius:12px;background:rgba(9,58,126,.055)}
.oplog-filters label{display:grid;gap:5px;font-size:12px;font-weight:700;color:#334a66}
.oplog-filters input,.oplog-filters select{min-height:38px}
.oplog-filters .oplog-q{flex:1 1 240px}
.oplog-filters .oplog-q input{width:100%}
.oplog-quick,.oplog-go{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.oplog-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:#5b6b80}
.oplog-loading{color:#0d4c98;font-weight:700}
.oplog-table{max-height:68vh;overflow:auto}
.oplog-table th{position:sticky;top:0;z-index:1;white-space:nowrap}
.oplog-table td{font-size:13px;vertical-align:top}
.oplog-at{white-space:nowrap;font-variant-numeric:tabular-nums;color:#334a66}
.oplog-mod{display:inline-block;padding:2px 8px;border-radius:999px;background:rgba(13,76,152,.08);color:#0b397d;font-size:12px;white-space:nowrap}
.oplog-no{all:unset;cursor:pointer;font-family:Consolas,monospace;color:#0d4c98;border-bottom:1px dashed rgba(13,76,152,.45);word-break:break-all}
.oplog-no:hover{color:#08336a;border-bottom-style:solid}
.oplog-no:focus-visible{outline:2px solid #0d4c98;outline-offset:2px}
.oplog-ref{color:#5b6b80;font-size:12px}
.oplog-inbound{display:block;color:#5b6b80;font-size:11px;margin-top:2px}
.oplog-sum{color:#334a66;min-width:160px}
.oplog-sum .button{margin-left:6px}
.oplog-sub td{background:rgba(13,76,152,.04)}
.oplog-orders{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:#334a66}
.oplog-orders b{font-family:Consolas,monospace;color:#0b397d}
.oplog-pager{display:flex;justify-content:center;align-items:center;gap:12px;font-size:13px}
@media(max-width:760px){.oplog-filters{display:grid;grid-template-columns:1fr 1fr}.oplog-filters .oplog-q,.oplog-quick,.oplog-go{grid-column:1/-1}}