:root {
  --bg: #f5f7fa;
  --panel: #ffffff;
  --ink: #1f2733;
  --muted: #6b7785;
  --line: #e3e8ef;
  --primary: #2f6bff;
  --primary-d: #1f4fd6;
  --green: #1f9d55;
  --red: #e0392b;
  /* 缺失的 --card 兜底为白 */
  --card: #ffffff;
  --amber: #e08a00;
  --shadow: 0 1px 3px rgba(20,30,50,.08), 0 6px 20px rgba(20,30,50,.06);
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font-family: -apple-system, "Segoe UI", "Microsoft YaHei", Roboto, sans-serif;
  background: var(--bg); color: var(--ink); font-size: 14px;
}
.hidden { display: none !important; }
button { font-family: inherit; cursor: pointer; }

/* ---------- 登录 ---------- */
.login-wrap { height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg,#2f6bff,#5b8cff); }
.login-card { background: #fff; padding: 36px 32px; border-radius: 14px; width: 320px; box-shadow: var(--shadow); }
.login-card h1 { margin: 0 0 4px; font-size: 22px; }
.login-card .sub { margin: 0 0 22px; color: var(--muted); font-size: 13px; }
.login-card input { width: 100%; padding: 11px 12px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; }
.login-card .hint { margin: 10px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
.err { color: var(--red); font-size: 13px; min-height: 18px; margin-bottom: 6px; }

/* ---------- 按钮 ---------- */
.btn { border: 1px solid var(--line); background: #fff; color: var(--ink); padding: 8px 14px; border-radius: 8px; font-size: 13px; transition: .15s; }
.btn:hover { border-color: #c4ccd6; }
.btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn.primary:hover { background: var(--primary-d); }
.btn.ghost { background: transparent; border-color: transparent; color: var(--muted); }
.btn.ghost:hover { background: #eef1f6; }
.btn.sm { padding: 5px 10px; font-size: 12px; }
.btn.block { width: 100%; padding: 11px; font-size: 15px; margin-top: 4px; }
.btn.danger { color: var(--red); border-color: #f3c4bf; }
.btn.danger:hover { background: #fdecea; }

/* ---------- 布局 ---------- */
.app { display: flex; height: 100vh; }
.sidebar { width: 200px; background: #0f1b33; color: #cdd6e6; display: flex; flex-direction: column; padding: 18px 12px; }
.sidebar .logo { font-size: 20px; font-weight: 700; color: #fff; padding: 6px 10px 18px; letter-spacing: 2px; }
.sidebar nav { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.sidebar nav a { padding: 10px 12px; border-radius: 8px; color: #cdd6e6; cursor: pointer; font-size: 14px; border-left: 3px solid transparent; transition: background .15s, color .15s; }
.sidebar nav a:hover { background: #1b2a47; color: #fff; }
.sidebar nav a.active { background: rgba(47,107,255,.18); color: #fff; border-left: 3px solid var(--primary); }
.sidebar .me { border-top: 1px solid #1b2a47; padding-top: 12px; display: flex; align-items: center; justify-content: space-between; font-size: 13px; }

.main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; border-bottom: 1px solid var(--line); background: #fff; }
.topbar h2 { margin: 0; font-size: 18px; }
.view { padding: 22px 24px; overflow: auto; flex: 1; min-height: 0; position: relative; }

/* ---------- 卡片 ---------- */
.stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); gap: 14px; margin-bottom: 14px; }
.stat { background: var(--panel); border-radius: 12px; padding: 16px; box-shadow: var(--shadow); }
.stat .n { font-size: 26px; font-weight: 700; }
.stat .l { color: var(--muted); font-size: 13px; margin-top: 4px; }
.stat.red .n { color: var(--red); }
.stat.green .n { color: var(--green); }
.stat.amber .n { color: var(--amber); }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.card { background: var(--panel); border-radius: 12px; padding: 18px; box-shadow: var(--shadow); }
.card h3 { margin: 0 0 14px; font-size: 15px; }
.card.full { grid-column: 1 / -1; }

/* ---------- 图表 ---------- */
.bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 13px; }
.bar-row .label { width: 90px; color: var(--muted); flex-shrink: 0; }
.bar-track { flex: 1; background: #eef1f6; border-radius: 6px; height: 18px; overflow: hidden; }
.bar-fill { height: 100%; background: var(--primary); border-radius: 6px; }
.bar-row .val { width: 56px; text-align: right; flex-shrink: 0; }
svg.chart { width: 100%; height: 160px; }

/* ---------- 表格 ---------- */
.toolbar { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; align-items: center; }
.toolbar input, .toolbar select { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.toolbar .spacer { flex: 1; }
.filters { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; align-items: center; }
.filters input { flex: 1; min-width: 220px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.filters .spacer { flex: 1; }
.filter-btn { border: 1px solid var(--line); background: #fff; color: var(--ink); padding: 8px 14px; border-radius: 8px; font-size: 13px; cursor: pointer; transition: all .15s; white-space: nowrap; }
.filter-btn:hover { border-color: var(--blue, #2f6bff); color: var(--blue, #2f6bff); }
.filter-btn.active { background: var(--blue, #2f6bff); border-color: var(--blue, #2f6bff); color: #fff; }
.filter-btn .bell-ico { vertical-align: -2px; margin-right: 4px; }
.filter-btn .expf-n { color: #e23b3b; font-weight: 700; }
.filter-btn.active .expf-n { color: #ff8a8a; }

/* 联系人页工具栏搜索框（与客户页 c-search 同款风格） */
.kt-search {
  padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px;
  font-size: 13px; min-width: 200px; outline: none;
}
.kt-search:focus { border-color: var(--blue, #2f6bff); }

/* 跟进看板弹窗里的「快手ID」点击链接：与主键同款蓝色 */
.ks-link { color: var(--blue, #2f6bff); cursor: pointer; font-weight: 600; text-decoration: none; }
.ks-link:hover { text-decoration: underline; }
.toolbar .pager-size { font-size: 13px; color: var(--muted); display: inline-flex; align-items: center; gap: 4px; }
.toolbar .pager-size select { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.pager { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 14px; padding: 4px 2px; flex-wrap: wrap; }
.pager .pager-info { font-size: 13px; color: var(--muted); margin: 0 4px; }
.pager .btn[disabled] { opacity: .45; cursor: not-allowed; }
.pager .pg-btn { border: 1px solid var(--line); background: var(--card); color: var(--ink); padding: 6px 12px; border-radius: 8px; font-size: 13px; cursor: pointer; transition: all .15s; white-space: nowrap; }
.pager .pg-btn:hover:not([disabled]) { border-color: var(--blue, #2f6bff); color: var(--blue, #2f6bff); }
.pager .pg-btn[disabled] { opacity: .45; cursor: not-allowed; }
.pager .pg-info { font-size: 13px; color: var(--muted); margin: 0 6px; }
.pager .pg-info b { color: var(--ink); }
/* 底部分页栏左侧：每页条数 + 显示字段（原在顶部工具栏，2026-09-08 下移） */
.pager .pager-left { margin-right: auto; display: inline-flex; align-items: center; gap: 8px; }
.pager .pager-size { font-size: 13px; color: var(--muted); display: inline-flex; align-items: center; gap: 4px; }
.pager .pager-size select { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
/* 到期筛选分组标签 + 逾期未续按钮（激活态用橙色警示，与蓝色「未逾期」区分） */
.expf-group { font-size: 12px; color: var(--muted); padding-left: 6px; border-left: 1px solid var(--line); margin-left: 2px; }
/* 逾期未续下拉框（2026-09-09 改自4个按钮为单下拉）：与 filter-btn 同高，橙色焦点环 */
.overdue-sel { padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; background: #fff; color: var(--ink); cursor: pointer; min-width: 130px; }
.overdue-sel:focus { outline: none; border-color: #e8590c; box-shadow: 0 0 0 2px rgba(232,89,12,.12); }
.filters .overdue-sel { font-weight: 600; }
.filter-btn.overdue.active { background: #e8590c; border-color: #e8590c; }
.filter-btn.overdue:hover { border-color: #e8590c; color: #e8590c; }
.filter-btn.overdue.active .expf-n { color: #ffe0cc; }
/* 业绩明细：快手ID 点击展开历史订单（2026-09-09） */
.perf-ksid { cursor: pointer; }
.ksid-link { color: var(--blue, #2f6bff); border-bottom: 1px dashed currentColor; }
.perf-ksid.open .ksid-link { font-weight: 700; border-bottom-style: solid; }
.perf-ks-hist > td, .ks-hist-row > td { background: #f7f9fc; padding: 10px 14px !important; }
.ks-hist-box { max-height: 320px; overflow: auto; }
.ks-hist-title { font-size: 12px; color: var(--muted); margin-bottom: 6px; font-weight: 600; }
/* 历史订单：横排表格外观，用 CSS Grid 的 div 网格实现
   （嵌套 <table> 会被 .dt 的 table-layout/overflow 规则裁掉 tbody，故改用 grid） */
.ks-hist-scroll { max-width: 100%; overflow-x: auto; }
.ks-hist-grid {
  display: grid;
  grid-template-columns: max-content max-content max-content max-content max-content max-content max-content max-content minmax(70px, 180px);
  font-size: 12px; background: #fff;
  border: 1px solid #eef1f6; border-radius: 8px; overflow: hidden;
  width: max-content; min-width: 100%;
}
.ks-hist-grid > div {
  padding: 6px 10px;
  border-bottom: 1px solid #eef1f6; border-right: 1px solid #eef1f6;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-hist-grid > div:nth-child(9n) { border-right: none; }
.ks-hist-grid > .h { background: #eef2f8; font-weight: 600; }
.ks-hist-grid > .r:nth-child(9n+1), .ks-hist-grid > .r:nth-child(9n+2) { color: var(--ink); }
.ks-hist-grid > .num { text-align: right; }
.amt-cell { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
table { width: 100%; border-collapse: collapse; background: var(--panel); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); }
/* .dt 已有自己的布局/圆角，避免被上面这条 table 默认规则覆盖（特别是 box-shadow + overflow:hidden 重叠会和 sticky 冲突） */
table.dt { width: auto; }
th, td { text-align: left; padding: 11px 14px; border-bottom: 1px solid #eef1f6; font-size: 13px; }
th { background: #f7f9fc; color: var(--muted); font-weight: 600; }
tr:hover td { background: #fafbfd; }
.tag { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 12px; background: #eef1f6; color: var(--muted); }
.tag.lv0 { background: #fdecea; color: var(--red); }
.tag.lv1 { background: #eaf2ff; color: var(--primary); }
.tag.lv2 { background: #eef6ee; color: var(--green); }
.empty { text-align: center; color: var(--muted); padding: 48px 20px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.empty-ico { width: 56px; height: 56px; border-radius: 50%; background: #eef1f6; color: #9aa6b5; display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 600; }
.empty-text { font-size: 14px; }
.notes-cell { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.order-no-cell { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: #5a5a5a; font-size: 13px; white-space: nowrap; }

/* ---------- 到期时间排序/预警 ---------- */
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable:hover { color: var(--primary); }
td.sel-col, th.sel-col { box-sizing: border-box; width: 34px; text-align: center; padding-left: 6px; padding-right: 6px; }
td.sel-col input, th.sel-col input { cursor: pointer; width: 16px; height: 16px; vertical-align: middle; }
td.exp-overdue { color: var(--red); font-weight: 600; }
td.exp-warn { color: var(--amber); font-weight: 600; }
td.exp-near { color: var(--ink); }
.exp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; vertical-align: middle; background: var(--muted); }
.exp-dot.exp-overdue { background: var(--red); }
.exp-dot.exp-warn { background: var(--amber); }
.exp-dot.exp-near { background: var(--green); }
.ks-tag { display: inline-block; padding: 1px 7px; border-radius: 10px; font-size: 12px; background: #eaf2ff; color: var(--primary); margin: 1px 2px 1px 0; white-space: nowrap; }
.ks-tag.exp-warn { background: #fff3e0; color: var(--amber); border: 1px solid var(--amber); }
.ks-tag.exp-near { background: #e8f6ec; color: var(--green); border: 1px solid var(--green); }
.ks-tag.exp-overdue { background: #fdeaea; color: var(--red); border: 1px solid var(--red); }

/* ---------- 列表：竖向冻结（仅表头 + 其上工具栏，左右列不冻结） ----------
   回归最稳的单表结构：
     .view                = 一个滚动容器，含工具栏(.view-toolbar) + 单 table(.dt)
       .view-toolbar      = position: sticky; top: 0; 永远吸顶
       thead th            = position: sticky; top: var(--bar-h, 0px)
   左右列不冻结；不再有双表/transform 同步、列宽漂移从源头消除。                       */
.view { overflow: auto; padding: 0; }
/* 仪表盘等非列表页恢复整页可滚动 + 内边距 */
.view.dash-view { padding: 22px 24px; }
.view-toolbar {
  position: sticky; top: 0; z-index: 30;
  background: var(--bg);
  padding: 18px 24px 12px;
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  border-bottom: 1px solid transparent;
  isolation: isolate;             /* 独立 stacking context，杜绝 tbody 行穿透吸顶工具栏 */
}
.view-toolbar .toolbar,
.view-toolbar .filters { margin: 0; }
/* 列表单表：撑满容器宽度；列宽由 th[data-col-key]._w 控制（可选 px，未设则自适应）
   注意：不能让 .dt 自己 overflow:hidden，否则 thead 的 position:sticky 失效
   —— 必须显式覆盖 line 105 全局 `table{overflow:hidden}` 的圆角外框样式 */
.dt {
  width: calc(100% - 48px);
  margin: 0 24px 22px;
  border-collapse: collapse; border-spacing: 0;
  background: var(--panel);
  border-radius: 12px;
  box-shadow: var(--shadow);
  overflow: visible !important;     /* 全局 table{} 默认 overflow:hidden 会破坏 sticky thead */
  position: relative;               /* 给 sticky thead 一个明确的定位上下文 */
}
.dt thead th {
  background: #f7f9fc;
  border-bottom: 1px solid var(--line);
  position: sticky; top: var(--bar-h, 0px); z-index: 21;
  box-shadow: none;                 /* 避免和上层圆角 box-shadow 双重残影 */
  isolation: isolate;               /* 独立 stacking context，杜绝 tbody 行穿透吸顶表头 */
}
/* Chromium 滚动合成「陈旧瓦片」残留：滚动时 tbody 行内容（尤其操作列按钮）会穿透绘制在
   吸顶表头/工具栏之间的条带上（hit-test 正确、绘制残留，无头 Chrome 复现实证）。
   修法：把表头背景向上延伸 160px「认领」该条带——表头层(z-21)画在行内容之上，
   工具栏(z-30)又画在本延伸层之上，三层各归其位，穿透消失（260px/1000px 滚动压测通过）。 */
.dt thead th::before {
  content: "";
  position: absolute;
  left: -1px; right: -1px;
  top: -160px; height: 160px;
  background: inherit;
  z-index: -1;
  pointer-events: none;
}
.dt tbody tr:hover > td { background: #f6f9ff; }

/* 列宽拖拽手柄：在 sticky 元素内仍可相对 th 定位（sticky 元素本身是子元素的定位上下文） */
.dt td, .dt thead th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dt td:first-child, .dt thead th:first-child,
.dt td:last-child, .dt thead th:last-child { overflow: visible; }
th[data-col-key] { cursor: grab; }
th[data-col-key].dragging { opacity: .5; }
th[data-col-key].drag-over { outline: 2px solid var(--primary); outline-offset: -2px; }
.col-resizer { position: absolute; top: 0; right: 0; width: 7px; height: 100%; cursor: col-resize; user-select: none; }
.col-resizer:hover { background: rgba(47,107,255,.20); }
.cell-name { min-width: 0; }
.cell-name > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dt tr.quick-row td, .dt tr.fu-rec-row td, .dt tr.ks-hist-row td { white-space: normal; overflow: visible; text-overflow: clip; }

/* 普通表格（无 head/body 拆分）— 兜底（同 .dt） */
.tel { color: var(--primary); text-decoration: none; border-bottom: 1px dashed var(--primary); cursor: pointer; }
.tel:hover { color: var(--primary-dark, #1d4ed8); border-bottom-style: solid; }
.expiry-table th, .expiry-table td { text-align: center; }
.expiry-table td:first-child, .expiry-table th:first-child { text-align: left; }
.linkbtn { border: none; background: none; color: var(--primary); font-weight: 700; font-size: 14px; padding: 2px 6px; cursor: pointer; }
.linkbtn:hover { text-decoration: underline; }

/* ---------- 列表内快速跟进 ---------- */
tr.quick-row > td { background: #f3f7ff !important; padding: 14px 16px; border-bottom: 2px solid #cfe0ff; }
tr.fu-rec-row > td { background: #fafbff !important; padding: 14px 16px; border-bottom: 2px solid #e3e9f5; }
.fu-rec-title { font-weight: 600; color: var(--primary); margin-bottom: 8px; }
.fu-rec-item { background: #fff; border: 1px solid #eef1f6; border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; }
.fu-rec-item:last-child { margin-bottom: 0; }
.fu-rec-head { font-size: 13px; margin-bottom: 4px; }
.fu-rec-meta { color: var(--muted); font-size: 12px; margin-left: 6px; }
.fu-rec-content { font-size: 13px; color: var(--ink); white-space: pre-wrap; word-break: break-word; }
.fu-rec-next { font-size: 12px; color: var(--primary-dark); margin-top: 3px; }
.fu-rec-empty, .fu-rec-loading { color: var(--muted); font-size: 13px; padding: 4px 0; }
.qf-fu { background: #f3f7ff; border: 1px solid #cfe0ff; border-top: none; border-radius: 0 0 10px 10px; padding: 14px 16px; }
.quick-follow { display: flex; flex-direction: column; gap: 10px; }
.qf-row1 { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.qf-row1 .qf-remind, .qf-row1 .qf-next { padding: 5px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.qf-row1 .qf-next { flex: 1; min-width: 180px; }
.qf-row1 select { padding: 5px 10px; }
.quick-follow textarea { width: 100%; min-height: 64px; resize: vertical; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; font-family: inherit; }
.quick-follow textarea:focus, .qf-row1 input:focus { outline: none; border-color: var(--primary); }
.qf-row2 { display: flex; align-items: center; gap: 10px; }
/* 快速跟进面板内的历史跟进记录区（2026-09-09）：上半填表、下半看历史并可逐条删除 */
.qf-hist { margin-top: 2px; border-top: 1px dashed var(--line); padding-top: 8px; max-height: 280px; overflow: auto; }
.fu-rec-head .fu-del { float: right; padding: 1px 8px; font-size: 12px; margin-left: 8px; }
.qf-msg { color: var(--muted); font-size: 12px; }

/* ---------- 联系人历史跟进 ---------- */
.ct-fu { margin-top: 6px; padding: 8px 10px; background: #f7f9fc; border: 1px solid var(--line); border-radius: 8px; }
.ct-fu-item { font-size: 12px; color: var(--ink); padding: 3px 0; border-bottom: 1px dashed #eef1f6; }
.ct-fu-item:last-child { border-bottom: none; }
.ct-fu-item .meta { margin-left: 6px; }

/* ---------- 弹窗 ---------- */
.modal-mask { position: fixed; inset: 0; background: rgba(15,27,51,.45); display: flex; align-items: center; justify-content: center; z-index: 300; }
.modal { background: #fff; width: 520px; max-width: 94vw; max-height: 90vh; border-radius: 14px; display: flex; flex-direction: column; box-shadow: var(--shadow); }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.modal-head h3 { margin: 0; font-size: 16px; }
.modal-body { padding: 20px; overflow: auto; }
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 5px; }
.field input, .field select, .field textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; font-family: inherit; }
.field textarea { resize: vertical; min-height: 64px; }
/* 可搜索下拉选择器（所属客户等） */
.search-select { position: relative; }
.search-select .ss-input { width: 100%; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; font-family: inherit; box-sizing: border-box; }
/* 默认全局隐藏；portal 到 body 后不再受 .search-select 祖先约束，必须靠自身 data-open 决定可见 */
.ss-list { display: none; position: fixed; z-index: 400; max-height: 250px; overflow: auto; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 22px rgba(20,30,50,.14); }
/* portal 后用 data-open 属性控制显隐（不再依赖失效的祖先 .search-select.open 选择器）*/
.ss-list[data-open] { display: block; }
/* 兼容未 portal 的旧链路（不期望命中，但保留）*/
.search-select.open .ss-list { display: block; }
.search-select .ss-item { padding: 9px 11px; font-size: 14px; color: var(--ink); cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.search-select .ss-item:hover { background: #eef3fb; }
.search-select .ss-item.active { background: #e3edfb; }
.search-select .ss-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-select .ss-sub { color: var(--muted); font-size: 12px; }
.search-select .ss-empty { padding: 10px 11px; color: var(--muted); font-size: 13px; }
.search-select .ss-create { padding: 9px 11px; font-size: 14px; color: var(--primary, #2f6fed); cursor: pointer; font-weight: 600; background: #f3f8ff; }
.search-select .ss-create:hover { background: #e3edfb; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.modal-foot { display: flex; gap: 10px; justify-content: flex-end; margin-top: 8px; }

/* 录入业绩弹窗：更窄 + 更紧凑（仅作用于该弹窗，不影响其他弹窗）
   注意：openModal 的 cls 加在外层遮罩 #modal(.modal-mask) 上，卡片是内部的 .modal，
   所以这里必须从 .modal-mask.pde-modal 往下选，不能写成 .modal.pde-modal。 */
.modal-mask.pde-modal .modal { width: 470px; }
.modal-mask.pde-modal .modal-body { padding: 14px 18px 16px; }
.modal-mask.pde-modal .field { margin-bottom: 10px; }
.modal-mask.pde-modal .field label { font-size: 12px; margin-bottom: 4px; }
.modal-mask.pde-modal .field input,
.modal-mask.pde-modal .field select { padding: 7px 10px; font-size: 13px; }
.modal-mask.pde-modal .field textarea { min-height: 50px; }
.modal-mask.pde-modal .row2 { gap: 10px; }
.modal-mask.pde-modal .modal-foot { margin-top: 2px; }
.modal-mask.pde-modal .meta { font-size: 12px; line-height: 1.5; }
/* 标签右侧的浅色格式提示（如「11 位手机号 或 区号-座机号」） */
.modal-mask.pde-modal .lbl-tip { color: var(--muted); font-size: 11px; font-weight: 400; margin-left: 6px; }

.field-list { display: flex; flex-wrap: wrap; gap: 8px 18px; max-height: 320px; overflow: auto; padding: 4px 0; }
.field-list .chk { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--ink); width: calc(50% - 9px); cursor: pointer; }
.field-list .chk input { width: auto; }

/* ---------- 详情 ---------- */
.detail-section { margin-bottom: 22px; }
.detail-section h4 { margin: 0 0 10px; font-size: 14px; border-left: 3px solid var(--primary); padding-left: 8px; }
.mini-list { border: 1px solid var(--line); border-radius: 8px; }
.mini-item { padding: 10px 12px; border-bottom: 1px solid #eef1f6; font-size: 13px; }
.mini-item:last-child { border-bottom: none; }
.mini-item .meta { color: var(--muted); font-size: 12px; margin-top: 3px; }
.fu-info { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 6px; padding: 6px 8px; background: #f5f8ff; border-radius: 6px; font-size: 13px; }
.fu-info > span { display: inline-flex; align-items: center; gap: 4px; }
.fu-info i { font-style: normal; color: var(--muted); font-size: 12px; }

/* ---------- 商机看板 ---------- */
.kanban { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; }
.kcol { background: var(--panel); border-radius: 12px; width: 240px; flex-shrink: 0; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.kcol .kh { padding: 12px 14px; font-weight: 600; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; }
.kcol .kbody { padding: 10px; display: flex; flex-direction: column; gap: 10px; min-height: 40px; }
.kcard { background: #f7f9fc; border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
.kcard .kn { font-weight: 600; font-size: 13px; }
.kcard .km { color: var(--muted); font-size: 12px; margin-top: 4px; display: flex; justify-content: space-between; }
.kcard select { margin-top: 8px; width: 100%; padding: 5px; border-radius: 6px; border: 1px solid var(--line); font-size: 12px; }

/* ---------- 进度 ---------- */
.progress { height: 14px; background: #eef1f6; border-radius: 8px; overflow: hidden; margin: 8px 0; }
.progress > div { height: 100%; background: var(--green); }

/* ---------- toast ---------- */
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%); background: #1f2733; color: #fff; padding: 11px 20px; border-radius: 8px; font-size: 13px; z-index: 99; box-shadow: var(--shadow); }

/* ---------- 业绩数据卡片 ---------- */
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.seg-btn { border: none; background: #fff; color: var(--muted); padding: 6px 14px; font-size: 13px; cursor: pointer; }
.seg-btn + .seg-btn { border-left: 1px solid var(--line); }
.seg-btn.active { background: var(--primary); color: #fff; }
.perf-summary { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.perf-num { border-radius: 10px; padding: 14px 16px; }
.perf-num .n { font-size: 24px; font-weight: 700; }
.perf-num .l { color: var(--muted); font-size: 13px; margin-top: 4px; }
.perf-num.signed { background: #eaf2ff; color: var(--primary); }
.perf-num.consumed { background: #fff2e8; color: var(--amber); }
.perf-num.consumed .l { color: #b76a14; }
.perf-num.total { background: #eaf7ef; color: #1f9d55; }
.perf-num.total .l { color: #177a42; }
.eb-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 14px; }
.eb-summary .perf-num { display: flex; flex-direction: column; align-items: center; }
.eb-summary .perf-num.eb-click { border: none; font: inherit; width: 100%; cursor: pointer; transition: transform .08s, filter .08s; }
.eb-summary .perf-num.eb-click:hover { filter: brightness(0.96); transform: translateY(-1px); }
.perf-num.danger { background: #fdecec; color: #e23b3b; }
.perf-num.danger .l { color: #b02a2a; }
.exp-red { color: #e23b3b; }
.exp-red:hover { text-decoration: underline; }
.perf-chart { background: #fff; border: 1px solid #eef1f6; border-radius: 10px; padding: 8px 4px; }
.perf-chart svg.chart { height: 220px; }
.legend { display: flex; gap: 18px; justify-content: center; font-size: 12px; color: var(--muted); margin-top: 2px; }
.legend i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 5px; vertical-align: middle; }
.perf-owner { margin-top: 16px; }
.perf-owner h4 { margin: 0 0 8px; font-size: 14px; }
.perf-owner table.mini { box-shadow: none; }
.perf-owner table.mini th, .perf-owner table.mini td { padding: 8px 12px; }
/* 看板业绩卡+排名表左右并排对齐：每列一个 .perf-side（汇总数字 + 明细表） */
.perf-side-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
.perf-side { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.perf-side .perf-num { padding: 14px 16px; }
.perf-side table.mini { box-shadow: none; }
.perf-side table.mini th, .perf-side table.mini td { padding: 8px 12px; }
.perf-side table.mini th.num-col,
.perf-side table.mini td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---------- 业绩记录管理 ---------- */
.perf-toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.perf-toolbar select { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.perf-toolbar .spacer { flex: 1; }

/* ---------- 自定义周期筛选（hover 月份飞出每日二级） ---------- */
.period-picker { position: relative; display: inline-block; }
.period-picker-btn { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; background: #fff; cursor: pointer; min-width: 168px; text-align: left; color: var(--text); }
.period-picker-btn::after { content: "▾"; float: right; color: var(--muted); margin-left: 8px; }
.period-pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 200; background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 8px 24px rgba(20,30,50,.14); padding: 6px; min-width: 184px; }
.period-item { padding: 7px 10px; border-radius: 7px; cursor: pointer; font-size: 13px; white-space: nowrap; }
.period-item:hover { background: #f2f6ff; }
.period-group-label { font-size: 11px; color: var(--muted); padding: 6px 10px 2px; }
.period-month { position: relative; }
.period-month > .period-item::after { content: "›"; float: right; color: var(--muted); margin-left: 10px; }
.period-flyout { display: none; position: absolute; left: 100%; top: 0; margin-left: 2px; background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 8px 24px rgba(20,30,50,.14); padding: 6px; min-width: 150px; max-height: 340px; overflow-y: auto; z-index: 210; }
.period-month.open > .period-flyout { display: block; }
.period-flyout-item { padding: 7px 10px; border-radius: 7px; cursor: pointer; font-size: 13px; white-space: nowrap; }
.period-flyout-item:hover { background: #f2f6ff; }
/* 季度折叠分组（2026-10-09）：季度行点击展开，月份/整季缩进为子项 */
.period-qtr > .q-head::after { content: "▸"; float: right; color: var(--muted); margin-left: 10px; }
.period-qtr.open > .q-head::after { content: "▾"; }
.period-qtr.open > .q-head { background: #f2f6ff; }
.period-qtr > .q-body { display: none; }
.period-qtr.open > .q-body { display: block; }
.period-qtr > .q-body .period-item { padding-left: 24px; }
.period-qtr > .q-body .period-item.q-all { color: var(--muted); font-size: 12px; }

/* ---------- 业绩明细：冻结标题 + 筛选栏 + 表头 ----------
   结构：.view > .perf-header(sticky top:0) + #pf-table > table.perf-table
   与联系人页保持一致，避免嵌套 .card 导致 tbody 行穿透 sticky header */
.perf-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--panel);
  padding: 18px 24px 12px;
  border-bottom: 1px solid transparent;
  isolation: isolate;            /* 独立 stacking context，避免 tbody 行溢出覆盖 */
}
.perf-header h3 { margin: 0 0 10px; font-size: 15px; }
#pf-table { padding: 0 24px 22px; }
.perf-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  background: var(--panel);
  border-radius: 12px;
  box-shadow: var(--shadow);
  overflow: visible !important;
}
.perf-table thead th {
  background: #f7f9fc;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: var(--perf-header-h, 0px);
  z-index: 90;
  box-shadow: none;
  isolation: isolate;
}
.perf-table tbody tr:hover > td { background: #fafbfd; }
.perf-table th, .perf-table td, .pd-table th, .pd-table td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pd-table { width: 100%; border-collapse: collapse; border-spacing: 0; background: var(--panel); border-radius: 12px; box-shadow: var(--shadow); overflow: visible !important; }
.pd-table th[data-col-key] { position: relative; }

.perf-totals { display: flex; gap: 16px; margin-bottom: 12px; font-size: 13px; }
.perf-totals b { font-size: 15px; }
.tag.signed { background: #eaf2ff; color: var(--primary); }
.tag.consumed { background: #fff2e8; color: var(--amber); }

/* ---------- 业绩明细 ---------- */
.amt { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.amt.signed { color: var(--primary); font-weight: 600; }
.amt.consumed { color: var(--amber); font-weight: 600; }
.bill-btn { border: 1px solid var(--line); border-radius: 8px; padding: 5px 12px; font-size: 13px; cursor: pointer; transition: all .15s; }
.bill-btn.yes { background: #e8f7ee; color: var(--green); border-color: #b7e3c8; }
.bill-btn.no { background: #fff; color: var(--muted); }
.bill-btn:hover { filter: brightness(.97); }
.inp.sm { padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }

/* ---------- 头像 / 单元格 ---------- */
.avatar { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; font-weight: 600; flex-shrink: 0; }
.avatar.sm { width: 26px; height: 26px; font-size: 11px; }
.cell-name { display: flex; align-items: center; gap: 10px; }
.ksid-cell .copy-ksid { cursor: copy; border-bottom: 1px dashed transparent; transition: color .15s, border-color .15s; }
.ksid-cell .copy-ksid:hover { color: var(--blue, #2f6bff); border-bottom-color: currentColor; }
.ksid-cell .copy-ksid:active { opacity: .6; }
.cell-owner { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.cell-owner .owner-name { font-size: 13px; color: var(--text); }
.muted { color: var(--muted); }
/* 搜索结果下拉：用 fixed 定位（JS 在显示时挪到 body 末 + 按 anchor input 计算位置），
   彻底避开任何祖先 overflow 的裁切；z-index 必须高于 .modal-mask(300)，
   否则 portal 后下拉会被弹窗半透明遮罩盖住、看起来"搜索失效"。*/
.search-results { position: fixed; z-index: 400; max-height: 220px; overflow-y: auto; background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 8px 24px rgba(15, 23, 42, .14); }
.pde-search-field { position: relative; }
.fu-search-field { position: relative; }
.fu-selected { margin: -6px 0 12px; padding: 8px 12px; background: #eef6ee; border: 1px solid #cfe8d2; border-radius: 8px; font-size: 13px; color: #1f7a3d; }
.search-results .sr-item { padding: 8px 12px; cursor: pointer; border-bottom: 1px solid var(--line); }
.search-results .sr-item:last-child { border-bottom: none; }
.search-results .sr-item:hover { background: var(--row-hover, #f3f6fc); }
.search-results .sr-empty { padding: 10px 12px; font-size: 13px; color: var(--muted); }

/* ---------- 统计卡片升级 ---------- */
.stat-top { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.stat-ico { width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 16px; flex-shrink: 0; }
.ico-blue { background: #eaf2ff; color: #2f6bff; }
.ico-green { background: #eef6ee; color: #1f9d55; }
.ico-amber { background: #fff2e8; color: #b76a14; }
.ico-red { background: #fdecea; color: #e0392b; }
.stat .n { font-size: 28px; }
.stat-sub { color: var(--muted); font-size: 12px; margin-top: 6px; }

/* ---------- 顶栏搜索 + 用户 ---------- */
.topbar-right { display: flex; align-items: center; gap: 14px; }
.topbar-search { padding: 8px 14px; border: 1px solid var(--line); border-radius: 20px; font-size: 13px; width: 240px; background: #f7f9fc; transition: .15s; }
.topbar-search:focus { outline: none; border-color: var(--primary); background: #fff; }
.topbar-user { display: flex; align-items: center; gap: 8px; }
.topbar-user .uname { font-size: 13px; color: var(--muted); }

/* ---------- 侧边栏用户区 ---------- */
.me-id { display: flex; align-items: center; gap: 8px; }

/* ---------- 登录页品牌化 ---------- */
.login-wrap { height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #2f6bff, #5b8cff); padding: 20px; }
.login-split { display: flex; width: 780px; max-width: 94vw; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); min-height: 430px; }
.login-brand { width: 46%; background: linear-gradient(160deg, #1f3a8a, #2f6bff); color: #fff; padding: 38px 30px; display: flex; flex-direction: column; }
.login-brand .brand-logo { font-size: 22px; font-weight: 800; letter-spacing: 3px; }
.login-brand h1 { font-size: 24px; margin: 18px 0 8px; }
.brand-sub { color: rgba(255, 255, 255, .82); font-size: 13px; line-height: 1.6; }
.brand-points { list-style: none; padding: 0; margin: auto 0 0; display: flex; flex-direction: column; gap: 12px; font-size: 13.5px; }
.brand-points li { display: flex; align-items: center; gap: 10px; }
.brand-points .bp-ico { width: 28px; height: 28px; border-radius: 8px; background: rgba(255, 255, 255, .16); display: flex; align-items: center; justify-content: center; font-size: 14px; }
.login-card { flex: 1; width: auto; padding: 40px 34px; display: flex; flex-direction: column; justify-content: center; }
.login-card h2 { margin: 0 0 22px; font-size: 20px; color: var(--ink); }
.login-card input { width: 100%; padding: 11px 12px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; }
.login-card .hint { margin: 10px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
@media (max-width: 680px) {
  .login-split { flex-direction: column; }
  .login-brand { width: auto; }
  .topbar-search { width: 150px; }
}

/* ==========================================================
   2026-10-11 视觉层次重构
   作用域原则：新增 token 与 .nav-* / .seg / .chip / .ct-* 类名；
   不改动既有变量取值，未重构的页面保持原样、零退化。
   ========================================================== */
:root {
  /* 间距节奏 */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  /* 字号阶梯 */
  --fs-xs: 11px; --fs-sm: 12px; --fs-md: 13px; --fs-lg: 14px; --fs-xl: 16px;
  /* 圆角 */
  --r-sm: 6px; --r-md: 8px; --r-lg: 10px; --r-xl: 12px;
  /* 三层表面：页面底 → 内容卡 → 卡内次级 → 控件槽 */
  --surf-0: #f5f7fa; --surf-1: #ffffff; --surf-2: #f7f9fc; --surf-3: #eef1f6;
  /* 边框 */
  --bd-1: #e3e8ef; --bd-2: #eef1f6; --bd-strong: #c4ccd6;
  /* 文字三级 */
  --tx-1: #1f2733; --tx-2: #6b7785; --tx-3: #8a94a3;
  /* 语义色（合并原两套橙为一档警示色） */
  --c-danger: #d93f31; --c-warn: #b26a00; --c-ok: #1f9d55; --c-info: #2f6bff;
  /* 阴影只留给浮层（弹窗/下拉/菜单），卡片改用细边框表达层次 */
  --sh-1: 0 2px 8px rgba(20,30,50,.10);
  --sh-2: 0 8px 24px rgba(20,30,50,.16);
}

/* ---------- 侧边导航：分区 + 选中态重做 ---------- */
.sidebar { width: 196px; padding: 16px 10px; }
.sidebar .logo { padding: 4px 10px 16px; }
.sidebar nav { gap: 14px; }
.nav-group { display: flex; flex-direction: column; gap: 2px; }
.nav-label { font-size: var(--fs-xs); color: #6b7c99; padding: 0 10px 6px; letter-spacing: .5px; }
.sidebar nav a {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 10px; border-radius: var(--r-md);
  font-size: var(--fs-md); border-left: none;
}
.sidebar nav a:hover { background: #1b2a47; color: #fff; }
.sidebar nav a.active { background: var(--primary); color: #fff; font-weight: 500; }
.sidebar nav a .nav-ico { width: 16px; height: 16px; flex-shrink: 0; opacity: .8; }
.sidebar nav a.active .nav-ico { opacity: 1; }
.sidebar .me { padding-top: var(--sp-3); font-size: var(--fs-md); }

/* ---------- 通用分段控件 ---------- */
.seg { display: inline-flex; background: var(--surf-3); border-radius: var(--r-md); padding: 2px; gap: 2px; }
.seg-i { border: none; background: transparent; color: var(--tx-2); padding: 5px 14px; border-radius: var(--r-sm); font-size: var(--fs-md); transition: .15s; white-space: nowrap; }
.seg-i:hover { color: var(--tx-1); }
.seg-i.active { background: var(--surf-1); color: var(--tx-1); font-weight: 500; box-shadow: 0 1px 2px rgba(20,30,50,.08); }

/* ---------- 次级胶囊（次要筛选） ---------- */
.chip {
  border: 1px solid var(--bd-1); background: var(--surf-1); color: var(--tx-2);
  padding: 3px 10px; border-radius: var(--r-sm); font-size: var(--fs-sm);
  cursor: pointer; transition: .15s; white-space: nowrap;
}
.chip:hover { border-color: var(--bd-strong); color: var(--tx-1); }
.chip.active { background: var(--c-info); border-color: var(--c-info); color: #fff; }
.chip.active:hover { color: #fff; }
.chip-n { font-weight: 500; color: var(--tx-1); margin-left: 3px; }
.chip.active .chip-n { color: rgba(255,255,255,.92); }
.chip.warn.active { background: var(--c-warn); border-color: var(--c-warn); }
/* 双按钮小胶囊：白色底浮在大胶囊托盘上，数量恒定标红 */
.chip-seg {
  display: inline-flex; align-items: center;
  background: var(--surf-1); border: 1px solid var(--bd-1);
  border-radius: 999px; padding: 2px;
  box-shadow: 0 1px 2px rgba(20, 30, 50, .06);
}
.chip-seg .chip { border: none; background: transparent; border-radius: 999px; padding: 4px 14px; font-size: var(--fs-lg); }
.chip-seg .chip:hover { background: transparent; color: var(--tx-1); border: none; }
.chip-seg .chip.active {
  background: #eaf2ff; color: var(--c-info); font-weight: 500; box-shadow: none;
}
.chip-seg .chip.active:hover { color: var(--c-info); }
.chip-seg .chip-n { color: var(--c-danger); font-weight: 600; margin-left: 4px; }
.chip-seg .chip.active .chip-n { color: var(--c-danger); }

/* ---------- 联系人页工具栏：主次两行 ---------- */
.ct-toolbar { padding: 12px var(--sp-5) 10px; display: block; }
.ct-bar-main { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
/* 次级筛选整条装进「大胶囊托盘」：深一档灰底 + 细边框，内部小胶囊白底浮起 */
.ct-bar-sub {
  display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap;
  width: fit-content; margin-top: 10px;
  padding: 5px 10px 5px 16px;
  background: var(--surf-3); border: 1px solid var(--bd-1); border-radius: 999px;
}
.ct-sub-label { font-size: var(--fs-xs); color: var(--tx-3); margin-right: 2px; }
.ct-div { width: 1px; height: 18px; background: var(--bd-strong); flex-shrink: 0; opacity: .6; }
.ct-spacer { flex: 1; }
.ct-owner, .ct-overdue {
  border: 1px solid var(--bd-1); background: var(--surf-1); color: var(--tx-1);
  padding: 4px 10px; border-radius: var(--r-sm); font-size: var(--fs-sm); cursor: pointer;
}
.ct-bar-sub .ct-overdue { border-radius: 999px; padding: 4px 14px; font-size: var(--fs-lg); }
.ct-owner { padding: 5px 10px; }
.ct-owner:focus, .ct-overdue:focus { outline: none; border-color: var(--c-info); }
.ct-overdue.sel { border-color: var(--c-warn); color: var(--c-warn); font-weight: 500; }
.ct-search {
  padding: 6px 12px; border: 1px solid var(--bd-1); border-radius: var(--r-md);
  font-size: var(--fs-md); min-width: 210px; outline: none; background: var(--surf-1);
}
.ct-search:focus { border-color: var(--c-info); }
/* 搜索框装进次级「胶囊托盘」最左侧：与逾期下拉同款胶囊造型（2026-10-12 用户指定） */
.ct-bar-sub .ct-search {
  border-radius: 999px; padding: 4px 14px; font-size: var(--fs-lg);
  min-width: 230px; background: var(--surf-1);
}

/* ---------- 联系人表：去掉卡片式阴影，改用细边框表达层次 ---------- */
#kt-table .dt { box-shadow: none; border: 1px solid var(--bd-1); margin-bottom: var(--sp-5); }
#kt-table .dt thead th { background: var(--surf-2); border-bottom: 1px solid var(--bd-1); }
#kt-table .dt tbody tr:hover > td { background: var(--surf-2); }

/* 所属客户单元格：唯一可点开客户详情的入口 */
.cust-open { color: var(--c-info); cursor: pointer; }
.cust-open:hover { text-decoration: underline; }

/* ---------- 操作列：主操作 + ⋯ 菜单 ---------- */
td.ct-ops { white-space: nowrap; overflow: visible; }
.ct-ops-in { display: inline-flex; align-items: center; gap: 6px; }
.ct-act {
  border: 1px solid transparent; background: transparent; color: var(--c-info);
  padding: 4px 10px; border-radius: var(--r-sm); font-size: var(--fs-sm);
  cursor: pointer; white-space: nowrap;
}
.ct-act:hover { background: #eaf2ff; }
.ct-act.primary { background: var(--c-info); color: #fff; }
.ct-act.primary:hover { background: #1f4fd6; }
.ct-act.danger { color: var(--c-danger); }
.ct-act.danger:hover { background: #fdecea; }
.ct-menu-btn {
  border: 1px solid var(--bd-1); background: var(--surf-1); color: var(--tx-2);
  width: 24px; height: 24px; padding: 0; border-radius: var(--r-sm);
  font-size: 13px; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.ct-menu-btn:hover { border-color: var(--bd-strong); color: var(--tx-1); }
/* 菜单 portal 到 body：避免被表格 overflow 裁切 */
.ct-menu {
  position: fixed; z-index: 350; min-width: 136px; padding: 4px;
  background: var(--surf-1); border: 1px solid var(--bd-1);
  border-radius: var(--r-md); box-shadow: var(--sh-2);
}
.ct-menu-i {
  display: block; width: 100%; text-align: left; border: none; background: transparent;
  color: var(--tx-1); padding: 7px 10px; border-radius: var(--r-sm);
  font-size: var(--fs-md); cursor: pointer; white-space: nowrap;
}
.ct-menu-i:hover { background: var(--surf-2); }
.ct-menu-i.danger { color: var(--c-danger); }
.ct-menu-i.danger:hover { background: #fdecea; }
.ct-menu-sep { height: 1px; background: var(--bd-2); margin: 4px 2px; }

/* ---------- 联系人页：勾选后底部浮出批量操作条（替代顶栏批量按钮） ---------- */
#contact-sel-bar {
  position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%);
  z-index: 320; display: flex; align-items: center; gap: 10px;
  padding: 10px 16px;
  background: var(--surf-1); border: 1px solid var(--bd-1);
  border-radius: var(--r-lg, 12px); box-shadow: var(--sh-2);
}
#contact-sel-bar .csb-n { font-size: var(--fs-md); font-weight: 600; color: var(--tx-1); white-space: nowrap; }
#contact-sel-bar .btn.ghost { color: var(--tx-2); }


/* ---------- 用户与字段页（2026-10-11 层次重构） ---------- */
.u-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: var(--sp-4); align-items: start; }
@media (max-width: 1100px) { .u-grid { grid-template-columns: 1fr; } }
.u-card { background: var(--surf-1); border: 1px solid var(--bd-1); border-radius: var(--r-lg); padding: var(--sp-4); }
.u-card + .u-card { margin-top: var(--sp-4); }
.u-head { display: flex; align-items: center; gap: 8px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--bd-2); }
.u-head h3 { margin: 0; font-size: var(--fs-lg); color: var(--tx-1); }
.u-count { font-size: var(--fs-xs); color: var(--tx-3); background: var(--surf-3); border-radius: 999px; padding: 1px 8px; white-space: nowrap; }
.u-hint { margin-left: auto; font-size: var(--fs-xs); color: var(--tx-3); }
.u-card table { box-shadow: none; border: 1px solid var(--bd-1); border-radius: var(--r-md); overflow: hidden; }
.u-card th { background: var(--surf-2); font-size: var(--fs-xs); color: var(--tx-3); font-weight: 500; padding: 7px 10px; border-bottom: 1px solid var(--bd-1); }
.u-card td { padding: 8px 10px; border-bottom: 1px solid var(--bd-2); font-size: var(--fs-md); }
.u-card tr:last-child td { border-bottom: none; }
.u-card tr:hover td { background: var(--surf-0); }
.u-uname { font-weight: 500; color: var(--tx-1); }
.u-opts { color: var(--tx-2); font-size: var(--fs-sm); }
.u-note { margin-top: 10px; font-size: var(--fs-xs); color: var(--tx-3); background: var(--surf-0); border: 1px dashed var(--bd-1); border-radius: var(--r-md); padding: 8px 12px; }

/* ---------- 佣金试算：团队小计 / 公司汇总行 ---------- */
.comm-subtotal td { background: var(--surf-0); border-top: 1px solid var(--bd-1); }
.comm-total td { background: var(--surf-2); border-top: 2px solid var(--bd-1); }

/* ---------- 用户与字段页：双 Tab 结构（参照 GeoCRM 员工管理，2026-10-11） ---------- */
.acct-tabs { display: inline-flex; }
.acct-tab { padding: 7px 22px; border: 1px solid var(--bd-1); background: var(--surf-1); color: var(--tx-2); font-size: var(--fs-md); cursor: pointer; }
.acct-tab:first-child { border-radius: var(--r-md) 0 0 var(--r-md); }
.acct-tab:last-child { border-radius: 0 var(--r-md) var(--r-md) 0; border-left: none; }
.acct-tab:hover { color: var(--tx-1); }
.acct-tab.active { color: var(--c-info); border-color: var(--c-info); background: #eaf2ff; font-weight: 500; }
.acct-toolbar { display: flex; align-items: center; gap: 10px; margin: 14px 0 10px; flex-wrap: wrap; }

/* ---------- 角色权限 Tab（2026-10-12，参照 GeoCRM 角色权限矩阵） ---------- */
.role-wrap { display: flex; gap: 16px; margin-top: 14px; align-items: flex-start; }
.role-side { width: 180px; flex: none; }
.role-item { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--bd-1); border-radius: var(--r-md); margin-bottom: 6px; cursor: pointer; font-size: var(--fs-md); color: var(--tx-2); }
.role-item:hover { color: var(--tx-1); background: var(--surf-1); }
.role-item.active { color: var(--c-info); border-color: var(--c-info); background: #eaf2ff; }
.role-item .role-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.role-main { flex: 1; min-width: 0; }
.role-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.role-title { font-size: var(--fs-lg); font-weight: 600; color: var(--tx-1); }
.perm-tbl td, .perm-tbl th { text-align: left; }
.perm-tbl input[type="checkbox"] { width: 16px; height: 16px; cursor: pointer; }
.perm-tbl input[type="checkbox"][disabled] { cursor: not-allowed; opacity: .75; }
.role-scope { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 10px 12px; background: var(--surf-1); border: 1px solid var(--bd-1); border-radius: var(--r-md); flex-wrap: wrap; font-size: var(--fs-sm); color: var(--tx-2); }

/* ---------- 佣金试算表（2026-10-12 整齐化）：数字列与表头右对齐、行内顶部对齐 ---------- */
/* 2026-10-12 二次调整：单元格垂直居中、表格按内容收缩列宽、收紧内边距减少留白 */
.comm-tbl { width: auto; min-width: min(880px, 100%); }
.comm-tbl th, .comm-tbl td { vertical-align: middle; padding: 10px 16px; }
.comm-tbl td { line-height: 1.6; }
.comm-tbl .amt-cell { white-space: nowrap; }
/* 产品明细三大类：名称/金额/竖线定宽，跨行纵向对齐 */
.comm-tbl .bk { display: inline-block; white-space: nowrap; }
.comm-tbl .bk-name { display: inline-block; width: 36px; }
.comm-tbl .bk-amt { display: inline-block; width: 78px; font-variant-numeric: tabular-nums; }
.comm-tbl .bk-sep { display: inline-block; width: 1px; height: 12px; background: var(--bd-strong); margin: 0 10px; vertical-align: middle; }
/* 计提明细/距下一档：金额、提点、结果定宽对齐（2026-10-13） */
.comm-tbl .bd-amt, .comm-tbl .bd-rate, .comm-tbl .bd-fee, .comm-tbl .nt-amt { display: inline-block; font-variant-numeric: tabular-nums; white-space: nowrap; }
.comm-tbl .bd-amt { width: 88px; text-align: left; }
.comm-tbl .bd-rate { width: 44px; text-align: right; }
.comm-tbl .bd-x { display: inline-block; width: 12px; text-align: center; }
.comm-tbl .bd-fee { width: 88px; text-align: left; }
.comm-tbl .nt-amt { width: 88px; text-align: left; }

/* ---------- 公司 logo（2026-10-15 替换 CRM 文字）---------- */
.sidebar .logo { display: flex; align-items: center; gap: 8px; }
.sidebar .logo img { width: 28px; height: 28px; border-radius: 6px; flex: none; }
.sidebar .logo .logo-name { font-size: 15px; font-weight: 700; color: #fff; letter-spacing: 1px; }
.login-brand .brand-logo img { max-width: 230px; width: 70%; height: auto; display: block; }