:root {
  --bg: #f4f6f9;
  --panel: #ffffff;
  --line: #e4e8ef;
  --line-2: #eef1f6;
  --tx: #1f2733;
  --tx-2: #5b6675;
  --tx-3: #8a94a3;
  --pri: #1d4ed8;
  --pri-d: #1740b0;
  --warn: #d97706;
  --ok: #15803d;
  --bad: #b91c1c;
  --info: #0369a1;
  --side: #1c2635;
  --side-2: #26344a;
  --radius: 8px;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--tx);
  font: 14px/1.55 -apple-system, "Segoe UI", "Microsoft YaHei", "PingFang SC", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { margin: 0; font-weight: 600; }
a { color: var(--pri); text-decoration: none; }
.mono { font-family: ui-monospace, "SFMono-Regular", Consolas, Menlo, monospace; font-size: 12.5px; }
.hidden { display: none !important; }
.hint { color: var(--tx-3); font-size: 12.5px; }
.strong { font-weight: 600; }

/* ---------- 布局 ---------- */
.layout { display: flex; height: 100vh; }
/* 2026-10-11 老板要求：侧栏压到屏幕宽度的 5%（内容区更宽，派单台放得下更多卡） */
.sidebar {
  width: 5%; flex: 0 0 5%; min-width: 58px;
  background: var(--side); color: #b8c2d1;
  display: flex; flex-direction: column;
  position: relative;   /* 隐藏按钮定位用 */
}
/* 隐藏后：侧栏整个让位给内容区 */
.layout.side-off .sidebar { display: none; }

