:root{
  --bg:#f5f6f8; --panel:#fff; --line:#e3e6ea; --text:#22262b; --muted:#7a828c;
  --primary:#2f6fed; --danger:#d64545; --ok:#1f9254; --warn:#c47f17;
  /* 派生层（浅色默认取值；暗色/护眼暖色/桃云柔胭/青澜云净 在末尾主题块里覆盖）。
     作用：菜单 hover、行状态、标签浅底等共用，浅色下也必须有值，否则菜单 hover 失效。 */
  --surface-2:#fafbfc; --surface-3:#f0f2f5; --surface-input:#fff;
  --tint-blue:#eaf0fd; --tint-green:#eaf6ee; --tint-red:#fdecec; --tint-amber:#fdf5e6; --tint-purple:#f4ecfb;
  --row-hover:#f6f8fb; --row-sel:#dce9ff; --row-sel-hover:#c9dcff; --row-armed:#bcd6ff;
  --fg-blue:#2f6fed; --fg-green:#1f9254; --fg-red:#d64545; --fg-amber:#c47f17; --fg-purple:#7d4fb0;
  --tooltip-bg:#22262b; --tooltip-fg:#fff; --mask:rgba(0,0,0,.5);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 -apple-system,"Segoe UI","Microsoft YaHei",sans-serif}
a{color:var(--primary);text-decoration:none}
code{background:#eef1f5;padding:1px 5px;border-radius:3px;font-size:12px}
.container{max-width:1180px;margin:0 auto;padding:18px}
.topbar{display:flex;align-items:center;gap:18px;background:var(--panel);border-bottom:1px solid var(--line);padding:10px 18px;position:sticky;top:0;z-index:5}
.brand{font-weight:700;font-size:16px}
.nav{display:flex;gap:14px;flex:1}
.nav a{padding:4px 8px;border-radius:5px;color:var(--text)}
.nav a.active,.nav a:hover{background:#eaf0fd;color:var(--primary)}
.userbox{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.footer{padding:18px;text-align:center;color:var(--muted);font-size:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:14px}
.card h1{font-size:18px;margin:0 0 10px}
.card h2{font-size:15px;margin:0 0 8px}
.muted{color:var(--muted);font-size:13px}
.alert{padding:8px 12px;border-radius:6px;margin:8px 0;font-size:13px}
.alert-success{background:#e8f6ee;color:var(--ok);border:1px solid #bfe3cd}
.alert-error{background:#fdecec;color:var(--danger);border:1px solid #f3c4c4}
.alert-warning{background:#fdf5e6;color:var(--warn);border:1px solid #f0dcae}
.alert-info{background:#eaf0fd;color:#2f6fed;border:1px solid #cdddff}
.mysql-only{margin:8px 0 4px;padding:10px 12px;border:1px dashed #cdddff;border-radius:8px;background:#fafcff}
.mysql-only pre{background:#0f172a;color:#e2e8f0;padding:8px 10px;border-radius:6px;overflow:auto;font-size:12px;line-height:1.5;margin:6px 0}
.mysql-only code{background:#e6edff;color:#2f6fed;padding:0 4px;border-radius:3px;font-size:12px}
.table{width:100%;border-collapse:collapse;font-size:13px}
.table th,.table td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.table th{background:#fafbfc;color:var(--muted);font-weight:600}
.table tr.subrow td{background:#fbfcfd}
.table tr.row-danger td{background:#fff7f7}
.ops{white-space:nowrap}
.form label{display:block;margin:8px 0}
.form input,.form select,.filters input,.filters select{padding:7px 9px;border:1px solid var(--line);border-radius:5px;min-width:200px;background:#fff}
.grid-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 12px;align-items:end}
.btn{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--text);cursor:pointer;font-size:13px}
.btn:hover{border-color:var(--primary);color:var(--primary)}
.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn-primary:hover{opacity:.9;color:#fff}
.btn-danger{color:var(--danger);border-color:#f0c8c8}
.btn-red-soft{background:#fdecec;border-color:#f3b7b7;color:#c0392b}
.btn-red-soft:hover{background:#F53F3F;border-color:#F53F3F;color:#FFFFFF}
.btn-sm{padding:3px 8px;font-size:12px}
.sm{font-size:12px;line-height:1.45}
form.inline{display:inline-flex;align-items:center;gap:6px;margin-right:10px}
.inline-label{display:flex;align-items:center;gap:6px;margin:0}
.inline-label select{min-width:180px}
.tag{padding:1px 7px;border-radius:10px;font-size:12px;background:#eef1f5;color:var(--muted)}
.tag-admin{background:#e8f0ff;color:#2f6fed}
.tag-tracker{background:#eaf6ee;color:#1f9254}
.tag-supervisor{background:#f4ecfb;color:#7a4bbd}
.tag-write{background:#fdecec;color:#c0392b}
.tag-read{background:#eaf1fb;color:#2f6fed}
/* 号段已回收（软删除） */
.tag-revoked{background:#fdf3e7;color:#b7791f}
/* 号段越界（不在该年度任何总段范围内，存量数据） */
.tag-out{background:#fdecec;color:#c0392b}
/* 未登记年度总段的提示行 */
.notice-line{margin:8px 0;padding:8px 12px;border-left:3px solid #f0a020;background:#fffaf0;color:#8a5a00;font-size:13px}
/* 离职交接页：号段 / 订单预览列表 */
.seg-list{margin:4px 0 0;padding-left:1.1rem}
.seg-list li{margin:2px 0}
.perm-legend{margin:10px 0 14px;padding:10px 14px;background:#fafbfc;border:1px solid var(--line);border-radius:8px}
.perm-legend summary{cursor:pointer;font-weight:600;color:var(--text);user-select:none}
.perm-legend ul{list-style:none;padding:0;margin:10px 0 4px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:6px 18px}
.perm-legend li{display:flex;align-items:center;gap:8px;font-size:13px}
.perm-legend .perm-key{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;color:var(--muted)}
.setting-form{max-width:760px}
.setting-row{padding:12px 0;border-bottom:1px dashed var(--line)}
.setting-row:last-of-type{border-bottom:none}
.setting-label{display:flex;align-items:baseline;gap:8px;font-weight:600;margin-bottom:6px}
.setting-key{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;font-weight:400;color:var(--muted);background:#eef1f5;padding:1px 6px;border-radius:4px}
.setting-row input[type=text]{width:100%;max-width:420px}
.setting-desc{margin:6px 0 0;font-size:13px;color:var(--muted);line-height:1.6}
.setting-values{display:inline-block;margin-top:4px;color:#2f6fed;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:10px}
.stat{background:#fafbfc;border:1px solid var(--line);border-radius:6px;padding:10px}
.stat span{display:block;color:var(--muted);font-size:12px}
.stat b{font-size:20px}
.pager{display:flex;gap:8px;margin-top:10px}
.error-list{margin:6px 0;padding-left:18px;font-size:13px}
.blank,.install{background:#eef1f5}
.blank-box,.install-box{max-width:460px;margin:60px auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:24px}
.install-box{max-width:560px}
.install-box h1{font-size:20px;margin:0 0 14px}
.install-box h2{font-size:15px;margin:18px 0 8px}
.check-list{list-style:none;padding:0;margin:0;font-size:13px}
.check-list li{padding:3px 0}
.check-list .ok{color:var(--ok)}
.check-list .bad{color:var(--danger)}
fieldset{border:1px solid var(--line);border-radius:6px;padding:10px;margin:12px 0}
legend{font-size:13px;color:var(--muted)}
/* 兜底：<fieldset hidden> 必须真正不渲染。UA 样式表里 [hidden]{display:none} 优先级低于作者样式，
   一旦以后给 fieldset 写了 display（如 display:contents / flex），hidden 就会失效 → 区块「藏不住」。
   新建订单页「内联登记开票 / 内联登记收款」靠这条隐藏（显示只需删掉模板里的 hidden 属性）。 */
.order-form fieldset[hidden]{display:none}
.filter{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:12px}
.filter label{display:inline-flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted)}
.filter select,.filter input{padding:6px 8px;border:1px solid var(--line);border-radius:5px;min-width:130px;background:#fff;color:var(--text)}
/* 订单表单栅格（稿件版）：固定 4 列 · 标签在上 / 输入框居中 / 小字提示在下。
   ⚠️ 旧实现是 auto-fill(240px) + align-items:end —— 同一排里各字段提示行数不等时，
   「底部对齐」会把输入框拉开成高低错位（无提示的字段被压低），且宽屏会漂成 5 列。
   现改为固定 4 列 + align-items:start，同排输入框天然对齐。 */
.order-form .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 22px;align-items:start;margin-top:6px}
/* 整段说明（如「开票/收款状态自动计算」）独占一整行，不占位挤掉后续字段 */
.order-form .grid>.form-hint{grid-column:1/-1;margin:0 0 2px}
/* 末列对齐工具类：供 create/edit 表单的「征订日期」等字段钉到最右列（拖动排序时由 JS 移除）。 */
.order-form .grid>.col-last{grid-column:1 / -1}                                   /* 1 列模式：占满整行 */
@media (min-width:641px) and (max-width:1080px){.order-form .grid>.col-last{grid-column:2 / 3}} /* 2 列模式：钉右列 */
@media (min-width:1081px){.order-form .grid>.col-last{grid-column:4 / 5}}          /* 4 列模式：钉第 4 列 */
/* 详情页各表单的提交按钮：统一落在网格「最右列」，与其同排输入框底部对齐。
   负列号 -2/-1 自动适配 1/2/4 列（无需按断点写多条），按钮紧跟末排字段、
   不再独占整行（避免右侧大片留白 + 漂浮感）；justify-self:stretch 使其宽度
   撑满该列、与同列输入框等宽；align-self:end 使其与输入框底边齐平
   （字段是「标签+输入框」两行，按钮无标签，需下沉对齐输入框）。 */
.order-form .grid>button{grid-column:-2 / -1;justify-self:stretch;align-self:end}
/* 收款 / 退款：按钮不钉最右列，紧跟「备注」输入框之后按自然流排列
   （grid-column:auto 覆盖上面的 -2/-1；仍继承 stretch 等宽 + end 底边对齐）。
   作用域限定在 .form-flow-btn，开票/红冲/征订变更等按钮仍钉最右列不受影响。 */
.order-form.form-flow-btn .grid>button{grid-column:auto}
@media (max-width:1080px){.order-form .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.order-form .grid{grid-template-columns:1fr}}
.order-form label{display:block;font-size:12px;color:var(--muted)}
.order-form input,.order-form select,.order-form textarea{padding:7px 9px;border:1px solid var(--line);border-radius:5px;width:100%;background:#fff;color:var(--text);font-family:inherit;font-size:13px}
.order-form textarea{resize:vertical}
.order-form input[readonly]{background:#f7f8fa;color:var(--muted)}
/* 字段下方小字提示 / 订单号查重结果 */
.no-hint{display:block;min-height:15px;margin-top:3px;font-size:12px;color:var(--muted)}
.no-hint.ok{color:var(--ok)}
.no-hint.dup{color:var(--danger)}
.no-hint.warn{color:#b45309}

/* ── 连续录单页（order/serial）──
   录入区字段固定不拖动，故去掉拖把手图标（留着会误导用户去拖，且拖了也没用）。 */
.serial-form .field-label{cursor:default}
.serial-form .field-label::before{content:none}
.serial-msg{margin:10px 0 0;font-size:13px}
.serial-msg.ok{color:var(--ok)}
.serial-msg.err{color:var(--danger)}
.serial-list{margin-top:22px}
.serial-list-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:6px}
.serial-list h3{margin:0;font-size:15px}

/* ── 基础信息字段：按住标题拖动重排 ──
   拖把手是 .field-label（标题），不是整个 label —— 整块设 draggable 会破坏 input 内文本选择。 */
.order-form .field-label{display:inline-flex;align-items:center;gap:4px;margin-bottom:4px;cursor:grab;
  font-size:12px;color:var(--muted);user-select:none;border-radius:4px;padding:1px 3px;margin-left:-3px}
.order-form .field-label::before{content:'⠿';font-size:13px;line-height:1;color:var(--muted);opacity:.65}
.order-form .field-label:hover{background:#f2f5fb;color:var(--text)}
/* 「外部订单号」字段的外层刻意用 <div data-field> 而非 <label>（避免点击标题误激活复选框），
   故补一条与 .order-form label 等价的排版规则 */
.order-form div[data-field]{display:block;font-size:12px;color:var(--muted)}
/* 订单号「自增」复选框：跟在标题右侧 */
.order-form .auto-inc{margin-left:12px;display:inline-flex;align-items:center;gap:4px;
  cursor:pointer;font-size:12px;color:var(--muted)}
.order-form .auto-inc input[type="checkbox"]{width:auto;padding:0;margin:0;cursor:pointer;vertical-align:middle}
.order-form .auto-inc:hover{color:var(--text)}
.order-form .field-label:hover::before{opacity:1}
.order-form .field-label:active{cursor:grabbing}
/* 拖拽中被举起的字段整体变淡 */
.order-form label.field-dragging{opacity:.45}

/* 二级分类：下拉 + 输入框模糊匹配。
   原生 select 用 display:none 隐藏，既保留提交语义，也不会因「不可聚焦」让 Chrome 报
   invalid form control（required 改由 order-form-search.js 在 submit 时兜底校验）。 */
.cat-combo{position:relative}
.cat-combo .cat-select{display:none}
.cat-combo.is-invalid .cat-search{border-color:#c0392b;box-shadow:0 0 0 2px rgba(192,57,43,.12)}
.cat-panel{position:absolute;left:0;right:0;top:100%;margin-top:2px;z-index:30;background:#fff;
  border:1px solid var(--line);border-radius:5px;max-height:264px;overflow:auto}
.cat-opt{display:flex;gap:8px;align-items:baseline;padding:6px 9px;cursor:pointer;font-size:13px;color:var(--text)}
.cat-opt+.cat-opt{border-top:1px solid var(--line)}
/* 当前已选中的行（打开下拉时便于定位）；hover/键盘高亮仍优先 */
.cat-opt.is-selected{background:#eaf3fd;font-weight:600}
.cat-opt:hover,.cat-opt.is-active{background:#f1f6fb}
/* 代号列不展示（仍参与搜索匹配）；名称最多 10 字：JS 已按字符数截断并挂 title，
   这里的 nowrap + ellipsis 只是极端场景（超长英文/窄屏）的兜底，避免撑破行。 */
.cat-opt .cat-name{margin-right:auto;min-width:0;max-width:11em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-opt .cat-parent{font-size:12px;color:var(--muted);flex-shrink:0}
.cat-opt .cat-tick{font-size:12px;color:var(--primary);flex-shrink:0}
.cat-panel mark{background:#d9e9fb;color:inherit;border-radius:2px;padding:0 1px}
.cat-empty,.cat-more{padding:7px 9px;font-size:12px;color:var(--muted)}
.cat-more{border-top:1px solid var(--line)}
/* 放置位置指示：插到前面 → 左边亮线；插到后面 → 右边亮线 */
.order-form label.field-drop-before{box-shadow:-3px 0 0 0 var(--primary)}
.order-form label.field-drop-after{box-shadow:3px 0 0 0 var(--primary)}
#resetFieldOrder{margin-left:4px}

.actions{margin-top:14px;display:flex;gap:10px}
.agg{background:#eaf0fd;color:#2f6fed;border:1px solid #cdddff;border-radius:6px;padding:8px 12px;font-size:13px;margin-bottom:10px}
.hint{color:var(--muted);font-size:13px;margin:6px 0}
.kv{width:100%;border-collapse:collapse;font-size:13px;background:var(--panel);border:1px solid var(--line);border-radius:6px;table-layout:fixed}
.kv th{background:#fafbfc;color:var(--muted);font-weight:600;width:120px;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
/* vertical-align:middle = 行内垂直居中（与键列 th 的默认 middle 一致）。
   ⚠️ 不要改成 top：用户要的是「垂直居中」，top 会让右侧短值（如订阅日期）
   在左侧长地址折行撑高时贴顶、看起来偏上（曾误改过一次被退回）。 */
.kv td{padding:8px 10px;border-bottom:1px solid var(--line);overflow-wrap:anywhere;word-break:break-word;vertical-align:middle}
.stages{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:8px 0}
.stages li{border:1px solid var(--line);border-radius:20px;padding:4px 14px;font-size:13px;background:#fafbfc;color:var(--muted)}
.stages li.done{background:#eaf6ee;border-color:#bfe3cd;color:var(--ok)}
.stages li .ok{margin-left:4px}
.stages li .stage-name{font-weight:600}
.stages li .stage-hint{margin-left:6px;padding:0 7px;border-radius:9px;background:#fdf5e6;color:var(--warn);font-size:12px}
.stages li.done .stage-hint{background:#eaf6ee;color:var(--ok)}
/* 折叠区块（订单详情页：开票明细 / 收款明细 / 征订变更） */
details.fold{padding:0}
details.fold>.fold-title{cursor:pointer;padding:13px 16px;font-weight:600;font-size:15px;
  display:flex;align-items:center;gap:8px;list-style:none;border-radius:8px}
details.fold>.fold-title::-webkit-details-marker{display:none}
details.fold>.fold-title::before{content:"\25B8";color:var(--muted);font-size:12px}
details.fold[open]>.fold-title::before{content:"\25BE"}
details.fold[open]>.fold-title{border-bottom:1px solid var(--line);border-radius:8px 8px 0 0}
details.fold>.fold-body{padding:12px 16px 16px}
.fold-title .count{display:inline-block;min-width:22px;padding:0 7px;border-radius:9px;
  background:#eef1f5;color:var(--muted);font-size:12px;font-weight:700;text-align:center}
details.fold[open]>.fold-title .count{background:#eaf0fd;color:var(--primary)}
.timeline{list-style:none;padding:0;margin:6px 0;font-size:13px}
.timeline li{padding:4px 0;border-bottom:1px dashed var(--line)}
.timeline .t{color:var(--muted);font-size:12px;margin-right:8px}
.timeline .op{color:#3b6ea5;font-weight:600;margin-right:2px}
.tag-draft{background:#eef1f5;color:var(--muted)}
.tag-completed{background:#eaf6ee;color:var(--ok)}
.tag-todo{background:#eef1f5;color:var(--muted)}
/* 折叠区内的二级折叠（录入表单：默认收起，明细有数据时才展开外层） */
details.fold-sub{margin-top:10px;border:1px solid var(--line);border-radius:8px;background:#fafbfc}
details.fold-sub>summary{cursor:pointer;padding:9px 12px;font-size:13px;font-weight:600;
  color:var(--muted);list-style:none;border-radius:8px}
details.fold-sub>summary::-webkit-details-marker{display:none}
details.fold-sub>summary::before{content:"\25B8";margin-right:5px;color:var(--muted);font-size:12px}
details.fold-sub[open]>summary::before{content:"\25BE"}
details.fold-sub[open]>summary{border-bottom:1px solid var(--line);border-radius:8px 8px 0 0}
details.fold-sub>.fold-sub-body{padding:10px 12px}
.fold-left{font-size:12px;color:var(--muted);margin:0 0 8px}
.fold-left b{color:var(--primary);font-size:13px}
.order-head{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:8px 0 14px;font-size:13px;color:var(--muted)}
/* 详情页分类字段：过长截断，悬停显示完整 */
.cat-field{position:relative}
.cat-trunc{cursor:help}
.cat-trunc:hover{text-decoration:underline dotted}
.cat-field .cat-full{display:none;position:absolute;left:0;top:135%;z-index:60;max-width:360px;white-space:normal;word-break:break-word;padding:5px 9px;border-radius:5px;background:var(--text);color:#fff;font-size:12px;line-height:1.5;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.cat-field:hover .cat-full{display:block}
.empty{color:var(--muted);text-align:center;padding:14px}

/* ── 看板（§6） ── */
.text-up{color:var(--danger)}
.text-down{color:var(--ok)}
.text-warn{color:var(--warn)}
.stat-warn{background:#fdf5e6;border-color:#f0dcae}
.stat b small,.stat i{font-size:12px;font-style:normal;font-weight:400}
.dash-group{margin:0 0 18px;padding-bottom:14px;border-bottom:1px dashed var(--line)}
.dash-group:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.dash-group-head{display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;justify-content:space-between;margin-bottom:6px}
/* 一级概览 + 下钻二级（§6.1）：分组头可点击，二级卡片默认收起 */
.dash-group-head[role=button]{cursor:pointer;user-select:none;border-radius:6px;padding:4px 6px;margin:-4px -6px 2px;transition:background .12s}
.dash-group-head[role=button]:hover{background:#f3f6fb}
.dash-group-head[role=button]:focus-visible{outline:2px solid var(--primary);outline-offset:1px}
.dash-group-head-main{display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;flex:1 1 auto;min-width:0}
.dash-group .caret{color:var(--muted);font-size:12px;align-self:center;transition:transform .15s}
.dash-group:not(.is-collapsed) .caret{transform:rotate(90deg)}
.dash-group.is-collapsed .dash-grid{display:none}
.dash-group-head h3{font-size:14px;margin:0}
.bar{height:8px;border-radius:5px;background:#eef1f5;overflow:hidden;margin:6px 0}
.bar>i{display:block;height:100%;background:var(--primary);border-radius:5px}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:10px}
.dash-card{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:#fafbfc}
.dash-card-over{border-color:#f0c8c8;background:#fff7f7}
.dash-card-title{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-weight:600;font-size:13px}
.dash-num{font-size:22px;font-weight:700;margin:4px 0 2px}
.dash-num small{font-size:12px;font-weight:400;color:var(--muted)}
.dash-meta{margin-top:4px;line-height:1.5}
.chip{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11px;font-weight:400;background:#eef1f5;color:var(--muted)}
.chip-danger{background:#fdecec;color:var(--danger)}
.chip-mini{display:inline-block;padding:0 6px;border-radius:8px;font-size:10px;line-height:16px;background:#eef1f5;color:var(--muted);margin-right:4px}
.chart-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.chart-box{background:#fafbfc;border:1px solid var(--line);border-radius:8px;padding:10px}

/* ── 订单导入（v1.0-M6） ── */
.tpl-preview{margin-top:10px}
.tpl-preview summary{cursor:pointer;font-size:13px;color:var(--primary);padding:4px 0}
.chip-list{display:flex;flex-wrap:wrap;gap:6px;padding:8px 0}
.chip-warn{background:#fdf5e6;color:#b8860b}
.import-result{margin-top:12px}
.preview-head{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px;font-size:13px}
.import-result .table{margin-top:6px}
.import-result tr.row-fail td{background:#fff7f7}
.import-result tr.row-skip td{background:#fbfcfd;color:var(--muted)}
.import-confirm{margin-top:6px;padding:12px;border:1px solid var(--line);border-radius:8px;background:#fafbfc}
.import-confirm.muted{border-style:dashed;color:var(--muted)}
.import-confirm .checkbox{display:block;margin:8px 0;font-size:13px}
.import-confirm .checkbox input{margin-right:6px}
.notice-list{margin:0;padding-left:18px;font-size:13px;line-height:1.9}

/* ── 高级查询页（order/advanced） ── */
.adv-sec{background:var(--panel);border:1px solid var(--line);border-radius:8px;margin:0 0 14px;overflow:hidden}
.adv-sec>.adv-sec-head{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
  padding:13px 16px;font-weight:700;font-size:15px;color:var(--text);user-select:none}
.adv-sec>.adv-sec-head::-webkit-details-marker{display:none}
.adv-sec>.adv-sec-head::after{content:"\25BE";margin-left:auto;color:var(--muted);font-size:12px;align-self:center}
.adv-sec[open]>.adv-sec-head{border-bottom:1px solid var(--line)}
.adv-sec:not([open])>.adv-sec-head::after{content:"\25B8"}
.adv-sec-sub{font-weight:400;font-size:13px;color:var(--muted)}
.adv-sec-body{padding:14px 16px 16px}
.adv-grid{display:grid;gap:12px 16px}
.adv-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.adv-grid-3{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:28px}
@media (max-width:980px){.adv-grid-4,.adv-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.adv-grid-4,.adv-grid-3{grid-template-columns:1fr}}
.adv-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.adv-field>label,.adv-label{display:flex;align-items:baseline;gap:6px;font-size:12px;color:var(--muted)}
.adv-field select,.adv-field input[type=text],.adv-field input[type=date]{
  padding:7px 9px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--text);
  font:inherit;width:100%;min-width:0;height:34px}
.adv-range{display:flex;align-items:center;gap:8px}
.adv-range input{flex:1 1 0;min-width:0}
.adv-range .sep{flex:0 0 auto;color:var(--muted);font-size:12px}
/* 第2区（时间区间）日期框缩小约 1/4，剩余空间靠右留白，不撑满 */
.adv-grid-3 .adv-range{justify-content:flex-start}
.adv-grid-3 .adv-range input[type=date]{flex:0 1 calc(37.5% - 6px);min-width:7rem}
/* 第3区（数值&金额区间）输入框缩小约 1/6+、横向间距加大（作用域隔离，不影响第1/4区） */
.adv-grid-num{column-gap:28px}
.adv-grid-num .adv-range{justify-content:flex-start}
.adv-grid-num .adv-range input[type=text]{flex:0 1 calc(40% - 6px);min-width:6rem}
.adv-hint{font-size:11px;font-weight:400;color:var(--muted)}
.adv-hint.warn{color:var(--warn)}
.adv-actions{margin:2px 0 16px;display:flex;justify-content:flex-end;gap:10px}
.btn-success{background:var(--ok);border-color:var(--ok);color:#fff}
.btn-success:hover{opacity:.9;color:#fff}
.adv-sec-body textarea{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:5px;
  background:#fff;color:var(--text);font:inherit;resize:vertical}
/* 首屏空表待查询提示 */
.adv-empty{margin:2px 0 16px;padding:26px 16px;border:1px dashed var(--line);border-radius:8px;
  background:var(--panel);text-align:center}
.adv-sql-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}
.adv-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 10px;font-size:13px;color:var(--muted)}
.adv-toolbar select,.adv-toolbar input{padding:4px 7px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--text)}

/* 高级查询：列表下方分页栏（每页选择+总条数在左，翻页在右） */
.adv-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;flex-wrap:wrap}
.adv-pager .pager-left{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.adv-pager .pager-left select,.adv-pager .pager-left input{padding:4px 7px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--text)}
.adv-pager .pager-right{display:flex;align-items:center;gap:10px}

/* 订单列表：列拖动重排 */
.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0;flex-wrap:wrap}
.table-toolbar .hint{color:#6b7280;font-size:12px}
.col-draggable{cursor:grab;user-select:none}
.col-draggable:active{cursor:grabbing}
.col-dragging{opacity:.45;background:#eef6ff}
.col-dragover{outline:2px dashed #3b82f6;outline-offset:-2px;background:#f0f7ff}
.col-fixed{cursor:default;background:#f3f4f6;color:#6b7280}
.sort-ind{font-size:10px;color:#9ca3af;margin-left:3px;font-weight:normal}
.col-sorted{background:#eef6ff}

/* ── 订单列表：横向滚动 + 首末列冻结 + 列宽拖拽 + 单元格省略 ── */
.order-table-wrap{
  overflow-x:auto;            /* 横向滚动在此发生 */
  overflow-y:auto;            /* 显式写出，不依赖「一轴非 visible 时另一轴 visible 会算成 auto」的隐式规则 */
  max-height:clamp(240px, calc(100vh - 240px), 900px);  /* 有了高度上限，纵向滚动才发生在容器内，thead 的 sticky 才生效 */
  width:100%;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
}
.order-table-wrap .table{
  table-layout:fixed;         /* 列宽由 th 的 width 决定，支持拖拽改宽 */
  min-width:100%;             /* 列总宽超过容器即出现横向滚动条 */
  font-size:13px;
  box-sizing:border-box;
}
.order-table-wrap .table th,
.order-table-wrap .table td{
  box-sizing:border-box;      /* th 上设置的 width 含 padding/border，宽度可预测 */
}
/* 各列默认宽度（data-col 为服务端原始索引，作为稳定键） */
.order-table-wrap .table th[data-col="0"]{width:110px}
.order-table-wrap .table th[data-col="1"]{width:190px}
.order-table-wrap .table th[data-col="2"]{width:180px}
.order-table-wrap .table th[data-col="13"]{width:70px}
.order-table-wrap .table th[data-col="14"]{width:150px}
.order-table-wrap .table th[data-col="3"]{width:60px}
.order-table-wrap .table th[data-col="4"]{width:80px}
.order-table-wrap .table th[data-col="5"]{width:80px}
.order-table-wrap .table th[data-col="6"]{width:80px}
.order-table-wrap .table th[data-col="7"]{width:80px}
.order-table-wrap .table th[data-col="8"]{width:120px}
.order-table-wrap .table th[data-col="9"]{width:80px}
.order-table-wrap .table th[data-col="10"]{width:88px}
.order-table-wrap .table th[data-col="11"]{width:66px}
.order-table-wrap .table th[data-col="12"]{width:64px}
/* 新增列默认宽度（data-col 15~24） */
.order-table-wrap .table th[data-col="15"]{width:120px}  /* 联系电话 */
.order-table-wrap .table th[data-col="16"]{width:200px}  /* 投递地址 */
.order-table-wrap .table th[data-col="17"]{width:90px}  /* 起订日期 */
.order-table-wrap .table th[data-col="18"]{width:90px}  /* 截止日期 */
.order-table-wrap .table th[data-col="19"]{width:90px}  /* 开票日期 */
.order-table-wrap .table th[data-col="20"]{width:90px}  /* 收款日期 */
.order-table-wrap .table th[data-col="21"]{width:80px}  /* 征订变更 */
.order-table-wrap .table th[data-col="22"]{width:90px}  /* 征订日期 */
.order-table-wrap .table th[data-col="23"]{width:90px}  /* 审核日期 */
.order-table-wrap .table th[data-col="24"]{width:180px}  /* 备注 */

/* 新增列默认宽度（data-col 25~28，订单管理页与高级查询页共用；
   不写宽度在 table-layout:fixed 下会被相邻定宽列挤成 ~0 宽而看不见） */
.order-table-wrap .table th[data-col="25"]{width:90px}  /* 订单创建人 */
.order-table-wrap .table th[data-col="26"]{width:80px}  /* 录入来源 */
.order-table-wrap .table th[data-col="27"]{width:80px}  /* 开票状态 */
.order-table-wrap .table th[data-col="28"]{width:80px}  /* 收款状态 */

/* 单元格内容统一装进块级容器做单行省略（table-cell 本身不支持 text-overflow） */
.order-table-wrap .table th .cell-clip,
.order-table-wrap .table td .cell-clip{
  display:block;width:100%;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  line-height:1.5;
}
.order-table-wrap .table td .cell-clip a{display:inline}

/* 冻结「订单号」列（左）与「操作」列（右），按身份固定，与列顺序无关 */
.order-table-wrap .table thead th[data-col="0"],
.order-table-wrap .table tbody td[data-col="0"]{
  position:sticky; left:0; z-index:2;
  background:#fff;
  box-shadow:2px 0 5px -2px rgba(17,28,45,.18);
}
.order-table-wrap .table thead th.col-fixed,
.order-table-wrap .table tbody td[data-col="12"]{
  position:sticky; right:0; z-index:2;
  background:#fff;
  box-shadow:-2px 0 5px -2px rgba(17,28,45,.18);
}
/* 表头行固定；冻结角层级最高 */
.order-table-wrap .table thead th{
  position:sticky; top:0; z-index:3;
  background:#f0f2f5;                       /* 加深，便于纵向滚动时与数据行区分 */
  /* border-collapse:collapse 下边框归 table 所有，sticky 的 th 会丢掉 border-bottom，
     故用 inset 阴影伪造表头下边线 */
  box-shadow:inset 0 -1px 0 var(--line);
}
/* 交叉单元格两向都冻结，层级最高；同时必须把上面的下边线与左右冻结阴影合并，
   否则被这里的更高特异性覆盖后会缺横线（左右阴影正负号分别对应左冻结/右冻结） */
.order-table-wrap .table thead th[data-col="0"]{
  z-index:4;background:#f0f2f5;
  box-shadow:inset 0 -1px 0 var(--line), 2px 0 5px -2px rgba(17,28,45,.18);
}
.order-table-wrap .table thead th.col-fixed{
  z-index:4;background:#f0f2f5;
  box-shadow:inset 0 -1px 0 var(--line), -2px 0 5px -2px rgba(17,28,45,.18);
}

/* 整行高亮。冻结列为了遮挡横向滚过的内容必须是不透明背景，
   不单独覆盖的话 hover 时首尾两格仍是白色，看起来像高亮断开 */
.order-table-wrap .table tbody tr:hover > td{background:#f6f8fb}
.order-table-wrap .table tbody tr:hover > td[data-col="0"],
.order-table-wrap .table tbody tr:hover > td[data-col="12"]{background:#f6f8fb}

/* ── 行选中（点击着色，Ctrl/Shift 多选）──
   必须写在 hover 规则之后：两者特异性相同（0,4,3），靠「后写者胜」保证选中色压过 hover 色。
   冻结列（data-col 0/12）背景是不透明的 #fff，同样要单独覆盖，否则首尾两格不着色。 */
.order-table-wrap .table tbody tr.row-sel > td{background:#dce9ff}
.order-table-wrap .table tbody tr.row-sel > td[data-col="0"],
.order-table-wrap .table tbody tr.row-sel > td[data-col="12"]{background:#dce9ff}
/* 选中行仍要能看出 hover 反馈，故再深一档（0,5,3 高于上面） */
.order-table-wrap .table tbody tr.row-sel:hover > td{background:#c9dcff}
.order-table-wrap .table tbody tr.row-sel:hover > td[data-col="0"],
.order-table-wrap .table tbody tr.row-sel:hover > td[data-col="12"]{background:#c9dcff}
/* ── 已「武装」（Alt 按下 或 长按到点）= 提示这行现在可以拖了 ──
   武装态只在拖拽前一瞬出现（tr.draggable 被临时打开），与拖动中同为 #bcd6ff，
   语义是「颜色越深 = 越接近被搬走」。
   ⚠️ 必须再写一份 :hover 变体：`.row-sel:hover` 是 (0,5,3)，单写 `.row-sel.row-armed` 只有 (0,4,3)，
      悬停时会被 hover 色压掉，武装提示就看不见了。 */
.order-table-wrap .table tbody tr.row-sel.row-armed > td,
.order-table-wrap .table tbody tr.row-sel.row-armed:hover > td{background:#bcd6ff}
.order-table-wrap .table tbody tr.row-sel.row-armed > td[data-col="0"],
.order-table-wrap .table tbody tr.row-sel.row-armed:hover > td[data-col="0"],
.order-table-wrap .table tbody tr.row-sel.row-armed > td[data-col="12"],
.order-table-wrap .table tbody tr.row-sel.row-armed:hover > td[data-col="12"]{background:#bcd6ff}

/* ── 选中行拖拽排序的视觉反馈 ──
   插入线用 inset 阴影画（避免 border 改变行高）；冻结列要把它和左右阴影合并写，
   否则会丢掉列分隔阴影。 */
/* 光标只在「已武装」时才变抓手 —— 选中但未武装时仍是普通光标，
   因为此刻 tr.draggable 为 false，拖不动；这也顺带提示用户"现在还能框选文字"。 */
.order-table-wrap .table tbody tr.row-armed{cursor:grab}
.order-table-wrap .table tbody tr.row-armed:active{cursor:grabbing}
/* 订单号后的锁定标识：单独包一层，便于双击全选时用 setEndBefore 把它剔除，
   复制出来的订单号才不会带上 🔒 */
.order-table-wrap .table td .lock{opacity:.9}
/* 拖动中的行：比选中色再深一档，且**不降透明度**。
   早期用 opacity:.4 会让整行发白发淡，容易被误读成「拖完之后颜色变灰/失效了」。 */
.order-table-wrap .table tbody tr.row-sel.row-dragging > td{background:#bcd6ff}
.order-table-wrap .table tbody tr.row-sel.row-dragging > td[data-col="0"],
.order-table-wrap .table tbody tr.row-sel.row-dragging > td[data-col="12"]{background:#bcd6ff}
.order-table-wrap .table tbody tr.row-drop-before > td{box-shadow:inset 0 2px 0 0 var(--primary)}
.order-table-wrap .table tbody tr.row-drop-after  > td{box-shadow:inset 0 -2px 0 0 var(--primary)}
.order-table-wrap .table tbody tr.row-drop-before > td[data-col="0"]{
  box-shadow:inset 0 2px 0 0 var(--primary), 2px 0 5px -2px rgba(17,28,45,.18);
}
.order-table-wrap .table tbody tr.row-drop-before > td[data-col="12"]{
  box-shadow:inset 0 2px 0 0 var(--primary), -2px 0 5px -2px rgba(17,28,45,.18);
}
.order-table-wrap .table tbody tr.row-drop-after > td[data-col="0"]{
  box-shadow:inset 0 -2px 0 0 var(--primary), 2px 0 5px -2px rgba(17,28,45,.18);
}
.order-table-wrap .table tbody tr.row-drop-after > td[data-col="12"]{
  box-shadow:inset 0 -2px 0 0 var(--primary), -2px 0 5px -2px rgba(17,28,45,.18);
}

/* 列宽拖拽手柄（每列右缘，操作列除外） */
.order-table-wrap .table th{position:relative}

/* 大表分块渲染：未轮到展示批次的行先隐藏，避免首屏一次性布局几千行。
   由 order-list.js 按帧分批移除 .col-deferred 并补做单元格包裹。 */
.order-table-wrap .table tr.col-deferred{display:none}
.col-resizer{
  position:absolute; right:0; top:0; width:4px; height:100%;
  cursor:col-resize; z-index:6; background:transparent;
}
.col-resizer:hover{background:rgba(59,130,246,.45)}
.order-table-wrap .table th.col-resizing{user-select:none}

/* 订单详情：备注栏可能有多行（表单备注 + 时间线备注流） */
.cell-remark{white-space:normal;line-height:1.7;word-break:break-word}

/* 通用确认弹窗（由 order-form.js 动态创建）：0 元赠阅保存二次确认 */
.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:rgba(17,28,45,.45);
  display:flex;align-items:center;justify-content:center;padding:16px}
.modal{width:100%;max-width:430px;background:#fff;border-radius:8px;
  box-shadow:0 14px 36px rgba(17,28,45,.24);overflow:hidden}
.modal-hd{padding:13px 18px;border-bottom:1px solid var(--line);font-size:15px;font-weight:600;color:var(--text)}
.modal-bd{padding:14px 18px;font-size:13px;line-height:1.75;color:var(--text)}
.modal-bd p{margin:0 0 8px}
.modal-zero{font-size:17px;color:var(--danger)}
.modal-kv{display:flex;gap:10px;font-size:13px}
.modal-kv span:first-child{color:var(--muted);min-width:64px;flex-shrink:0}
.modal-warn{margin-top:10px;padding:8px 10px;border:1px solid #ffe0a3;background:#fff8e8;
  border-radius:6px;font-size:12px;line-height:1.6;color:#8a5b00}
.modal-ft{padding:12px 18px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px}

/* =========================================================================
   顶栏折叠菜单（原生 <details>，与主题无关）
   ========================================================================= */
.nav details.menu-host{position:relative;display:inline-block}
.nav details.menu-host>summary{list-style:none;cursor:pointer;padding:4px 8px;border-radius:5px;color:var(--text);user-select:none}
.nav details.menu-host>summary::-webkit-details-marker{display:none}
.nav details.menu-host>summary::after{content:" \25BE";font-size:10px;opacity:.55}
.nav details.menu-host>summary:hover,
.nav details.menu-host>summary.is-active,
.nav details.menu-host[open]>summary{background:var(--tint-blue);color:var(--primary)}

.userbox details.ubox{position:relative;display:inline-block}
.userbox details.ubox>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  padding:4px 8px;border-radius:6px;color:var(--text);user-select:none}
.userbox details.ubox>summary::-webkit-details-marker{display:none}
.userbox details.ubox>summary::after{content:" \25BE";font-size:10px;opacity:.55}
.userbox details.ubox[open]>summary{background:var(--tint-blue);color:var(--primary)}

/* 弹出面板（右对齐由宿主 .userbox 控制） */
.menu{position:absolute;top:100%;left:0;min-width:172px;margin:6px 0 0;padding:6px;list-style:none;
  background:var(--panel);border:1px solid var(--line);border-radius:9px;
  box-shadow:0 8px 22px rgba(0,0,0,.18);z-index:60}
.userbox .menu{right:0;left:auto}
.menu a{display:block;padding:7px 10px;border-radius:6px;color:var(--text);text-decoration:none;white-space:nowrap}
.menu a:hover{background:var(--tint-blue);color:var(--primary)}
.menu li.sep-li{height:0;border-top:1px solid var(--line);margin:6px 4px}
.menu a.danger{color:var(--danger)}
.menu a.danger:hover{background:var(--tint-red);color:var(--danger)}
.muted-label{color:var(--muted);font-size:12px;padding:2px 10px}

/* 主题色板（用户菜单内） */
.theme-row{display:flex;gap:7px;padding:6px 10px}
.theme-row .sw{width:20px;height:20px;border-radius:5px;cursor:pointer;border:1px solid var(--line);position:relative}
.theme-row .sw:hover{transform:scale(1.08)}
.theme-row .sw.on{outline:2px solid var(--primary);outline-offset:1px}
.theme-row .sw.on::after{content:"\2713";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:12px;text-shadow:0 0 2px rgba(0,0,0,.6)}

/* =========================================================================
   主题变量块：4 套非默认主题，每套只改 29 个变量（选择器 html[data-theme=...]）
   正式上线时由 <head> 内联脚本在渲染前写入 data-theme，避免刷新闪白。
   ========================================================================= */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0f1216; --panel:#181c22; --line:#2a3038; --text:#e6e9ef; --muted:#8b949e;
  --primary:#5b8def; --danger:#e5534b; --ok:#3fb950; --warn:#d29922;
  --surface-2:#20262e; --surface-3:#262d36; --surface-input:#151a20;
  --tint-blue:#16233a; --tint-green:#12261a; --tint-red:#2b1618; --tint-amber:#2a2113; --tint-purple:#221a2e;
  --row-hover:#262d36; --row-sel:#1c3a5e; --row-sel-hover:#22477a; --row-armed:#2a5a91;
  --fg-blue:#8ab4f8; --fg-green:#7ee08e; --fg-red:#f08a84; --fg-amber:#e3b341; --fg-purple:#c39bf0;
  --tooltip-bg:#000; --tooltip-fg:#e6e9ef; --mask:rgba(0,0,0,.6);
}
html[data-theme="warm"]{
  color-scheme:light;
  --bg:#f2e9d8; --panel:#faf4e8; --line:#ddd0b6; --text:#43382a; --muted:#8b7a62;
  --primary:#a3601f; --danger:#b83c31; --ok:#5c7a3b; --warn:#a8741a;
  --surface-2:#f5eddd; --surface-3:#eee3ce; --surface-input:#fffdf8;
  --tint-blue:#ece1c6; --tint-green:#e7ebd2; --tint-red:#f4dcd0; --tint-amber:#f8e6bf; --tint-purple:#eee0d2;
  --row-hover:#efe5d0; --row-sel:#e2d3b0; --row-sel-hover:#d6c49c; --row-armed:#c9b489;
  --fg-blue:#8a5b16; --fg-green:#4d6b2f; --fg-red:#a63a2c; --fg-amber:#8a6410; --fg-purple:#7b4a63;
  --tooltip-bg:#3a3025; --tooltip-fg:#f7f0e0; --mask:rgba(60,48,32,.45);
}
html[data-theme="pink"]{
  color-scheme:light;
  --bg:#fdf2f6; --panel:#fffafc; --line:#f0d6e2; --text:#3d2b33; --muted:#8f7380;
  --primary:#d6336c; --danger:#c92a2a; --ok:#2f9e6e; --warn:#b8860b;
  --surface-2:#fdf0f5; --surface-3:#fae4ee; --surface-input:#fffdfe;
  --tint-blue:#eae8fb; --tint-green:#e6f5ec; --tint-red:#fde8ec; --tint-amber:#fdf0dc; --tint-purple:#f3e6f8;
  --row-hover:#fdf1f6; --row-sel:#fad9e6; --row-sel-hover:#f7c6d9; --row-armed:#f2b3cc;
  --fg-blue:#6b5bd0; --fg-green:#2f8a5f; --fg-red:#c92a4e; --fg-amber:#a8761a; --fg-purple:#8a4bbd;
  --tooltip-bg:#3d2b33; --tooltip-fg:#fff; --mask:rgba(61,43,51,.42);
}
html[data-theme="blue"]{
  color-scheme:light;
  --bg:#eef4fb; --panel:#fff; --line:#d3e0f0; --text:#17263a; --muted:#5f7189;
  --primary:#1f6fd0; --danger:#c53030; --ok:#0f8a5f; --warn:#a86b12;
  --surface-2:#f2f7fd; --surface-3:#e6effa; --surface-input:#fff;
  --tint-blue:#e2eefc; --tint-green:#e3f4ec; --tint-red:#fdeaea; --tint-amber:#fdf2e0; --tint-purple:#eee9fb;
  --row-hover:#eaf2fb; --row-sel:#cfe2f8; --row-sel-hover:#b9d5f5; --row-armed:#a4c8f2;
  --fg-blue:#1a5fa8; --fg-green:#0f7a55; --fg-red:#b52d2d; --fg-amber:#8f5c10; --fg-purple:#6b4bb8;
  --tooltip-bg:#17263a; --tooltip-fg:#fff; --mask:rgba(20,40,70,.4);
}

/* =========================================================================
   公共覆盖层：4 套主题共用这一份（选择器统一 :not([data-theme="light"])）。
   把 app.css 里硬编码的浅色，改成消费上面的变量。
   ========================================================================= */
:root:not([data-theme="light"]) body{background:var(--bg);color:var(--text)}
:root:not([data-theme="light"]) code{background:var(--surface-2);color:var(--text)}
:root:not([data-theme="light"]) .topbar{background:var(--panel);border-bottom-color:var(--line)}
:root:not([data-theme="light"]) .nav a.active,
:root:not([data-theme="light"]) .nav a:hover{background:var(--tint-blue);color:var(--primary)}

/* 提示条 */
:root:not([data-theme="light"]) .alert-success{background:var(--tint-green);color:var(--ok);border-color:var(--line)}
:root:not([data-theme="light"]) .alert-error{background:var(--tint-red);color:var(--danger);border-color:var(--line)}
:root:not([data-theme="light"]) .alert-warning{background:var(--tint-amber);color:var(--warn);border-color:var(--line)}
:root:not([data-theme="light"]) .alert-info{background:var(--tint-blue);color:var(--fg-blue);border-color:var(--line)}
:root:not([data-theme="light"]) .mysql-only{background:var(--surface-2);border-color:var(--line)}

/* 表格 */
:root:not([data-theme="light"]) .table th{background:var(--surface-2)}
:root:not([data-theme="light"]) .table tr.subrow td{background:var(--surface-2)}
:root:not([data-theme="light"]) .table tr.row-danger td{background:var(--tint-red)}

/* 表单控件（原 #fff / #f7f8fa） */
:root:not([data-theme="light"]) .form input,
:root:not([data-theme="light"]) .form select,
:root:not([data-theme="light"]) .filters input,
:root:not([data-theme="light"]) .filters select,
:root:not([data-theme="light"]) .filter input,
:root:not([data-theme="light"]) .filter select,
:root:not([data-theme="light"]) .order-form input,
:root:not([data-theme="light"]) .order-form select,
:root:not([data-theme="light"]) .order-form textarea,
:root:not([data-theme="light"]) .adv-field select,
:root:not([data-theme="light"]) .adv-field input[type=text],
:root:not([data-theme="light"]) .adv-field input[type=date],
:root:not([data-theme="light"]) .adv-sec-body textarea,
:root:not([data-theme="light"]) .adv-toolbar select,
:root:not([data-theme="light"]) .adv-toolbar input,
:root:not([data-theme="light"]) .adv-pager .pager-left select,
:root:not([data-theme="light"]) .adv-pager .pager-left input{
  background:var(--surface-input);color:var(--text);border-color:var(--line)
}
:root:not([data-theme="light"]) .order-form input[readonly]{background:var(--surface-2);color:var(--muted)}

/* 按钮 */
:root:not([data-theme="light"]) .btn{background:var(--surface-2);color:var(--text);border-color:var(--line)}
:root:not([data-theme="light"]) .btn:hover{border-color:var(--primary);color:var(--primary)}
:root:not([data-theme="light"]) .btn-danger{color:var(--danger);border-color:var(--line)}
:root:not([data-theme="light"]) .btn-red-soft{background:var(--tint-red);border-color:var(--line);color:var(--fg-red)}
:root:not([data-theme="light"]) .btn-red-soft:hover{background:#F53F3F;border-color:#F53F3F;color:#fff}

/* 标签 / 徽标 */
:root:not([data-theme="light"]) .tag{background:var(--surface-2);color:var(--muted)}
:root:not([data-theme="light"]) .tag-admin,
:root:not([data-theme="light"]) .tag-read{background:var(--tint-blue);color:var(--fg-blue)}
:root:not([data-theme="light"]) .tag-tracker,
:root:not([data-theme="light"]) .tag-completed{background:var(--tint-green);color:var(--fg-green)}
:root:not([data-theme="light"]) .tag-supervisor{background:var(--tint-purple);color:var(--fg-purple)}
:root:not([data-theme="light"]) .tag-write,
:root:not([data-theme="light"]) .tag-out{background:var(--tint-red);color:var(--fg-red)}
:root:not([data-theme="light"]) .tag-revoked{background:var(--tint-amber);color:var(--fg-amber)}
:root:not([data-theme="light"]) .tag-draft,
:root:not([data-theme="light"]) .tag-todo{background:var(--surface-2);color:var(--muted)}
:root:not([data-theme="light"]) .chip,
:root:not([data-theme="light"]) .chip-mini{background:var(--surface-2);color:var(--muted)}
:root:not([data-theme="light"]) .chip-danger{background:var(--tint-red);color:var(--fg-red)}
:root:not([data-theme="light"]) .chip-warn{background:var(--tint-amber);color:var(--fg-amber)}
:root:not([data-theme="light"]) .notice-line{background:var(--tint-amber);color:var(--fg-amber);border-left-color:var(--warn)}

/* 卡片 / 统计 / 看板 / 面板类容器 */
:root:not([data-theme="light"]) .card,
:root:not([data-theme="light"]) .kv,
:root:not([data-theme="light"]) .adv-sec{background:var(--panel)}
:root:not([data-theme="light"]) .stat,
:root:not([data-theme="light"]) .kv th,
:root:not([data-theme="light"]) .dash-card,
:root:not([data-theme="light"]) .chart-box,
:root:not([data-theme="light"]) .import-confirm,
:root:not([data-theme="light"]) .perm-legend,
:root:not([data-theme="light"]) .stages li,
:root:not([data-theme="light"]) details.fold-sub{background:var(--surface-2)}
:root:not([data-theme="light"]) .stat-warn{background:var(--tint-amber);border-color:var(--line)}
:root:not([data-theme="light"]) .dash-card-over{background:var(--tint-red);border-color:var(--line)}
:root:not([data-theme="light"]) .bar{background:var(--surface-2)}
:root:not([data-theme="light"]) .dash-group-head[role=button]:hover{background:var(--surface-3)}
:root:not([data-theme="light"]) .agg{background:var(--tint-blue);color:var(--fg-blue);border-color:var(--line)}

/* 详情页：阶段条 / 时间线 / 折叠计数 */
:root:not([data-theme="light"]) .stages li.done{background:var(--tint-green);border-color:var(--line);color:var(--ok)}
:root:not([data-theme="light"]) .stages li .stage-hint{background:var(--tint-amber);color:var(--fg-amber)}
:root:not([data-theme="light"]) .stages li.done .stage-hint{background:var(--tint-green);color:var(--fg-green)}
:root:not([data-theme="light"]) .fold-title .count{background:var(--surface-2);color:var(--muted)}
:root:not([data-theme="light"]) details.fold[open]>.fold-title .count{background:var(--tint-blue);color:var(--fg-blue)}
:root:not([data-theme="light"]) .timeline .op{color:var(--fg-blue)}
:root:not([data-theme="light"]) .no-hint.warn{color:var(--fg-amber)}

/* ⚠️ 反色气泡：原规则 background:var(--text)+color:#fff，深色下 --text 变浅会变浅底白字，必须反用 tooltip 变量 */
:root:not([data-theme="light"]) .cat-field .cat-full{background:var(--tooltip-bg);color:var(--tooltip-fg);border:1px solid var(--line)}

/* 分类下拉 */
:root:not([data-theme="light"]) .cat-panel{background:var(--surface-2);border-color:var(--line)}
:root:not([data-theme="light"]) .cat-opt.is-selected{background:var(--tint-blue)}
:root:not([data-theme="light"]) .cat-opt:hover,
:root:not([data-theme="light"]) .cat-opt.is-active{background:var(--surface-3)}
:root:not([data-theme="light"]) .cat-panel mark{background:var(--tint-blue);color:var(--fg-blue)}
:root:not([data-theme="light"]) .order-form .field-label:hover{background:var(--surface-3);color:var(--text)}

/* 列头拖动 */
:root:not([data-theme="light"]) .table-toolbar .hint{color:var(--muted)}
:root:not([data-theme="light"]) .col-dragging{background:var(--tint-blue)}
:root:not([data-theme="light"]) .col-dragover{outline-color:var(--primary);background:var(--tint-blue)}
:root:not([data-theme="light"]) .col-fixed{background:var(--surface-2);color:var(--muted)}
:root:not([data-theme="light"]) .col-sorted{background:var(--tint-blue)}
:root:not([data-theme="light"]) .sort-ind{color:var(--muted)}

/* ── 订单列表：滚动容器 / 冻结列 / 行状态 ── */
:root:not([data-theme="light"]) .order-table-wrap{background:var(--panel)}
:root:not([data-theme="light"]) .order-table-wrap .table thead th{background:var(--surface-2)}
:root:not([data-theme="light"]) .order-table-wrap .table thead th[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table thead th.col-fixed{background:var(--surface-2)}
:root:not([data-theme="light"]) .order-table-wrap .table tbody td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody td[data-col="12"]{background:var(--panel)}
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr:hover > td,
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr:hover > td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr:hover > td[data-col="12"]{background:var(--row-hover)}
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel > td,
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel > td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel > td[data-col="12"]{background:var(--row-sel)}
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel:hover > td,
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel:hover > td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel:hover > td[data-col="12"]{background:var(--row-sel-hover)}
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-armed > td,
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-armed:hover > td,
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-armed > td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-armed:hover > td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-armed > td[data-col="12"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-armed:hover > td[data-col="12"]{background:var(--row-armed)}
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-dragging > td,
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-dragging > td[data-col="0"],
:root:not([data-theme="light"]) .order-table-wrap .table tbody tr.row-sel.row-dragging > td[data-col="12"]{background:var(--row-armed)}

/* 弹窗 / 安装页 */
:root:not([data-theme="light"]) .modal-mask{background:var(--mask)}
:root:not([data-theme="light"]) .modal{background:var(--panel)}
:root:not([data-theme="light"]) .modal-warn{background:var(--tint-amber);border-color:var(--line);color:var(--fg-amber)}
:root:not([data-theme="light"]) .blank,
:root:not([data-theme="light"]) .install{background:var(--bg)}
:root:not([data-theme="light"]) .blank-box,
:root:not([data-theme="light"]) .install-box{background:var(--panel)}