* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
  font-size: 12px; line-height: 1.5; color: #2B2823; background: #F5F1E8;
  -webkit-font-smoothing: antialiased;
}
::selection { background:#F7E4DE; color:#8C3621; }
::-webkit-scrollbar { width:9px; height:9px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#D6CBB6; border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background:#B7AE9B; }

.topbar {
  display:flex; align-items:center; gap:18px;
  height:46px; padding:0 18px; background:#fff;
  border-bottom:1px solid #E5DFD3; position:sticky; top:0; z-index:30;
}
.brand { display:flex; align-items:center; gap:7px; font-size:13px; font-weight:500; color:#2B2823; white-space:nowrap; }
.brand::before { content:""; width:9px; height:9px; border-radius:3px; background:#A8452C; flex:none; }
.brand .dot { color:#B7AE9B; margin:0 1px; }
.tabs { display:flex; gap:2px; flex:1; }
.tab {
  padding:5px 12px; border-radius:7px; cursor:pointer; color:#7A7365;
  border:none; background:transparent; font-size:12px; font-family:inherit;
  transition:background .12s, color .12s;
}
.tab:hover { background:#F2EDE3; color:#2B2823; }
.tab.on { background:#F7E4DE; color:#A8452C; font-weight:500; }
.topbar-right { display:flex; align-items:center; gap:10px; }
.save-tip { font-size:11px; color:#A69E8C; }
/* 未保存/保存失败：红字提醒（第五十轮），避免网络抖动时以为已经存上了 */
.save-tip.bad { color:#B0332B; font-weight:600; }
/* 身份栏里的角色标记 */
.role-tag { display:inline-block; margin-left:5px; padding:0 5px; border-radius:4px; background:#E6EFF6; color:#2A5A82; font-size:10px; line-height:15px; vertical-align:1px; }

.btn {
  padding:5px 11px; border-radius:7px; border:1px solid #DDD5C6; background:#fff;
  cursor:pointer; font-size:12px; font-family:inherit; color:#4A4438;
  transition:border-color .12s, background .12s, color .12s;
}
.btn:hover { border-color:#A8452C; color:#A8452C; background:#FDF7F4; }
.btn.primary { background:#A8452C; border-color:#A8452C; color:#fff; }
.btn.primary:hover { background:#8C3621; border-color:#8C3621; color:#fff; }
.btn.danger { color:#C0392B; border-color:#E8BEB8; }
.btn.danger:hover { background:#FBE3E1; border-color:#C0392B; color:#C0392B; }
.btn.sm { padding:2px 7px; font-size:11px; border-radius:6px; }
.btn.on { border-color:#A8452C; color:#A8452C; background:#FBF3F0; font-weight:600; }
main { padding:14px; max-width:1440px; margin:0 auto; }

.cards { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.card {
  flex:1; min-width:160px; background:#fff; border:1px solid #E5DFD3;
  border-radius:10px; padding:11px 13px; transition:border-color .12s;
}
.card:hover { border-color:#D4C9B4; }
.card .k { font-size:11px; color:#A69E8C; }
.card .v { font-size:20px; font-weight:500; margin-top:2px; letter-spacing:-.2px; font-variant-numeric:tabular-nums; }
.card .s { font-size:11px; color:#7A7365; margin-top:2px; }
.card.warn .v { color:#C0392B; }

.panel { background:#fff; border:1px solid #E5DFD3; border-radius:10px; margin-bottom:12px; }
.panel > h2 {
  margin:0; padding:10px 14px; font-size:12px; font-weight:500; color:#2B2823;
  border-bottom:1px solid #EFEADC; display:flex; align-items:center; gap:8px;
  position:relative; padding-left:27px;
}
.panel > h2::before {
  content:""; position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:3px; height:12px; border-radius:2px; background:#A8452C;
}
.panel > h2 .cnt { font-size:11px; color:#A69E8C; font-weight:400; }
.panel .body { padding:11px 14px; }
.panel .body.tight { padding:0; }

table { width:100%; border-collapse:collapse; }
th, td { padding:6px 9px; text-align:left; border-bottom:1px solid #F2EDE3; vertical-align:middle; }
th { font-size:11px; color:#A69E8C; font-weight:500; background:#FAF7F1; white-space:nowrap; }
.panel th { position:sticky; top:46px; z-index:5; box-shadow:inset 0 -1px 0 #E5DFD3; }
tbody tr:nth-child(even) { background:#FDFBF6; }
tbody tr:hover { background:#FBF5EF; }
tbody tr:last-child td { border-bottom:none; }
td.num, th.num { text-align:right; font-variant-numeric:tabular-nums; }
.nowrap { white-space:nowrap; }
.empty { padding:20px; text-align:center; color:#A69E8C; font-size:11px; }

/* 项目核对标记（临时功能，核完可一键清除） */
.checkbar {
  display:flex; align-items:center; gap:12px; background:#fff;
  border:1px solid #E5DFD3; border-radius:10px; padding:10px 13px; margin-bottom:10px;
}

/* 金额合计条：跟随当前筛选结果，实时显示下游/上游合计 */
.sumbar {
  display:flex; flex-wrap:wrap; align-items:center; gap:18px;
  background:#FBFAF7; border:1px solid #EFEADC; border-radius:10px;
  padding:9px 13px; margin-bottom:10px; font-size:12px; color:#7A7365;
}
.sumbar b { font-size:14px; font-weight:600; color:#2B2823; font-variant-numeric:tabular-nums; }
.sumbar .s1 { color:#2B2823; }
.sumbar .s2 { color:#A8452C; }
.sumbar .s3 { color:#B0332B; }
.chk {
  display:inline-flex; align-items:center; justify-content:center; flex:none;
  width:15px; height:15px; border-radius:4px; border:1px solid #C9BFA8; background:#fff;
  cursor:pointer; transition:background .12s, border-color .12s;
}
.chk:hover { border-color:#A8452C; }
.chk.on { background:#A8452C; border-color:#A8452C; }
.chkbtn { background:#F7E4DE; border-color:#E8C9BE; color:#A8452C; }
.chkbtn:hover { background:#F2D8CF; border-color:#A8452C; color:#8C3621; }

/* 通用折叠提示条（紧急度列表「显示全部 N 条」用） */
.fold-bar {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:7px 14px; background:#FAF7F1; border-top:1px solid #EFEADC; font-size:11px; color:#7A7365;
}

td.contact { max-width:260px; white-space:normal; word-break:break-word; line-height:1.5; }

/* 撤单项目：明细仍可查看，但整行弱化 + 项目名加删除线，一眼可辨、不参与任何统计 */
tr.row-void { opacity:.5; }
tr.row-void .btn, tr.row-void .chk { opacity:1; }
tr.row-void .link { text-decoration:line-through; }
tr.row-void:hover { opacity:.8; }

.tag { display:inline-block; padding:1px 7px; border-radius:5px; font-size:11px; line-height:1.5; white-space:nowrap; }
.tag.p0 { background:#FBE3E1; color:#B0332B; }
.tag.p1 { background:#FAEEDA; color:#8A5A0B; }
.tag.p2 { background:#FAEEDA; color:#8A5A0B; }
.tag.p3 { background:#EDF1E3; color:#4F6B2A; }
.tag.gray { background:#F1EDE3; color:#7A7365; }
.tag.blue { background:#E6EFF6; color:#2A5A82; }

/* 结算期限：直接显示到期日期，用颜色保留预警（超期红 / 15 天内琥珀），剩余天数在悬停提示里 */
.due-over { color:#B0332B; font-weight:600; }
.due-soon { color:#C9860F; font-weight:600; }

/* 逾期金额（手动填写）：填了值才出现，用警示红与金额列区分 */
.over { color:#B0332B; font-weight:600; font-variant-numeric:tabular-nums; }

.bar { height:7px; border-radius:3px; background:#EDE7D9; overflow:hidden; min-width:80px; }
.bar > i { display:block; height:100%; background:#7E8C55; }
.bar > i.hot { background:#C9860F; }
.bar > i.full { background:#C0392B; }

.row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.row.gap { gap:14px; }
.filters { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:10px; align-items:center; }
.colpick { position:relative; display:inline-block; }
.colmenu {
  position:absolute; right:0; top:calc(100% + 6px); z-index:60;
  background:#fff; border:1px solid #E5DFD3; border-radius:10px;
  box-shadow:0 10px 28px rgba(60,50,40,.14);
  padding:11px 13px; min-width:290px; max-height:340px; overflow:auto;
  display:grid; grid-template-columns:repeat(2, minmax(130px, 1fr)); gap:5px 14px;
}
/* ---- 多选筛选面板 ---- */
.mspick { position:relative; display:inline-block; }
.msbtn { white-space:nowrap; }
.msbtn.on {
  border-color:#A8452C; color:#A8452C; background:#FBF3F0; font-weight:600;
}
.msmenu {
  position:absolute; left:0; top:calc(100% + 5px); z-index:70;
  background:#fff; border:1px solid #E5DFD3; border-radius:10px;
  box-shadow:0 10px 28px rgba(60,50,40,.16);
  padding:9px 11px; min-width:190px; max-height:320px; overflow:auto;
}
.msmenu-wide { min-width:236px; }
.mshead {
  display:flex; gap:14px; font-size:11px; color:#2A5A82;
  padding-bottom:7px; margin-bottom:6px; border-bottom:1px solid #F0EBDD;
}
.mshead span { cursor:pointer; }
.mshead span:hover { color:#A8452C; text-decoration:underline; }
.mssearch { width:100%; box-sizing:border-box; margin-bottom:6px; font-size:12px; }
.mslist { display:flex; flex-direction:column; gap:1px; }
.msgroup { font-size:11px; color:#A69E8C; margin:7px 0 3px; padding-left:2px; }
.msitem {
  display:flex; align-items:center; gap:6px; padding:4px 5px; font-size:12px;
  border-radius:5px; cursor:pointer; white-space:nowrap;
}
.msitem:hover { background:#F8F5EC; }
.msitem.on { color:#A8452C; font-weight:600; background:#FBF3F0; }
.msitem input { margin:0; }
/* 分公司项：缩进 + 淡色 + 左侧细竖条（连续成一条组线），跟集团行形成层级 */
.msitem-sub {
  margin-left:9px; padding-left:17px; color:#7A7365;
  border-left:2px solid #EAE3D4; border-radius:0 5px 5px 0;
}
.msitem-sub.on { color:#A8452C; border-left-color:#E6C3B6; }
.msempty { font-size:11px; color:#B7AE9B; padding:6px 4px; }
/* 月份格子：每年一行，按 4 列排 */
.msyear { margin-bottom:9px; }
.msyear:last-child { margin-bottom:0; }
.msytitle {
  display:flex; align-items:center; justify-content:space-between;
  font-size:11px; color:#7A7365; margin-bottom:5px;
}
.msyall { color:#2A5A82; cursor:pointer; }
.msyall:hover { color:#A8452C; text-decoration:underline; }
.msgrid { display:grid; grid-template-columns:repeat(4, 1fr); gap:4px; }
.mscell {
  display:flex; align-items:center; justify-content:center; gap:3px;
  padding:4px 2px; font-size:11px; color:#5C5648;
  border:1px solid #E5DFD3; border-radius:6px; background:#fff;
  cursor:pointer; user-select:none;
}
.mscell:hover { border-color:#C9BFA9; }
.mscell.on { background:#FBF3F0; border-color:#A8452C; color:#A8452C; font-weight:600; }
.mscell input { margin:0; }

select, input, textarea {
  font-family:inherit; font-size:12px; padding:4px 8px; border:1px solid #DDD5C6;
  border-radius:6px; background:#fff; color:#2B2823;
}
input::placeholder, textarea::placeholder { color:#B7AE9B; }
input:focus, select:focus, textarea:focus {
  outline:none; border-color:#A8452C; box-shadow:0 0 0 2px rgba(168,69,44,.12);
}
input.dup { border-color:#C0392B !important; background:#FDF2F0; }
input.dup:focus { border-color:#C0392B !important; }
.dup-warn { display:inline-block; margin-top:3px; font-size:11px; color:#C0392B; }
label.f { display:flex; flex-direction:column; gap:3px; font-size:11px; color:#7A7365; }
label.f input, label.f select, label.f textarea { font-size:12px; color:#2B2823; }

.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px; }
.sec { margin:12px 0 6px; font-size:11px; color:#A69E8C; font-weight:500; border-bottom:1px solid #F2EDE3; padding-bottom:4px; }
.sec:first-child { margin-top:0; }

.modal-bg {
  position:fixed; inset:0; background:rgba(43,40,35,.38); z-index:50;
  display:flex; align-items:flex-start; justify-content:center; padding:20px; overflow:auto;
}
.modal {
  background:#fff; border-radius:12px; width:100%; max-width:920px;
  box-shadow:0 12px 36px rgba(60,50,40,.16);
}
.modal header {
  padding:12px 18px; border-bottom:1px solid #EFEADC; background:#FCFAF5;
  display:flex; align-items:center; justify-content:space-between;
  border-radius:12px 12px 0 0;
}
.modal header h3 { margin:0; font-size:13px; font-weight:500; }
.modal .content { padding:14px 18px; max-height:68vh; overflow:auto; }
.modal footer {
  padding:10px 18px; border-top:1px solid #EFEADC; background:#FCFAF5;
  display:flex; justify-content:flex-end; gap:8px; border-radius:0 0 12px 12px;
}
.close { cursor:pointer; color:#A69E8C; border:none; background:transparent; font-size:17px; line-height:1; font-family:inherit; }
.close:hover { color:#A8452C; }

.mini-list { border:1px solid #E5DFD3; border-radius:8px; overflow:hidden; }
.mini-list table { font-size:11px; }
.mini-list th { background:#FAF7F1; }

.step { border:1px solid #E5DFD3; border-radius:8px; margin-bottom:8px; }
.step > h4 { margin:0; padding:7px 11px; font-size:12px; font-weight:500; background:#FAF7F1; border-bottom:1px solid #EFEADC; }
.step .inner { padding:9px 11px; }

.reason { font-size:11px; color:#7A7365; }
.reason div { margin-top:1px; }
.warn-list { display:flex; flex-direction:column; gap:5px; }
.warn-item { display:flex; gap:8px; align-items:flex-start; padding:5px 8px; background:#FAF7F1; border-radius:7px; }
.warn-item .lv { flex:none; }
.link { color:#2A5A82; cursor:pointer; }
.link:hover { text-decoration:underline; }
.muted { color:#A69E8C; }

/* ---------- 阶段自动推进提示条 ---------- */
.stage-tip {
  max-width:1440px; margin:10px auto 0; padding:8px 12px;
  background:#FBF3F0; border:1px solid #EEDCD4; border-left:3px solid #A8452C;
  border-radius:8px; font-size:11.5px; color:#6B5C52;
  display:flex; align-items:flex-start; gap:8px;
}
.stage-tip[hidden] { display:none; }
.stage-tip b { color:#A8452C; font-weight:600; }
.stage-tip .st-body { flex:1; }
.stage-tip .st-x { flex:none; color:#A69E8C; cursor:pointer; padding:0 3px; }
.stage-tip .st-x:hover { color:#A8452C; }

/* ---------- 登录页（多人共用，第四十六轮） ---------- */
.loginwrap {
  display:flex; align-items:center; justify-content:center;
  min-height:62vh; padding:48px 20px;
}
.logincard {
  width:340px; background:#fff; border:1px solid #EFEADC; border-radius:14px;
  padding:26px 24px; box-shadow:0 10px 34px rgba(90,75,50,.09);
}
.loginbrand { font-size:16px; font-weight:600; color:#2B2823; text-align:center; margin-bottom:5px; letter-spacing:.3px; }
.logintip { font-size:12px; color:#7A7365; text-align:center; margin-bottom:18px; }
.loginerr { color:#B0332B; font-size:12px; min-height:18px; margin:2px 0 8px; line-height:1.5; }
.loginfoot { font-size:11px; color:#A79E8C; text-align:center; margin-top:14px; line-height:1.6; }

/* 身份栏：右上角当前登录人 */
.userbox { display:inline-flex; align-items:center; }
.userbox .btn { font-size:12px; padding:4px 10px; }

/* 用户名等机器可读字段用等宽，肉眼区分 0/O、1/l */
.mono { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12px; }

/* ---------- 合同附件（第四十八轮；第四十九轮拆上游/下游两栏） ---------- */
.att-cols { display:flex; gap:16px; align-items:flex-start; }
.att-col { flex:1 1 0; min-width:0; }
.att-col + .att-col { border-left:1px dashed #EFEADC; padding-left:16px; }
.att-col-head { font-size:13px; font-weight:600; color:#3A342B; margin-bottom:2px; }
@media (max-width: 768px) {
  .att-cols { flex-direction:column; gap:12px; }
  .att-col + .att-col { border-left:none; padding-left:0; border-top:1px dashed #EFEADC; padding-top:12px; }
}
.att-row {
  display:flex; align-items:center; gap:10px;
  padding:6px 8px; border-bottom:1px dashed #EFEADC; font-size:13px;
}
.att-row:last-of-type { border-bottom:none; }
.att-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.att-meta { flex:none; color:#8A8272; font-size:12px; }
.att-ops { flex:none; display:inline-flex; gap:6px; }
.att-ops .btn { padding:2px 9px; font-size:12px; }
.att-ops a.btn { text-decoration:none; }