.brand { display: flex; align-items: center; gap: 10px; padding: 16px 16px 14px; border-bottom: 1px solid rgba(255,255,255,.07); }
.brand-logo {
  width: 34px; height: 34px; border-radius: 8px; background: linear-gradient(135deg,#f59e0b,#ea580c);
  color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 17px;
}
.brand-t { display: flex; flex-direction: column; line-height: 1.25; }
.brand-t b { color: #fff; font-size: 15px; }
.brand-t span { font-size: 11.5px; color: #7f8b9d; }
.nav { flex: 1; overflow-y: auto; padding: 10px 8px; }
.nav-g { font-size: 11px; color: #64748b; padding: 10px 10px 4px; letter-spacing: .5px; }
.nav-i {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 6px;
  color: #c3ccda; font-size: 13.5px; margin-bottom: 2px;
}
.nav-i:hover { background: var(--side-2); color: #fff; }
.nav-i.on { background: var(--pri); color: #fff; }
.nav-ic { width: 16px; text-align: center; font-style: normal; opacity: .9; }
.side-ft { border-top: 1px solid rgba(255,255,255,.07); padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.side-me { display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.side-user { font-size: 12px; color: #cfd7e3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 118px; }
.side-role { font-size: 10.5px; color: #6b7688; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 118px; }
.side-role.warn { color: #f0a35e; }
.side-role.ok { color: #6ee7a8; }

/* ---------- 5% 窄侧栏：图标在上、文字在下 ---------- */
.sidebar .brand { flex-direction: column; gap: 6px; padding: 12px 4px 10px; }
.sidebar .brand-t { display: none; }            /* 窄了放不下品牌名，只留图标 */
.sidebar .nav { padding: 8px 4px; }
.sidebar .nav-g { display: none; }              /* 分组标题也省掉，靠图标区分 */
.sidebar .nav-i {
  flex-direction: column; gap: 3px; padding: 9px 2px; margin-bottom: 4px;
  font-size: 11px; line-height: 1.25; text-align: center; justify-content: center;
}
.sidebar .nav-i span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar .nav-ic { width: auto; font-size: 15px; line-height: 1; }
.sidebar .side-ft { flex-direction: column; gap: 6px; padding: 10px 4px; align-items: stretch; }
.sidebar .side-me { align-items: center; }
.sidebar .side-user, .sidebar .side-role { max-width: 100%; text-align: center; }
.sidebar .side-ft .btn { padding: 4px 6px; font-size: 11.5px; }

/* 隐藏 / 显示导航栏的两个按钮 */
.side-btn {
  position: absolute; top: 5px; right: 4px; z-index: 5;
  width: 22px; height: 22px; line-height: 1;
  border: 1px solid rgba(255,255,255,.14); border-radius: 6px;
  background: rgba(255,255,255,.06); color: #cfd7e3;
  font-size: 13px; cursor: pointer; padding: 0;
}
.side-btn:hover { background: rgba(255,255,255,.16); color: #fff; }
.side-float {
  position: fixed; left: 8px; top: 8px; z-index: 90;
  width: 32px; height: 32px; line-height: 1;
  border: 1px solid rgba(255,255,255,.14); border-radius: 8px;
  background: var(--side); color: #cfd7e3;
  font-size: 15px; cursor: pointer; padding: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.side-float:hover { background: #26344a; color: #fff; }

.main { flex: 1; overflow-y: auto; }
.content { padding: 20px 24px 40px; }

.boot, .loading { padding: 60px; text-align: center; color: var(--tx-3); }
.boot.err { color: var(--bad); line-height: 1.7; }
.loading.err { color: var(--bad); }

/* ---------- 录单页：粘贴文字自动识别（2026-10-11；2026-10-25 移除图片识别） ---------- */
.ai-panel { border-left: 3px solid var(--pri); }
.ai-box { display: block; }
.ai-tx {
  width: 100%;
  box-sizing: border-box;
  min-height: 150px;
  max-height: 260px;
  resize: vertical;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font: 13px/1.7 inherit;
  color: var(--tx);
  background: #fbfcfe;
}
/* 2026-10-25：.ai-side / .ai-drop 已随图片识别删除，不再需要 */
.ai-bar { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.ai-bar .hint { flex: 1; }
.ai-res { margin-top: 10px; font-size: 13px; line-height: 1.9; }
.ai-res .ok { color: var(--ok); margin-right: 16px; }
.ai-res .warn { color: var(--warn); }
/* 楼层 + 电梯：决定整单货品的工费档，用深色加粗标出来（2026-10-11） */
.ai-res .floor { color: #12294a; font-weight: 700; margin-right: 16px; }

/* ---------- 页面 ---------- */
.page { max-width: 1400px; }
.page-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 12px; }
.page-hd h2 { font-size: 19px; }
.page-act { display: flex; gap: 8px; align-items: center; }
.page-ft { margin-top: 18px; }

.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 16px; overflow: hidden; }
.panel-hd { padding: 11px 14px; border-bottom: 1px solid var(--line-2); font-weight: 600; font-size: 13.5px; background: #fafbfd; }
.panel-ft { padding: 10px 14px; border-top: 1px solid var(--line-2); display: flex; align-items: center; gap: 12px; }
.panel-alert { border-color: #f3c9c9; }
.panel-alert .panel-hd { background: #fff5f5; color: var(--bad); }
/* 施工后回传待审核（2026-10-18）：橙色告警，跟差异审核的红色区分开 */
.panel.postwork { border-color: #f3d9a8; }
.panel.postwork .panel-hd { background: #fffdf7; color: #b45309; }

/* ---------- 统计卡 ---------- */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; border-left: 3px solid var(--pri); }
.stat-card.warn { border-left-color: var(--warn); }
.stat-card.info { border-left-color: var(--info); }
.stat-card.ok { border-left-color: var(--ok); }
.stat-v { font-size: 26px; font-weight: 700; line-height: 1.2; }
.stat-t { color: var(--tx-2); font-size: 12.5px; margin-top: 2px; }

/* ---------- 表格 ---------- */
.tbl { width: 100%; border-collapse: collapse; font-size: 13.2px; }
.tbl th {
  text-align: left; padding: 9px 12px; background: #f7f9fc; color: var(--tx-2);
  font-weight: 600; font-size: 12.5px; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.tbl td { padding: 9px 12px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.tbl tbody tr:hover { background: #fafbfd; }
.tbl .empty { text-align: center; color: var(--tx-3); padding: 26px; }
.tbl .act-cell { white-space: nowrap; text-align: right; }
.tbl.num td { text-align: right; }

/* ==================================================================
   2026-10-17 老板需求：订单管理「设置表头」
     · 表格改成 table-layout:fixed + colgroup 显式列宽 → 拖滑块真能改列宽
     · 列宽加起来超屏时外面这层横向滚动，别把内容挤没了
   ================================================================== */
.tbl-scroll { overflow-x: auto; }
.tbl-cols { table-layout: fixed; }
.tbl-cols th, .tbl-cols td { overflow: hidden; text-overflow: ellipsis; }
.tbl-cols .act-cell { overflow: visible; white-space: normal; }
.tbl-cols .act-cell .btn { white-space: nowrap; }
.tbl-cols .act-cell .btn { margin: 1px 0 1px 4px; }

/* 设置表头弹层（自绘，不用原生 prompt / confirm） */
.cmask {
  position: fixed; inset: 0; background: rgba(16, 24, 40, .38);
  z-index: 300; display: none;
}
.cmask.on { display: block; }
.cset {
  position: fixed; z-index: 301; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 640px; max-width: calc(100vw - 32px); max-height: calc(100vh - 90px);
  background: #fff; border-radius: 12px; box-shadow: 0 18px 50px rgba(16, 24, 40, .28);
  display: none; flex-direction: column; overflow: hidden;
}
.cset.on { display: flex; }
.cset-hd {
  display: flex; align-items: center; gap: 10px; padding: 12px 16px;
  border-bottom: 1px solid var(--line-2); background: #fafbfd; flex-shrink: 0;
}
.cset-hd b { font-size: 14.5px; }
.cset-hd .grow { flex: 1; }
.cset-bd { padding: 10px 14px; overflow-y: auto; }
.cset-ft { padding: 10px 16px; border-top: 1px solid var(--line-2); background: #fbfcfe; flex-shrink: 0; }

.cs-row {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px; border: 1px solid #e6eaf1; border-radius: 8px;
  background: #fff; margin-bottom: 8px;
}
.cs-row:hover { border-color: #c7d3e6; }
.cs-row.dragging { opacity: .5; }
.cs-row.over { border-color: var(--pri); background: #f2f7ff; box-shadow: 0 0 0 2px rgba(29, 78, 216, .12); }
.cs-grip { cursor: grab; color: #9aa6b6; font-size: 15px; letter-spacing: -1px; user-select: none; }
.cs-lab { display: flex; align-items: center; gap: 6px; font-size: 13px; min-width: 110px; cursor: pointer; }
.cs-lab input { width: 15px; height: 15px; }
.cs-row .grow { flex: 1; }
.cs-range { width: 190px; accent-color: var(--pri); cursor: pointer; }
.cs-wv { font-size: 12px; color: var(--tx-2); width: 52px; text-align: right; font-weight: 600; }
.cs-mv { display: flex; gap: 4px; }
.cs-mv .btn { padding: 1px 7px; line-height: 1.5; }
.price-tbl input { width: 100%; }
.price-tbl .ipt { padding: 4px 6px; }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 7px 13px; border: 1px solid var(--line); background: #fff; color: var(--tx);
  border-radius: 6px; cursor: pointer; font-size: 13px; font-family: inherit; line-height: 1.3;
}
.btn:hover { border-color: #c7d0dd; background: #f8fafc; }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--pri); border-color: var(--pri); color: #fff; }
.btn-primary:hover { background: var(--pri-d); border-color: var(--pri-d); }
.btn-danger { background: var(--bad); border-color: var(--bad); color: #fff; }
.btn-danger:hover { background: #991b1b; border-color: #991b1b; }
.btn-ghost { background: transparent; }
.btn-sm { padding: 4px 9px; font-size: 12.5px; }
.btn-lg { padding: 10px 22px; font-size: 14.5px; }
.btn-block { width: 100%; }

/* ---------- 表单 ---------- */
.toolbar { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.ipt, input, select, textarea {
  font-family: inherit; font-size: 13.2px; color: var(--tx);
  padding: 7px 10px; border: 1px solid var(--line); border-radius: 6px; background: #fff; outline: none;
}
input:focus, select:focus, textarea:focus { border-color: var(--pri); box-shadow: 0 0 0 3px rgba(29,78,216,.1); }
input[type=number] { text-align: right; }
textarea { width: 100%; resize: vertical; }
.field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.field-lb { font-size: 12.5px; color: var(--tx-2); font-weight: 500; }
.inline { display: flex; gap: 8px; align-items: center; }
.inline input, .inline select { flex: 1; }
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 16px; padding: 14px; }
.tag-pick { display: flex; flex-wrap: wrap; gap: 10px 16px; padding: 4px 0; }
.chk { display: inline-flex; align-items: center; gap: 6px; font-size: 13.2px; cursor: pointer; }
.chk input { width: auto; }

/* ---------- 徽章 / 标签 ---------- */
.badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 12px; border: 1px solid transparent; white-space: nowrap; }
.badge-muted { background: #f1f3f7; color: var(--tx-2); border-color: var(--line); }
.badge-warn { background: #fff7ed; color: var(--warn); border-color: #fed7aa; }
.badge-ok { background: #f0fdf4; color: var(--ok); border-color: #bbf7d0; }
.badge-info { background: #eff6ff; color: var(--info); border-color: #bfdbfe; }
.badge-bad { background: #fef2f2; color: var(--bad); border-color: #fecaca; }
.badge-chg { background: #f5f3ff; color: #6d28d9; border-color: #ddd6fe; }
.tag { display: inline-block; padding: 1px 7px; border-radius: 4px; background: #eef2f7; color: var(--tx-2); font-size: 11.5px; margin-right: 4px; }
.tag-warn { background: #fff7ed; color: var(--warn); }

/* ---------- 分段控件 ---------- */
.seg { display: inline-flex; background: #eef1f6; border-radius: 7px; padding: 3px; }
.seg-i { border: none; background: transparent; padding: 6px 14px; border-radius: 5px; cursor: pointer; font-size: 13px; color: var(--tx-2); font-family: inherit; }
.seg-i.on { background: #fff; color: var(--tx); box-shadow: 0 1px 2px rgba(0,0,0,.08); font-weight: 600; }

/* ---------- 信息网格 ---------- */
.info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 16px; padding: 12px 14px; }
.info-cell { display: flex; flex-direction: column; padding: 6px 0; }
.info-k { font-size: 12px; color: var(--tx-3); }
.info-v { font-size: 13.5px; }

/* ---------- 拆单预览 ---------- */
.split-preview { padding: 12px 14px; display: flex; gap: 10px; flex-wrap: wrap; }
.split-item { display: flex; align-items: center; gap: 8px; background: #f7f9fc; border: 1px solid var(--line); border-radius: 6px; padding: 8px 12px; }
.split-no { width: 18px; height: 18px; border-radius: 50%; background: var(--pri); color: #fff; font-size: 11px; display: flex; align-items: center; justify-content: center; }
.split-st { color: var(--tx-3); font-size: 12.5px; }

/* ---------- 照片 ---------- */
.ph-prev { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ph-prev img { width: 62px; height: 62px; object-fit: cover; border-radius: 5px; border: 1px solid var(--line); }

.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; padding: 14px; }
.photo-card { display: block; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #fafbfd; }
.photo-card img { width: 100%; height: 108px; object-fit: cover; display: block; background: #eef1f6; }
.photo-card span { display: block; padding: 6px 8px; font-size: 11.5px; color: var(--tx-2); }

/* ==================================================================
 *  抽屉式面板（2026-10-18 老板要求）
 *  订单详情里的「货品明细」「一线完工回传照片」默认收起，点标题展开。
 *  标题右侧照旧用 .panel-hd-s 放摘要（件数 / 吨数 / 照片张数）。
 * ================================================================== */
.panel.fold > .panel-hd {
  display: flex; align-items: center; gap: 8px;
  cursor: pointer; user-select: none;
  transition: background-color .15s ease;
}
.panel.fold > .panel-hd:hover { background: #f2f6fd; }
.panel.fold > .panel-hd .panel-hd-s { float: none; margin-left: auto; }
.fold-ic {
  flex: none; width: 12px;
  font-size: 10px; line-height: 1; color: var(--tx-3);
  transition: transform .16s ease;
}
.panel.fold.open > .panel-hd .fold-ic { transform: rotate(90deg); color: var(--pri); }
.panel.fold > .panel-bd { display: none; }
.panel.fold.open > .panel-bd { display: block; }

/* 照片按回传环节分组：组头 张数 + 上传人 + 时间 */
.ph-grp { padding: 10px 14px 0; }
.ph-grp + .ph-grp { border-top: 1px dashed var(--line-2); margin-top: 4px; }
.ph-grp-hd { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--tx-2); padding-top: 4px; }
.ph-grp-hd .ph-who { font-weight: 400; font-size: 11.5px; color: var(--tx-3); }
.ph-grp .photo-grid { padding: 8px 0 12px; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px; }
.ph-grp .photo-card img { height: 96px; }
.ph-empty { padding: 26px 14px; text-align: center; color: var(--tx-3); font-size: 12.5px; }

/* ---------- 弹窗 ---------- */
.modal-mask {
  position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: 90;
  display: flex; align-items: center; justify-content: center; padding: 24px;
}
.modal {
  background: #fff; border-radius: 10px; width: 640px; max-width: 100%; max-height: 88vh;
  display: flex; flex-direction: column; box-shadow: 0 20px 50px rgba(0,0,0,.2);
}
.modal-lg { width: 900px; }
.modal-sm { width: 400px; }
.modal-hd { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--line-2); font-weight: 600; }
.modal-x { border: none; background: transparent; font-size: 22px; line-height: 1; cursor: pointer; color: var(--tx-3); }
.modal-bd { padding: 16px; overflow-y: auto; }
.modal-ft { padding: 12px 16px; border-top: 1px solid var(--line-2); display: flex; justify-content: flex-end; gap: 8px; }
.confirm-text { margin: 0; }

/* ---------- 提示 ---------- */
.toast-wrap { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.toast {
  background: #1f2733; color: #fff; padding: 9px 16px; border-radius: 6px; font-size: 13px;
  box-shadow: 0 6px 18px rgba(0,0,0,.18); opacity: 1; transition: opacity .25s, transform .25s;
}
.toast.ok { background: var(--ok); }
.toast.bad { background: var(--bad); }
.toast.out { opacity: 0; transform: translateY(-8px); }

/* ---------- 调度派单池 ---------- */
.dp-page { display: flex; flex-direction: column; height: calc(100vh - 40px); max-width: none; }
.dp-top { display: flex; align-items: center; gap: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.dp-top-l { display: flex; flex-direction: column; gap: 2px; }
.dp-top-l h2 { font-size: 18px; }
.dp-who { font-size: 12px; color: var(--tx-3); }
.dp-stats { display: flex; gap: 10px; margin-left: auto; }
.ds { background: #fff; border: 1px solid var(--line); border-radius: 7px; padding: 6px 14px; text-align: center; min-width: 78px; }
.ds b { display: block; font-size: 19px; line-height: 1.2; }
.ds span { font-size: 11.5px; color: var(--tx-2); }
.ds.warn b { color: var(--warn); }

.dp-body { flex: 1; display: flex; gap: 14px; min-height: 0; padding-top: 12px; position: relative; }
.dp-pool { flex: 0 0 68%; max-width: 68%; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.dp-people { flex: 1; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.dp-hd { padding: 9px 12px; border-bottom: 1px solid var(--line-2); font-size: 13px; font-weight: 600; background: #fafbfd; }
.dp-scroll { flex: 1; overflow-y: auto; }

.pool-tbl th { position: sticky; top: 0; z-index: 2; }
.pool-row { height: 34px; cursor: pointer; }
.pool-row.sel { outline: 2px solid var(--pri); outline-offset: -2px; }

/* 行首电梯方格：绿=有电梯 蓝=无电梯需爬楼 */
.c-lift { text-align: center; white-space: nowrap; }
.lift-bx {
  display: inline-block; width: 14px; height: 14px; border: 2px solid #c7d0dd; border-radius: 3px;
  background: #fff; cursor: pointer; vertical-align: middle; margin-right: 4px;
}
.lift-bx:hover { border-color: #8fa2bd; }
.lift-bx.on { background: #22c55e; border-color: #16a34a; }
.lift-bx.bx-b.on { background: #3b82f6; border-color: #2563eb; }

/* 整行底色跟着电梯标记走 */
.pool-row.lift-green, .pool-row.lift-green:hover { background: #f0fdf4; }
.pool-row.lift-blue, .pool-row.lift-blue:hover { background: #eff6ff; }
.pool-row.lift-none td:first-child { box-shadow: inset 3px 0 0 #f59e0b; }

.pc-idle { opacity: .5; cursor: not-allowed; }
.need-tag { color: var(--warn); font-size: 11.5px; margin-left: 6px; }
.c-cust { display: block; font-size: 11.5px; color: var(--tx-3); }
.c-floor { font-size: 12.5px; }
.sel-tip { margin-left: 8px; font-weight: 400; color: var(--pri); font-size: 12px; }
.pool-row td { padding: 4px 10px; font-size: 13px; border-bottom: 1px solid var(--line-2); }
.pool-row:hover { background: #f2f6fd; }
.pool-row.dragging { opacity: .45; }
.pool-row.row-done { background: #eefbf2; }
.pool-row.row-done:hover { background: #e4f7ea; }
.c-no { color: var(--pri); font-weight: 700; font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; }
.c-addr { font-weight: 600; }
.c-w { color: var(--bad); font-weight: 700; }
.c-p { color: var(--tx-2); font-size: 12.5px; }
.ok-flag { color: var(--ok); font-size: 11.5px; font-weight: 600; }
.q-pending { background: #fff7ed; color: var(--warn); border-radius: 4px; padding: 1px 6px; font-size: 11.5px; }
.mut { color: var(--tx-3); }
.tiny { font-size: 11.5px; }

.t-badge { display: inline-block; padding: 1px 7px; border-radius: 4px; font-size: 11.5px; font-weight: 600; }
.t-dl { background: #e0edff; color: #1d4ed8; }
.t-cl { background: #ede9fe; color: #6d28d9; }
.t-sg { background: #ffedd5; color: #c2410c; }
.t-rc { background: #dcfce7; color: #15803d; }

.dp-cols { flex: 1; display: flex; gap: 8px; padding: 10px; overflow: hidden; }
.dp-col { flex: 1; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 7px; background: #fbfcfe; overflow: hidden; }
.col-hd { padding: 7px 10px; font-size: 12.5px; font-weight: 600; background: #f1f5fb; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; }
.col-n { color: var(--tx-3); font-weight: 400; }
.col-body { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 7px; }
.col-empty { color: var(--tx-3); font-size: 12px; text-align: center; padding: 16px 8px; }

.pcard { border: 1px solid var(--line); border-radius: 7px; background: #fff; padding: 7px 9px; transition: transform .12s, box-shadow .12s, border-color .12s; cursor: pointer; }
.pcard:hover { border-color: #b9c9e6; }
.pcard.over { border-color: var(--pri); border-width: 2px; transform: scale(1.06); box-shadow: 0 6px 18px rgba(29,78,216,.18); background: #f0f6ff; }
.pc-top { display: flex; align-items: center; gap: 6px; }
.pc-name { font-size: 13.5px; }
.dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; }
.dot.free { background: #22c55e; }
.dot.busy { background: #ef4444; }
.pc-sub { font-size: 11.5px; color: var(--tx-2); margin-top: 2px; }
.pc-team { font-size: 11px; color: var(--tx-3); }

.dp-queue { margin-top: 12px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 9px 12px; max-height: 132px; display: flex; flex-direction: column; }
.q-empty { color: var(--tx-3); font-size: 12.5px; padding: 6px 0; }
.q-head { display: flex; align-items: center; gap: 10px; font-size: 13px; margin-bottom: 7px; }
.q-head b { color: var(--pri); }
.q-head button:last-child { margin-left: auto; }
.q-head .btn-ghost { margin-left: auto; }
.q-head .btn-primary { margin-left: 0; }
.q-list { overflow-y: auto; display: flex; flex-direction: column; gap: 5px; }
.q-item { display: flex; align-items: center; gap: 8px; background: #f7f9fc; border: 1px solid var(--line-2); border-radius: 6px; padding: 4px 9px; font-size: 12.5px; }
.q-no { font-family: ui-monospace, Consolas, monospace; color: var(--pri); font-weight: 600; }
.q-ar { color: var(--tx-3); }
.q-role { color: var(--tx-2); }
.q-name { font-weight: 600; }
.q-x { margin-left: auto; border: none; background: transparent; color: var(--tx-3); cursor: pointer; font-size: 14px; }
.q-x:hover { color: var(--bad); }

.snap-box { position: absolute; z-index: 40; width: 320px; }
.snap { background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 12px 32px rgba(0,0,0,.16); padding: 11px 13px; font-size: 12.5px; }
.snap-hd { font-weight: 700; margin-bottom: 7px; padding-bottom: 6px; border-bottom: 1px solid var(--line-2); }
.snap-row { display: flex; gap: 10px; padding: 2px 0; }
.snap-row span { color: var(--tx-3); flex: 0 0 62px; }
.snap-row b { font-weight: 600; }
.snap-sec { margin-top: 8px; color: var(--tx-3); font-size: 11.5px; }
.snap-item { display: flex; justify-content: space-between; padding: 2px 0; border-bottom: 1px dashed var(--line-2); }
.snap-note { background: #fffbeb; border-radius: 5px; padding: 6px 8px; color: #92400e; margin-top: 4px; }

/* ---------- 订单管理：统计卡 / 抽屉 ---------- */
.ostats { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: 10px; margin-bottom: 12px; }
.oscard { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 13px; cursor: pointer; position: relative; overflow: hidden; }
.oscard:hover { border-color: #b9c9e6; }
.oscard.on { border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29,78,216,.12); }
.oscard .bar { position: absolute; left: 0; top: 0; bottom: 0; width: 3px; }
.oscard.b .bar { background: var(--pri); }
.oscard.o .bar { background: var(--warn); }
.oscard.g .bar { background: var(--ok); }
.oscard.p .bar { background: #7c3aed; }
.oscard .lab { font-size: 12px; color: var(--tx-2); }
.oscard .val { font-size: 21px; font-weight: 700; line-height: 1.25; }
.oscard .sub { font-size: 11.5px; color: var(--tx-3); }

/* ---------- 订单管理（2026-10-24）：居中的新建订单按钮 + 功能入口卡片 ---------- */
/* 原来 6 张状态统计卡去掉后，换成**一个跟卡片一样大小、居中**的新建订单按钮 */
.ostats-1 { grid-template-columns: 1fr; justify-items: center; }
.ostats-1 .oscard-new {
  /* 2026-10-29 老板口径：整体放大到原本的 2 倍（148×78 → 296×156，字号同步×2） */
  width: 296px; min-height: 156px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 24px 26px;
  border: 2px dashed var(--pri);
  background: #f7faff;
  text-align: center;
}
.ostats-1 .oscard-new:hover { background: #eef4ff; border-color: var(--pri); border-style: solid; }
.ostats-1 .oscard-new .lab { font-size: 30px; font-weight: 700; color: var(--pri); }
.ostats-1 .oscard-new .sub { font-size: 23px; color: var(--tx-3); }

/* 三个功能入口：搜索订单 / 按条件筛选订单 / 查看改动的订单 */
.entry-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px; margin-top: 4px;
}
.entry-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  display: flex; flex-direction: column; overflow: hidden;
}
.entry-hd {
  display: flex; align-items: baseline; gap: 8px;
  padding: 11px 14px; border-bottom: 1px solid var(--line); background: #fafbfd;
}
.entry-hd b { font-size: 14px; }
.entry-bd { padding: 13px 14px; flex: 1; display: flex; flex-direction: column; gap: 10px; }
.entry-desc { font-size: 12.5px; color: var(--tx-2); line-height: 1.75; }
.entry-ft { display: flex; gap: 8px; margin-top: auto; padding-top: 4px; }
.entry-filters { gap: 9px; }
.ef { display: flex; align-items: center; gap: 8px; }
.ef > span:first-child { font-size: 12.5px; color: var(--tx-2); width: 84px; flex: none; }
.ef > span:first-child + select, .ef > select { flex: 1; min-width: 0; }
.ef-daterange { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.ef-daterange .ipt { flex: 1; min-width: 0; }

.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.chip { border: 1px solid var(--line); background: #fff; border-radius: 20px; padding: 4px 12px; font-size: 12.5px; cursor: pointer; color: var(--tx-2); }
.chip:hover { border-color: #b9c9e6; }
.chip.on { background: var(--pri); border-color: var(--pri); color: #fff; }

.tbl .srt { cursor: pointer; user-select: none; }
.tbl .srt:hover { color: var(--pri); }
.ar { color: var(--pri); font-size: 11px; }
.nb { display: inline-block; padding: 1px 7px; border-radius: 4px; font-size: 11.5px; background: #fff7ed; color: var(--warn); }
.nb.y { background: #fef2f2; color: var(--bad); }
.amt { text-align: right; font-variant-numeric: tabular-nums; }
.amt.wait { color: var(--tx-3); }
.st { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 12px; }
.st.wait { background: #fff7ed; color: var(--warn); }
.st.ing { background: #eff6ff; color: var(--info); }
.st.done { background: #f0fdf4; color: var(--ok); }
.st.bad { background: #fef2f2; color: var(--bad); }

.mask { position: fixed; inset: 0; background: rgba(15,23,42,.4); z-index: 80; display: none; }
.mask.show { display: block; }
/* 2026-10-19 老板：订单详情抽屉相关人一多就挤成竖排 → 560 → 760，表格与人员行都舒展 */
.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: 760px; max-width: 94vw; background: #fff; z-index: 81; box-shadow: -12px 0 40px rgba(0,0,0,.18); transform: translateX(102%); transition: transform .22s ease; display: flex; flex-direction: column; }
.drawer.show { transform: none; }
.drawer-hd { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--line); }
.drawer-hd .sp { margin-left: auto; }
.drawer-bd { flex: 1; overflow-y: auto; padding: 14px 16px 30px; }
.drawer-x { border: none; background: transparent; font-size: 22px; cursor: pointer; color: var(--tx-3); }
.dsec { margin-bottom: 16px; }
.dsec h3 { font-size: 13.5px; margin-bottom: 8px; display: flex; align-items: baseline; gap: 8px; }
.dsec h3 .r { font-size: 11.5px; color: var(--tx-3); font-weight: 400; margin-left: auto; }

/* ==================================================================
 *  列表右侧抽屉里的可折叠区块（2026-10-18 老板要求）
 *  「货品明细」「一线完工回传照片」点标题展开 / 收起，默认收起。
 * ================================================================== */
.dsec.fold > h3 { cursor: pointer; user-select: none; align-items: center; }
.dsec.fold > h3:hover { color: var(--pri); }
.dsec.fold > h3 .fold-ic {
  flex: none; font-size: 10px; color: var(--tx-3);
  transition: transform .16s ease;
}
.dsec.fold.open > h3 .fold-ic { transform: rotate(90deg); color: var(--pri); }
.dsec.fold > .dsec-bd { display: none; }
.dsec.fold.open > .dsec-bd { display: block; }
.dsec.fold > h3 .r { margin-left: auto; }
/* 照片分组：环节 · 张数 · 上传人 */
.phgrp + .phgrp { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line-2); }
.phgrp-hd { font-size: 11.5px; color: var(--tx-2); font-weight: 600; margin-bottom: 6px; }
.phgrp-hd .w { font-weight: 400; color: var(--tx-3); margin-left: 6px; }
.tl { display: flex; flex-wrap: wrap; gap: 6px; }
.tl .s { padding: 3px 10px; border-radius: 20px; font-size: 12px; background: #f1f3f7; color: var(--tx-3); }
.tl .s.done { background: #f0fdf4; color: var(--ok); }
.tl .s.cur { background: var(--pri); color: #fff; font-weight: 600; }
.kv { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; font-size: 13px; }
.kv .row { display: flex; gap: 10px; padding: 3px 0; }
.kv .row.full { grid-column: 1 / -1; }
.kv .k { color: var(--tx-3); flex: 0 0 66px; }
.tip-box { background: #fffbeb; border-radius: 6px; padding: 8px 10px; font-size: 12.5px; color: #92400e; }
/* 2026-10-19 修：相关人员一多会横向挤成三列 + 姓名竖排。
   ①列表容器改 block（不再依赖 flex 方向，任何缓存/覆盖都不会横排）
   ②每行自身横排，姓名与电话禁止换行，电话贴右 */
.ct-list { display: block; }
.ct-row {
  display: flex; align-items: center; gap: 10px;
  width: 100%; box-sizing: border-box; flex-wrap: nowrap;
  background: #f7f9fc; border: 1px solid var(--line-2); border-radius: 6px;
  padding: 6px 10px; font-size: 13px;
}
.ct-row + .ct-row { margin-top: 6px; }
.ct-role { color: var(--tx-3); flex: 0 0 52px; font-size: 12px; white-space: nowrap; }
.ct-name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ct-call { margin-left: auto; color: var(--pri); font-size: 12.5px; white-space: nowrap; flex: 0 0 auto; }
.ct-none { color: var(--tx-3); font-size: 12.5px; background: #f7f9fc; border-radius: 6px; padding: 10px; }
.wall { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.wall .w { aspect-ratio: 1; border-radius: 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 11.5px; color: #475569; background: #eef1f6; cursor: pointer; border: 1px solid var(--line); overflow: hidden; }
.wall .w img { width: 100%; height: 100%; object-fit: cover; }
.wall .w.empty { cursor: default; color: var(--tx-3); }
.wall .ic { font-size: 18px; }
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.86); z-index: 120; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 10px; }
.lightbox.show { display: flex; }
.lightbox img { max-width: 92vw; max-height: 82vh; border-radius: 6px; }
.lightbox .lb-cap { color: #fff; font-size: 13px; }
.lightbox .lb-x { position: absolute; top: 16px; right: 20px; color: #fff; font-size: 28px; background: transparent; border: none; cursor: pointer; }
/* 2026-10-20 灯箱工具条：复制图片 / 下载 / 新窗口 + 当前是否支持直接拖 */
.lightbox .lb-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center;
  margin-bottom: 4px;
}
.lightbox .lb-bar .btn { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.28); }
.lightbox .lb-bar .btn:hover { background: rgba(255,255,255,.22); color: #fff; }
.lightbox .lb-tip { color: #cbd5e1; font-size: 12.5px; }
.lightbox img { cursor: grab; }
.lightbox img:active { cursor: grabbing; }
.subtbl td, .subtbl th { font-size: 12.5px; padding: 6px 8px; }

/* ---------- 登录 ---------- */
.auth-wrap {
  min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 18px; padding: 40px 20px;
  background: radial-gradient(1200px 600px at 50% -10%, #26344a 0%, #16202e 60%, #0f1723 100%);
}
.auth-brand { text-align: center; color: #fff; }
.auth-logo {
  width: 52px; height: 52px; margin: 0 auto 12px; border-radius: 12px;
  background: linear-gradient(135deg,#f59e0b,#ea580c); color: #fff; font-size: 25px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.auth-brand h1 { font-size: 21px; margin-bottom: 4px; }
.auth-brand p { margin: 0; color: #93a1b5; font-size: 13px; }
.auth-card {
  width: 400px; max-width: 100%; background: #fff; border-radius: 12px; padding: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}
.auth-tabs { display: flex; gap: 4px; margin-bottom: 14px; border-bottom: 1px solid var(--line-2); }
/* 2026-10-26 账号密码登录：页脚「首次使用 / 设置密码」 */
.auth-foot { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line-2); font-size: 13px; }
.auth-foot a { color: var(--pri); text-decoration: none; }
.auth-foot a:hover { text-decoration: underline; }
.auth-foot .hint { color: var(--muted); }
.auth-tab {
  border: none; background: transparent; padding: 8px 10px; cursor: pointer; font-size: 13.2px;
  color: var(--tx-2); border-bottom: 2px solid transparent; font-family: inherit;
}
.auth-tab.on { color: var(--pri); border-bottom-color: var(--pri); font-weight: 600; }
.auth-body .field { margin-bottom: 12px; }
.auth-err { min-height: 18px; color: var(--bad); font-size: 12.5px; text-align: center; }
.auth-tip { color: #7f8b9d; font-size: 12.5px; }

/* 我的收入 · 人员卡片 */
.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.pcard-inc {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 13px 15px; cursor: pointer; transition: border-color .12s, box-shadow .12s, transform .12s;
}
.pcard-inc:hover { border-color: var(--pri); box-shadow: 0 4px 14px rgba(29,78,216,.12); transform: translateY(-1px); }
.pi-name { font-size: 14.5px; font-weight: 600; }
.pi-amt { font-size: 22px; font-weight: 700; line-height: 1.3; margin-top: 2px; }
.pi-sub { font-size: 12px; color: var(--tx-2); }

/* 可点击跳转的表格行 */
.tbl .row-link { cursor: pointer; }
.tbl .row-link:hover { background: #f2f6fd; }
/* 2026-10-25 工费结算「按人员 × 费用类型」：同一个人的第 2 行起弱化（姓名只在首行加粗） */
.tbl tr.sub-row td { background: #fcfdff; }
.tbl tr.sub-row:hover td { background: #f6f9ff; }

/* ---- 人员管理 / 手机号登录 相关 ---- */

/* 身份标签统计条 */
.stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.stat-row .stat {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px 12px;
}
.stat-row .stat .lab { color: var(--tx-2); font-size: 12px; }
.stat-row .stat .val { font-size: 22px; font-weight: 700; line-height: 1.2; margin-top: 2px; }

/* 停用人员整行淡化 */
.tbl tr.row-off td { opacity: .5; }

/* 表单必填星号 */
.field-lb .req { color: var(--bad); font-weight: 600; margin-left: 2px; }

/* 输入框下方的错误提示（如手机号格式不对） */
.field-err {
  color: var(--bad);
  font-size: 12px;
  margin-top: 4px;
  min-height: 16px;
}
.field-err:empty { min-height: 0; }

/* 信息色标签（施工工种等辅助信息） */
.tag-info { background: #e8f1fd; color: #1d4ed8; }

/* ================= 小程序模拟预览 ================= */

/* 人员选择 */
.who-pick {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 16px 4px;
}
.who-b {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font: inherit;
  text-align: left;
  min-width: 104px;
}
.who-b:hover { border-color: var(--pri); }
.who-b.on { border-color: var(--pri); background: #eef3ff; }
.who-b b { font-size: 13.5px; color: var(--tx); font-weight: 500; }
.who-b span { font-size: 11.5px; color: var(--tx-3); }
.who-b em { font-size: 11.5px; color: var(--info); font-style: normal; }
.chips-inline { display: inline-flex; flex-wrap: wrap; gap: 6px; margin-left: 6px; }

/* 手机外壳 */
.mp-stage {
  display: flex;
  gap: 24px;
  padding: 20px 16px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.mp-phone {
  width: 375px;
  flex: 0 0 375px;
  background: #10151c;
  border-radius: 34px;
  padding: 12px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .18);
  position: relative;
}
.mp-notch {
  height: 22px;
  width: 130px;
  background: #10151c;
  border-radius: 0 0 14px 14px;
  margin: -12px auto 6px;
  position: relative;
  z-index: 2;
}
.mp-screen {
  background: #f5f7fa;
  border-radius: 24px;
  height: 700px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mp-side {
  flex: 1;
  min-width: 250px;
  padding: 4px 0;
}
.mp-side-hd { font-size: 14px; font-weight: 500; color: var(--tx); margin-bottom: 10px; }
.mp-row {
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
  border-bottom: 1px dashed var(--line);
  font-size: 13px;
  color: var(--tx-2);
}
.mp-row b { color: var(--tx); font-weight: 500; }
.mp-note {
  margin-top: 12px;
  padding: 10px 12px;
  background: #fff8ec;
  border-left: 3px solid var(--warn);
  border-radius: 0 6px 6px 0;
  font-size: 12.5px;
  color: #7c5a12;
  line-height: 1.7;
}

/* 手机内部 */
.mp-tabs {
  display: flex;
  border-bottom: 1px solid #e4e8ef;
  background: #fff;
  flex-shrink: 0;
}
.mp-tab {
  flex: 1;
  padding: 12px 4px;
  border: 0;
  background: none;
  font-size: 13px;
  color: var(--tx-2);
  cursor: pointer;
  position: relative;
  font-family: inherit;
}
.mp-tab.on { color: var(--pri); font-weight: 500; }
.mp-tab.on::after {
  content: '';
  position: absolute;
  left: 20%; right: 20%; bottom: 0;
  height: 2px;
  background: var(--pri);
}
.mp-tab i {
  font-style: normal;
  font-size: 10.5px;
  background: #eef2f7;
  color: var(--tx-2);
  border-radius: 8px;
  padding: 0 5px;
  margin-left: 3px;
}
.mp-body { flex: 1; overflow-y: auto; padding: 12px; }
.mp-back {
  padding: 10px 14px;
  background: #fff;
  border-bottom: 1px solid #e4e8ef;
  font-size: 13px;
  color: var(--pri);
  cursor: pointer;
  flex-shrink: 0;
}
.mp-hero {
  background: linear-gradient(135deg, #1d4ed8, #2563eb);
  color: #fff;
  border-radius: 12px;
  padding: 18px 16px;
  margin-bottom: 12px;
}
.mp-hi { font-size: 17px; font-weight: 500; }
.mp-hs { font-size: 12px; opacity: .88; margin-top: 3px; }
.mp-big { font-size: 30px; font-weight: 700; margin-top: 8px; }
.mp-card {
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 12px;
}
.mp-ct { font-size: 13.5px; font-weight: 500; margin-bottom: 10px; color: var(--tx); }
.mp-fr { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; }
.mp-fr b { font-size: 14.5px; }
.mp-gap { margin-top: 10px; margin-bottom: 8px; }
.mp-tag {
  font-size: 10.5px;
  background: #eef2f7;
  color: var(--tx-2);
  border-radius: 4px;
  padding: 2px 6px;
}
.mp-tag.o { background: #fff7ed; color: var(--warn); }
.mp-tag.g { background: #e8f6ed; color: var(--ok); }
.mp-tip { font-size: 11px; color: var(--tx-3); margin-left: auto; }
.mp-kv {
  display: flex;
  gap: 10px;
  font-size: 12.5px;
  padding: 4px 0;
  line-height: 1.6;
}
.mp-kv span { color: var(--tx-3); flex: 0 0 62px; }
.mp-kv b { color: var(--tx); font-weight: 400; flex: 1; word-break: break-all; }
.mp-row2 { padding: 7px 0; border-bottom: 1px dashed #eef1f6; }
.mp-row2 b { font-size: 13.5px; display: block; }
.mp-row2 span { font-size: 12px; color: var(--tx-2); }
.mp-row2 em { font-size: 11.5px; color: var(--tx-3); font-style: normal; display: block; }
.mp-btn {
  margin-top: 10px;
  text-align: center;
  background: var(--pri);
  color: #fff;
  border-radius: 8px;
  padding: 10px;
  font-size: 13.5px;
  cursor: pointer;
}
.mp-btn.ghost { background: #fff; color: var(--pri); border: 1px solid var(--pri); }
.mp-empty { text-align: center; color: var(--tx-3); font-size: 12.5px; padding: 26px 0; }
.mp-fld { margin-bottom: 12px; }
.mp-fld label { display: block; font-size: 12.5px; color: var(--tx-2); margin-bottom: 5px; }
.mp-fld label b { color: #b91c1c; }
.mp-input {
  background: #f5f7fa;
  border-radius: 7px;
  padding: 9px 11px;
  font-size: 13px;
  color: var(--tx-3);
}
.mp-ph { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mp-ph-e {
  width: 62px; height: 62px;
  border-radius: 7px;
  background: #e9edf3;
}
.mp-ph-add {
  width: 62px; height: 62px;
  border: 1px dashed #cfd6e0;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a3adbd;
  font-size: 22px;
}
.mp-tip2 { font-size: 11.5px; color: var(--tx-3); margin-top: 6px; line-height: 1.6; }

/* ---- 模拟器回单表单（可真实填写 / 选照片） ---- */
.mp-livebar {
  margin: 0 0 12px;
  padding: 9px 14px;
  border-radius: 8px;
  background: #fff4e5;
  border: 1px solid #f0cf9b;
  color: #8a5a10;
  font-size: 12.5px;
  line-height: 1.7;
}
.tag-bad { background: #fdeceb; color: #b91c1c; border: 1px solid #f5c6c3; }

.mp-in {
  width: 100%;
  height: 34px;
  padding: 0 10px;
  border: 1px solid #d8dee7;
  border-radius: 7px;
  font-size: 13px;
  font-family: inherit;
  color: var(--tx);
  background: #fff;
  outline: none;
}
.mp-in:focus { border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29, 78, 216, .12); }
.mp-in.num { width: 88px; text-align: right; }
.mp-kv b .mp-in { width: 92px; }

.mp-ct2 {
  font-size: 12px; font-weight: 600; color: var(--tx-2);
  margin: 14px 0 8px;
}

/* 卸货方式二选一 */
.mp-seg2 {
  display: flex;
  gap: 6px;
  padding: 4px;
  background: #f1f3f7;
  border-radius: 8px;
}
.mp-seg {
  flex: 1;
  height: 34px;
  line-height: 34px;
  text-align: center;
  font-size: 13px;
  color: var(--tx-2);
  border-radius: 6px;
  cursor: pointer;
  user-select: none;
}
.mp-seg.on {
  background: #fff;
  color: var(--pri);
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(18, 41, 74, .14);
}
.mp-seg.dis {
  color: var(--tx-3);
  background: transparent;
  cursor: not-allowed;
}

/* 附加费用类型快捷选择 */
.mp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.mp-chip {
  padding: 5px 12px;
  border-radius: 999px;
  background: #f1f3f7;
  color: var(--tx-2);
  font-size: 12.5px;
  cursor: pointer;
  user-select: none;
}
.mp-chip.on {
  background: var(--pri);
  color: #fff;
  font-weight: 600;
}
.mp-ph-add { cursor: pointer; font-size: 13px; color: var(--pri); }
.mp-ph-add:hover { background: #f0f5ff; border-color: var(--pri); }
.mp-prev { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.mp-th {
  position: relative;
  width: 62px; height: 62px;
  border-radius: 7px;
  overflow: hidden;
  background: #eef1f6;
  border: 1px solid #e3e8ef;
}
.mp-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mp-th i {
  position: absolute; top: 1px; right: 1px;
  width: 16px; height: 16px; line-height: 14px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .55);
  color: #fff; font-size: 11px; font-style: normal;
  text-align: center; cursor: pointer;
}
.mp-th i:hover { background: #b91c1c; }
.mp-th.empty {
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; color: var(--tx-3); border-style: dashed;
}

.mp-pay {
  background: #f2f8f4;
  border: 1px solid #cfe6d8;
  border-radius: 8px;
  padding: 10px 12px;
  margin: 12px 0;
  display: flex; flex-direction: column; gap: 3px;
  font-size: 12px; color: var(--tx-2);
}
.mp-btn.dis {
  background: #e9edf3; color: #a3adbd; cursor: not-allowed;
  border-color: transparent;
}
.mp-btn.ghost.dis { background: #fff; color: #c3cbd8; border-color: #e3e8ef; }

/* ============== 派单台 · 车辆排班模式 ============== */
.dp2 {
  --g: #12864b;  --g-bg: #e6f6ec;  --g-line: #a5d9bd;  --g-ink: #0d6b3c;
  --b: #1f5fd0;  --b-bg: #e7eefc;  --b-line: #a9c3ee;  --b-ink: #1a4fac;
  --n: #6b7684;  --n-bg: #f1f3f7;  --n-line: #d9dee7;
  display: flex;
  flex-direction: column;
  /* 2026-10-16 老板口径：页面最下面不留空白 ——
     .content 的上内边距 20 / 下内边距 40 全部抵消掉：上给 -8（留 12px 呼吸位），
     下给 -40 把下内边距吃回来，于是派单台正好铺满一屏（底部那条提示文字删掉后
     留下的空档也就被表格 / 订单池填满了）。 */
  height: calc(100vh - 12px);
  margin: -8px -12px -40px;
  background: #eef1f6;
}

/* 顶栏 */
.dp2-nav {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 10px 16px;
  background: #1c2635;
  color: #dbe4f0;
  flex-shrink: 0;
}
.dp2-brand { display: flex; align-items: center; gap: 10px; }
.dp2-logo {
  width: 34px; height: 34px;
  border-radius: 8px;
  background: var(--pri);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 600;
}
.dp2-brand h1 { margin: 0; font-size: 15px; font-weight: 600; color: #fff; }
.dp2-brand p { margin: 1px 0 0; font-size: 11.5px; color: #8fa3bd; }
/* 2026-10-21：标题下的「当前账号派单范围 + 前端版本」—— 排查"看不到某功能"时一眼定位 */
.dp2-brand .dp2-scope { color: #6f8ba8; font-size: 11px; letter-spacing: .2px; }
.dp2-stats { display: flex; gap: 8px; margin-left: auto; }
.dp2-stat {
  min-width: 76px;
  padding: 5px 10px;
  border-radius: 7px;
  background: rgba(255,255,255,.07);
  text-align: center;
}
.dp2-stat b { display: block; font-size: 17px; font-weight: 600; color: #fff; line-height: 1.2; }
.dp2-stat span { font-size: 10.5px; color: #8fa3bd; }
.dp2-stat.g b { color: #6ee7a8; }
.dp2-stat.b b { color: #93c5fd; }
.dp2-stat.w b { color: #fcd34d; }
.dp2-stat.r b { color: #fca5a5; }
.dp2-acts { display: flex; gap: 8px; }
.dp2-acts .btn { height: 32px; font-size: 13px; }
.dp2-acts .btn-ghost {
  background: rgba(255,255,255,.08);
  color: #dbe4f0;
  border: 1px solid rgba(255,255,255,.16);
}
.dp2-acts .btn-ghost:hover { background: rgba(255,255,255,.14); }
.dp2-acts .btn:disabled { opacity: .4; cursor: not-allowed; }

/* 主体三栏 */
.dp2-main { flex: 1; display: flex; min-height: 0; }
.dp2-panel {
  background: #fff;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.dp2-panel.left { flex: 0 0 62%; border-right: 1px solid #dfe4ec; }
.dp2-panel.right { flex: 1; }
.dp2-phead {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-bottom: 1px solid #eaeef4;
  flex-shrink: 0;
}
.dp2-phead h2 { margin: 0; font-size: 14px; font-weight: 600; }
.dp2-phead .tag {
  font-size: 11.5px; background: #eef2f7; color: var(--tx-2);
  padding: 2px 8px; border-radius: 4px;
}
.dp2-phead .grow { flex: 1; }
.dp2-phead .hint { font-size: 11.5px; color: #97a1b0; }
.dp2-legend { display: flex; gap: 10px; font-size: 11.5px; color: var(--tx-2); }
.dp2-legend .lg {
  display: inline-block; width: 11px; height: 11px;
  border-radius: 3px; margin-right: 4px; vertical-align: -1px;
}
.dp2-legend .lg.g { background: var(--g-bg); border: 1px solid var(--g-line); }
.dp2-legend .lg.b { background: var(--b-bg); border: 1px solid var(--b-line); }
.dp2-legend .lg.n { background: var(--n-bg); border: 1px solid var(--n-line); }

/* 车辆表格 */
.dp2-tblwrap {
  flex: 1;
  /* 2026-10-16 老板口径：横向**不滚动也不压缩** —— 拖边界时表格保持自己的尺寸，
     超出部分直接裁掉（藏在后面）；纵向仍然可以滚（车多） */
  overflow-y: auto;
  overflow-x: hidden;
}
/* 2026-10-16 老板口径（第三轮）：宽度由 JS 写死（各列宽之和），不再 width:100% 跟着面板拉伸 ——
   拖左右边界时每个单元格尺寸 / 位置都不动，往左拖只是把右边的列裁掉 */
.dp2-grid { border-collapse: separate; border-spacing: 0; font-size: 12.5px; }
.dp2-grid th, .dp2-grid td {
  border-bottom: 1px solid #eaeef4;
  padding: 6px 5px;
  text-align: center;
}
.dp2-grid thead th {
  position: sticky; top: 0; z-index: 3;
  background: #f7f9fc;
  font-size: 11.5px; font-weight: 500; color: var(--tx-2);
  border-bottom: 1px solid #dfe4ec;
}
.dp2-grid tr.grp th { top: 0; z-index: 4; }
.dp2-grid thead tr:nth-child(2) th { top: 26px; }
.dp2-grid .c-idx { min-width: 96px; }   /* 车牌加粗加大后要更宽（2026-10-16） */
.dp2-grid .c-drv { min-width: 96px; }
.dp2-grid .c-phone { min-width: 84px; }
.dp2-grid .c-cap { min-width: 84px; }
.dp2-grid .c-bar { min-width: 92px; }
.dp2-grid td.c-drv { text-align: left; }
.dp2-grid td.c-drv b { font-size: 12.5px; font-weight: 500; }
.mini-tag {
  display: inline-block; font-size: 10px; margin-left: 3px;
  background: #eef2f7; color: var(--tx-2); border-radius: 3px; padding: 0 3px;
}
.tiny { font-size: 11px; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; }
.dp2-grid tr.over td { background: #fff5f5; }

.slot {
  min-width: 62px; height: 42px;
  vertical-align: middle;
  cursor: pointer;
  border: 1px dashed transparent;
}
.slot.over { background: #eef3ff; border-color: var(--pri); }
.slot-ph { color: #c8d0da; font-size: 11.5px; }
.sc {
  position: relative;
  border-radius: 5px;
  padding: 3px;                 /* 内边距压到 3px：一格正文宽 73px，正好 6 个中文字一行（12px×6） */
  cursor: grab;
  border: 1px solid;
}
.sc b { display: block; font-size: 12px; font-weight: 600; line-height: 1.2; }
.sc em { display: block; font-size: 10.5px; font-style: normal; opacity: .8; }
.sc.green { background: var(--g-bg); border-color: var(--g-line); color: var(--g-ink); }
.sc.blue { background: var(--b-bg); border-color: var(--b-line); color: var(--b-ink); }
.sc.none { background: var(--n-bg); border-color: var(--n-line); color: var(--n); }
.sc.sel { outline: 2px solid var(--pri); }
.sc .x {
  position: absolute; top: -5px; right: -5px;
  width: 15px; height: 15px; line-height: 13px;
  border-radius: 50%; background: #b91c1c; color: #fff;
  font-size: 11px; font-style: normal; text-align: center;
  cursor: pointer; display: none;
}
.sc:hover .x { display: block; }
.oc.dragging, .sc.dragging { opacity: .5; }

.bar {
  height: 6px; border-radius: 3px; background: #eef1f6;
  overflow: hidden; margin-bottom: 2px;
}
.bar i { display: block; height: 100%; background: var(--g); }
.bar.hi i { background: #d97706; }
.bar.over i { background: #b91c1c; }
.rate { font-size: 10.5px; color: var(--tx-2); }
.empty { padding: 24px; color: var(--tx-3); font-size: 13px; }

/* 2026-10-16 老板口径：中间那条边界栏上的「‹ / 派 单 / 三个计数块」全部去掉，
   只留 #vsplit 那条可左右拖的竖条（样式见文件后面的 .dp2-vsplit）。 */

/* 订单池 */
.dp2-tools {
  display: flex; gap: 8px; align-items: center;
  padding: 8px 14px; border-bottom: 1px solid #eaeef4;
  flex-wrap: wrap; flex-shrink: 0;
}
/* 剩余材料提醒条（施工人员回传 → 派单员处置） */
.dp2-matbar {
  flex: 0 0 auto; margin: 8px 14px 0; padding: 6px 10px;
  background: #fff8e6; border: 1px solid #f0d9a8; border-radius: 6px;
  font-size: 12px; color: #8a5a00; max-height: 66px; overflow-y: auto;
}
.dp2-matbar > b { color: #a5661f; }
.dp2-matitem {
  display: inline-block; margin: 2px 8px 2px 0; padding: 2px 7px;
  background: #fff; border: 1px solid #ecd9b0; border-radius: 4px; cursor: pointer;
}
.dp2-matitem:hover { border-color: var(--pri); color: var(--pri); }

/* 2026-10-24 搜索定位条：关键字命中的单已经派到排班表（当前池里看不到）时列在这里 */
.dp2-hitbar {
  flex: 0 0 auto; margin: 8px 14px 0; padding: 6px 10px;
  background: #eef4ff; border: 1px solid #c3d7fb; border-radius: 6px;
  font-size: 12px; color: #1e3a8a; max-height: 92px; overflow-y: auto;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.dp2-hitbar > b { color: #1d4ed8; }
.dp2-hitbar .hit-tip { color: #64748b; font-size: 11.5px; margin-right: 4px; }
.dp2-hitbar .hit-item {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 8px; background: #fff; border: 1px solid #c3d7fb;
  border-radius: 5px; cursor: pointer; text-decoration: none; color: inherit;
  max-width: 100%;
}
.dp2-hitbar .hit-item:hover { border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29,78,216,.12); }
.dp2-hitbar .hit-item em { font-style: normal; color: #64748b; font-family: ui-monospace, Menlo, Consolas, monospace; }
.dp2-hitbar .hit-item b { font-weight: 600; }
.dp2-hitbar .hit-item span { color: #1d4ed8; }
.dp2-hitbar .hit-more { color: #64748b; font-size: 11.5px; }

/* 搜到的卡（池里 / 排班表格位里）统一描边；格位卡再叠一层脉冲，一眼看到在哪台车 */
.oc.hit { border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29,78,216,.20); }
.sc.hit { outline: 2px solid var(--pri); outline-offset: 1px; }
@keyframes dp2HitPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(29,78,216,.55); }
  50%      { box-shadow: 0 0 0 6px rgba(29,78,216,0); }
}
.sc.hit.flash { animation: dp2HitPulse 1.2s ease-out 2; }

.dp2-tools .seg { display: flex; border: 1px solid #dfe4ec; border-radius: 6px; overflow: hidden; }
.dp2-tools .seg button {
  padding: 5px 10px; border: 0; background: #fff;
  font-size: 12px; color: var(--tx-2); cursor: pointer;
  border-right: 1px solid #eaeef4;
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.dp2-tools .seg button:last-child { border-right: 0; }
.dp2-tools .seg button.on { background: var(--pri); color: #fff; }
.dp2-tools .search {
  flex: 1; min-width: 120px; height: 28px;
  padding: 0 10px; font-size: 12.5px;
  border: 1px solid #dfe4ec; border-radius: 6px;
}
.dp2-tools .sel {
  height: 28px; font-size: 12.5px;
  padding: 0 8px; border: 1px solid #dfe4ec; border-radius: 6px; background: #fff;
}
.dp2-pool { flex: 1; overflow-y: auto; padding: 10px; }

.oc {
  /* 2026-10-20 老板口径：边框加粗 50% 并改黑（1px → 1.5px；左侧状态条 3px → 4px） */
  border: 1.5px solid #111;
  border-radius: 6px;
  padding: 5px 7px;
  margin-bottom: 0;
  cursor: grab;
  background: #fff;
  border-left-width: 4px;
  overflow: hidden;               /* 卡片内文字最多两行，超出直接裁掉 */
  max-height: 46px;
}
/* 2026-10-11 老板口径：整张卡片底色直接反映电梯档（有电梯=绿，无电梯=蓝），
   卡片尺寸一律不动（padding / max-height 都不改），只换 background */
.oc.green { border-left-color: var(--g); background: var(--g-bg); }
.oc.blue { border-left-color: var(--b); background: var(--b-bg); }
.oc.none { border-left-color: #111; }   /* 2026-10-20：未定档也走黑边 */
/* 2026-10-17 老板口径：录单备注里出现「加急 / 早 / 中午 / 下午 / 期望」等字眼 →
   派单池卡片一角挂**黄色感叹号**（表示加急或有特别要求），塞在第一行，不撑高卡片 */
.oc-ug {
  flex: 0 0 auto; margin-left: auto;
  font-size: 11px; font-weight: 800; line-height: 1.35; letter-spacing: 0;
  padding: 0 5px; border-radius: 3px;
  background: #fef3c7; color: #b45309; border: 1px solid #fbbf24;
}
.oc.sel { border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29,78,216,.14); }
/* 2026-10-15 超次数异常锁单：灰底、禁止抓取光标、卡片内嵌「建上门费单」按钮（卡片自动撑高） */
.oc.locked {
  background: #f3f4f6; border-left-color: #9ca3af; border-style: dashed;
  cursor: not-allowed; max-height: none; opacity: .82;
}
.oc.locked .oc-a { color: #6b7280; }
.oc-lock {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  margin-top: 4px; padding-top: 4px; border-top: 1px dashed #d1d5db;
}
.oc-lock b { font-size: 10.5px; color: #b45309; font-weight: 700; white-space: nowrap; }
.oc-lock .mini.lf {
  font-size: 10.5px; line-height: 1.6; padding: 0 8px; cursor: pointer;
  background: #b45309; color: #fff; border: none; border-radius: 4px;
}
.oc-lock .mini.lf:hover { background: #92400e; }
.oc-h { display: flex; align-items: center; gap: 4px; line-height: 1.35; }
.oc-h b { font-size: 12px; font-weight: 600; }
.oc-tag { font-size: 10.5px; background: #eef2f7; color: var(--tx-2); padding: 1px 5px; border-radius: 3px; }
.oc-l { font-size: 12.5px; color: var(--tx); }
.oc-a { font-size: 11px; color: var(--tx-2); margin-top: 1px; line-height: 1.35; }
.oc-m { display: flex; gap: 6px; margin-top: 5px; flex-wrap: wrap; }
.oc-m .m { font-size: 11px; padding: 1px 6px; border-radius: 3px; background: #f1f3f7; color: var(--tx-2); }
.oc-m .m.l.green { background: var(--g-bg); color: var(--g-ink); }
.oc-m .m.l.blue { background: var(--b-bg); color: var(--b-ink); }
.oc-m .m.l.none { background: var(--n-bg); color: var(--n); }
.oc-lift { display: flex; align-items: center; gap: 5px; margin-top: 7px; }
.oc-lift span { font-size: 11.5px; color: var(--tx-2); }
.oc-lift .mini {
  padding: 3px 10px; font-size: 11.5px; border-radius: 5px;
  border: 1px solid #dfe4ec; background: #fff; cursor: pointer; color: var(--tx-2);
}
.oc-lift .mini.lg { border-color: var(--g-line); background: var(--g-bg); color: var(--g-ink); }
.oc-lift .mini.lb { border-color: var(--b-line); background: var(--b-bg); color: var(--b-ink); }
.oc-why { font-size: 11px; color: #97a1b0; margin-top: 5px; }
.oc-r { font-size: 11px; color: #97a1b0; margin-top: 3px; }
/* 已派的订单：保留在池里但视觉降级，打「已派」标 */
.oc.done { background: #f6f9f4; border-left-color: #b7d8b1; }
.oc.done .oc-l, .oc.done .oc-a { color: #8a94a4; }
.oc-tag.ok { background: #e8f6ed; color: var(--ok); font-weight: 600; }
.dp2-empty { text-align: center; color: #97a1b0; font-size: 13px; padding: 40px 0; }

/* 底部提示 */
.dp2-tipbar {
  padding: 7px 16px;
  background: #eef3ff;
  border-top: 1px solid #c9daf8;
  font-size: 12.5px; color: var(--b-ink);
  flex-shrink: 0;
}

@media (max-width: 1280px) {
  .dp2-panel.left { flex: 0 0 55%; }
  .dp2-stats .dp2-stat:nth-child(n+4) { display: none; }
}

/* ---- 派单台 v2：表格线 + 订单池三列 ---- */

/* 车辆排班表：清晰的表格线，每行有明确下划线 */
.dp2-grid {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.dp2-grid th,
.dp2-grid td {
  border-right: 1px solid #e3e8ef;   /* 竖线 */
  border-bottom: 1px solid #d8dee7;  /* 横线：每行下划线 */
  padding: 7px 6px;
  text-align: center;
  vertical-align: middle;
}
.dp2-grid thead th {
  border-bottom: 2px solid #c3ccd8;
  background: #eef2f7;
  color: #4a5568;
  font-size: 11.5px;
  font-weight: 600;
}
.dp2-grid tbody tr:nth-child(even) td { background: #fafbfd; }
.dp2-grid tbody tr:nth-child(even) td.slot,
.dp2-grid tbody tr:nth-child(even) td.c-bar { background: #fafbfd; }
.dp2-grid tbody tr:hover td { background: #f0f5ff; }
.dp2-grid tbody tr.over td { background: #fff2f2; }
.dp2-grid tbody tr.over td:hover { background: #ffe9e9; }
/* 车牌列更醒目 —— 2026-10-16 老板口径（第三轮）：
   ① 车号字号再加大（15 → 17px），一行放得下整块车牌，不折行；
   ② 车号颜色按车号取色（同一车号永远同色，见 dispatch.js 的 plateColor）+ 加粗，
      一排车一眼分得清谁是谁。 */
.dp2-grid td.c-idx {
  font-size: 17px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: .3px;
  white-space: nowrap;
  background: #f4f6fa !important;
  border-left: 2px solid #d8dee7;
}
/* 车辆模式里车牌是 <span class="mono plate">（颜色写在其 style 上），
   施工 / 测量模式里是 <b>姓名</b> —— 都要大 */
.dp2-grid td.c-idx .mono,
.dp2-grid td.c-idx b {
  font-size: 17px;
  font-weight: 800;
  color: #0f172a;
  font-family: inherit;
  white-space: nowrap;
}
.dp2-grid td.c-idx .mono.plate { font-family: ui-monospace, Consolas, Menlo, monospace; letter-spacing: .5px; }
.dp2-grid td.c-drv { text-align: left; }
/* 每个货位之间有明确分隔 · 2026-10-16 老板口径（第三轮）：单元格尺寸固定，
   一格 86×48px，正好「两行文字、每行六个字」（正文 12px×6 = 72px） */
.dp2-grid .slot {
  border-right: 1px solid #e3e8ef;
  min-width: 0;
  height: 48px;
  padding: 2px;
}
.dp2-grid .slot-ph { color: #c5cdd8; font-size: 12px; }
.slot.over {
  background: #dbe8ff !important;
  box-shadow: inset 0 0 0 2px var(--pri);
  border-radius: 4px;
}
.sc { width: 100%; }
.sc b {
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.sc .x { display: none; }
.sc:hover .x { display: block; }

/* 派单池：每行 6 张卡（2026-10-10 老板定稿）；窄屏才逐级降列 */
.dp2-pool {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: minmax(56px, auto);
  gap: 8px;
  padding: 8px 10px;
  align-content: start;
  /* 2026-10-20：卡片高度各按自己内容来（不再被整行最高的那张拉伸） */
  align-items: start;
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
}
.dp2-pool .oc { margin-bottom: 0; }
@media (max-width: 1500px) { .dp2-pool { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 1150px) { .dp2-pool { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .dp2-pool { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* 三列下卡片内容需要更紧凑 */
.oc-h { flex-wrap: wrap; }
.oc-a {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; line-height: 1.45;
}
.oc-m { gap: 4px; }
.oc-m .m { font-size: 10.5px; padding: 1px 5px; }
.oc-why, .oc-r {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dp2-empty { grid-column: 1 / -1; }

/* 派单池一行 6 张，右栏要占更多空间 → 左栏（车辆排班表）让出宽度 */
.dp2-panel.left { flex: 0 0 45%; }

/* ---- 派单台 v3：增量渲染相关 ---- */

/* 顶栏模式切换：车辆配送 / 施工排班 / 测量派单 */
.dp2-modes {
  display: flex;
  gap: 4px;
  margin-left: 14px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 9px;
  padding: 3px;
}
.dp2-modes button {
  height: 28px;
  padding: 0 12px;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: #a9b7cb;
  background: transparent;
  white-space: nowrap;
}
.dp2-modes button:hover { color: #e6edf7; background: rgba(255, 255, 255, .08); }
.dp2-modes button.on {
  background: var(--pri);
  color: #fff;
  box-shadow: 0 2px 8px rgba(29, 78, 216, .4);
}

/* 工位排满的行（施工 / 测量模式） */
.dp2-grid tbody tr.full td { background: #fff8ec; }
.dp2-grid tbody tr.full td.slot { background: #fff8ec; }
.dp2-grid tbody tr.full td.c-idx { background: #fdf3e4 !important; }

/* 顶栏同步指示 */
.dp2-busy {
  font-size: 11.5px;
  color: #fcd34d;
  background: rgba(252, 211, 77, .12);
  border: 1px solid rgba(252, 211, 77, .3);
  border-radius: 20px;
  padding: 2px 10px;
  animation: dpPulse 1s infinite alternate;
}
@keyframes dpPulse { from { opacity: .55; } to { opacity: 1; } }

/* 格内小卡：已落库 vs 本次暂存 */
.sc.lk { opacity: .92; }
.sc.staged { box-shadow: inset 3px 0 0 #1d4ed8; }
.sc.staged::after {
  content: "改";
  position: absolute;
  top: -6px; left: -4px;
  width: 15px; height: 15px;
  border-radius: 50%;
  background: #1d4ed8;
  color: #fff;
  font-size: 9px;
  font-style: normal;
  line-height: 15px;
  text-align: center;
}

/* 卡片移出池子时的淡出（其实直接移除，这里只是兜底） */
.oc.gone { opacity: 0; transform: scale(.96); transition: .12s; }


/* 确认弹窗 */
.dp2-mask {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(18, 26, 38, .48);
  display: none;
  align-items: center; justify-content: center;
  padding: 24px;
}
.dp2-mask.on { display: flex; }
.dp2-modal {
  background: #fff;
  border-radius: 12px;
  width: min(920px, 94vw);
  max-height: 86vh;
  display: flex; flex-direction: column;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}
.dp2-mhead {
  display: flex; align-items: center;
  padding: 14px 18px;
  font-size: 15px; font-weight: 600;
  border-bottom: 1px solid #eaeef4;
  background: #f7f9fc;
}
.dp2-mhead .grow { flex: 1; }
.dp2-mhead .x {
  cursor: pointer; font-style: normal;
  width: 24px; height: 24px; line-height: 22px;
  text-align: center; border-radius: 6px;
  color: var(--tx-2); font-size: 16px;
}
.dp2-mhead .x:hover { background: #eef2f7; color: var(--tx); }
.dp2-mbody { padding: 14px 18px; overflow: auto; flex: 1; }
.dp2-mfoot {
  display: flex; justify-content: flex-end; gap: 10px;
  padding: 12px 18px;
  border-top: 1px solid #eaeef4;
  background: #f7f9fc;
}
.dp2-msum { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.dp2-msum div {
  flex: 1; min-width: 110px;
  border: 1px solid #e3e8ef; border-radius: 9px;
  padding: 9px 12px; background: #f7f9fc;
}
.dp2-msum b { display: block; font-size: 19px; font-weight: 600; }
.dp2-msum span { font-size: 11.5px; color: var(--tx-2); }
.dp2-warn {
  border: 1px solid #f0d9b5; background: #fff8ec; color: #8a5a10;
  border-radius: 9px; padding: 9px 12px; font-size: 12.5px;
  line-height: 1.7; margin-bottom: 12px;
}
.dp2-warn.ok { border-color: #a9d9bf; background: var(--g-bg); color: var(--g-ink); }
.dp2-mrow {
  margin-bottom: 10px;
  border: 1px solid #e3e8ef; border-radius: 10px; overflow: hidden;
}
.dp2-mrow > header {
  background: #f7f9fc; padding: 7px 12px; font-size: 12.5px;
  border-bottom: 1px solid #eaeef4;
}
.dp2-mrow > header b { font-family: ui-monospace, Menlo, Consolas, monospace; }
.dp2-mrow > header .bad { color: #b91c1c; font-weight: 600; }
.dp2-mrow ul { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 9px 12px; }
.dp2-mrow li {
  font-size: 11.5px; padding: 3px 8px; border-radius: 6px;
  border: 1px solid #e3e8ef; background: #fff; color: var(--tx);
}
.dp2-mrow li i { font-style: normal; opacity: .55; margin-right: 5px; }
.dp2-mrow li.t-green { background: var(--g-bg); border-color: var(--g-line); color: var(--g-ink); }
.dp2-mrow li.t-blue { background: var(--b-bg); border-color: var(--b-line); color: var(--b-ink); }
.dp2-mrow li.t-none { background: var(--n-bg); border-color: var(--n-line); color: var(--n); }
.dp2-mrow li.ph { opacity: .45; }

/* ============== 派单台 · 订单池卡片精简（2026-10-10 第二轮） ============== */
.oc-a.one {
  -webkit-line-clamp: 1;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.oc-d {
  font-size: 10.5px; color: var(--tx-3); margin-top: 1px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.oc-h .m.w {
  background: #eef2f7; color: var(--tx); font-weight: 600;
  font-size: 11px; padding: 1px 6px; border-radius: 3px;
}
.oc-h .m.l { font-size: 11px; padding: 1px 6px; border-radius: 3px; }
.oc-h .m.l.green { background: var(--g-bg); color: var(--g-ink); }
.oc-h .m.l.blue { background: var(--b-bg); color: var(--b-ink); }
.oc-h .m.l.none { background: var(--n-bg); color: var(--n); }
/* 2026-10-20：施工时间小标（指定日期显示 10/21，其余显示 尽快 / 等通知） */
.oc-h .m.wd {
  font-size: 11px; padding: 1px 5px; border-radius: 3px; font-weight: 600;
  white-space: nowrap; flex: 0 0 auto;
}
.oc-h .m.wd.spec { background: #e8f0fe; color: #1d4ed8; border: 1px solid #c7d9fb; }
.oc-h .m.wd.notice { background: #f1f3f7; color: #55617a; border: 1px solid #dde3ec; }
.oc-h .m.wd.asap { background: #fff3e0; color: #a5661f; border: 1px solid #f2ddbc; }
.oc.done .oc-h .m.wd { opacity: .7; }
/* 施工池「按施工时间筛选」下拉：限定宽度，选项里带张数，太窄会看不全 */
.dp2-tools .sel.wdsel { max-width: 190px; }

/* ============== 派单台 · 待排活动池（2026-10-10 第四轮：3 格 + 占半屏高） ============== */
.dp2-panel.right { display: flex; flex-direction: column; }
.dp2-hold {
  flex: 0 0 50%;                      /* 整体占右栏（＝页面主体）高度的二分之一 */
  /* 2026-10-20 老板口径：活动池要能压到整个屏幕高度的 1/10 左右。
     原来 min-height:400px 在 1080p 上相当于 40%，怎么拖都下不去 —— 收到 96px。 */
  min-height: 96px;
  display: flex; flex-direction: column;
  border-top: 1px solid #dfe4ec;
  background: #f7f9fc;
  padding: 7px 10px 9px;
}
.dp2-holdhd { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; margin-bottom: 6px; flex-shrink: 0; }
.dp2-holdhd .hint { font-weight: 400; }
/* 2026-10-11：2 个待排格 + 最右边 1 个订单详情展示池 */
.dp2-holdgrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(240px, 1.05fr);
  gap: 8px;
  flex: 1; min-height: 0;
}

/* ---- 订单详情展示池（最右边那格，2026-10-11） ---- */
.dp2-dpanel {
  background: #fff; border: 1px solid #e3e8ef; border-radius: 7px;
  display: flex; flex-direction: column; min-height: 0; overflow: hidden;
}
.dp2-dhead {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  padding: 4px 6px 4px 8px; border-bottom: 1px solid #eef1f6; background: #f6f8fb;
  font-size: 12px; font-weight: 600; flex-shrink: 0;
}
.dp2-dbody { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 8px 8px; }
.dp2-drow {
  display: flex; gap: 6px; align-items: flex-start;
  font-size: 12px; line-height: 1.75; padding: 2px 0;
  border-bottom: 1px dashed #f0f3f7;
}
.dp2-drow:last-child { border-bottom: 0; }
/* 详情池里的货品明细 / 已指派人员：一行一条，「品名 … 数量」 */
.dp2-dsub {
  font-size: 11px; color: var(--tx-3); font-weight: 600;
  margin: 6px 0 2px; padding-top: 4px; border-top: 1px dashed #e6eaf0;
}
.dp2-dsub.mut { color: #a3adbb; font-weight: 400; border-top: 0; padding-top: 2px; }
.dp2-dgoods { display: flex; flex-direction: column; gap: 1px; }
.dp2-dgoods .g { display: flex; gap: 6px; align-items: baseline; font-size: 11.5px; line-height: 1.6; }
.dp2-dgoods .g .n {
  flex: 1; min-width: 0; color: var(--tx-1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dp2-dgoods .g .q { flex: 0 0 auto; font-weight: 600; color: var(--pri); }
.dp2-dgoods.crew .g .q { color: var(--tx-1); font-weight: 600; }
.dp2-drow .k { flex: 0 0 58px; color: var(--tx-3); font-weight: 400; }
.dp2-drow .v { flex: 1; min-width: 0; color: var(--tx-1); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp2-drow .v.wrap { font-weight: 400; white-space: normal; word-break: break-all; }
.dp2-dempty {
  flex: 1; display: flex; align-items: center; justify-content: center; text-align: center;
  color: #a8b2c1; font-size: 12px; line-height: 1.9; padding: 14px 10px;
}
.dp2-holdbox {
  background: #fff; border: 1px dashed #c8d0da; border-radius: 7px;
  min-height: 0; padding: 4px 5px 6px;
  display: flex; flex-direction: column;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.dp2-holdbox.over { border-color: var(--pri); background: #f3f7ff; box-shadow: 0 0 0 2px rgba(29,78,216,.12); }
/* 2026-10-20 老板口径：订单池也是拖拽落点（活动池 / 排班表里的卡能拖回来）——
   拖到池子上时给一圈蓝框，看得见「松手就回池」。 */
.dp2-pool.over {
  background: #f3f7ff;
  box-shadow: inset 0 0 0 2px var(--pri);
  border-radius: 7px;
  transition: background-color .12s ease, box-shadow .12s ease;
}
.dp2-holdt { font-size: 11px; color: var(--tx-3); padding: 0 2px 3px; flex-shrink: 0; }
.dp2-holdt i { font-style: normal; color: var(--pri); font-weight: 600; }
/* 一格一条卡，纵向排；6 张以上自己滚 */
.dp2-holdslot {
  flex: 1; min-height: 0;
  display: flex; flex-direction: column; gap: 4px;
  overflow-y: auto; align-content: flex-start;
}
.dp2-holdslot .oc { flex: 0 0 auto; width: 100%; max-width: 100%; }
.dp2-holdslot:empty::after {
  content: '拖到这里';
  display: block; text-align: center; color: #b6bfcc; font-size: 11.5px; padding: 10px 0;
}

/* ---- 派单池卡片：第一行开头的单据类型缩写（PS 配送 / HS 回收 / CL 测量 / SG 施工） ----
   老板 2026-10-10 定：小字号 + 细边框，订单号不再显示 */
.oc-h b.oc-ty {
  flex: 0 0 auto;
  font-size: 10px; font-weight: 600; line-height: 1.5; letter-spacing: .4px;
  padding: 0 4px; border-radius: 3px;
  border: 1px solid #ccd5e2; background: #f4f7fb; color: #5b6a80;
}
.oc-h b.oc-ty[title="配送单"] { border-color: #b7d8e8; background: #eef7fc; color: #1d6b8f; }
.oc-h b.oc-ty[title="回收单"] { border-color: #c8ddc4; background: #f0f8ee; color: #3f7a35; }
.oc-h b.oc-ty[title="测量单"] { border-color: #d3c6e8; background: #f4f0fb; color: #6b4fa3; }
.oc-h b.oc-ty[title="施工单"] { border-color: #f0d3b6; background: #fdf4ea; color: #a5661f; }
.oc.done .oc-h b.oc-ty { opacity: .75; }

/* ---- 派单池卡片：已接单 / 被拒单标记（2026-10-10 需求 G） ---- */
.oc-h .m.tk {
  font-size: 10px; padding: 0 4px; border-radius: 3px; margin-left: 3px;
  border: 1px solid #b7e0c4; background: #eefaf1; color: #2f7a44;
}
.oc-h .m.rj {
  font-size: 10px; padding: 0 4px; border-radius: 3px; margin-left: 3px;
  border: 1px solid #f0bcbc; background: #fdeeee; color: #b02a2a;
}

/* ---- 可拖动的活动边界（2026-10-10 老板要求：三块区域大小随手调） ---- */
.dp2-vsplit, .dp2-hsplit {
  flex: 0 0 7px;
  background: #dfe4ec;
  position: relative;
  z-index: 2;
  transition: background-color .16s ease;
}
.dp2-vsplit { cursor: col-resize; }        /* 左右拖：排班表 ↔ 订单池 */
.dp2-hsplit { cursor: row-resize; }        /* 上下拖：订单池 ↔ 待排活动池 */
.dp2-vsplit:hover, .dp2-vsplit.on,
.dp2-hsplit:hover, .dp2-hsplit.on { background: var(--pri); }
/* 抓手：中间三个白点，提示这里能拖 */
.dp2-vsplit::after {
  content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 3px; height: 3px; border-radius: 50%; background: #fff;
  box-shadow: 0 -7px 0 #fff, 0 7px 0 #fff;
}
.dp2-hsplit::after {
  content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 3px; height: 3px; border-radius: 50%; background: #fff;
  box-shadow: -7px 0 0 #fff, 7px 0 0 #fff;
}
/* 拖动过程中：全文禁选 + 光标锁定，避免拖到一半选中文字 */
body.dp2-resizing { user-select: none; -webkit-user-select: none; }
body.dp2-resizing-v, body.dp2-resizing-v * { cursor: col-resize !important; }
body.dp2-resizing-h, body.dp2-resizing-h * { cursor: row-resize !important; }

/* 卡片第一行的「有梯 / 无梯」确认小按钮（未确认电梯时直接内联） */
.oc-h .mini {
  padding: 1px 6px; font-size: 10.5px; border-radius: 4px; cursor: pointer;
  border: 1px solid var(--g-line); background: var(--g-bg); color: var(--g-ink);
  line-height: 1.4; margin-left: auto;
}
.oc-h .mini.lb { border-color: var(--b-line); background: var(--b-bg); color: var(--b-ink); margin-left: 0; }

/* ---- 派单台 · 多选 + 另外指派卸货员（2026-10-10 老板口径） ----
   排班表上方一条工具条：多选 → 勾选订单 → 选爬楼工人（他卸），驾驶员只送货不卸货 */
.dp2-mbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 6px 12px; border-bottom: 1px solid #eaeef4;
  background: #f7f9fc; font-size: 12px; flex-shrink: 0;
}
.dp2-mbar .hint { font-size: 11.5px; color: #97a1b0; }
.dp2-mbar .mb-n { font-size: 12px; color: var(--tx-2); }
.dp2-mbar .mb-n b { color: var(--pri); font-size: 13.5px; }
.dp2-mbar .sel { padding: 4px 8px; font-size: 12px; }
.btn-sm.on { border-color: var(--pri); background: #eaf1ff; color: var(--pri); font-weight: 600; }

/* 卡片上的勾选框（只在多选态出现） */
.oc-h .ck {
  flex: 0 0 auto; position: relative;
  width: 12px; height: 12px; border-radius: 3px; margin-right: 1px;
  border: 1px solid #c2cbd8; background: #fff;
}
.sc .ck {                                   /* 格位小卡：绝对定位，别把小卡撑高 */
  position: absolute; bottom: -5px; left: -5px; z-index: 2;
  width: 12px; height: 12px; border-radius: 3px;
  border: 1px solid #c2cbd8; background: #fff;
}
.oc-h .ck.on, .sc .ck.on { background: var(--pri); border-color: var(--pri); }
.oc-h .ck.on::after, .sc .ck.on::after {
  content: ''; position: absolute; left: 3px; top: 0;
  width: 4px; height: 7px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.oc.picked, .sc.picked { border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29,78,216,.14); }

/* 已另派卸货员的单：卡片 / 格位小卡上打「卸」标 */
.oc-h .m.ul {
  font-size: 10px; padding: 0 4px; border-radius: 3px; margin-left: 3px;
  border: 1px solid #f0c674; background: #fdf6e6; color: #96690f;
}
.sc .ul {                                   /* 同样绝对定位，避免多撑一行 */
  position: absolute; bottom: -5px; right: -5px; z-index: 2;
  font-size: 9.5px; line-height: 12px; text-decoration: none;
  min-width: 12px; height: 12px; border-radius: 3px; padding: 0 2px;
  border: 1px solid #f0c674; background: #fdf6e6; color: #96690f;
}

/* ==================================================================
 *  视觉统一层（2026-10-10 美化）
 *  只做「和谐度」调整：圆角 / 阴影 / 间距 / 过渡 / 滚动条 / 悬停反馈，
 *  不改任何结构尺寸（派单池仍是 6 列，活动池仍是 3 格占半屏高）。
 * ================================================================== */
:root {
  --radius: 10px;
  --sd-1: 0 1px 2px rgba(16, 24, 40, .05);
  --sd-2: 0 4px 14px rgba(16, 24, 40, .10);
  --sd-pri: 0 6px 18px rgba(29, 78, 216, .28);
}

/* 细滚动条：大屏上不再出现又粗又灰的滚动条，视觉更轻 */
* { scrollbar-width: thin; scrollbar-color: #c6cfdb transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #c6cfdb; border-radius: 8px;
  border: 2px solid transparent; background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: #a9b4c4; background-clip: content-box; }

/* 键盘焦点：统一蓝色光圈，别再出现浏览器默认黑框 */
button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, a:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid rgba(29, 78, 216, .5); outline-offset: 1px;
}

/* ---- 侧边栏 ---- */
.sidebar { background: linear-gradient(180deg, #1b2432, #1c2635 55%, #212c3d); }
.nav-i { transition: background-color .16s ease, color .16s ease; border-radius: 7px; }
.nav-i.on {
  background: linear-gradient(90deg, #1d4ed8, #2563eb);
  box-shadow: 0 2px 10px rgba(29, 78, 216, .35);
}
.brand { background: linear-gradient(180deg, rgba(255, 255, 255, .04), transparent); }
.brand-logo { box-shadow: 0 3px 10px rgba(245, 158, 11, .35); }
.side-ft { background: rgba(255, 255, 255, .02); }

/* ---- 通用面板 / 统计卡 ---- */
.panel { box-shadow: var(--sd-1); border-color: #e6eaf1; }
.panel-hd { background: linear-gradient(180deg, #fbfcfe, #f6f8fc); letter-spacing: .2px; }
.stat-card { box-shadow: var(--sd-1); transition: transform .16s ease, box-shadow .16s ease; }
.stat-card:hover { transform: translateY(-2px); box-shadow: var(--sd-2); }
.stat-v { font-variant-numeric: tabular-nums; letter-spacing: -.4px; }

/* ---- 表格：表头一层渐变，隔行极浅斑马，悬停淡蓝 ---- */
.tbl th { background: linear-gradient(180deg, #f9fbfd, #f3f6fa); }
.tbl td { transition: background-color .12s ease; }
.tbl tbody tr:nth-child(even) { background: #fcfdfe; }
.tbl tbody tr:hover, .tbl tbody tr:nth-child(even):hover { background: #f2f7ff; }

/* ---- 按钮：统一过渡 + 轻微按压 ---- */
.btn {
  border-radius: 7px;
  transition: background-color .16s ease, border-color .16s ease,
              box-shadow .16s ease, transform .1s ease, color .16s ease;
}
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn-primary { box-shadow: 0 2px 8px rgba(29, 78, 216, .28); }
.btn-primary:hover:not(:disabled) { box-shadow: var(--sd-pri); }
.btn-ghost:hover { background: #f4f7fb; border-color: #ccd5e2; }

/* ---- 派单台：顶栏 ---- */
.dp2-nav {
  background: linear-gradient(180deg, #1e2937, #1a2331);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 2px 12px rgba(0, 0, 0, .22);
}
.dp2-logo {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  box-shadow: 0 3px 10px rgba(29, 78, 216, .45);
  letter-spacing: 1px;
}
.dp2-modes button { border-radius: 7px; transition: background-color .16s ease, color .16s ease, box-shadow .18s ease; }
.dp2-modes button.on { background: linear-gradient(180deg, #2563eb, #1d4ed8); box-shadow: 0 3px 10px rgba(29, 78, 216, .45); }
.dp2-stat {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 8px;
  transition: background-color .16s ease, border-color .16s ease;
}
.dp2-stat:hover { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .16); }
.dp2-stat b { font-variant-numeric: tabular-nums; }
.dp2-acts .btn { transition: background-color .16s ease, box-shadow .16s ease, transform .1s ease; }
.dp2-acts .btn:not(:disabled):hover { transform: translateY(-1px); }
.dp2-acts .btn-primary { box-shadow: 0 3px 12px rgba(29, 78, 216, .45); }

/* ---- 派单台：左右两个面板头（标题前一道竖条做视觉锚点） ---- */
.dp2-phead { background: linear-gradient(180deg, #ffffff, #fbfcfe); }
.dp2-phead h2 { position: relative; padding-left: 11px; letter-spacing: .3px; }
.dp2-phead h2::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 3px; height: 13px; border-radius: 2px;
  background: linear-gradient(180deg, var(--pri), #60a5fa);
}
.dp2-phead .tag { background: #eef2f9; border: 1px solid #e2e8f2; }
.dp2-panel { box-shadow: inset 0 0 0 1px rgba(16, 24, 40, .02); }

/* ---- 排班表 ---- */
.dp2-grid thead th { background: linear-gradient(180deg, #f9fbfd, #eef2f7); }
.dp2-grid tbody tr { transition: background-color .12s ease; }
.sc { transition: transform .12s ease, box-shadow .16s ease; }
.sc:hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(16, 24, 40, .12); z-index: 2; }
.sc .x { box-shadow: 0 1px 4px rgba(185, 28, 28, .4); }

/* ---- 订单池：工具条 / 卡片 ---- */
.dp2-tools { background: #fbfcfe; }
.dp2-mbar { background: linear-gradient(180deg, #fbfcfe, #f7f9fc); }
.dp2-mbar .btn-sm { border-radius: 7px; }
/* 提示文字吃掉剩余宽度，绝不换行 —— 工具条保持一行高 */
.dp2-mbar .hint {
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  cursor: help;
}
.dp2-tools .seg { border-radius: 8px; box-shadow: var(--sd-1); border-color: #e2e8f2; }
.dp2-tools .seg button { font-size: 12.5px; padding: 5px 12px; }
.dp2-tools .seg button:hover:not(.on) { background: #f1f6fd; color: var(--pri); }
.dp2-tools .seg button.on {
  background: linear-gradient(180deg, #2563eb, #1d4ed8);
  box-shadow: 0 1px 4px rgba(29, 78, 216, .35);
}
.dp2-tools .search, .dp2-tools .sel, .dp2-mbar .sel {
  border-radius: 7px; height: 30px;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.dp2-tools .search:focus, .dp2-tools .sel:focus, .dp2-mbar .sel:focus {
  border-color: var(--pri); box-shadow: 0 0 0 3px rgba(29, 78, 216, .12);
}
.oc {
  border-radius: 8px;
  box-shadow: 0 1px 1px rgba(16, 24, 40, .03);
  transition: transform .12s ease, box-shadow .16s ease, border-color .16s ease;
  /* 原来 46px：窄屏 / 多选态（多一个勾选框）时第一行会折行，第二行被切掉。
     放宽到 66px 只是「允许更高」，放得下的卡还是原来的高度（不会撑高整行）。 */
  max-height: 66px;
}
/* 卡片第一行挤一挤：间隙 4→3，内边距略收，124px 左右的窄卡也能一行放下 */
.oc-h { gap: 3px; }
.oc { padding: 4px 6px; }
.oc-h .m.w, .oc-h .m.l { padding: 0 5px; }
.oc-h .m.tk, .oc-h .m.rj, .oc-h .m.ul { margin-left: 2px; }
.oc:hover {
  transform: translateY(-1px);
  border-color: #c7d2e2;
  box-shadow: 0 6px 14px rgba(16, 24, 40, .12);
}
/* 2026-10-20：订单池是多列网格，卡片上浮 + 大阴影会压住上下相邻的卡 —— 池里只换边框 */
.dp2-pool .oc:hover {
  transform: none;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .10);
}
.oc.sel {
  border-color: var(--pri);
  box-shadow: 0 0 0 2px rgba(29, 78, 216, .3), 0 6px 14px rgba(29, 78, 216, .16);
}
.oc.done { background: linear-gradient(180deg, #f8fbf7, #f2f8f0); border-left-color: #a8d4a2; }
.oc.mk { cursor: pointer; }
.oc.mk:hover { border-color: #a9bde6; }

/* ---- 待排活动池 ---- */
.dp2-hold { background: linear-gradient(180deg, #f8fafc, #f3f6fa); }
.dp2-holdbox {
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, #fcfdfe);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.dp2-holdbox:hover { border-color: #b9c6da; }
.dp2-holdt { display: flex; align-items: center; gap: 4px; letter-spacing: .3px; }
.dp2-holdt i {
  background: #eaf1ff; color: var(--pri);
  border-radius: 999px; padding: 0 6px; font-size: 10.5px;
}
.dp2-holdslot:empty::after { color: #aab4c4; letter-spacing: 1px; }
/* 矮屏（笔记本 768）：活动池别死守 400px，否则它吃掉整个右栏；够放 4~5 张，多了自己滚 */
@media (max-height: 840px) {
  .dp2-hold { min-height: 300px; }
}

/* ---- 提示条 / 空态 / 弹窗 ---- */
.dp2-tipbar { background: linear-gradient(180deg, #eef3ff, #e7eeff); }
.dp2-matbar { border-radius: 8px; box-shadow: 0 1px 2px rgba(217, 119, 6, .12); }
.dp2-empty { color: #9aa5b4; padding: 48px 0; letter-spacing: .3px; }
.dp2-mask { backdrop-filter: blur(2px); background: rgba(15, 23, 42, .5); }
.dp2-modal { border-radius: 14px; box-shadow: 0 30px 70px rgba(0, 0, 0, .32); }
.dp2-mrow { border-color: #e6eaf1; }
.dp2-mrow > header { background: linear-gradient(180deg, #f9fbfd, #f5f8fc); }
.dp2-msum div { border-color: #e6eaf1; border-radius: 10px; box-shadow: var(--sd-1); }

/* ==================================================================
 * 小程序实时演示（sim）· v20261010v 重做
 *   三栏：左=选人 / 中=手机外壳（1:1 复刻小程序）/ 右=当前身份
 *   与真机共用 admin/js/mpre-shared.js 的业务逻辑，只做视觉还原。
 * ================================================================== */
.mp-page.sim { max-width: 1740px; }
.mp-page.sim .page-act { gap: 10px; flex-wrap: wrap; }

/* ---- 页头：模式 / 同步状态 / 开关 ---- */
.sim-live {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; color: var(--ok);
  background: #e8f6ed; border: 1px solid #bfe3cc; border-radius: 20px; padding: 3px 11px;
}
.sim-live i { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); flex: none; }
.sim-live.on { color: var(--bad); background: #fdeceb; border-color: #f5c6c3; }
.sim-live.on i { background: var(--bad); animation: simBlink 1.4s ease-in-out infinite; }
@keyframes simBlink { 0%, 100% { opacity: 1 } 50% { opacity: .22 } }

.sim-sync {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; color: var(--tx-3); white-space: nowrap;
}
.sim-sync .dot {
  width: 7px; height: 7px; border-radius: 50%; background: #c3cbd8; flex: none;
  transition: background .2s, box-shadow .2s;
}
.sim-sync .dot.on { background: var(--ok); box-shadow: 0 0 0 3px rgba(21, 128, 61, .14); }
.sim-sync b { color: var(--tx-2); font-weight: 500; }

.sim-sw {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12.5px; color: var(--tx-2); cursor: pointer; user-select: none; white-space: nowrap;
}
.sim-sw input { width: 15px; height: 15px; margin: 0; accent-color: var(--pri); cursor: pointer; }

/* ---- 三栏 ---- */
.sim-stage { display: flex; gap: 16px; align-items: flex-start; }
.sim-left, .sim-right {
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 14px; box-shadow: var(--sd-1);
}
.sim-left { width: 246px; flex: 0 0 246px; }
.sim-right { width: 284px; flex: 0 0 284px; }
.sim-mid { flex: 1 1 0; min-width: 0; min-height: 0; display: flex; flex-direction: column; align-items: center; }

.sim-lhd {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  font-size: 13.5px; font-weight: 600; color: var(--tx); margin-bottom: 10px;
}
.sim-lhd small { font-size: 11.5px; font-weight: 400; color: var(--tx-3); }
.sim-left .search { width: 100%; margin-bottom: 10px; }
.sim-left .chips-inline { display: flex; flex-wrap: wrap; margin: 0 0 10px; gap: 5px; }
.sim-left .who-pick { padding: 0; max-height: calc(100vh - 400px); min-height: 120px; overflow-y: auto; }
.sim-left .who-b { width: 100%; min-width: 0; }
.sim-note {
  margin-top: 11px; padding-top: 9px; border-top: 1px dashed var(--line);
  font-size: 11.5px; color: var(--tx-3); line-height: 1.7;
}
.sim-note b { color: var(--tx-2); font-weight: 500; }
.sim-right .mp-note { margin-top: 9px; padding: 9px 10px; font-size: 11.5px; line-height: 1.65; }
.sim-right .mp-note b { color: #6b4d0a; }

/* ---- 手机外壳 ---- */
/* ⚠️ .sim-mid 是 column 容器，这里 flex-basis 会作用在「高度」上，
   所以必须写 flex:none（让 basis=auto 走 height），只锁 width。 */
.sim-phone {
  flex: none;
  width: 392px;
  height: clamp(560px, calc(100vh - 168px), 836px);
  background: #0d1117; border-radius: 42px; padding: 11px;
  box-shadow: 0 22px 55px rgba(15, 23, 42, .26), 0 2px 6px rgba(15, 23, 42, .18);
  display: flex; flex-direction: column;
}
.sim-island {
  width: 108px; height: 25px; border-radius: 14px;
  background: #000; margin: 0 auto 1px; flex: none;
}
.sim-status {
  flex: none; height: 25px; padding: 0 17px;
  display: flex; align-items: center; gap: 6px;
  background: #fff; border-radius: 27px 27px 0 0;
  font-size: 11px; font-weight: 600; color: #111;
}
.sim-status .grow { flex: 1; }
.sim-clock { font-variant-numeric: tabular-nums; letter-spacing: .2px; }
.sim-bat {
  width: 23px; height: 11.5px; border: 1px solid rgba(17, 17, 17, .38);
  border-radius: 3.5px; padding: 1.5px; position: relative; flex: none;
}
.sim-bat::before {
  content: ''; display: block; width: 76%; height: 100%;
  background: #111; border-radius: 2px;
}
.sim-bat::after {
  content: ''; position: absolute; right: -3px; top: 3px;
  width: 2px; height: 5px; border-radius: 0 1px 1px 0; background: rgba(17, 17, 17, .38);
}
.sim-navbar {
  flex: none; height: 44px; padding: 0 12px;
  display: flex; align-items: center; background: #fff;
  border-bottom: 1px solid #eceef2; position: relative;
}
.sim-navbar b {
  flex: 1; text-align: center; font-size: 15.5px; font-weight: 500; color: var(--tx);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sim-nbx { flex: 0 0 74px; }
.sim-navbar .mp-back {
  flex: 0 0 74px; padding: 0; margin: 0; border: 0; background: none;
  font-size: 14px; color: var(--pri); cursor: pointer; text-align: left;
}
.sim-dots {
  flex: 0 0 74px; text-align: right; font-size: 15px; color: #111;
  letter-spacing: 1.5px; line-height: 1;
}
/* 2026-10-11：手机标题栏右侧常驻「退出」——任何一页都能退，不用先去「我的」 */
.sim-navbar .sim-exit {
  flex: 0 0 74px; text-align: right; font-size: 13px; color: var(--pri);
  cursor: pointer; user-select: none; line-height: 1;
}
.sim-navbar .sim-exit:hover { color: #dc2626; font-weight: 700; }

/* 「我的」页里的账号操作按钮 */
.mp-act { display: flex; gap: 8px; padding: 10px 2px 2px; }
.btn.dang {
  border-color: #f3b4b4; background: #fff5f5; color: #dc2626; font-weight: 600;
}
.btn.dang:hover { background: #fee2e2; border-color: #dc2626; }

/* 已退出登录：手机里的登录页 */
.sim-login { padding: 46px 18px; text-align: center; }
.sim-login .sl-lg {
  font-size: 21px; font-weight: 700; color: #12294a; letter-spacing: .5px;
}
.sim-login .sl-t { margin-top: 6px; font-size: 13px; color: var(--mut, #7b8794); }
.sim-login .sl-s {
  margin-top: 26px; font-size: 15px; font-weight: 700; color: #dc2626;
}
.sim-login .sl-h {
  margin-top: 8px; font-size: 13px; color: var(--tx);
}
.sim-login .sl-tip {
  margin-top: 26px; padding: 10px 12px; border-radius: 8px;
  background: #fff8e6; color: #8a5a00; font-size: 12px; line-height: 1.7; text-align: left;
}

/* 屏幕：覆盖旧的固定 700px，改为外壳内自适应滚动 */
.mp-page.sim .mp-screen {
  flex: 1; min-height: 0; height: auto; display: block;
  overflow-y: auto; overflow-x: hidden;
  padding: 12px; background: #f2f4f7; border-radius: 0;
}
.sim-tabbar {
  flex: none; height: 54px; display: flex;
  background: #fff; border-top: 1px solid #eceef2;
}
.sim-tabbar .mp-tab {
  display: flex; align-items: center; justify-content: center; gap: 3px;
  padding: 0 2px; font-size: 12.5px;
}
.sim-tabbar .mp-tab i { font-size: 10px; padding: 0 4px; }
.sim-home {
  flex: none; height: 19px; background: #fff; border-radius: 0 0 27px 27px;
  display: flex; align-items: center; justify-content: center;
}
.sim-home::after {
  content: ''; width: 116px; height: 4px; border-radius: 3px;
  background: #111; opacity: .85;
}
.sim-cap { margin-top: 11px; font-size: 11.5px; color: var(--tx-3); text-align: center; }

/* ---- 屏幕内容：顶部人物卡 ---- */
.sim-hero {
  background: linear-gradient(135deg, #1d4ed8, #3b82f6);
  color: #fff; border-radius: 14px; padding: 15px 15px 14px; margin-bottom: 11px;
  box-shadow: 0 6px 16px rgba(29, 78, 216, .18);
}
.sim-hero.im { background: linear-gradient(135deg, #0f766e, #14b8a6); box-shadow: 0 6px 16px rgba(15, 118, 110, .18); }
.sim-hero.rc { background: linear-gradient(135deg, #b45309, #f59e0b); box-shadow: 0 6px 16px rgba(180, 83, 9, .18); }
.sim-hi {
  font-size: 18px; font-weight: 600; letter-spacing: .3px;
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
}
.sim-hi em {
  font-style: normal; font-weight: 400; font-size: 11px;
  background: rgba(255, 255, 255, .22); border-radius: 999px; padding: 1px 8px;
}
.sim-hs { font-size: 12px; opacity: .9; margin-top: 4px; }
.sim-big { font-size: 30px; font-weight: 700; margin-top: 7px; letter-spacing: .5px; }
.sim-nums {
  display: flex; margin-top: 12px; padding: 9px 0;
  background: rgba(255, 255, 255, .14); border-radius: 10px;
}
.sim-nums div {
  flex: 1; text-align: center;
  border-right: 1px solid rgba(255, 255, 255, .18);
}
.sim-nums div:last-child { border-right: 0; }
.sim-nums b { display: block; font-size: 17px; font-weight: 600; }
.sim-nums span { font-size: 11px; opacity: .85; }

/* ---- 屏幕内容：卡片 ---- */
.sim-card {
  background: #fff; border: 1px solid #eef1f6; border-radius: 12px;
  padding: 12px 13px; margin-bottom: 11px; box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.sim-card.warn { background: #fffbeb; border-color: #fde68a; }
.sim-ct {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; color: var(--tx); margin-bottom: 8px;
}
.sim-in { padding: 8px 0; border-bottom: 1px dashed #eef1f6; }
.sim-in:last-child { border-bottom: 0; padding-bottom: 0; }
.sim-in b {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 13.5px; font-weight: 500; color: var(--tx);
}
.sim-in.big b { font-size: 15px; }
.sim-in span { display: block; font-size: 12px; color: var(--tx-2); margin-top: 2px; }
.sim-in em { display: block; font-style: normal; font-size: 11.5px; color: var(--tx-3); margin-top: 2px; }

/* ---- 屏幕内容：任务卡 ---- */
.sim-task {
  background: #fff; border: 1px solid #eef1f6; border-radius: 12px;
  padding: 10px 12px; margin-bottom: 9px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  transition: box-shadow .16s, border-color .16s, transform .16s;
}
.sim-task:hover {
  border-color: #b9c9e6; box-shadow: 0 4px 12px rgba(16, 24, 40, .09);
  transform: translateY(-1px);
}
.st-h {
  display: flex; align-items: center; gap: 5px;
  font-size: 11.5px; white-space: nowrap;
}
.st-ty {
  font-style: normal; font-weight: 600; font-size: 11px;
  background: #eef2ff; color: #3730a3; border-radius: 4px; padding: 0 5px; flex: none;
}
.st-no {
  text-decoration: none; font-size: 10.5px; color: var(--tx-3);
  font-family: ui-monospace, "SFMono-Regular", Consolas, Menlo, monospace;
  flex: none; overflow: hidden; text-overflow: ellipsis; max-width: 92px;
}
.st-w { color: var(--tx-2); flex: none; }
.st-l {
  margin-left: auto; flex: none; font-size: 10.5px;
  border-radius: 999px; padding: 0 6px;
}
.st-l.g { background: #e8f6ed; color: var(--ok); }
.st-l.b { background: #fff1f2; color: var(--bad); }
.st-l.none { background: #fff7ed; color: var(--warn); }
.st-st {
  flex: none; font-size: 10.5px; background: #eef2f7;
  color: var(--tx-2); border-radius: 4px; padding: 0 5px;
}
.st-a {
  font-size: 13px; font-weight: 500; color: var(--tx); margin-top: 6px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.st-g {
  font-size: 11.5px; color: var(--tx-3); margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.st-f {
  display: flex; align-items: center; gap: 6px; margin-top: 9px;
  padding-top: 8px; border-top: 1px dashed #eef1f6;
}
.st-mine {
  font-size: 11px; color: var(--info); background: #eff6ff;
  border-radius: 4px; padding: 1px 6px; flex: none;
}
.st-tip { font-size: 11px; color: var(--tx-3); flex: none; }
.sim-mini {
  margin-left: auto; flex: none; cursor: pointer;
  font-size: 11.5px; color: var(--pri);
  border: 1px solid var(--pri); border-radius: 999px; padding: 1px 9px;
}
.sim-mini:hover { background: #eef3ff; }
.st-f .mp-btn {
  margin: 0; padding: 4px 12px; font-size: 12px; border-radius: 999px; flex: none;
}
.st-wait {
  flex: none; font-size: 11.5px; color: var(--tx-2);
  background: #eef2f7; border-radius: 999px; padding: 3px 10px;
}
.st-mine.ul { background: #fff7ed; color: var(--warn); }

/* ---- 窄屏：右栏换行（三栏合计 954px，到 1120 才真的放不下） ---- */
@media (max-width: 1120px) {
  .sim-stage { flex-wrap: wrap; }
  .sim-right { flex: 1 1 100%; width: auto; }
  .sim-right .mp-note { margin-top: 7px; }
}
@media (max-width: 980px) {
  .sim-left { flex: 1 1 100%; width: auto; }
  .sim-left .who-pick { max-height: 240px; }
}

/* ============================================================
   小程序模拟器（2026-10-11）
   后台内置渲染，不依赖 iframe / 外部预览容器 / 写入权限
   手机按常见机型 375 × 812 居中呈现
   ============================================================ */

/* ---- 手机外壳 ---- */

/* ---- 顶部状态栏 ---- */

/* ---- 导航栏 ---- */

/* ---- 底部 tabBar ---- */

/* 小程序模拟器：任务卡货品行（一线卡片六要素之一，最多 4 项） */
.mpw-bar-l b { font-size: 15px; color: #12294a; }
.mpw-tag {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px;
  background: #e8f6ed; color: #16a34a; font-size: 11px; font-weight: 600;
}
.mpw-hint { margin-left: 10px; font-size: 12px; color: #7b8698; }
.mpw-bar-r { display: flex; align-items: center; gap: 8px; }
.mpw-sel {
  height: 30px; border: 1px solid #e2e6ec; border-radius: 6px; padding: 0 8px;
  font-size: 12px; color: #3d4657; background: #fff; min-width: 190px;
}
.mpw-bt {
  height: 30px; padding: 0 12px; border-radius: 6px; border: 1px solid #d8dee8;
  background: #fff; color: #3d4657; font-size: 12px; cursor: pointer;
}
.mpw-bt:hover { border-color: #2563eb; color: #2563eb; }
.mpw-bt.dang:hover { border-color: #dc2626; color: #dc2626; }

.mpw-stage { display: flex; justify-content: center; }
.mpw-err {
  padding: 40px; color: #dc2626; font-size: 13px; text-align: center;
}

/* 手机壳：严格 375 × 812，页面内容自己滚 */
.jcw-phone {
  width: 375px; height: 812px; flex: none;
  border: 10px solid #1b1f27; border-radius: 38px;
  background: #f5f7fa; overflow: hidden;
  box-shadow: 0 18px 50px rgba(18, 41, 74, .22);
  display: flex; flex-direction: column;
  position: relative;
  /* 2026-10-14：让手机壳成为内部 position:fixed 的「包含块」。
     小程序里底栏的 fixed 是相对屏幕的；不加这一行，浏览器会按视口算，
     底部导航栏（.nav）、合并配货底栏（.pickbar）就会飞到整个网页最下面。
     加了 transform 之后，fixed 相对手机壳定位，滚动时也稳稳贴住手机底边 ——
     跟真机一致，页面源码一个字都不用改。 */
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}
.jcw-statusbar {
  flex: none; height: 20px; padding: 0 16px;
  display: flex; align-items: center; justify-content: space-between;
  background: #12294a; color: #fff; font-size: 10px;
}
.jcw-sb-ic { letter-spacing: 1px; opacity: .9; }
.jcw-navbar {
  flex: none; height: 40px; display: flex; align-items: center; justify-content: center;
  background: #12294a; color: #fff; font-size: 15px; font-weight: 600;
}
.jcw-screen { flex: 1; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
.jcw-page { min-height: 100%; }

/* 自绘 toast（wx.showToast / wx.showLoading 的替代） */
.jcw-toast {
  position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(.94);
  background: rgba(20, 24, 32, .86); color: #fff; padding: 12px 18px;
  border-radius: 10px; font-size: 13px; z-index: 99999;
  opacity: 0; pointer-events: none; transition: opacity .16s ease, transform .16s ease;
  max-width: 70vw; text-align: center; line-height: 1.5;
}
.jcw-toast.on { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.jcw-loading::after { content: '…'; }

/* 自绘弹窗（wx.showModal 的替代，含 editable 输入框） */
.jcw-mask {
  position: fixed; inset: 0; background: rgba(15, 20, 30, .45);
  display: flex; align-items: center; justify-content: center; z-index: 99998;
}
.jcw-modal {
  width: 300px; background: #fff; border-radius: 12px; padding: 20px 18px 14px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
}
.jcw-mtitle { font-size: 15px; font-weight: 600; color: #252d3a; text-align: center; }
.jcw-mbody { margin-top: 10px; font-size: 13px; color: #5b6577; line-height: 1.6; }
.jcw-minput {
  width: 100%; margin-top: 14px; height: 36px; padding: 0 10px;
  border: 1px solid #dfe4ec; border-radius: 8px; font-size: 13px; color: #252d3a;
  outline: none; background: #fff;
}
.jcw-minput:focus { border-color: #2563eb; }
.jcw-mbtns { display: flex; gap: 10px; margin-top: 18px; }
.jcw-mbtn {
  flex: 1; height: 36px; border-radius: 8px; border: 1px solid #2563eb;
  background: #2563eb; color: #fff; font-size: 14px; cursor: pointer;
}
.jcw-mbtn.ghost { background: #fff; color: #5b6577; border-color: #dfe4ec; }

/* ---- 一线人员登录窗口（免验证码）2026-10-13 ---- */
.mpw-cur {
  font-size: 12px; color: #7b8698; padding: 0 4px;
}
.mpw-cur.on { color: #16a34a; font-weight: 600; }

.mpw-pick {
  background: #ffffff;
  border: 2rpx solid rgba(18, 41, 74, .03);
  border: 1px solid #e8ecf2;
  border-radius: 10px;
  padding: 12px 14px 14px;
  margin-bottom: 18px;
  box-shadow: 0 2rpx 6rpx rgba(18, 41, 74, .04);
}
.mpw-pick-hd {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  font-size: 14px; font-weight: 600; color: #12294a; margin-bottom: 10px;
}
.mpw-pick-hd span:first-child { letter-spacing: .3px; }
.mpw-pick-tip { font-size: 12px; font-weight: 400; color: #7b8698; }
.mpw-pick-tip b { color: #2563eb; font-weight: 600; }
.mpw-pick-bd { display: flex; flex-wrap: wrap; gap: 16px 22px; }
.mpw-loading { font-size: 12px; color: #a3adbd; }

.mpw-grp-t {
  font-size: 12px; color: #5b6577; margin-bottom: 7px;
  display: flex; align-items: center; gap: 6px;
}
.mpw-grp-t em {
  font-style: normal; font-size: 11px; color: #2563eb;
  background: #eff5ff; border-radius: 999px; padding: 1px 7px;
}
.mpw-grp-b { display: flex; flex-wrap: wrap; gap: 6px; }
.mpw-person {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 6px 11px; border-radius: 8px; cursor: pointer;
  border: 1px solid #dfe4ec; background: #fff;
  font-family: inherit; line-height: 1.35; transition: all .12s ease;
}
.mpw-person b { font-size: 13px; color: #252d3a; font-weight: 600; }
.mpw-person span { font-size: 11px; color: #a3adbd; font-variant-numeric: tabular-nums; }
.mpw-person:hover { border-color: #2563eb; background: #f7faff; }
.mpw-person:hover b { color: #2563eb; }
.mpw-person[disabled] { opacity: .45; cursor: not-allowed; }

/* 2026-10-13：派单台「N 条尚未写入云库」提示按钮 —— 未落库时最扎眼的一下 */
.btn-warn {
  background: #d97706;
  color: #ffffff;
  border: none;
}
.btn-warn:hover { background: #b45309; }

/* ==================================================================
 *  对客结算（客户管理 → 对客结算，2026-10-14）
 * ================================================================== */
.cs-setup { border: 1px solid #f3d9a8; background: #fffdf7; margin-bottom: 14px; }
.cs-setup .panel-hd { color: #b45309; background: #fff8ea; }
/* 2026-10-21 老板口径：这条建价入口**常驻**。已经有价目时不再报警，
   换成浅蓝的信息条，批量录入按钮一直留着。 */
.cs-setup.ok { border-color: #cfe0f5; background: #f7fafd; }
.cs-setup.ok .panel-hd { color: #1d4ed8; background: #eef4fd; }
/* 批量录入弹窗里「已经建过价」的行：压暗 + 输入禁用，避免重复建价 */
.cs-bt-done td { opacity: .5; }
.cs-bt-done input, .cs-bt-done select { background: #f3f5f8; }
.cs-blocked { border: 1px solid #fecaca; margin-bottom: 12px; }
.cs-blocked .panel-hd { color: var(--bad); background: #fff5f5; }
.cs-ord { border: 1px solid var(--line); border-radius: 8px; margin-top: 12px; overflow: hidden; }
.cs-ord-hd {
  display: flex; align-items: baseline; gap: 10px;
  padding: 9px 12px; background: #fafbfd; border-bottom: 1px solid var(--line-2);
}
.cs-ord-hd .hint { font-weight: 400; }
.cs-ord-sum { margin-left: auto; font-weight: 700; color: var(--pri); }

/* ==================================================================
 *  对客结算 2026-10-22 老板口径（附截图）
 *   · 订单卡片 → Excel 样式一张表
 *   · 结算状态 → 三个筛选框（是否对账 / 开票 / 回款）
 *   · 每单三个勾 + 财务备注输入框
 *   · 项目经理（现场收货人）汇总
 * ================================================================== */
/* 筛选条：紧贴结果表上方，一行放得下 */
.cs-filter {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 12px 0 8px; padding: 8px 12px;
  border: 1px solid var(--line); border-radius: 8px; background: #fafbfd;
}
.cs-filter .hint { white-space: nowrap; }
.cs-filter select.ipt { height: 28px; padding: 0 4px; }

/* 订单表：Excel 观感 —— 紧凑行高、表头吸顶、数字右对齐 */
.cs-tbl { font-size: 12.5px; }
.cs-tbl thead th {
  position: sticky; top: 0; z-index: 2;
  background: #f3f6fa; font-weight: 600; white-space: nowrap;
}
.cs-tbl tbody tr.cs-row:hover { background: #f7fbff; }
.cs-tbl td { padding: 6px 8px; vertical-align: middle; }
.cs-tbl .ctr { text-align: center; }
.cs-tbl .cs-note { width: 100%; height: 26px; font-size: 12px; padding: 0 8px; }

/* 三个勾：只要框，不要文字，避免一行挤爆 */
.csck { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.csck input[type="checkbox"] {
  width: 16px; height: 16px; margin: 0; cursor: pointer; accent-color: #16a34a;
}

/* 明细展开行：贴在订单行下面，浅色底，不抢视觉 */
.cs-tbl tr.cs-lines > td { background: #fbfcfe; padding: 0 0 8px 0; border-top: none; }
.cs-tbl tr.cs-lines .tbl { margin: 0; background: #fff; }
.cs-tbl tr.cs-lines .tbl th { background: #f7f9fc; position: static; }

/* 项目经理汇总 */
.cs-proj { margin: 12px 0 0; }
.cs-proj .panel-hd { background: #f6f9ff; color: #1d4ed8; }

/* ==================================================================
 *  派单台 2026-10-14 老板口径
 * ================================================================== */
/* 一、待派订单卡片：地址字号略大、撑满卡片可用空间；完整内容强制单行，超出截断省略号 */
.oc { display: flex; flex-direction: column; }
.oc .oc-a, .oc-a.one {
  flex: 1 1 auto;
  display: block;
  font-size: 12.5px;
  color: var(--tx);
  font-weight: 500;
  line-height: 1.7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.oc.done .oc-a { color: #8a94a4; }

/* 二、车辆池「合计吨位」单列（原装载率 + 已载/载重合并） */
.dp2-grid td.c-cap.over, .dp2-grid td.c-cap.over * { color: #dc2626; font-weight: 700; }

/* 五、三个日期 sheet 标签（第一/二/三日配送排班表） */
.dp2-daytabs { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.dp2-daytabs button {
  padding: 5px 14px;
  font-size: 13px; font-weight: 600;
  border: 1px solid #dfe4ec; border-radius: 6px;
  background: #f6f8fb; color: var(--tx-2);
  cursor: pointer; line-height: 1.4;
}
.dp2-daytabs button:hover { border-color: var(--pri); color: var(--pri); }
.dp2-daytabs button.on {
  background: var(--pri); border-color: var(--pri); color: #fff;
  box-shadow: 0 1px 4px rgba(29,78,216,.28);
}


/* ---------- 2026-10-16：自动完成输入框（可下拉可选 + 可手输） ---------- */
.sg-pop {
  position: absolute; z-index: 3000; background: #fff; border: 1px solid var(--line);
  border-radius: 8px; box-shadow: 0 6px 20px rgba(20, 30, 50, .14);
  overflow: hidden; padding: 3px; box-sizing: border-box;
}
.sg-it {
  padding: 7px 10px; font-size: 13px; line-height: 1.35; cursor: pointer; border-radius: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--tx);
}
.sg-it:hover, .sg-it.on { background: #eef4ff; }
.sg-it b { color: var(--pri); font-weight: 700; }

/* ==================================================================
   2026-10-17 老板口径：输入框最右边保留「向下三角」按钮，点它拉出完整下拉框
     · `input.sg-in` = 由 SUGGEST.attach 自动加在输入框上（选择器带 input 提高优先级，
       免得被各页面自己的 `background:` / `padding:` 简写覆盖）
     · ▼ 用 data-URI 背景画在右端，点右端 24px 区域 = 按了 ▼（见 suggest.js）
     · 打开的是完整列表 → 高度封顶 + 自己滚动（.sg-pop.all）
   ================================================================== */
input.sg-in {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0h10L5 6z' fill='%236b7684'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 7px center;
  padding-right: 24px;
  cursor: pointer;
}
input.sg-in:hover {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0h10L5 6z' fill='%231d4ed8'/%3E%3C/svg%3E");
}
.sg-pop.all {
  max-height: 320px; overflow-y: auto;      /* ▼ 拉出的完整下拉框：超出自己滚 */
}
.sg-pop.all .sg-it { cursor: pointer; }


/* ==================================================================
   2026-10-16 老板需求一：待派单池「合并派单」
     · 工具条上的 合并派单 / 确认合并 按钮
     · 勾选态卡片「悬浮」可勾（.mk + hover 上浮）
     · 成组的卡连在一起，带可点标识「合并N」
   ================================================================== */
/* 2026-10-26 老板需求：排班表标题行 / 活动池头部的「合并」按钮容器
   （三处都能合并 / 解除合并，不要求先把单拖回待派单池） */
.mg-zone { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.mg-zone:empty { display: none; }
.mg-zone .mb-n { font-size: 11.5px; color: var(--tx-2); white-space: nowrap; }
.mg-zone .mb-n b { color: var(--pri); }

.mg-btn {
  border: 1px solid #b9c6da; background: #fff; color: var(--tx);
  font-weight: 600; white-space: nowrap; position: relative;
}
.mg-btn:hover { border-color: var(--pri); color: var(--pri); }
.mg-btn.on { background: #eef4ff; border-color: var(--pri); color: var(--pri); }
.mg-btn.ready {
  background: var(--pri); border-color: var(--pri); color: #fff;
  box-shadow: 0 2px 8px rgba(29,78,216,.28);
}
.mg-btn.ready:hover { color: #fff; }
.mg-btn .mg-cnt {
  display: inline-block; margin-left: 5px; padding: 0 5px; border-radius: 8px;
  background: var(--pri); color: #fff; font-size: 10.5px; line-height: 15px;
}
.mg-btn.ready .mg-cnt { background: #fff; color: var(--pri); }

/* 勾选态：卡片像「浮起来」一样，明确提示可以点选 */
.oc.mk {
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.oc.mk:hover {
  border-color: var(--pri);
  box-shadow: 0 4px 12px rgba(29,78,216,.18);
  transform: translateY(-2px);
}
/* 2026-10-26：排班表格位小卡在合并勾选态下也要「看着能点」（原来没有任何提示） */
.sc.mk { cursor: pointer; }
.sc.mk:hover { border-color: var(--pri); box-shadow: 0 3px 10px rgba(29,78,216,.2); }

/* 已成组的卡：左侧加一条蓝色的组标记 + 轻微描边，一眼看出这几张是一组 */
.oc.mg { box-shadow: inset 4px 0 0 #6366f1; }
.oc.mg1 { box-shadow: inset 4px 0 0 #6366f1; }
.oc.mg2 { box-shadow: inset 4px 0 0 #0891b2; }
.oc.mg3 { box-shadow: inset 4px 0 0 #db2777; }
.oc.mg4 { box-shadow: inset 4px 0 0 #65a30d; }
.oc.mg5 { box-shadow: inset 4px 0 0 #ea580c; }
.oc.mg6 { box-shadow: inset 4px 0 0 #7c3aed; }
.oc.mg7 { box-shadow: inset 4px 0 0 #0d9488; }
.oc.mg8 { box-shadow: inset 4px 0 0 #a16207; }

/* 卡片上可点的「合并1 / 合并2」标识 */
.oc-h .mg-badge {
  margin-left: auto; flex: none; cursor: pointer;
  font-size: 10.5px; font-weight: 700; line-height: 16px;
  padding: 0 6px; border-radius: 8px;
  background: #6366f1; color: #fff; border: 1px solid #4f46e5;
}
.oc-h .mg-badge:hover { background: #4f46e5; }
.oc-h .mg-badge::after { content: ' ✕'; font-weight: 400; opacity: .85; }
.oc.mg2 .mg-badge { background: #0891b2; border-color: #0e7490; }
.oc.mg2 .mg-badge:hover { background: #0e7490; }
.oc.mg3 .mg-badge { background: #db2777; border-color: #be185d; }
.oc.mg3 .mg-badge:hover { background: #be185d; }
.oc.mg4 .mg-badge { background: #65a30d; border-color: #4d7c0f; }
.oc.mg5 .mg-badge { background: #ea580c; border-color: #c2410c; }
.oc.mg6 .mg-badge { background: #7c3aed; border-color: #6d28d9; }

/* ==================================================================
   2026-10-16 老板口径（第三轮）：合并组排进排班表后也要看得见
     · 格位小卡左上角挂「合N」标（可点 → 取消这一组）
     · 同组小卡用同一颜色的描边，一眼看出这几格是一组
   ================================================================== */
.sc .mgn {
  position: absolute; top: -6px; left: -6px; z-index: 3;
  font-size: 9.5px; line-height: 12px; text-decoration: none; font-weight: 700;
  min-width: 12px; height: 13px; border-radius: 3px; padding: 0 2px;
  border: 1px solid #4f46e5; background: #6366f1; color: #fff;
  cursor: pointer; white-space: nowrap;
}
.sc .mgn:hover { background: #4f46e5; }
.sc.mgm1 { box-shadow: inset 0 0 0 2px #6366f1; }
.sc.mgm2 { box-shadow: inset 0 0 0 2px #0891b2; }
.sc.mgm3 { box-shadow: inset 0 0 0 2px #db2777; }
.sc.mgm4 { box-shadow: inset 0 0 0 2px #65a30d; }
.sc.mgm5 { box-shadow: inset 0 0 0 2px #ea580c; }
.sc.mgm6 { box-shadow: inset 0 0 0 2px #7c3aed; }
.sc.mgm7 { box-shadow: inset 0 0 0 2px #0d9488; }
.sc.mgm8 { box-shadow: inset 0 0 0 2px #a16207; }
.sc.mgm2 .mgn { background: #0891b2; border-color: #0e7490; }
.sc.mgm3 .mgn { background: #db2777; border-color: #be185d; }
.sc.mgm4 .mgn { background: #65a30d; border-color: #4d7c0f; }
.sc.mgm5 .mgn { background: #ea580c; border-color: #c2410c; }
.sc.mgm6 .mgn { background: #7c3aed; border-color: #6d28d9; }
.sc:hover .mgn { display: block; }

/* ==================================================================
   2026-10-16 老板改交互：电梯标注不再用卡上按钮 —— 卡上两个「有 / 无」按钮已撤掉，
   改成「连点两次订单卡」切换（见 dispatch.js 的 cycleLift）。
   下面这段按钮样式只留给右下角订单详情池用（那里保留一对显式按钮做兜底）。
   ================================================================== */

/* 详情池里的「有 / 无」电梯按钮（与订单池同一套外观） */
.dp2-liftrow { display: inline-flex; gap: 4px; margin-left: 8px; vertical-align: middle; }
.dp2-liftrow .lb2 {
  width: 40px; height: 22px; line-height: 20px; padding: 0;
  font-size: 12px; font-weight: 700;
  border: 1px solid #dfe4ec; border-radius: 5px;
  background: #fff; color: var(--tx-2); cursor: pointer;
}
.dp2-liftrow .lb2:hover { border-color: #a9bde6; color: var(--tx); }
.dp2-liftrow .lb2.g.on { background: #22c55e; border-color: #16a34a; color: #fff; }
.dp2-liftrow .lb2.b.on { background: #3b82f6; border-color: #2563eb; color: #fff; }

/* ==================================================================
   2026-10-16 老板口径：界面上带教学 / 指引性质的浅灰小字全部删除。
   保留下来的「数据 / 计数」类小字统一用 .sm-mut（与 .hint 区分开，
   以后想再清教学文字时，不用去猜哪些 .hint 里装的是数据）。
   ================================================================== */
.sm-mut { font-size: 12px; color: var(--tx-2); }

/* ==================================================================
   2026-10-17 老板口径：新建订单「货品明细」表宽度过宽
   病根：这张表套了 .tbl{width:100%}，被拉满整屏 → 右边的
        「工费单价 / 小计 / 重量合计」三列在没填数量时全是 0.00 / —，
        却平白占掉一大片宽度。
   修：本表宽度按内容定（不拉伸），数值列收窄，省下来的宽度留给「货品」。
   ================================================================== */
.items-tbl {
  width: auto;
  max-width: 100%;
}
.items-tbl th,
.items-tbl td {
  white-space: nowrap;
}
/* 表格里的控件跟着列宽走，别用自己的默认宽度把列撑开 */
.items-tbl td .ipt,
.items-tbl td input,
.items-tbl td select {
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
}

/* ==================================================================
   2026-10-17 老板口径（第三轮）：待派订单卡上的「有 / 无」电梯按钮
   原话：「考虑到误触麻烦，原本连续点击卡片转变有无电梯的功能取消，
          还是改成原本的手动选择有无电梯：……用可选中点击「有」和「无」
          字样按钮表示，按钮占订单卡的比例不小于四分之一。」
   一个按钮 ≥ 卡宽 1/4 —— 这里用 flex:1 + min-width:26% 双保险
   （卡宽被网格压到很窄时，26% 也保证看得见、点得中）。
   已确认电梯的卡不再给按钮（只能走「改单」），所以这里只管未确认的卡。
   ================================================================== */
/* ============================================================================
 * 2026-10-19 老板口径（方案 A）：没确认电梯的卡，「有 / 无」不再是白色实心按钮
 *
 *   原来：白底一行按钮（19px）压在地址上，66~70px 高的卡把地址挤掉/切掉。
 *   现在：整张卡**左右各一半**铺 40% 透明的绿 / 蓝底色，地址照常显示在上面；
 *        「有 / 无」两个字落在各自一半的底部，不再是独立的白块。
 *
 *   ⚠️ 可点区域只做在**下面那一条**（各占半宽、30px 高）：
 *      整卡都能点的话，误触会把电梯档定死 —— 定了只能去「改单」里改。
 *      卡片上半部分保持原样：单击看详情、按住可拖到车辆上。
 * ========================================================================== */
.oc.has-lb {
  position: relative;
  /* 2026-10-20 方案B（老板定稿）：上半部分保持白底、文字完整可见；
     绿/蓝色带只占**下面一条**（左右各半），边界清楚。 */
  max-height: none;
  min-height: 78px;
  padding-bottom: 34px;
  background: #fff;
  cursor: pointer;          /* 还没选电梯 → 只能点，不能拖 */
}
.oc.has-lb .oc-h, .oc.has-lb .oc-a { position: relative; z-index: 2; }
.oc.has-lb .oc-lbrow {
  position: absolute; left: 0; right: 0; bottom: 0; height: 34px;
  display: flex;
  margin: 0; gap: 0; z-index: 1;
  /* 色带本身 40% 透明（压在白底上就是浅绿/浅蓝），有/无 两个字在各自一半居中 */
  background-image: linear-gradient(90deg,
    rgba(34, 197, 94, .40) 0%, rgba(34, 197, 94, .40) 50%,
    rgba(59, 130, 246, .40) 50%, rgba(59, 130, 246, .40) 100%);
  border-top: 1px solid rgba(148, 163, 184, .28);
  border-radius: 0 0 6px 6px;
}
.oc.has-lb .oc-lbrow .lb2 {
  flex: 1 1 50%;
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #14532d;
  font-size: 14px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.oc.has-lb .oc-lbrow .lb2.b { color: #1e3a8a; }
/* hover 只做一层很淡的白，提示这里可以点 */
.oc.has-lb .oc-lbrow .lb2:hover { background: rgba(255, 255, 255, .55); }
/* 未选电梯的卡整张不可拖 */
.oc.has-lb[draggable="false"] { cursor: pointer; }

/* 2026-10-17：面板标题右边的「数据小字」（货品明细的 共 N 件 / X 吨） */
.panel-hd-s { float: right; font-size: 12px; font-weight: 400; color: var(--tx-2); }
.panel-hd-s .badge { margin-left: 4px; }

/* 2026-10-17 老板口径：另派了测量员的测量单 → 卡片上黄色小字「测」
   （外观与「卸」标完全一致，只是字不同；不撑大卡片） */
.oc-h .m.sv {
  font-size: 10px; padding: 0 4px; border-radius: 3px; margin-left: 3px;
  border: 1px solid #f0c674; background: #fdf6e6; color: #96690f;
}
.oc-h .m.tk, .oc-h .m.rj, .oc-h .m.ul, .oc-h .m.sv { margin-left: 2px; }

/* 2026-10-17：排班格位小卡上的「测」标 —— 放左上角，避免与右下角的「卸」标重叠 */
.sc .sv {
  position: absolute; top: -5px; left: -5px; z-index: 2;
  font-size: 9.5px; line-height: 12px; text-decoration: none;
  padding: 0 3px; border-radius: 3px;
  border: 1px solid #f0c674; background: #fdf6e6; color: #96690f;
}

/* ==================================================================
 *  订单列表行内展开（2026-10-18 老板口径）
 *  点「明细 / 照片」在当前行下面就地展开，不用打开右侧抽屉。
 * ================================================================== */
.tbl tbody tr.sel > td { background: #eef5ff; }
.expand-tr > td {
  padding: 0 !important;
  background: #f8fafc;
  border-bottom: 1px solid var(--line);
}
.exp-bd { padding: 10px 14px 14px; }
.exp-bd h4 { margin: 0 0 8px; font-size: 12.5px; font-weight: 600; color: var(--tx-2); }
.exp-bd .tbl { background: #fff; border: 1px solid var(--line); border-radius: 6px; }
.exp-bd .wall { grid-template-columns: repeat(8, 1fr); gap: 8px; }
.exp-bd .phgrp-hd { margin-top: 10px; }
.exp-bd .phgrp:first-child .phgrp-hd { margin-top: 0; }

/* 行内小按钮（2026-10-18：人员后面「取消」派工） */
.btn-xs {
  padding: 1px 7px !important;
  font-size: 11px !important;
  line-height: 17px !important;
  height: auto !important;
  border-radius: 4px;
  vertical-align: middle;
}

/* 2026-10-19 订单详情：附加结算面板（对客附加 / 工费附加） */
.extra-panel { border-color: #d7e3f8; }
.extra-panel .panel-hd { background: #f4f8ff; color: #1d4ed8; }
.extra-bd { padding: 6px 14px 12px; }
.extra-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-bottom: 1px dashed var(--line-2);
}
.extra-row:last-child { border-bottom: none; }
.extra-row .ex-k { font-size: 12.5px; color: var(--tx-2); width: 150px; flex: none; }
.extra-row .ex-v { font-size: 14px; font-weight: 600; color: #b45309; width: 110px; flex: none; }
.extra-row .ex-n { flex: 1; min-width: 0; color: var(--tx-3); }
.extra-row .btn { flex: none; }

/* 2026-10-19 排班表：外包车辆角标（跟自有车同一档，只做视觉区分） */
.mini-tag.out { background: #fff4e5; color: #b45309; border-color: #f5d7ae; }

/* ============ 2026-10-19 圣都结算页 ============ */
.st-alert {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 14px 12px; padding: 11px 14px; border-radius: 8px;
  background: #fff1f0; border: 1px solid #ffcdc7; color: #9f2418; font-size: 13px;
}
.st-alert b { color: #c0281a; }
.st-alert-l { margin-left: auto; display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12.5px; }
.st-ok {
  margin: 0 14px 12px; padding: 10px 14px; border-radius: 8px;
  background: #ecfdf3; border: 1px solid #bbf7d0; color: #166534; font-size: 13px;
}
.st-kpi { display: flex; gap: 12px; padding: 0 14px 14px; flex-wrap: wrap; }
.st-card {
  flex: 1 1 150px; background: #f7f9fc; border: 1px solid var(--line-2);
  border-radius: 8px; padding: 12px 14px;
}
.st-card-t { font-size: 12px; color: var(--tx-3); }
.st-card-v { font-size: 19px; font-weight: 700; color: var(--pri); margin-top: 4px; }
.st-card-s { font-size: 11.5px; color: var(--tx-3); margin-top: 3px; }
.st-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 0 14px 12px; font-size: 12.5px; color: var(--tx-2);
}
.st-bar label { display: flex; align-items: center; gap: 6px; }
.st-bar input[type=date] { border: 1px solid var(--line); border-radius: 6px; padding: 5px 8px; font-size: 12.5px; }
.st-note { color: var(--tx-3); font-size: 12px; }
.st-warn {
  margin: 0 14px 12px; padding: 10px 14px; border-radius: 8px;
  background: #fffbeb; border: 1px solid #fde68a; color: #92400e; font-size: 12.5px;
}
.st-tbl { margin: 0 0 8px; }
.st-tbl th { white-space: nowrap; }
.st-tbl td { vertical-align: middle; }
.st-tbl .num { text-align: right; white-space: nowrap; }
.st-tbl .b { font-weight: 700; }
.st-tag {
  display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 8px;
  background: #fff1e3; color: #c2620a; font-size: 11px;
}
.st-st { font-size: 12px; padding: 2px 8px; border-radius: 9px; background: #eef2f8; color: var(--tx-2); white-space: nowrap; }
.st-st.ok { background: #e8f7ee; color: #17703d; }
.st-st.bad { background: #fff1f0; color: #b3261e; }
.st-add { white-space: nowrap; }
.st-cb {
  display: inline-flex; align-items: center; gap: 3px; margin-right: 8px;
  font-size: 12px; color: var(--tx-2); cursor: pointer;
}
.st-na { color: #c3cbd8; font-size: 12px; }
.st-bad { color: #c0281a; font-size: 12px; }
.st-fees { margin: 8px 14px 16px; border-top: 1px solid var(--line); padding-top: 10px; }
.st-fees summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--tx-2); }
.st-fee-tip { font-size: 12px; color: var(--tx-3); padding: 8px 0; }
.st-fee-ft { display: flex; align-items: center; gap: 12px; padding: 10px 0 2px; }

/* 圣都结算 · 对账单核对 */
.st-billbar {
  margin: 0 14px 12px; padding: 9px 14px; border-radius: 8px;
  background: #eef4ff; border: 1px solid #cfdcff; color: #1f3d7a; font-size: 12.5px;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.st-billbar b.ok, .st-bill .ok { color: #17703d; font-weight: 700; }
.st-billbar b.bad, .st-bill .bad { color: #b3261e; font-weight: 700; }
.st-billbar b.warn { color: #92400e; font-weight: 700; }
.st-bill { white-space: nowrap; font-size: 12px; }
.btn.btn-xs { padding: 2px 8px; font-size: 11.5px; margin-left: 6px; }
.st-exact { margin-left: 5px; font-size: 10.5px; color: #1f5fd0; background: #e6eefc; padding: 1px 5px; border-radius: 6px; }

/* ============ 2026-10-19 圣都合并页（客户回传 + 对账结算） ============ */
.stc-hint { font-size: 12.5px; color: var(--tx-3); }
.stc-pane > .panel:first-child { margin-top: 0; }

/* ==================================================================
 *  回传包（2026-10-19 老板口径）
 *  搜采购单号 → 一单一个包：左边附加费明细、右边回传照片，一键完成回传
 * ================================================================== */
.pk-search { display: flex; gap: 10px; align-items: center; padding: 14px 16px 6px; }
.pk-ipt {
  flex: 1; max-width: 560px; height: 36px; padding: 0 12px;
  border: 1px solid var(--line); border-radius: 6px; font-size: 13px;
  font-family: inherit; color: var(--tx-1); background: #fff;
}
.pk-ipt:focus { outline: none; border-color: var(--pri); box-shadow: 0 0 0 2px rgba(29,78,216,.12); }
.pk-tip { padding: 0 16px 14px; font-size: 12px; line-height: 1.65; color: var(--tx-3); }

.pk-hits-hd { margin: 14px 2px 8px; font-size: 12.5px; color: var(--tx-3); }
.pk-panel { margin-bottom: 12px; }
.pk-panel > .panel-hd.pk-hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pk-no { font-size: 13px; letter-spacing: .2px; }
.pk-sub { font-size: 12px; color: var(--tx-3); }
.pk-status { margin-left: auto; }

.pk-body { padding: 10px 14px 14px; }
.pk-cols { display: flex; gap: 18px; align-items: flex-start; }
.pk-left { flex: 0 0 46%; min-width: 0; }
.pk-right { flex: 1; min-width: 0; }
.pk-left h4, .pk-right h4 { margin: 2px 0 8px; font-size: 12.5px; font-weight: 600; color: var(--tx-2); }
/* 2026-10-20：照片区「下载全部」+ 说明「圣都的上传框不支持拖拽」 */
.pk-right h4 { display: flex; align-items: center; gap: 8px; }
/* 2026-10-26 送货清单自动生成的状态提示（toast 全站关闭，反馈必须写在页内） */
.pk-mk-state { font-size: 11.5px; font-weight: 400; color: var(--tx-3); }
.pk-mk-state.busy { color: var(--pri); }
.pk-mk-state.ok { color: #16a34a; }
.pk-mk-state.bad { color: #dc2626; }
.pk-dlall { margin-left: auto; }
.pk-tip { font-size: 12px; color: var(--tx-3); line-height: 1.55; margin: 0 0 8px; }
/* 「能不能直接把照片拖进去」的自检签 */
.pk-ds { display: inline-block; margin-right: 6px; padding: 1px 6px; border-radius: 4px;
  font-size: 11.5px; font-weight: 600; background: #eef1f6; color: var(--tx-3); }
.pk-ds.ok { background: #e8f7ee; color: #17703d; }
.pk-ds.bad { background: #fff4e5; color: #b45309; }

.pk-feetbl { background: #fff; }
.pk-feetbl tfoot th { border-top: 1px solid var(--line); background: #f8fafc; font-size: 12.5px; }
.pk-feetbl .num { text-align: right; }
.pk-note { font-size: 11.5px; color: var(--tx-3); }
.pk-na { color: var(--tx-3); }
.pk-acts { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }

.pk-photos { max-height: 430px; overflow: auto; padding-right: 4px; }
.pk-phgrp { margin-bottom: 10px; }
.pk-phhd {
  display: flex; justify-content: space-between; gap: 10px;
  font-size: 11.5px; color: var(--tx-3); margin-bottom: 6px;
}
.pk-phhd span { color: var(--tx-3); }
/* 2026-10-20：照片墙改成大图（老板要直接按住拖进微信，不再看小缩略图） */
.pk-wall { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pk-ph {
  display: block; position: relative; aspect-ratio: 4 / 3;
  border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #f1f3f6;
}
.pk-ph img { width: 100%; height: 100%; object-fit: contain; display: block; }
.pk-ph .pk-img { cursor: grab; }
.pk-ph .pk-img:active { cursor: grabbing; }
.pk-ph:hover { border-color: var(--pri); }
/* 2026-10-20：照片可以直接拖到圣都系统的上传框（dragstart 里塞的是真文件） */
.pk-ph { cursor: zoom-in; }   /* 点一下放大；拖的是里面的图片 */
/* 缩略图右下角的序号，对应下载文件名 PO...-N.jpg */
.pk-ph-n {
  position: absolute; right: 3px; bottom: 3px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 8px; background: rgba(15,23,42,.62); color: #fff;
  font-size: 11px; line-height: 16px; text-align: center;
}
.pk-ph-wait {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 11px; color: var(--tx-3);
}

.pk-ft {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line-2);
}
.pk-empty { padding: 18px; text-align: center; font-size: 12.5px; color: var(--tx-3); }
.pk-empty.pk-sm { padding: 10px; text-align: left; }
/* 2026-10-24：待回传默认收起，只给一个入口按钮（进页面不读数据、不铺列表） */
.pk-gate { padding: 18px 14px; text-align: center; }
.pk-gate .btn { min-width: 200px; }
.pk-gate-tip { margin-top: 9px; font-size: 12px; line-height: 1.6; color: var(--tx-3); }
.pk-warn { color: #b45309; }
.pk-tbl .pk-addr { max-width: 340px; }

@media (max-width: 900px) {
  .pk-cols { display: block; }
  .pk-left { margin-bottom: 14px; }
  .pk-wall { grid-template-columns: repeat(2, 1fr); }
}

/* 2026-10-23 订单管理分页条（每页 20 单） */
.pgbar {
  padding: 10px 14px;
  border-top: 1px solid var(--line-2);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pgbar .btn-sm { padding: 4px 10px; min-width: 36px; }
.pgbar .btn-sm[disabled] { opacity: .45; cursor: not-allowed; }
.pgbar .sm-mut { font-size: 12.5px; color: var(--tx-3); }
.pgbar .sm-mut b { color: var(--tx-1); font-variant-numeric: tabular-nums; }

/* ============================================================================
   2026-10-25 商品管理（商品 + 工价合并）
   老板口径：点开只看到「搜索商品」框 + 两个**大蓝色按钮**；
   工价搬进商品编辑框（.ph-sec）。字号/高度都按「好点」来，不用鼠标找。
   ============================================================================ */
.prod-hero,
.search-hero {
  max-width: 760px;
  margin: 18px auto 0;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 22px 24px 20px;
  box-shadow: 0 6px 24px rgba(20, 32, 56, .06);
}
.prod-hero .ph-lb,
.search-hero .ph-lb {
  font-size: 15px;
  font-weight: 600;
  color: var(--tx);
  margin-bottom: 10px;
}
.prod-hero .ph-ipt,
.search-hero .ph-ipt {
  width: 100%;
  height: 56px;
  font-size: 17px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--tx);
  outline: none;
}
.prod-hero .ph-ipt:focus,
.search-hero .ph-ipt:focus {
  border-color: var(--pri);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, .12);
}
.prod-hero .ph-acts,
.search-hero .ph-acts {
  display: flex;
  gap: 14px;
  margin-top: 16px;
}
.ph-btn {
  flex: 1 1 0;
  height: 60px;
  border: 0;
  border-radius: 12px;
  background: var(--pri);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .5px;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(29, 78, 216, .32);
  transition: background .15s, transform .06s;
}
.ph-btn:hover:not(:disabled) { background: var(--pri-d); }
.ph-btn:active:not(:disabled) { transform: translateY(1px); }
.ph-btn:disabled { opacity: .6; cursor: not-allowed; }
.prod-hero .ph-tip,
.search-hero .ph-tip {
  margin-top: 12px;
  font-size: 12.5px;
  color: var(--tx-3);
}
.ph-btn.ph-btn-inline { flex: 0 0 auto; padding: 0 28px; height: 52px; font-size: 16px; }

/* 编辑弹层里的工价区块 */
.ph-sec {
  margin: 14px 0 4px;
  padding: 14px 14px 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fafbfd;
}
.ph-sec .ph-sec-hd {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
}
.ph-sec .ph-sec-hd .hint { margin-left: 8px; font-weight: 400; }

/* ==================================================================
 *  2026-10-28 多选下拉（订单管理筛选框）
 *  结构：.msel > .msel-btn + .msel-pop（.msel-list 滚动 + .msel-ft 固定按钮）
 *  展开态由 .msel.on 控制；点浮层外面自动收起（见 js/ui.js 的委托）
 * ================================================================== */
.msel { position: relative; display: inline-block; vertical-align: middle; }
.msel-btn {
  display: flex; align-items: center; gap: 6px;
  min-width: 132px; max-width: 220px; height: 34px; padding: 0 10px;
  background: #fff; border: 1px solid #d8dee9; border-radius: 6px;
  font-size: 13px; color: #1e2a3a; cursor: pointer;
}
.msel-btn:hover { border-color: #b9c4d4; }
.msel-v {
  flex: 1; min-width: 0; overflow: hidden; white-space: nowrap;
  text-overflow: ellipsis; text-align: left;
}
.msel-ar { font-style: normal; font-size: 11px; color: #8a95a5; }
.msel.on > .msel-btn { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.msel-pop {
  display: none; position: absolute; z-index: 60; top: calc(100% + 6px); left: 0;
  min-width: 210px; max-width: 300px; background: #fff;
  border: 1px solid #d8dee9; border-radius: 8px;
  box-shadow: 0 12px 28px rgba(15, 30, 60, .16);
}
.msel.on > .msel-pop { display: block; }
.msel-list { max-height: 280px; overflow: auto; padding: 4px 0; }
.msel-it {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 12px; font-size: 13px; color: #2c3a4d;
  cursor: pointer; white-space: nowrap;
}
.msel-it:hover { background: #f3f7ff; }
.msel-it input { margin: 0; }
.msel-ft {
  display: flex; justify-content: space-between; gap: 8px;
  padding: 8px 10px; border-top: 1px solid #eef1f6;
  background: #fafbfd; border-radius: 0 0 8px 8px;
}
.msel-ft button {
  font-size: 12px; padding: 4px 12px; border-radius: 6px;
  border: 1px solid #d8dee9; background: #fff; cursor: pointer;
}
.msel-ft .msel-ok { background: #2563eb; border-color: #2563eb; color: #fff; }

/* 2026-10-28：多选下拉放进「按条件筛选」卡片时，跟原来 <select> 一样占满剩余宽度 */
.ef > .msel { flex: 1; min-width: 0; }
.ef > .msel > .msel-btn { width: 100%; max-width: none; }