/* ============ 壹本 ERP · 基础变量 ============ */
:root {
  --bg: #f3f6fb;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --ink: #0f172a;
  --ink-2: #334155;
  --muted: #6b7a90;
  --line: #e5eaf3;
  --line-strong: #d7dfec;
  --primary: #2456d8;
  --primary-2: #3b82f6;
  --primary-soft: #eef4ff;
  --teal: #0e9f9f;
  --ok: #17864a;
  --ok-soft: #e8f7ef;
  --warn: #b45309;
  --warn-soft: #fff5e6;
  --danger: #c62828;
  --danger-soft: #fdecec;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow: 0 12px 30px -18px rgba(15, 23, 42, .35);
  --radius: 14px;
  --sidebar-w: 236px;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
h1, h2, h3, h4, p { margin: 0; }
input, select, textarea { font-family: inherit; font-size: 13.5px; color: var(--ink); }
::selection { background: #cddcff; }

/* ============ 布局 ============ */
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: var(--sidebar-w);
  flex: 0 0 var(--sidebar-w);
  background: var(--surface);
  border-right: 1px solid var(--line);
  position: sticky; top: 0; height: 100vh;
  display: flex; flex-direction: column;
  z-index: 40;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 20px 18px 14px; }
.brand-mark {
  width: 38px; height: 38px; border-radius: 11px;
  background: linear-gradient(135deg, #2f6bff, #0bb6c9);
  color: #fff; font-weight: 700; font-size: 18px;
  display: grid; place-items: center;
  box-shadow: 0 8px 18px -8px rgba(36, 86, 216, .8);
  flex: 0 0 38px;
}
.brand-text strong { display: block; font-size: 15px; letter-spacing: .2px; }
.brand-text span { font-size: 10.5px; color: var(--muted); letter-spacing: .02em; }

.nav { flex: 1; overflow-y: auto; padding: 4px 10px 16px; }
.nav::-webkit-scrollbar { width: 6px; }
.nav::-webkit-scrollbar-thumb { background: #dfe6f2; border-radius: 4px; }
.nav-group { margin-top: 14px; }
.nav-title {
  font-size: 10.5px; color: #94a3b8; padding: 6px 10px;
  letter-spacing: .1em; font-weight: 600;
}
.nav-item {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 10px; margin: 1px 0;
  border-radius: 9px; color: #3b4a61; font-size: 13px;
  cursor: pointer; position: relative; transition: background .14s, color .14s;
}
.nav-item svg { flex: 0 0 17px; opacity: .78; }
.nav-item:hover { background: #f2f6fd; color: var(--primary); }
.nav-item.active { background: var(--primary-soft); color: var(--primary); font-weight: 600; }
.nav-item.active svg { opacity: 1; }
.nav-item.locked { color: #9aa8ba; }
.nav-item.locked:hover { background: #f7f9fc; color: #7b8aa0; }
.nav-item .nav-tag {
  margin-left: auto; font-size: 9.5px; padding: 1px 6px; border-radius: 20px;
  background: #f1f5f9; color: #8b99ab; letter-spacing: .02em;
}
.nav-item .nav-count {
  margin-left: auto; font-size: 10.5px; padding: 1px 7px; border-radius: 20px;
  background: #ffe9e9; color: #c62828; font-weight: 600;
}
.sidebar-foot { padding: 10px 14px 16px; border-top: 1px solid var(--line); }
.sidebar-tip {
  background: linear-gradient(140deg, #f1f6ff, #eefbfa);
  border: 1px solid #e2edff; border-radius: 10px; padding: 10px 11px; margin-bottom: 10px;
}
.sidebar-tip b { display: block; font-size: 11.5px; color: #2456d8; margin-bottom: 3px; }
.sidebar-tip span { font-size: 10.5px; color: #7b8aa0; line-height: 1.5; display: block; }
.ver { font-size: 10px; color: #a4b0c2; text-align: center; }

.workspace { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar {
  height: 62px; flex: 0 0 62px;
  background: rgba(255, 255, 255, .88);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 14px;
  padding: 0 24px; position: sticky; top: 0; z-index: 30;
}
.crumb { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--muted); }
.crumb b { color: var(--ink); font-weight: 600; font-size: 13.5px; }
.crumb .sep { color: #cbd5e1; }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.company-chip {
  display: flex; align-items: center; gap: 7px;
  font-size: 12px; color: #475569; background: #f6f8fc;
  border: 1px solid var(--line); padding: 6px 11px; border-radius: 20px;
}
.dot-live { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34, 197, 94, .14); }
.icon-btn {
  width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--line);
  background: #fff; color: #55637a; display: grid; place-items: center;
  font-size: 15px; transition: .15s;
}
.icon-btn:hover { border-color: #bfd0ea; color: var(--primary); background: #f7faff; }
.user { display: flex; align-items: center; gap: 8px; padding-left: 12px; border-left: 1px solid var(--line); }
.avatar {
  width: 31px; height: 31px; border-radius: 50%; background: #e8efff;
  color: #2456d8; font-weight: 700; font-size: 13px; display: grid; place-items: center;
}
.user-meta b { display: block; font-size: 12.5px; line-height: 1.3; }
.user-meta small { font-size: 10.5px; color: var(--muted); }
.mobile-only { display: none; }

.view { padding: 24px 28px 40px; max-width: 1500px; width: 100%; margin: 0 auto; }

/* 环境提示条（本地存储不可用时降级为内存模式） */
/* hidden 必须是绝对的：.btn / .pill 等自带 display，会盖掉浏览器默认的 [hidden] */
[hidden] { display: none !important; }
.env-banner {
  display: flex; align-items: center; gap: 12px;
  margin: 14px 28px 0; padding: 11px 14px;
  background: var(--warn-soft); border: 1px solid #f3d9a8;
  border-radius: 11px; color: #7c4a03;
}
.env-banner[hidden] { display: none; }
.env-badge {
  flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: .5px;
  background: #f59e0b; color: #fff; padding: 3px 8px; border-radius: 6px;
}
.env-text { min-width: 0; flex: 1; }
.env-text b { display: block; font-size: 13px; color: #6b3f02; }
.env-text span { display: block; font-size: 11.5px; color: #8a5a10; line-height: 1.6; margin-top: 2px; }
.env-actions { display: flex; gap: 6px; flex: 0 0 auto; }
.env-banner .btn.sm { background: #fff; border-color: #eccf9a; color: #7c4a03; }
.env-banner .btn.sm:hover { background: #fffaf0; }
@media (max-width: 720px) {
  .env-banner { margin: 10px 14px 0; flex-wrap: wrap; }
  .env-text { flex-basis: calc(100% - 60px); }
  .env-actions { flex-basis: 100%; justify-content: flex-end; }
}

/* 临时登录提示条（非常用设备：刷新后要重新登录） */
.temp-banner { background: #eef4ff; border-color: #cddcff; }
.temp-banner .env-badge { background: #2563eb; }
.temp-banner .env-text b { color: #1a3fa0; }
.temp-banner .env-text span { color: #3b5bab; }
.temp-banner .btn.sm { background: #fff; border-color: #cddcff; color: #1e40af; }
.temp-banner .btn.sm:hover { background: #f7faff; }

/* 初始密码提醒条（账号还是统一初始口令） */
.pwd-banner { background: #fff8e6; border-color: #f2d491; }
.pwd-banner .env-badge { background: #d97706; }
.pwd-banner .env-text b { color: #7c4a03; }
.pwd-banner .env-text span { color: #92620c; }
.pwd-banner .btn.sm { background: #fff; border-color: #efd7a4; color: #8a5400; }
.pwd-banner .btn.sm:hover { background: #fffdf6; }

/* 登录设备清单 */
.dev-list { display: flex; flex-direction: column; gap: 8px; }
.dev-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border: 1px solid #e5eaf2; border-radius: 10px; background: #fff;
}
.dev-row.on { border-color: #cddcff; background: #f7faff; }
.dev-main { min-width: 0; flex: 1; }
.dev-name {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 13px; font-weight: 600; color: var(--ink);
}
.dev-main small { display: block; font-size: 11.5px; color: #94a3b8; margin-top: 3px; }
.dev-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10.5px; font-style: normal; color: #a8b3c4; letter-spacing: .3px;
}
.dev-ops { display: flex; gap: 6px; flex: 0 0 auto; }
.dev-empty {
  padding: 14px; text-align: center; font-size: 12.5px; color: #94a3b8;
  border: 1px dashed #dbe3ee; border-radius: 10px;
}
@media (max-width: 720px) {
  .dev-row { flex-wrap: wrap; }
  .dev-ops { width: 100%; justify-content: flex-end; }
}

/* ============ 页面头部 ============ */
.page-head { display: flex; align-items: flex-end; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.page-head h1 { font-size: 22px; letter-spacing: -.01em; font-weight: 650; }
.page-head .sub { margin-top: 5px; font-size: 12.5px; color: var(--muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.page-head .head-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }

/* ============ 按钮 ============ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 34px; padding: 0 14px; border-radius: 9px;
  border: 1px solid var(--line-strong); background: #fff; color: #334155;
  font-size: 13px; font-weight: 500; white-space: nowrap;
  transition: .15s; box-shadow: var(--shadow-sm);
}
.btn:hover { border-color: #b9cbe8; color: var(--primary); background: #fbfdff; }
.btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 6px 14px -8px rgba(36, 86, 216, .9); }
.btn.primary:hover { background: #1b47bd; color: #fff; }
.btn.ghost { background: transparent; border-color: transparent; box-shadow: none; color: #56657c; }
.btn.ghost:hover { background: #f1f5fb; }
.btn.danger { color: var(--danger); border-color: #f2cdcd; background: #fff; }
.btn.danger:hover { background: var(--danger-soft); color: var(--danger); }
.btn.sm { height: 28px; padding: 0 10px; font-size: 12px; border-radius: 7px; }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn-group { display: inline-flex; gap: 6px; flex-wrap: wrap; }

/* ============ 卡片 ============ */
.card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.card-head {
  display: flex; align-items: center; gap: 10px;
  padding: 15px 18px; border-bottom: 1px solid var(--line);
}
.card-head h3 { font-size: 14px; font-weight: 600; }
.card-head .sub { font-size: 11.5px; color: var(--muted); }
.card-head .right { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.card-body { padding: 16px 18px; }
.card-body.tight { padding: 0; }

/* ============ KPI ============ */
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.kpi {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; position: relative; overflow: hidden; box-shadow: var(--shadow-sm);
}
.kpi::after {
  content: ""; position: absolute; right: -28px; top: -34px; width: 96px; height: 96px;
  border-radius: 50%; background: radial-gradient(circle, rgba(59, 130, 246, .1), transparent 68%);
}
.kpi .kpi-label { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.kpi .kpi-value { font-size: 25px; font-weight: 650; letter-spacing: -.02em; margin: 9px 0 6px; font-variant-numeric: tabular-nums; }
.kpi .kpi-value small { font-size: 12px; font-weight: 500; color: var(--muted); margin-left: 3px; }
.kpi .kpi-foot { font-size: 11.5px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.trend-up { color: var(--ok); font-weight: 600; }
.trend-down { color: var(--danger); font-weight: 600; }
.kpi-icon {
  width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center;
  background: var(--primary-soft); color: var(--primary); position: absolute; right: 16px; top: 16px;
}
.kpi-icon.teal { background: #e6f8f7; color: #0e8f8f; }
.kpi-icon.amber { background: #fff4e5; color: #b45309; }
.kpi-icon.red { background: #fdeeee; color: #c62828; }

/* ============ 网格 ============ */
.grid-2 { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 14px; margin-bottom: 14px; }
.grid-main-side { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 14px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }

/* ============ 业务流转 ============ */
.flow { padding: 18px; }
.flow-main { display: flex; align-items: center; gap: 8px; }
.flow-node {
  flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 12px; text-align: center; background: #fcfdff; cursor: pointer;
  transition: .16s; position: relative;
}
.flow-node:hover { border-color: #bcd1f5; background: #f7faff; transform: translateY(-1px); box-shadow: var(--shadow); }
.flow-node .fn-icon {
  width: 42px; height: 42px; border-radius: 12px; margin: 0 auto 9px;
  display: grid; place-items: center; color: #fff;
}
.flow-node .fn-title { font-size: 12.5px; font-weight: 600; }
.flow-node .fn-meta { font-size: 11px; color: var(--muted); margin-top: 3px; }
.flow-node .fn-badge {
  position: absolute; top: 8px; right: 8px; font-size: 10px; background: #fff1f1; color: #c62828;
  border-radius: 20px; padding: 1px 7px; font-weight: 600;
}
.bg-blue { background: linear-gradient(140deg, #3b82f6, #2456d8); }
.bg-cyan { background: linear-gradient(140deg, #22c7d6, #0e9f9f); }
.bg-amber { background: linear-gradient(140deg, #fbbf24, #f59e0b); }
.bg-violet { background: linear-gradient(140deg, #a78bfa, #7c5cf0); }
.bg-rose { background: linear-gradient(140deg, #fb7185, #e11d48); }
.bg-slate { background: linear-gradient(140deg, #94a3b8, #64748b); }
.flow-arrow { flex: 0 0 26px; color: #c3cfe2; display: grid; place-items: center; }
.flow-sub { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.flow-chip {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #4b5b73;
  border: 1px dashed var(--line-strong); background: #fbfcfe; padding: 7px 11px; border-radius: 8px; cursor: pointer;
}
.flow-chip:hover { border-color: #b9cbe8; color: var(--primary); background: #f7faff; }
.flow-chip svg { opacity: .65; }

/* ============ 待办 ============ */
.todo-list { padding: 6px 8px 10px; }
.todo {
  display: flex; align-items: center; gap: 11px; padding: 11px 10px; border-radius: 9px; cursor: pointer;
}
.todo:hover { background: #f8fafd; }
.todo .t-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; }
.todo .t-main { flex: 1; min-width: 0; }
.todo .t-main b { display: block; font-size: 12.5px; font-weight: 550; }
.todo .t-main span { font-size: 11px; color: var(--muted); }
.todo .t-count { font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
.todo .t-count small { font-size: 10.5px; font-weight: 400; color: var(--muted); margin-left: 2px; }

/* ============ 表格 ============ */
.table-wrap { overflow-x: auto; }
table.table { width: 100%; border-collapse: collapse; font-size: 12.8px; }
table.table th {
  text-align: left; font-weight: 600; color: #64748b; font-size: 11.5px;
  background: #f8fafd; padding: 10px 14px; border-bottom: 1px solid var(--line);
  white-space: nowrap; position: sticky; top: 0; z-index: 2;
}
table.table td { padding: 11px 14px; border-bottom: 1px solid #eff3f9; vertical-align: middle; }
table.table tbody tr:last-child td { border-bottom: none; }
table.table tbody tr:hover { background: #fafcff; }
table.table td.num, table.table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.table td.strong { font-weight: 600; }
table.table td.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; color: #475569; white-space: nowrap; }
table.table .sub-line { font-size: 11px; color: var(--muted); margin-top: 2px; }
table.table tr.clickable { cursor: pointer; }
table.table.compact td { padding: 9px 12px; }
table.table.compact th { padding: 8px 12px; }

/* 日期列不换行，避免出现「2026-10-」/「28」这种断行 */
.deliveries-table th:nth-child(4), .deliveries-table td:nth-child(4),
.returns-table th:nth-child(4), .returns-table td:nth-child(4),
.receipts-table th:nth-child(3), .receipts-table td:nth-child(3),
.orders-table th:nth-child(3), .orders-table td:nth-child(3),
.receipts-table th:nth-child(4), .receipts-table td:nth-child(4) { white-space: nowrap; }

/* 退货单的「原因」是长文本，给足宽度，客户列也不被挤扁 */
.returns-table th:nth-child(3), .returns-table td:nth-child(3) { width: 22%; }
.returns-table th:nth-child(5), .returns-table td:nth-child(5) { width: 28%; }

/* 窄屏逐级收起次要列，保证金额与操作列不被裁切 */
@media (max-width: 1320px) {
  .orders-table th:nth-child(5), .orders-table td:nth-child(5) { display: none; }
}
@media (max-width: 1160px) {
  .orders-table th:nth-child(6), .orders-table td:nth-child(6) { display: none; }
  .deliveries-table th:nth-child(2), .deliveries-table td:nth-child(2) { display: none; }
}
@media (max-width: 700px) {
  .orders-table th:nth-child(3), .orders-table td:nth-child(3) { display: none; }
}

/* ============ 徽标 ============ */
.pill {
  display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 500;
  padding: 2px 8px; border-radius: 20px; white-space: nowrap; line-height: 1.6;
}
.pill::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: .75; }
.pill.plain::before { display: none; }
.pill.ok { background: var(--ok-soft); color: #147a45; }
.pill.warn { background: var(--warn-soft); color: #b45309; }
.pill.info { background: #eef4ff; color: #2456d8; }
.pill.danger { background: var(--danger-soft); color: #c62828; }
.pill.muted { background: #f1f5f9; color: #64748b; }
.pill.purple { background: #f3edff; color: #7c3aed; }
.pill.blue { background: #e8f1ff; color: #2456d8; }
.pill.teal { background: #e2f7f6; color: #0b7c74; }
.pill.cyan { background: #e0f4fd; color: #0e7490; }
.pill.amber { background: #fef3e2; color: #b45309; }
.pill.rose { background: #fdeaec; color: #c62828; }
.pill.violet { background: #f3edff; color: #7c3aed; }

/* ============ 工作台 · 模块卡片 ============ */
.mod-card .card-head h3 { display: flex; align-items: center; gap: 8px; }
.mod-dot { width: 9px; height: 9px; border-radius: 3px; display: inline-block; flex: 0 0 9px; }
.mod-stat {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 10px; margin: 0 -4px; border-radius: 8px; font-size: 12.5px;
}
.mod-stat + .mod-stat { border-top: 1px dashed var(--line); }
.mod-stat span { color: var(--muted); }
.mod-stat b { font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }
.mod-stat:hover { background: #f6f9ff; cursor: pointer; }
.chip-badge {
  font-style: normal; font-size: 10.5px; font-weight: 600; margin-left: 4px;
  background: var(--warn-soft); color: #b45309; border-radius: 10px; padding: 0 6px; line-height: 1.7;
}

/* ============ 筛选 ============ */
.filters {
  display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap;
  padding: 14px 18px; border-bottom: 1px solid var(--line); background: #fff;
  border-radius: var(--radius) var(--radius) 0 0;
}
.field { display: flex; flex-direction: column; gap: 5px; }
.field > label { font-size: 11.5px; color: #6b7a90; font-weight: 500; }
.field > label .req { color: #dc2626; margin-left: 2px; }
.input, .select, textarea.input {
  height: 34px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 8px;
  background: #fff; outline: none; transition: .15s; min-width: 0;
}
textarea.input { height: auto; padding: 8px 10px; resize: vertical; line-height: 1.6; }
.input:focus, .select:focus, textarea.input:focus { border-color: #8bb0f5; box-shadow: 0 0 0 3px rgba(59, 130, 246, .13); }
.input::placeholder { color: #a7b3c4; }
.select { appearance: none; padding-right: 28px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7a90' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; }
.search-box { position: relative; }
.search-box .input { padding-left: 32px; width: 230px; }
.search-box svg { position: absolute; left: 10px; top: 9px; color: #94a3b8; }

.toolbar { display: flex; align-items: center; gap: 10px; padding: 10px 18px; background: #fbfcfe; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.toolbar .muted-text { font-size: 11.5px; color: var(--muted); }

/* ============ 空状态 ============ */
.empty { padding: 54px 20px; text-align: center; color: var(--muted); }
.empty .e-icon { width: 46px; height: 46px; border-radius: 14px; background: #f1f5fb; color: #9aa8bd; display: grid; place-items: center; margin: 0 auto 12px; }
.empty b { display: block; color: #475569; font-size: 13px; margin-bottom: 4px; font-weight: 550; }
.empty span { font-size: 12px; }

/* ============ 表单 ============ */
.form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 16px; }
.form-grid .span-2 { grid-column: span 2; }
.form-grid .span-3 { grid-column: span 3; }
.form-section { padding: 18px; }
.form-section + .form-section { border-top: 1px solid var(--line); }
.section-title { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; margin-bottom: 14px; }
.section-title::before { content: ""; width: 3px; height: 13px; border-radius: 3px; background: var(--primary); }
.section-title .right { margin-left: auto; }

/* ============ 明细编辑 ============ */
.items-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.items-table th {
  text-align: left; font-size: 11.5px; color: #64748b; font-weight: 600;
  background: #f8fafd; padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.items-table td { padding: 5px 8px; border-bottom: 1px solid #f1f5fa; }
.items-table td.num { text-align: right; }
.items-table tbody tr:hover { background: #fbfdff; }
.cell-input {
  width: 100%; height: 30px; border: 1px solid transparent; border-radius: 6px;
  background: transparent; padding: 0 7px; text-align: right; outline: none;
  font-variant-numeric: tabular-nums;
}
.cell-input:hover { border-color: var(--line-strong); background: #fff; }
.cell-input:focus { border-color: #8bb0f5; background: #fff; box-shadow: 0 0 0 3px rgba(59, 130, 246, .12); }
.cell-input.text { text-align: left; }
/* 按支计价的行：长度（规格）必填，空着时用浅黄虚线提示，填了就恢复正常 */
.cell-input.need-len { border-color: #f0c36d; border-style: dashed; background: #fffdf4; }
.cell-input.need-len:focus { border-style: solid; border-color: #8bb0f5; background: #fff; }
/* 明细表内的下拉选择（产品、单位） */
.cell-select {
  width: 100%; height: 30px; border: 1px solid transparent; border-radius: 6px;
  background: transparent; padding: 0 2px; font-size: 12px; color: #334155;
  outline: none; cursor: pointer; text-overflow: ellipsis;
}
.cell-select:hover { border-color: var(--line-strong); background: #fff; }
.cell-select:focus { border-color: #8bb0f5; background: #fff; box-shadow: 0 0 0 3px rgba(59, 130, 246, .12); }
.cell-select.name-cell { min-width: 150px; }
.item-del { border: none; background: transparent; color: #b6c2d4; font-size: 16px; line-height: 1; padding: 4px 7px; border-radius: 6px; }
.item-del:hover { color: var(--danger); background: var(--danger-soft); }
.items-empty { padding: 26px; text-align: center; color: var(--muted); font-size: 12.5px; }
/* 明细表计价规则说明 */
.items-hint { padding: 9px 12px 3px; font-size: 11.5px; color: #7c8aa0; line-height: 1.75; }
.items-hint b { color: #475569; font-weight: 600; }
/* 键盘按键提示：Tab / Enter */
.kbd { display: inline-block; padding: 0 5px; margin: 0 1px; border: 1px solid #cbd5e1; border-bottom-width: 2px; border-radius: 4px; background: #f8fafc; font-size: 11px; line-height: 16px; color: #475569; }
/* 规格列在非长度单位时锁定为只读 */
.cell-input:disabled, .cell-input[disabled] { color: #94a3b8; cursor: not-allowed; background: transparent; text-overflow: ellipsis; }
.cell-input:disabled:hover { border-color: transparent; background: transparent; }
/* 明细表加工费：自动合计值可直接改写，改写后出现 ↺ 恢复自动 */
.amt-wrap { display: flex; align-items: center; gap: 1px; }
.amt-wrap .cell-input { min-width: 0; font-weight: 600; color: var(--primary); }
.amt-wrap.is-manual .cell-input { color: var(--warn); }
.amt-reset {
  display: none; flex: 0 0 auto; width: 19px; height: 26px; border: none; background: transparent;
  color: #9aa8bd; font-size: 12px; line-height: 1; padding: 0; border-radius: 5px; cursor: pointer;
}
.amt-wrap.is-manual .amt-reset { display: block; color: #b45309; }
.amt-reset:hover { color: var(--primary); background: var(--primary-soft); }
/* 对账单·产品明细：按单号分组，单头单独一行 */
.stmt-wrap { border: 1px solid var(--line); border-radius: 10px; }
.stmt-dtl tbody tr.stmt-h td {
  background: #f5f8ff; padding: 6px 10px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.stmt-dtl tbody tr.stmt-h:first-child td { border-top: none; }
.stmt-h .sh-no { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 600; font-size: 12.5px; }
.stmt-h .sh-sub { margin-left: 10px; color: var(--muted); font-size: 11.5px; }
.stmt-h .sh-amt { float: right; color: var(--primary); font-weight: 600; font-size: 12px; }
.stmt-dtl tfoot td { background: #fbfcfe; font-weight: 600; }

.picker { position: relative; }
.picker-results {
  position: absolute; z-index: 50; top: 38px; left: 0; width: 380px; max-height: 300px; overflow-y: auto;
  background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 18px 40px -18px rgba(15, 23, 42, .4);
  padding: 5px;
}
.picker-item { display: flex; gap: 10px; padding: 8px 9px; border-radius: 7px; cursor: pointer; align-items: center; }
.picker-item:hover, .picker-item.hl { background: var(--primary-soft); }
.picker-item .pi-code { font-size: 11px; color: #64748b; font-family: ui-monospace, monospace; }
.picker-item .pi-name { font-size: 12.5px; font-weight: 550; }
.picker-item .pi-meta { font-size: 11px; color: var(--muted); }
.picker-item .pi-price { margin-left: auto; font-size: 12px; color: #2456d8; font-weight: 600; }
.picker-empty { padding: 18px; text-align: center; color: var(--muted); font-size: 12px; }
/* 表单里的联想输入框需要撑满字段宽度 */
.picker > .input { width: 100%; }
.field .picker { width: 100%; }
.field .picker > .input { width: 100%; }
@media (max-width: 640px) {
  .field .picker > .picker-results { width: 100%; min-width: 0; }
}

/* 字段下方的即时提示（客户匹配 / 新建建档） */
.field-hint { font-size: 11.5px; line-height: 1.5; margin-top: 5px; color: var(--muted); min-height: 16px; }
.field-hint.ok { color: var(--ok); }
.field-hint.new { color: var(--warn); }
.items-table .name-cell { min-width: 150px; }
/* 型号/规格通常较长，字号略小以便完整显示 */
.items-table input[data-f="model"], .items-table input[data-f="spec"] { font-size: 11.5px; padding: 0 5px; }
/* 分批发货 / 单型号退货：勾选本次要处理的型号 */
.items-table .pick-cell { text-align: center; padding-left: 10px; padding-right: 0; }
.items-table .pick-cell input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; accent-color: var(--primary); vertical-align: middle; }
.items-table tbody tr.picked { background: #f2f7ff; }
.items-table tbody tr.picked:hover { background: #eaf2ff; }
/* 单价低于公司价格表价：整行自动标红 */
.items-table tbody tr.low-price > td, .table tbody tr.low-price > td { background: #fef2f2 !important; }
.items-table tbody tr.low-price:hover > td, .table tbody tr.low-price:hover > td { background: #fee2e2 !important; }
.items-table tbody tr.low-price > td:first-child, .table tbody tr.low-price > td:first-child { box-shadow: inset 3px 0 0 #c62828; }
tr.low-price .cell-input[data-f="price"] { color: #c62828; font-weight: 650; }
tr.low-price [data-amt], tr.low-price .lp-price { color: #c62828 !important; font-weight: 650; }
/* 「低于价格表」红色小标（列表 / 详情行内提示） */
.lp-flag { display: inline-block; margin-left: 6px; padding: 1px 7px; font-size: 10.5px; border-radius: 999px; background: #fee2e2; color: #c62828; font-weight: 600; white-space: nowrap; vertical-align: 1px; }
/* 退货单列表：客户、型号、原因单行省略，避免被挤成竖排 */
.returns-table .clip { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.returns-table .clip + .clip { margin-top: 2px; }

/* ============ 合计栏 ============ */
.totals {
  display: flex; align-items: center; gap: 26px; flex-wrap: wrap;
  padding: 14px 18px; background: linear-gradient(180deg, #fbfdff, #f6f9ff);
  border-top: 1px solid var(--line); border-radius: 0 0 var(--radius) var(--radius);
}
.totals .t-item { font-size: 12px; color: var(--muted); }
.totals .t-item b { display: block; font-size: 16px; color: var(--ink); font-weight: 650; margin-top: 3px; font-variant-numeric: tabular-nums; }
.totals .t-item b.accent { color: var(--primary); font-size: 19px; }
.totals .t-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.discount-input { width: 74px; text-align: right; }

/* ============ 汇总结算栏（应付一起付 / 应收一起收） ============ */
.settle-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 14px 20px; flex-wrap: wrap;
  margin-top: 12px; padding: 12px 16px;
  background: linear-gradient(180deg, #fbfdff, #f4f8ff);
  border: 1px solid var(--line); border-radius: 10px;
}
.settle-sum { display: flex; align-items: baseline; gap: 8px 22px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.settle-sum b { font-size: 15px; color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; margin: 0 1px; }
.settle-sum b.accent { color: #c62828; font-size: 20px; }
.settle-sum.is-ar b.accent { color: #17864a; }
.settle-sum .muted { color: var(--muted); }
.settle-ops { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.settle-table td, .settle-table th { vertical-align: middle; }
.settle-table tbody tr[data-g] > td { padding-top: 10px; padding-bottom: 10px; }

/* ============ 详情 ============ */
.detail-hero { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 16px; }
.detail-hero h1 { font-size: 20px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.detail-hero .sub { font-size: 12px; color: var(--muted); margin-top: 6px; display: flex; gap: 14px; flex-wrap: wrap; }
.detail-hero .head-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 20px; }
.detail-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.detail-grid .span-2 { grid-column: span 2; }
.detail-grid .span-3 { grid-column: span 3; }
.dl-item label { display: block; font-size: 11.5px; color: var(--muted); margin-bottom: 4px; }
.dl-item div { font-size: 13px; color: var(--ink); }
.money-big { font-size: 22px; font-weight: 650; color: var(--primary); font-variant-numeric: tabular-nums; }

.steps { display: flex; align-items: center; margin: 4px 0 18px; flex-wrap: wrap; gap: 6px; }
.step { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #8b99ab; }
.step .s-dot { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #eef2f8; color: #94a3b8; font-size: 11px; font-weight: 600; }
.step.done { color: var(--ink-2); }
.step.done .s-dot { background: #e5f6ec; color: #17864a; }
.step.active .s-dot { background: var(--primary); color: #fff; box-shadow: 0 0 0 4px rgba(36, 86, 216, .12); }
.step-line { width: 42px; height: 1px; background: #e2e8f2; }

/* ============ 弹窗 ============ */
.mask {
  position: fixed; inset: 0; background: rgba(15, 23, 42, .42); backdrop-filter: blur(2px);
  z-index: 100; display: flex; align-items: flex-start; justify-content: center;
  padding: 6vh 20px 20px; animation: fadeIn .16s ease;
}
.modal {
  width: 560px; max-width: 100%; background: #fff; border-radius: 16px;
  box-shadow: 0 30px 70px -30px rgba(15, 23, 42, .6); animation: popIn .18s ease;
  max-height: 88vh; display: flex; flex-direction: column;
}
.modal.lg { width: 820px; }
.modal.xl { width: 1040px; }
.modal-head { padding: 18px 22px 14px; border-bottom: 1px solid var(--line); display: flex; align-items: flex-start; gap: 12px; }
.modal-head h3 { font-size: 16px; font-weight: 600; }
.modal-head p { font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.modal-head .modal-close { margin-left: auto; border: none; background: #f5f7fb; color: #64748b; width: 28px; height: 28px; border-radius: 8px; font-size: 16px; line-height: 1; }
.modal-head .modal-close:hover { background: #eef2f9; color: #0f172a; }
.modal-body { padding: 20px 22px; overflow-y: auto; }
.modal-foot { padding: 14px 22px; border-top: 1px solid var(--line); display: flex; justify-content: flex-end; gap: 8px; background: #fcfdff; border-radius: 0 0 16px 16px; }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes popIn { from { opacity: 0; transform: translateY(-8px) scale(.99); } to { opacity: 1; transform: none; } }

/* ============ Toast ============ */
.toast-root { position: fixed; right: 22px; bottom: 22px; z-index: 200; display: flex; flex-direction: column; gap: 8px; }
.toast {
  min-width: 220px; max-width: 360px; background: #0f172a; color: #f8fafc;
  border-radius: 10px; padding: 11px 14px; font-size: 12.5px; display: flex; align-items: center; gap: 9px;
  box-shadow: 0 14px 30px -12px rgba(15, 23, 42, .6); animation: toastIn .2s ease;
}
.toast.ok { background: #0f2f22; }
.toast.warn { background: #3a2708; }
.toast.err { background: #3b1212; }
.toast .t-ico { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .14); font-size: 11px; }
@keyframes toastIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ============ 报表 ============ */
.chart { display: flex; align-items: flex-end; gap: 14px; height: 190px; padding: 10px 4px 0; }
.chart .bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 7px; height: 100%; justify-content: flex-end; }
.chart .bar {
  width: 100%; max-width: 46px; border-radius: 7px 7px 3px 3px;
  background: linear-gradient(180deg, #5b8bf7, #2456d8); min-height: 3px;
  transition: height .4s ease; position: relative;
}
.chart .bar:hover { filter: brightness(1.06); }
.chart .bar-label { font-size: 10.5px; color: var(--muted); white-space: nowrap; }
.chart .bar-val { font-size: 10.5px; color: #475569; font-weight: 600; }
.rank-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px dashed #eef2f8; }
.rank-row:last-child { border-bottom: none; }
.rank-idx { width: 20px; height: 20px; border-radius: 6px; background: #f1f5fb; color: #64748b; font-size: 11px; display: grid; place-items: center; font-weight: 600; }
.rank-row:nth-child(1) .rank-idx { background: #fff3d6; color: #b45309; }
.rank-row .rank-main { flex: 1; min-width: 0; }
.rank-row .rank-name { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rank-row .rank-bar { height: 4px; border-radius: 4px; background: #eef2f9; margin-top: 6px; overflow: hidden; }
.rank-row .rank-bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #7aa6ff, #2456d8); }
.rank-row .rank-val { font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }

/* ============ 开发中 ============ */
.soon-wrap { display: grid; place-items: center; min-height: 62vh; }
.soon { max-width: 620px; text-align: center; }
.soon .soon-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #b45309; background: #fff7e8; border: 1px solid #ffe5bb; padding: 4px 11px; border-radius: 20px; margin-bottom: 16px; }
.soon h1 { font-size: 26px; margin-bottom: 10px; }
.soon p { color: var(--muted); font-size: 13px; line-height: 1.8; margin-bottom: 22px; }
.soon-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; text-align: left; margin-bottom: 24px; }
.soon-item { border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 12px 14px; font-size: 12.5px; display: flex; gap: 9px; align-items: center; }
.soon-item .dot { width: 7px; height: 7px; border-radius: 50%; background: #cbd5e1; }
.soon-item.done { border-color: #d7ecdf; background: #f7fdf9; }
.soon-item.done .dot { background: #22c55e; }

/* ============ 其他 ============ */
.note {
  background: #f7faff; border: 1px solid #e4edfc; color: #47617f;
  border-radius: 9px; padding: 10px 12px; font-size: 12px; line-height: 1.7;
}
.note b { color: #2456d8; }
.divider { height: 1px; background: var(--line); margin: 14px 0; }
.row-actions { display: flex; gap: 2px; justify-content: flex-end; white-space: nowrap; flex-wrap: nowrap; }
.row-actions .btn { flex: 0 0 auto; }
.text-muted { color: var(--muted); }
.text-danger { color: var(--danger); }
.text-ok { color: var(--ok); }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.nowrap { white-space: nowrap; }
.flex { display: flex; align-items: center; gap: 8px; }
.mt-2 { margin-top: 8px; }
.mt-3 { margin-top: 14px; }
.mb-2 { margin-bottom: 8px; }

/* ============ 单据打印格式窗 ============ */
.pf-bar { display: flex; align-items: center; gap: 6px; padding-bottom: 12px; border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.pf-tool { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 1px solid var(--line); background: #fff; border-radius: 8px; font-size: 12.5px; color: #334155; }
.pf-tool:hover { border-color: #b9cbe8; color: var(--primary); background: #fbfdff; }
.pf-tool svg { width: 14px; height: 14px; }
.pf-tabs { margin-left: auto; display: inline-flex; background: #f1f5fb; border-radius: 9px; padding: 3px; gap: 2px; }
.pf-tabs button { height: 26px; padding: 0 13px; border: 0; background: transparent; border-radius: 7px; font-size: 12.5px; color: #5a6a80; }
.pf-tabs button:hover { color: var(--primary); }
.pf-tabs button.on { background: #fff; color: var(--primary); font-weight: 600; box-shadow: 0 1px 2px rgba(15, 23, 42, .12); }
.pf-wrap { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.pf-table { width: 100%; border-collapse: collapse; }
.pf-table th { background: #f7f9fd; font-size: 12px; font-weight: 600; color: #4a5a72; text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.pf-table tbody tr { cursor: pointer; }
.pf-table tbody tr:hover td { background: #f7faff; }
.pf-table tbody tr.on td { background: #eaf1ff; }
.pf-table tbody tr.on td.nm { color: var(--primary); font-weight: 600; }
.pf-table tbody td { padding: 9px 12px; font-size: 13px; border-bottom: 1px solid #f0f4fa; }
.pf-table tbody tr:last-child td { border-bottom: 0; }
.pf-table td.idx { width: 56px; color: #8a97a8; font-variant-numeric: tabular-nums; }
.pf-table td.dsc { color: #6b7a90; font-size: 12.5px; }
.pf-badge { display: inline-block; font-size: 11px; line-height: 17px; padding: 0 7px; border-radius: 6px; background: #eef4ff; color: #2456d8; margin-right: 7px; }
.pf-badge.dot { background: #fff4e5; color: #b45309; }
.pf-opts { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; margin-top: 14px; }
.pf-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #46556b; cursor: pointer; }
.pf-check input { width: 14px; height: 14px; }
.pf-hint { margin-left: auto; font-size: 11.5px; color: var(--muted); }
.pf-more { border: 1px solid #dbe6f7; background: #f7faff; border-radius: 10px; padding: 12px 14px; margin-bottom: 12px; }
.pf-more-title { font-size: 12.5px; font-weight: 600; color: #23406e; margin-bottom: 6px; }
.pf-more-row { font-size: 12px; color: #4b5b72; line-height: 1.8; }
.pf-more-row b { color: #23406e; margin-right: 6px; }
.pf-typo-row { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; padding: 4px 2px 2px; }
.pf-typo-lab { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: #334155; }
.pf-typo-lab input[type="range"] { width: 150px; accent-color: #2563eb; }
.pf-typo-lab b { min-width: 44px; font-size: 12.5px; color: #1d4ed8; font-variant-numeric: tabular-nums; }
.pf-typo-hint { font-size: 11px; color: #64748b; flex: 1 1 240px; line-height: 1.6; }
.pf-foot { display: flex; align-items: center; gap: 8px; width: 100%; }
.pf-foot .btn { display: inline-flex; align-items: center; gap: 6px; }
.pf-foot .btn svg { width: 14px; height: 14px; }
.pf-foot-info { margin-right: auto; font-size: 12px; color: var(--muted); }
.pf-foot-info b { color: #334155; font-weight: 600; }
.pf-view-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.pf-vt { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.pf-vt b { font-weight: 600; }
.pf-vsub { font-size: 12px; color: var(--muted); margin-left: 4px; }
.pf-zoom { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; }
.pf-zbtn { width: 28px; height: 28px; border: 1px solid var(--line); background: #fff; border-radius: 7px; font-size: 14px; color: #46556b; line-height: 1; }
.pf-zbtn.wide { width: auto; padding: 0 10px; font-size: 12px; }
.pf-zbtn:hover { border-color: #b9cbe8; color: var(--primary); }
.pf-zval { min-width: 46px; text-align: center; font-size: 12px; color: #5a6a80; font-variant-numeric: tabular-nums; }

/* ============ 财务：门户入口 ============ */
.fin-group { display: flex; align-items: center; gap: 14px; padding: 18px 24px 12px; }
.fin-group .fg-line { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, #e2e8f2); }
.fin-group .fg-line:last-child { background: linear-gradient(90deg, #e2e8f2, transparent); }
.fin-group .fg-text { font-size: 12.5px; color: #5a6a80; white-space: nowrap; }
.fin-group .fg-text em { font-style: normal; color: #94a3b8; font-size: 11.5px; margin-left: 8px; }
.fin-tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; padding: 6px 24px 10px; }
.fin-tile {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px;
  padding: 14px 8px 12px; border-radius: 12px; border: 1px solid transparent;
  transition: .16s; cursor: pointer;
}
.fin-tile:hover { background: #f7faff; border-color: #e2edff; box-shadow: 0 8px 20px -16px rgba(15, 23, 42, .5); transform: translateY(-1px); }
.fin-tile .ft-ico {
  width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
  color: #fff; margin-bottom: 6px; box-shadow: 0 8px 16px -10px rgba(15, 23, 42, .5);
}
.fin-tile .ft-ico.blue { background: linear-gradient(140deg, #4b8bf5, #2456d8); }
.fin-tile .ft-ico.cyan { background: linear-gradient(140deg, #22c7d6, #0e9f9f); }
.fin-tile .ft-ico.amber { background: linear-gradient(140deg, #fbbf24, #f59e0b); }
.fin-tile .ft-ico.violet { background: linear-gradient(140deg, #a78bfa, #7c5cf0); }
.fin-tile .ft-ico.rose { background: linear-gradient(140deg, #fb7185, #e11d48); }
.fin-tile .ft-ico.slate { background: linear-gradient(140deg, #94a3b8, #64748b); }
.fin-tile b { font-size: 12.5px; font-weight: 600; color: #1e293b; line-height: 1.35; }
.fin-tile em { font-style: normal; font-size: 10.5px; color: #94a3b8; line-height: 1.4; }

/* 近 6 月对比柱图 */
.legend { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--muted); margin-left: 12px; }
.legend i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.legend .lg-a { background: #2456d8; }
.legend .lg-b { background: #f59e0b; }
.fin-chart { display: flex; align-items: flex-end; gap: 12px; height: 208px; padding: 8px 2px 0; }
.fc-col { flex: 1; display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: flex-end; gap: 6px; min-width: 0; }
.fc-bars { display: flex; align-items: flex-end; gap: 4px; height: 100%; width: 100%; justify-content: center; }
.fc-bars i { width: 14px; border-radius: 4px 4px 0 0; display: block; transition: .2s; }
.fc-bars .fc-a { background: linear-gradient(180deg, #5b8cf7, #2456d8); }
.fc-bars .fc-b { background: linear-gradient(180deg, #fcd34d, #f59e0b); }
.fc-bars .fc-c { background: linear-gradient(180deg, #34d399, #059669); }
.fc-label { font-size: 11px; color: var(--muted); white-space: nowrap; }
.fc-val { font-size: 9.5px; color: #94a3b8; white-space: nowrap; }

/* 账龄 */
.aging { display: flex; flex-direction: column; gap: 2px; }
.aging-row { display: flex; align-items: center; justify-content: space-between; padding: 10px 2px; border-bottom: 1px dashed #eef2f8; font-size: 12.5px; color: #475569; }
.aging-row:last-child { border-bottom: 0; }
.aging-row b { font-variant-numeric: tabular-nums; font-weight: 600; }

/* 类别占比条 */
.cat-row { margin-bottom: 12px; }
.cat-row:last-child { margin-bottom: 0; }
.cr-top { display: flex; justify-content: space-between; font-size: 12.5px; color: #475569; margin-bottom: 5px; }
.cr-top b { font-variant-numeric: tabular-nums; }
.cr-bar { height: 6px; border-radius: 6px; background: #eef2f9; overflow: hidden; }
.cr-bar i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #7aa6ff, #2456d8); }

/* 报表说明条 */
.fin-note { font-size: 11.5px; color: #7c8aa0; background: #f7faff; border: 1px solid #e8f0fe; border-radius: 8px; padding: 8px 12px; line-height: 1.7; }
.fin-note b { color: #2456d8; }

/* 分段筛选 */
.seg { display: inline-flex; background: #f1f5fb; border-radius: 9px; padding: 3px; gap: 2px; }
.seg button { height: 28px; padding: 0 12px; border: 0; background: transparent; border-radius: 7px; font-size: 12.5px; color: #5a6a80; }
.seg button:hover { color: var(--primary); }
.seg button.on { background: #fff; color: var(--primary); font-weight: 600; box-shadow: 0 1px 2px rgba(15, 23, 42, .12); }
.seg button i { font-style: normal; font-size: 10.5px; color: #94a3b8; margin-left: 3px; }
.seg button.on i { color: var(--primary); }

/* 财务表格列宽 */
.payables-table th:nth-child(1), .payables-table td:nth-child(1) { width: 158px; }
.payables-table th:nth-child(2), .payables-table td:nth-child(2) { width: 210px; }
.payables-table th:nth-child(3), .payables-table td:nth-child(3) { width: 112px; }
.payables-table th:nth-child(4), .payables-table td:nth-child(4) { width: 104px; }
.payables-table th:nth-child(5), .payables-table td:nth-child(5) { width: 128px; }
.payables-table th:nth-child(6), .payables-table td:nth-child(6) { width: 116px; }
.payables-table th:nth-child(7), .payables-table td:nth-child(7) { width: 100px; }
.payables-table td .sub-line { white-space: nowrap; }
.claims-table th:nth-child(2), .claims-table td:nth-child(2) { width: 100px; }
.claims-table th:nth-child(3), .claims-table td:nth-child(3) { width: 92px; white-space: nowrap; }
.payments-table th:nth-child(2), .payments-table td:nth-child(2) { width: 230px; }
.suppliers-table th:nth-child(2), .suppliers-table td:nth-child(2) { width: 240px; }
.payables-table th:nth-child(5), .payables-table td:nth-child(5),
.payables-table th:nth-child(6), .payables-table td:nth-child(6),
.payments-table th:nth-child(3), .payments-table td:nth-child(3),
.claims-table th:nth-child(5), .claims-table td:nth-child(5),
.ar-table th:nth-child(3), .ar-table td:nth-child(3) { white-space: nowrap; }
.payables-table tbody td, .claims-table tbody td, .payments-table tbody td { vertical-align: middle; }

/* ============ 财务：Excel 导入向导 ============ */
.imp-settings { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 14px; }
.imp-settings .span-2 { grid-column: span 2; }
.imp-drop {
  margin-top: 14px; border: 1.5px dashed #cfdcf1; border-radius: 12px; background: #fbfdff;
  padding: 20px; text-align: center; transition: .16s;
}
.imp-drop.over { border-color: var(--primary); background: #f2f7ff; }
.imp-drop-ico { width: 44px; height: 44px; border-radius: 12px; background: #eef4ff; color: var(--primary); display: grid; place-items: center; margin: 0 auto 8px; }
.imp-drop b { display: block; font-size: 13px; color: #334155; margin-bottom: 4px; }
.imp-drop span { font-size: 11.5px; color: var(--muted); }
.imp-file { margin-top: 8px; font-size: 11.5px; color: #475569; }
.imp-file b { display: inline; color: var(--primary); }
.imp-paste { margin-top: 12px; }
.imp-paste textarea { width: 100%; resize: vertical; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.6; }
.imp-map { margin-top: 16px; }
.imp-map-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; }
.imp-sum { margin-top: 10px; text-align: right; font-size: 12.5px; color: #475569; }
.imp-sum b { color: #334155; margin: 0 4px; }
.imp-sum b.accent { color: var(--primary); font-size: 15px; }

@media (max-width: 1180px) {
  .fin-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .imp-settings, .imp-map-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .fin-group { padding: 14px 14px 8px; flex-wrap: wrap; gap: 8px; }
  .fin-group .fg-text { white-space: normal; font-size: 12px; }
  .fin-group .fg-text em { display: block; margin: 2px 0 0; }
  .fin-group .fg-line { display: none; }
  .fin-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 6px 12px 10px; }
  .fin-chart { height: 168px; gap: 6px; }
  .fc-bars i { width: 9px; }
  .fc-val { display: none; }
  .imp-settings, .imp-map-grid { grid-template-columns: minmax(0, 1fr); }
  .imp-settings .span-2 { grid-column: span 1; }
  /* 手机端明细列较多，给表格保底宽度，横向滚动查看而不是把每列压成竖排 */
  .fees-table { min-width: 860px; }
  .claim-items { min-width: 720px; }
  .payables-table { min-width: 1180px; }
  .payments-table { min-width: 860px; }
  .claims-table { min-width: 840px; }
  .ar-table { min-width: 800px; }
  .ap-table { min-width: 660px; }
  .flow-table { min-width: 820px; }
  .suppliers-table { min-width: 880px; }
}

/* ============ 响应式 ============ */
@media (max-width: 1180px) {
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-2, .grid-main-side { grid-template-columns: minmax(0, 1fr); }
  .detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-grid.cols-3 .span-3 { grid-column: span 2; }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid .span-3 { grid-column: span 2; }
  .flow-main { flex-wrap: wrap; }
  .flow-arrow { display: none; }
  .flow-node { flex: 1 1 30%; }
}
@media (max-width: 900px) {
  :root { --sidebar-w: 0px; }
  .sidebar {
    position: fixed; left: 0; top: 0; width: 240px; transform: translateX(-102%);
    transition: transform .2s ease; box-shadow: 0 0 40px rgba(15, 23, 42, .25);
  }
  .sidebar.open { transform: none; }
  .mobile-only { display: grid; }
  .view { padding: 18px 14px 32px; }
  .topbar { padding: 0 14px; }
  .company-chip { display: none; }
  .page-head h1 { font-size: 19px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .form-grid .span-2, .form-grid .span-3 { grid-column: span 1; }
  .detail-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .kpi-grid { gap: 10px; }
  .kpi .kpi-value { font-size: 21px; }
  .soon-list { grid-template-columns: 1fr; }
  .modal-body { padding: 16px; }
  .search-box .input { width: 150px; }
}
@media (max-width: 560px) {
  .kpi-grid { grid-template-columns: minmax(0, 1fr); }
  .user-meta { display: none; }
  .detail-grid { grid-template-columns: minmax(0, 1fr); }
  .detail-grid.cols-3 { grid-template-columns: minmax(0, 1fr); }
  .detail-grid .span-2, .detail-grid .span-3,
  .detail-grid.cols-3 .span-2, .detail-grid.cols-3 .span-3 { grid-column: span 1; }
  .flow-main { flex-direction: column; align-items: stretch; }
  .flow-node { width: 100%; text-align: left; display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
  .flow-node .fn-icon { margin: 0; width: 36px; height: 36px; flex: 0 0 36px; }
  .flow-node .fn-title { font-size: 13px; }
  .flow-node .fn-meta { margin-top: 2px; }
  .flow-node .fn-badge { top: 50%; right: 12px; transform: translateY(-50%); }
}

@media (max-width: 760px) {
  .pf-table th:nth-child(1), .pf-table td:nth-child(1) { display: none; }
  .pf-table th:nth-child(3), .pf-table td:nth-child(3) { width: 56%; }
  .pf-table tbody td { padding: 9px 10px; }
  .pf-table th { padding: 8px 10px; }
  .pf-badge { margin-right: 4px; }
  .pf-bar { flex-wrap: wrap; gap: 8px; }
  .pf-tabs { margin-left: 0; width: 100%; overflow-x: auto; }
  .pf-hint { display: none; }
  .pf-opts { gap: 10px 16px; }
  .pf-foot { flex-wrap: wrap; }
  .pf-foot-info { width: 100%; margin: 0 0 4px; }
  .pf-foot .btn { flex: 1 1 auto; justify-content: center; }
  .pf-pages { padding: 10px; max-height: 56vh; }
}

/* ============ 登录 / 员工注册 ============ */
html.logged-out .shell { display: none; }
.login-screen {
  position: fixed; inset: 0; z-index: 900; display: flex; align-items: center; justify-content: center;
  padding: 24px; background: radial-gradient(1200px 600px at 12% 10%, #1e3a8a 0%, #0b1224 55%, #070b16 100%);
  overflow: auto; -webkit-overflow-scrolling: touch;
}
/* 卡片高度受视口约束，内容（尤其是员工注册）在右侧面板内滚动。
   margin:auto 代替纯 align-items:center —— 空间不够时会退化为 0，
   保证上方内容能被滚到，不会被居中裁掉半截。 */
.login-shell {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  grid-template-rows: minmax(0, 1fr);
  width: min(1080px, 100%); flex: 0 0 auto; margin: auto;
  min-height: min(600px, calc(100vh - 48px));
  min-height: min(600px, calc(100dvh - 48px));
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  background: #fff; border-radius: 22px; overflow: hidden;
  box-shadow: 0 40px 90px -40px rgba(2, 6, 23, .8);
}
.login-aside {
  position: relative; padding: 38px 36px; color: #e2e8f0;
  background: linear-gradient(150deg, #1d4ed8 0%, #0f2a66 55%, #0b1c3f 100%);
  display: flex; flex-direction: column; min-height: 0; overflow-y: auto; overflow-x: hidden;
}
.login-aside::after {
  content: ""; position: absolute; right: -80px; bottom: -60px; width: 260px; height: 260px;
  border-radius: 50%; background: radial-gradient(circle, rgba(56, 189, 248, .35), transparent 65%);
}
.login-brand { display: flex; align-items: center; gap: 12px; }
.login-brand .mark {
  width: 42px; height: 42px; border-radius: 12px; background: #fff; color: #1d4ed8;
  display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700;
}
.login-brand b { display: block; font-size: 18px; letter-spacing: .02em; }
.login-brand small { display: block; font-size: 11.5px; color: #b9c7e6; margin-top: 2px; }
.login-aside h1 { font-size: 28px; line-height: 1.4; margin: 42px 0 12px; letter-spacing: -.01em; }
.login-lead { font-size: 13px; color: #b9c7e6; line-height: 1.8; }
.login-points { list-style: none; padding: 0; margin: 26px 0 0; display: grid; gap: 12px; }
.login-points li { display: flex; gap: 10px; font-size: 12.5px; color: #dbe5f7; line-height: 1.6; }
.login-points i {
  flex: 0 0 20px; height: 20px; border-radius: 50%; font-style: normal; font-size: 11px;
  background: rgba(255, 255, 255, .16); display: flex; align-items: center; justify-content: center; font-weight: 600;
}
.login-foot { margin-top: auto; font-size: 11px; color: #93a6c9; line-height: 1.7; padding-top: 26px; }
.login-main { padding: 28px 34px 18px; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.login-card { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.login-tabs { flex: 0 0 auto; display: inline-flex; gap: 4px; background: #f1f5fb; border-radius: 10px; padding: 4px; align-self: flex-start; }
.login-tabs button {
  border: 0; background: transparent; height: 32px; padding: 0 18px; border-radius: 8px;
  font-size: 13px; color: #5a6a80;
}
.login-tabs button.on { background: #fff; color: var(--primary); font-weight: 600; box-shadow: 0 1px 3px rgba(15, 23, 42, .14); }
/* 注册表单很长：面板自身滚动，滚动条常驻，滚到底能看到提交按钮 */
.login-pane {
  padding-top: 22px; padding-right: 4px;
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden;
  overscroll-behavior: contain; scrollbar-gutter: stable;
}
.login-pane::-webkit-scrollbar { width: 8px; }
.login-pane::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
.login-pane::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.login-pane::-webkit-scrollbar-track { background: transparent; }
.login-pane h2 { font-size: 21px; letter-spacing: -.01em; }
.login-sub { font-size: 12.5px; color: var(--muted); margin: 6px 0 18px; }
.lg-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.lg-field { display: block; margin-bottom: 12px; }
.lg-field > span { display: block; font-size: 12px; color: #475569; margin-bottom: 6px; }
.lg-field em { color: var(--danger); font-style: normal; }
.lg-field input, .lg-field select {
  width: 100%; height: 42px; border: 1px solid var(--line-strong); border-radius: 10px;
  padding: 0 12px; background: #fff; outline: none; transition: border-color .15s, box-shadow .15s;
}
.lg-field input:focus, .lg-field select:focus { border-color: var(--primary-2); box-shadow: 0 0 0 3px rgba(59, 130, 246, .14); }
.lg-field.span-2 { grid-column: span 2; }
.lg-error { min-height: 18px; font-size: 12px; color: var(--danger); margin: 2px 0 6px; }
.lg-submit { width: 100%; height: 42px; justify-content: center; font-size: 14px; border-radius: 10px; }
.lg-hint { text-align: center; font-size: 12px; color: var(--muted); margin-top: 12px; }
.lg-hint a { color: var(--primary); font-weight: 600; }
.lg-keep {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: #475569; margin: -2px 0 6px; cursor: pointer; user-select: none;
}
.lg-keep input { width: 15px; height: 15px; accent-color: var(--primary); margin: 0; flex: 0 0 auto; }
.lg-device {
  font-size: 11.5px; color: #64748b; line-height: 1.6;
  background: #f6f8fb; border: 1px solid #e6ecf5; border-radius: 8px;
  padding: 7px 9px; margin-bottom: 8px;
}
.lg-device.warn { color: #b45309; background: #fffaf0; border-color: #f3d9a8; }
.lg-demo {
  margin-top: 16px; padding: 10px 12px; background: var(--surface-2); border: 1px dashed var(--line-strong);
  border-radius: 10px; font-size: 11.5px; color: var(--muted);
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px;
}
.lg-demo-i { white-space: nowrap; }
.lg-demo b { color: var(--ink-2); font-variant-numeric: tabular-nums; }
.lg-demo .btn { margin-left: auto; }
.lg-photo { margin: 6px 0 14px; }
.lg-photo-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.lg-photo-head span { font-size: 12px; color: #475569; }
.lg-photo-head small { font-size: 11px; color: var(--muted); }
.lg-photo-head .lg-psize {
  margin-left: auto; font-size: 10.5px; color: #0f766e;
  background: #e8f8f5; border: 1px solid #cdeee7; border-radius: 5px; padding: 1px 6px;
}
.lg-photo-note {
  font-size: 11.5px; line-height: 1.75; color: #4b5b70;
  background: #f6f9ff; border: 1px solid #e3ecfb; border-radius: 9px;
  padding: 9px 11px; margin: 2px 0 12px;
}
.lg-photo-note strong { color: #1f4ed8; font-weight: 600; }
.lg-photo-box {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 120px;
  border: 1px dashed var(--line-strong); border-radius: 12px; background: #fbfcfe; cursor: pointer; overflow: hidden;
}
.lg-photo-box:hover { border-color: var(--primary-2); background: var(--primary-soft); }
.lg-photo-empty { text-align: center; color: var(--muted); padding: 16px; }
.lg-photo-empty svg { color: #94a3b8; }
.lg-photo-empty b { display: block; font-size: 12.5px; color: var(--ink-2); margin: 6px 0 2px; }
.lg-photo-empty span { font-size: 11px; }
.lg-photo-box img { width: 100%; max-height: 220px; object-fit: contain; background: #0f172a; }
.login-copy { text-align: center; font-size: 11px; color: #94a3b8; padding-top: 14px; }

/* 顶栏用户菜单 */
.user.has-menu { position: relative; cursor: pointer; padding: 4px 8px 4px 4px; border-radius: 10px; }
.user.has-menu:hover { background: var(--surface-2); }
.user-caret { color: var(--muted); margin-left: 2px; }
.user-menu {
  position: absolute; right: 0; top: calc(100% + 8px); width: 190px; background: #fff; border: 1px solid var(--line);
  border-radius: 12px; box-shadow: 0 18px 40px -20px rgba(15, 23, 42, .5); padding: 6px; z-index: 700;
}
.user-menu[hidden] { display: none; }
.user-menu .um-head { padding: 8px 10px 9px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.user-menu .um-head b { display: block; font-size: 13px; }
.user-menu .um-head span { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.user-menu a, .user-menu button {
  display: flex; align-items: center; width: 100%; height: 32px; padding: 0 10px; border: 0; background: transparent;
  border-radius: 8px; font-size: 12.5px; color: var(--ink-2); text-align: left;
}
.user-menu a:hover, .user-menu button:hover { background: var(--surface-2); color: var(--primary); }
.user-menu button.danger { color: var(--danger); }
.user-menu button.danger:hover { background: var(--danger-soft); }
.um-dot {
  width: 6px; height: 6px; border-radius: 50%; background: #ef4444; margin-left: auto;
  box-shadow: 0 0 0 3px #fee2e2;
}
.avatar-img { padding: 0; overflow: hidden; background: #e2e8f0; }
.avatar-img img { width: 100%; height: 100%; object-fit: cover; }

/* ============ 办公：通用片段 ============ */
.emp-cell { display: flex; align-items: center; gap: 9px; }
.emp-cell > div { min-width: 0; }
.emp-cell b { display: block; font-weight: 550; font-size: 13px; }
.emp-cell span { display: block; font-size: 11px; color: var(--muted); margin-top: 1px; }
.mini-list { padding: 4px 0; }
.mini-row { display: flex; align-items: center; gap: 10px; padding: 10px 18px; border-bottom: 1px solid var(--line); }
.mini-row:last-child { border-bottom: 0; }
.mini-row:hover { background: #f8fbff; }
.mini-dot { width: 7px; height: 7px; border-radius: 50%; background: #ef4444; flex: 0 0 7px; }
.mini-dot.read { background: #cbd5e1; }
.mini-dot.doing { background: #f59e0b; }
.mini-main { min-width: 0; flex: 1; }
.mini-main b {
  display: block; font-size: 13px; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mini-main span { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.progress { height: 6px; background: #eef2f9; border-radius: 6px; overflow: hidden; margin-bottom: 4px; }
.progress i { display: block; height: 100%; background: linear-gradient(90deg, #38bdf8, #0e9f9f); border-radius: 6px; }
.progress-num { font-size: 10.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.text-warn { color: var(--warn); }
.link { color: var(--primary); font-size: 12px; }
.link:hover { text-decoration: underline; }
.textarea { min-height: 84px; padding: 9px 12px; line-height: 1.7; resize: vertical; }
.check-line { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2); }
.check-line input { width: 15px; height: 15px; accent-color: var(--primary); }
.clip { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.att-mine { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.am-item { background: var(--surface-2); border-radius: 10px; padding: 10px 12px; }
.am-item span { display: block; font-size: 11px; color: var(--muted); }
.am-item b { display: block; font-size: 15px; margin-top: 3px; font-variant-numeric: tabular-nums; }
.deny-ico {
  width: 56px; height: 56px; border-radius: 50%; margin: 0 auto 14px; background: var(--danger-soft);
  color: var(--danger); display: flex; align-items: center; justify-content: center;
}
.deny-perms {
  margin-top: 16px; padding: 14px 16px; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 10px;
}
.deny-perms .dp-title { font-size: 11.5px; color: var(--muted); margin-bottom: 8px; }
.deny-perms .dp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.deny-perms .dp-chip {
  font-size: 12px; font-weight: 550; color: #2456d8; background: var(--primary-soft);
  border-radius: 6px; padding: 4px 10px;
}
.deny-perms .dp-chip.mine { color: #17864a; background: #e8f8ef; }
.deny-perms .dp-meta { font-size: 11.5px; color: var(--muted); margin-top: 10px; }
.deny-note { font-size: 12.5px; color: var(--muted); line-height: 1.9; margin: 14px 0 0; text-align: center; }

/* ============ 办公：公告 ============ */
.ann-list { padding: 4px 0; }
.ann-item { display: flex; gap: 14px; padding: 16px 20px; border-top: 1px solid var(--line); cursor: pointer; }
.ann-item:first-child { border-top: 0; }
.ann-item:hover { background: #f8fbff; }
.ann-side { flex: 0 0 46px; padding-top: 2px; }
.ann-cat {
  display: inline-block; font-size: 11px; color: #475569; background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 6px; padding: 3px 6px;
}
.ann-pin-tag {
  display: inline-block; font-size: 11px; color: #b45309; background: var(--warn-soft);
  border-radius: 6px; padding: 3px 6px; border: 1px solid #fde3bd;
}
.ann-main { min-width: 0; flex: 1; }
.ann-title { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ann-new {
  font-size: 10px; font-weight: 600; color: #fff; background: #ef4444; border-radius: 5px; padding: 1px 5px;
}
.ann-meta { font-size: 11.5px; color: var(--muted); margin: 5px 0 6px; }
.ann-excerpt { font-size: 12.5px; color: #64748b; line-height: 1.7; }
.ann-go { align-self: center; font-size: 12px; color: var(--primary); display: flex; align-items: center; gap: 3px; flex: 0 0 auto; }
.ann-content { font-size: 13.5px; line-height: 2; color: var(--ink-2); white-space: pre-wrap; }
.ann-pin {
  display: inline-block; font-size: 11px; color: #b45309; background: var(--warn-soft);
  padding: 3px 8px; border-radius: 6px; margin-bottom: 12px;
}

/* ============ 办公：任务 / 汇报 ============ */
.tasks-table .sub-line { max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tasks-table, .staff-table, .cp-table, .salary-table { min-width: 1050px; }
.salary-table { min-width: 1240px; }
.salary-table tbody td, .att-table tbody td { vertical-align: middle; }
.salary-table .cell-input, .att-table .cell-input { width: 100%; min-width: 62px; }
.att-table { min-width: 1000px; }
.reports-table .clip { max-width: 320px; }
.report-block { margin-bottom: 16px; }
.report-block h4 { font-size: 12.5px; color: var(--primary); margin-bottom: 6px; }
.report-block p { font-size: 13px; line-height: 1.9; color: var(--ink-2); white-space: pre-wrap; margin: 0; }

/* ============ 办公：员工与权限 ============ */
.perm-tag {
  display: inline-block; font-size: 10.5px; color: #2456d8; background: var(--primary-soft);
  border-radius: 5px; padding: 2px 6px; margin: 2px 4px 2px 0;
}
.perm-block { margin-top: 6px; padding-top: 14px; border-top: 1px dashed var(--line-strong); }
.perm-title { font-size: 12px; color: #475569; margin-bottom: 8px; }
.perm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; }

/* ============ 员工自助 ============ */
.my-hero {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px; margin-bottom: 16px;
  background: linear-gradient(120deg, #1d4ed8, #0e7490); border-radius: var(--radius); color: #fff;
  box-shadow: 0 18px 40px -26px rgba(29, 78, 216, .9);
}
.my-hero.slim { padding: 16px 20px; }
.mh-left { display: flex; align-items: center; gap: 14px; }
.my-hero h1 { font-size: 20px; letter-spacing: -.01em; }
.my-hero h2 { font-size: 17px; }
.my-hero p { font-size: 12px; color: #cfe0ff; margin-top: 5px; }
.mh-right { display: flex; align-items: center; gap: 10px; }
.my-hero .btn { background: rgba(255, 255, 255, .16); color: #fff; border-color: rgba(255, 255, 255, .34); }
.my-hero .btn:hover { background: rgba(255, 255, 255, .26); }
.my-net { font-size: 24px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.my-hero .avatar { background: rgba(255, 255, 255, .22); color: #fff; }
.salary-mine, .my-claims, .my-sales { min-width: 980px; }
.profile-head { display: flex; align-items: center; gap: 14px; padding-bottom: 14px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.profile-head b { display: block; font-size: 16px; }
.profile-head span { display: block; font-size: 11.5px; color: var(--muted); margin-top: 3px; }
table.table.plain td { border: 0; padding: 7px 0; font-size: 12.5px; }
table.table.plain td:first-child { color: var(--muted); width: 132px; }
.profile-photo { width: 100%; max-height: 300px; object-fit: contain; border-radius: 12px; background: #0f172a; }
.profile-photo.empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  height: 170px; background: var(--surface-2); border: 1px dashed var(--line-strong); color: var(--muted); font-size: 12px;
}
.slip-table td { font-size: 13px; }
.slip-table .slip-net td { font-size: 16px; font-weight: 700; color: var(--primary); border-top: 2px solid var(--line-strong); }

/* ============ 登录与办公：响应式 ============ */
@media (max-width: 960px) {
  .login-shell { grid-template-columns: minmax(0, 1fr); }
  .login-aside { display: none; }
  .login-main { padding: 24px 22px 14px; }
  .perm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  /* 手机上不再限制卡片高度：整页滚动，注册表单一路滚到底 */
  .login-screen { padding: 0; align-items: flex-start; }
  .login-shell {
    border-radius: 0; width: 100%; margin: 0;
    min-height: 100%; max-height: none; grid-template-rows: auto;
  }
  .login-main { padding: 20px 18px 12px; overflow: visible; }
  .login-card { overflow: visible; }
  .login-pane { overflow: visible; flex: 0 0 auto; padding-right: 0; scrollbar-gutter: auto; }
  .lg-grid { grid-template-columns: minmax(0, 1fr); }
  .lg-field.span-2 { grid-column: span 1; }
  .login-pane h2 { font-size: 19px; }
  .my-hero { flex-direction: column; align-items: flex-start; }
  .mh-right { width: 100%; }
  .mh-right .btn { flex: 1; justify-content: center; }
  .my-hero h1 { font-size: 18px; }
  .ann-item { padding: 13px 14px; gap: 10px; }
  .ann-side { display: none; }
  .ann-go { display: none; }
  .perm-grid { grid-template-columns: minmax(0, 1fr); }
  .att-mine { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .user-caret { display: none; }
  .my-net { font-size: 20px; }
  /* 演示账号在窄屏改为逐行铺开，避免号码被折成两截 */
  .lg-demo { flex-direction: column; align-items: stretch; gap: 2px; line-height: 1.9; }
  .lg-demo .btn { margin-left: 0; margin-top: 6px; }
}

/* 办公表格：员工姓名不竖排，关键列给足宽度 */
.staff-table { min-width: 1220px; }
/* 操作列有四个按钮（编辑 / 重置密码 / 停用 / 删除），收紧内边距并给足列宽 */
.staff-table .row-actions .btn { padding: 0 6px; font-size: 11.5px; }
/* 操作列钉在右边：表格横向滚动时「删除 / 恢复」始终点得到 */
.staff-table th:last-child, .staff-table td:last-child {
  min-width: 212px; position: sticky; right: 0; z-index: 1;
  background: #fff; box-shadow: -8px 0 10px -8px rgba(15, 23, 42, .16);
}
.staff-table thead th:last-child { background: #f8fafd; z-index: 3; }
.staff-table tbody tr:hover td:last-child { background: #fafcff; }
.staff-table th:nth-child(7), .staff-table td:nth-child(7),
.staff-table th:nth-child(8), .staff-table td:nth-child(8) { white-space: nowrap; }
.emp-cell b, .emp-cell span { white-space: nowrap; }
.staff-table th:nth-child(1), .staff-table td:nth-child(1),
.salary-table th:nth-child(1), .salary-table td:nth-child(1),
.att-table th:nth-child(1), .att-table td:nth-child(1),
.cp-table th:nth-child(1), .cp-table td:nth-child(1),
.tasks-table th:nth-child(1), .tasks-table td:nth-child(1),
.reports-table th:nth-child(1), .reports-table td:nth-child(1),
.salary-mine th:nth-child(1), .salary-mine td:nth-child(1) { min-width: 148px; }
.salary-table th:last-child, .salary-table td:last-child { min-width: 148px; }
.salary-table th:nth-child(13), .salary-table td:nth-child(13),
.cp-table th:nth-child(10), .cp-table td:nth-child(10) { white-space: nowrap; min-width: 90px; }
.att-table th:nth-child(11), .att-table td:nth-child(11) { min-width: 200px; }
.salary-table { min-width: 1420px; }
.cp-table { min-width: 1080px; }
.att-table { min-width: 1080px; }
.salary-mine { min-width: 1180px; }

/* ============ 导航分组折叠 ============ */
.nav-group-head {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 6px 10px; margin: 0; border: 0; background: transparent; cursor: pointer;
  font-size: 10.5px; color: #94a3b8; letter-spacing: .1em; font-weight: 600;
  border-radius: 7px; text-align: left; font-family: inherit;
}
.nav-group-head:hover { color: var(--primary); background: #f5f8fd; }
.nav-group-head .nav-chev { margin-left: auto; opacity: .55; transition: transform .18s; }
.nav-group-head.closed .nav-chev { transform: rotate(-90deg); }
.nav-group-head .nav-dot {
  margin-left: auto; font-style: normal; font-size: 10px; padding: 1px 6px; border-radius: 20px;
  background: #eef2f7; color: #64748b; font-weight: 600;
}
.nav-group-head.closed .nav-chev { margin-left: 0; }
.nav-group-head.closed .nav-dot + .nav-chev { margin-left: 6px; }
.nav-group.collapsed { margin-bottom: 2px; }
/* 折叠状态下，当前页所在分组给个淡蓝提示，收起了也知道自己在哪 */
.nav-group.has-active > .nav-group-head { color: #3b5bdb; background: #f4f7ff; }
.nav-group.has-active > .nav-group-head .nav-chev { opacity: .9; }

/* ============ 采购管理 ============ */
.cg-table { min-width: 1040px; }
.cg-table th:nth-child(1), .cg-table td:nth-child(1) { width: 176px; }
.cg-table th:nth-child(2), .cg-table td:nth-child(2) { width: 230px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.kv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.kv-grid > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kv-grid > div.span-2 { grid-column: span 2; }
.kv-grid span { font-size: 11.5px; color: var(--muted); }
.kv-grid b { font-size: 13px; color: #1e293b; font-weight: 600; word-break: break-all; }
.amt-hero { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 12px;
  background: linear-gradient(140deg, #eef5ff, #f6fbff); border: 1px solid #dfeafc; }
.amt-hero span { font-size: 11.5px; color: #4b6a94; }
.amt-hero b { font-size: 25px; color: var(--primary); font-variant-numeric: tabular-nums; letter-spacing: -.5px; }
.form-actions {
  display: flex; align-items: center; justify-content: flex-end; gap: 10px;
  margin: 16px 0 28px; padding: 12px 14px; background: #fff;
  border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 24px -22px rgba(15, 23, 42, .6);
}
.form-actions .muted-text { margin-right: auto; }
.row-link { cursor: pointer; }
.row-link:hover { background: #f8fbff; }
.muted-row td { opacity: .62; }
.items-table td { padding-top: 6px; padding-bottom: 6px; }
.picker-empty { padding: 12px 10px; font-size: 12.5px; color: var(--muted); text-align: center; }
.chk { width: 15px; height: 15px; accent-color: var(--primary); cursor: pointer; }

/* ============ 可录入表格：让输入框看得出能填 ============ */
.editable-table .cell-input {
  border-color: #e3eaf4; background: #fff;
}
.editable-table .cell-input:hover { border-color: #b9cdea; }
.editable-table .cell-input:focus { border-color: #8bb0f5; box-shadow: 0 0 0 3px rgba(59, 130, 246, .12); }
.editable-table .cell-input:disabled { background: #f6f8fb; border-color: #e8edf4; }
.edit-hint {
  display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #2563eb;
  background: #eef5ff; border: 1px solid #dbe9fd; border-radius: 20px; padding: 3px 10px;
}
.edit-hint i { width: 6px; height: 6px; border-radius: 50%; background: #2563eb; display: inline-block; }

/* ============ Excel 导入预览 ============ */
.xls-preview { max-height: 300px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.xls-preview table { min-width: 900px; }
.xls-preview td, .xls-preview th { font-size: 11.5px; padding: 5px 7px; white-space: nowrap; }
.xls-sum { display: flex; flex-wrap: wrap; gap: 10px 20px; font-size: 12.5px; color: #334155; }
.xls-sum b { color: var(--primary); }

/* ============ 银行卡信息 ============ */
.bank-card {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px;
  background: linear-gradient(135deg, #1e3a8a, #2563eb 62%, #0ea5e9);
  color: #fff; box-shadow: 0 14px 30px -22px rgba(30, 58, 138, .9);
}
.bank-card .bc-main { min-width: 0; }
.bank-card small { font-size: 10.5px; opacity: .78; letter-spacing: .06em; }
.bank-card b { display: block; font-size: 15px; letter-spacing: 2px; margin: 3px 0; font-variant-numeric: tabular-nums; }
.bank-card em { font-style: normal; font-size: 11.5px; opacity: .9; }
.bank-card .bc-logo { width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.18);
  display: grid; place-items: center; font-size: 18px; flex: 0 0 38px; }
.bank-empty { font-size: 12.5px; color: var(--muted); padding: 10px 0; }

@media (max-width: 960px) {
  .grid-2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .kv-grid { grid-template-columns: minmax(0, 1fr); }
  .kv-grid > div.span-2 { grid-column: span 1; }
  .form-actions { flex-wrap: wrap; }
  .form-actions .muted-text { width: 100%; margin-right: 0; }
}

/* 工资表：15 列压缩到一屏，重点列不换行 */
.salary-table { min-width: 1210px; }
.salary-table th, .salary-table td { padding: 7px 6px; }
.salary-table .cell-input { min-width: 50px; padding: 0 4px; font-size: 12px; }
.salary-table th:nth-child(1), .salary-table td:nth-child(1) { width: 132px; }
.salary-table th:nth-child(13), .salary-table td:nth-child(13) { width: 108px; }
.salary-table th:nth-child(14), .salary-table td:nth-child(14) { width: 62px; }
.salary-table th:nth-child(15), .salary-table td:nth-child(15) { width: 132px; }
.salary-table .bank-cell b { font-size: 11.5px; white-space: nowrap; }
.salary-table .bank-cell .sub { font-size: 10px; color: var(--muted); white-space: normal; line-height: 1.35; }
.salary-table .row-actions { flex-wrap: nowrap; }
.salary-table .row-actions .btn { padding: 0 6px; }
.editable-table .cell-input { border-color: #ccdaea; }

/* 工资表：固定列宽，15 列压缩到一屏（1122px 容器内可完整显示） */
.salary-table { min-width: 1108px; table-layout: fixed; }
.salary-table th { white-space: normal; line-height: 1.25; font-size: 11.5px; font-weight: 600; }
.salary-table td { overflow: hidden; }
.salary-table .cell-input { min-width: 0; padding: 0 3px; font-size: 11.5px; }
.salary-table th:nth-child(1), .salary-table td:nth-child(1) { width: 118px; }
.salary-table th:nth-child(2), .salary-table td:nth-child(2),
.salary-table th:nth-child(3), .salary-table td:nth-child(3),
.salary-table th:nth-child(4), .salary-table td:nth-child(4),
.salary-table th:nth-child(6), .salary-table td:nth-child(6),
.salary-table th:nth-child(7), .salary-table td:nth-child(7) { width: 60px; }
/* 加班(小时) / 社保 两列表头与合计值较长，单独放宽 */
.salary-table th:nth-child(5), .salary-table td:nth-child(5) { width: 72px; }
.salary-table th:nth-child(8), .salary-table td:nth-child(8) { width: 78px; }
.salary-table th:nth-child(9), .salary-table td:nth-child(9) { width: 70px; }
.salary-table th:nth-child(10), .salary-table td:nth-child(10) { width: 68px; }
.salary-table th:nth-child(11), .salary-table td:nth-child(11) { width: 60px; }
.salary-table th:nth-child(12), .salary-table td:nth-child(12) { width: 82px; }
.salary-table th:nth-child(13), .salary-table td:nth-child(13) { width: 80px; }
.salary-table th:nth-child(14), .salary-table td:nth-child(14) { width: 56px; }
.salary-table th:nth-child(15), .salary-table td:nth-child(15) { width: 110px; }
.salary-table .emp-cell { gap: 7px; }
.salary-table .emp-cell span { white-space: normal; font-size: 10px; line-height: 1.3; }
.salary-table .row-actions { gap: 4px; }
.salary-table .row-actions .btn { padding: 0 5px; font-size: 11px; white-space: nowrap; }

/* 数字输入框：去掉步进箭头，窄列也能完整显示数值 */
.cell-input[type="number"]::-webkit-outer-spin-button,
.cell-input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cell-input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.salary-table .pill { white-space: nowrap; }
.salary-table .bank-cell .sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.salary-table .pill { padding: 1px 5px; font-size: 10.5px; }

/* 采购概览：最近采购单左宽右窄，四列在窄卡片内也能完整显示 */
.ov-split { grid-template-columns: 1.5fr 1fr; }
.ov-table { min-width: 0; }
.ov-table th:nth-child(1), .ov-table td:nth-child(1) { width: 126px; }
.ov-table th:nth-child(3), .ov-table td:nth-child(3) { width: 98px; }
.ov-table th:nth-child(4), .ov-table td:nth-child(4) { width: 76px; }
.ov-table td.sup { max-width: 190px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 980px) { .ov-split { grid-template-columns: 1fr; } }

/* ============ 工资：按天 / 计件两类 ============ */
.sal-seg { margin-left: 2px; }
.sal-seg button i { font-style: normal; font-size: 10.5px; opacity: .7; margin-left: 3px; }
.kpi-value small { font-weight: 500; color: #64748b; }

/* 个税：可手工覆盖，改过的格子浅黄底，一眼能看出不是自动算的 */
.tax-cell .cell-input { text-align: right; }
.tax-cell.tax-manual .cell-input { background: #fffaf0; border-color: #efc98b; color: #92400e; }

/* 计件表 13 列 */
.salary-table.sal-piece { min-width: 1122px; }
.salary-table.sal-piece th:nth-child(1), .salary-table.sal-piece td:nth-child(1) { width: 120px; }
.salary-table.sal-piece th:nth-child(2), .salary-table.sal-piece td:nth-child(2) { width: 190px; }
.salary-table.sal-piece th:nth-child(3), .salary-table.sal-piece td:nth-child(3) { width: 90px; }
.salary-table.sal-piece th:nth-child(4), .salary-table.sal-piece td:nth-child(4) { width: 62px; }
.salary-table.sal-piece th:nth-child(5), .salary-table.sal-piece td:nth-child(5) { width: 64px; }
.salary-table.sal-piece th:nth-child(6), .salary-table.sal-piece td:nth-child(6) { width: 82px; }
.salary-table.sal-piece th:nth-child(7), .salary-table.sal-piece td:nth-child(7) { width: 66px; }
.salary-table.sal-piece th:nth-child(8), .salary-table.sal-piece td:nth-child(8) { width: 64px; }
.salary-table.sal-piece th:nth-child(9), .salary-table.sal-piece td:nth-child(9) { width: 62px; }
.salary-table.sal-piece th:nth-child(10), .salary-table.sal-piece td:nth-child(10) { width: 82px; }
.salary-table.sal-piece th:nth-child(11), .salary-table.sal-piece td:nth-child(11) { width: 80px; }
.salary-table.sal-piece th:nth-child(12), .salary-table.sal-piece td:nth-child(12) { width: 56px; }
.salary-table.sal-piece th:nth-child(13), .salary-table.sal-piece td:nth-child(13) { width: 104px; }
.piece-cell .row-link { font-size: 12px; white-space: nowrap; }
.piece-cell .sub { margin-top: 2px; }

/* 计件明细弹窗 */
.piece-head, .piece-row { display: grid; grid-template-columns: 1.1fr 1.3fr 84px 92px 96px 34px; gap: 8px; align-items: center; }
.piece-head { font-size: 11.5px; color: var(--muted); padding-bottom: 6px; border-bottom: 1px dashed var(--line); margin-bottom: 10px; }
.piece-row { margin-bottom: 8px; }
.piece-row .input { height: 34px; }
.piece-row .piece-amt { font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; color: #0f172a; font-size: 12.5px; }
.piece-sum { font-size: 12.5px; color: #475569; }
.piece-sum b { color: var(--primary); font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .piece-head { display: none; }
  .piece-row { grid-template-columns: 1fr 1fr; }
  .piece-row .piece-amt { text-align: left; }
}

/* 我的工资：计件明细与计薪标签 */
.pay-type-cell .sub { font-size: 10.5px; color: var(--muted); margin-top: 2px; white-space: nowrap; }
.slip-piece-head { font-size: 12.5px; font-weight: 600; color: #334155; margin: 0 0 8px; }
.slip-piece th { font-size: 11.5px; font-weight: 600; color: var(--muted); background: #f7f9fc; }
.slip-piece td.mono { font-size: 12px; }

/* 计件型号按钮：用文字链样式，不要按钮边框 */
button.piece-link {
  background: none; border: 0; padding: 0; cursor: pointer; color: var(--primary);
  font: inherit; font-size: 12px; white-space: nowrap; text-align: left;
}
button.piece-link:hover { text-decoration: underline; }
button.piece-link b { font-variant-numeric: tabular-nums; }
/* 计件表：员工列放得下「部门 · 岗位」 */
.salary-table.sal-piece th:nth-child(1), .salary-table.sal-piece td:nth-child(1) { width: 136px; }
.salary-table.sal-piece th:nth-child(2), .salary-table.sal-piece td:nth-child(2) { width: 178px; }
.salary-table.sal-piece th:nth-child(3), .salary-table.sal-piece td:nth-child(3) { width: 84px; }
.salary-table.sal-piece th:nth-child(4), .salary-table.sal-piece td:nth-child(4) { width: 60px; }
.salary-table.sal-piece th:nth-child(13), .salary-table.sal-piece td:nth-child(13) { width: 108px; }
.piece-sum { margin-left: auto; text-align: right; }

/* ============ 车间生产 ============ */
/* 工序看板：四列对应四道工序 */
.kanban { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.kb-col { background: #f8fafc; border: 1px solid var(--line); border-radius: 10px; padding: 10px; min-height: 150px; }
.kb-head { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #0f172a; margin-bottom: 8px; }
.kb-head .kb-no {
  width: 18px; height: 18px; border-radius: 50%; font-style: normal; font-size: 10.5px; font-weight: 600;
  color: #fff; background: var(--kb, #64748b); display: flex; align-items: center; justify-content: center;
}
.kb-head b { font-weight: 600; }
.kb-head em { margin-left: auto; font-style: normal; font-size: 11px; color: #64748b; background: #e8eef7; border-radius: 20px; padding: 1px 7px; }
.kb-card {
  display: block; background: #fff; border: 1px solid #e2e8f4; border-radius: 8px; padding: 8px 9px;
  margin-bottom: 7px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s;
}
.kb-card:hover { border-color: var(--primary); box-shadow: 0 2px 8px rgba(15, 118, 110, .1); }
.kb-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.kb-top b { font-size: 12.5px; color: #0f172a; }
.kb-top .pill { font-size: 10px; padding: 1px 6px; }
.kb-sub { font-size: 10.5px; color: #94a3b8; margin: 3px 0 5px; font-variant-numeric: tabular-nums; }
.kb-foot { display: flex; justify-content: space-between; font-size: 11px; color: #475569; }
.kb-empty { font-size: 11.5px; color: #b0bccc; text-align: center; padding: 18px 0; }
.kb-done { font-size: 10.5px; color: #94a3b8; text-align: right; margin-top: 4px; border-top: 1px dashed #e2e8f4; padding-top: 6px; }

/* 仓库快照 */
.wh-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 0 16px 16px; }
.wh-card {
  display: block; text-decoration: none; color: inherit; border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; background: linear-gradient(180deg, #fbfdff, #f6f9fd); transition: border-color .15s, transform .15s;
}
.wh-card:hover { border-color: var(--primary); transform: translateY(-1px); }
.wh-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.wh-top b { font-size: 12.5px; color: #334155; }
.wh-warn { font-style: normal; font-size: 10.5px; color: #b45309; background: #fff5e6; border-radius: 20px; padding: 1px 6px; }
.wh-num { font-size: 21px; font-weight: 700; color: #0f172a; margin: 5px 0 2px; font-variant-numeric: tabular-nums; }
.wh-num small { font-size: 11px; font-weight: 500; color: #94a3b8; margin-left: 3px; }
.wh-foot { font-size: 11px; color: #94a3b8; }

/* 规格单元格 */
.spec-cell { line-height: 1.35; }
.spec-cell b { display: block; font-size: 12.5px; color: #0f172a; font-variant-numeric: tabular-nums; }
.spec-cell span { font-size: 11px; color: #94a3b8; }

/* 工单列表固定列宽 */
.ws-table { width: 100%; table-layout: fixed; }
.ws-table th:nth-child(1), .ws-table td:nth-child(1) { width: 17%; }
.ws-table th:nth-child(2), .ws-table td:nth-child(2) { width: 21%; }
.ws-table th:nth-child(3), .ws-table td:nth-child(3) { width: 7%; }
.ws-table th:nth-child(4), .ws-table td:nth-child(4) { width: 10%; }
.ws-table th:nth-child(5), .ws-table td:nth-child(5) { width: 11%; }
.ws-table th:nth-child(6), .ws-table td:nth-child(6) { width: 10%; }
.ws-table th:nth-child(7), .ws-table td:nth-child(7) { width: 11%; }
.ws-table th:nth-child(8), .ws-table td:nth-child(8) { width: 13%; }

/* 工序计件表：9 列，数字列等宽好对账 */
.ws-piece-tb { width: 100%; table-layout: fixed; }
.ws-piece-tb th:nth-child(1), .ws-piece-tb td:nth-child(1) { width: 20%; }
.ws-piece-tb th:nth-child(2), .ws-piece-tb td:nth-child(2),
.ws-piece-tb th:nth-child(3), .ws-piece-tb td:nth-child(3),
.ws-piece-tb th:nth-child(4), .ws-piece-tb td:nth-child(4),
.ws-piece-tb th:nth-child(5), .ws-piece-tb td:nth-child(5) { width: 8%; }
.ws-piece-tb th:nth-child(6), .ws-piece-tb td:nth-child(6) { width: 11%; }
.ws-piece-tb th:nth-child(7), .ws-piece-tb td:nth-child(7) { width: 8%; }
.ws-piece-tb th:nth-child(8), .ws-piece-tb td:nth-child(8) { width: 12%; }
.ws-piece-tb th:nth-child(9), .ws-piece-tb td:nth-child(9) { width: 17%; }
.ws-piece-tb td:nth-child(9) .row-actions { justify-content: flex-end; }

/* 工单详情：左右两栏 */
.ws-detail { grid-template-columns: 1.15fr .85fr; }
.ws-detail .kv-grid { grid-template-columns: repeat(2, 1fr); }

/* 工序进度条（横向四步） */
.flow { display: flex; align-items: center; gap: 0; }
.flow-i { flex: 1; text-align: center; position: relative; font-size: 11.5px; color: #94a3b8; }
.flow-i::before {
  content: ''; position: absolute; top: 13px; left: -50%; width: 100%; height: 2px; background: #e6ecf5; z-index: 0;
}
.flow-i:first-child::before { display: none; }
.flow-i.done::before, .flow-i.cur::before { background: #bfe3dd; }
.flow-i i {
  position: relative; z-index: 1; width: 27px; height: 27px; border-radius: 50%; margin: 0 auto 6px;
  display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 11.5px; font-weight: 600;
  background: #eef2f8; color: #94a3b8; border: 2px solid #e2e8f4;
}
.flow-i.done i { background: var(--c, #0e9f9f); border-color: var(--c, #0e9f9f); color: #fff; }
.flow-i.cur i { background: #fff; border-color: var(--c, #f59e0b); color: var(--c, #f59e0b); box-shadow: 0 0 0 3px rgba(245, 158, 11, .14); }
.flow-i.done span, .flow-i.cur span { color: #334155; font-weight: 600; }
.flow-i em { display: block; font-style: normal; font-size: 10.5px; color: var(--primary); font-variant-numeric: tabular-nums; margin-top: 2px; }

/* 工序录入卡片 */
.ws-steps { display: flex; flex-direction: column; gap: 10px; align-items: stretch; }
.st-card { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.st-card.cur { border-color: #f0b429; box-shadow: 0 0 0 3px rgba(245, 158, 11, .08); }
.st-card.done { background: #fbfdfd; border-color: #d8ebe7; }
.st-card.locked { background: #fafbfd; }
.st-head { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid #eef2f8; }
.st-card.locked .st-head { border-bottom: 0; }
.st-no {
  width: 20px; height: 20px; border-radius: 6px; font-size: 11px; font-weight: 700; color: #fff;
  background: var(--c, #64748b); display: flex; align-items: center; justify-content: center;
}
.st-head b { font-size: 13px; color: #0f172a; }
.st-amt { margin-left: auto; font-style: normal; font-size: 12.5px; font-weight: 600; color: var(--primary); font-variant-numeric: tabular-nums; }
.st-form { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; padding: 12px 14px 6px; }
.st-card[data-stepbox="plate"] .st-form { grid-template-columns: repeat(4, 1fr); }
.st-f label { display: block; font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.st-f .input, .st-f .select { height: 34px; font-size: 12.5px; }
.st-calc {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 14px 12px; font-size: 12px; color: #475569;
}
.st-calc b { font-variant-numeric: tabular-nums; color: #0f172a; }
.st-calc b.accent { color: var(--primary); }
.st-lock { font-size: 11px; color: #b0bccc; padding: 0 14px 12px; display: flex; align-items: center; gap: 4px; }
.st-done { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 16px; padding: 12px 14px; }
.st-done-row { display: flex; flex-direction: column; gap: 2px; }
.st-done-row span { font-size: 10.5px; color: #94a3b8; }
.st-done-row b { font-size: 12.5px; color: #0f172a; font-variant-numeric: tabular-nums; }
.st-done-row b.accent { color: var(--primary); }
.st-act { padding: 0 14px 12px; }

/* 仓库页签 */
.wh-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 12px; }
.wh-tab {
  border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 7px 13px; cursor: pointer;
  font-size: 12.5px; color: #475569; font-family: inherit; transition: all .15s;
}
.wh-tab em { font-style: normal; font-size: 10.5px; color: #94a3b8; margin-left: 5px; }
.wh-tab:hover { border-color: var(--primary); color: var(--primary); }
.wh-tab.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.wh-tab.on em { color: rgba(255, 255, 255, .78); }
.ws-wh-table { width: 100%; table-layout: fixed; }
.ws-wh-table th:nth-child(1), .ws-wh-table td:nth-child(1) { width: 17%; }
.ws-wh-table th:nth-child(2), .ws-wh-table td:nth-child(2) { width: 22%; }
.ws-wh-table th:nth-child(3), .ws-wh-table td:nth-child(3) { width: 13%; }
.ws-wh-table th:nth-child(4), .ws-wh-table td:nth-child(4) { width: 10%; }
.ws-wh-table th:nth-child(5), .ws-wh-table td:nth-child(5) { width: 8%; }
.ws-wh-table th:nth-child(6), .ws-wh-table td:nth-child(6) { width: 8%; }
.ws-wh-table th:nth-child(7), .ws-wh-table td:nth-child(7) { width: 10%; }
.ws-wh-table th:nth-child(8), .ws-wh-table td:nth-child(8) { width: 12%; }

/* 图表空月份 */
.bar.bar-zero { background: #e2e8f4; }

@media (max-width: 1100px) {
  .kanban { grid-template-columns: repeat(2, 1fr); }
  .ws-detail { grid-template-columns: 1fr; }
  .st-form, .st-card[data-stepbox="plate"] .st-form { grid-template-columns: repeat(2, 1fr); }
  .st-done { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
  .kanban { grid-template-columns: 1fr; }
  .wh-grid { grid-template-columns: 1fr; padding: 0 12px 12px; }
  .st-form, .st-card[data-stepbox="plate"] .st-form { grid-template-columns: 1fr; }
  .st-done { grid-template-columns: 1fr; }
}
/* 未开工工序：表单弱化，避免误以为能填 */
.st-card.locked .st-form { opacity: .55; }
.st-card.locked .st-form .input, .st-card.locked .st-form .select { pointer-events: none; background: #f4f6fa; }
/* 工单库存流水 */
.ws-flow-table { width: 100%; table-layout: fixed; }
.ws-flow-table th:nth-child(1), .ws-flow-table td:nth-child(1) { width: 16%; }
.ws-flow-table th:nth-child(2), .ws-flow-table td:nth-child(2) { width: 16%; }
.ws-flow-table th:nth-child(3), .ws-flow-table td:nth-child(3) { width: 34%; }
.ws-flow-table th:nth-child(4), .ws-flow-table td:nth-child(4) { width: 11%; }
.ws-flow-table th:nth-child(5), .ws-flow-table td:nth-child(5) { width: 13%; }
.ws-flow-table th:nth-child(6), .ws-flow-table td:nth-child(6) { width: 10%; }
/* 窄屏：车间表格保持可读宽度，容器内横向滚动 */
@media (max-width: 820px) {
  .ws-table, .ws-piece-tb, .ws-wh-table, .ws-flow-table { min-width: 700px; }
  .kb-foot { font-size: 10.5px; }
}

/* ============ 基础信息管理 ============ */
.bm-seg { flex-wrap: wrap; margin-bottom: 14px; background: #eef2fa; }
.bm-seg button { white-space: nowrap; }
.bm-seg button i { font-style: normal; font-size: 10.5px; color: #94a3b8; margin-left: 3px; }
.bm-seg button.on i { color: var(--primary); }
.bm-types { gap: 3px; }
.bm-table td { vertical-align: middle; }
.bm-table th:last-child, .bm-table td:last-child { white-space: nowrap; }
.bm-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12px; flex-wrap: wrap;
}
.bm-note {
  font-size: 12px; color: #5a6a80; background: #f7faff; border: 1px solid #e6eefc;
  border-radius: 9px; padding: 9px 13px; line-height: 1.75; margin-bottom: 14px;
}
.bm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.bm-mod {
  background: var(--surface); border: 1px solid var(--line); border-radius: 13px;
  padding: 15px 16px; display: flex; flex-direction: column; gap: 10px;
  box-shadow: var(--shadow-sm); min-height: 168px;
}
.bm-mod.danger { border-color: #f2d9d9; background: #fffbfb; }
.bm-mod-head { display: flex; gap: 10px; align-items: flex-start; }
.bm-mod-head b { display: block; font-size: 13.5px; }
.bm-mod-head span { display: block; font-size: 11.5px; color: var(--muted); line-height: 1.65; margin-top: 3px; }
.bm-mod-ico {
  width: 30px; height: 30px; border-radius: 9px; flex: 0 0 auto;
  background: var(--primary-soft); color: var(--primary); display: grid; place-items: center;
}
.bm-mod.danger .bm-mod-ico { background: var(--danger-soft); color: var(--danger); }
.bm-mod-body { display: flex; flex-direction: column; gap: 3px; }
.bm-mod-total { font-size: 22px; font-weight: 650; letter-spacing: -.02em; }
.bm-mod-total small { font-size: 11.5px; font-weight: 500; color: var(--muted); margin-left: 3px; }
.bm-mod-detail { font-size: 11.5px; color: #7c8aa0; line-height: 1.7; }
.bm-mod-foot { margin-top: auto; display: flex; justify-content: flex-end; }
.bm-whole {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 0; border-bottom: 1px dashed var(--line);
}
.bm-whole:last-child { border-bottom: 0; padding-bottom: 0; }
.bm-whole:first-child { padding-top: 0; }
.bm-whole b { display: block; font-size: 13px; }
.bm-whole span { display: block; font-size: 11.5px; color: var(--muted); line-height: 1.75; margin-top: 3px; max-width: 760px; }
.bm-whole button { flex: 0 0 auto; }
@media (max-width: 1180px) { .bm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .bm-grid { grid-template-columns: 1fr; }
  .bm-whole { flex-direction: column; align-items: flex-start; }
  .bm-whole button { width: 100%; }
  .bm-mod { min-height: 0; }
}
/* 窄屏：基础信息表格保持可读宽度，容器内横向滚动 */
@media (max-width: 860px) {
  .bm-table { min-width: 760px; }
  .bm-filters, .bm-foot { font-size: 11.5px; }
}

/* ============ 备份与恢复 ============ */
.bk-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.bk-stat {
  background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
  padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; box-shadow: var(--shadow-sm);
}
.bk-stat span { font-size: 11.5px; color: var(--muted); }
.bk-stat b { font-size: 18px; font-weight: 650; letter-spacing: -.01em; }
.bk-stat i { font-size: 11px; color: #8a97a8; font-style: normal; }
.bk-table td { vertical-align: middle; }
.bk-table td:first-child { white-space: nowrap; }
.bk-table .row-actions { justify-content: flex-end; flex-wrap: wrap; }
@media (max-width: 1000px) { .bk-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .bk-table { min-width: 820px; }
  .bk-stats { gap: 9px; }
  .bk-stat b { font-size: 16px; }
}
/* 备份卡片：窄屏下让副标题换行，避免标题被挤成竖排 */
@media (max-width: 860px) {
  .bk-card .card-head { flex-wrap: wrap; }
  .bk-card .card-head h3 { flex: 0 0 auto; white-space: nowrap; }
  .bk-card .card-head .sub { flex: 1 1 100%; order: 3; }
  .bk-card .card-head .right { margin-left: auto; }
}

/* ============ 录入守卫 · 重复录入提醒 ============ */
.gd-mask {
  position: fixed; inset: 0; background: rgba(15, 23, 42, .5); backdrop-filter: blur(2px);
  z-index: 160; display: flex; align-items: flex-start; justify-content: center;
  padding: 7vh 20px 20px; animation: fadeIn .16s ease;
}
.gd-modal {
  width: 760px; max-width: 100%; background: #fff; border-radius: 16px;
  box-shadow: 0 30px 70px -30px rgba(15, 23, 42, .6); animation: popIn .18s ease;
  max-height: 86vh; display: flex; flex-direction: column;
}
.gd-head { display: flex; gap: 12px; align-items: flex-start; padding: 18px 22px 14px; border-bottom: 1px solid var(--line); }
.gd-ico {
  width: 34px; height: 34px; flex: 0 0 auto; border-radius: 10px; background: var(--warn-soft);
  color: var(--warn); display: grid; place-items: center; font-weight: 700; font-size: 18px;
}
.gd-head h3 { font-size: 16px; font-weight: 600; }
.gd-head p { font-size: 12px; color: var(--muted); margin-top: 3px; }
.gd-x {
  margin-left: auto; border: none; background: #f5f7fb; color: #64748b;
  width: 28px; height: 28px; border-radius: 8px; font-size: 16px; line-height: 1;
}
.gd-x:hover { background: #eef2f9; color: var(--ink); }
.gd-body { padding: 16px 22px; overflow: auto; }
.gd-table { font-size: 12.5px; }
.gd-table thead th { background: #fafcff; font-size: 11.5px; color: var(--muted); font-weight: 600; }
.gd-table td { padding: 6px 8px; }
.gd-more { margin-top: 8px; font-size: 11.5px; color: var(--muted); }
.gd-foot { padding: 14px 22px; border-top: 1px solid var(--line); display: flex; justify-content: flex-end; gap: 8px; background: #fcfdff; border-radius: 0 0 16px 16px; }
.btn.warn { background: var(--warn); border-color: var(--warn); color: #fff; box-shadow: 0 6px 14px -8px rgba(180, 83, 9, .8); }
.btn.warn:hover { background: #92400e; color: #fff; }

/* ============ 录入守卫 · 历史价格参考 ============ */
.hist-row > td {
  padding: 0 !important; background: #f7fafd !important;
  border-bottom: 1px solid var(--line-strong) !important;
}
.hist-panel { padding: 8px 12px 10px; font-size: 12px; }
.hist-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; color: var(--ink-2); }
.hist-head b { font-weight: 600; font-size: 12px; }
.hist-sub { color: var(--muted); font-size: 11.5px; }
.hist-close {
  margin-left: auto; border: 1px solid var(--line); background: #fff; color: var(--muted);
  border-radius: 6px; font-size: 11px; padding: 1px 8px; line-height: 1.6;
}
.hist-close:hover { color: var(--primary); border-color: var(--primary-2); }
.hist-list { display: flex; flex-wrap: wrap; gap: 6px; }
.hist-item {
  display: inline-flex; align-items: center; gap: 7px; background: #fff;
  border: 1px solid var(--line); border-radius: 8px; padding: 3px 8px;
}
.hist-item .h-date { color: #64748b; font-variant-numeric: tabular-nums; }
.hist-item .h-no { color: #a6b0be; font-size: 11px; }
.hist-item .h-party { color: #475569; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hist-item .h-q { color: #94a3b8; font-size: 11px; }
.hist-item b { color: var(--ink); font-weight: 600; }
.hist-foot { margin-top: 6px; color: #475569; font-size: 11.5px; }
.hist-foot .h-up { color: var(--danger); font-weight: 600; }
.hist-foot .h-down { color: var(--ok); font-weight: 600; }
.hist-foot .h-flat { color: var(--muted); }
.hist-toggle {
  border: 1px solid var(--line-strong); background: #fff; color: #64748b;
  border-radius: 6px; font-size: 10.5px; padding: 1px 6px; line-height: 1.6; white-space: nowrap;
}
.hist-toggle:hover { color: var(--primary); border-color: var(--primary-2); }
.hist-toggle.on { background: var(--primary-soft); color: var(--primary); border-color: #c7d7fb; }
.base-hist { cursor: pointer; text-decoration: underline dotted #b6c2d4; text-underline-offset: 2px; }
.base-hist:hover { color: var(--primary); }
@media (max-width: 860px) {
  .gd-modal { border-radius: 14px; }
  .gd-body { padding: 12px 14px; }
  .gd-table { min-width: 560px; }
  .gd-foot { padding: 12px 14px; }
  .hist-item .h-party { max-width: 110px; }
}
/* 重复提醒：窄屏改用列表卡片，避免表格挤压 */
.gd-list { display: none; }
@media (max-width: 640px) {
  .gd-table-wrap { display: none; }
  .gd-list { display: block; }
  .gd-li { padding: 9px 2px; border-bottom: 1px solid #eef3f9; }
  .gd-li:last-child { border-bottom: none; }
  .gd-li-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
  .gd-li-top b { font-size: 12.5px; font-weight: 600; }
  .gd-li-top .amt { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .gd-li-sub { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; font-size: 11px; color: var(--muted); }
}

/* ============ 公司资料库 ============ */
.dl-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.dl-cats { flex-wrap: wrap; }
.dl-kw { margin-left: auto; }
.dl-kw .input { width: 232px; }
.dl-tip { font-size: 12px; color: var(--muted); margin-bottom: 12px; line-height: 1.8; }
.link-btn {
  border: none; background: none; padding: 0 2px; color: var(--primary);
  font-size: 12px; text-decoration: underline; text-underline-offset: 2px;
}
.dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(286px, 1fr)); gap: 12px; }
.dl-card {
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 15px; display: flex; flex-direction: column; gap: 8px;
  transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.dl-card:hover { border-color: #c3d4f4; box-shadow: 0 12px 26px -20px rgba(15, 23, 42, .5); transform: translateY(-1px); }
.dl-card.hot { border-color: #f3d7bd; }
.dl-card-top { display: flex; gap: 10px; align-items: flex-start; }
.dl-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: 0 0 auto; }
.dl-ico.contract { background: #eef4ff; color: #2456d8; }
.dl-ico.rule { background: #e8f7ef; color: #147a45; }
.dl-ico.form { background: #fef3e2; color: #b45309; }
.dl-ico.guide { background: #e2f7f6; color: #0b7c74; }
.dl-card-title { min-width: 0; flex: 1; }
.dl-card-title b { font-size: 13.5px; font-weight: 600; display: block; line-height: 1.4; }
.dl-card-title span { display: block; font-size: 11px; color: var(--muted); margin-top: 3px; }
.dl-card-desc { font-size: 12px; color: #5b6b80; line-height: 1.7; flex: 1; }
.dl-card-foot { display: flex; gap: 6px; }

/* 上传区 */
.dl-upload {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  border: 1.5px dashed #c7d2e3; border-radius: 12px; padding: 15px 16px; background: #fbfdff;
  transition: border-color .14s ease, background .14s ease;
}
.dl-upload.drag { border-color: var(--primary); background: #f2f7ff; }
.dl-upload.off { opacity: .72; }
.dlu-left { display: flex; gap: 12px; align-items: center; flex: 1 1 320px; min-width: 0; }
.dlu-ico { width: 44px; height: 44px; border-radius: 12px; background: var(--primary-soft); color: var(--primary); display: grid; place-items: center; flex: 0 0 auto; }
.dlu-left b { display: block; font-size: 13px; font-weight: 600; }
.dlu-left span { display: block; font-size: 11.5px; color: var(--muted); margin-top: 3px; line-height: 1.6; }
.dlu-right { margin-left: auto; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dl-up-list { flex: 1 1 100%; display: flex; flex-direction: column; gap: 7px; border-top: 1px dashed var(--line); padding-top: 9px; }
.dlu-line { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #334155; }
.dlu-name { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dlu-bar { width: 150px; height: 6px; background: #eef2f8; border-radius: 4px; overflow: hidden; flex: 0 0 auto; }
.dlu-bar i { display: block; height: 100%; width: 0; background: var(--primary); transition: width .18s ease; }
.dlu-pct { width: 40px; text-align: right; color: var(--muted); font-variant-numeric: tabular-nums; }
.dlu-line.ok .dlu-bar i { background: var(--ok); }
.dlu-line.ok .dlu-pct { color: var(--ok); }
.dlu-line.err .dlu-pct { color: var(--danger); }

/* 文件表 */
.dl-file { display: flex; gap: 10px; align-items: center; min-width: 0; }
.dl-fico {
  width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center;
  font-size: 9.5px; font-weight: 700; letter-spacing: .2px; flex: 0 0 auto;
}
.dl-fico.danger { background: var(--danger-soft); color: #c62828; }
.dl-fico.info { background: #eef4ff; color: #2456d8; }
.dl-fico.ok { background: var(--ok-soft); color: #147a45; }
.dl-fico.warn { background: var(--warn-soft); color: #b45309; }
.dl-fico.purple { background: #f3edff; color: #7c3aed; }
.dl-fico.muted { background: #f1f5f9; color: #64748b; }
.dl-fmeta { min-width: 0; }
.dl-fmeta b { display: block; font-size: 12.5px; font-weight: 600; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-fmeta span { display: block; font-size: 11px; color: var(--muted); max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-count { padding: 10px 16px; font-size: 11.5px; color: var(--muted); border-top: 1px solid var(--line); }

/* 模板预览弹窗 */
.doc-pv { display: grid; grid-template-columns: 292px minmax(0, 1fr); gap: 16px; align-items: start; }
.doc-pv-side { align-self: start; }
.dps-title { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.dps-desc { font-size: 11.5px; color: var(--muted); line-height: 1.7; margin-bottom: 12px; }
.dps-fields { display: flex; flex-direction: column; gap: 10px; }
.dps-fields .field label { font-size: 11.5px; color: #475569; margin-bottom: 4px; display: block; }
.dps-fields .input { width: 100%; }
.dps-hint { margin-top: 12px; font-size: 11px; color: var(--muted); line-height: 1.8; background: #f8fafd; border-radius: 8px; padding: 9px 11px; }
.dps-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.dps-actions .btn { width: 100%; }
.doc-paper {
  background: #fff; border: 1px solid var(--line); border-radius: 8px;
  padding: 28px 32px; max-height: 64vh; overflow: auto;
  box-shadow: 0 14px 30px -26px rgba(15, 23, 42, .55);
}
.doc-sheet { font-family: "Microsoft YaHei", "PingFang SC", SimSun, serif; color: #111; font-size: 13px; line-height: 1.95; }
.doc-sheet .doc-hd { text-align: center; margin: 0 0 14px; }
.doc-sheet .doc-hd h1 { font-size: 21px; letter-spacing: 3px; font-weight: 700; }
.doc-sheet .doc-sub { font-size: 11.5px; color: #555; margin-top: 5px; letter-spacing: .5px; }
.doc-sheet h2 { font-size: 13.5px; font-weight: 700; margin: 15px 0 5px; letter-spacing: .5px; }
.doc-sheet p { margin: 4px 0; text-align: justify; }
.doc-sheet ol.doc-ol { margin: 4px 0 4px 20px; padding: 0; }
.doc-sheet ol.doc-ol li { margin: 2px 0; text-align: justify; }
.doc-sheet .doc-u { text-decoration: underline; text-underline-offset: 3px; color: #111; white-space: pre; }
.doc-sheet table { width: 100%; border-collapse: collapse; font-size: 12px; margin: 6px 0; }
.doc-sheet th, .doc-sheet td { border: 1px solid #444; padding: 4px 6px; vertical-align: middle; text-align: left; }
.doc-sheet table.doc-grid th, .doc-sheet table.doc-form th { background: #f2f4f7; font-weight: 600; }
.doc-sheet td.c { text-align: center; }
.doc-sheet td.b { text-align: right; font-weight: 600; }
.doc-sheet table.doc-grid tbody tr { height: 26px; }
.doc-sheet table.doc-grid.sm { font-size: 11.5px; }
.doc-sheet .doc-kv td.k { width: 104px; background: #f2f4f7; font-weight: 600; white-space: nowrap; }
.doc-sheet .tallish { height: 64px; vertical-align: top; }
.doc-sheet table.approve tr.tall td { height: 56px; }
.doc-sheet table.approve tr.date td { height: 24px; font-size: 11px; color: #444; border-top: none; }
.doc-sheet .doc-chk { display: inline-block; margin-right: 14px; white-space: nowrap; }
.doc-sheet .nw { white-space: nowrap; }
.doc-sheet .doc-sign { display: flex; gap: 40px; margin-top: 26px; font-size: 12px; }
.doc-sheet .doc-sign-col { flex: 1; }
.doc-sheet .doc-sign-col b { display: block; margin-bottom: 8px; font-weight: 600; }
.doc-sheet .doc-sign-line { margin: 6px 0 4px; }
.doc-sheet .doc-sign2 { margin-top: 30px; font-size: 12px; }
.doc-sheet .doc-no-r { text-align: right; font-size: 11.5px; margin: -6px 0 6px; }
.doc-sheet .doc-tip { margin-top: 12px; font-size: 11px; color: #555; border-top: 1px dashed #bbb; padding-top: 6px; line-height: 1.7; }
.doc-sheet .doc-attach { margin-top: 14px; font-size: 11.5px; color: #333; }
.doc-sheet .doc-co { margin-top: 8px; font-size: 11px; color: #444; line-height: 1.7; }
.doc-sheet .doc-foot { margin-top: 16px; border-top: 1px solid #ccc; padding-top: 5px; font-size: 10.5px; color: #666; text-align: center; }

/* 文件在线预览 */
.dl-pv-pdf { width: 100%; height: 62vh; border: 1px solid var(--line); border-radius: 8px; background: #f8fafc; }
.dl-pv-img { text-align: center; background: #f8fafc; border-radius: 8px; padding: 10px; }
.dl-pv-img img { max-width: 100%; max-height: 60vh; }

.dl-fmeta-sub { display: none; font-size: 11px; color: var(--muted); }

/* 窄屏：文件列表改成卡片式一行一块，操作按钮不再横向滚动 */
@media (max-width: 640px) {
  .dl-table thead { display: none; }
  .dl-table, .dl-table tbody, .dl-table tr, .dl-table td { display: block; width: 100%; }
  .dl-table tr { padding: 11px 14px; border-bottom: 1px solid var(--line); }
  .dl-table tr:last-child { border-bottom: none; }
  .dl-table td { border: none !important; padding: 0 !important; }
  .dl-table td:nth-child(2), .dl-table td:nth-child(3),
  .dl-table td:nth-child(4), .dl-table td:nth-child(5) { display: none; }
  .dl-table td:last-child { margin-top: 9px; }
  .dl-table .row-actions { justify-content: flex-start; gap: 6px; }
  .dl-table .dl-fmeta b, .dl-table .dl-fmeta span { max-width: none; }
  .dl-fmeta-sub { display: block; margin-top: 3px; }
  .dl-count { padding: 10px 14px; }
}

@media (max-width: 780px) {
  .doc-pv { grid-template-columns: minmax(0, 1fr); }
  .doc-paper { max-height: none; padding: 18px 16px; }
  .dps-actions { flex-direction: row; }
  .dps-actions .btn { width: auto; flex: 1; }
  .dl-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
  .dlu-right { margin-left: 0; width: 100%; }
  .dl-kw { margin-left: 0; width: 100%; }
  .dl-kw .input { width: 100%; }
  .dl-fmeta b, .dl-fmeta span { max-width: 180px; }
  .dlu-bar { width: 90px; }
}

/* ============ 使用指引（按权限生成） ============ */
.gd-banner {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: linear-gradient(135deg, #eef4ff, #f3fbff 60%, #ffffff);
  border: 1px solid #dbe7fb; border-radius: var(--radius);
  padding: 14px 16px; margin-bottom: 16px;
}
.gd-b-icon {
  width: 36px; height: 36px; flex: 0 0 36px; border-radius: 10px;
  background: linear-gradient(135deg, #2f6bff, #14b8c4); color: #fff;
  display: grid; place-items: center;
  box-shadow: 0 8px 16px -10px rgba(36, 86, 216, .9);
}
.gd-b-text { min-width: 0; flex: 1; }
.gd-b-text b { display: block; font-size: 13.5px; }
.gd-b-text span { display: block; font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.gd-b-act { display: flex; gap: 6px; flex-wrap: wrap; }
.gd-b-act [data-gdbanner] { color: #8a98ad; }

.gd-wiz-top { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.gd-wiz-top > span { font-size: 11.5px; color: var(--muted); margin-left: auto; }
.gd-dots { display: flex; align-items: center; gap: 5px; }
.gd-dots i { width: 22px; height: 4px; border-radius: 3px; background: #e3eaf5; display: block; }
.gd-dots i.on { background: var(--primary); }

.gd-hero { display: flex; align-items: center; gap: 13px; }
.gd-ava {
  width: 50px; height: 50px; flex: 0 0 50px; border-radius: 50%;
  background: linear-gradient(135deg, #dbe7ff, #e6fbff); color: #1f4ed8;
  display: grid; place-items: center; font-size: 20px; font-weight: 700;
  border: 1px solid #d2e2ff;
}
.gd-hero-main h2 { font-size: 17px; font-weight: 650; letter-spacing: -.01em; }
.gd-hero-main p { font-size: 12px; color: var(--muted); margin-top: 4px; }

.gd-chip {
  display: inline-flex; align-items: center; gap: 5px;
  height: 26px; padding: 0 10px; border-radius: 7px;
  font-size: 11.5px; font-weight: 500; background: #f3f6fb; color: #475569;
  border: 1px solid #e6ecf5;
}
.gd-chip svg { opacity: .8; }
.gd-chip.t-blue { background: #eaf1ff; color: #1f4ed8; border-color: #dbe7ff; }
.gd-chip.t-violet { background: #f3edff; color: #6d28d9; border-color: #e9dfff; }
.gd-chip.t-teal { background: #e6f8f8; color: #0b7f7f; border-color: #d3f0f0; }
.gd-chip.t-amber { background: #fff5e6; color: #a75c00; border-color: #fbe7c6; }
.gd-chip.t-rose { background: #fdeef1; color: #be123c; border-color: #fbdde4; }
.gd-chip.t-cyan { background: #e8f7fd; color: #0e7490; border-color: #d5eef8; }
.gd-chip.t-slate { background: #f1f5f9; color: #475569; border-color: #e5eaf3; }
.gd-chip.t-off { background: #f8fafc; color: #94a3b8; border-color: #e8edf5; text-decoration: line-through; }
.gd-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gd-chips-top { margin: 0 0 14px; }

.gd-sec { margin-top: 18px; }
.gd-sec-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 9px; }
.gd-sec-head b { font-size: 13.5px; font-weight: 650; }
.gd-sec-head span { font-size: 11.5px; color: var(--muted); }
.gd-sub { margin-bottom: 12px; }
.gd-sub-t { display: inline-block; font-size: 11px; color: #64748b; background: #f1f5f9; border-radius: 5px; padding: 2px 7px; margin-bottom: 6px; }

.gd-note {
  display: flex; align-items: flex-start; gap: 7px;
  margin-top: 14px; padding: 10px 12px; border-radius: 9px;
  background: #f6f9ff; border: 1px solid #e3ecfb; color: #3d4d66;
  font-size: 11.5px; line-height: 1.7;
}
.gd-note svg { flex: 0 0 13px; margin-top: 2px; opacity: .7; }

.gd-change {
  margin-top: 14px; padding: 12px 14px; border-radius: 10px;
  background: #f0fdf7; border: 1px solid #c9efdb;
}
.gd-change b { font-size: 13px; color: #147a45; }
.gd-change p { font-size: 11.5px; color: #3f6152; margin-top: 8px; line-height: 1.7; }

.gd-progress { display: flex; align-items: center; gap: 10px; }
.gd-prog-wrap { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 4px; }
.gd-prog-hint { font-size: 11px; color: var(--muted); }
.gd-bar { flex: 1; min-width: 90px; height: 6px; border-radius: 4px; background: #e9eef7; overflow: hidden; }
.gd-bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #2f6bff, #14b8c4); transition: width .25s; }
.gd-progress > span { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.gd-progress > span b { color: var(--ink); font-size: 13px; }

.gd-list { display: flex; flex-direction: column; gap: 8px; }
.gd-row {
  display: flex; gap: 10px; padding: 11px 12px;
  border: 1px solid var(--line); border-radius: 10px; background: #fff;
  transition: border-color .15s, background .15s;
}
.gd-row:hover { border-color: #cfdcf3; }
.gd-row.done { background: #fbfdfc; border-color: #e2efe8; }
.gd-tick { position: relative; flex: 0 0 18px; padding-top: 2px; cursor: pointer; }
.gd-tick input { position: absolute; opacity: 0; width: 18px; height: 18px; margin: 0; cursor: pointer; }
.gd-box {
  width: 18px; height: 18px; border-radius: 5px; border: 1.5px solid #cbd5e1;
  display: grid; place-items: center; color: #fff; background: #fff;
  transition: background .15s, border-color .15s;
}
.gd-box svg { opacity: 0; }
.gd-tick input:checked + .gd-box { background: var(--ok); border-color: var(--ok); }
.gd-tick input:checked + .gd-box svg { opacity: 1; }
.gd-tick input:focus-visible + .gd-box { box-shadow: 0 0 0 3px #dbe7ff; }
.gd-row-main { min-width: 0; flex: 1; }
.gd-row-title { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.gd-row-title b { font-size: 13px; font-weight: 600; }
.gd-row.done .gd-row-title b { color: #7c8a9e; }
.gd-phase { font-size: 10px; padding: 1px 5px; border-radius: 4px; border: 1px solid #e2e8f2; color: #64748b; background: #f8fafc; }
.gd-phase.p1 { background: #fff5e6; border-color: #fbe7c6; color: #a75c00; }
.gd-phase.p2 { background: #eef4ff; border-color: #dbe7ff; color: #1f4ed8; }
.gd-phase.p3 { background: #f1f5f9; border-color: #e2e8f2; color: #64748b; }
.gd-go {
  margin-left: auto; font-size: 11.5px; color: var(--primary);
  display: inline-flex; align-items: center; gap: 3px; white-space: nowrap;
}
.gd-go:hover { text-decoration: underline; }
.gd-why { font-size: 11.5px; color: #5c6b80; line-height: 1.7; margin-top: 4px; }
.gd-how { margin: 7px 0 0; padding-left: 18px; font-size: 11.8px; line-height: 1.85; color: #334155; }
.gd-how li { margin-bottom: 1px; }
.gd-how li::marker { color: #94a3b8; }
.gd-tip {
  display: flex; align-items: flex-start; gap: 5px; margin-top: 7px;
  font-size: 11px; color: #8a5a00; background: #fffaef; border: 1px solid #f6e9cf;
  border-radius: 6px; padding: 5px 8px; line-height: 1.65;
}
.gd-tip svg { flex: 0 0 12px; margin-top: 2px; }
.gd-det { margin-top: 7px; }
.gd-det > summary {
  font-size: 11.5px; color: var(--primary); cursor: pointer; list-style: none;
  display: inline-flex; align-items: center; gap: 4px;
}
.gd-det > summary::-webkit-details-marker { display: none; }
.gd-det > summary::before { content: '▸'; font-size: 10px; }
.gd-det[open] > summary::before { content: '▾'; }
.gd-det[open] > summary { margin-bottom: 4px; }

.gd-tips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.gd-tipcard { border: 1px solid var(--line); border-radius: 10px; padding: 11px 12px; background: #fcfdff; }
.gd-tipcard b { font-size: 12.5px; }
.gd-tipcard p { font-size: 11.2px; color: var(--muted); line-height: 1.7; margin-top: 4px; }
.gd-quicks { display: flex; flex-wrap: wrap; gap: 8px; }
.gd-quick {
  display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px;
  border: 1px solid var(--line-strong); border-radius: 8px; font-size: 12px; background: #fff;
}
.gd-quick:hover { border-color: #b9cbe8; color: var(--primary); }
.gd-done-box {
  display: flex; align-items: flex-start; gap: 10px; margin-top: 18px;
  padding: 13px 14px; border-radius: 10px; background: #f0fdf7; border: 1px solid #c9efdb; color: #147a45;
}
.gd-done-box svg { flex: 0 0 18px; margin-top: 1px; }
.gd-done-box b { display: block; font-size: 13px; }
.gd-done-box span { display: block; font-size: 11.5px; color: #4a6b5b; margin-top: 3px; line-height: 1.7; }

.gd-wiz-body { max-height: 62vh; overflow-y: auto; padding-right: 4px; }
.gd-wiz-foot {
  display: flex; align-items: center; gap: 8px; margin-top: 16px;
  padding-top: 14px; border-top: 1px solid var(--line);
}
.gd-wiz-nav { margin-left: auto; display: flex; gap: 8px; }
.gd-wiz-foot > .btn.ghost { color: #8a98ad; padding-left: 0; }

.gd-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 15px 16px; margin-bottom: 14px; }
.gd-top-main { display: flex; align-items: center; gap: 11px; flex: 1; min-width: 220px; }
.gd-top-main b { display: block; font-size: 14px; }
.gd-top-main span { display: block; font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.gd-top .gd-ava { width: 42px; height: 42px; flex: 0 0 42px; font-size: 17px; }
.gd-top-prog { flex: 0 0 240px; max-width: 100%; }
.gd-top .gd-scope { margin-top: 5px; }
.gd-scope { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: #64748b; }
.gd-scope svg { opacity: .7; }

.gd-group { margin-bottom: 14px; }
.gd-group .card-head h3 { display: flex; align-items: center; gap: 7px; }
.gd-gicon {
  width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center;
  background: #eef4ff; color: #1f4ed8;
}
.gd-gicon.t-violet { background: #f3edff; color: #6d28d9; }
.gd-gicon.t-teal { background: #e6f8f8; color: #0b7f7f; }
.gd-gicon.t-amber { background: #fff5e6; color: #a75c00; }
.gd-gicon.t-rose { background: #fdeef1; color: #be123c; }
.gd-gicon.t-cyan { background: #e8f7fd; color: #0e7490; }
.gd-gicon.t-slate { background: #f1f5f9; color: #475569; }
.gd-gcount { font-size: 11.5px; color: var(--muted); }
.gd-gcount b { color: var(--ink); font-size: 13px; }
.gd-group .gd-list { padding: 0 14px 14px; }

@media (max-width: 680px) {
  .gd-banner { padding: 12px 13px; }
  .gd-b-act { width: 100%; }
  .gd-b-act .btn { flex: 1; }
  .gd-hero { align-items: flex-start; }
  .gd-hero-main h2 { font-size: 15.5px; }
  .gd-wiz-body { max-height: none; }
  .gd-tips { grid-template-columns: minmax(0, 1fr); }
  .gd-top-prog { flex: 1 1 100%; }
  .gd-go { margin-left: 0; }
  .gd-row-title { gap: 5px; }
  .gd-row-title .gd-go { order: 3; }
  .gd-how { padding-left: 16px; font-size: 11.5px; }
  .gd-wiz-foot { position: sticky; bottom: 0; background: #fff; }
  .gd-group .gd-list { padding: 0 10px 12px; }
}

/* ============ 产品资料 · 按类型分册 + 批量录入 ============ */
.pt-tabs {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  gap: 10px; margin-bottom: 14px;
}
.pt-tab {
  text-align: left; padding: 12px 13px; border-radius: 12px; border: 1px solid var(--line);
  background: #fff; box-shadow: var(--shadow-sm); transition: .16s; display: flex; flex-direction: column; gap: 3px;
}
.pt-tab:hover { border-color: #b9cbe8; transform: translateY(-1px); }
.pt-tab.on { border-color: var(--primary); background: linear-gradient(180deg, #f7faff, #fff); box-shadow: 0 8px 18px -14px rgba(36, 86, 216, .8); }
.pt-tab-top { display: flex; align-items: baseline; gap: 6px; }
.pt-tab-top b { font-size: 13.5px; font-weight: 600; }
.pt-tab-top i { font-style: normal; font-size: 12px; color: #94a3b8; margin-left: auto; font-variant-numeric: tabular-nums; }
.pt-tab.on .pt-tab-top b { color: var(--primary); }
.pt-tab.on .pt-tab-top i { color: var(--primary); font-weight: 600; }
.pt-tab-meta { font-size: 11.5px; color: var(--muted); }
.pt-tab-low { font-size: 11px; color: #c62828; }
.pt-tab-ok { font-size: 11px; color: #94a3b8; }
.pt-all { background: #f8fafd; border-style: dashed; }
.pt-all.on { background: #fff; border-style: solid; }

.pt-filters { align-items: flex-end; }
.pt-filter-note { margin-left: auto; align-self: center; font-size: 11.5px; color: var(--muted); }
.pt-filter-note b { color: var(--ink); font-weight: 600; }
.pt-table td { vertical-align: top; }
.pt-table .sub-line { font-size: 11px; }

/* 批量录入弹窗 */
.pb-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 14px; margin-bottom: 14px; }
.pb-grid .span-2 { grid-column: span 2; }
.pb-check { justify-content: flex-end; }
.pb-cb { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-2); cursor: pointer; white-space: nowrap; }
.pb-cb input { width: 15px; height: 15px; }

.pb-gen-card { border: 1px solid var(--line); border-radius: 12px; background: #fbfdff; overflow: hidden; margin-bottom: 12px; }
.pb-gen-head { padding: 10px 14px; border-bottom: 1px solid var(--line); background: #f5f9ff; }
.pb-gen-head b { font-size: 12.5px; }
.pb-gen-head span { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.pb-gen-body { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; padding: 12px 14px; }
.pb-gen-field { display: flex; flex-direction: column; gap: 5px; }
.pb-gen-field > label { font-size: 11.5px; color: #6b7a90; }
.pb-gen-field .input { width: 200px; }
.pb-gen-acts { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.pb-gen-hint { font-size: 11.5px; color: var(--ok); }
.pb-inline { display: flex; gap: 6px; align-items: center; }

.pb-paste { margin-bottom: 10px; }
.pb-paste-box { margin-top: 8px; padding: 10px 12px; border: 1px dashed var(--line-strong); border-radius: 10px; background: #fcfdff; }
.pb-paste-box textarea { width: 100%; height: auto; padding: 8px 10px; line-height: 1.7; resize: vertical; }
.pb-paste-acts { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; font-size: 11.5px; }

.pb-bulkbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 9px 12px; margin-bottom: 10px; border-radius: 10px; background: #f8fafd; border: 1px solid var(--line);
}
.pb-bulkbar-label { font-size: 11.5px; color: var(--muted); }
.pb-bulkbar .input { width: 118px; height: 30px; }
.pb-bf { display: flex; flex-direction: column; gap: 3px; }
.pb-bf > span { font-size: 10.5px; color: #8494a8; }
.pb-bulkbar .pb-bf .input { width: 112px; }

.pb-wrap { border: 1px solid var(--line); border-radius: 10px; max-height: 42vh; overflow: auto; }
.pb-table { font-size: 12px; }
.pb-table th { position: sticky; top: 0; z-index: 2; background: #f6f9fd; }
.pb-table td { padding: 5px 6px; }
.pb-table .input { height: 29px; padding: 0 7px; font-size: 12px; width: 100%; }
.pb-table .input.num { text-align: right; }
.pb-row.is-dup td { background: #fffaf3; }
.pb-row.is-upd td { background: #f7fbff; }
.pb-row.is-new td { background: #fbfefc; }
.pb-del { color: #94a3b8; }
.pb-del:hover { color: var(--danger); }

.pb-foot-acts { display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.pb-sum {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  position: sticky; bottom: 0; z-index: 3;
  margin-top: 12px; padding: 11px 13px; border-radius: 10px; background: #f4f8ff; border: 1px solid #dbe7fb;
  box-shadow: 0 -10px 20px -16px rgba(15, 23, 42, .55);
}
.pb-sum-item { font-size: 12px; color: var(--ink-2); }
.pb-sum-item b { font-size: 14px; font-variant-numeric: tabular-nums; }
.pb-sum-item.ok b { color: var(--ok); }
.pb-sum-item.info b { color: var(--primary); }
.pb-sum-item.warn b { color: #b45309; }
.pb-sum-item.muted { color: var(--muted); }
.pb-sum-tip { margin-left: auto; font-size: 11px; color: var(--muted); }

@media (max-width: 900px) {
  .pb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-grid .span-2 { grid-column: span 2; }
  .pb-gen-field .input { width: 100%; }
  .pb-gen-field { flex: 1 1 160px; }
  .pb-sum-tip { margin-left: 0; flex: 1 1 100%; }
}
@media (max-width: 680px) {
  .pt-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-grid { grid-template-columns: minmax(0, 1fr); }
  .pb-grid .span-2 { grid-column: span 1; }
  .pb-bulkbar .input { width: 46%; }
  .pb-wrap { max-height: none; }
}

.pb-msg { font-size: 11.5px; color: var(--muted); min-height: 1px; }
.pb-msg.t-ok { color: var(--ok); }
.pb-msg.t-warn { color: #b45309; }

/* ---------------- 产品图纸（加工类产品） ---------------- */
.drw-up { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.drw-badge { font-style: normal; font-size: 10px; background: #eef2f9; color: #475569; border-radius: 8px; padding: 0 5px; margin-left: 4px; min-width: 14px; display: inline-block; text-align: center; }
.drw-badge:empty { display: none; }
.drw-list { display: flex; flex-direction: column; gap: 6px; }
.drw-row { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.drw-row-sm { padding: 5px 8px; }
.drw-ico { width: 30px; height: 30px; border-radius: 8px; background: #f1f5f9; color: #64748b; display: flex; align-items: center; justify-content: center; flex: none; }
.drw-info { flex: 1; min-width: 0; }
.drw-info b { font-size: 12.5px; font-weight: 550; word-break: break-all; }
.drw-info .sub-line { font-size: 11px; color: var(--muted); margin-top: 1px; }
.drw-row .row-actions { flex: none; display: flex; gap: 6px; }
.drw-staged { margin-bottom: 6px; }
.drw-view { background: #f1f5f9; border-radius: 10px; padding: 8px; display: flex; justify-content: center; }
.drw-view img { max-width: 100%; max-height: 66vh; border-radius: 6px; background: #fff; }
.drw-view iframe { width: 100%; height: 68vh; border: 0; border-radius: 6px; background: #fff; }
.drw-noview { padding: 34px 20px; text-align: center; color: var(--muted); font-size: 13px; background: #f8fafc; border-radius: 10px; }
@media (max-width: 680px) {
  .drw-row { flex-wrap: wrap; }
  .drw-row .row-actions { width: 100%; justify-content: flex-end; }
}

/* ---------------- 下拉选项就地管理（DictUI） ---------------- */
.dict-field { display: flex; align-items: center; gap: 6px; }
.dict-field .select, .dict-field .input { flex: 1; min-width: 0; }
.dict-mgr { flex: none; width: 26px; height: 26px; border-radius: 8px; border: 1px dashed #94a3b8; background: #f8fafc; color: #475569; font-size: 14px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.dict-mgr:hover { border-color: #17864a; color: #17864a; background: #ecfdf3; }
.dm-list { display: flex; flex-direction: column; gap: 6px; max-height: 46vh; overflow: auto; padding-right: 2px; }
.dm-row { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.dm-name { flex: 1; font-size: 13px; font-weight: 500; word-break: break-all; }
.dm-why { font-size: 11px; color: #94a3b8; }
.dm-empty { font-size: 12.5px; color: var(--muted); padding: 14px 10px; text-align: center; border: 1px dashed var(--line); border-radius: 10px; }
.dm-add { display: flex; gap: 8px; margin-top: 10px; }
.dm-add .input { flex: 1; }
.dm-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.dm-modal { background: #fff; border-radius: 16px; width: 480px; max-width: 94vw; max-height: 86vh; display: flex; flex-direction: column; box-shadow: 0 18px 50px rgba(0,0,0,.22); }
.dm-head { display: flex; align-items: flex-start; justify-content: space-between; padding: 16px 18px 10px; border-bottom: 1px solid var(--line); }
.dm-head h3 { font-size: 15.5px; font-weight: 600; }
.dm-head p { font-size: 12px; color: var(--muted); margin-top: 3px; max-width: 380px; line-height: 1.5; }
.dm-body { padding: 12px 18px 16px; overflow: auto; }
.icon-btn.confirming { background: #c62828; color: #fff; width: auto; padding: 0 8px; font-size: 11px; }

/* ============ 表格列宽拖拽 ============ */
/* 表头右侧 1px 分隔线，鼠标移到附近变蓝，按住左右拖动即可调列宽 */
.cr-h {
  position: absolute; top: 0; right: 0; bottom: 0; width: 10px;
  cursor: col-resize; z-index: 4; touch-action: none;
}
.cr-h::after {
  content: ""; position: absolute; top: 22%; bottom: 22%; right: 1px; width: 1px;
  border-radius: 1px; background: transparent; transition: background .12s, width .12s;
}
.cr-table > thead th:hover > .cr-h::after { background: rgba(37, 99, 235, .3); }
.cr-h:hover::after, .cr-h.cr-hot::after { background: var(--primary); width: 2px; right: 0; }
.cr-table.cr-locked > tbody td { overflow: hidden; }
.cr-table.cr-locked > tbody td .mono,
.cr-table.cr-locked > tbody td.num { text-overflow: ellipsis; }
body.cr-dragging, body.cr-dragging * { cursor: col-resize !important; user-select: none !important; }
.cr-line {
  position: fixed; top: 0; left: 0; height: 100vh; width: 2px;
  background: var(--primary); opacity: .85; z-index: 9999; pointer-events: none;
}
@media print { .cr-h, .cr-line { display: none !important; } }
/* 锁定列宽后：表头文字不溢出到隔壁列，产品名称下拉不再顶住最小宽度 */
.cr-table.cr-locked > thead th { overflow: hidden; text-overflow: ellipsis; }
.cr-table.cr-locked .cell-select.name-cell { min-width: 0; }

/* ============ 发票台账 ============ */
.inv-empty {
  padding: 18px 16px; border: 1px dashed #dbe3ef; border-radius: 10px;
  background: #fbfdff; color: #64748b; font-size: 12.5px; text-align: center;
}
.inv-empty a { color: var(--primary); font-weight: 600; }
.inv-sub {
  display: flex; align-items: center; justify-content: space-between;
  margin: 16px 0 8px; font-size: 12.5px; font-weight: 600; color: #475569;
}
.inv-sum {
  display: flex; gap: 10px; background: #f8fafc; border: 1px solid var(--line);
  border-radius: 10px; padding: 12px 16px;
}
.inv-sum > div { flex: 1; min-width: 0; }
.inv-sum span { display: block; font-size: 11.5px; color: var(--muted); margin-bottom: 4px; }
.inv-sum b { font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
.inv-sum b.red { color: #c62828; }
.inv-sum b.ok { color: #17864a; }
.inv-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; }
.inv-form .field { margin: 0; }
.inv-form .field label { font-size: 11.5px; margin-bottom: 4px; }
.inv-form .req { color: #c62828; font-style: normal; margin-left: 1px; }
.inv-form-head { display: flex; align-items: center; justify-content: space-between; margin: 14px 0 10px; color: #334155; }
.inv-form-head b { font-size: 13px; }
.inv-sign-field .ck { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #475569; height: 34px; }
.inv-sign-field .ck input { width: 15px; height: 15px; }
.inv-submit { display: flex; align-items: flex-end; }
.inv-submit .btn { width: 100%; }
.inv-foot-note { margin-right: auto; font-size: 11.5px; color: #94a3b8; align-self: center; }
.inv-dlg-table { border: 1px solid var(--line); border-radius: 10px; }
.inv-dlg-table th { background: #f8fafc; }
.inv-card-body { padding-bottom: 4px; }
.inv-line { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.inv-line-item span { display: block; font-size: 11.5px; color: var(--muted); margin-bottom: 3px; }
.inv-line-item b { font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; }
.inv-line-item b.red { color: #c62828; }
.inv-line-item b.ok { color: #17864a; }
.inv-line-acts { margin-left: auto; }
.inv-card-table th { background: #f8fafc; }
.inv-table tbody tr.inv-todo { background: #fffbfb; }
.inv-table tbody tr.inv-todo:hover { background: #fff5f5; }
.inv-toolbar { align-items: flex-end; flex-wrap: wrap; gap: 10px; }
.inv-toolbar .field { margin: 0; }
.inv-sumline { margin: 2px 0 10px; font-size: 12px; }
.inv-seg button i { font-style: normal; font-size: 10.5px; color: #94a3b8; margin-left: 2px; }
.inv-seg button.on i { color: var(--primary); }
.inv-kpi { margin-top: 14px; }
.inv-kpi-todo .kpi-value { color: #c62828; }
.pill-btn { border: 0; cursor: pointer; font-family: inherit; }
.pill-btn:hover { filter: brightness(.95); }
.inv-tabs { margin-bottom: 2px; }
@media (max-width: 900px) {
  .inv-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inv-sum { flex-wrap: wrap; }
  .inv-sum > div { flex: 1 1 40%; }
}
/* 开票状态文字（不用 pill，避免在汇总条里被拉伸） */
.inv-st { font-size: 15px !important; }
.inv-st.none { color: #c62828; }
.inv-st.part { color: #b45309; }
.inv-st.full { color: #17864a; }
.inv-st.over { color: #7c3aed; }
.inv-line-item .inv-st { font-size: 17px !important; }
.inv-submit .btn { width: auto; min-width: 96px; }

/* ============ 正式启用（开账） ============ */
.act-hero {
  display: flex; gap: 22px; align-items: center; justify-content: space-between;
  padding: 20px 22px; border: 1px solid #f3d6d6;
  background: linear-gradient(135deg, #fff8f6, #fffdfb 55%, #f7fbff);
}
.act-hero-l { max-width: 720px; }
.act-hero-badge { margin-bottom: 8px; }
.act-hero h2 { font-size: 17px; font-weight: 650; letter-spacing: .2px; }
.act-hero-p { margin-top: 8px; font-size: 12.5px; line-height: 2; color: var(--ink-2); }
.act-hero-p b { color: var(--danger); }
.act-hero-r { text-align: center; flex: 0 0 auto; padding: 6px 8px; }
.act-sum { display: flex; align-items: baseline; gap: 4px; justify-content: center; }
.act-sum span { display: block; width: 100%; font-size: 11.5px; color: var(--muted); margin-bottom: 2px; }
.act-sum b { font-size: 38px; font-weight: 700; color: var(--danger); font-variant-numeric: tabular-nums; line-height: 1.1; }
.act-sum em { font-style: normal; font-size: 12px; color: var(--muted); }
.act-sum-tip { margin-top: 4px; font-size: 11px; color: #94a3b8; }

.act-table td { vertical-align: top; }
.act-grid { display: flex; flex-wrap: wrap; gap: 6px 8px; }
.act-item {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 6px; font-size: 11.5px;
  background: #f4f6fa; color: #8b98ab; border: 1px solid #eef1f7;
  font-variant-numeric: tabular-nums;
}
.act-item.has { background: #fdecec; color: #a83232; border-color: #f7dada; }
.act-item b { font-weight: 650; }

.act-warn {
  font-size: 12.5px; line-height: 1.9; color: var(--danger);
  background: var(--danger-soft); border: 1px solid #f7dada;
  border-radius: 9px; padding: 9px 12px; margin-bottom: 12px;
}
.act-ck { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; color: var(--ink-2); line-height: 1.7; margin-bottom: 9px; cursor: pointer; }
.act-ck input { margin-top: 2px; accent-color: var(--primary); }
.act-go { width: 100%; margin-top: 4px; height: 38px; font-weight: 600; }
.act-go:disabled { opacity: .45; cursor: not-allowed; }
.act-go-tip { margin-top: 8px; font-size: 11.5px; color: var(--muted); line-height: 1.7; }
.act-note-warn { background: var(--warn-soft); border-color: #fbe3c0; color: var(--warn); }

.act-done { text-align: center; padding: 4px 6px 2px; }
.act-done-i {
  width: 46px; height: 46px; margin: 0 auto 10px; border-radius: 50%;
  display: grid; place-items: center; font-size: 22px; color: #fff;
  background: linear-gradient(135deg, #1aa06d, #0e9f9f);
  box-shadow: 0 10px 22px -12px rgba(14, 159, 159, .9);
}
.act-done h3 { font-size: 16px; font-weight: 650; }
.act-done p { margin-top: 8px; font-size: 12.5px; color: var(--ink-2); line-height: 1.9; }
.act-done-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 14px 0 4px; }
.act-done-grid > div { background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; text-align: left; }
.act-done-grid span { display: block; font-size: 11px; color: var(--muted); margin-bottom: 3px; }
.act-done-grid b { font-size: 13.5px; font-weight: 650; }
.act-done-tip { text-align: left; background: var(--primary-soft); border: 1px solid #dbe7ff; border-radius: 10px; padding: 10px 12px; color: #2b4a86 !important; }
@media (max-width: 900px) {
  .act-hero { flex-direction: column; align-items: stretch; }
  .act-hero-r { border-top: 1px dashed var(--line); padding-top: 12px; }
  .act-done-grid { grid-template-columns: 1fr; }
}

/* 表头上的字典「＋」：材质 / 工艺选项就地维护 */
.th-plus { display: inline-block; vertical-align: middle; margin-left: 5px; }
.th-plus .dict-mgr { width: 18px; height: 18px; border-radius: 6px; font-size: 12px; }
.raw-table th { white-space: nowrap; }
.raw-table .cell-select { min-width: 76px; }

/* ============ 采购涨价提醒 / 价格台账 ============ */
/* 明细单价下面的涨跌小字 */
.price-up, .price-down, .price-flat {
  font-size: 10.5px; line-height: 1.35; margin-top: 1px;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.price-up { color: #c62828; }
.price-down { color: #17864a; }
.price-flat { color: #94a3b8; }

/* 保存前的涨价确认弹窗 */
.price-rise-box .pr-head { font-size: 13px; color: #334155; margin-bottom: 10px; }
.price-rise-box .pr-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto 58px;
  gap: 4px 10px; padding: 8px 10px; border: 1px solid #f7dada;
  background: #fff8f7; border-radius: 9px; margin-bottom: 7px; align-items: baseline;
}
.price-rise-box .pr-name { font-size: 13px; font-weight: 550; color: #1e293b; word-break: break-all; }
.price-rise-box .pr-name em { font-style: normal; font-size: 11.5px; color: #94a3b8; }
.price-rise-box .pr-num { font-size: 12.5px; color: #64748b; font-variant-numeric: tabular-nums; }
.price-rise-box .pr-num b { color: #c62828; font-size: 13.5px; }
.price-rise-box .pr-pct { font-size: 12px; font-weight: 600; color: #c62828; text-align: right; }
.price-rise-box .pr-meta { grid-column: 1 / -1; font-size: 11px; color: #94a3b8; }
.price-rise-box .pr-tip { margin-top: 10px; font-size: 11.5px; line-height: 1.8; color: #7c8aa0; }

/* 价格台账 */
.pp-only-up { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-2); cursor: pointer; }
.pp-only-up input { accent-color: var(--primary); }
tbody tr[data-key] { cursor: pointer; }
tbody tr[data-key]:hover { background: #fbfdff; }
.pr-hist-row td { background: #f8fafc; padding: 8px 12px !important; }
.pr-hist { display: flex; flex-direction: column; gap: 4px; }
.pr-hist-item {
  display: grid; grid-template-columns: 92px 132px 100px 90px minmax(0, 1fr);
  gap: 10px; align-items: center; font-size: 12px; color: #475569;
  padding: 3px 0; border-bottom: 1px dashed #e6ecf5;
}
.pr-hist-item:last-child { border-bottom: none; }
.pr-hist-item .pr-hd { color: #334155; font-weight: 550; }
.pr-hist-item .pr-hno { font-size: 11px; color: #94a3b8; }
.pr-hist-item .pr-hp { font-weight: 600; color: #1e293b; font-variant-numeric: tabular-nums; }
.pr-hist-item .pr-hq { color: #64748b; font-variant-numeric: tabular-nums; }
.pr-hist-item .pr-hs { color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-hist-item .pr-hp em { font-style: normal; font-size: 10.5px; color: #94a3b8; }
.pr-hfoot { margin-top: 6px; padding-top: 6px; border-top: 1px dashed #e6ecf5; font-size: 11.5px; color: #64748b; }
.kw-hit { background: #fff2b8; color: inherit; padding: 0 1px; border-radius: 2px; }
@media (max-width: 720px) {
  .pr-hist-item { grid-template-columns: 1fr 1fr; }
}

/* ============ 历史价查询（采购单里的浮层） ============ */
.hb-wrap { display: flex; flex-direction: column; gap: 8px; }
.hb-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.hb-bar .input { flex: 1 1 240px; min-width: 170px; }
.hb-bar .select { width: 132px; }
.hb-tip { font-size: 11.5px; color: #7c8aa0; min-height: 16px; }
.hb-tip b { color: #334155; }
.hb-list { display: flex; flex-direction: column; gap: 6px; max-height: 58vh; overflow: auto; padding-right: 2px; }
.hb-item { border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.hb-item.open { border-color: #c7d7fb; }
.hb-row {
  display: grid; grid-template-columns: minmax(0, 1fr) 52px 96px 76px minmax(0, 0.9fr);
  gap: 8px; align-items: center; padding: 9px 11px; cursor: pointer; font-size: 12.5px;
}
.hb-row:hover { background: #f8fbff; }
.hb-name { font-weight: 550; color: #1e293b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-name em { font-style: normal; font-size: 11px; color: #94a3b8; margin-left: 6px; }
.hb-times { font-size: 11.5px; color: #94a3b8; }
.hb-price { font-weight: 600; font-variant-numeric: tabular-nums; color: #1e293b; text-align: right; }
.hb-delta { text-align: right; }
.hb-delta .price-up, .hb-delta .price-down, .hb-delta .price-flat { margin-top: 0; font-size: 11.5px; }
.hb-meta { font-size: 11px; color: #94a3b8; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-hist {
  border-top: 1px dashed #e6ecf5; background: #f8fafc; padding: 6px 11px 8px;
  display: flex; flex-direction: column; gap: 2px;
}
.hb-hrow {
  display: grid; grid-template-columns: 88px 96px 84px 74px minmax(0, 1fr);
  gap: 8px; font-size: 11.5px; color: #475569; padding: 2px 0;
  font-variant-numeric: tabular-nums;
}
.hb-hrow .hb-hd { color: #334155; }
.hb-hrow .hb-hno { font-size: 11px; }
.hb-hrow .hb-hno a { color: #64748b; text-decoration: underline; text-underline-offset: 2px; }
.hb-hrow .hb-hp { font-weight: 600; color: #1e293b; }
.hb-hrow .hb-hs { color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-hfoot { margin-top: 4px; padding-top: 5px; border-top: 1px dashed #e6ecf5; font-size: 11px; color: #64748b; }
.hb-empty { padding: 26px 10px; text-align: center; font-size: 12.5px; color: #94a3b8; }
@media (max-width: 720px) {
  .hb-row { grid-template-columns: minmax(0, 1fr) 84px; }
  .hb-times, .hb-meta { display: none; }
  .hb-hrow { grid-template-columns: 1fr 1fr; }
}