/* ============================================================
   模块专用样式
   ============================================================ */

/* ---------- 首页 待办 / 模块 ---------- */
.todo-list{display:flex;flex-direction:column}
.todo-item{
  display:flex;align-items:center;gap:11px;padding:10px 4px;
  border-bottom:1px solid var(--line-2);cursor:pointer;border-radius:7px;
  transition:background .14s;
}
.todo-item:last-child{border-bottom:none}
.todo-item:hover{background:#FAFBFD;padding-left:8px}
.todo-ico{
  width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:0 0 auto;
}
.todo-ico svg{width:15px;height:15px}
.todo-name{font-size:12.5px;color:var(--ink-2);flex:1}
.todo-n{font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums}

.mod-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mod-card{
  display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--r);
  border:1px solid var(--line);background:#fff;cursor:pointer;transition:all .16s;
}
.mod-card:hover{border-color:var(--brand-100);box-shadow:0 4px 14px rgba(46,107,255,.1);transform:translateY(-1px)}
.mod-ico{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:0 0 auto}
.mod-ico svg{width:18px;height:18px}
.mod-t{font-size:13px;font-weight:600}
.mod-s{font-size:11px;color:var(--muted);margin-top:1px}

/* 预警列表 */
.alert-item{
  display:flex;align-items:center;gap:11px;padding:11px 4px;
  border-bottom:1px solid var(--line-2);
}
.alert-item:last-child{border-bottom:none}
.alert-dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.alert-body{flex:1;min-width:0}
.alert-sup{font-size:12.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alert-txt{font-size:11.5px;color:var(--muted);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 公告 */
.notice-item{display:flex;gap:11px;padding:12px 4px;border-bottom:1px solid var(--line-2);align-items:flex-start}
.notice-item:last-child{border-bottom:none}
.notice-txt{flex:1;font-size:12.5px;color:var(--ink-2);line-height:1.6}
.notice-date{font-size:11px;color:var(--faint);white-space:nowrap}

/* 快捷入口 */
.quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.quick-card{
  display:flex;flex-direction:column;align-items:center;gap:9px;padding:18px 10px;
  border-radius:var(--r);border:1px solid var(--line);background:#fff;cursor:pointer;
  transition:all .16s;
}
.quick-card:hover{border-color:var(--brand-100);background:var(--brand-50);transform:translateY(-2px)}
.quick-ico{width:40px;height:40px;border-radius:11px;display:grid;place-items:center}
.quick-ico svg{width:19px;height:19px}
.quick-name{font-size:12.5px;font-weight:500}

/* 图例 */
.legend{display:flex;flex-direction:column;gap:11px}
.legend-item{display:flex;align-items:center;gap:9px;font-size:12.5px}
.legend-dot{width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.legend-val{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
.legend-name{color:var(--ink-2)}

/* ---------- 水平条 ---------- */
.hb-row{display:flex;align-items:center;gap:12px;padding:7px 0}
.hb-name{flex:0 0 96px;font-size:12.5px;color:var(--ink-2);display:flex;align-items:center;gap:7px}
.hb-bar{flex:1;height:7px;border-radius:4px;background:#EFF2F7;overflow:hidden}
.hb-bar i{display:block;height:100%;border-radius:4px;transition:width .5s}
.hb-val{flex:0 0 46px;text-align:right;font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums}

/* ---------- 供应商目录卡 ---------- */
.sup-card{
  border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;
  padding:16px;transition:all .18s;cursor:pointer;position:relative;
}
.sup-card:hover{border-color:var(--brand-100);box-shadow:0 6px 20px rgba(21,34,64,.08);transform:translateY(-2px)}
.sup-card-hd{display:flex;align-items:flex-start;gap:11px;margin-bottom:13px}
.sup-card-name{font-size:13.5px;font-weight:600;line-height:1.3;margin-bottom:3px}
.sup-card-id{font-size:11px;color:var(--muted)}
.sup-card-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:11px 0;border-top:1px dashed var(--line-2);border-bottom:1px dashed var(--line-2)}
.sup-metric{text-align:center}
.sup-metric .mv{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.2}
.sup-metric .mk{font-size:10.5px;color:var(--muted);margin-top:2px}
.sup-card-foot{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.sup-tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}

/* ---------- 评分维度条 ---------- */
.dim-row{display:flex;align-items:center;gap:12px;padding:9px 0}
.dim-name{flex:0 0 80px;font-size:12.5px;color:var(--ink-2)}
.dim-weight{flex:0 0 40px;font-size:11px;color:var(--faint)}
.dim-bar{flex:1;height:7px;border-radius:4px;background:#EFF2F7;overflow:hidden}
.dim-bar i{display:block;height:100%;border-radius:4px;transition:width .45s cubic-bezier(.4,0,.2,1)}
.dim-val{flex:0 0 34px;text-align:right;font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums}

/* ---------- 订单明细行 ---------- */
.item-line{
  display:flex;align-items:center;gap:11px;padding:11px 13px;
  border:1px solid var(--line);border-radius:var(--r);margin-bottom:9px;background:#fff;
}
.item-line .il-ico{
  width:32px;height:32px;border-radius:8px;background:var(--brand-50);color:var(--brand);
  display:grid;place-items:center;flex:0 0 auto;
}
.item-line .il-ico svg{width:16px;height:16px}
.item-line .il-body{flex:1;min-width:0}
.item-line .il-name{font-size:12.5px;font-weight:500}
.item-line .il-code{font-size:11px;color:var(--muted);margin-top:1px}
.item-line .il-qty{font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.item-line .il-price{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.item-line .il-del{color:var(--faint);padding:4px;border-radius:6px}
.item-line .il-del:hover{color:var(--danger);background:var(--danger-50)}
.item-line .il-del svg{width:14px;height:14px;display:block}

/* ---------- 下单物料选择器 ---------- */
.mat-pick{
  display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:var(--r);
  border:1px solid var(--line);cursor:pointer;transition:all .14s;margin-bottom:8px;background:#fff;
}
.mat-pick:hover{border-color:var(--brand);background:var(--brand-50)}
.mat-pick .mp-body{flex:1;min-width:0}
.mat-pick .mp-name{font-size:12.5px;font-weight:500}
.mat-pick .mp-meta{font-size:11px;color:var(--muted);margin-top:2px}
.mat-pick .mp-price{font-size:13px;font-weight:600;color:var(--brand);font-variant-numeric:tabular-nums}
.mat-pick .mp-add{width:24px;height:24px;border-radius:7px;background:var(--brand-50);color:var(--brand);display:grid;place-items:center;flex:0 0 auto}
.mat-pick .mp-add svg{width:13px;height:13px}

/* 订单金额汇总 */
.sum-box{background:#F7F9FE;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.sum-line{display:flex;align-items:center;font-size:12.5px;padding:4px 0;color:var(--ink-2)}
.sum-line .sv{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
.sum-line.total{border-top:1px dashed var(--line);margin-top:7px;padding-top:10px;font-size:13.5px;font-weight:600;color:var(--ink)}
.sum-line.total .sv{font-size:17px;color:var(--brand)}

/* ---------- 验收检验项 ---------- */
.dim-check{
  display:flex;align-items:center;gap:11px;padding:10px 13px;border-radius:var(--r);
  border:1px solid var(--line);margin-bottom:8px;background:#fff;
}
.dim-check .dc-k{font-size:12.5px;color:var(--ink-2);flex:0 0 108px}
.dim-check .dc-v{font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;flex:1}
.dim-check .dc-ok{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600}
.dim-check.ok{background:#FBFFFC;border-color:#DFF2E7}
.dim-check.ok .dc-ok{color:var(--ok)}
.dim-check.no{background:#FFFCFC;border-color:#FBE3E0}
.dim-check.no .dc-ok{color:var(--danger)}
.dim-check .dc-ok svg{width:13px;height:13px}

/* 抽检结果统计 */
.iqc-stat{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px;
}
.iqc-cell{
  padding:13px 14px;border-radius:var(--r);background:#FAFBFD;border:1px solid var(--line);
  text-align:center;
}
.iqc-cell .iv{font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.2}
.iqc-cell .ik{font-size:11px;color:var(--muted);margin-top:3px}

/* 评分滑杆区 */
.slider-panel{background:#FCFDFF;border:1px solid var(--line);border-radius:var(--r);padding:6px 16px}

/* 图表容器：固定宽高比，避免窄屏拉伸变形 */
.chart-box{
  position:relative;width:100%;aspect-ratio:1 / 1;
  max-height:280px;margin:0 auto;
}
.chart-box.wide{aspect-ratio:16 / 9;max-height:none}
.chart-box canvas{position:absolute;inset:0;width:100%;height:100%}

/* 排名表 */
.rank-no{
  width:24px;height:24px;border-radius:7px;display:grid;place-items:center;
  font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;
}
.rank-1{background:linear-gradient(135deg,#FFD86B,#F5A524);color:#fff}
.rank-2{background:linear-gradient(135deg,#C9D3E2,#94A0B4);color:#fff}
.rank-3{background:linear-gradient(135deg,#E8B07A,#C7803F);color:#fff}
.rank-n{background:#F2F5F9;color:var(--muted)}

/* ---------- 等级规则说明 ---------- */
.grade-rule{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r);
  border:1px solid var(--line);background:#fff;margin-bottom:9px;
}
.grade-rule.on{border-color:var(--brand);background:var(--brand-50);box-shadow:0 2px 10px rgba(46,107,255,.12)}
.gr-range{
  flex:0 0 auto;min-width:62px;text-align:center;font-size:12px;font-weight:600;
  font-variant-numeric:tabular-nums;padding:5px 8px;border-radius:7px;background:#F2F5F9;color:var(--ink-2);
}
.grade-rule.on .gr-range{background:var(--brand);color:#fff}
.gr-body{flex:1;min-width:0}
.gr-name{font-size:12.5px;font-weight:600}
.gr-desc{font-size:11.5px;color:var(--muted);margin-top:1px}
.gr-benefit{font-size:11px;color:var(--ink-2);margin-top:4px;display:flex;align-items:center;gap:5px}
.gr-benefit svg{width:12px;height:12px;color:var(--brand)}

/* ---------- 注册向导 ---------- */
.wizard-body{padding:22px 24px}
.wizard-foot{
  display:flex;align-items:center;gap:10px;padding:16px 24px;
  border-top:1px solid var(--line);background:#FCFDFF;
}
.wizard-foot .spacer{margin-left:auto}
.reg-summary{
  display:grid;grid-template-columns:repeat(2,1fr);gap:12px 20px;
  background:#F7F9FE;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;
}

/* 步骤小结卡 */
.review-block{margin-bottom:18px}
.review-block .rb-hd{
  display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;
  margin-bottom:10px;color:var(--ink);
}
.review-block .rb-hd .edit{margin-left:auto;font-size:11.5px;color:var(--brand);cursor:pointer;font-weight:500}

/* 资质清单预览 */
.cert-list{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.cert-item{
  display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:8px;
  background:#fff;border:1px solid var(--line);font-size:12px;
}
.cert-item .ci{
  width:24px;height:24px;border-radius:6px;display:grid;place-items:center;flex:0 0 auto;
}
.cert-item .ci svg{width:13px;height:13px}
.cert-item.has .ci{background:var(--ok-50);color:var(--ok)}
.cert-item.miss .ci{background:#F2F5F9;color:var(--faint)}
.cert-item .cn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cert-item.miss .cn{color:var(--muted)}

/* 提交结果 */
.result-hero{text-align:center;padding:28px 20px 22px}
.result-ico{
  width:68px;height:68px;border-radius:20px;display:grid;place-items:center;margin:0 auto 16px;
}
.result-ico svg{width:32px;height:32px}
.result-hero h3{margin:0 0 8px;font-size:18px;font-weight:600}
.result-hero p{margin:0;font-size:13px;color:var(--muted);line-height:1.7}
.result-steps{
  display:flex;align-items:center;justify-content:center;gap:0;
  margin:22px 0 6px;padding:0 10px;
}

/* ---------- 详情抽屉内的头部 ---------- */
.dw-hero{
  display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--r-lg);
  background:linear-gradient(120deg,#F7F9FE,#EEF3FF);border:1px solid var(--brand-100);
  margin-bottom:18px;
}
.dw-hero .dh-name{font-size:15px;font-weight:600;line-height:1.25}
.dw-hero .dh-meta{font-size:11.5px;color:var(--muted);margin-top:3px}
.dw-hero .dh-score{margin-left:auto;text-align:right}
.dw-hero .dh-score b{font-size:24px;font-weight:700;letter-spacing:-.5px}
/* 仅作用于「综合评分」文字标签；用 > 限定直接子元素，
   避免覆盖嵌套在内部的等级徽章（.grade 的 display 会被误改为 block） */
.dw-hero .dh-score > span{font-size:11px;color:var(--muted);display:block}

/* 标签页 */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:18px}
.tab{
  padding:9px 14px;font-size:12.5px;color:var(--muted);cursor:pointer;font-weight:500;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s;
}
.tab:hover{color:var(--ink-2)}
.tab.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}

/* ---------- 业务流程图（下单对接） ---------- */
.flow-strip{
  display:flex;align-items:center;gap:0;padding:16px 18px;overflow-x:auto;
  background:#F7F9FE;border-radius:var(--r);border:1px solid var(--line);
}
.flow-node{
  display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 auto;
  padding:0 4px;
}
.flow-pill{
  padding:7px 14px;border-radius:9px;background:#fff;border:1px solid var(--line);
  font-size:12px;font-weight:500;white-space:nowrap;
}
.flow-node.on .flow-pill{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 3px 10px rgba(46,107,255,.3)}
.flow-node.done .flow-pill{background:var(--ok-50);border-color:#BFE4CE;color:#0E8F50}
.flow-arrow{flex:0 0 auto;color:#C3CCDA;display:flex;align-items:center;padding:0 6px;margin-bottom:0}
.flow-arrow svg{width:16px;height:16px}

/* 交期提示 */
.lead-tip{
  display:flex;align-items:center;gap:9px;padding:10px 13px;border-radius:var(--r);
  background:var(--brand-50);color:#1A4BC4;font-size:12.5px;margin-bottom:14px;
}
.lead-tip svg{width:15px;height:15px;flex:0 0 auto}

/* 阶梯价格 */
.price-tier{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;
  background:#FAFBFD;border:1px solid var(--line);font-size:12px;margin-bottom:7px;
}
.price-tier .pt-qty{color:var(--muted);flex:0 0 96px}
.price-tier .pt-price{font-weight:600;color:var(--brand);font-variant-numeric:tabular-nums}
.price-tier .pt-tag{margin-left:auto}

/* ---------- 绩效雷达对比 ---------- */
.perf-compare{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}

/* 趋势小图 */
.mini-trend{height:44px}

/* ---------- 到货验收列表状态 ---------- */
.iqc-row-actions{display:flex;gap:6px;justify-content:flex-end}

/* 门店销售 · 门店费用录入：类型 / 金额 / 说明 一行填完再点添加 */
.fee-add{display:grid;grid-template-columns:180px 130px 1fr auto;gap:10px;align-items:end;margin-bottom:10px}
.fee-add .field{margin-bottom:0}
.fee-add .field label{display:block;font-size:12px;color:var(--muted);margin-bottom:4px}

/* ---------- 批量导入 ---------- */
.imp-drop{
  border:1.5px dashed #CFD8E6;border-radius:var(--r-lg);
  background:#FCFDFF;padding:34px 20px;text-align:center;
  transition:border-color .16s,background .16s,transform .16s;
}
.imp-drop.over{border-color:var(--brand);background:var(--brand-50);transform:translateY(-1px)}
.imp-ico{
  width:52px;height:52px;border-radius:15px;margin:0 auto 14px;
  background:var(--brand-50);color:var(--brand);display:grid;place-items:center;
}
.imp-ico svg{width:24px;height:24px}
.imp-t{font-size:13.5px;font-weight:600}
.imp-s{font-size:11.5px;color:var(--muted);margin-top:5px}

.imp-loading{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:44px 20px;color:var(--muted);font-size:13px;
}
.imp-loading svg{width:17px;height:17px;animation:spin 1s linear infinite;color:var(--brand)}
@keyframes spin{to{transform:rotate(360deg)}}

.imp-sum{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.imp-stat{
  padding:12px 14px;border-radius:var(--r);background:#FAFBFD;border:1px solid var(--line);
  text-align:center;
}
.imp-stat .iv{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.2}
.imp-stat .ik{font-size:11px;color:var(--muted);margin-top:3px}
.imp-stat.ok{background:var(--ok-50);border-color:#DFF2E7}
.imp-stat.ok .iv{color:var(--ok)}
.imp-stat.blue{background:var(--brand-50);border-color:var(--brand-100)}
.imp-stat.blue .iv{color:var(--brand)}
.imp-stat.err{background:var(--danger-50);border-color:#FBD9D6}
.imp-stat.err .iv{color:var(--danger)}

.imp-tbl{max-height:340px;overflow:auto;border:1px solid var(--line);border-radius:var(--r)}
.imp-tbl table.tbl{min-width:840px}
/* 企业全称过长时截断，避免把整列撑开或换行折行 */
.imp-tbl .imp-name{
  display:block;max-width:260px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-weight:500;
}
.imp-tbl tbody td:nth-child(3),
.imp-tbl tbody td:nth-child(5){white-space:nowrap}
.imp-row-err{background:#FFFCFC}
.imp-row-err:hover{background:#FFF7F6}
.imp-err{font-size:11.5px;color:var(--danger);line-height:1.5}
.imp-row-err .imp-err{font-weight:500}

@media (max-width:768px){
  .imp-drop{padding:24px 14px}
  .imp-sum{grid-template-columns:repeat(2,1fr)}
}

/* ---------- 登录 ---------- */
.login-layer{
  position:fixed;inset:0;z-index:260;display:none;
  align-items:center;justify-content:center;padding:20px;
  background:linear-gradient(150deg,#16233F,#1B2B4D 60%,#22345C);
}
.login-layer.on{display:flex}
.login-card{
  position:relative;   /* 让右上角的语言切换定位在卡内 */
  width:392px;max-width:100%;background:#fff;border-radius:16px;
  padding:30px 30px 22px;box-shadow:0 24px 70px rgba(0,0,0,.4);
}
.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.login-logo{
  width:42px;height:42px;border-radius:12px;flex:0 0 auto;
  background:linear-gradient(140deg,#3D7BFF,#1E4FD8);color:#fff;
  display:grid;place-items:center;box-shadow:0 6px 18px rgba(46,107,255,.4);
}
.login-logo svg{width:22px;height:22px}
.login-title{font-size:19px;font-weight:700;letter-spacing:.5px}
.login-sub{font-size:11.5px;color:var(--muted);margin-top:2px}

/* 顶栏连接状态 */
.tb-conn{
  display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;
  border-radius:8px;font-size:11.5px;font-weight:500;white-space:nowrap;
}
.tb-conn.live{background:var(--ok-50);color:#0E8F50}
.tb-conn.demo{background:var(--warn-50);color:#B57500}
.tb-conn .dot-mark{background:currentColor}

/* ---------- 打印预览 ---------- */
.print-root{
  position:fixed;inset:0;z-index:300;background:#6E7686;
  display:none;flex-direction:column;
}
.print-root.on{display:flex}
.print-bar{
  flex:0 0 auto;height:52px;background:#22293A;color:#fff;
  display:flex;align-items:center;gap:12px;padding:0 18px;
}
.print-bar .pt{font-size:13.5px;font-weight:500}
.print-bar .ps{font-size:11.5px;color:#9AA6BC}
.print-bar .acts{margin-left:auto;display:flex;gap:9px}
.print-bar .btn{background:rgba(255,255,255,.12);border-color:transparent;color:#fff}
.print-bar .btn:hover{background:rgba(255,255,255,.2);color:#fff}
.print-bar .btn-primary{background:var(--brand);border-color:var(--brand)}
.print-bar .btn-primary:hover{background:var(--brand-600)}
.print-scroll{flex:1;overflow:auto;padding:26px 16px 40px}
.print-sheet{
  position:relative;
  width:210mm;min-height:297mm;margin:0 auto;background:#fff;
  padding:14mm;box-shadow:0 10px 40px rgba(0,0,0,.28);
  color:#1C2434;font-size:12px;line-height:1.6;
  /* 让底色、边框在打印时如实输出 */
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}

/* 分页参考线：让预览如实反映实际分页位置 */
.pg-guide{
  position:absolute;left:0;right:0;height:0;
  border-top:1px dashed #B9C4D6;pointer-events:none;
}
.pg-guide span{
  position:absolute;right:10px;top:-9px;background:#fff;
  padding:0 7px;font-size:10px;color:#9AA6BC;letter-spacing:.3px;
}

/* 单据排版 */
.doc-hd{display:flex;align-items:flex-start;gap:16px;border-bottom:2px solid #1C2434;padding-bottom:12px;margin-bottom:18px}
.doc-hd .logo{
  width:38px;height:38px;border-radius:10px;background:#2E6BFF;color:#fff;
  display:grid;place-items:center;flex:0 0 auto;
}
.doc-hd .logo svg{width:20px;height:20px}
.doc-hd .org{font-size:15px;font-weight:700;letter-spacing:.4px}
.doc-hd .sub{font-size:11px;color:#7A8699;margin-top:2px}
.doc-hd .meta{margin-left:auto;text-align:right;font-size:11px;color:#4A5568;line-height:1.8}
.doc-title{text-align:center;font-size:19px;font-weight:700;letter-spacing:6px;margin:0 0 6px}
.doc-no{text-align:center;font-size:11.5px;color:#7A8699;margin-bottom:18px;font-variant-numeric:tabular-nums}

.doc-sec{font-size:12px;font-weight:700;margin:16px 0 8px;padding-left:8px;border-left:3px solid #2E6BFF;line-height:1.2}
.doc-kv{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 26px;font-size:11.5px}
.doc-kv.c1{grid-template-columns:1fr}
.doc-kv .k{color:#7A8699;display:inline-block;min-width:96px;margin-right:10px}
.doc-kv .v{font-weight:500}

table.doc-tbl{width:100%;border-collapse:collapse;font-size:11.5px;margin-top:6px}
table.doc-tbl th{
  background:#F2F5F9;border:1px solid #C9D2E0;padding:7px 8px;
  font-weight:600;text-align:left;white-space:nowrap;
}
table.doc-tbl td{border:1px solid #D8DFEA;padding:7px 8px;vertical-align:top}
table.doc-tbl .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.doc-tbl tfoot td{background:#FAFBFD;font-weight:600}

.doc-sign{display:flex;gap:26px;margin-top:34px;font-size:11.5px}
.doc-sign>div{flex:1}
.doc-sign .line{border-bottom:1px solid #C9D2E0;height:34px;margin-bottom:5px}
.doc-foot{margin-top:26px;padding-top:10px;border-top:1px dashed #D8DFEA;font-size:10.5px;color:#9AA6BC;line-height:1.7}

/* ============================================================
   版面族（T177）：13 类单据按用途分四种骨架。
   原来所有单据都是「居中大标题 + 两列 KV + 同样的签字栏」，
   现在按用途各有一套页头、标题排布、状态位与签字口径。
   ============================================================ */

/* --- ops 仓储作业凭证：单号要大、公司抬头收敛，页面要能贴能夹 --- */
.doc-hd--ops{align-items:center;border-bottom:1px solid #1C2434;padding-bottom:9px;margin-bottom:14px}
.doc-hd--ops .logo{width:26px;height:26px;border-radius:7px}
.doc-hd--ops .org{font-size:13px;font-weight:600;letter-spacing:.2px}
.doc-hd--ops .sub{font-size:10.5px;color:#7A8699;margin-top:1px}
.doc-hd--ops .meta{margin-left:auto;text-align:right;line-height:1.5}
.doc-hd--ops .big-no{font-size:20px;font-weight:700;letter-spacing:1.2px;color:#141B2D;
  font-variant-numeric:tabular-nums;font-family:ui-monospace,Menlo,Consolas,monospace}
.doc-hd--ops .meta .dt{font-size:10.5px;color:#7A8699;margin-top:3px}

/* --- record 质量 / 生产记录：左侧记录编号，右侧判定结论 --- */
.doc-hd--record{border-bottom:1px solid #1C2434;padding-bottom:9px;margin-bottom:14px;align-items:center}
.doc-hd--record .org{font-size:14px;font-weight:700}
.doc-hd--record .sub{font-size:10.5px;color:#7A8699;margin-top:2px}
.doc-hd--record .meta{margin-left:auto;text-align:right;font-size:10.5px;color:#4A5568;line-height:1.7}

/* --- voucher 财务凭证：窄页头，强调凭证字号 --- */
.doc-hd--voucher{align-items:center;border-bottom:2px solid #1C2434;padding-bottom:8px;margin-bottom:14px}
.doc-hd--voucher .logo{width:24px;height:24px;border-radius:6px}
.doc-hd--voucher .org{font-size:12.5px;font-weight:600}
.doc-hd--voucher .meta{margin-left:auto;text-align:right;font-size:10.5px;color:#4A5568;line-height:1.6}

/* 标题：ops / record / voucher 左对齐（作业场景要快速定位），formal 保持居中庄重 */
.doc-title--left{text-align:left;font-size:16px;font-weight:700;letter-spacing:2.5px;
  margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid #E3E8F0;
  display:flex;align-items:center;gap:10px}
.doc-title--left .tagline{margin-left:auto;font-size:11px;font-weight:500;letter-spacing:0;
  padding:3px 9px;border-radius:5px;background:#EEF3FF;color:#2E6BFF}
/* 财务凭证用色带标题 + 右侧金额大字 */
.doc-title--band{display:flex;align-items:center;gap:12px;background:#1C2434;color:#fff;
  padding:10px 14px;border-radius:6px;margin:0 0 16px}
.doc-title--band .t{font-size:15px;font-weight:700;letter-spacing:3px}
.doc-title--band .n{font-size:11px;color:#9AA6BC;letter-spacing:0}
.doc-title--band .amt{margin-left:auto;font-size:19px;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:.4px}
/* 判定 / 状态色块 */
.doc-verdict{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border-radius:5px;
  font-size:11.5px;font-weight:600;letter-spacing:0}
.doc-verdict.ok{background:#E8F8F0;color:#0E8F50}
.doc-verdict.warn{background:#FEF6E7;color:#B76E00}
.doc-verdict.bad{background:#FEF3F2;color:#C0281A}
.doc-verdict.gray{background:#F2F5F9;color:#5A6B85}
/* 对外单据底部的回执裁切区 */
.doc-stub{margin-top:22px;border-top:1px dashed #C9D2E0;padding-top:12px}
.doc-stub .stub-t{font-size:11px;font-weight:600;color:#4A5568;margin-bottom:8px;
  display:flex;align-items:center;gap:6px}
.doc-stub .stub-t:before{content:'';width:3px;height:11px;background:#94A0B4;border-radius:2px}
/* 回执是要手写填的：留横线而不是画「—」 */
.doc-stub .stub-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 26px;font-size:11px}
.doc-stub .stub-grid .k{color:#7A8699;display:inline-block;min-width:76px;margin-right:8px}
.doc-stub .stub-grid .fill{display:inline-block;min-width:120px;border-bottom:1px solid #C9D2E0;
  height:14px;vertical-align:middle}
/* 作业凭证脚注：用带底色的条，和正式单据的条款脚注区分开 */
.doc-ops-note{margin-top:24px;padding:9px 12px;border-radius:6px;background:#F7F9FC;
  border:1px solid #E3E8F0;font-size:10.5px;color:#5A6B85;line-height:1.75}
.doc-tbl--zebra tbody tr:nth-child(even){background:#FAFBFD}

/* 通用面板打印：抽屉/弹窗正文直接进 A4（按钮已在提取时去掉，这里兜底） */
.panel-body{margin-top:2px}
.panel-body .pv{font-weight:600}
.panel-body .btn, .panel-body button{display:none !important}
.panel-body input, .panel-body textarea{font:inherit;color:inherit}

@media screen and (max-width:900px){
  .print-scroll{padding:14px 10px 30px}
}

/* ============================================================
   打印
   关键：以下规则必须显式锁死单据内部布局。
   打印时页面"视口"宽度 = A4 宽减去页边距 ≈ 688px，
   会命中上面的窄屏媒体查询，若不在此处覆盖，
   打印结果就会与预览不一致（签字栏竖排、内容变高而溢出到次页）。
   ============================================================ */

/* A4：210×297mm，四周 14mm 页边距 → 可打印区 182×269mm */
@page{size:A4;margin:14mm}

@media print{
  html,body{
    background:#fff !important;
    overflow:visible !important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  /* 只输出单据本体，隐藏应用界面与预览工具条 */
  body>*{display:none !important}
  body>.print-root{display:block !important;position:static;inset:auto;background:#fff}
  .print-bar{display:none !important}
  .print-scroll{overflow:visible !important;padding:0 !important;height:auto !important}
  .print-sheet{
    width:auto !important;min-height:auto !important;
    margin:0 !important;padding:0 !important;
    box-shadow:none !important;transform:none !important;
  }

  /* 锁定单据内部布局，抵消窄屏规则 */
  .doc-hd{display:flex !important;align-items:flex-start !important}
  .doc-kv{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .doc-kv.c1{grid-template-columns:1fr !important}
  .doc-sign{display:flex !important;flex-direction:row !important;gap:26px !important}
  .doc-sign>div{flex:1 1 0 !important}
  table.doc-tbl{width:100% !important}

  /* 避免签字栏、回执区、表格行、章节标题被分页截断 */
  .doc-hd,.doc-sign,.doc-foot,.doc-stub,.doc-ops-note,.doc-sec,.hp-struct,
  table.doc-tbl tr{break-inside:avoid;page-break-inside:avoid}
  .doc-title,.doc-no,.doc-title--left,.doc-title--band{break-after:avoid;page-break-after:avoid}
  /* 分页参考线仅用于预览 */
  .pg-guide{display:none !important}
}

/* ============================================================
   仓储管理
   ============================================================ */
/* 工具条里的下拉需要固定宽度，否则会撑满整行 */
.wh-picker{width:184px;flex:0 0 auto}

/* 物料单元格：编码在上、名称与规格在下，便于扫读 */
.wh-mat{display:flex;flex-direction:column;gap:1px;min-width:0}
.wh-mat-code{
  font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.2px;
}
.wh-mat-name{font-size:12.5px;font-weight:500;line-height:1.3}

/* 批次卡片（追溯抽屉） */
.batch-card{
  border:1px solid var(--line);border-radius:var(--r);padding:11px 13px;
  margin-bottom:9px;background:#fff;transition:border-color .15s;
}
.batch-card:hover{border-color:var(--brand-100)}
.batch-hd{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:7px}
.batch-hd .b6{font-size:14px}
.batch-meta{
  display:flex;flex-wrap:wrap;gap:6px 16px;
  font-size:11.5px;color:var(--muted);
}

/* 单据明细行（新建出入库单） */
.sd-item{
  border:1px solid var(--line);border-radius:var(--r);
  padding:11px 13px;margin-bottom:9px;background:#fff;
}
.sd-main{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:9px}
.sd-avail{font-size:11.5px;color:var(--muted);margin-left:auto;white-space:nowrap}
.sd-fields{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.sd-f{
  display:flex;flex-direction:column;gap:4px;
  font-size:11px;color:var(--muted);white-space:nowrap;
}
.sd-f .mini-input{width:104px}
.sd-f .mini-select{width:136px}

/* 物料选择列表 */
.mp-list{max-height:400px;overflow-y:auto;padding-right:2px}

/* 盘点底稿表格：内嵌可滚动区 */
.st-draft{max-height:360px;overflow:auto;border:1px solid var(--line);border-radius:var(--r)}

@media screen and (max-width:900px){
  .wh-picker{width:100%}
  .sd-fields{gap:8px}
  .sd-f .mini-input,.sd-f .mini-select{width:100%}
}

/* ============================================================
   财务管理
   ============================================================ */
/* 账龄分布条 */
.aging-bar{
  display:flex;height:14px;border-radius:7px;overflow:hidden;
  background:#EFF2F7;margin-bottom:16px;
}
.aging-seg{height:100%;transition:width .4s}
/* 列数随容器宽度自适应，避免在窄栏里标签折行 */
.aging-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(124px,1fr));gap:10px 14px}
.aging-cell{display:flex;gap:8px;align-items:flex-start}
.aging-cell .legend-dot{margin-top:5px;flex:0 0 auto}
.aging-cell .ak{font-size:11.5px;color:var(--muted)}
.aging-cell .av{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:1px}
.aging-cell .ap{font-size:10.5px;color:var(--faint);margin-top:1px}

/* 双方余额对比 */
.cmp-box{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
  padding:14px 16px;border-radius:var(--r);border:1px solid var(--line);background:#FAFBFD;
}
.cmp-box.ok{background:var(--ok-50);border-color:#DFF2E7}
.cmp-box.diff{background:var(--danger-50);border-color:#FBD9D6}
.cmp-item .ck{font-size:11.5px;color:var(--muted)}
.cmp-item .cv{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:3px}

/* 明细行内的标题行（单号 + 时间信息） */
.fh-b6{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:2px}

@media screen and (max-width:900px){
  .aging-legend{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cmp-box{grid-template-columns:1fr}
}

/* ============================================================
   数据总览 · 系统设置
   ============================================================ */
.mod-card-oxed{display:flex;flex-direction:column;transition:border-color .16s,box-shadow .16s,transform .16s}
.mod-card-box .card-hd{padding:13px 16px}
.mod-card-box .card-hd h3{font-size:13.5px}
.mod-card-box .card-bd{flex:1;display:flex;flex-direction:column;padding:12px 16px 14px}
.mod-card-box .mod-ico{width:30px;height:30px;border-radius:9px}
.mod-card-box .mrows{flex:1}
.mod-card-box:hover{border-color:var(--brand-100);box-shadow:0 4px 16px rgba(46,107,255,.1);transform:translateY(-1px)}

/* 模块卡内的指标行 */
.mrow{display:flex;align-items:center;gap:10px;min-height:29px;padding:3px 0;font-size:12.5px}
.mrow .mk{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58%}
.mrow .mv{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58%;text-align:right}
.mrow[data-module-go]:hover .mk{color:var(--brand)}
.mrow + .mrow{border-top:1px solid var(--line-2)}

/* 采购品类占比：只有一组数据时不画环形图（整圆看不出任何占比），改为点名这个品类 */
.cat-sole{display:flex;flex-direction:column;justify-content:center;min-height:142px;padding:4px 2px}
.cat-sole-k{font-size:12px;color:var(--muted);letter-spacing:.3px}
.cat-sole-name{display:flex;align-items:center;gap:9px;margin-top:10px;font-size:20px;font-weight:650;line-height:1.3}
.cat-sole-name .legend-dot{width:10px;height:10px}
.cat-sole-val{margin-top:6px;font-size:34px;font-weight:650;letter-spacing:.5px;
  font-variant-numeric:tabular-nums;color:var(--brand)}

/* 等级分布小条 */
.mini-grade-bar .gbar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:#EFF2F7}
.mini-grade-bar .gseg{height:100%}
.mini-grade-bar .glegend{display:flex;gap:12px;margin-top:7px;flex-wrap:wrap}
.mini-grade-bar .gl{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}

/* ===================== 角色权限面板（左角色列表 + 三页签） ===================== */
.role-panel{display:grid;grid-template-columns:214px 1fr;min-height:520px}
.role-side{border-right:1px solid var(--line);background:#FCFDFF;padding:8px 0}
.role-side-hd{display:flex;justify-content:space-between;padding:6px 14px 8px;
  font-size:11.5px;color:var(--muted);letter-spacing:.4px}
.role-list{max-height:520px;overflow:auto}
.role-item{display:flex;align-items:center;gap:6px;padding:9px 14px;font-size:13px;cursor:pointer;
  border-left:2px solid transparent;color:var(--ink-2)}
.role-item:hover{background:#F5F7FB}
.role-item.on{background:#EEF3FF;border-left-color:var(--brand);color:var(--brand);font-weight:600}
.role-item .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.role-item .c{font-size:11px;color:var(--muted);flex:0 0 auto}
.role-main{display:flex;flex-direction:column;min-width:0}
.role-tabs{display:flex;gap:2px;padding:8px 14px 0;border-bottom:1px solid var(--line)}
.role-tabs button{background:none;border:0;border-bottom:2px solid transparent;
  padding:8px 14px;font-size:13px;color:var(--muted);cursor:pointer}
.role-tabs button.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.role-body{padding:14px 16px 18px;min-height:420px}
.perm-group-title{margin:14px 0 4px;font-size:11.5px;font-weight:600;color:var(--muted);
  letter-spacing:.4px;background:#F7F9FC;padding:6px 10px;border-radius:6px}
.perm-group-title:first-child{margin-top:0}
.perm-res{display:grid;grid-template-columns:172px 1fr;gap:12px;align-items:center;
  padding:8px 2px;border-bottom:1px dashed var(--line)}
.perm-res-name{font-size:12.5px;color:var(--ink)}
.perm-acts{display:flex;flex-wrap:wrap;gap:6px 16px}
.perm-act{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-2);cursor:pointer}
.perm-act input{width:14px;height:14px;accent-color:var(--brand);cursor:pointer}

/* 页面访问：折叠汇总条 + 按菜单分组的标签云（1.24.0，替代 49 行平铺） */
.pa-block{margin-top:10px;border-top:1px dashed var(--line);padding-top:6px}
.pa-hd{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;padding:4px 2px}
.pa-hd .perm-group-title{margin:0;flex:0 0 auto}
.pa-hd:hover .perm-group-title{background:#EEF3FF;color:var(--brand)}
.pa-body{padding:2px 2px 6px}
.pa-group{display:flex;gap:10px;align-items:flex-start;margin:7px 0}
.pa-gname{flex:0 0 92px;font-size:11.5px;color:var(--muted);line-height:26px;text-align:right;
  font-weight:600;letter-spacing:.3px}
.pa-chips{display:flex;flex-wrap:wrap;gap:6px;flex:1}
.pa-chip{margin:0;padding:3px 11px !important;border:1px solid var(--line);border-radius:14px;
  background:#fff;line-height:20px;transition:border-color .15s,background .15s}
.pa-chip:hover{border-color:#BFD0F2}
.pa-chip:has(input:checked){border-color:var(--brand);background:#F0F5FF;color:var(--brand)}
.pa-chip input{margin:0}

/* 员工档案三栏 + 成长轨迹（1.24.0 按设计参考图重排） */
.hr-layout{display:grid;grid-template-columns:226px minmax(0,1fr) 320px;gap:14px;align-items:start}
@media (max-width:1320px){.hr-layout{grid-template-columns:204px minmax(0,1fr) 292px}}
.hr-tree-row{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;cursor:pointer;
  font-size:12.5px;color:var(--ink-2);line-height:1.35}
.hr-tree-row:hover{background:#F5F8FF}
.hr-tree-row.on{background:#EEF3FF;color:var(--brand);font-weight:600}
.hr-tree-row .ht-ico{display:inline-flex;opacity:.6;flex:0 0 auto}
.hr-tree-row.on .ht-ico{opacity:1}
.hr-tree-row .ht-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hr-tree-row .ht-num{font-size:11px;color:var(--muted);background:#F2F5F9;border-radius:9px;padding:1px 7px;flex:0 0 auto}
.hr-tree-row.on .ht-num{background:#DDE8FF;color:var(--brand)}
.hr-d-hero{display:flex;gap:10px;align-items:center;padding-bottom:10px;border-bottom:1px dashed var(--line);margin-bottom:10px}
.hr-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#2E6BFF,#7A5AF8);color:#fff;
  display:grid;place-items:center;font-size:18px;font-weight:600;flex:0 0 auto}
.hr-d-name{font-size:15px;font-weight:600}
.hr-kv-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}
.hr-kv .k{font-size:11px;color:var(--muted);margin-bottom:1px}
.hr-kv .v{font-size:12.5px;color:var(--ink);word-break:break-all}
.track-strip{display:flex;overflow-x:auto;padding-bottom:6px}
.track-node{position:relative;flex:0 0 186px;padding:0 8px 4px 0}
.track-node::before{content:'';position:absolute;left:5px;top:6px;right:-4px;height:2px;background:#E4EAF3}
.track-node:last-child::before{display:none}
.tk-dot{width:12px;height:12px;border-radius:50%;background:var(--brand);border:2.5px solid #DDE8FF;
  position:relative;z-index:1;margin-bottom:8px}
.track-node.future .tk-dot{background:#C3CBD9;border-color:#EEF1F6}
.track-node.future .tk-title{color:var(--muted)}
.tk-date{font-size:11px;color:var(--muted);margin-bottom:3px}
.tk-title{font-size:12.5px;font-weight:600;margin-bottom:2px;white-space:nowrap}
.tk-desc{font-size:11.5px;color:var(--muted);line-height:1.5}

/* Bug 反馈 · 环境信息（等宽、可选中复制） */
.bug-env{margin:0;padding:10px 12px;background:#F8FAFC;border:1px solid var(--line);border-radius:8px;
  font:11.5px/1.7 Consolas,Menlo,monospace;color:var(--ink-2);white-space:pre-wrap;word-break:break-all;
  max-height:220px;overflow:auto}

/* 数据权限四档卡片 */
.scope-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:6px}
.scope-card{border:1px solid var(--line);border-radius:10px;padding:14px 12px;cursor:pointer;
  background:#fff;transition:border-color .15s,background .15s}
.scope-card:hover{border-color:#BFD0F2}
.scope-card.on{border-color:var(--brand);background:#F5F8FF;box-shadow:inset 0 0 0 1px var(--brand)}
.scope-card .sc-ico{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;
  background:#F2F5F9;color:var(--muted);margin-bottom:8px}
.scope-card.on .sc-ico{background:var(--brand);color:#fff}
.scope-card b{font-size:13px;display:block;margin-bottom:4px}
.scope-card p{font-size:11.5px;color:var(--muted);line-height:1.5;margin:0}
@media (max-width:1180px){ .scope-cards{grid-template-columns:1fr 1fr} }

/* 权限矩阵 */
table.perm-matrix td,table.perm-matrix th{vertical-align:middle}
/* 角色一多，一列一个角色的表就横着看不完了：
   容器独立滚动，表头吸顶、权限项列吸左，中间的角色列横向滑动。 */
.perm-wrap{overflow:auto;max-height:calc(100vh - 340px)}
table.perm-matrix{border-collapse:separate;border-spacing:0}
table.perm-matrix thead th{
  position:sticky;top:0;z-index:2;background:#FAFBFD;
  border-bottom:1px solid var(--line);font-size:12px;line-height:1.35;
  box-shadow:0 1px 0 var(--line);
}
table.perm-matrix th.perm-sticky-l,
table.perm-matrix td.perm-sticky-l{position:sticky;left:0;z-index:1;background:#fff}
table.perm-matrix thead th.perm-sticky-l{z-index:3;background:#FAFBFD}
table.perm-matrix tr.perm-group td.perm-sticky-l{background:#F7F9FC}
.perm-group td{
  background:#F7F9FC;font-size:11.5px;font-weight:600;color:var(--muted);
  letter-spacing:.4px;padding:8px 14px;
}
.perm-matrix .pname{font-size:12.5px;font-weight:500}
.perm-matrix .pcode{font-size:10.5px;color:var(--faint);font-variant-numeric:tabular-nums;margin-top:1px}
.perm-cell{display:inline-flex;cursor:pointer}
.perm-cell input{display:none}
.perm-cell .box{
  width:18px;height:18px;border-radius:5px;border:1.5px solid #CBD4E2;background:#fff;
  display:grid;place-items:center;transition:all .14s;
}
.perm-cell .box svg{width:12px;height:12px;color:#fff;opacity:0;transition:opacity .14s}
.perm-cell input:checked + .box{background:var(--brand);border-color:var(--brand)}
.perm-cell input:checked + .box svg{opacity:1}
.perm-cell:hover .box{border-color:var(--brand)}
.perm-cell.locked{cursor:not-allowed}
/* 管理员固定全权：与已勾选一致，但降低不透明度以体现不可编辑 */
.perm-cell.locked .box{background:var(--brand);border-color:var(--brand);opacity:.72}
.perm-cell.locked .box svg{color:#fff;opacity:1}

/* 编号示例 */
.code-sample{
  font-size:12.5px;color:var(--brand);background:var(--brand-50);
  padding:3px 9px;border-radius:6px;display:inline-block;
}
.weight-sum{
  font-size:12.5px;color:var(--muted);background:#F7F9FC;
  border:1px solid var(--line);border-radius:8px;padding:5px 12px;
}

/* 档案列表选中行 */
table.tbl tbody tr.row-active{background:var(--brand-50)}
table.tbl tbody tr.row-active:hover{background:var(--brand-50)}
table.tbl tbody tr.row-active td:first-child{box-shadow:inset 3px 0 0 var(--brand)}

/* ---------- 响应式 ---------- */
@media (max-width:1400px){
  .mod-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1200px){
  .upload-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .iqc-stat{grid-template-columns:repeat(2,1fr)}
  .perf-compare{grid-template-columns:1fr}
  .cert-list{grid-template-columns:1fr}
}
/* ============================================================
   主数据（组织与基地 / 物料档案 / 客户档案 / 币种与汇率）
   ============================================================ */

/* ---------- 组织树 ---------- */
.org-tree{padding:6px 6px}
.org-row{
  display:flex;align-items:center;gap:9px;height:42px;padding:0 12px;
  border-radius:8px;cursor:pointer;font-size:13px;
  border:1px solid transparent;transition:background .14s,border-color .14s;
}
.org-row:hover{background:#F7F9FC}
.org-row.on{background:var(--brand-50);border-color:#C8D8FF}
.org-row.off{opacity:.55}
.org-row .org-node{width:15px;flex:0 0 auto;color:#9AA7BC;display:flex;align-items:center}
.org-row .org-node svg{width:13px;height:13px}
.org-row .org-name{font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.org-row .tag{flex:0 0 auto}
.org-row .org-meta{margin-left:auto;flex:0 0 auto;font-size:11.5px;color:var(--muted);white-space:nowrap}

/* ---------- 键值明细（组织详情 / 档案摘要） ---------- */
.kv-list{display:flex;flex-direction:column}
.kv-line{display:flex;align-items:flex-start;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
.kv-line:last-child{border-bottom:0}
.kv-k{flex:0 0 92px;color:var(--muted)}
.kv-v{flex:1;min-width:0;color:var(--ink);word-break:break-all}

/* ---------- 表格里的行内小按钮 ---------- */
.btn.btn-xs{height:26px;padding:0 8px;font-size:11.5px;border-radius:7px;gap:4px}
.btn.btn-xs svg{width:13px;height:13px}

/* ---------- 换算试算 ---------- */
.conv-box{margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:#F8FAFD}
.conv-box .cb-title{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink-2);margin-bottom:10px}
.conv-box .cb-title svg{width:14px;height:14px;color:var(--brand)}
.conv-box .cb-row{display:flex;align-items:center;gap:10px}
.conv-box .cb-eq{color:var(--muted)}
.conv-box #convOut{font-size:15px;color:var(--brand)}

@media (max-width:980px){
  .kv-k{flex:0 0 74px}
  .conv-box .cb-row{flex-wrap:wrap}
}

/* ---------- 数据总览 · 海外布局 ---------- */
.ov-foot{margin-top:auto;padding-top:12px;border-top:1px dashed var(--line)}
.ov-foot .sec-title{margin-bottom:8px}
.ov-node{display:flex;align-items:center;gap:8px;height:28px;font-size:12.5px}
.ov-node.sub{padding-left:18px}
.ov-node .ov-nm{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.ov-node.sub .ov-nm{color:var(--ink-2)}

/* ---------- 生产管理 ---------- */
/* 工单进度条（列表里的迷你条） */
.pg-mini{height:5px;border-radius:3px;background:#EDF1F7;overflow:hidden;margin-bottom:4px;min-width:70px}
.pg-mini i{display:block;height:100%;background:var(--brand);border-radius:3px}
/* BOM 表单的用料明细：改成固定列宽的表格，一行一个子件。
   原来的 flex 行 + 换行备注框，行高不齐、一多就像卡片墙；
   表格化之后行高一致、数字右对齐，含损耗用量也能就地算出来。 */
.bom-hint{font-size:11.5px;color:var(--muted);margin:-2px 0 8px;line-height:1.6}
.bom-table{
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;
}
.bom-thead,.bom-row{
  display:grid;gap:8px;align-items:center;padding:6px 10px;
  grid-template-columns:26px minmax(180px,1fr) 96px 52px 78px 96px 32px;
}
.bom-thead{
  background:#FAFBFD;border-bottom:1px solid var(--line);
  font-size:11.5px;font-weight:600;color:var(--muted);
}
.bom-thead > span{white-space:nowrap}
.bom-row{border-bottom:1px dashed var(--line-2,var(--line))}
.bom-row:last-child{border-bottom:0}
.bom-row:hover{background:#FCFDFF}
.bomc-no{font-size:11.5px;color:var(--faint,#9AA6BC);text-align:center;
  font-variant-numeric:tabular-nums}
.bomc-mat{min-width:0}
.bomc-mat .cs-wrap{width:100%}
.bomc-qty,.bomc-loss{width:100%;text-align:right;font-variant-numeric:tabular-nums}
.bomc-unit{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.bomc-need{font-size:12px;font-weight:600;text-align:right;color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.bomc-del{justify-self:center}
/* 窄屏：表格塌成两列（子件 + 数值），标签靠小字提示 */
@media (max-width:720px){
  .bom-thead{display:none}
  .bom-row{
    grid-template-columns:22px minmax(0,1fr) 32px;
    grid-template-areas:
      "no mat del"
      "no nums del";
    row-gap:6px;
  }
  .bomc-no{grid-area:no}
  .bomc-mat{grid-area:mat}
  .bomc-del{grid-area:del}
  .bomc-qty,.bomc-unit,.bomc-loss,.bomc-need{grid-column:auto}
  .bom-row > .bomc-qty,.bom-row > .bomc-loss{width:100%}
}

/* 合伙人授权面板：物料 chip 勾选态 */
/* 每行一个合伙人：抬头一行（左信息 / 右保存），下面等宽网格列清单。
   网格让「编码 + 名称」成列对齐，chip 固定 32px 高，长名称省略号收尾。 */
.grant-hd{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:11px 18px;border-bottom:1px dashed var(--line);
}
.grant-hd .btn{margin-left:auto}
.grant-user + .grant-user{border-top:1px solid var(--line-2)}
/* 授权面板的查找区：搜索 + 类别快选 + 全选/清空（物料多时不用滚着找） */
.grant-tools{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:9px 18px;background:#FCFDFF;border-bottom:1px dashed var(--line);
}
.grant-tools .pick-chips{gap:5px}
.grant-tools .pick-chip{padding:3px 9px;font-size:11.5px}
.grant-tools .mini-input{height:30px}
.grant-tools [data-gsum]{margin-left:auto}
.grant-list{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(266px,1fr));
  gap:8px;padding:12px 18px 16px;
}
.grant-chip{
  display:flex;align-items:center;gap:7px;height:32px;padding:0 10px;min-width:0;
  border:1px solid var(--line);border-radius:9px;background:#FBFCFE;
  font-size:12px;cursor:pointer;user-select:none;
}
.grant-chip:hover{border-color:var(--brand)}
.grant-chip.on{border-color:var(--brand);background:var(--brand-50)}
.grant-chip.on .tnum{color:var(--brand);font-weight:600}
.grant-chip input{width:auto;margin:0;flex:0 0 auto;accent-color:var(--brand)}
.grant-chip .tnum{font-weight:500;flex:0 0 auto;white-space:nowrap}
.grant-chip .mut{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 用户与权限 · 工具条：搜索框/下拉/分段按钮统一 32px 高，避免参差 */
.sys-toolbar .cs-btn{height:32px;border-radius:8px;font-size:12.5px;padding:0 30px 0 11px}
.sys-toolbar .seg{height:32px;padding:2px 3px}
.sys-toolbar .seg button{height:28px;padding:0 12px}

/* 设置页的固定列宽表格：th 上的 width 精确生效，单元格里的输入框用 width:100% 铺满 */
table.tbl.tbl-fixed{table-layout:fixed}
.w-cell{display:flex;align-items:center;gap:5px;white-space:nowrap}
.w-cell .mini-input{width:52px;padding:0 8px;text-align:right}
/* BOM 明细里子 BOM 展开的那一层 */
.tbl tr.sub-row{background:#FAFBFD}
.tbl tr.sub-row td{border-bottom:1px dashed var(--line-2)}

/* ---------- 国际物流 ---------- */
/* 表格合计行（费用明细底部） */
.tbl tfoot td{background:#FAFBFD;border-top:1px solid var(--line);padding:11px 14px;font-size:12.5px}

/* ---------- 成本穿透 ---------- */
/* 逐层成本条 */
.cost-layers{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;padding:16px 18px 6px}
.cost-layer{border:1px solid var(--line);border-radius:var(--r);padding:13px 14px;background:#FBFCFE}
.cl-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:13px;margin-bottom:9px}
.cl-bar{height:6px;border-radius:3px;background:#EDF1F7;overflow:hidden;margin-bottom:8px}
.cl-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#2E6BFF,#5B8CFF)}
.cl-val{font-size:17px;color:var(--ink);display:flex;align-items:baseline;gap:2px}
.cl-val .fs11{font-size:11px}
.cl-note{margin-top:6px;line-height:1.5}
.cost-total td{background:var(--brand-50);font-weight:600}
/* 批次流水三步 */
.bt-flow{display:flex;align-items:stretch;gap:10px;padding-top:6px}
.tf-step{flex:1;min-width:0;border:1px solid var(--line);border-radius:var(--r);padding:11px 13px;background:#FBFCFE;font-size:13px}
.tf-step b{display:block;margin-bottom:6px;color:var(--ink)}
.tf-arrow{display:flex;align-items:center;color:#B4C0D6;flex:0 0 auto}
.tbl tbody tr.on td{background:var(--brand-50)}
.tbl tbody tr:hover td{cursor:pointer}

/* ---------- 单据附件（图片 + 文档） ---------- */
.att-head{display:flex;align-items:center;gap:8px}
.att-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;margin-top:4px}
/* 图片与文档混排时外层只当容器（.att-mixed 由 JS 按实际内容加），图片网格交给 .att-grid-imgs */
.att-grid.att-mixed{display:block}
.att-grid-imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}
.att-grid.att-drop{outline:2px dashed var(--brand);outline-offset:4px;border-radius:var(--r)}
.att-item{position:relative;margin:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#FBFCFE}
.att-item img{display:block;width:100%;height:96px;object-fit:cover;cursor:zoom-in;background:#EDF1F7}
.att-item figcaption{font-size:11px;color:var(--muted);padding:4px 6px;border-top:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-del{position:absolute;top:5px;right:5px;width:22px;height:22px;padding:0;display:none;align-items:center;justify-content:center;border:0;border-radius:6px;background:rgba(15,23,42,.62);color:#fff;cursor:pointer}
.att-del svg{width:13px;height:13px}
.att-item:hover .att-del{display:flex}
.att-empty{grid-column:1/-1;border:1px dashed var(--line);border-radius:var(--r);padding:18px;text-align:center;color:var(--muted);font-size:12px;display:flex;align-items:center;justify-content:center;gap:7px}

/* 文档条目：合同文本 / 盖章扫描件这类非图片附件 */
.att-docs{margin-top:10px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.att-docs:first-child{margin-top:4px}
.att-doc{display:flex;align-items:center;gap:11px;padding:10px 12px;border-bottom:1px solid var(--line-2)}
.att-doc:last-child{border-bottom:0}
.att-doc:hover{background:#FCFDFF}
.att-doc-ico{width:34px;height:34px;flex:0 0 auto;border-radius:8px;display:grid;place-items:center;
  background:var(--brand-50);color:var(--brand);position:relative}
.att-doc-ico svg{width:16px;height:16px}
.att-doc-ico[data-ext]{font-size:0}
.att-doc-txt{flex:1;min-width:0}
.att-doc-name{font-size:12.5px;color:var(--ink);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-doc-meta{font-size:11px;color:var(--faint);margin-top:2px}
.att-doc-act{display:flex;gap:6px;flex:0 0 auto}
.att-mask{position:fixed;inset:0;z-index:90;background:rgba(10,16,28,.86);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:28px;cursor:zoom-out}
.att-mask img{max-width:min(92vw,1400px);max-height:82vh;border-radius:var(--r);box-shadow:0 18px 48px rgba(0,0,0,.4)}
.att-mask-bar{display:flex;align-items:center;gap:14px;color:#E2E8F0;font-size:12px}

/* 文档预览层（PDF / DOC / DOCX）：页内看，不跳新窗口 */
.att-doc-name[data-preview]{cursor:pointer}
.att-doc-name[data-preview]:hover{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.att-view{position:fixed;inset:0;z-index:92;background:rgba(10,16,28,.86);
  display:flex;align-items:center;justify-content:center;padding:26px}
.att-view-box{width:min(1080px,100%);height:min(88vh,900px);background:#fff;border-radius:var(--r-lg);
  box-shadow:0 18px 48px rgba(0,0,0,.42);display:flex;flex-direction:column;overflow:hidden}
.att-view-hd{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);
  flex:0 0 auto;background:#FCFDFF}
.att-view-ti{min-width:0;display:flex;flex-direction:column;gap:2px}
.att-view-ti b{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-view-act{margin-left:auto;display:flex;gap:8px;flex:0 0 auto}
.att-view-bd{flex:1;min-height:0;overflow:auto;background:#F7F9FC;display:flex;flex-direction:column}
.att-view-frame{flex:1;width:100%;border:0;background:#fff}
.att-view-text{margin:0;padding:26px 34px;background:#fff;min-height:100%;
  font:13.5px/1.9 "Microsoft YaHei",-apple-system,Segoe UI,sans-serif;color:var(--ink);
  white-space:pre-wrap;word-break:break-word}
.att-view-note{padding:10px 34px;font-size:11.5px;color:var(--muted);background:#fff;
  border-top:1px dashed var(--line-2)}
.att-view-tip{display:flex;gap:10px;align-items:flex-start;margin:auto;max-width:520px;
  padding:22px;color:var(--muted);font-size:12.5px;line-height:1.7}
.att-view-tip svg{width:16px;height:16px;flex:0 0 auto;margin-top:2px}


/* ===================== 版本更新：最新展开、历史折叠 ===================== */
.ver-note-hd{cursor:pointer;user-select:none}
.ver-note-hd:hover{background:#FAFBFD}
.ver-note-ico{display:inline-flex;align-items:center;justify-content:center;
  color:var(--faint);transition:transform .15s;margin-left:6px}
.ver-note-ico svg{width:14px;height:14px}
.ver-note.open .ver-note-ico{transform:rotate(180deg)}
.ver-note-bd{display:none}
.ver-note.open .ver-note-bd{display:block}


/* ===================== 使用帮助：业务链路 ===================== */
.help-chain{display:flex;flex-wrap:wrap;align-items:center;gap:6px;
  padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:#FAFBFD}
.help-chain .hc-node{padding:5px 11px;border-radius:8px;background:#fff;border:1px solid var(--line);
  font-size:12.5px;color:var(--ink-2);white-space:nowrap}
.help-chain .hc-arrow{color:var(--faint);font-size:12px}


/* ===================== 审批流可视化设计器 ===================== */
.afd{display:grid;grid-template-columns:268px minmax(0,1fr) 270px;gap:14px;height:452px}
/* 顶部横条：流程属性（适用对象 / 名称 / 启用 / 说明）横排一行，
   不再压在左栏顶部把「可拖拽人员」挤到折线以下 */
.afd-top{margin-bottom:11px}
/* 适用对象那格给足宽度：模块 + 单据两级下拉里，单据名最长（供应商对账单 / 出入库单…），
   格子一窄就整列截成省略号，看不出选的是哪个业务对象。 */
.afd-top-row{display:grid;grid-template-columns:320px minmax(150px,1fr) 96px minmax(120px,1fr);
  gap:12px;align-items:end}
.afd-top-row .field{margin:0}
.afd-top-row .field label{font-size:11.5px}
.afd-top-row .input{height:34px;font-size:12.5px}
/* 窄屏：顶部属性条改成两行两列，宁可占高一点也别把下拉挤到看不清 */
@media (max-width:1360px){
  .afd-top-row{grid-template-columns:minmax(240px,1.2fr) minmax(180px,1fr);
    gap:10px 12px;align-items:end}
}
.afd-top-sw .afd-switch{height:34px}
.afd-col{border:1px solid var(--line);border-radius:10px;background:#fff;
  padding:14px;overflow:auto;min-width:0}
.afd-pool{background:#FAFBFD}
.afd-pool-title{font-size:12.5px;font-weight:600;color:var(--ink);
  padding-bottom:8px;margin-top:0;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:8px}
.afd-pool-title .r{font-size:10.5px;font-weight:400;color:var(--faint)}
/* 人员区滚动时搜索框跟着走：人一多，翻到下面就找不到筛选入口了 */
.afd-pool-hd{position:sticky;top:-14px;z-index:2;background:#FAFBFD;
  margin-top:14px;padding-top:8px;padding-bottom:2px}
.afd-pool-sec{font-size:11px;color:var(--muted);margin:12px 0 7px}
/* 适用对象：模块 + 单据 两级下拉 + 一句「哪个界面、哪一步」的说明 */
.afd-dt-row{display:grid;grid-template-columns:88px minmax(0,1fr);gap:6px}
.afd-dt-hint{margin-top:7px;font-size:11px;line-height:1.65;color:var(--ink-2);
  background:#fff;border:1px solid var(--line);border-left:3px solid var(--brand);
  border-radius:7px;padding:6px 8px}
.afd-dt-hint b{font-weight:600;color:var(--ink)}
.afd-dt-note{margin-top:6px;font-size:10.5px;line-height:1.6;color:var(--muted)}
.afd-dt-note.warn{color:#B54708;background:#FFF7E6;border-radius:6px;padding:5px 7px}
/* 账号按角色分组：一个角色一块，可折叠，搜索时自动展开命中的组 */
.afd-grp{margin-top:10px}
.afd-grp-hd{display:flex;align-items:center;gap:6px;width:100%;border:0;background:transparent;
  padding:3px 0;cursor:pointer;font-size:11px;color:var(--muted);text-align:left}
.afd-grp-hd:hover{color:var(--brand)}
.afd-grp-hd i{font-style:normal;color:var(--faint);font-size:10px}
.afd-grp-caret{display:inline-flex;transition:transform .15s}
.afd-grp-caret svg{width:11px;height:11px}
.afd-grp-caret.open{transform:rotate(90deg)}
.afd-grp-name{font-weight:600;color:var(--ink-2)}
.afd-grp .afd-chips{margin-top:6px}
/* 人员检索：人多了靠翻列表太慢 */
.afd-pool-search{position:relative;display:flex;align-items:center;gap:7px;margin-top:10px;
  border:1px solid var(--line);border-radius:8px;padding:0 9px;height:32px;background:#fff;color:var(--muted)}
.afd-pool-search:focus-within{border-color:var(--brand);color:var(--brand)}
.afd-pool-search svg{width:13px;height:13px;flex:0 0 auto}
.afd-pool-search input{flex:1;min-width:0;border:0;background:transparent;outline:none;
  font-size:12px;color:var(--ink)}
.afd-pool-hit{font-size:11px;color:var(--faint);flex:0 0 auto}
.afd-chips{display:flex;flex-wrap:wrap;gap:6px}
.afd-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;
  border:1px solid var(--line);border-radius:8px;background:#fff;
  font-size:12px;color:var(--ink-2);cursor:grab;user-select:none;
  transition:border-color .15s,background .15s,box-shadow .15s}
.afd-chip:hover{border-color:var(--brand);background:var(--brand-50)}
.afd-chip.dragging{opacity:.4}
.afd-chip-ico{display:inline-flex;color:var(--brand)}
.afd-chip-ico svg{width:14px;height:14px}
/* 姓名 + 岗位两段：名字太长也不会把角色名挤掉 */
.afd-chip-n{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.afd-chip-sub{font-size:10px;color:var(--faint);max-width:72px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
/* 已经在当前节点里的人：置灰打勾，免得重复拖、也看得出「谁已经放进去了」 */
.afd-chip.in{border-style:dashed;background:#F4F6FA;color:var(--muted);cursor:default}
.afd-chip.in:hover{border-color:var(--line);background:#F4F6FA}
.afd-chip.in .afd-chip-ico{color:var(--faint)}
.afd-chip-yes{display:inline-flex;color:var(--ok-600,#0E8F50)}
.afd-chip-yes svg{width:12px;height:12px}

.afd-canvas.over{border-color:var(--brand);background:var(--brand-50)}
.afd-empty{height:100%;min-height:300px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  border:1.5px dashed var(--line);border-radius:10px;padding:24px}
.afd-empty .ei{color:var(--faint);margin-bottom:10px}
.afd-empty .ei svg{width:34px;height:34px}
.afd-empty h4{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:6px}
.afd-empty p{font-size:12px;color:var(--muted);line-height:1.7;margin:0}
.afd-canvas.over .afd-empty{border-color:var(--brand);background:#fff}
.afd-chain{display:flex;flex-direction:column;align-items:center;min-height:100%;
  justify-content:flex-start;padding-top:4px}
.afd-arrow{color:var(--faint);font-size:13px;line-height:1;margin:5px 0}
.afd-node{width:100%;max-width:420px;display:flex;align-items:center;gap:10px;
  padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;
  cursor:grab;user-select:none;transition:border-color .15s,box-shadow .15s,background .15s}
.afd-node:hover{border-color:#C9D4E8}
.afd-node.sel{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}
.afd-node.over{border-color:var(--brand);background:var(--brand-50)}
.afd-node.dragging{opacity:.4}
.afd-node-no{flex:none;width:26px;height:26px;border-radius:50%;
  background:var(--brand-50);color:var(--brand);
  font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center}
.afd-node.sel .afd-node-no{background:var(--brand);color:#fff}
.afd-node-body{flex:1;min-width:0}
.afd-node-name{font-size:13px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.afd-node-who{font-size:11.5px;color:var(--muted);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.afd-node-acts{flex:none;display:flex;gap:3px}
.afd-mini{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--muted);
  cursor:pointer;transition:border-color .15s,color .15s,background .15s}
.afd-mini svg{width:13px;height:13px}
.afd-mini:hover:not(:disabled){border-color:var(--brand);color:var(--brand);background:var(--brand-50)}
.afd-mini.danger:hover:not(:disabled){border-color:#E5484D;color:#E5484D;background:#FEF1F1}
.afd-mini:disabled{opacity:.35;cursor:default}
.afd-end{margin-top:2px;padding:5px 16px;border-radius:999px;
  background:#F1F5F9;border:1px solid var(--line);
  font-size:11.5px;color:var(--muted)}

.afd-panel-title{font-size:12.5px;font-weight:600;color:var(--ink);
  padding-bottom:8px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.afd-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:12.5px;color:var(--ink-2)}
.afd-switch input{accent-color:var(--brand)}
.afd-tip{margin-top:14px;padding:10px 12px;border-radius:8px;
  background:var(--brand-50);font-size:11.5px;color:var(--ink-2);line-height:1.8}
.afd-tip-t{font-weight:600;color:var(--brand);margin-bottom:2px}
.afd-info .field label{font-size:11.5px}
.afd-info .input{height:34px;font-size:12.5px}

@media (max-width:900px){
  .afd{grid-template-columns:1fr;height:auto}
  .afd-col{max-height:320px}
}


/* 设计器：节点类型 / 人员 / 进入条件 */
.afd-seg{display:inline-flex;background:#F2F5F9;border-radius:9px;padding:3px;gap:2px}
.afd-seg button{border:0;background:transparent;border-radius:7px;padding:5px 14px;
  font-size:12.5px;color:var(--muted);cursor:pointer}
.afd-seg button.on{background:#fff;color:var(--brand);font-weight:600;box-shadow:var(--shadow-1)}
.afd-people{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.afd-person{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-2);
  background:#F5F7FB;border:1px solid var(--line);border-radius:7px;padding:4px 6px 4px 8px}
.afd-person>svg{width:13px;height:13px;color:var(--muted)}
.afd-person-x{display:inline-flex;border:0;background:transparent;color:var(--faint);
  cursor:pointer;padding:0}
.afd-person-x svg{width:11px;height:11px}
.afd-person-x:hover{color:#E5484D}
.afd-node-kind{font-size:10.5px;font-weight:400;color:var(--muted);background:#F2F5F9;
  border-radius:5px;padding:1px 6px;margin-left:6px}
.afd-node-kind.all{background:var(--purple-50);color:#5B3FD6}
.afd-node-kind.cc{background:var(--brand-50);color:var(--brand)}
.afd-node.cc{border-style:dashed}
.afd-node.cc .afd-node-no{background:var(--brand-50);color:var(--brand)}
.afd-node.cc .afd-node-no svg{width:13px;height:13px}
.afd-conds{display:flex;flex-direction:column;gap:9px;margin-bottom:8px}
/* 条件卡：窄侧栏里每行一个控件，选项文字才不会被截断 */
.afd-cond{border:1px solid var(--line);border-radius:9px;background:#FAFBFD;padding:9px 10px 10px}
.afd-cond-hd{display:flex;align-items:center;justify-content:space-between;
  font-size:11px;color:var(--muted);margin-bottom:6px}
.afd-cond-line{display:grid;grid-template-columns:40px 1fr;align-items:center;gap:8px;margin-top:6px}
.afd-cond-line label{font-size:11px;color:var(--faint)}
.afd-cond .input{width:100%;height:30px;font-size:12px;padding:0 26px 0 8px}
.afd-cond input.input{padding-right:8px}
.afd-cond-empty{font-size:11.5px;color:var(--faint);padding:2px 0}
.fbtn{display:inline-flex;align-items:center;gap:5px;border:1px dashed var(--line);
  background:#fff;border-radius:8px;padding:5px 10px;font-size:11.5px;color:var(--muted);
  cursor:pointer}
.fbtn:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-50)}
.fbtn svg{width:12px;height:12px}

/* ===================== 轻量下拉菜单 ===================== */
.popmenu{position:fixed;z-index:400;min-width:168px;background:#fff;
  border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-3);padding:5px;
  animation:pm-in .12s ease-out}
@keyframes pm-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.popmenu-item{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;
  padding:8px 10px;border-radius:7px;font-size:12.5px;color:var(--ink-2);cursor:pointer;text-align:left}
.popmenu-item:hover{background:#F5F7FB;color:var(--ink)}
.popmenu-item.on{background:var(--brand-50);color:var(--brand);font-weight:600}
.pm-ico{display:inline-flex;color:var(--muted)}
.pm-ico svg{width:14px;height:14px}
/* 头像行：把菜单图标换成小圆头像 */
.pm-ico.pm-av{width:22px;height:22px;border-radius:6px;overflow:hidden;flex:0 0 auto}
.pm-ico.pm-av img{width:100%;height:100%;object-fit:cover;display:block}
.pm-t{flex:1}
.pm-sub{font-size:11px;color:var(--faint)}
.pm-check{display:inline-flex;color:var(--brand)}
.pm-check svg{width:13px;height:13px}
.popmenu-div{height:1px;background:var(--line);margin:5px 6px}
/* 危险项（取消订单 / 删除订单）：红色，和普通项一眼区分 */
.popmenu-item.danger{color:var(--danger,#F04438)}
.popmenu-item.danger .pm-ico{color:var(--danger,#F04438)}
.popmenu-item.danger:hover{background:#FEF3F2;color:var(--danger,#F04438)}

/* ---------- 抽屉底部操作区（左：更多操作 / 右：主操作 + 关闭） ---------- */
.dw-acts{display:flex;align-items:center;gap:8px;width:100%}
.dw-acts-l{display:flex;align-items:center;gap:6px;margin-right:auto}
.dw-acts-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.dw-acts .btn{white-space:nowrap}

/* ===================== 新建合同：金额构成区 ===================== */
/* 合同名称单独占一行且字号更大：先确认「这是哪份合同」，再往下填细节 */
.ct-name-field{margin-bottom:14px}
.ct-name-field label{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
.ct-name-input{font-size:15px;font-weight:600;height:42px}

/* 材料费 + 合同总额并排：左边填、右边实时汇总，一眼看到「加起来是多少」 */
.ct-money{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:14px;align-items:start}
.ct-total{padding:10px 14px;background:var(--brand-50);border:1px solid #DCE6FA;
  border-radius:var(--r);text-align:right}
.ct-total-k{font-size:11.5px;color:var(--muted)}
.ct-total-v{font-size:20px;font-weight:700;color:var(--brand);font-variant-numeric:tabular-nums;
  line-height:1.3;margin-top:2px}
.ct-total-s{font-size:11px;color:var(--muted);margin-top:3px;font-variant-numeric:tabular-nums}

/* 合同调差价款行：名目 / 金额 / 说明 / 删除
   注意 .mini-input 有全局默认 width:180px，不压满列就会在三格之间留出大片空白 */
.ct-extra-row{display:grid;grid-template-columns:minmax(0,1.6fr) 132px minmax(0,1.4fr) 34px;
  gap:8px;align-items:center;margin-bottom:8px}
.ct-extra-row .mini-input{height:34px;width:100%;min-width:0}
.ct-extra-row .mini-input[data-ex="amount"]{text-align:right;font-variant-numeric:tabular-nums}
.ct-extra-empty{padding:12px;border:1px dashed var(--line);border-radius:var(--r);
  font-size:12px;color:var(--muted);text-align:center}

@media (max-width: 768px){
  .ct-money{grid-template-columns:1fr}
  .ct-extra-row{grid-template-columns:1fr 1fr;gap:6px}
}

/* ---------- 下单成功后的底部操作条 ----------
   贴在视口底部居中，浮在内容之上；30 秒自动收起，也可手动关掉。 */
.ord-nextbar{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:320;
  display:flex;align-items:center;gap:12px;padding:11px 14px 11px 16px;
  background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-3);
  animation:onb-in .18s ease-out;max-width:calc(100vw - 32px)}
@keyframes onb-in{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
.onb-ico{display:inline-flex;color:#16B364}
.onb-ico svg{width:18px;height:18px}
.onb-txt{font-size:12.5px;color:var(--ink);white-space:nowrap}
.onb-sub{color:var(--muted);font-size:11.5px}
.onb-acts{display:flex;align-items:center;gap:6px;margin-left:4px}
@media (max-width: 768px){
  .ord-nextbar{left:12px;right:12px;bottom:12px;transform:none;flex-wrap:wrap;max-width:none}
  @keyframes onb-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .onb-txt{white-space:normal}
}

/* ===================== 审批中心（三栏） ===================== */
.apr{display:grid;grid-template-columns:232px 336px minmax(0,1fr);gap:14px;
  height:calc(100vh - 172px);min-height:520px}
.apr-col{background:#fff;border:1px solid var(--line);border-radius:var(--r);
  display:flex;flex-direction:column;min-width:0;overflow:hidden}

/* 左：导航树 */
.apr-nav-hd{display:flex;align-items:center;gap:8px;padding:14px 14px 10px}
.apr-nav-hd h3{margin:0;font-size:14.5px;font-weight:600;flex:1}
.apr-add{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;padding:0;
  border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer;flex:0 0 auto}
.apr-add:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-50)}
.apr-add svg{width:15px;height:15px;display:block}
.apr-search{position:relative;margin:0 14px 10px;display:flex;align-items:center;gap:7px;
  border:1px solid var(--line);border-radius:8px;padding:0 9px;height:34px;
  background:#FAFBFD;color:var(--muted)}
.apr-search:focus-within{border-color:var(--brand);background:#fff;color:var(--brand)}
.apr-search svg{width:14px;height:14px;flex:0 0 auto}
.apr-search input{flex:1;border:0;background:transparent;outline:none;
  font-size:12.5px;color:var(--ink);min-width:0}
.apr-search-x{display:none;align-items:center;color:var(--faint);cursor:pointer;
  border:0;background:transparent;padding:0}
.apr-search-x.on{display:inline-flex}
.apr-search-x svg{width:13px;height:13px}
.apr-search-x:hover{color:var(--ink)}
.apr-tree{flex:1;overflow:auto;padding:0 8px 10px}
.apr-node{width:100%;display:flex;align-items:center;gap:7px;padding:8px;border:0;
  background:transparent;border-radius:8px;cursor:pointer;font-size:12.5px;
  color:var(--ink-2);text-align:left}
.apr-node:hover{background:#F5F7FB}
.apr-node.on{background:var(--brand-50);color:var(--brand);font-weight:600}
.apr-caret{display:inline-flex;color:var(--faint);transition:transform .15s}
.apr-caret svg{width:12px;height:12px}
.apr-caret.open{transform:rotate(90deg)}
.apr-node-ico{display:inline-flex;color:currentColor}
.apr-node-ico svg{width:15px;height:15px}
.apr-node-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.apr-num{min-width:19px;height:18px;padding:0 6px;border-radius:9px;background:var(--brand);
  color:#fff;font-size:11px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.apr-num.sm{background:transparent;color:var(--muted);font-weight:400;min-width:0;padding:0}
.apr-leaf{display:flex;align-items:center;gap:8px;width:100%;border:0;background:transparent;
  padding:6px 8px 6px 30px;border-radius:8px;cursor:pointer;font-size:12px;
  color:var(--muted);text-align:left}
.apr-leaf:hover{background:#F5F7FB;color:var(--ink-2)}
.apr-leaf.on{background:var(--brand-50);color:var(--brand);font-weight:600}
.apr-leaf-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.apr-leaf-empty{padding:5px 0 6px 30px;font-size:11.5px;color:var(--faint)}
.apr-nav-ft{border-top:1px solid var(--line);padding:12px 14px;
  display:flex;flex-direction:column;gap:8px}
.apr-ft-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;
  border:1px solid var(--line);background:#fff;border-radius:8px;padding:7px 10px;
  font-size:12.5px;color:var(--ink-2);cursor:pointer}
.apr-ft-btn:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-50)}
.apr-ft-btn svg{width:14px;height:14px}

/* 中：状态 + 卡片列表 */
.apr-mid-hd{display:flex;align-items:center;gap:10px;padding:12px 14px;
  border-bottom:1px solid var(--line);flex:0 0 auto}
.apr-status-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);
  background:#fff;border-radius:8px;padding:6px 10px;font-size:12.5px;color:var(--ink-2);
  cursor:pointer}
.apr-status-btn:hover{border-color:var(--brand);color:var(--brand)}
.apr-status-btn svg{width:13px;height:13px;color:var(--muted)}
.apr-count{font-size:11.5px;color:var(--muted)}
.apr-refresh{margin-left:auto}
.apr-cards{flex:1;overflow:auto;padding:10px}
.apr-card{border:1px solid var(--line);border-radius:10px;padding:11px 12px;margin-bottom:8px;
  cursor:pointer;background:#fff;transition:border-color .15s,background .15s,box-shadow .15s}
.apr-card:hover{border-color:#C9D4E8;background:#FAFBFD}
.apr-card.on{border-color:var(--brand);background:var(--brand-50);
  box-shadow:0 0 0 3px var(--brand-50)}
.apr-card-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.apr-card-title{flex:1;font-size:13px;font-weight:600;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.apr-card-rows{display:flex;flex-direction:column;gap:4px}
.apr-card-rows>div{display:flex;gap:8px;font-size:11.5px;line-height:1.5}
.apr-card-rows .k{color:var(--muted);flex:0 0 auto;min-width:58px}
.apr-card-rows .v{color:var(--ink-2);flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.apr-card-ft{display:flex;align-items:center;gap:6px;margin-top:9px;padding-top:8px;
  border-top:1px dashed var(--line);font-size:11.5px;color:var(--muted)}
.apr-av{width:20px;height:20px;border-radius:50%;background:var(--brand-50);color:var(--brand);
  display:grid;place-items:center;font-size:10.5px;font-weight:600;flex:0 0 auto}
.apr-who{color:var(--ink-2)}
.apr-time{margin-left:auto}
.apr-pager{padding:0 10px 10px;flex:0 0 auto;min-width:0;overflow:hidden}
/* 分页组件在窄栏里默认带 border-top + 大内边距，放进来会显得很挤：收一收 */
.apr-pager .pager{padding:8px 2px 0}
.apr-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:44px 16px;text-align:center}
.apr-empty .ei{color:var(--faint)}
.apr-empty .ei svg{width:30px;height:30px}
.apr-empty h4{font-size:13.5px;font-weight:600;color:var(--ink)}
.apr-empty p{font-size:11.5px;color:var(--muted);line-height:1.7}

/* 右：详情三标签 */
.apr-detail-hd{padding:14px 16px 11px;border-bottom:1px solid var(--line);flex:0 0 auto}
.apr-detail-title{display:flex;align-items:center;gap:9px}
.apr-detail-title .t{font-size:15px;font-weight:600;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.apr-detail-sub{font-size:11.5px;color:var(--muted);margin-top:3px}
.apr-tabs{display:flex;gap:20px;padding:0 16px;border-bottom:1px solid var(--line);flex:0 0 auto}
.apr-tab{border:0;background:transparent;padding:10px 0;font-size:13px;color:var(--muted);
  cursor:pointer;position:relative}
.apr-tab:hover{color:var(--ink-2)}
.apr-tab.on{color:var(--brand);font-weight:600}
.apr-tab.on::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--brand);border-radius:2px}
.apr-detail-bd{flex:1;overflow:auto;padding:14px 16px 20px}
.apr-detail-empty{flex:1;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:7px;text-align:center;color:var(--muted);padding:40px 20px}
.apr-detail-empty .ei{color:var(--faint)}
.apr-detail-empty .ei svg{width:30px;height:30px}
.apr-detail-empty h4{font-size:13.5px;font-weight:600;color:var(--ink)}
.apr-detail-empty p{font-size:11.5px;color:var(--muted);line-height:1.7}
.apr-detail-empty.sm{padding:20px 0}

/* 业务单据卡：审批详情最上方的主入口，整块可点开对应单据 */
.apr-doc{
  border:1px solid #C9D8FF;border-radius:10px;padding:11px 13px;
  background:linear-gradient(180deg,#F7F9FF 0%,#FFFFFF 100%);
  margin:14px 0 12px;cursor:pointer;transition:transform .14s,box-shadow .14s,border-color .14s;
}
.apr-doc:hover{border-color:#2E6BFF;box-shadow:0 4px 12px rgba(46,107,255,.14);transform:translateY(-1px)}
.apr-doc:focus-visible{outline:2px solid #2E6BFF;outline-offset:2px}
/* 查不到单据主键：弱化但仍可点（退回模块列表页） */
.apr-doc.soft{border-color:var(--line);background:#F8FAFC}
.apr-doc.soft:hover{border-color:#9FB4E8;box-shadow:none;transform:none}
.ad-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.ad-ico{
  width:24px;height:24px;border-radius:7px;background:#EEF3FF;flex:0 0 auto;
  display:grid;place-items:center;
}
.ad-ico svg{width:14px;height:14px;color:#2E6BFF}
.ad-type{font-size:12px;font-weight:600;color:#2E6BFF;background:#EEF3FF;border-radius:20px;padding:2px 9px}
.ad-no{font-size:14px;font-weight:700;letter-spacing:.2px;overflow-wrap:anywhere}
.ad-amt{margin-left:auto;font-size:14.5px;font-weight:700;color:#0F7B4F;flex:0 0 auto}
/* 没有金额的单据（供应商准入）：这里放「第 N/M 级」，用中性色 + 小字号，
   不再摆一个 ¥ 数字 —— 注册资本不是单据金额，显示出来会被当成合同额 */
.ad-amt-txt{font-size:12px;font-weight:600;color:var(--muted);
  padding:2px 8px;background:#F2F5FA;border-radius:999px}
.ad-bot{
  display:flex;align-items:center;gap:10px;margin-top:9px;padding-top:8px;
  border-top:1px dashed #DCE6FA;
}
.apr-doc.soft .ad-bot{border-top-color:var(--line-2)}
.ad-title{
  flex:1;min-width:0;font-size:11.5px;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.ad-go{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;color:#2E6BFF;flex:0 0 auto}
.ad-go svg{width:13px;height:13px}

.apr-kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 22px}
.apr-kv>div{display:flex;gap:8px;font-size:12.5px;min-width:0}
.apr-kv .k{color:var(--muted);flex:0 0 auto;min-width:62px}
.apr-kv .v{color:var(--ink);flex:1;min-width:0;overflow-wrap:anywhere}
.apr-sec{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;
  color:var(--ink);margin:17px 0 9px;padding-left:8px;border-left:3px solid var(--brand)}
.apr-sec .r{margin-left:auto;font-size:11.5px;font-weight:400;color:var(--muted)}
.apr-chain{display:flex;flex-direction:column;gap:8px}
.apr-node-card{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;
  border:1px solid var(--line);border-radius:10px;background:#fff}
.apr-node-card.done{background:#FAFBFD}
.apr-node-card.cur{border-color:var(--brand);background:var(--brand-50)}
.apr-node-card.cc{border-style:dashed}
.apr-node-no{width:22px;height:22px;flex:0 0 auto;border-radius:50%;background:#F1F5F9;
  color:var(--muted);font-size:11px;font-weight:600;display:grid;place-items:center}
.apr-node-no svg{width:12px;height:12px}
.apr-node-card.cur .apr-node-no{background:var(--brand);color:#fff}
.apr-node-card.cc .apr-node-no{background:var(--brand-50);color:var(--brand)}
.apr-node-c{flex:1;min-width:0}
.apr-node-t{display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  font-size:12.5px;font-weight:600;color:var(--ink)}
.apr-node-cond{font-size:11px;font-weight:400;color:#B57500;background:var(--warn-50);
  padding:1px 7px;border-radius:5px}
.apr-node-p{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.apr-person{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;
  color:var(--ink-2);background:#F5F7FB;border-radius:6px;padding:2px 7px}
.apr-person svg{width:11px;height:11px}
.apr-person.ok{background:var(--ok-50);color:#0E8F50}
.apr-person.no{background:var(--danger-50);color:#C9342A}
/* 移交：接手人标注「谁交来的」，交出去的人留在链上标去向（虚线表示已不在待办） */
.apr-person .apr-moved{font-style:normal;font-size:10px;color:var(--brand);background:var(--brand-50);
  border-radius:4px;padding:0 4px;margin-left:2px}
.apr-person.out{background:transparent;border:1px dashed var(--line);color:var(--muted)}
.apr-person.out .apr-moved{color:var(--muted);background:transparent}
.apr-node-r{flex:0 0 auto}
.apr-ccs{display:flex;flex-wrap:wrap;gap:6px}
.apr-cc{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink-2);
  border:1px solid var(--line);border-radius:999px;padding:3px 10px;background:#FAFBFD}
.apr-cc svg{width:12px;height:12px;color:var(--muted)}
.apr-cc i{font-style:normal;color:var(--faint);font-size:10.5px}
.apr-note{font-size:12.5px;color:var(--ink-2);background:#FAFBFD;border:1px solid var(--line);
  border-radius:8px;padding:9px 11px;line-height:1.7}
.apr-records{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.apr-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.apr-act-tip{margin-top:11px;font-size:11.5px;color:var(--muted);line-height:1.7}
.apr-act-empty{display:flex;align-items:flex-start;gap:9px;font-size:12.5px;color:var(--ink-2);
  background:#FAFBFD;border:1px solid var(--line);border-radius:9px;padding:12px 14px;line-height:1.8}
.apr-act-empty svg{width:15px;height:15px;color:var(--muted);flex:0 0 auto;margin-top:2px}
/* 变更审批提示条：让人一眼看出「这轮批的是改动，驳回会回滚」 */
.apr-change-tip{display:flex;align-items:flex-start;gap:7px;margin-top:9px;font-size:11.5px;line-height:1.7;
  color:#7A5AF8;background:#F5F3FF;border:1px solid #E4DEFB;border-radius:8px;padding:7px 10px}
.apr-change-tip svg{width:13px;height:13px;flex:0 0 auto;margin-top:3px}
.apr-change-tip b{font-weight:600}

/* 抄送选择（弹窗内） */
.apr-pick-sec{font-size:11.5px;color:var(--muted);margin:10px 0 7px}
.apr-pick-row{display:flex;flex-wrap:wrap;gap:7px}
.apr-pick-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-2);
  border:1px solid var(--line);border-radius:8px;padding:6px 10px;background:#fff;cursor:pointer}
.apr-pick-chip:hover{border-color:var(--brand);color:var(--brand)}
.apr-pick-chip.on{border-color:var(--brand);background:var(--brand-50);color:var(--brand);font-weight:600}
.apr-pick-chip i{font-style:normal;color:var(--faint);font-size:10.5px}

/* 流程配置列表行 */
.apr-flow-row{display:flex;align-items:center;gap:10px;border:1px solid var(--line);
  border-radius:10px;padding:11px 13px;margin-bottom:9px}
.apr-flow-name{font-size:13px;font-weight:600;color:var(--ink)}
.apr-flow-sub{font-size:11.5px;color:var(--muted);margin-top:2px}
.apr-flow-stage{font-size:11px;color:var(--faint);margin-top:3px}
.apr-flow-r{margin-left:auto;display:flex;gap:6px;flex:0 0 auto}

@media (max-width:1180px){
  .apr{grid-template-columns:200px 290px minmax(0,1fr);gap:10px}
}
@media (max-width:900px){
  .apr{grid-template-columns:1fr;height:auto}
  .apr-col{max-height:none}
  .apr-cards{max-height:420px}
  .apr-detail-bd{max-height:none}
}

/* ===================== 版本更新页 ===================== */
.ver-page{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:16px;align-items:start}
.ver-main{min-width:0}

/* 顶部：运行版本 + 内容统计 */
.ver-hero{display:flex;align-items:center;gap:18px;padding:20px 22px;flex-wrap:wrap}
.ver-hero-l{display:flex;align-items:center;gap:14px;min-width:0;flex:1}
.ver-badge{width:48px;height:48px;border-radius:14px;flex:0 0 auto;
  background:linear-gradient(135deg,#2E6BFF,#7A5AF8);color:#fff;display:grid;place-items:center;
  box-shadow:0 6px 16px rgba(46,107,255,.22)}
.ver-badge svg{width:24px;height:24px}
.ver-no{display:flex;align-items:center;gap:9px;font-size:21px;font-weight:700;
  letter-spacing:.3px;color:var(--ink)}
.ver-meta{font-size:12px;color:var(--muted);margin-top:4px}
.ver-stats{display:flex;gap:10px;flex-wrap:wrap}
.ver-stat{min-width:74px;padding:9px 14px;border-radius:10px;text-align:center;
  background:#FAFBFD;border:1px solid var(--line)}
.ver-stat b{display:block;font-size:19px;font-weight:700;line-height:1.2;color:var(--ink)}
.ver-stat span{font-size:11px;color:var(--muted)}
.ver-stat.ok b{color:#0E8F50}
.ver-stat.blue b{color:var(--brand)}
.ver-stat.amber b{color:#B57500}
.ver-stat.gray b{color:#6B7A90}
.ver-stat.purple b{color:#7A5AF8}
.ver-stat.red b{color:#D92D20}

/* 版本块与分组 */
.ver-block{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ver-block+.ver-block{margin-top:12px}
.ver-block-hd{display:flex;align-items:center;gap:9px;padding:12px 14px;cursor:pointer;
  background:#FAFBFD;border-bottom:1px solid var(--line);flex-wrap:wrap}
.ver-block.fold .ver-block-bd{display:none}
.ver-block.fold .ver-note-ico{transform:rotate(-90deg)}
.ver-block-v{font-size:14px;font-weight:700;color:var(--ink)}
.ver-block-b{flex:0 0 auto;font-size:11px}
.ver-block-t{font-size:12.5px;color:var(--ink-2)}
.ver-block-n{font-size:11.5px;color:var(--muted);margin-left:auto}
.ver-block-r{display:inline-flex;align-items:center;gap:6px}
.ver-block-hd:hover{background:#F5F7FB}
.ver-block-bd{padding:14px 16px 16px;display:grid;gap:14px}
.ver-group{border-left:2px solid var(--line);padding-left:12px}
.ver-group-t{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;margin-bottom:7px}
.ver-group-t svg{width:14px;height:14px}
.ver-group-t.ok{color:#0E8F50}
.ver-group-t.blue{color:var(--brand)}
.ver-group-t.amber{color:#B57500}
.ver-group-t.gray{color:#6B7A90}
.ver-group-t.purple{color:#7A5AF8}
.ver-group-t.red{color:#D92D20}
.ver-group-t .vn{font-size:11px;font-weight:400;color:var(--muted);background:#F2F5F9;
  border-radius:999px;padding:1px 7px;margin-left:2px}
.ver-list{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.ver-list li{position:relative;padding-left:14px;font-size:13px;line-height:1.6;color:var(--ink-2)}
.ver-list li::before{content:'';position:absolute;left:2px;top:9px;width:5px;height:5px;
  border-radius:50%;background:#C9D4E8}

/* 版本页 · 服务器运行状态（侧栏，5 秒一轮） */
.sys-state{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:10px;
  background:#F0FBF4;border:1px solid #CDEBD9;font-size:13px;color:var(--ink);margin-bottom:12px}
.sys-state.warn{background:#FFF7E8;border-color:#F2DCB0}
.sys-state .dot{width:8px;height:8px;border-radius:50%;background:#16B364;flex:0 0 auto;
  box-shadow:0 0 0 3px rgba(22,179,100,.15)}
.sys-state.warn .dot{background:#F5A524;box-shadow:0 0 0 3px rgba(245,165,36,.18)}
.sys-kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.sys-kpi{padding:8px 6px;border:1px solid var(--line);border-radius:10px;background:#FAFBFD;text-align:center}
.sys-kpi b{display:block;font-size:17px;font-weight:700;line-height:1.25;color:var(--ink)}
.sys-kpi b .u{font-size:11px;font-weight:400;color:var(--muted);margin-left:2px}
.sys-kpi span{font-size:11px;color:var(--muted)}
#sysMemChart{width:100%;height:46px;display:block}
.sys-errs{display:grid;gap:4px;font-size:11.5px;color:var(--ink-2);
  background:#FEF3F2;border:1px solid #FBD5D0;border-radius:8px;padding:8px 10px}

@media (max-width:1180px){ .ver-page{grid-template-columns:1fr} }

/* ===================== 多选标签（角色、组织范围等） ===================== */
.pick-chips{display:flex;flex-wrap:wrap;gap:7px}
.pick-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-2);
  border:1px solid var(--line);border-radius:8px;padding:5px 10px;background:#fff;cursor:pointer;
  transition:border-color .15s,background .15s,color .15s}
.pick-chip:hover{border-color:var(--brand);color:var(--brand)}
.pick-chip.on{border-color:var(--brand);background:var(--brand-50);color:var(--brand);font-weight:600}
.pick-chip .pc-n{font-size:10.5px;color:var(--faint);font-weight:400}

/* ===================== 考勤薪资页 ===================== */

/* 计薪流程步骤条：四步走到哪一步一眼看到，点一步跳到对应 tab */
.pay-steps{display:flex;align-items:stretch;gap:0;flex-wrap:wrap}
.pay-step-arrow{display:flex;align-items:center;padding:0 6px;color:var(--faint)}
.pay-step-arrow svg{width:14px;height:14px}
.pay-step{
  flex:1 1 180px;min-width:150px;display:flex;align-items:center;gap:11px;
  padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff;
  transition:border-color .16s,box-shadow .16s;
}
.pay-step[data-step-tab]{cursor:pointer}
.pay-step[data-step-tab]:hover{border-color:var(--brand-100);box-shadow:0 3px 12px rgba(46,107,255,.09)}
.pay-step .ps-no{
  width:26px;height:26px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;
  background:#F1F5F9;color:var(--muted);font-size:12px;font-weight:600;
}
.pay-step .ps-no svg{width:13px;height:13px}
.pay-step .ps-txt{min-width:0}
.pay-step .ps-title{font-size:12.5px;font-weight:600;color:var(--ink)}
.pay-step .ps-val{font-size:13px;color:var(--ink-2);margin-top:2px;font-variant-numeric:tabular-nums}
.pay-step .ps-hint{font-size:11px;color:var(--faint);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pay-step.done{border-color:#C7EBD8;background:#F6FDF9}
.pay-step.done .ps-no{background:var(--ok-50);color:#0E8F50}
.pay-step.done .ps-title{color:#0E8F50}
.pay-step.doing{border-color:#CFE0FF;background:#F7FAFF}
.pay-step.doing .ps-no{background:var(--brand);color:#fff}
.pay-step.doing .ps-title{color:var(--brand)}

/* 出勤 / 薪资结构区：左侧结构条，右侧部门分布 */
.hp-struct{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:14px 18px 0}
.hp-struct-l,.hp-struct-r{min-width:0}
.hp-dept-box{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;
  max-height:190px;overflow-y:auto}
.hp-dept{display:flex;align-items:center;gap:9px;padding:8px 12px;border-bottom:1px solid var(--line-2);
  font-size:12px}
.hp-dept:last-child{border-bottom:0}
.hp-dept-nm{flex:1;min-width:0;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hp-dept-v{flex:0 0 auto;color:var(--ink-2);font-variant-numeric:tabular-nums}
.hp-dept-v.strong{font-weight:600;color:var(--ink)}
.hp-dept-v.bad{color:var(--danger)}
.hp-compare{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:9px 12px;border-radius:9px;background:#F7F9FC;border:1px solid var(--line)}

/* 有缺勤/迟到的行给个左侧提示条 */
.tbl tbody tr.row-warn td:first-child{box-shadow:inset 3px 0 0 var(--warn)}

@media (max-width:1180px){
  .hp-struct{grid-template-columns:1fr}
}
@media (max-width:900px){
  .pay-steps{flex-direction:column;gap:8px}
  .pay-step-arrow{display:none}
}

/* ===================== 个人中心 · 账号卡 ===================== */

/* 头像：默认显示姓名首字，传过自定义头像就是一张图；hover 出「更换」角标 */
.prof-avatar{
  width:56px;height:56px;border-radius:16px;flex:0 0 auto;position:relative;
  background:var(--brand-50);color:var(--brand);overflow:hidden;
  display:grid;place-items:center;
}
.prof-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.prof-avatar-txt{font-size:22px;font-weight:600}
.prof-avatar-edit{
  position:absolute;inset:0;border:0;cursor:pointer;
  background:rgba(15,23,42,.55);color:#fff;opacity:0;
  display:grid;place-items:center;transition:opacity .15s;
}
.prof-avatar-edit svg{width:16px;height:16px}
.prof-avatar:hover .prof-avatar-edit{opacity:1}

/* 账号与安全：左边标签、右边取值、最右一个动作链接 */
.sec-list{display:flex;flex-direction:column;gap:0}
.sec-row{
  display:flex;align-items:center;gap:10px;
  padding:9px 0;border-bottom:1px dashed var(--line-2);
  font-size:12.5px;
}
.sec-row:last-child{border-bottom:0}
.sec-k{width:76px;flex:0 0 76px;color:var(--muted)}
.sec-v{flex:1;min-width:0;word-break:break-all}
.sec-a{flex:0 0 auto;white-space:nowrap}
.sec-a .link,.sec-a.link{cursor:pointer}

/* 物料英文名称：跟随系统语言显示（html[lang] 由 I18N.init/set 维护）。
   没有英文名的物料不带 .mat-name-en，中文在两种语言下都照常显示。 */
.mat-name-en{display:none}
html[lang="en"] .mat-name-en{display:inline}
html[lang="en"] .mat-name{display:none}

/* ===================== 系统设置 · 版式（T194） =====================
   编码规则 / 准入策略共用：深色 hero + 结构解剖条 + 分组卡片，
   取代「一坨表头 + 22 行输入框」的平板样子。 */

.set-hero{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:18px 20px;border-radius:14px;margin-bottom:14px;
  background:linear-gradient(115deg,#12203F 0%,#1B3160 55%,#25407A 100%);
  color:#fff;
}
.set-hero-l{display:flex;align-items:center;gap:14px;min-width:0;flex:1 1 340px}
.set-hero-badge{
  width:44px;height:44px;border-radius:13px;flex:0 0 auto;
  background:rgba(255,255,255,.14);display:grid;place-items:center;
}
.set-hero-badge svg{width:22px;height:22px;stroke:#fff}
.set-hero-t{font-size:17px;font-weight:600;letter-spacing:.2px}
.set-hero-s{font-size:12.5px;color:rgba(255,255,255,.72);margin-top:3px}
.set-hero-r{display:flex;gap:8px;flex:0 0 auto}
.set-hero-r .btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.24);color:#fff}
.set-hero-r .btn:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4)}
.set-hero-r .btn-primary{background:#fff;border-color:#fff;color:#1B3160;font-weight:600}
.set-hero-r .btn-primary:hover{background:#EAF0FF;border-color:#EAF0FF;color:#1B3160}

/* 编号结构解剖条 */
.set-anatomy{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:#F7F9FC;border:1px solid var(--line);border-radius:12px;
  padding:14px 16px;margin-bottom:16px;
}
.sa-cell{display:flex;flex-direction:column;gap:4px}
.sa-cell code{
  font:600 15px/1.1 ui-monospace,SFMono-Regular,Consolas,monospace;
  background:#fff;border:1px solid var(--line);border-radius:8px;
  padding:7px 12px;color:#1B3160;box-shadow:0 1px 2px rgba(18,32,63,.05);
}
.sa-cell span{font-size:11px;color:var(--muted)}
.sa-sep{color:#B7C2D6;display:grid;place-items:center}
.sa-sep svg{width:15px;height:15px}
.sa-note{
  flex:1 1 260px;min-width:220px;display:flex;gap:7px;align-items:flex-start;
  font-size:12px;color:#4A5A76;background:#EEF3FF;border-radius:9px;padding:9px 11px;
}
.sa-note svg{width:15px;height:15px;flex:0 0 auto;margin-top:1px;stroke:#2E6BFF}

/* 分组卡片网格 */
.set-groups{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.set-group{
  background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;
}
.set-group-hd{
  display:flex;align-items:center;gap:8px;padding:11px 14px;
  background:#F7F9FC;border-bottom:1px solid var(--line);
}
.sg-title{font-size:13px;font-weight:600;color:#1B3160}
.sg-desc{font-size:11px;color:var(--muted);flex:1;min-width:0}
.sg-n{
  font-size:11px;color:#2E6BFF;background:#EEF3FF;border-radius:20px;
  padding:2px 8px;flex:0 0 auto;
}
.set-group-bd{padding:4px 14px 8px}

.code-row{padding:9px 0;border-bottom:1px dashed var(--line-2)}
.code-row:last-child{border-bottom:0}
.cr-label{font-size:12.5px;font-weight:600;margin-bottom:6px}
.cr-fields{display:flex;gap:7px;flex-wrap:nowrap;align-items:center}
.cr-prefix{width:74px;flex:0 0 74px;text-transform:uppercase}
.cr-fmt{flex:1 1 auto;min-width:0}
.cr-seq{width:56px;flex:0 0 56px;text-align:center}
.cr-sample{
  margin-top:6px;font:600 12px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
  color:#0F7B4F;background:#E8F8F0;border:1px dashed #A9E0C6;
  border-radius:7px;padding:5px 9px;letter-spacing:.3px;word-break:break-all;
}

/* 准入策略：评分 → 总分 → 等级 → 策略 的链路条 */
.set-flowline{
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:11px 16px;margin-bottom:14px;font-size:12.5px;color:#3D4B63;
}
.set-flowline > svg{width:14px;height:14px;stroke:#B7C2D6}
.sf-node{display:inline-flex;align-items:center;gap:5px;font-weight:600}
.sf-node svg{width:15px;height:15px;stroke:#2E6BFF}
.sf-key{color:#1B3160;background:#EEF3FF;border-radius:20px;padding:4px 11px}
.sf-key svg{stroke:#1B3160}
.sf-note{margin-left:auto;font-size:11.5px;color:var(--muted)}

/* 等级卡片 */
.grade-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:13px}
.grade-card{
  border:1px solid var(--line);border-radius:12px;padding:13px 14px;background:#fff;
  border-top:3px solid #B7C2D6;
}
.grade-card.gc-A{border-top-color:#16B364}
.grade-card.gc-B{border-top-color:#2E6BFF}
.grade-card.gc-C{border-top-color:#F5A524}
.grade-card.gc-D{border-top-color:#E5484D}
.gc-hd{
  display:flex;flex-direction:column;gap:7px;align-items:flex-start;
  margin-bottom:12px;min-height:62px;
}
.gc-hd-top{display:flex;align-items:center;gap:9px}
.gc-score{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:#3D4B63}
.gc-score .mini-input{width:62px;text-align:center}
.gc-rule{
  font-size:11px;color:#2E6BFF;background:#EEF3FF;
  border-radius:20px;padding:3px 10px;max-width:100%;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;
}
.gc-field{margin-bottom:9px}
.gc-field label{
  display:block;font-size:11.5px;color:var(--muted);margin-bottom:4px;
}
.gc-field .mini-input{width:100%}
.gc-desc{
  font-size:11px;color:#7A8699;background:#F7F9FC;border-radius:8px;
  padding:7px 9px;margin-top:2px;
}

/* ===================== 使用帮助：分页 + 操作手册（T204/T218） ===================== */
.help-tabs{
  display:flex;gap:6px;padding:12px 0 14px;border-bottom:1px solid var(--line);
  position:sticky;top:0;background:#fff;z-index:2;
}
.help-tabs button{
  border:1px solid var(--line);background:#fff;color:#40506B;
  border-radius:20px;padding:7px 16px;font-size:13px;cursor:pointer;
}
.help-tabs button:hover{border-color:#C6D2E6;background:#F7F9FC}
.help-tabs button.on{
  background:#1B3160;border-color:#1B3160;color:#fff;font-weight:600;
}

.help-manual{display:flex;flex-direction:column;gap:16px;padding-top:14px}
.hm-sec{
  border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;
}
.hm-hd{
  display:flex;align-items:center;gap:12px;padding:11px 14px;
  background:#F7F9FC;border-bottom:1px solid var(--line);
}
.hm-no{
  width:30px;height:30px;border-radius:9px;background:#1B3160;color:#fff;
  display:grid;place-items:center;font:600 12px/1 ui-monospace,Consolas,monospace;flex:0 0 auto;
}
.hm-t{flex:1;min-width:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.hm-t b{font-size:13.5px}
.hm-path{font-size:11.5px;color:var(--muted);display:inline-flex;align-items:center;gap:3px}
.hm-path svg{width:12px;height:12px}
.hm-act{display:flex;gap:6px;flex:0 0 auto}
.hm-body{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:16px;padding:14px;align-items:start;
}
.hm-steps ol{
  margin:0;padding-left:19px;font-size:12.8px;line-height:1.75;color:#33415C;
}
.hm-steps li{margin-bottom:7px}
.hm-steps li::marker{color:#2E6BFF;font-weight:600}
.hm-tip{
  display:flex;gap:7px;align-items:flex-start;margin-top:10px;
  font-size:12px;color:#4A5A76;background:#FFF6E8;border:1px dashed #F5D9A6;
  border-radius:9px;padding:9px 11px;
}
.hm-tip svg{width:15px;height:15px;flex:0 0 auto;margin-top:1px;stroke:#B4780C}
.hm-fig{margin:0}
.hm-fig img{
  width:100%;display:block;border:1px solid var(--line);border-radius:9px;
  background:#F3F6FB;cursor:zoom-in;
}
.hm-fig figcaption{
  font-size:11px;color:var(--muted);margin-top:6px;
}
@media (max-width:980px){
  .hm-body{grid-template-columns:1fr}
}

/* ===================== 业务流程图 ===================== */

/* 图比卡片宽：让它自己横向滚动，别把整页撑出横向滚动条 */
/* 已生效的筛选条件（可点 × 清除），放在工具栏右侧 */
.chip-x{
  display:inline-flex;align-items:center;gap:6px;
  border:1px solid #D6E2FF;background:#EEF3FF;
  color:var(--brand);border-radius:20px;padding:5px 8px 5px 11px;
  font-size:12px;cursor:pointer;white-space:nowrap;
}
.chip-x:hover{border-color:var(--brand)}
.chip-x svg{width:13px;height:13px}
.chip-x .cx{
  display:grid;place-items:center;width:16px;height:16px;border-radius:50%;
  background:rgba(46,107,255,.14);
}
.chip-x .cx:hover{background:rgba(46,107,255,.28)}

/* 物料列表里的图片缩略图：有图显示图、没图显示占位图标 */
.mat-cell{display:flex;align-items:center;gap:10px;min-width:0}
/* 物料台账列多（物料编码 + 型号 + 名称 + 类型/类别/来源 + 两个价 + 供应商/库存/状态/操作），
   默认的 14px 单元格内边距在这里会把表格顶出容器：本表单独收窄内边距。 */
table.tbl.mat-tbl thead th,table.tbl.mat-tbl tbody td{padding-left:8px;padding-right:8px}
.mat-thumb{
  width:36px;height:36px;min-width:36px;min-height:36px;max-width:36px;max-height:36px;
  flex:0 0 36px;box-sizing:border-box;padding:0;margin:0;
  border-radius:8px;overflow:hidden;
  border:1px solid var(--line);background:#F7F9FC;
  display:flex;align-items:center;justify-content:center;line-height:0;
  color:var(--faint);
}
.mat-thumb img{width:100%;height:100%;object-fit:cover;display:block}
/* 无图占位：原来用 .empty 做修饰类，撞上全局空态 .empty{text-align:center;padding:56px 20px}，
   占位框被撑成 42×114 的竖条、图标偏到右下角。换成专属类名，别再和全局类名共用。 */
.mat-thumb.noimg{border-style:dashed}
.mat-thumb svg{display:block;width:16px;height:16px;flex:0 0 auto;margin:0}
.mat-thumb.zoom{cursor:zoom-in;transition:border-color .14s}
.mat-thumb.zoom:hover{border-color:var(--brand)}

/* ===================== 流程图看板（T229：帮助与独立页共用） ===================== */
.flow-board{
  border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;
}
/* 阶段导航条：五段一眼可见，点一下把该段拉到视野里 */
.fb-nav{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:11px 13px;background:#F7F9FC;border-bottom:1px solid var(--line);
}
.fb-chips{display:flex;gap:8px;flex-wrap:wrap;flex:1 1 auto;min-width:0}
.fb-chip{
  display:inline-flex;align-items:center;gap:7px;
  border:1px solid var(--line);background:#fff;color:#3D4B63;
  border-radius:9px;padding:6px 11px;font-size:12.5px;cursor:pointer;
  transition:.14s;
}
.fb-chip:hover{border-color:var(--c);background:#fff}
.fb-chip.on{border-color:var(--c);background:#FFF9E8;font-weight:600}
@supports (background: color-mix(in srgb, #000 8%, #fff)){
  .fb-chip.on{background:color-mix(in srgb, var(--c) 8%, #fff)}
}
.fb-no{
  width:19px;height:19px;border-radius:6px;background:var(--c);color:#fff;
  display:grid;place-items:center;font:600 11px/1 ui-monospace,Consolas,monospace;
  font-style:normal;flex:0 0 auto;
}
.fb-name{white-space:nowrap}
.fb-n{font-style:normal;font-size:10.5px;color:var(--muted);white-space:nowrap}
.fb-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:var(--muted)}
.fb-lg{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.fb-lg-line{width:16px;height:0;border-top:1.6px solid #8D99AC;display:inline-block}
.fb-lg-dash{width:16px;height:0;border-top:1.6px dashed #7A8699;display:inline-block}
.fb-lg-dot{width:8px;height:8px;border-radius:50%;background:#F5A524;display:inline-block}

/* 画布：浅网格 + 内部横纵滚动，比裸图更像「图纸」 */
.fb-canvas{
  max-height:520px;overflow:auto;padding:10px 12px 4px;
  background:
    linear-gradient(#F1F5FB 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, #F1F5FB 1px, transparent 1px) 0 0 / 24px 24px,
    #FBFCFE;
}
/* 独立页空间足够：整图直接铺开，不内部滚动 */
.flow-board.tall .fb-canvas{max-height:none}
.fb-foot{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:9px 13px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--muted);background:#fff;
}
.fb-foot .btn{margin-left:auto;flex:0 0 auto}
/* 聚焦某一段：其余段淡出，再点一次恢复全览 */
.fb-focus .flow-svg g[data-lane]{opacity:.32;transition:opacity .2s}
.fb-focus .flow-svg g.fb-hot{opacity:1}

/* 三条主线横排成三张卡片（窄屏自动折行） */
.fb-tracks{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:13px;
}
.fb-tracks .flow-track{
  border:1px solid var(--line);border-radius:11px;padding:12px 14px;background:#fff;
  margin:0;
}
.fb-tracks .ft-step{max-width:none}

.flow-wrap{overflow-x:auto;overflow-y:hidden;padding-bottom:4px}
.flow-svg{display:block;width:100%;min-width:1080px;height:auto}
.fl-node{transition:transform .14s}
.fl-node:hover .fl-box{stroke-width:2;filter:drop-shadow(0 3px 8px rgba(21,34,64,.12))}
.fl-node:hover{transform:translateY(-1px)}

/* 三条主线：步骤条 + 说明 */
.flow-track{padding:12px 0;border-bottom:1px dashed var(--line)}
.flow-track:last-child{border-bottom:0;padding-bottom:0}
.flow-track:first-child{padding-top:2px}
.ft-hd{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink)}
.ft-ico{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex:0 0 auto}
.ft-ico svg{width:13px;height:13px}
.ft-steps{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0 0 30px}
.ft-step{font-size:11.5px;color:var(--ink-2);background:#F5F7FB;border:1px solid var(--line);
  border-radius:7px;padding:4px 9px;font-variant-numeric:tabular-nums}
.ft-arrow{color:var(--faint);display:flex}
.ft-arrow svg{width:12px;height:12px}
.ft-tip{font-size:11.5px;color:var(--muted);line-height:1.75;margin:8px 0 0 30px}

/* 常见问题 */
.flow-faq{display:flex;flex-direction:column;gap:2px}
.flow-faq .ff{padding:10px 0;border-bottom:1px dashed var(--line)}
.flow-faq .ff:last-child{border-bottom:0;padding-bottom:0}
.flow-faq .ff:first-child{padding-top:0}
/* 问与答用显式类名，**不能**用 .ff b{display:block} ——
   答案里还有行内 <b>（如「而是<b>入库</b>」「共 <b>2</b> 个环节」），
   一刀切成 block 会把句子劈成三行。 */
.flow-faq .ff-q{font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:4px}
.flow-faq .ff-a{font-size:11.5px;color:var(--muted);line-height:1.8}
.flow-faq .ff-a b{font-weight:600;color:var(--ink)}

/* 常用入口：按流程顺序排的按钮 */
.flow-entries{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:9px}
.fl-entry{display:flex;flex-direction:column;align-items:flex-start;gap:2px;height:auto;padding:9px 12px}
.fl-entry-t{font-size:12.5px;font-weight:500}
.fl-entry-s{font-size:10.5px;color:var(--faint)}

@media (max-width:900px){
  .ft-steps,.ft-tip{margin-left:0}
}

/* ===================== 品牌设置页 ===================== */
.brand-page{padding-bottom:8px}
.brand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}

/* --- 顶部品牌身份条 --- */
.brand-hero{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:18px 20px;margin-bottom:14px;
  background:linear-gradient(96deg,#141B2D 0%,#1D2740 58%,#223055 100%);border:0}
.brand-hero .bh-name{font-size:19px;font-weight:700;color:#fff;letter-spacing:.2px}
.brand-hero .bh-desc{font-size:12.5px;color:#9AA6BC;margin-top:3px}
.brand-hero .bh-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.brand-hero .bh-tags .tag{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.14);color:#C9D3E5}
.brand-hero-l{display:flex;align-items:center;gap:16px;flex:1 1 320px;min-width:0}
.brand-hero-r{display:flex;gap:8px;flex:0 0 auto}
.brand-hero .brand-hero-logo{width:62px;height:62px;flex:0 0 auto;border-radius:16px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);
  display:grid;place-items:center;overflow:hidden}
.brand-hero .brand-hero-logo img{width:100%;height:100%;object-fit:contain}
.brand-hero .brand-logo-fallback{font-size:24px;font-weight:700;color:#fff}
.brand-hero .btn{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#E4EAF4}
.brand-hero .btn:hover{background:rgba(255,255,255,.18);color:#fff;border-color:rgba(255,255,255,.28)}

/* --- 两列：左表单 · 右预览 --- */
.brand-cols{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:16px;align-items:start}
.brand-col{display:flex;flex-direction:column;gap:16px;min-width:0}

.brand-derived{display:flex;gap:9px;margin-top:14px;padding:10px 12px;border-radius:9px;
  background:#F5F8FF;border:1px solid #E2EBFF;font-size:12px;color:var(--ink-2);line-height:1.7}
.brand-derived svg{width:14px;height:14px;flex:0 0 auto;margin-top:2px;color:var(--brand)}
.brand-derived b{color:var(--brand)}

/* --- 预览用小样 --- */
.bp-block + .bp-block{margin-top:16px}
.bp-label{font-size:11.5px;color:var(--muted);margin-bottom:7px;display:flex;align-items:center;gap:8px}
.brand-prev-side{display:flex;align-items:center;gap:10px;padding:13px 15px;border-radius:12px;
  background:#141B2D}
.brand-prev-side .sb-co-name{color:#fff;font-size:13px;font-weight:600}
.brand-prev-side .sb-co-tag{color:#9AA6BC;font-size:11px;margin-top:2px}
.brand-prev-side .sb-co-avatar{width:30px;height:30px;flex:0 0 auto;border-radius:8px;
  background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:600;overflow:hidden}
.brand-prev-side .sb-co-avatar img{width:100%;height:100%;object-fit:cover}
.brand-prev-login{display:flex;align-items:center;gap:10px;padding:13px 15px;
  border:1px solid var(--line);border-radius:12px;background:#fff}
.brand-prev-login .login-logo{width:34px;height:34px;flex:0 0 auto;border-radius:10px;
  background:var(--brand-50);color:var(--brand);display:grid;place-items:center;overflow:hidden}
.brand-prev-login .login-logo img{width:100%;height:100%;object-fit:contain}
.brand-prev-login .login-title{font-size:14px;font-weight:700}
.brand-prev-login .login-sub{font-size:11.5px;color:var(--muted);margin-top:2px}
.brand-prev-copy{margin-top:8px;text-align:center;font-size:11px;color:var(--muted)}

/* --- 浏览器标签小样（favicon 必须按真实像素展示，否则大图会撑破版面） --- */
.brand-tabbar{
  border:1px solid var(--line);border-radius:10px 10px 0 0;background:#EDF1F7;
  padding:7px 8px 0;display:flex;gap:5px;align-items:flex-end;
}
.brand-tab{
  display:flex;align-items:center;gap:7px;min-width:0;max-width:210px;
  padding:6px 10px;border-radius:8px 8px 0 0;font-size:11.5px;
  background:#DDE4EE;color:#5A6A85;
}
.brand-tab.on{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 -1px 0 var(--line) inset}
.brand-tab .bt-fav{
  width:16px;height:16px;flex:0 0 auto;border-radius:3px;overflow:hidden;
  display:grid;place-items:center;background:transparent;
}
.brand-tab .bt-fav img{width:16px;height:16px;display:block;object-fit:contain}
.brand-tab .bt-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand-tabbar-pane{
  border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;
  background:#fff;padding:14px 16px;color:#B7C2D6;font-size:11.5px;
}
/* 图标在不同尺寸下的实际观感 */
.brand-fav-sizes{display:flex;align-items:flex-end;gap:16px;margin-top:12px}
.brand-fav-sizes .bfs{display:flex;flex-direction:column;align-items:center;gap:5px}
.brand-fav-sizes .bfs i{
  display:block;border:1px solid var(--line);border-radius:5px;overflow:hidden;
  background:#fff;place-items:center;
}
.brand-fav-sizes .bfs i img{width:100%;height:100%;display:block;object-fit:contain}
.brand-fav-sizes .bfs span{font-size:10.5px;color:var(--muted)}
.brand-asset-acts{display:flex;gap:7px;margin-top:12px}
.brand-preview-doc{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fff}

/* --- 底部动作条：滚动时始终可点 --- */
.brand-actionbar{position:sticky;bottom:0;z-index:6;display:flex;align-items:center;gap:12px;
  margin-top:16px;padding:11px 16px;border:1px solid var(--line);border-radius:12px;
  background:rgba(255,255,255,.94);backdrop-filter:blur(6px);box-shadow:0 -2px 14px rgba(21,34,64,.06)}
.brand-actionbar .ba-state{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.brand-actionbar .ba-state svg{width:14px;height:14px}
.brand-actionbar .ba-state.dirty{color:var(--warn,#F5A524)}
.brand-actionbar .ba-btns{margin-left:auto;display:flex;gap:8px}

/* logo 在既有容器里的显示（侧边栏 / 登录页 / 打印抬头 / 单据页脚） */
.doc-hd .logo img,.login-logo img,.sb-co-avatar img{width:100%;height:100%;object-fit:contain}

@media (max-width:1180px){
  .brand-cols{grid-template-columns:1fr}
}
@media (max-width:900px){
  .brand-grid{grid-template-columns:1fr}
  .brand-grid .field[style]{grid-column:auto !important}
  .brand-hero{padding:16px}
  .brand-hero-l{flex:1 1 100%}
  .brand-actionbar{flex-wrap:wrap}
  .brand-actionbar .ba-btns{width:100%;margin-left:0}
  .brand-actionbar .ba-btns .btn{flex:1}
}

/* ===================== 开发进度页 ===================== */
.prg-row{display:flex;align-items:center;gap:14px;padding:9px 0;border-bottom:1px dashed var(--line)}
.prg-row:last-child{border-bottom:0}
.prg-main{flex:1;min-width:0}
.prg-name{font-size:12.5px;color:var(--ink);display:flex;align-items:center;gap:8px;margin-bottom:6px}
.prg-bar{height:6px;border-radius:999px;background:#F1F5F9;overflow:hidden}
.prg-bar i{display:block;height:100%;border-radius:999px;background:var(--brand);transition:width .3s}
.prg-bar i.ok{background:#16B364}
.prg-num{flex:0 0 auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;min-width:42px;text-align:right}
.prg-num.ok{color:#0E8F50;font-weight:600}

.prg-pend{display:flex;align-items:flex-start;gap:8px;padding:9px 14px;border-bottom:1px dashed var(--line)}
.prg-pend:last-child{border-bottom:0}

/* 开发进度：技术栈（两栏布局下面单独占一行） */
.prg-stack-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:0 26px;margin-top:4px;
}
.prg-stack-item{
  display:flex;gap:10px;align-items:baseline;
  padding:9px 0;border-bottom:1px dashed var(--line);font-size:12px;
}
.prg-stack-item:last-child,.prg-stack-item:nth-last-child(2):nth-child(odd){border-bottom:0}
.prg-stack-item .k{flex:0 0 46px;color:var(--muted);font-weight:600}
.prg-stack-item .v{color:var(--ink);line-height:1.7}
/* 来自 Bug 反馈的条目：左侧一条红杠，和手工维护的待办区分开 */
.prg-pend.bug{box-shadow:inset 3px 0 0 var(--danger);background:#FFFCFC}
.prg-pend-t{flex:1;font-size:12.5px;color:var(--ink-2);line-height:1.6}
/* 弹窗里的待完成清单：给个浅底容器，与左侧阶段列表视觉对齐 */
.prg-pend-box{border:1px solid var(--line);border-radius:var(--r);background:#FCFDFF;
  max-height:300px;overflow:auto}

.prg-mile{display:flex;gap:10px;padding:8px 0}
.prg-mile-dot{width:7px;height:7px;border-radius:50%;background:var(--brand);margin-top:6px;flex:0 0 auto}
.prg-mile-at{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.prg-mile-t{font-size:12.5px;color:var(--ink-2);line-height:1.65;margin-top:2px}

/* ===================== 首次部署向导 ===================== */
.init-steps{display:flex;align-items:center;gap:18px;margin-bottom:18px;
  padding-bottom:14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.init-step{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted)}
.init-step .n{width:22px;height:22px;border-radius:50%;background:#F1F5F9;color:var(--muted);
  display:grid;place-items:center;font-size:11.5px;font-weight:600}
.init-step .n svg{width:12px;height:12px}
.init-step.on{color:var(--brand);font-weight:600}
.init-step.on .n{background:var(--brand);color:#fff}
.init-step.done{color:#0E8F50}
.init-step.done .n{background:var(--ok-50);color:#0E8F50}

/* ===================== Bug 反馈通道 ===================== */
.bug-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.bug-stat{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:10px 14px}
.bug-stat b{display:block;font-size:20px;font-variant-numeric:tabular-nums;color:var(--ink);line-height:1.2}
.bug-stat span{font-size:11.5px;color:var(--muted)}
.bug-stat.amber{border-left:3px solid #F5A524}
.bug-stat.blue{border-left:3px solid #2E6BFF}
.bug-stat.green{border-left:3px solid #16B364}
.bug-stat.gray{border-left:3px solid #94A0B4}

.bug-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.bug-search{position:relative;display:flex;align-items:center;flex:1 1 240px;min-width:180px}
.bug-search svg{position:absolute;left:11px;width:14px;height:14px;color:var(--faint);pointer-events:none}
.bug-search input{width:100%;height:32px;border:1px solid var(--line);border-radius:8px;
  padding:0 12px 0 32px;outline:none;font-size:12.5px;background:#fff}
.bug-search input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}

.bug-item{border:1px solid var(--line);border-radius:var(--r);background:#fff;margin-bottom:8px;overflow:hidden}
.bug-item.on{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}
.bug-hd{display:flex;align-items:center;gap:9px;padding:11px 14px;cursor:pointer}
.bug-hd:hover{background:#FCFDFF}
.bug-title{flex:1;min-width:0;font-size:13px;color:var(--ink);font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bug-meta{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.bug-ico{color:var(--faint);display:flex;transition:transform .2s}
.bug-item.on .bug-ico{transform:rotate(180deg)}

.bug-bd{padding:0 14px 14px;border-top:1px dashed var(--line)}
.bug-detail{font-size:12.5px;color:var(--ink-2);line-height:1.75;padding:12px 0;
  white-space:pre-wrap;word-break:break-word}
.bug-kv{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 14px;padding:10px 0;
  border-top:1px dashed var(--line);border-bottom:1px dashed var(--line)}
.bug-kv>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.bug-kv span{font-size:11px;color:var(--faint)}
.bug-kv b{font-size:12.5px;color:var(--ink-2);font-weight:500;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.bug-handle-note{margin-top:10px;padding:10px 12px;border-radius:8px;background:var(--ok-50);
  font-size:12.5px;color:var(--ink-2);line-height:1.7}
.bug-handle-note .fs11.faint{margin-bottom:4px}

@media (max-width:900px){
  .bug-stats{grid-template-columns:repeat(2,1fr)}
  .bug-kv{grid-template-columns:repeat(2,1fr)}
  .bug-title{white-space:normal}
  .cc-grid{grid-template-columns:1fr}
}

/* 供应商注册表单里的「其他联系人」：一个联系人一张小卡，
   字段标签沿用上方表单那套（标签在输入框上方），窄屏退成单列 */
.contact-card{
  border:1px solid var(--line);border-radius:10px;background:#FAFBFD;
  padding:12px 14px;margin-top:10px;
}
.contact-card:first-child{margin-top:0}
.cc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.cc-no{font-size:12px;font-weight:500;color:var(--ink-2)}
.cc-del{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;padding:0;border-radius:7px;
  border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer;
}
.cc-del:hover{color:var(--danger);border-color:var(--danger)}
.cc-del svg{width:13px;height:13px}
.cc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px}
.cc-grid .field{margin-bottom:0}
.contact-empty{
  border:1px dashed var(--line);border-radius:10px;padding:14px;
  text-align:center;font-size:12px;color:var(--muted);
}

/* ---------- 合同分阶段付款计划（行编辑器） ---------- */
.ctpp-row{
  display:grid;grid-template-columns:120px 76px 110px minmax(0,1fr) 140px 30px;
  gap:6px;align-items:center;margin-bottom:6px;
}
.ctpp-row.ctpp-head{
  font-size:11px;color:var(--muted);margin-bottom:4px;
}
.ctpp-row .mini-input{height:32px;font-size:12.5px;width:100%;min-width:0}
.ctpp-row .btn{height:30px;padding:0 6px}
@media (max-width:900px){
  .ctpp-row{grid-template-columns:1fr 1fr;gap:6px 8px}
  .ctpp-row.ctpp-head{display:none}
}

/* ===== 订单详情 · 横版进度条（竖版 timeline 太占空间，1.24.x） ===== */
.ord-steps{display:flex;align-items:flex-start;width:100%}
.ord-step{flex:1 1 0;min-width:0;text-align:center;padding:2px;border-radius:8px}
.ord-step:hover{background:#F7F9FF}
.os-track{display:flex;align-items:center;height:24px}
.os-line{flex:1 1 auto;height:2px;background:var(--line);min-width:8px}
.os-line.hid{visibility:hidden}
.os-dot{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid #D3DAE6;
  display:grid;place-items:center;font-size:11px;font-weight:600;color:var(--muted);flex:0 0 auto}
.os-dot svg{width:12px;height:12px}
.ord-step.done .os-line{background:var(--ok)}
.ord-step.now .os-l{background:var(--ok)}
.ord-step.done .os-dot{background:var(--ok);border-color:var(--ok);color:#fff}
.ord-step.now .os-dot{border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 3px var(--brand-50)}
.os-name{margin-top:6px;font-size:12px;font-weight:500;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ord-step.now .os-name{color:var(--brand);font-weight:600}
.ord-step:not(.done):not(.now) .os-name{color:var(--muted)}
.os-sub{margin-top:1px;font-size:10.5px;color:var(--faint)}
.ord-step.now .os-sub{color:var(--brand)}
.ord-step.done .os-sub{color:var(--ok)}

/* ===== 审批详情 · 业务单据卡内嵌可折叠明细（1.24.x） ===== */
.ad-more{margin-top:8px;padding-top:8px;border-top:1px dashed #DCE6FA;cursor:default}
.apr-doc.soft .ad-more{border-top-color:var(--line-2)}
.ad-more-hd{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;cursor:pointer;
  padding:2px 0;font-size:11.5px;font-weight:600;color:#2E6BFF;font-family:inherit}
.ad-more-hd:hover{text-decoration:underline}
.ad-more-hd svg{width:12px;height:12px;transition:transform .15s}
.ad-more.on .ad-more-hd svg{transform:rotate(180deg)}
.ad-more-bd{margin-top:6px;cursor:default}
.ad-more-bd table{width:100%;border-collapse:collapse;font-size:11.5px}
.ad-more-bd th{text-align:left;font-weight:600;color:var(--muted);padding:3px 6px;
  border-bottom:1px solid var(--line);background:#FAFBFD}
.ad-more-bd td{padding:3px 6px;border-bottom:1px dashed var(--line-2,var(--line));color:var(--ink)}
.ad-more-bd td.num{text-align:right;font-variant-numeric:tabular-nums}
.ad-more-sum{padding:5px 6px 0;font-size:11.5px;color:var(--muted)}
/* 折叠区里分段小标题（核销采购订单 / 合同付款计划与进度） */
.ad-more-sub{padding:2px 0 4px;font-size:11.5px;font-weight:600;color:var(--ink)}
.ad-more-bd .ad-more-sub:first-child{padding-top:0}
/* 付款详情抽屉里的计划表：比折叠区宽，按 .tbl 密度铺满并右对齐数字列 */
.pt-plan-wrap > table{width:100%;border-collapse:collapse;font-size:12px}
.pt-plan-wrap > table th{text-align:left;font-weight:600;color:var(--muted);padding:5px 8px;
  border-bottom:1px solid var(--line);background:#FAFBFD;white-space:nowrap}
.pt-plan-wrap > table td{padding:5px 8px;border-bottom:1px dashed var(--line-2,var(--line))}
.pt-plan-wrap > table td.num{text-align:right;font-variant-numeric:tabular-nums}
.pt-plan-wrap > table tr.pt-row-now{background:var(--brand-50)}
/* 审批折叠区只有右栏那么宽：用紧凑列（触发条件并进笔次格），
   关键列不给断行，付款单号允许折一行但不再碎成三行。 */
.ad-more-bd .pt-plan-wrap > table{font-size:11.5px}
.ad-more-bd .pt-plan-wrap > table th,
.ad-more-bd .pt-plan-wrap > table td{padding:4px 5px}
.ad-more-bd .pt-plan-wrap > table td.b6,
.ad-more-bd .pt-plan-wrap > table td.num,
.ad-more-bd .pt-plan-wrap > table th{white-space:nowrap}
/* 笔次格里的副行（比例 · 触发条件） */
.pt-sub{display:block;font-size:10.5px;font-weight:400;color:var(--muted);margin-top:1px;white-space:nowrap}
/* 付款单列：单号独占一行，日期与状态各占一行小字 */
.ad-more-bd .pt-plan-wrap td .link{font-size:11px;white-space:nowrap}
.ad-more-bd .pt-plan-wrap td .tag{transform:none;font-size:10px}

/* 合同分阶段付款计划（付款单详情 / 审批中心折叠区共用） */
.pt-plan-wrap{display:flex;flex-direction:column;gap:14px}
.pt-plan-wrap .ad-more-bd table{margin-top:6px}
.pt-plan-hd{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.pt-prog{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.pt-prog-bar{flex:1;height:6px;border-radius:3px;background:#EFF2F7;overflow:hidden}
.pt-prog-bar i{display:block;height:100%;background:linear-gradient(90deg,#2E6BFF,#16B364);border-radius:3px}
.pt-prog-txt{font-size:11.5px;color:var(--muted);min-width:42px;text-align:right}
.pt-row-now{background:var(--brand-50)}
.pt-row-now td{font-weight:600}

/* ---------- 费用申报：勾选类型后长出的逐笔录入行 ---------- */
.se-line{padding:10px 12px;margin-bottom:10px;background:#FAFBFD;
  border:1px solid var(--line);border-radius:var(--r)}
.se-line-hd{font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:6px}
.se-line .form-grid{gap:10px 14px}
.se-line .field{margin-bottom:0}
.ad-more-empty{padding:8px 2px;font-size:11.5px;color:var(--muted)}

/* ============================================================
   审批单据卡折叠区：分段块（核销 / 付款计划 / 物料清单）
   原来三段各自内联 margin，表格列宽也不受控，数字被拆成两行、物料名挤成三行。
   现在统一成「标题行 + 表格 + 合计行」的块，块之间用分隔线，列宽按内容分配。
   ============================================================ */
.ad-blk{padding:8px 0 4px;border-top:1px dashed var(--line)}
.ad-blk:first-child{padding-top:0;border-top:0}
.ad-blk-hd{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.ad-blk-t{font-size:12px;font-weight:600;color:var(--ink)}
.ad-blk-n{margin-left:auto;font-size:11px;color:var(--muted);white-space:nowrap}
.ad-blk-ft{padding:5px 2px 0;font-size:11.5px;color:var(--muted)}

/* 折叠区里的表格：数字列一律不折行，首列（单号）不折行 */
.ad-more-bd table.ad-tbl{width:100%;border-collapse:collapse;font-size:11.5px;
  table-layout:auto}
.ad-more-bd table.ad-tbl th{text-align:left;font-weight:600;color:var(--muted);
  padding:4px 6px;border-bottom:1px solid var(--line);background:#FAFBFD;white-space:nowrap}
.ad-more-bd table.ad-tbl th.num{text-align:right}
.ad-more-bd table.ad-tbl td{padding:4px 6px;border-bottom:1px dashed var(--line-2,var(--line));
  color:var(--ink);vertical-align:middle}
.ad-more-bd table.ad-tbl td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ad-more-bd table.ad-tbl td.tnum{white-space:nowrap}
/* 物料列：编码与名称上下两行，名称超长时省略而不是把行撑成三行 */
.ad-more-bd table.ad-tbl td.ad-mat{max-width:190px}
.ad-mat-nm{display:block;font-size:10.5px;color:var(--muted);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ============================================================
   显示与业务规则（原发票规则页）：设置项一行一个，左说明右控件
   ============================================================ */
.rule-row{display:flex;align-items:center;gap:16px;padding:6px 2px;flex-wrap:wrap}
.rule-row-l{flex:1 1 260px;min-width:0}
.rule-row-t{font-size:13px;font-weight:600}
.rule-row-s{font-size:12px;color:var(--muted);margin-top:4px;line-height:1.6}
.rule-row-r{flex:0 0 auto;display:flex;align-items:center;gap:8px}
@media (max-width:640px){
  .rule-row{align-items:flex-start}
  .rule-row-r{flex:1 1 100%}
  .rule-row-r .seg{flex-wrap:wrap}
}

/* 表格风格「向下无限加载」：分页条退化成一条进度条 + 滚到底自动续页 */
.pager.inf{display:block;padding:12px 18px;border-top:1px solid var(--line-2)}
.pager.inf .info{font-size:12px;color:var(--muted);text-align:center}
.pager.inf .inf-bar{
  height:4px;border-radius:2px;background:#EFF2F7;overflow:hidden;margin-top:8px;
}
.pager.inf .inf-bar i{display:block;height:100%;background:var(--brand);border-radius:2px;
  transition:width .2s}
.pager.inf[data-inf="end"] .inf-bar i{background:var(--ok,#16B364)}

/* 审批折叠区的三段式层次（核销 / 付款计划 / 物料）：
   顶部一排汇总数字 → 每个分段带序号徽标 + 竖条标题 + 底色块体。
   原来三段只有一条虚线分隔，表格与标题贴在一起，看不出这是三块不同的信息。 */
.ad-more-bd{padding-top:2px}

.ad-sum{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:6px;
  margin-bottom:10px;
}
.ad-sum-cell{
  padding:6px 8px;border-radius:8px;background:#F7F9FD;border:1px solid #E7ECF6;
  display:flex;flex-direction:column;gap:2px;min-width:0;
}
.ad-sum-cell .k{font-size:10.5px;color:var(--muted);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.ad-sum-cell .v{font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-sum-cell.hi{background:#EEF3FF;border-color:#C9D8FF}
.ad-sum-cell.hi .v{color:var(--brand)}

.ad-blk{
  padding:0;border-top:0;margin-top:10px;border-radius:9px;
  border:1px solid #E7ECF6;background:#fff;overflow:hidden;
}
.ad-blk:first-of-type{margin-top:0}
.ad-blk-hd{
  display:flex;align-items:center;gap:7px;margin:0;padding:7px 9px;
  background:#FAFBFE;border-bottom:1px solid #EDF1F8;
}
.ad-blk-no{
  width:16px;height:16px;flex:0 0 auto;border-radius:5px;background:#2E6BFF;color:#fff;
  font-size:10px;font-weight:700;display:grid;place-items:center;line-height:1;
}
.ad-blk-t{font-size:12px;font-weight:600;color:var(--ink)}
.ad-blk-n{margin-left:auto;font-size:10.5px;color:var(--muted);white-space:nowrap}
.ad-blk-bd{padding:0 0 2px}
.ad-blk-ft{padding:6px 9px;font-size:11px;color:var(--muted);background:#FCFDFF;
  border-top:1px dashed #EDF1F8}
.ad-blk-ft b{color:var(--ink)}

/* 合同关键信息这类两列信息表：左列当标签，右列当值 */
.ad-more-bd table.ad-tbl.ad-kv td{padding:5px 9px}
.ad-more-bd table.ad-tbl.ad-kv td.k{color:var(--muted);white-space:nowrap;width:96px}

/* ============================================================
   采购订单的调差明细（与合同「其他费用（调差）」拉通）
   一行三格：名目 / 金额 / 说明 + 删除；金额右对齐，窄屏自动换行。
   ============================================================ */
.ord-adj-row{display:grid;grid-template-columns:minmax(0,1.6fr) 132px minmax(0,1.4fr) 34px;
  gap:8px;align-items:center;margin-bottom:7px}
.ord-adj-row .mini-input{height:30px;width:100%;min-width:0}
.ord-adj-row .mini-input[data-af="amount"],
.ord-adj-row .mini-input[data-ef="amount"]{text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:720px){
  .ct-extra-row,.ord-adj-row{grid-template-columns:minmax(0,1fr) 110px}
  .ct-extra-row [data-ex="note"],.ord-adj-row [data-af="note"],.ord-adj-row [data-ef="note"]{
    grid-column:1 / -1}
  .ct-extra-row [data-exdel],.ord-adj-row [data-adel],.ord-adj-row [data-edel]{justify-self:end}
}
.ord-adj-row .mini-input[data-af="amount"],
.ord-adj-row .mini-input[data-ef="amount"]{font-variant-numeric:tabular-nums}

/* ============================================================
   国际物流 · 装箱与唛头
   排柜示意（俯视摆位 + 侧视堆码）与唛头单据（A5 单张 / A4 上下拼版）
   ============================================================ */
.pk-cabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:12px}
.pk-cab{border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;background:#fff}
.pk-cab-hd{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.pk-cab-hd b{font-size:13px}
.pk-cab-bar{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.pk-bar{flex:1;height:6px;background:#EEF1F6;border-radius:3px;overflow:hidden}
.pk-bar i{display:block;height:100%;background:linear-gradient(90deg,#2E6BFF,#7A5AF8)}
.pk-svg{width:100%;height:auto;display:block;border-radius:4px}
.pk-cab-lg{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.pk-lg{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--muted)}
.pk-lg i{width:9px;height:9px;border-radius:2px;display:inline-block}
.pk-dot{width:9px;height:9px;border-radius:2px;display:inline-block}
.mat-open{cursor:pointer}
.mat-open:hover{color:var(--primary)}

/* ---------- 唛头 ---------- */
.mk-page{page-break-after:always;break-after:page;margin-bottom:6mm}
.mk-page:last-child{page-break-after:auto;break-after:auto;margin-bottom:0}
.mk-cut{margin:2mm 0;color:#B6BFCC;font-size:10px;text-align:center;letter-spacing:1px}
.mk-sheet{width:182mm;height:128mm;margin:0 auto;box-sizing:border-box}
.mks{width:100%;height:100%;border-collapse:collapse;table-layout:fixed;color:#111}
.mks td{border:1px solid #333;padding:2px 5px;vertical-align:middle;font-size:11px;line-height:1.25;word-break:break-word}
.mks .mk-brand{border:1px solid #333}
.mks .mk-brand td{height:24mm;font-size:30px;font-weight:800;letter-spacing:4px;text-align:center;
  font-family:"Arial Black",Arial,sans-serif}
.mks .mk-lb{width:15%;font-weight:700;white-space:nowrap;background:#FAFBFC}
.mks .mk-vl{width:22%;font-weight:600}
.mks .mk-pn{font-size:12px;font-weight:700;text-transform:uppercase}
.mks .mk-th{width:auto;text-align:center;font-weight:700;background:#F1F4F9;font-size:10px;letter-spacing:.5px}
.mks .mk-ph{width:14%;text-align:center;padding:0;background:#fff}
.mks .mk-ph img{max-width:100%;max-height:26mm;object-fit:contain;display:block;margin:0 auto}
.mks .mk-ph-hint{color:#C3CBD8;font-size:9px;letter-spacing:1px}
.mks .mk-td{text-align:center;font-size:11px}
.mks .mk-cno{font-size:20px;font-weight:800;letter-spacing:2px;text-align:center}
.mks .mk-total{font-size:11px;font-weight:400;color:#6B7785;letter-spacing:0}
.mks .mk-ship{width:12%;text-align:right}
.mks .mk-made td{height:9mm;text-align:center;font-weight:800;letter-spacing:3px;font-size:13px}
.mk-sheet-a5{width:198mm;height:136mm}
.mk-page-a5 .mks{font-size:11.5px}

@media print{
  .mk-page{break-after:page}
  .mk-page:last-child{break-after:auto}
  .mk-sheet,.mks,.mks tr,.mks td{break-inside:avoid}
}

/* ============================================================
   数据总览 · 版面统一（T397）
   分区小标题 + 模块卡等高：指标行逐行对齐，值列不换行，
   卡底附加区（结构条 / 节点列表）贴底，同排卡片不再高矮不一。
   ============================================================ */
.ov-sec{display:flex;align-items:center;gap:8px;margin:22px 0 10px}
.ov-sec:first-child{margin-top:0}
.ov-sec-bar{width:3px;height:13px;border-radius:2px;background:var(--brand)}
.ov-sec-t{font-size:12.5px;font-weight:600;letter-spacing:.2px}
.ov-sec-s{font-size:11px;color:var(--muted)}
.grid.ov-row{align-items:stretch}
.grid.ov-row > .card{height:100%}