/* ============ 美毅文具 · 人事行政办公系统 ============ */
:root {
  --bg: #f3f5f9;
  --card: #ffffff;
  --line: #eceef3;
  --line2: #e2e5eb;
  --text: #1d2129;
  --text2: #4e5969;
  --text3: #86909c;
  --primary: #3d6df5;
  --primary-deep: #2f55d4;
  --primary-bg: #eef3ff;
  --green: #00b578;
  --green-bg: #e6f9f2;
  --orange: #ff7d00;
  --orange-bg: #fff3e8;
  --red: #f53f3f;
  --red-bg: #ffece8;
  --purple: #722ed1;
  --purple-bg: #f5e8ff;
  --blue: #165dff;
  --blue-bg: #e8f3ff;
  --gold: #d4b106;
  --radius: 12px;
  --shadow: 0 1px 2px rgba(29, 33, 41, .04), 0 4px 16px rgba(29, 33, 41, .06);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  /* 表面色（主题感知） */
  --th-bg: #f7f8fa;
  --th-hover: #eef3ff;
  --row-hover: #f7f9ff;
  --input-bg: #ffffff;
  --chip-bg: #f7f8fa;
  --subtle-bg: #f7f8fa;
  --subtle-bg2: #f2f3f5;
  --dash: #c9cdd4;
  --sheen: rgba(255, 255, 255, .55);
  --mask: rgba(15, 23, 42, .45);
  --mask2: rgba(15, 23, 42, .35);
  /* 侧边栏 */
  --sidebar-w: 224px;
  --sidebar-w-min: 64px;
}

[data-theme="dark"] {
  --bg: #0f1420;
  --card: #171e2e;
  --line: #252e42;
  --line2: #2c364e;
  --text: #e8ecf4;
  --text2: #aab3c5;
  --text3: #7b8699;
  --primary: #6b93ff;
  --primary-deep: #4a78f0;
  --primary-bg: #1d2a4a;
  --green: #2fc99b;
  --green-bg: #122e28;
  --orange: #ffa13d;
  --orange-bg: #33240f;
  --red: #ff6b6b;
  --red-bg: #3d1c1c;
  --purple: #a571e8;
  --purple-bg: #2b1e42;
  --blue: #5aa2ff;
  --blue-bg: #14263f;
  --gold: #e3c95c;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 16px rgba(0, 0, 0, .35);
  --th-bg: #1c2434;
  --th-hover: #223050;
  --row-hover: #1d2637;
  --input-bg: #101828;
  --chip-bg: #1c2434;
  --subtle-bg: #1a2232;
  --subtle-bg2: #1f2839;
  --dash: #3a465c;
  --sheen: rgba(255, 255, 255, .10);
  --mask: rgba(2, 6, 16, .62);
  --mask2: rgba(2, 6, 16, .5);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  font-size: 13px;
  -webkit-font-smoothing: antialiased;
  transition: background .25s ease, color .25s ease;
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--dash); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--text3); }
::-webkit-scrollbar-track { background: transparent; }
button { font-family: var(--font); cursor: pointer; border: none; background: none; color: inherit; }
input, select, textarea { font-family: var(--font); font-size: 13px; color: var(--text); }
a { color: inherit; text-decoration: none; }

#app { display: flex; height: 100vh; overflow: hidden; }

/* ---------- 侧边栏 ---------- */
.sidebar {
  width: var(--sidebar-w); flex: none; background: var(--card);
  border-right: 1px solid var(--line); position: relative;
  display: flex; flex-direction: column; z-index: 30;
  transition: width .22s cubic-bezier(.2, .8, .3, 1);
}
.logo {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 16px 14px; border-bottom: 1px solid var(--line);
  min-height: 64px; overflow: hidden;
}
.logo-badge {
  width: 34px; height: 34px; border-radius: 9px; flex: none;
  background: linear-gradient(135deg, #3d6df5, #7a5af8);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700;
}
.logo-text { min-width: 0; overflow: hidden; }
.logo-text b { display: block; font-size: 14px; letter-spacing: .2px; white-space: nowrap; }
.logo-text span { font-size: 11px; color: var(--text3); white-space: nowrap; }
.logo-act { margin-left: auto; display: flex; flex-direction: column; gap: 4px; flex: none; }
.theme-btn {
  width: 24px; height: 24px; border-radius: 7px; flex: none;
  border: 1px solid var(--line2); background: var(--subtle-bg);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; line-height: 1; transition: all .18s;
}
.theme-btn:hover { border-color: var(--primary); background: var(--primary-bg); transform: rotate(20deg); }
/* 折叠 / 展开把手：贴在侧栏右边缘的圆形按钮（第 155 轮） */
.sb-toggle {
  position: absolute; top: 21px; right: -12px; z-index: 40;
  width: 24px; height: 24px; border-radius: 50%; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--card); color: var(--text3);
  border: 1px solid var(--line2);
  box-shadow: 0 1px 2px rgba(29, 33, 41, .06), 0 4px 10px rgba(29, 33, 41, .1);
  transition: color .18s, background .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.sb-toggle svg { display: block; transition: transform .3s cubic-bezier(.4, .2, .2, 1); }
.sb-toggle:hover {
  color: var(--primary); border-color: var(--primary); background: var(--primary-bg);
  transform: scale(1.12); box-shadow: 0 2px 8px rgba(61, 109, 245, .32);
}
.sb-toggle:active { transform: scale(.96); }
.sb-toggle:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.sidebar.mini .sb-toggle svg { transform: rotate(180deg); }
/* 折叠态悬停提示（自绘，替代原生 title） */
.nav-tip {
  position: fixed; z-index: 9999; pointer-events: none; white-space: nowrap;
  background: rgba(29, 33, 41, .93); color: #fff; font-size: 12px; line-height: 1;
  padding: 7px 11px; border-radius: 8px;
  box-shadow: 0 6px 20px rgba(15, 23, 42, .24);
  opacity: 0; transform: translateY(-50%) scale(.94); transform-origin: left center;
  transition: opacity .13s ease, transform .13s ease;
}
.nav-tip.on { opacity: 1; transform: translateY(-50%) scale(1); }
.nav-tip::before {
  content: ""; position: absolute; left: -3px; top: 50%; margin-top: -3px;
  width: 6px; height: 6px; background: inherit; border-radius: 1px; transform: rotate(45deg);
}
[data-theme="dark"] .nav-tip { background: #2c364e; color: #eef2fa; }
.nav { flex: 1; overflow-y: auto; padding: 8px 10px 16px; overflow-x: hidden; }
.nav-group {
  font-size: 12px; color: var(--text3); padding: 12px 8px 6px;
  letter-spacing: 1px; user-select: none; white-space: nowrap;
  display: flex; align-items: center; gap: 7px;
}
/* 分组标题前加分隔细线，视觉上更规整（首个分组由 JS 加 nav-first 免线） */
.nav-group::before {
  content: ""; flex: none; width: 10px; height: 1px;
  background: linear-gradient(90deg, var(--line2), transparent);
}
.nav-group::after {
  content: ""; flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line));
}
.nav-item {
  display: flex; align-items: center; gap: 10px;
  height: 36px; padding: 0 11px; border-radius: 8px;
  color: var(--text2); font-size: 13.5px; margin-bottom: 2px;
  cursor: pointer; transition: all .15s; position: relative; user-select: none;
  overflow: hidden; white-space: nowrap;
}
.nav-item .ico { width: 18px; text-align: center; font-size: 15px; flex: none; }
.nav-item:hover { background: var(--subtle-bg); color: var(--text); }
.nav-item.active { background: var(--primary-bg); color: var(--primary); font-weight: 600; }
.nav-item.active::before {
  content: ""; position: absolute; left: 0; top: 8px; bottom: 8px;
  width: 3px; border-radius: 0 3px 3px 0; background: var(--primary);
}
.nav-group.nav-first::before { display: none; }
/* 玻璃流光：hover 时一道柔光缓缓扫过（放慢节奏 + 加宽光带，更柔顺自然） */
.nav-item::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(105deg, transparent 24%, var(--sheen) 50%, transparent 76%);
  transform: translateX(-135%);
  transition: transform 1.05s cubic-bezier(.25, .8, .35, 1);
}
.nav-item:hover::after { transform: translateX(135%); }
.nav-item .badge {
  margin-left: auto; background: var(--red); color: #fff;
  font-size: 10px; min-width: 17px; height: 17px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center; padding: 0 5px; font-weight: 600;
}
.sidebar-foot {
  padding: 10px 14px; border-top: 1px solid var(--line);
  font-size: 11px; color: var(--text3); line-height: 1.6;
  white-space: nowrap; overflow: hidden;
}
/* ---------- 菜单编辑模式（改名 / 拖动排序） ---------- */
.nav-editbar {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--primary); font-weight: 600;
  background: var(--primary-bg); border: 1px dashed var(--primary);
  border-radius: 8px; padding: 6px 8px; margin-bottom: 8px; white-space: nowrap;
}
.nav-editbar .btn { margin-left: auto; height: 24px; padding: 0 10px; font-size: 11px; }
.nav-item.nv-dragging { opacity: .45; }
.nav-item.drop-above { box-shadow: inset 0 3px 0 var(--primary); }
.nav-item.drop-below { box-shadow: inset 0 -3px 0 var(--primary); }
.nav-item .nv-grip {
  display: none; margin-left: auto; color: var(--text3);
  font-size: 12px; cursor: grab; letter-spacing: -1px;
}
.nav-item .nv-grip:active { cursor: grabbing; }
.sidebar.nav-editing .nav-item { cursor: grab; }
.sidebar.nav-editing .nav-item:hover { background: var(--th-hover); }
.sidebar.nav-editing .nav-item .nv-grip { display: inline-flex; }
.sidebar.nav-editing .nav-item.active::before { display: none; }
.sidebar.nav-editing .nav-item.active { background: var(--subtle-bg); color: var(--text); font-weight: 500; }
.nav-group.nv-editable { cursor: pointer; border-radius: 6px; }
.nav-group.nv-editable:hover { color: var(--primary); background: var(--subtle-bg); }
.sidebar.nav-editing .nav-group { display: flex; align-items: center; }
/* ---------- 分组收起 / 展开（第 171 轮） ----------
   组头做成 30px 整行点击块（与菜单项同宽同风格），字号加大方便点按 */
.nav-group.nv-foldable, .nav-group.nv-editable {
  cursor: pointer; border-radius: 7px;
  height: 30px; margin: 3px 0 2px; padding: 0 8px;
  transition: color .15s, background .15s;
}
.nav-group.nv-foldable:hover, .nav-group.nv-editable:hover { color: var(--primary); background: var(--subtle-bg); }
.nav-group .nv-gtxt { font-weight: 600; }
.nav-group .nv-arrow {
  flex: none; width: 12px; font-size: 11px; line-height: 1; color: var(--text3);
  transition: color .15s, transform .15s;
}
.nav-group.nv-foldable:hover .nv-arrow { color: var(--primary); }
.nav-group.nv-collapsed .nv-arrow { color: var(--text2); }
/* 收起后组头右侧显示「项数」+（有未处理事项时）红色合计 */
.nav-group .nv-cnt {
  flex: none; display: inline-flex; align-items: center; gap: 4px;
  height: 18px; padding: 0 7px; border-radius: 9px;
  background: var(--subtle-bg); border: 1px solid var(--line);
  font-size: 11px; letter-spacing: 0; color: var(--text2); font-weight: 600;
}
.nav-group .nv-cnt-b {
  font-style: normal; font-weight: 700; color: #fff; background: var(--red);
  min-width: 16px; height: 15px; padding: 0 5px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center; font-size: 10.5px;
}
/* 收起的分组里正好是当前页面 → 组头加亮，防止「不知道自己点在哪」 */
.nav-group.nv-has-active { color: var(--primary); font-weight: 600; }
.nav-group.nv-has-active .nv-gtxt::after { content: ""; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--primary); margin-left: 6px; vertical-align: middle; }
.nav-item.nv-hide { display: none; }
.nv-inp {
  flex: 1; min-width: 0; height: 26px; border: 1px solid var(--primary);
  border-radius: 6px; padding: 0 6px; background: var(--input-bg); outline: none;
  font-size: 12.5px; color: var(--text);
}
/* 折叠（mini）模式：图标化侧栏 */
.sidebar.mini { width: var(--sidebar-w-min); }
.sidebar.mini .logo { padding: 14px 0 12px; justify-content: center; }
.sidebar.mini .logo-text, .sidebar.mini .logo-act { display: none; }
.sidebar.mini .nav { padding: 8px 0 14px; }
.sidebar.mini .nav::-webkit-scrollbar { width: 4px; }
/* 分组标题退化为居中短横线，代替文字占位 */
.sidebar.mini .nav-group { justify-content: center; padding: 12px 0 8px; height: auto; }
.sidebar.mini .nav-group .nv-gtxt { display: none; }
.sidebar.mini .nav-group::before { width: 18px; height: 2px; border-radius: 2px; background: var(--dash); opacity: .8; }
.sidebar.mini .nav-group::after { display: none; }
.sidebar.mini .nav-group.nav-first { padding-top: 4px; }
/* 图标模式下分组不可折叠：箭头与项数徽标一律隐藏（renderNav 也强制展开） */
.sidebar.mini .nav-group .nv-arrow,
.sidebar.mini .nav-group .nv-cnt { display: none; }
.sidebar.mini .nav-group .nv-gtxt::after { display: none; }
/* 图标模式下即使分组处于收起状态，也要把图标项显示出来 */
.sidebar.mini .nav-item.nv-hide { display: flex; }
/* 菜单项：40×40 圆角图标块，水平居中 */
.sidebar.mini .nav-item {
  width: 40px; height: 40px; margin: 3px auto; padding: 0;
  justify-content: center; gap: 0; border-radius: 11px;
}
.sidebar.mini .nav-item .lbl { display: none; }
.sidebar.mini .nav-item .ico { width: auto; font-size: 17px; }
.sidebar.mini .nav-item.active { background: var(--primary-bg); }
.sidebar.mini .nav-item.active::before { left: -12px; top: 50%; bottom: auto; margin-top: -9px; height: 18px; }
/* 角标退化为小红点，避免溢出 */
.sidebar.mini .nav-item .badge {
  position: absolute; top: 2px; right: 2px; margin: 0;
  min-width: 8px; height: 8px; padding: 0; border-radius: 50%;
  font-size: 0; box-shadow: 0 0 0 2px var(--card);
}
.sidebar.mini .sidebar-foot { display: none; }
/* 切换瞬间轻微淡入，让布局变化不生硬 */
@keyframes navFade { from { opacity: .3; } to { opacity: 1; } }
#nav.nav-anim { animation: navFade .26s ease; }
.logo-badge { cursor: pointer; overflow: hidden; transition: transform .18s, box-shadow .18s; }
.logo-badge:hover { transform: translateY(-1px) scale(1.04); box-shadow: 0 4px 12px rgba(61, 109, 245, .35); }
.logo-badge img { width: 100%; height: 100%; object-fit: cover; display: block; }
.logo-badge.has-img { background: var(--subtle-bg); border: 1px solid var(--line2); }

/* ---------- 系统标识（设置页） ---------- */
.logo-set { display: flex; gap: 14px; align-items: flex-start; margin-top: 10px; }
.logo-prev {
  width: 76px; height: 76px; border-radius: 16px; flex: none; overflow: hidden;
  background: linear-gradient(135deg, #3d6df5, #7a5af8); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 30px; font-weight: 700; box-shadow: var(--shadow);
}
.logo-prev img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- 主区域 ---------- */
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar {
  height: 54px; flex: none; background: var(--card);
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 14px; padding: 0 20px; z-index: 20;
}
.page-title { font-size: 15px; font-weight: 700; }
.page-sub { font-size: 12px; color: var(--text3); margin-left: 2px; }
.topbar .spacer { flex: 1; }
/* ---------- 顶部滚动公告（第 173 轮）---------- */
.notice-bar {
  flex: 1; min-width: 0; height: 34px; display: flex; align-items: center; gap: 8px;
  background: var(--subtle-bg); border: 1px solid var(--line); border-radius: 9px;
  padding: 0 8px 0 4px; overflow: hidden;
}
.notice-bar.nb-off { border-style: dashed; opacity: .72; }
.notice-bar .nb-hint { font-size: 12px; color: var(--text3); padding-left: 4px; }
.notice-bar .nb-ico {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 7px; border: none; cursor: pointer;
  background: transparent; font-size: 15px; line-height: 1; padding: 0;
  transition: background .15s; animation: nbPulse 2.4s ease-in-out infinite;
}
.notice-bar .nb-ico:hover { background: var(--line); animation-play-state: paused; }
@keyframes nbPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.14); } }
.notice-bar .nb-clip {
  flex: 1; min-width: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.notice-bar .nb-track {
  display: inline-flex; align-items: center; white-space: nowrap;
  will-change: transform; animation: nbScroll 22s linear infinite;
}
.notice-bar:hover .nb-track { animation-play-state: paused; }
.notice-bar .nb-run { display: inline-flex; align-items: center; }
.notice-bar .nb-item { font-size: 12.5px; font-weight: 600; color: var(--text2); }
.notice-bar .nb-sep {
  font-style: normal; font-size: 9px; color: var(--primary); opacity: .55;
  margin: 0 20px; transform: translateY(-1px);
}
/* 公告条右缘拖宽手柄（第 175 轮）：拖动拉长/缩短，双击恢复默认自适应 */
.notice-bar .nb-grip {
  flex: none; width: 12px; height: 22px; margin: 0 -3px 0 1px; border-radius: 6px;
  cursor: ew-resize; position: relative; touch-action: none;
}
.notice-bar .nb-grip::before {
  content: ''; position: absolute; left: 5px; top: 4px; bottom: 4px; width: 2px;
  border-radius: 1px; background: var(--line2); transition: background .15s, height .15s;
}
.notice-bar .nb-grip:hover::before, body.nb-resizing .notice-bar .nb-grip::before { background: var(--primary); }
body.nb-resizing { cursor: ew-resize !important; user-select: none !important; }
@keyframes nbScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
/* 公告设置弹窗 */
.nb-oline { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 10px; cursor: pointer; user-select: none; }
.nb-oline input { width: 15px; height: 15px; accent-color: var(--primary); }
#nbText {
  width: 100%; min-height: 104px; resize: vertical; outline: none;
  border: 1px solid var(--line2); border-radius: 8px; padding: 8px 10px;
  font: inherit; font-size: 13px; line-height: 1.7;
  background: var(--input-bg); color: var(--text1);
}
#nbText:focus { border-color: var(--primary); }
.nb-tip { font-size: 11.5px; color: var(--text3); margin-top: 8px; }
.nb-dl-line { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 13px; }
.nb-dl-line label { color: var(--text2); cursor: pointer; user-select: none; }
.nb-dl-line select { flex: 1; height: 30px; border: 1px solid var(--line2); border-radius: 7px; background: var(--input-bg); color: var(--text1); padding: 0 8px; outline: none; font: inherit; font-size: 12.5px; }
.searchbox { position: relative; }
.searchbox input {
  width: 250px; height: 34px; border: 1px solid var(--line2); border-radius: 8px;
  padding: 0 12px 0 32px; background: var(--subtle-bg); outline: none; transition: all .15s;
}
.searchbox input:focus { border-color: var(--primary); background: var(--input-bg); width: 300px; }
.searchbox::before {
  content: "🔍"; position: absolute; left: 10px; top: 7px; font-size: 12px; opacity: .5;
}
.view { flex: 1; overflow-y: auto; padding: 18px 20px 40px; }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 32px; padding: 0 14px; border-radius: 7px;
  border: 1px solid var(--line2); background: var(--card); color: var(--text2);
  font-size: 12.5px; transition: all .15s; white-space: nowrap;
}
.btn:hover { border-color: var(--primary); color: var(--primary); }
.btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 500; }
.btn.primary:hover { background: var(--primary-deep); }
.btn.danger { color: var(--red); border-color: var(--red); }
.btn.danger:hover { background: var(--red-bg); border-color: var(--red); }
.btn.sm { height: 26px; padding: 0 9px; font-size: 12px; border-radius: 6px; }
.btn.text { border: none; background: none; padding: 0 6px; color: var(--primary); }
.btn.text:hover { background: var(--primary-bg); }
.btn.text.danger { color: var(--red); }
.btn.text.danger:hover { background: var(--red-bg); }
.btn[disabled] { opacity: .5; cursor: not-allowed; }

/* ---------- 统计卡 / 统计条 交互（与看板 KPI 一致：hover 上浮 + 点击弹员工明细） ---------- */
.hov { transition: transform .2s cubic-bezier(.2, .8, .3, 1), box-shadow .2s ease, border-color .2s ease; }
.hov:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(15, 23, 42, .14); border-color: var(--line2); }
.clk-num { cursor: pointer; }
.clk-num:hover { text-decoration: underline; text-underline-offset: 4px; }
.clk-num:hover .v { color: var(--primary); }

/* ---------- 卡片 / KPI ---------- */
.card {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow);
}
.kpi-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-bottom: 14px; }
.kpi {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 16px 12px; box-shadow: var(--shadow); position: relative; overflow: hidden;
}
.kpi .k-label { font-size: 12px; color: var(--text3); display: flex; align-items: center; gap: 6px; }
.kpi .k-value { font-size: 28px; font-weight: 700; margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.kpi .k-sub { font-size: 11.5px; color: var(--text3); }
.kpi .k-ico {
  position: absolute; right: 10px; top: 12px; width: 34px; height: 34px;
  border-radius: 9px; display: flex; align-items: center; justify-content: center; font-size: 16px;
}
.kpi.blue .k-value { color: var(--primary); } .kpi.blue .k-ico { background: var(--primary-bg); }
.kpi.green .k-value { color: var(--green); } .kpi.green .k-ico { background: var(--green-bg); }
.kpi.orange .k-value { color: var(--orange); } .kpi.orange .k-ico { background: var(--orange-bg); }
.kpi.red .k-value { color: var(--red); } .kpi.red .k-ico { background: var(--red-bg); }
.kpi.purple .k-value { color: var(--purple); } .kpi.purple .k-ico { background: var(--purple-bg); }
.kpi.gold .k-value { color: var(--gold); } .kpi.gold .k-ico { background: var(--orange-bg); }
/* —— KPI 模块鼠标经过轻微上浮；数字可点击查看明细 —— */
.kpi { transition: transform .2s cubic-bezier(.2, .8, .3, 1), box-shadow .2s ease, border-color .2s ease; }
.kpi:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(15, 23, 42, .14); border-color: var(--line2); }
.k-click { cursor: pointer; }
.k-click:hover { text-decoration: underline; text-underline-offset: 4px; }
.sb-num { cursor: pointer; width: fit-content; }
.sb-num:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- 图表网格（12 列可拖拽布局） ---------- */
.chart-grid {
  display: grid; grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 292px; grid-auto-flow: row dense; gap: 14px;
}
.chart-card {
  padding: 16px 18px 12px; display: flex; flex-direction: column;
  position: relative; overflow: hidden;
}
.chart-card .c-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; cursor: grab; user-select: none; }
.chart-card .c-head:active { cursor: grabbing; }
.chart-card .c-title { font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 7px; min-width: 0; }
.chart-card .c-title small { font-weight: 400; color: var(--text3); margin-left: 4px; font-size: 11.5px; }
.c-ico {
  width: 26px; height: 26px; border-radius: 7px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; background: var(--primary-bg);
}
.chart-card .c-body { flex: 1; min-height: 0; }
.chart-card.tall .c-body { min-height: 0; }
.chart-card.dragging { opacity: .35; }
.chart-card.drop-target { outline: 2px dashed var(--primary); outline-offset: -2px; }
/* —— 鼠标经过模块：轻微上浮，感知鼠标进入 / 离开 —— */
.chart-card { transition: transform .2s cubic-bezier(.2, .8, .3, 1), box-shadow .2s ease, border-color .2s ease; }
.chart-card:not(.dragging):hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .16);
  border-color: var(--line2);
}
.chart-card.dragging, body.col-resizing .chart-card:hover { transform: none; }
.rs-handle {
  position: absolute; right: 2px; bottom: 2px; width: 18px; height: 18px;
  cursor: nwse-resize; z-index: 6; opacity: 0; transition: opacity .15s;
  background:
    linear-gradient(135deg, transparent 50%, var(--dash) 50%, var(--dash) 58%, transparent 58%),
    linear-gradient(135deg, transparent 68%, var(--dash) 68%, var(--dash) 76%, transparent 76%);
  border-radius: 0 0 var(--radius) 0;
}
.chart-card:hover .rs-handle { opacity: 1; }
.rs-handle:hover {
  background:
    linear-gradient(135deg, transparent 50%, var(--primary) 50%, var(--primary) 58%, transparent 58%),
    linear-gradient(135deg, transparent 68%, var(--primary) 68%, var(--primary) 76%, transparent 76%);
}

/* ---------- 看板工具栏 / 自定义统计卡片 ---------- */
.c-tools { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.c-tools .ct-hint { font-size: 12px; color: var(--text3); }
.c-tools .btn { margin-left: auto; }
.chart-card .c-act { margin-left: auto; display: flex; gap: 4px; flex: none; }
.c-btn {
  width: 24px; height: 24px; border-radius: 6px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 12px; color: var(--text3); border: 1px solid transparent; background: none;
}
.c-btn:hover { background: var(--subtle-bg2); color: var(--text); }
.c-btn.danger:hover { background: var(--red-bg); color: var(--red); }
/* 带文字的编辑按钮（自定义统计模块） */
.c-btn.wide {
  width: auto; padding: 0 9px; gap: 4px; font-size: 11.5px;
  border-color: var(--line2); color: var(--text2);
}
.c-btn.wide:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); }
.stat-body { display: flex; flex-direction: column; justify-content: center; gap: 7px; }
.stat-num {
  font-size: 32px; font-weight: 700; color: var(--primary); line-height: 1.1;
  cursor: pointer; width: fit-content;
}
.stat-num:hover { text-decoration: underline; text-underline-offset: 5px; }
.stat-sub { font-size: 12px; color: var(--text3); }
.stat-chips {
  font-size: 11.5px; color: var(--text2); background: var(--subtle-bg);
  border-radius: 6px; padding: 5px 9px; line-height: 1.55;
}
/* 内置模块的「已筛选」角标 */
.chart-card .c-title small.c-cond {
  margin-left: 6px; font-size: 10.5px; color: var(--primary);
  background: var(--primary-bg); border-radius: 20px; padding: 1px 7px;
  white-space: nowrap; cursor: help;
}

/* ---------- 统计模块编辑器（条件构建器） ---------- */
.sf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.sf-sec { font-size: 13px; font-weight: 700; margin: 14px 0 8px; padding-left: 9px; border-left: 3px solid var(--primary); }
.cond-list { display: flex; flex-direction: column; gap: 8px; }
.cond-row {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  background: var(--subtle-bg); border: 1px solid var(--line2); border-radius: 8px; padding: 6px 8px;
}
.cond-row select, .cond-row input {
  border: 1px solid var(--line2); border-radius: 5px; height: 24px; padding: 0 4px;
  font-size: 12px; background: var(--input-bg); color: var(--text); outline: none;
}
.cond-row select:focus, .cond-row input:focus { border-color: var(--primary); }
.cond-row .x {
  width: 18px; height: 18px; border-radius: 4px; display: flex; align-items: center;
  justify-content: center; color: var(--text3); cursor: pointer; margin-left: auto; font-size: 13px;
}
.cond-row .x:hover { background: var(--red-bg); color: var(--red); }
.cond-empty { font-size: 12px; color: var(--text3); padding: 10px 12px; border: 1px dashed var(--dash); border-radius: 8px; }

/* ---------- 模块图标选择器 ---------- */
.ico-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(32px, 1fr)); gap: 4px; }
.ico-cell {
  width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center;
  font-size: 15px; cursor: pointer; border: 1px solid transparent; transition: all .12s; user-select: none;
}
.ico-cell:hover { background: var(--subtle-bg2); transform: translateY(-1px); }
.ico-cell.on { background: var(--primary-bg); border-color: var(--primary); }

/* ---------- 卡片内表格视图 ---------- */
.card-table { height: 100%; overflow: auto; }
.card-table table { width: 100%; border-collapse: collapse; font-size: 12px; }
.card-table th {
  position: sticky; top: 0; z-index: 1; background: var(--th-bg); color: var(--text2);
  font-weight: 600; text-align: left; padding: 5px 8px; border-bottom: 1px solid var(--line2);
  font-size: 11.5px; white-space: nowrap;
}
.card-table td {
  padding: 5px 8px; border-bottom: 1px solid var(--line); white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; max-width: 150px;
}
.card-table tbody tr { cursor: pointer; }
.card-table tbody tr:hover td { background: var(--row-hover); }
.card-table td.num, .card-table th.num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---------- 员工明细浮窗表格 ---------- */
.tablewrap.flat { background: none; }
table.dt.auto { table-layout: auto; }
table.dt.auto tbody tr { cursor: pointer; }

/* ---------- 筛选条 ---------- */
.filterbar {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 10px 14px; margin-bottom: 14px; box-shadow: var(--shadow);
}
.filterbar .f-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.filterbar .f-label { font-size: 12px; color: var(--text3); margin-right: 2px; }
.chip {
  display: inline-flex; align-items: center; gap: 6px; height: 28px;
  background: var(--chip-bg); border: 1px solid var(--line2); border-radius: 7px;
  padding: 0 6px 0 10px; font-size: 12.5px; animation: chipIn .18s ease;
}
@keyframes chipIn { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.chip b { font-weight: 600; color: var(--text2); }
.chip select, .chip input {
  border: none; background: var(--input-bg); border: 1px solid var(--line2); border-radius: 5px;
  height: 20px; padding: 0 4px; font-size: 12px; outline: none; max-width: 150px;
}
.chip select:focus, .chip input:focus { border-color: var(--primary); }
.chip .x {
  width: 16px; height: 16px; border-radius: 4px; display: flex; align-items: center;
  justify-content: center; color: var(--text3); font-size: 14px; cursor: pointer;
}
.chip .x:hover { background: var(--red-bg); color: var(--red); }
.addfilter {
  display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 11px;
  border-radius: 7px; border: 1px dashed var(--dash); color: var(--text2); font-size: 12.5px;
  background: var(--card);
}
.addfilter:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); }
.f-tools { display: flex; gap: 8px; margin-left: auto; flex-wrap: wrap; }
.f-summary { font-size: 12px; color: var(--text3); margin-top: 8px; }
.f-summary b { color: var(--primary); font-weight: 600; }

.field-menu {
  position: absolute; z-index: 300; background: var(--card); border: 1px solid var(--line2);  border-radius: 10px; box-shadow: 0 8px 30px rgba(15, 23, 42, .22);
  padding: 6px; max-height: 320px; overflow-y: auto; width: 170px;
}
.field-menu .fm-item {
  padding: 7px 10px; border-radius: 6px; font-size: 12.5px; cursor: pointer;
  display: flex; justify-content: space-between; align-items: center;
}
.field-menu .fm-item:hover { background: var(--primary-bg); color: var(--primary); }
.field-menu .fm-item.used { color: var(--primary); font-weight: 600; }
.field-menu .fm-title { font-size: 11px; color: var(--text3); padding: 4px 10px 2px; }
/* ★172 筛选字段选择菜单：顶部搜索框 + 可滚动的字段列表 + 类型标注 */
.field-menu.fm-filter { display: flex; flex-direction: column; overflow: hidden; width: 196px; padding-bottom: 8px; }
.field-menu.fm-filter .fm-list { overflow-y: auto; }
.field-menu .fm-q {
  margin: 4px 8px 6px; height: 27px; border: 1px solid var(--line2); border-radius: 6px;
  padding: 0 8px; background: var(--input-bg); outline: none; font-size: 12.5px; color: var(--text);
}
.field-menu .fm-q:focus { border-color: var(--primary); }
.field-menu .fm-type { font-style: normal; font-size: 10px; color: var(--text3); flex: none; }
.field-menu .fm-none { font-size: 12px; color: var(--text3); padding: 8px 10px; }
.mv-menu .mv-q {
  margin: 0 8px 6px; height: 26px; border: 1px solid var(--line2); border-radius: 6px;
  padding: 0 8px; background: var(--input-bg); outline: none; font-size: 12.5px; color: var(--text);
}
.mv-menu .mv-q:focus { border-color: var(--primary); }

/* 筛选多选值（第 158 轮）：等于/不等于 可勾选多个选项 */
.mvsel { display: inline-flex; }
.mv-btn {
  display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 6px;
  border: 1px solid var(--line2); border-radius: 5px; background: var(--input-bg);
  font-size: 12px; color: var(--text); cursor: pointer; max-width: 200px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: border-color .15s, color .15s, background .15s;
}
.mv-btn i { font-style: normal; font-size: 9px; opacity: .65; }
.mv-btn:hover, .mv-btn.on { border-color: var(--primary); color: var(--primary); }
.mv-btn.ph { color: var(--text3); }
.mv-menu {
  position: absolute; z-index: 300; width: 176px; padding: 6px;
  background: var(--card); border: 1px solid var(--line2); border-radius: 10px;
  box-shadow: 0 10px 32px rgba(15, 23, 42, .22);
  display: flex; flex-direction: column; animation: chipIn .15s ease;
}
.mv-menu .mv-title { font-size: 11px; color: var(--text3); padding: 3px 9px 6px; }
.mv-menu .mv-list { overflow-y: auto; max-height: 236px; }
.mv-menu .mv-item {
  display: flex; align-items: center; gap: 7px; padding: 5px 8px; border-radius: 6px;
  font-size: 12.5px; color: var(--text); cursor: pointer; white-space: nowrap;
}
.mv-menu .mv-item:hover { background: var(--primary-bg); }
.mv-menu .mv-item input { accent-color: var(--primary); margin: 0; flex: none; }
.mv-menu .mv-none { font-size: 12px; color: var(--text3); padding: 8px 9px; }
.mv-menu .mv-foot {
  display: flex; justify-content: space-between; align-items: center;
  border-top: 1px solid var(--line); margin-top: 4px; padding: 6px 9px 2px; font-size: 12px;
}
.mv-menu .mv-clr { color: var(--text3); cursor: pointer; }
.mv-menu .mv-clr:hover { color: var(--red); }
.mv-menu .mv-done { color: var(--primary); font-weight: 600; cursor: pointer; }

/* 弹窗名单「列设置」面板：勾选显示 + 拖动排序 */
.listcol-panel { max-height: none; overflow: visible; padding: 0; z-index: 210; position: fixed; }
.listcol-panel .lp-head {
  font-size: 11.5px; font-weight: 700; color: var(--text2); padding: 9px 12px 7px;
  display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap;
}
.listcol-panel .lp-tip { font-size: 10.5px; font-weight: 400; color: var(--text3); }
.listcol-panel .lp-head2 { padding-top: 10px; border-top: 1px solid var(--line); color: var(--text3); font-weight: 600; }
.listcol-panel .lp-list { max-height: 258px; overflow-y: auto; padding: 0 6px 4px; }
.listcol-panel .lp-row {
  display: flex; align-items: center; gap: 7px; padding: 5px 6px; border-radius: 7px;
  font-size: 12.5px; cursor: default; border: 1px solid transparent;
}
.listcol-panel .lp-row:hover { background: var(--primary-bg); }
.listcol-panel .lp-row.dragging { opacity: .45; }
.listcol-panel .lp-row.drop-col { border-color: var(--primary); box-shadow: inset 2px 0 0 var(--primary); }
.listcol-panel .lp-handle { cursor: grab; color: var(--dash); font-size: 13px; letter-spacing: -1px; user-select: none; }
.listcol-panel .lp-handle:active { cursor: grabbing; }
.listcol-panel .lp-row input[type=checkbox] { cursor: pointer; }
.listcol-panel .lp-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 岗位顺序面板：人数徽标 */
.listcol-panel .lp-cnt {
  flex: none; font-size: 10.5px; color: var(--text3); background: var(--line, rgba(0,0,0,.06));
  padding: 1px 6px; border-radius: 999px; margin-right: 2px;
}
.listcol-panel .lp-cnt0 { opacity: .55; }
/* 岗位顺序面板：命名配置区（170b 轮） */
.listcol-panel .lp-cfg { border-top: 1px solid var(--line); padding: 6px 0 4px; }
.listcol-panel .lp-cfg-head {
  display: flex; align-items: center; gap: 6px; padding: 2px 12px 4px;
  font-size: 11.5px; color: var(--text3); font-weight: 600;
}
.listcol-panel .lp-cfg-head .lp-tip { font-weight: 400; }
.listcol-panel .lp-cfg-save { display: flex; gap: 5px; padding: 0 12px 6px; }
.listcol-panel .lp-cfg-save .lp-cfgname {
  flex: 1; min-width: 0; font: inherit; font-size: 12px; color: var(--text);
  padding: 4px 8px; border: 1px solid var(--line2); border-radius: 7px; background: var(--bg);
}
.listcol-panel .lp-cfg-save .lp-cfgname:focus { outline: none; border-color: var(--primary); }
.listcol-panel .lp-cfglist { max-height: 96px; overflow-y: auto; padding: 0 6px; }
.listcol-panel .lp-cfgrow { display: flex; align-items: center; gap: 4px; padding: 3px 6px; border-radius: 6px; }
.listcol-panel .lp-cfgrow:hover { background: var(--line, rgba(0,0,0,.05)); }
.listcol-panel .lp-cfgrow .lp-arrow { width: auto; padding: 0 6px; font-size: 11px; }
.listcol-panel .lp-cfgrow .lp-del:hover { background: #e5484d; }
.listcol-panel .lp-arrow {
  color: var(--text3); font-size: 12px; cursor: pointer; width: 18px; height: 18px; border-radius: 5px;
  display: inline-flex; align-items: center; justify-content: center; flex: none;
}
.listcol-panel .lp-arrow:hover { background: var(--primary); color: #fff; }
.listcol-panel .lp-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 12px 8px; max-height: 128px; overflow-y: auto; }
.listcol-panel .lp-chip {
  font-size: 11.5px; padding: 4px 9px; border-radius: 999px; cursor: pointer;
  border: 1px dashed var(--line2); color: var(--text2); transition: all .15s;
}
.listcol-panel .lp-chip:hover { border-style: solid; border-color: var(--primary); color: var(--primary); background: var(--primary-bg); }
.listcol-panel .lp-foot {
  display: flex; gap: 8px; justify-content: space-between; align-items: center;
  padding: 9px 12px; border-top: 1px solid var(--line); background: var(--th-bg, transparent);
}
/* 打印说明面板：多行输入框 */
.rprnote-panel { width: 480px; max-width: calc(100vw - 16px); }
.rprnote-panel .lp-note-ta {
  display: block; width: calc(100% - 24px); margin: 8px auto 0; box-sizing: border-box;
  padding: 10px 12px; font: 13px/1.8 inherit; font-family: inherit; color: var(--text);
  border: 1px solid var(--line2); border-radius: 8px; background: var(--bg);
  resize: vertical; min-height: 170px;
}
.rprnote-panel .lp-note-ta:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-bg); }
.rprnote-panel .lp-cnt-tip { font-size: 11px; color: var(--text2); text-align: right; padding: 3px 14px 0; }
.rprnote-panel .lp-foot { justify-content: flex-start; }
/* 弹窗名单表头可拖动换位 */
table.dt.auto thead th[data-lcol] { cursor: grab; user-select: none; }
/* ★170 长下拉搜索面板（员工表单枚举下拉 ≥8 项时点开） */
.sel-search {
  position: fixed; z-index: 300; background: var(--bg, #fff);
  border: 1px solid var(--line2); border-radius: 10px; overflow: hidden;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .18); max-width: 420px;
}
.sel-search .ss-q {
  display: block; width: 100%; box-sizing: border-box; padding: 8px 12px;
  border: none; outline: none; border-bottom: 1px solid var(--line);
  font: 13px/1.4 inherit; font-family: inherit; color: var(--text);
  background: var(--th-bg, #f6f7f9);
}
.sel-search .ss-list { max-height: 220px; overflow-y: auto; padding: 4px; }
.sel-search .ss-opt {
  padding: 6px 10px; font-size: 13px; color: var(--text);
  border-radius: 6px; cursor: pointer; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.sel-search .ss-opt:hover { background: var(--primary-bg, #eef4ff); }
.sel-search .ss-opt.on { background: var(--primary-bg, #eef4ff); color: var(--primary); font-weight: 600; }
.sel-search .ss-empty { padding: 14px 10px; font-size: 12.5px; color: var(--text2); text-align: center; }
table.dt.auto thead th[data-lcol]:active { cursor: grabbing; }
table.dt.auto thead th[data-lcol].dragging { opacity: .45; }
/* 弹窗名单列宽拖动把手（需覆盖上面的 grab 光标） */
table.dt.auto thead th .th-lbl { padding-right: 7px; }
table.dt.auto thead th .th-resizer { cursor: col-resize; }
table.dt.auto thead th .th-resizer::after { top: 26%; bottom: 26%; right: 2px; }
/* 列设置面板补充说明 */
.listcol-panel .lp-tip2 {
  font-size: 10.5px; color: var(--text3); line-height: 1.5;
  padding: 0 12px 8px; border-bottom: 1px solid var(--line);
}
.listcol-panel .lp-ava { margin: 0 6px 4px; padding: 7px 8px; }
.listcol-panel .lp-ico { font-size: 13px; opacity: .85; }

/* ---------- 员工明细浮窗（可调大小 / 搜索 / 排序） ---------- */
.btn.toggled { color: var(--primary); border-color: var(--primary); background: var(--primary-bg); }
.modal.listmodal { position: relative; max-width: 900px; }
.listmodal .m-head { padding-right: 14px; }
.listmodal .m-hint { flex: 1; margin-left: 12px; font-size: 11.5px; font-weight: 400; color: var(--text3); }
.listmodal .m-tools {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 20px; border-bottom: 1px solid var(--line);
  font-size: 12.5px; color: var(--text2);
}
.listmodal .mt-count b { color: var(--primary); }
.listmodal .mt-dim { color: var(--text3); }
.listmodal .mt-search { position: relative; display: inline-flex; align-items: center; }
.listmodal .mt-search input {
  height: 28px; width: 218px; padding: 0 22px 0 10px; border-radius: 7px;
  border: 1px solid var(--line2); background: var(--input-bg); color: var(--text);
  font-size: 12.5px; outline: none; transition: border-color .15s;
}
.listmodal .mt-search input:focus { border-color: var(--primary); }
.listmodal .mt-clear {
  position: absolute; right: 7px; display: none; cursor: pointer;
  color: var(--text3); font-size: 11px; line-height: 1;
}
.listmodal .mt-search input:not(:placeholder-shown) + .mt-clear { display: block; }
.listmodal .mt-clear:hover { color: var(--red); }
.listmodal thead th.sorted { color: var(--primary); }
.listmodal thead th .arrow { font-size: 9px; margin-left: 3px; }
.listmodal tbody tr.lrow-empty td { padding: 0; }
.listmodal .m-grip { position: absolute; z-index: 8; }
.listmodal .m-grip-r { top: 10px; bottom: 10px; right: -3px; width: 7px; cursor: ew-resize; }
.listmodal .m-grip-b { left: 10px; right: 10px; bottom: -3px; height: 7px; cursor: ns-resize; }
.listmodal .m-grip-br { right: 0; bottom: 0; width: 18px; height: 18px; cursor: nwse-resize; }
.listmodal .m-grip-r::after, .listmodal .m-grip-b::after {
  content: ""; position: absolute; inset: 0; border-radius: 4px; transition: background .15s;
}
.listmodal .m-grip-r:hover::after, .listmodal .m-grip-r.active::after,
.listmodal .m-grip-b:hover::after, .listmodal .m-grip-b.active::after { background: var(--primary-bg); }
.listmodal .m-grip-br::after {
  content: ""; position: absolute; right: 5px; bottom: 5px; width: 7px; height: 7px;
  border-right: 2px solid var(--line2); border-bottom: 2px solid var(--line2);
  border-radius: 0 0 3px 0; transition: border-color .15s;
}
.listmodal .m-grip-br:hover::after, .listmodal .m-grip-br.active::after { border-color: var(--primary); }
body.box-resizing { user-select: none; }
body.box-resizing * { pointer-events: none; }

/* ---------- 员工明细浮窗 · 高级筛选面板（字段 / 匹配方式 / 值，多条件 AND） ---------- */
.flt-panel {
  position: absolute; z-index: 210; width: 460px; max-width: calc(100vw - 24px);
  background: var(--card); border: 1px solid var(--line2); border-radius: 12px;
  box-shadow: 0 16px 48px rgba(15, 23, 42, .18); padding: 12px 14px 10px;
  animation: popIn .16s cubic-bezier(.2, .9, .3, 1.1);
}
.flt-panel .fp-title { display: flex; align-items: center; justify-content: space-between; font-weight: 700; font-size: 13.5px; margin-bottom: 10px; }
.flt-panel .fp-x { cursor: pointer; color: var(--text3); width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 6px; font-size: 13px; }
.flt-panel .fp-x:hover { background: var(--subtle-bg2); color: var(--text); }
.flt-panel .cond-list { max-height: 42vh; overflow: auto; padding-right: 2px; }
.flt-panel .cond-row select { max-width: 132px; }
.flt-panel .fp-foot { margin-top: 10px; font-size: 11.5px; line-height: 1.6; color: var(--text3); }
#elFilter.toggled { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); font-weight: 600; }

/* ---------- 表格 ---------- */
.tablewrap { overflow: auto; border-radius: var(--radius); background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow); }
/* 表格内滚动条略加高，横向拖动条更醒目易抓 */
.tablewrap::-webkit-scrollbar { height: 11px; }
.tablewrap::-webkit-scrollbar-thumb { background: var(--dash); border-radius: 6px; border: 2px solid var(--card); }
.tablewrap::-webkit-scrollbar-thumb:hover { background: var(--primary); }
.tablewrap::-webkit-scrollbar-track { background: transparent; }
table.dt { border-collapse: separate; border-spacing: 0; width: 100%; font-variant-numeric: tabular-nums; table-layout: fixed; }
table.dt thead th {
  position: sticky; top: 0; z-index: 5; background: var(--th-bg); color: var(--text2);
  font-size: 12px; font-weight: 600; text-align: left;
  padding: 9px 10px; border-bottom: 1px solid var(--line2); white-space: nowrap; user-select: none;
  overflow: hidden;
}
table.dt thead th.sortable { cursor: pointer; }
table.dt thead th.sortable:hover { color: var(--primary); background: var(--th-hover); }
table.dt thead th .arrow { font-size: 9px; color: var(--primary); margin-left: 3px; }
table.dt thead th .th-lbl { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
table.dt thead th .th-edit {
  border: 1px solid var(--primary); border-radius: 5px; height: 22px; padding: 0 6px;
  font-size: 12px; width: 130px; outline: none; background: var(--input-bg); color: var(--text);
}
table.dt tbody td {
  padding: 8px 10px; border-bottom: 1px solid var(--line); font-size: 12.5px;
  white-space: nowrap; vertical-align: middle; overflow: hidden; text-overflow: ellipsis;
}
table.dt tbody tr:hover td { background: var(--row-hover); }
table.dt tbody tr.sel td { background: var(--primary-bg); }
table.dt .num { text-align: right; font-variant-numeric: tabular-nums; }
table.dt .ctr { text-align: center; }
table.dt .freeze { position: sticky; background: var(--card); z-index: 4; }
table.dt thead th.freeze { background: var(--th-bg); z-index: 6; }
table.dt tbody tr:hover td.freeze { background: var(--row-hover); }
table.dt .namecell { display: flex; align-items: center; gap: 7px; }
.avatar {
  width: 24px; height: 24px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: 11px; font-weight: 600;
}
.rowact { opacity: 0; transition: opacity .15s; display: flex; gap: 2px; }
tr:hover .rowact { opacity: 1; }
/* 列宽手柄 */
.th-resizer {
  position: absolute; top: 0; right: 0; width: 7px; height: 100%;
  cursor: col-resize; z-index: 7; user-select: none;
}
.th-resizer::after {
  content: ""; position: absolute; top: 20%; bottom: 20%; right: 3px; width: 1px;
  background: var(--line2); transition: background .15s;
}
.th-resizer:hover::after, .th-resizer.active::after { background: var(--primary); width: 2px; }
body.col-resizing { cursor: col-resize; user-select: none; }
body.col-resizing * { pointer-events: none; }
body.col-resizing .th-resizer { pointer-events: auto; }
table.dt thead th.drop-col { box-shadow: inset 2px 0 0 var(--primary), inset -2px 0 0 var(--primary); background: var(--th-hover); }
table.dt thead th.dragging-col { opacity: .4; }

/* 看板提醒条目（主题感知） */
.alrt {
  display: flex; align-items: center; gap: 9px; background: var(--subtle-bg);
  border: 1px solid var(--line2); border-radius: 8px; padding: 7px 10px; cursor: pointer;
  transition: border-color .15s;
}
.alrt:hover { border-color: var(--primary); }
.alrt.o { background: var(--orange-bg); }
.alrt.b { background: var(--primary-bg); }
.alrt.p { background: var(--purple-bg); }
/* 已逾期：红底 + 左侧红条，一眼能看出「要补办」 */
.alrt.od { background: var(--red-bg); border-color: var(--red); box-shadow: inset 3px 0 0 var(--red); }
/* 提醒块内滚动区（列数自适应后统一高度表现） */
.al-scroll { max-height: 214px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; padding-right: 2px; }
.clk-num.dim { cursor: default; }
.clk-num.dim:hover { text-decoration: none; }

/* 到期提醒设置面板 */
table.ac-tb { width: 100%; border-collapse: collapse; font-size: 12.5px; }
table.ac-tb th { text-align: left; font-weight: 600; color: var(--text3); font-size: 11.5px; padding: 4px 8px; border-bottom: 1px solid var(--line2); }
table.ac-tb td { padding: 8px; border-bottom: 1px solid var(--line2); vertical-align: middle; }
table.ac-tb tr:last-child td { border-bottom: none; }
.ac-lb { display: flex; align-items: center; gap: 7px; cursor: pointer; font-size: 12.5px; }
.ac-lb > input[type="checkbox"] { width: auto; height: auto; flex: none; }
.ac-lb small { display: block; color: var(--text3); font-size: 11px; margin-top: 2px; font-weight: 400; }
.ac-lb2 { align-items: flex-start; line-height: 1.6; margin-top: 2px; }
.ac-lb2 > input[type="checkbox"] { margin-top: 4px; }
.ac-num { display: inline-flex; align-items: center; gap: 5px; color: var(--text3); font-size: 12px; }
.ac-num input[type="number"] { width: 68px; }
.ac-pv { margin-top: 14px; padding: 9px 11px; border-radius: 8px; background: var(--subtle-bg); border: 1px solid var(--line2); font-size: 12px; color: var(--text2); }
.ac-pv b { color: var(--primary); }
.ac-row2 { display: flex; gap: 10px 28px; flex-wrap: wrap; margin-top: 4px; }
/* 到期提醒卡片：每块标题下的一行「判断口径」 */
.al-hint { font-size: 11px; color: var(--text3); margin: 0 0 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.tag {
  display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
  border-radius: 4px; font-size: 11.5px; font-weight: 500; white-space: nowrap;
}
.tag.g { background: var(--green-bg); color: var(--green); }
.tag.r { background: var(--red-bg); color: var(--red); }
.tag.b { background: var(--blue-bg); color: var(--blue); }
.tag.o { background: var(--orange-bg); color: var(--orange); }
.tag.p { background: var(--purple-bg); color: var(--purple); }
.tag.gray { background: var(--subtle-bg2); color: var(--text2); }
.tag.gold { background: var(--orange-bg); color: var(--gold); }

.pager {
  position: sticky; bottom: 10px; z-index: 9;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: 12px; padding: 8px 14px;
  font-size: 12.5px; color: var(--text2);
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: var(--shadow);
}
.pager .spacer { flex: 1; }
.pager select, .pager input {
  border: 1px solid var(--line2); border-radius: 6px; height: 28px; padding: 0 6px; background: var(--input-bg); outline: none;
}
.pbtn {
  min-width: 28px; height: 28px; padding: 0 8px; border: 1px solid var(--line2);
  border-radius: 6px; background: var(--card); display: inline-flex; align-items: center; justify-content: center;
}
.pbtn:hover:not([disabled]) { border-color: var(--primary); color: var(--primary); }
.pbtn.cur { background: var(--primary); border-color: var(--primary); color: #fff; }
.pbtn[disabled] { opacity: .45; cursor: not-allowed; }

/* ---------- 花名册悬浮条：横向滚动条浮窗 + 回到顶部 ---------- */
/* 花名册表格固定高度内滚动：表头吸顶；表格+分页整体贴住浏览器底边（底部不留空档） */
#view.roster-view { display: flex; flex-direction: column; padding-bottom: 0; }
#view.roster-view .tablewrap { flex: 1 1 auto; min-height: 200px; border-radius: var(--radius) var(--radius) 0 0; }
#view.roster-view .pager { flex: none; margin-top: -1px; margin-bottom: 0; bottom: 0; border-radius: 0 0 var(--radius) var(--radius); }
.roster-float { position: fixed; inset: 0; pointer-events: none; z-index: 32; }
.roster-float .hscroll {
  position: absolute; bottom: 62px; height: 16px; overflow-x: auto; overflow-y: hidden;
  pointer-events: auto; opacity: 0; visibility: hidden; transition: opacity .18s ease, visibility .18s;
  border-radius: 9px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow);
}
.roster-float .hscroll.on { opacity: 1; visibility: visible; }
.roster-float .hscroll::-webkit-scrollbar { height: 14px; }
.roster-float .hscroll::-webkit-scrollbar-thumb { background: var(--dash); border-radius: 8px; border: 4px solid var(--card); }
.roster-float .hscroll::-webkit-scrollbar-thumb:hover { background: var(--primary); }
.roster-float .hscroll::-webkit-scrollbar-track { background: transparent; }
.roster-float .hscroll .hs-track { height: 1px; }
.roster-float .to-top {
  position: absolute; right: 26px; bottom: 84px; width: 38px; height: 38px; border-radius: 50%;
  pointer-events: auto; opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s, color .15s, border-color .15s;
  background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow);
  color: var(--text2); font-size: 15px; line-height: 1;
}
.roster-float .to-top.on { opacity: 1; visibility: visible; transform: none; }
.roster-float .to-top:hover { color: var(--primary); border-color: var(--primary); }

/* 横向滚动时冻结列的分隔阴影，提示左侧列被固定 */
table.dt.scrolled-x .freeze.frz-l { box-shadow: 6px 0 10px -6px rgba(20, 28, 45, .30); }
table.dt.scrolled-x .freeze.frz-r { box-shadow: -6px 0 10px -6px rgba(20, 28, 45, .30); }
[data-theme="dark"] table.dt.scrolled-x .freeze.frz-l { box-shadow: 6px 0 10px -6px rgba(0, 0, 0, .6); }
[data-theme="dark"] table.dt.scrolled-x .freeze.frz-r { box-shadow: -6px 0 10px -6px rgba(0, 0, 0, .6); }

/* ---------- 空状态 ---------- */
.empty { padding: 60px 0; text-align: center; color: var(--text3); }
.empty .e-ico { font-size: 40px; margin-bottom: 10px; }
.empty .e-txt { font-size: 13px; }

/* ---------- 弹窗 / 抽屉 / Toast ---------- */
.mask {
  position: fixed; inset: 0; background: var(--mask);
  z-index: 100; display: flex; align-items: flex-start; justify-content: center;
  padding: 6vh 16px 16px; overflow-y: auto; animation: fadeIn .15s ease;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.modal {
  background: var(--card); border-radius: 14px; width: 100%; max-width: 480px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, .3); animation: popIn .2s cubic-bezier(.2, .9, .3, 1.2);
  margin-bottom: 40px;
}
@keyframes popIn { from { transform: translateY(14px) scale(.97); opacity: 0; } to { transform: none; opacity: 1; } }
.modal .m-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px 12px; border-bottom: 1px solid var(--line); }
.modal .m-title { font-size: 15px; font-weight: 700; }
.modal .m-close { font-size: 16px; color: var(--text3); width: 28px; height: 28px; border-radius: 6px; }
.modal .m-close:hover { background: var(--subtle-bg2); color: var(--text); }
.modal .m-body { padding: 18px 20px; }
.modal .m-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--line); }
.modal.wide { max-width: 900px; }
/* 所有普通弹窗整体不超出视口：头 / 底固定，内容区自己滚动（名单浮窗 exclbox 自有体系，不在此列） */
.mask .modal:not(.listmodal) {
  max-height: calc(94vh - 60px);
  display: flex; flex-direction: column; overflow: hidden;
}
.mask .modal:not(.listmodal) .m-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.mask .modal:not(.listmodal) .m-foot { flex: none; }

/* 管理员口令校验弹窗（清空 / 覆盖全库前的二次确认） */
.pwdmodal .pwd-warn {
  font-size: 12.5px; line-height: 1.75; color: var(--text2);
  background: var(--red-bg); border: 1px solid var(--red-bg2, var(--red-bg));
  border-radius: 8px; padding: 10px 12px; margin-bottom: 14px;
}
.pwdmodal .pwd-warn b { color: var(--red); }
.pwdmodal .pwd-lab {
  display: block; font-size: 12px; font-weight: 600; color: var(--text2);
  margin: 0 0 5px;
}
.pwdmodal .pwd-in {
  width: 100%; height: 36px; padding: 0 10px; margin-bottom: 12px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--card);
  color: var(--text); font-size: 13px; outline: none;
}
.pwdmodal .pwd-in:focus { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-bg); }
.pwdmodal .pwd-in:disabled { opacity: .6; }
.pwdmodal .pwd-err {
  display: none; font-size: 12px; color: var(--red); line-height: 1.6;
  background: var(--red-bg); border-radius: 6px; padding: 7px 10px; margin: -2px 0 10px;
}
.pwdmodal .pwd-err.on { display: block; }
.pwdmodal .pwd-err.shake { animation: pwdShake .32s; }
@keyframes pwdShake { 0%, 100% { transform: none; } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.pwdmodal .pwd-tip { font-size: 11.5px; color: var(--text3); line-height: 1.6; }

/* 日常记录编辑弹窗：左右两栏一屏显示完 */
.dl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 26px; align-items: start; }
.dl-col { min-width: 0; }
.dl-col-h {
  display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700;
  color: var(--text2); margin: 0 0 12px; letter-spacing: .5px;
}
.dl-col-h::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line), transparent); }
.f-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
@media (max-width: 900px) { .dl-grid { grid-template-columns: 1fr; } }

/* ---------- 可搜索选人列表（发起离职申请等） ---------- */
.emp-pick {
  max-height: 232px; overflow-y: auto; border: 1px solid var(--line2);
  border-radius: 8px; background: var(--input-bg); padding: 4px;
}
.emp-pick .ep-item {
  display: flex; align-items: center; gap: 8px; padding: 7px 9px;
  border-radius: 6px; cursor: pointer; font-size: 12.5px; transition: background .12s;
}
.emp-pick .ep-item:hover { background: var(--subtle-bg); }
.emp-pick .ep-item.on { background: var(--primary-bg); color: var(--primary); }
.emp-pick .ep-item .ep-name { font-weight: 600; }
.emp-pick .ep-item .ep-meta { color: var(--text3); font-size: 11.5px; margin-left: auto; }
.emp-pick .ep-item.on .ep-meta { color: var(--primary); opacity: .75; }
.emp-pick .ep-item.out-pending { opacity: .62; cursor: not-allowed; }
.emp-pick .ep-item.out-pending:hover { background: transparent; }
.emp-pick .ep-item.out-pending .ep-name { text-decoration: line-through; text-decoration-color: var(--red); text-decoration-thickness: 1.5px; }
.emp-pick .ep-empty { padding: 18px 10px; text-align: center; font-size: 12px; color: var(--text3); }
.emp-pick-tip { font-size: 11.5px; color: var(--text3); margin-top: 5px; }

.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 18px; }
.form-grid .span2 { grid-column: span 2; }
.f-sec { grid-column: span 2; font-size: 13px; font-weight: 700; color: var(--text); margin: 14px 0 8px; padding-left: 9px; border-left: 3px solid var(--primary); }
.f-item { margin-bottom: 13px; }
.f-item label { display: block; font-size: 12px; color: var(--text2); margin-bottom: 5px; }
.f-item label .req { color: var(--red); margin-left: 2px; }
.f-item input, .f-item select, .f-item textarea {
  width: 100%; height: 34px; border: 1px solid var(--line2); border-radius: 7px;
  padding: 0 10px; outline: none; transition: border-color .15s; background: var(--input-bg);
}
.f-item textarea { height: auto; padding: 8px 10px; resize: vertical; min-height: 60px; }
.f-item input:focus, .f-item select:focus, .f-item textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(61, 109, 245, .18); }
.f-item input.err, .f-item select.err { border-color: var(--red); }
.f-item .f-tip { font-size: 11px; color: var(--red); margin-top: 3px; display: none; }
.f-item .f-tip.show { display: block; }
.f-item .f-tip.ok { color: var(--green); }
.f-item .f-tip.warn { color: var(--orange); }
/* 自动计算列（工龄 / 年资/月）：只读、灰色底、虚线框，提示由系统算好 */
.f-item .auto-inp {
  background: var(--subtle-bg);
  border-style: dashed;
  color: var(--text2);
  font-weight: 600;
  cursor: default;
}
.f-item .auto-inp:focus { outline: none; box-shadow: none; }

/* ============================ 员工信息登记（一页式紧凑布局） ============================ */
.btn.lg { height: 36px; padding: 0 20px; font-size: 13.5px; font-weight: 600; }
/* 自动计算列的标签小标（出生日期 / 年龄 / 工龄 / 年资 / 月薪 / 合同状态） */
.auto-chip {
  display: inline-block; margin-left: 5px; padding: 0 5px; height: 15px; line-height: 15px;
  font-size: 10px; font-weight: 500; color: var(--text3); background: var(--subtle-bg2);
  border-radius: 4px; vertical-align: 1px; letter-spacing: 0;
}
.fsec-ico { font-size: 12.5px; }
.fsec-n { font-size: 10.5px; font-weight: 500; color: var(--text3); opacity: .85; }
.reg-card { padding: 0; }
/* 顶部吸顶条：标题 + 必填进度 */
.reg-head {
  position: sticky; top: 0; z-index: 6;
  display: flex; align-items: center; gap: 12px;
  padding: 12px 20px 11px; border-bottom: 1px solid var(--line);
  border-radius: var(--radius) var(--radius) 0 0;
  background: linear-gradient(90deg, var(--primary-bg), var(--card) 74%);
}
.reg-ico { font-size: 20px; line-height: 1; }
.reg-ht { flex: 1; min-width: 0; }
.reg-title { font-size: 15.5px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.reg-sub { font-size: 12px; color: var(--text3); margin-top: 2px; }
.reg-sub .req { color: var(--red); font-weight: 700; }
.reg-prog {
  position: relative; flex: none; display: inline-flex; align-items: center; gap: 10px;
  height: 24px; padding: 0 11px; border-radius: 20px; background: var(--subtle-bg2);
  border: 1px solid transparent; overflow: hidden; transition: border-color .2s;
}
.reg-prog::before { content: "必填"; position: relative; font-size: 11px; color: var(--text3); }
.reg-prog > i {
  position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 20px;
  background: var(--primary); opacity: .18; transition: width .35s cubic-bezier(.2, .8, .3, 1);
}
.reg-prog > em { position: relative; font-style: normal; font-size: 11.5px; font-weight: 700; color: var(--text2); font-variant-numeric: tabular-nums; }
.reg-prog.full { border-color: var(--green); }
.reg-prog.full::before { content: "必填已齐"; color: var(--green); }
.reg-prog.full > i { background: var(--green); opacity: .2; }
.reg-body { padding: 10px 14px 8px; }
/* 顶部「字段与分区」按钮（在登记页直接改字段并即时预览） */
.reg-cfg { flex: none; white-space: nowrap; }
/* 关闭字段管理面板后，登记卡闪一下提示「这就是最新效果」 */
.reg-flash { animation: regFlash .95s cubic-bezier(.2, .8, .3, 1); }
@keyframes regFlash {
  0% { box-shadow: 0 0 0 0 rgba(37, 99, 235, .42); }
  100% { box-shadow: 0 0 0 16px rgba(37, 99, 235, 0); }
}

/* 字段管理面板：实时预览提示条 */
.fm-live {
  display: flex; gap: 7px; align-items: flex-start; margin-bottom: 11px; padding: 8px 11px;
  border-radius: 8px; background: var(--primary-bg); border: 1px solid var(--line2);
  font-size: 12px; line-height: 1.6; color: var(--text2);
}
.fm-live b { color: var(--primary); }
.fm-live-t { font-size: 12px; color: var(--green); align-self: center; }

/* ---------- 员工表单弹窗：与「员工信息登记」页一致的左右双列版式 ---------- */
.modal.formmodal {
  width: min(1240px, 95vw); max-width: 95vw;
  max-height: calc(94vh - 56px); padding: 0; overflow: hidden;
  display: flex; flex-direction: column;
}
.formmodal .fm-head {
  gap: 12px; padding: 13px 20px 12px; border-radius: 14px 14px 0 0;
  background: linear-gradient(90deg, var(--primary-bg), var(--card) 74%);
}
.formmodal .fm-head .reg-ht { flex: 1; min-width: 0; }
.formmodal .fm-head .m-title { font-size: 15.5px; }
.formmodal .m-body.fm-body { flex: 1 1 auto; overflow-y: auto; padding: 13px 18px 2px; }
.formmodal .reg-wrap { column-width: 470px; column-count: 2; }
.formmodal .m-foot.fm-foot { flex: none; align-items: center; gap: 10px; padding: 11px 20px 12px; }
.formmodal .m-foot .reg-warn { max-width: 62%; }
@media (max-width: 1080px) {
  .modal.formmodal { max-height: calc(94vh - 40px); }
  .formmodal .reg-wrap { column-count: 1; }
}
/* 分区卡片：两列瀑布流，短分区与长分区自动配平，尽量一屏看完 */
.reg-wrap { column-width: 600px; column-count: 2; column-gap: 13px; }
.reg-sec {
  break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid;
  border: 1px solid var(--line); border-radius: 10px; background: var(--input-bg);
  padding: 0 11px 7px; margin: 0 0 12px;
}
.reg-sec-h {
  display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--text);
  padding: 7px 0 6px; border-bottom: 1px dashed var(--line); letter-spacing: .3px;
}
.reg-sec-h .fsec-n { margin-left: auto; }
.reg-sec-b { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; padding-top: 8px; }
.reg-sec-b .span2 { grid-column: span 2; }
.reg-sec-b .span3 { grid-column: span 3; }
.reg-sec-b .f-item { margin-bottom: 6px; }
.reg-sec-b .f-item label { font-size: 11.5px; margin-bottom: 2px; }
.reg-sec-b .f-item input, .reg-sec-b .f-item select { height: 31px; font-size: 12.5px; padding: 0 8px; }
.reg-sec-b .f-item .ctrl-row .opt-btn { height: 31px; padding: 0 8px; }
.reg-sec-b .f-item textarea { min-height: 46px; font-size: 12.5px; }
@media (max-width: 1100px) {
  .reg-wrap { column-count: 1; }
  .reg-sec-b { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reg-sec-b .span3 { grid-column: span 2; }
}
/* 底部吸底操作条：登记入职 / 重置 + 本次已登记（可撤销） */
.reg-foot {
  position: sticky; bottom: 0; z-index: 6; margin: 0 -14px -8px;
  padding: 9px 14px 11px; border-top: 1px solid var(--line);
  background: var(--card); border-radius: 0 0 var(--radius) var(--radius);
  box-shadow: 0 -8px 20px rgba(15, 23, 42, .05);
}
.reg-recent { display: none; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 8px; font-size: 11.5px; }
.reg-recent.on { display: flex; }
.reg-recent .rr-lb { color: var(--text3); }
.reg-recent .rr-it {
  display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 4px 0 9px;
  border: 1px solid var(--line2); border-radius: 20px; background: var(--subtle-bg2); color: var(--text);
}
.reg-recent .rr-it em { font-style: normal; font-size: 10.5px; color: var(--text3); }
.reg-recent .rr-x {
  width: 16px; height: 16px; border-radius: 50%; border: 0; cursor: pointer; padding: 0;
  background: transparent; color: var(--text3); font-size: 11px; line-height: 16px;
}
.reg-recent .rr-x:hover { background: var(--red); color: #fff; }
.reg-btnrow { display: flex; align-items: center; gap: 10px; }
.reg-warn { font-size: 12px; color: var(--orange); }
.reg-warn.ok { color: var(--green); }
.reg-no { font-size: 11.5px; color: var(--text3); white-space: nowrap; }
.reg-no b { font-family: ui-monospace, Menlo, Consolas, monospace; color: var(--text2); font-weight: 700; font-size: 12.5px; }
.reg-no em { font-style: normal; margin-left: 6px; opacity: .8; }
/* 编辑弹窗：三列比两列更矮，一屏更完整 */
.form-grid.cols3 { grid-template-columns: repeat(3, 1fr); }
.form-grid.cols3 .f-sec { grid-column: span 3; }
.form-grid .span3 { grid-column: span 3; }
.form-grid.cols3 .f-item.span3 { grid-column: span 3; }

.drawer-mask { position: fixed; inset: 0; background: var(--mask2); z-index: 90; animation: fadeIn .15s; }
.drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 520px; max-width: 94vw;
  background: var(--card); z-index: 95; box-shadow: -8px 0 40px rgba(15, 23, 42, .22);
  display: flex; flex-direction: column; animation: slideIn .22s cubic-bezier(.2, .9, .3, 1);
}
@keyframes slideIn { from { transform: translateX(40px); opacity: .4; } to { transform: none; opacity: 1; } }
.drawer .d-head { padding: 18px 22px 14px; border-bottom: 1px solid var(--line); display: flex; gap: 12px; align-items: center; }
.drawer .d-head .avatar { width: 42px; height: 42px; font-size: 16px; }
.drawer .d-name { font-size: 16px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.drawer .d-sub { font-size: 12px; color: var(--text3); margin-top: 3px; }
.drawer .d-body { flex: 1; overflow-y: auto; padding: 16px 22px 30px; }
.drawer .d-foot { padding: 12px 22px; border-top: 1px solid var(--line); display: flex; gap: 10px; }
.dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 16px; }
.dl .row { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.dl .row .k { color: var(--text3); flex: none; }
.dl .row .v { text-align: right; word-break: break-all; }
.d-sec { font-size: 13px; font-weight: 700; margin: 16px 0 6px; padding-left: 9px; border-left: 3px solid var(--primary); }

#toastRoot { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.toast {
  background: rgba(29, 33, 41, .92); color: #fff; font-size: 13px;
  padding: 9px 18px; border-radius: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
  animation: toastIn .25s cubic-bezier(.2, .9, .3, 1.2); display: flex; align-items: center; gap: 8px;
}
.toast.ok { background: rgba(0, 150, 94, .95); }
.toast.err { background: rgba(245, 63, 63, .95); }
@keyframes toastIn { from { transform: translateY(-12px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- 入离职管理 ---------- */
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line2); margin-bottom: 16px; flex-wrap: wrap; }
.tabs .tab {
  padding: 9px 16px; font-size: 13.5px; color: var(--text2); cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px; display: flex; align-items: center; gap: 7px;
}
.tabs .tab:hover { color: var(--text); }
.tabs .tab.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.tabs .tab .cnt { background: var(--subtle-bg2); border-radius: 8px; font-size: 11px; padding: 1px 7px; color: var(--text2); }
.tabs .tab.active .cnt { background: var(--primary-bg); color: var(--primary); }

.progress { height: 6px; background: var(--subtle-bg2); border-radius: 3px; overflow: hidden; min-width: 90px; }
.progress > i { display: block; height: 100%; background: linear-gradient(90deg, #3d6df5, #6a9bff); border-radius: 3px; transition: width .3s; }
.progress.done > i { background: linear-gradient(90deg, #00b578, #3fd49c); }

.checklist { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 14px; margin: 6px 0 4px; }
.checklist .ck {
  display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid var(--line2);
  border-radius: 8px; cursor: pointer; transition: all .15s; font-size: 13px; user-select: none;
}
.checklist .ck:hover { border-color: var(--primary); }
.checklist .ck.on { background: var(--green-bg); border-color: var(--green); color: var(--green); }
.checklist .ck .box {
  width: 17px; height: 17px; border-radius: 5px; border: 1.5px solid var(--dash); flex: none;
  display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 11px;
}
.checklist .ck.on .box { background: var(--green); border-color: var(--green); }
.checklist > .opt-empty { grid-column: 1 / -1; }
/* 办理清单区标题 + 「⚙ 设置手续」按钮（入宿 / 退宿） */
.sf-sec.chk-head { display: flex; align-items: center; gap: 8px; justify-content: space-between; padding-right: 2px; }
.sf-sec.chk-head .btn.sm { font-weight: 500; flex: none; }

.flow { position: relative; padding-left: 22px; }
.flow::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: var(--line2); }
.flow .f-item2 { position: relative; padding: 0 0 18px 12px; }
.flow .f-item2::before {
  content: ""; position: absolute; left: -19px; top: 5px; width: 8px; height: 8px;
  border-radius: 50%; background: var(--primary); border: 2px solid var(--card); box-shadow: 0 0 0 2px var(--primary-bg);
}
.flow .f-item2.leave::before { background: var(--red); box-shadow: 0 0 0 2px var(--red-bg); }
.flow .f-item2 .t { font-size: 13px; font-weight: 600; }
.flow .f-item2 .d { font-size: 12px; color: var(--text3); margin-top: 2px; }

/* ---------- 表单视图（卡片） ---------- */
.cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 14px; }
.cards-grid.sz-lg { grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); }
.cards-grid.sz-sm { grid-template-columns: repeat(auto-fill, minmax(192px, 1fr)); gap: 10px; }
.cards-grid.sz-sm .emp-card { padding: 12px; }
.cards-grid.sz-sm .emp-card .avatar { width: 32px; height: 32px; font-size: 13px; }
.cards-grid.sz-sm .emp-card .ec-head { margin-bottom: 8px; gap: 8px; }
.cards-grid.sz-sm .emp-card .ec-name { font-size: 13px; }
.cards-grid.sz-sm .emp-card .ec-rows { grid-template-columns: 1fr; gap: 3px; font-size: 11.5px; }
.cards-grid.sz-sm .emp-card .ec-foot { margin-top: 8px; padding-top: 8px; }
.cards-grid.sz-lg .emp-card .avatar { width: 48px; height: 48px; font-size: 18px; }
.cards-grid.sz-lg .emp-card .ec-name { font-size: 16px; }
.cards-grid.sz-lg .emp-card .ec-rows { font-size: 12.5px; gap: 7px 10px; }
.emp-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px; box-shadow: var(--shadow); transition: all .18s; cursor: pointer; position: relative;
}
.emp-card:hover { transform: translateY(-2px); box-shadow: 0 6px 22px rgba(15, 23, 42, .14); border-color: var(--primary); }
.emp-card .ec-head { display: flex; gap: 11px; align-items: center; margin-bottom: 11px; }
.emp-card .avatar { width: 40px; height: 40px; font-size: 15px; }
.emp-card .ec-name { font-size: 14.5px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.emp-card .ec-sub { font-size: 11.5px; color: var(--text3); margin-top: 2px; }
.emp-card .ec-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px; font-size: 12px; }
.emp-card .ec-rows .r { display: flex; justify-content: space-between; color: var(--text2); }
.emp-card .ec-rows .r .k { color: var(--text3); }
.emp-card .ec-foot { display: flex; gap: 5px; margin-top: 11px; padding-top: 10px; border-top: 1px dashed var(--line); flex-wrap: wrap; }
.emp-card .ec-act { position: absolute; top: 10px; right: 10px; opacity: 0; transition: opacity .15s; display: flex; gap: 2px; }
.emp-card:hover .ec-act { opacity: 1; }

/* ---------- 表单视图工具条 ---------- */
.c-search { position: relative; }
.c-search input {
  width: 240px; height: 32px; border: 1px solid var(--line2); border-radius: 7px;
  padding: 0 28px 0 10px; background: var(--input-bg); outline: none; transition: border-color .15s, width .15s;
}
.c-search input:focus { border-color: var(--primary); width: 290px; }
.c-search .c-clear {
  display: none; position: absolute; right: 6px; top: 6px; width: 20px; height: 20px;
  align-items: center; justify-content: center; border-radius: 50%;
  font-size: 10px; color: var(--text3); background: var(--subtle-bg2);
}
.c-search .c-clear:hover { color: var(--red); }
.seg { display: inline-flex; border: 1px solid var(--line2); border-radius: 7px; overflow: hidden; height: 32px; }
.seg button { padding: 0 12px; font-size: 12px; color: var(--text2); background: var(--card); transition: all .12s; }
.seg button + button { border-left: 1px solid var(--line2); }
.seg button:hover { color: var(--primary); }
.seg button.on { background: var(--primary-bg); color: var(--primary); font-weight: 600; }
.mt-count { font-size: 12.5px; color: var(--text2); }
.mt-count b { color: var(--primary); }
.mt-dim { color: var(--text3); }
/* 卡片字段选择菜单 */
.cardfields-menu { max-height: 60vh; overflow-y: auto; }
.cardfields-menu .cf-list { max-height: 44vh; overflow-y: auto; padding: 4px 6px; }
.cf-item {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px;
  border-radius: 6px; font-size: 12.5px; color: var(--text2); cursor: pointer;
}
.cf-item:hover { background: var(--subtle-bg); color: var(--text); }
.cf-item input { accent-color: var(--primary); }

/* ---------- 宿舍管理 ---------- */
.dm-room-num { font-variant-numeric: tabular-nums; letter-spacing: .3px; }
.dm-bed { display: flex; align-items: center; gap: 9px; min-width: 150px; }
.dm-bed .progress { min-width: 68px; }
.dm-bed .progress.over > i { background: linear-gradient(90deg, #f53f3f, #ff8b8b); }
.opt-hint .btn.sm { height: 24px; padding: 0 9px; font-size: 11.5px; margin-left: 6px; }

/* ---------- 设置 ---------- */
.set-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.set-card { padding: 18px 20px; }
/* 设置页 · 自定义布局（瀑布流 + 拖拽换位 / 调大小） */
.set-grid.set-free { position: relative; }
.set-laybar { display: flex; align-items: center; gap: 10px; padding: 0 2px; grid-column: 1 / -1; }
.set-laybar .sl-tip { font-size: 11.5px; color: var(--text3); line-height: 1.5; }
.set-laybar .sl-tip b { color: var(--text2); }
.set-laybar .btn { margin-left: auto; flex: none; }
.card.set-card { position: relative; }
.card.set-card h3 { display: flex; align-items: center; gap: 8px; }
.card.set-card .sc-grip {
  margin-left: auto; cursor: grab; color: var(--text3); font-size: 13px; letter-spacing: 1px;
  padding: 0 5px; border-radius: 5px; user-select: none; opacity: 0; transition: opacity .15s, color .12s, background .12s; flex: none;
}
.card.set-card:hover .sc-grip { opacity: 1; }
.card.set-card .sc-grip:hover { color: var(--primary); background: var(--subtle-bg); }
.card.set-card .sc-rs {
  position: absolute; right: 2px; bottom: 2px; width: 20px; height: 20px; z-index: 5;
  display: flex; align-items: center; justify-content: center; color: var(--text3); font-size: 12px;
  cursor: nwse-resize; border-radius: 5px; user-select: none; opacity: 0; transition: opacity .15s, color .12s;
}
.card.set-card:hover .sc-rs { opacity: 1; }
.card.set-card .sc-rs:hover { color: var(--primary); }
.set-grid.set-dragging, .set-grid.set-dragging * { cursor: grabbing !important; user-select: none !important; }
.card.set-card.sc-drag { z-index: 60; box-shadow: 0 18px 40px rgba(15, 23, 42, .28); opacity: .92; }
.card.set-card.sc-drop { outline: 2px dashed var(--primary); outline-offset: 2px; }
.card.set-card.sc-fixed { overflow-y: auto; }
@media (max-width: 1100px) { .set-laybar { display: none; } }
.set-card h3 { font-size: 14px; font-weight: 700; margin-bottom: 4px; }
.set-card .desc { font-size: 12px; color: var(--text3); margin-bottom: 14px; line-height: 1.6; }
.taglist { display: flex; flex-wrap: wrap; gap: 8px; }
.taglist .tl {
  display: inline-flex; align-items: center; gap: 6px; background: var(--chip-bg);
  border: 1px solid var(--line2); border-radius: 7px; padding: 5px 8px 5px 11px; font-size: 12.5px;
}
.taglist .tl .x { color: var(--text3); cursor: pointer; font-size: 13px; width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: 4px; }
.taglist .tl .x:hover { background: var(--red-bg); color: var(--red); }
.inline-add { display: flex; gap: 8px; margin-top: 12px; }
.inline-add input { flex: 1; height: 32px; border: 1px solid var(--line2); border-radius: 7px; padding: 0 10px; outline: none; background: var(--input-bg); }
.inline-add input:focus { border-color: var(--primary); }
.opt-chips { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- 下拉选项编辑 ---------- */
.ctrl-row { display: flex; gap: 6px; align-items: center; }
.ctrl-row select { flex: 1; min-width: 0; }
.ctrl-row .opt-btn {
  flex: 0 0 auto; height: 34px; padding: 0 10px; border: 1px solid var(--line2);
  border-radius: 7px; background: var(--input-bg); color: var(--text2); font-size: 11.5px;
  cursor: pointer; display: inline-flex; align-items: center; gap: 3px; white-space: nowrap;
  transition: border-color .15s, color .15s, background .15s;
}
.ctrl-row .opt-btn:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); }
.mask.opt-mask { z-index: 200; }
.opt-hint {
  font-size: 11.5px; color: var(--text3); background: var(--subtle-bg);
  border-radius: 7px; padding: 8px 10px; margin-bottom: 12px; line-height: 1.65;
}
.opt-head { display: flex; align-items: center; gap: 10px; font-size: 11.5px; color: var(--text3); margin-bottom: 7px; }
.opt-head .opt-search { margin-left: auto; }
.opt-head .opt-search input {
  height: 28px; width: 160px; border: 1px solid var(--line2); border-radius: 7px;
  padding: 0 9px; outline: none; background: var(--input-bg); font-size: 12px;
}
.opt-head .opt-search input:focus { border-color: var(--primary); }
.opt-list { max-height: 40vh; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; padding-right: 2px; }
.opt-row { display: flex; align-items: center; gap: 6px; }
.opt-row.hide { display: none; }
.opt-row .opt-idx { width: 20px; text-align: right; font-size: 11px; color: var(--text3); flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.opt-row .oi {
  flex: 1; min-width: 0; height: 32px; border: 1px solid var(--line2); border-radius: 7px;
  padding: 0 10px; background: var(--input-bg); outline: none; font-size: 12.5px;
}
.opt-row .oi:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(61, 109, 245, .14); }
.opt-row .opt-cnt { flex: 0 0 auto; font-size: 11px; color: var(--text3); min-width: 34px; text-align: right; font-variant-numeric: tabular-nums; }
.opt-ib { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; color: var(--text3); cursor: pointer; transition: background .12s, color .12s; }
.opt-ib:hover { background: var(--subtle-bg2); color: var(--text); }
.opt-ib.del:hover { background: var(--red-bg); color: var(--red); }
.opt-empty { font-size: 12.5px; color: var(--text3); padding: 16px 4px; text-align: center; }

/* 序号列（人员浮窗） */
.dt .seqc { text-align: center; color: var(--text3); font-variant-numeric: tabular-nums; }
.dt tbody tr:hover .seqc { color: var(--primary); }
/* 必填项未填写 */
.dt td.miss { color: var(--red); background: var(--red-bg); font-size: 11.5px; text-align: center; }

.mini-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.mini {
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px;
  transition: transform .2s cubic-bezier(.2, .8, .3, 1), box-shadow .2s ease, border-color .2s ease;
}
.mini:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(15, 23, 42, .14); border-color: var(--line2); }
.mini .v { font-size: 22px; font-weight: 700; }
.mini .k { font-size: 11.5px; color: var(--text3); margin-top: 2px; }
.mini.clk { cursor: pointer; }
.mini.clk:hover .v { text-decoration: underline; text-underline-offset: 5px; }
.mini.clk:hover .k { color: var(--text2); }

/* ---------- 排名条（progress 视图） ---------- */
.prog-list { display: flex; flex-direction: column; gap: 9px; height: 100%; overflow: auto; padding: 2px 4px 2px 2px; }
.prog-row {
  display: grid; grid-template-columns: minmax(52px, 30%) 1fr auto auto;
  align-items: center; gap: 8px; cursor: pointer;
  padding: 3px 5px; border-radius: 8px; transition: background .15s;
}
.prog-row:hover { background: var(--subtle-bg); }
.pl-name { font-size: 12.5px; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-bar { height: 9px; border-radius: 5px; background: var(--subtle-bg2); overflow: hidden; }
.pl-bar i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, var(--primary), #7a5af8); transition: width .5s cubic-bezier(.2, .8, .3, 1); }
.pl-val { font-size: 12.5px; color: var(--text); font-variant-numeric: tabular-nums; min-width: 22px; text-align: right; }
.pl-pct { font-size: 11px; color: var(--text3); font-variant-numeric: tabular-nums; min-width: 42px; text-align: right; }

/* ---------- 打印 ---------- */
@media print {
  .sidebar, .topbar, .filterbar, .pager, .no-print, .rowact, .roster-float, .bd-jump, #toastRoot { display: none !important; }
  body, #app, .main, .view { display: block !important; height: auto !important; overflow: visible !important; background: #fff; }
  .view { padding: 0; }
  .tablewrap { border: none; box-shadow: none; overflow: visible; }
  table.dt thead th { background: #eee !important; }
  table.dt tbody td, table.dt thead th { border: 1px solid #999 !important; }
  table.dt .freeze { position: static; }
  table.dt { table-layout: auto; }
}

@media (max-width: 1100px) {
  .kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .chart-grid { grid-template-columns: repeat(6, 1fr); }
  .chart-grid > .chart-card { grid-column: span 6 !important; grid-row: span 1 !important; }
  .set-grid { grid-template-columns: 1fr; }
}

/* ---------- 工衣管理 ---------- */
.u-filter { padding: 12px 14px; margin-bottom: 14px; }
.u-frow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.u-frow + .u-frow { margin-top: 10px; }
.u-frow select, .u-frow input[type="text"], .u-frow input:not([type]) {
  height: 30px; border: 1px solid var(--line2); border-radius: 7px;
  background: var(--card); color: var(--text); padding: 0 9px; font-size: 12.5px;
}
.u-frow input#uFKw, .u-frow input#uSKw { width: 210px; }
.u-fl { font-size: 12.5px; color: var(--text2); }
.u-stock { font-size: 12px; color: var(--text3); font-variant-numeric: tabular-nums; }
.u-selinfo { font-size: 12.5px; color: var(--text2); }
.u-selinfo b { color: var(--primary); font-size: 13.5px; }

.unif-stock th, .unif-stock td { text-align: center; }
.unif-stock th:first-child, .unif-stock td:first-child { text-align: left; }
.unif-cell {
  margin: 0 auto; min-width: 54px; padding: 5px 4px; border-radius: 7px; cursor: pointer;
  font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.25;
  background: var(--subtle-bg); border: 1px solid var(--line2); color: var(--text);
  transition: all .14s;
}
.unif-cell:hover { border-color: var(--primary); background: var(--primary-bg); color: var(--primary); }
.unif-cell i { display: block; font-size: 10px; font-weight: 400; font-style: normal; color: var(--text3); }
.unif-cell.low { background: var(--orange-bg); border-color: transparent; color: var(--orange); }
.unif-cell.low i { color: var(--orange); }
.unif-cell.out { background: var(--red-bg); border-color: transparent; color: var(--red); }
.unif-cell.out i { color: var(--red); }

.cfg-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.cfg-in {
  flex: 1; height: 32px; border: 1px solid var(--line2); border-radius: 7px;
  background: var(--card); color: var(--text); padding: 0 10px; font-size: 13px;
}
.unif-tags { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 8px; }
.unif-emp-list { display: flex; gap: 6px; flex-wrap: wrap; max-height: 130px; overflow: auto; }
.unif-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 6px;
  background: var(--subtle-bg); font-size: 12px; color: var(--text);
}
.unif-chip i { font-style: normal; color: var(--text3); font-size: 11px; }

/* ---------- 名单类视图：分页条贴底（与员工花名册同款） ---------- */
#view.listview { display: flex; flex-direction: column; padding-bottom: 0; }
#view.listview > .tabpane { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
#view.listview > .tabpane > .tablewrap,
#view.listview > .tabpane > .flowwrap { flex: 1 1 auto; min-height: 180px; border-radius: var(--radius) var(--radius) 0 0; }
#view.listview > .tabpane > .pager { flex: none; margin-top: -1px; margin-bottom: 0; bottom: 0; border-radius: 0 0 var(--radius) var(--radius); }
#view.listview > .tablewrap { flex: 1 1 auto; min-height: 180px; }
#view.listview > .pager { flex: none; margin-top: -1px; margin-bottom: 0; bottom: 0; }
/* 出入记录这类「流式卡片」列表的滚动容器 */
.flowwrap {
  overflow: auto; padding: 16px 18px; background: var(--card);
  border: 1px solid var(--line); box-shadow: var(--shadow);
}

/* ---------- 弹窗名单：分页条 ---------- */
.listmodal .m-body.listflex { display: flex; flex-direction: column; }
.listmodal .m-body.listflex > .listwrap { flex: 1 1 auto; }
#elPager { flex: none; }
#elPager .pager {
  position: static; margin: 0; padding: 8px 16px;
  border: none; border-top: 1px solid var(--line); border-radius: 0;
  box-shadow: none; background: transparent;
}

/* ---------- 工衣 / 饭卡 模块共用（筛选卡与名单输入控件） ---------- */
/* .u-filter / .u-frow / .u-fl / .u-stock / .u-selinfo 为两个模块共用的通用筛选卡样式 */
.mc-num { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.mc-card-box {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 16px 18px;
}
.mc-stock-num {
  min-width: 132px; padding: 10px 14px; border-radius: 10px; text-align: center;
  background: var(--subtle-bg); border: 1px solid var(--line2);
}
.mc-stock-num b { display: block; font-size: 26px; line-height: 1.15; font-variant-numeric: tabular-nums; }
.mc-stock-num span { font-size: 11.5px; color: var(--text3); }
.mc-stock-num.low { background: var(--orange-bg); border-color: transparent; }
.mc-stock-num.low b { color: var(--orange); }
.mc-stock-num.out { background: var(--red-bg); border-color: transparent; }
.mc-stock-num.out b { color: var(--red); }

/* 表格合计行（工衣库存台账等） */
table.dt tfoot td {
  background: var(--subtle-bg); font-weight: 600; color: var(--text);
  border-top: 1px solid var(--line2);
}
table.dt.unif-stock tfoot tr.unif-total td { position: sticky; bottom: 0; z-index: 4; }

/* ============================================================
 * 一键备份与恢复
 * ============================================================ */
.bak-btns { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.bak-btns .btn { height: 34px; padding: 0 16px; font-size: 13px; }
.bak-hint { margin-top: 10px; font-size: 12px; line-height: 1.75; color: var(--text3); }
.bak-hint b { color: var(--text2); }

/* 备份/恢复选项里的勾选项 */
.bak-opt {
  display: flex; align-items: flex-start; gap: 10px; cursor: pointer;
  padding: 10px 12px; border-radius: 10px; margin-bottom: 8px;
  background: var(--subtle-bg); border: 1px solid var(--line2);
  transition: border-color .15s, background .15s;
}
.bak-opt:hover { border-color: var(--primary); }
.bak-opt input { flex: none; width: 16px; height: 16px; margin-top: 2px; accent-color: var(--primary); cursor: pointer; }
.bak-opt > span { display: block; min-width: 0; }
.bak-opt > span > b { display: block; font-size: 13px; font-weight: 600; color: var(--text); }
.bak-opt > span > span { display: block; margin-top: 3px; font-size: 11.5px; line-height: 1.65; color: var(--text3); }
.bak-opt > span > span b { color: var(--orange); font-weight: 600; }
.bak-opt code {
  padding: 1px 5px; border-radius: 4px; font-size: 11px;
  background: var(--chip-bg); font-family: ui-monospace, Menlo, Consolas, monospace;
}

/* 服务器历史快照 */
.bak-srv { margin-top: 14px; }
.bak-srv-head { font-size: 12px; font-weight: 600; color: var(--text2); margin-bottom: 8px; }
.bak-srv-sub { font-weight: 400; font-size: 11.5px; color: var(--text3); margin-top: 3px; line-height: 1.7; }
.bak-kind {
  flex: none; font-size: 10.5px; line-height: 1; padding: 4px 6px; border-radius: 5px;
  border: 1px solid transparent; white-space: nowrap;
}
.bak-kind.k-save { color: var(--text3); background: var(--subtle-bg2); border-color: var(--line2); }
.bak-kind.k-auto { color: var(--primary); background: var(--primary-bg, rgba(47,107,255,.1)); border-color: rgba(47,107,255,.28); }
.bak-kind.k-manual { color: var(--orange); background: var(--orange-bg); border-color: rgba(255,125,0,.3); }
.bak-srv-list {
  max-height: 260px; overflow: auto;
  border: 1px solid var(--line2); border-radius: 10px;
}
.bak-srv-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; font-size: 12px;
  border-bottom: 1px solid var(--line2);
}
.bak-srv-row:last-child { border-bottom: 0; }
.bak-srv-row:hover { background: var(--row-hover); }
.bak-srv-t { flex: none; width: 150px; color: var(--text); font-variant-numeric: tabular-nums; }
.bak-srv-m { flex: 1; min-width: 0; color: var(--text3); font-variant-numeric: tabular-nums; }
.bak-srv-row .btn { flex: none; }

/* 恢复向导预览 */
.rv-file {
  padding: 10px 12px; border-radius: 10px; margin-bottom: 10px;
  background: var(--primary-bg, var(--subtle-bg)); border: 1px solid var(--line2);
  font-size: 12.5px; font-weight: 600; color: var(--text);
  word-break: break-all;
}
.rv-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--text3); margin-bottom: 12px; }
.rv-meta b { color: var(--text); font-weight: 600; }
.rv-legacy {
  padding: 1px 8px; border-radius: 20px; font-size: 11px;
  background: var(--orange-bg); color: var(--orange);
}
.rv-title { font-size: 12px; font-weight: 600; color: var(--text2); margin-bottom: 6px; }
.rv-list {
  border: 1px solid var(--line2); border-radius: 10px; overflow: hidden;
  max-height: 260px; overflow-y: auto;
}
.rv-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 12px; font-size: 12.5px;
  border-bottom: 1px solid var(--line2);
}
.rv-row:last-child { border-bottom: 0; }
.rv-row span { color: var(--text2); }
.rv-row b { color: var(--text); font-variant-numeric: tabular-nums; }
.rv-warn {
  margin-top: 12px; padding: 10px 12px; border-radius: 10px;
  font-size: 12px; line-height: 1.75;
  background: var(--red-bg); color: var(--text2);
  border: 1px solid transparent;
}
.rv-warn b { color: var(--red); }

/* 设置页里的备份卡按钮排布（小屏折行） */
@media (max-width: 620px) {
  .bak-srv-t { width: auto; }
  .bak-srv-row { flex-wrap: wrap; }
  .bak-srv-m { width: 100%; order: 3; }
}

/* ============================================================
 * 导入预览（选好文件后先看清要导入什么，再决定导不导）
 * ============================================================ */
.iv-stats {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px;
}
.iv-stat {
  flex: 1 1 92px; min-width: 88px; padding: 8px 10px; border-radius: 10px;
  background: var(--subtle-bg); border: 1px solid var(--line2); text-align: center;
}
.iv-stat b { display: block; font-size: 20px; line-height: 1.2; color: var(--text); font-variant-numeric: tabular-nums; }
.iv-stat span { font-size: 11px; color: var(--text3); }
.iv-stat.ok { background: var(--green-bg); border-color: transparent; }
.iv-stat.ok b { color: var(--green); }
.iv-stat.warn { background: var(--orange-bg); border-color: transparent; }
.iv-stat.warn b { color: var(--orange); }
.iv-stat.bad { background: var(--red-bg); border-color: transparent; }
.iv-stat.bad b { color: var(--red); }

.iv-issues { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.iv-issue {
  padding: 6px 10px; border-radius: 8px; font-size: 12px; line-height: 1.65;
  background: var(--orange-bg); color: var(--text2);
}
.iv-issue.bad { background: var(--red-bg); }
.iv-allok {
  padding: 8px 12px; border-radius: 8px; margin-bottom: 12px;
  font-size: 12.5px; font-weight: 600; color: var(--green); background: var(--green-bg);
}

.iv-mix {
  padding: 9px 12px; border-radius: 10px; margin-bottom: 12px;
  background: var(--subtle-bg); border: 1px solid var(--line2);
  font-size: 12px; line-height: 1.8; color: var(--text3);
}
.iv-mix b { display: block; margin-bottom: 2px; color: var(--text2); font-size: 12px; }
.iv-mix div { word-break: break-all; }

.iv-table-wrap { border: 1px solid var(--line2); border-radius: 10px; overflow: auto; max-height: 300px; }
.iv-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.iv-table th {
  position: sticky; top: 0; z-index: 2; text-align: left; white-space: nowrap;
  padding: 7px 10px; background: var(--subtle-bg); color: var(--text2); font-weight: 600;
  border-bottom: 1px solid var(--line2);
}
.iv-table td { padding: 6px 10px; border-bottom: 1px solid var(--line2); color: var(--text2); }
.iv-table tr:last-child td { border-bottom: 0; }
.iv-table tbody tr:hover td { background: var(--row-hover); }
.iv-ln { color: var(--text3); font-variant-numeric: tabular-nums; }
.iv-id { font-variant-numeric: tabular-nums; color: var(--text3); white-space: nowrap; }
.iv-tag {
  display: inline-block; padding: 1px 8px; border-radius: 20px; font-size: 11px; font-weight: 600; white-space: nowrap;
}
.iv-tag.ok { background: var(--green-bg); color: var(--green); }
.iv-tag.dup { background: var(--orange-bg); color: var(--orange); }
.iv-tag.bad { background: var(--red-bg); color: var(--red); }
.iv-more { padding: 6px 10px; font-size: 11.5px; color: var(--text3); text-align: center; background: var(--subtle-bg); }
/* 第 74 轮：导入预览「问题原因」小字 + 只看问题行开关 */
.iv-why { margin-top: 3px; font-size: 11px; line-height: 1.5; color: var(--orange); max-width: 240px; }
.iv-toggle { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 400; color: var(--text2); cursor: pointer; user-select: none; }
.iv-toggle input { width: 14px; height: 14px; accent-color: var(--primary); cursor: pointer; }

/* ============ 第 31 轮：选项颜色标记 / 玻璃表单弹窗 / 表单分区管理 ============ */
/* --- 扩展 tag 色：青 / 粉 --- */
:root { --cyan: #0aa5b5; --cyan-bg: #e2f7f9; --pink: #e0447f; --pink-bg: #fdeaf2; }
[data-theme="dark"] { --cyan: #3cc4cf; --cyan-bg: #0e2e33; --pink: #f2739f; --pink-bg: #39182a; }
.tag.c { background: var(--cyan-bg); color: var(--cyan); }
.tag.k { background: var(--pink-bg); color: var(--pink); }

/* --- 选项颜色圆点 + 色板 --- */
.opt-dot {
  width: 15px; height: 15px; border-radius: 50%; flex: 0 0 auto; display: inline-block;
  background: var(--subtle-bg2); border: 1px solid rgba(0, 0, 0, .1); cursor: pointer;
  transition: transform .12s;
}
.opt-row .opt-dot:hover, .fm-sec-row .opt-dot:hover { transform: scale(1.18); }
.opt-dot.b { background: var(--blue); } .opt-dot.g { background: var(--green); }
.opt-dot.o { background: var(--orange); } .opt-dot.r { background: var(--red); }
.opt-dot.p { background: var(--purple); } .opt-dot.gold { background: var(--gold); }
.opt-dot.gray { background: #9aa3b2; } .opt-dot.c { background: var(--cyan); }
.opt-dot.k { background: var(--pink); }
.opt-palette {
  position: fixed; z-index: 3200; width: 156px; padding: 8px;
  background: var(--card); border: 1px solid var(--line2); border-radius: 10px;
  box-shadow: 0 14px 44px rgba(15, 23, 42, .2); animation: popIn .15s ease;
}
.op-title { font-size: 12px; color: var(--text3); padding: 2px 4px 8px; }
.op-item {
  display: flex; align-items: center; gap: 8px; width: 100%; padding: 6px 8px;
  border: 0; background: transparent; border-radius: 6px; font-size: 13px;
  color: var(--text); cursor: pointer; text-align: left;
}
.op-item:hover { background: var(--subtle-bg); }

/* --- 玻璃流光弹窗（员工登记 / 编辑 / 字段管理） --- */
.modal.glass {
  background: linear-gradient(165deg, rgba(255, 255, 255, .94) 0%, rgba(246, 249, 255, .88) 55%, rgba(240, 245, 254, .93) 100%);
  backdrop-filter: blur(22px) saturate(1.35); -webkit-backdrop-filter: blur(22px) saturate(1.35);
  border: 1px solid rgba(255, 255, 255, .72);
  box-shadow: 0 24px 70px rgba(30, 60, 120, .2), inset 0 1px 0 rgba(255, 255, 255, .75);
  position: relative; overflow: hidden;
}
.modal.glass::before {
  content: ""; position: absolute; top: -40%; left: -70%; width: 46%; height: 180%;
  transform: rotate(12deg); pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(120, 160, 255, .05) 35%, rgba(255, 255, 255, .55) 50%, rgba(120, 160, 255, .05) 65%, transparent);
  animation: glassSheen 8s ease-in-out infinite;
}
@keyframes glassSheen { 0%, 52% { left: -70%; } 88%, 100% { left: 135%; } }
.mask:has(.modal.glass) { backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.modal.glass input:focus, .modal.glass select:focus, .modal.glass textarea:focus {
  border-color: var(--primary); box-shadow: 0 0 0 3px rgba(61, 109, 245, .14);
}
/* 分区标题：渐变胶囊质感（登记页 / 编辑弹窗共用） */
.f-sec {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 12px 7px 10px; margin: 18px 0 10px;
  background: linear-gradient(90deg, var(--primary-bg), transparent 82%);
  border-radius: 0 9px 9px 0; letter-spacing: .5px;
}
.f-sec::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line), transparent); }
[data-theme="dark"] .modal.glass {
  background: linear-gradient(165deg, rgba(30, 38, 58, .95), rgba(22, 28, 44, .92));
  border-color: rgba(255, 255, 255, .09);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .06);
}
[data-theme="dark"] .modal.glass::before {
  background: linear-gradient(100deg, transparent, rgba(120, 160, 255, .04) 35%, rgba(160, 190, 255, .1) 50%, rgba(120, 160, 255, .04) 65%, transparent);
}

/* --- 字段管理：表单分区管理 --- */
.fm-secs { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px 12px; background: var(--subtle-bg); }
.fm-secs-head { font-size: 12.5px; margin-bottom: 8px; display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.fm-secs-head span { font-size: 11.5px; color: var(--text3); }
.fm-sec-rows { display: flex; flex-direction: column; gap: 6px; }
.fm-sec-row {
  display: flex; align-items: center; gap: 8px; background: var(--card);
  border: 1px solid var(--line); border-radius: 8px; padding: 4px 8px;
}
.fm-sec-row:hover { border-color: var(--line2); }
.fm-sec-title {
  flex: 1; min-width: 0; height: 30px; border: 1px solid transparent; background: transparent;
  outline: none; font-size: 13px; font-weight: 600; color: var(--text); border-radius: 6px; padding: 0 8px;
}
.fm-sec-title:hover, .fm-sec-title:focus { border-color: var(--line2); background: var(--input-bg); }
.fm-sec-sel { height: 28px; font-size: 12px; max-width: 118px; }

/* ============================================================
 * 第 32 轮：预支管理 / 工伤管理
 * ============================================================ */
/* 金额概览（归还弹窗 / 明细弹窗 / 工伤明细） */
.adv-sum {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
  background: var(--subtle-bg); border-radius: 10px; padding: 12px 14px; margin-bottom: 12px;
  border: 1px solid var(--line);
}
.adv-sum > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.adv-sum .k { font-size: 11.5px; color: var(--text3); }
.adv-sum b { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .2px; }
.adv-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12px; color: var(--text2); margin: 10px 0 2px; }
.adv-meta b { font-weight: 600; color: var(--text); }
.adv-sub { display: block; font-size: 11px; color: var(--text3); font-style: normal; font-weight: 400; margin-top: 1px; }
/* 归还流水 */
.adv-repays { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.adv-repays .rp { display: flex; align-items: center; gap: 10px; padding: 9px 12px; font-size: 12.5px; border-bottom: 1px solid var(--line); }
.adv-repays .rp:last-child { border-bottom: 0; }
.adv-repays .rp:hover { background: var(--row-hover); }
.adv-repays .rp-d { width: 94px; flex: none; color: var(--text2); font-variant-numeric: tabular-nums; }
.adv-repays .rp-a { width: 92px; flex: none; color: var(--green); font-weight: 700; font-variant-numeric: tabular-nums; }
.adv-repays .rp-b { flex: 1; min-width: 0; color: var(--text3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-quick { display: flex; gap: 6px; margin-top: 6px; }
/* 常用事由快捷标签 */
.adv-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.adv-chip {
  font-size: 11.5px; padding: 3px 9px; border-radius: 20px; cursor: pointer;
  background: var(--chip-bg); border: 1px solid var(--line2); color: var(--text2); transition: all .15s;
}
.adv-chip:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); }
.adv-chip-empty { font-size: 11.5px; color: var(--text3); }
.pick-tip { font-size: 11.5px; color: var(--text3); margin-top: 5px; }
/* 工伤明细表 */
.ij-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 18px; border-top: 1px solid var(--line); padding-top: 2px; }
.ij-row { display: flex; gap: 10px; font-size: 12.5px; padding: 7px 0; border-bottom: 1px dashed var(--line); }
.ij-row .k { width: 86px; flex: none; color: var(--text3); }
.ij-row .v { flex: 1; min-width: 0; color: var(--text); word-break: break-word; }
/* 统计分析条形 */
.stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.stat-card { padding: 14px 16px; }
.stat-card.span2 { grid-column: span 2; }
.stat-card .sc-h { font-size: 12.5px; font-weight: 700; color: var(--text2); margin-bottom: 11px; }
/* 统计分析条形：标签 | 进度条 | 主数值 | 补充说明（四列定宽，行与行之间严格对齐，不再参差） */
.stat-bars { display: flex; flex-direction: column; gap: 1px; }
.stat-bars .sb {
  display: flex; align-items: center; gap: 10px; font-size: 12px;
  padding: 4px 6px; border-radius: 7px; min-height: 25px; transition: background .15s ease;
}
.stat-bars .sb:hover { background: var(--row-hover); }
.stat-bars .sb.clk { cursor: pointer; }
.stat-bars .sb.clk:hover .sb-v { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.stat-bars .sb-l {
  width: 112px; flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--text2); display: flex; align-items: center; gap: 6px;
}
.stat-bars .sb-t { flex: 1; height: 8px; border-radius: 4px; background: var(--subtle-bg2); overflow: hidden; min-width: 34px; }
.stat-bars .sb-t > i { display: block; height: 100%; border-radius: 4px; transition: width .35s; }
.stat-bars .sb-v {
  width: 66px; flex: none; text-align: right; color: var(--text); font-weight: 700;
  font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden;
}
.stat-bars .sb-v .u { font-style: normal; font-size: 11px; font-weight: 400; color: var(--text3); margin-left: 2px; }
.stat-bars .sb-x {
  width: 112px; flex: none; text-align: right; color: var(--text3); font-size: 11.5px;
  font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* 窄卡 / 单列里的统计条：压缩标签与补充说明，给进度条让出空间 */
.stat-bars.narrow .sb-l { width: 84px; }
.stat-bars.narrow .sb-x { width: 78px; }
.stat-bars.narrow .sb-v { width: 54px; }
/* 统计卡片本身的轻微悬浮（面板类，不做位移以免影响拖动） */
.stat-card { transition: box-shadow .2s ease, border-color .2s ease; }
.stat-card:hover { box-shadow: 0 8px 22px rgba(15, 23, 42, .10); border-color: var(--line2); }
/* 表格内联尺码下拉（工衣发放登记） */
.dt .u-size-sel {
  height: 28px; font-size: 12px; padding: 0 6px; border-radius: 6px;
  border: 1px solid var(--line2); background: var(--input-bg); color: var(--text); cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.dt .u-size-sel:hover { border-color: var(--primary); }
.dt .u-size-sel:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(61, 109, 245, .16); }
.dt .u-size-sel.u-size-flash { animation: sizeFlash .8s ease; }
@keyframes sizeFlash {
  0% { box-shadow: 0 0 0 0 rgba(0, 181, 120, .55); }
  60% { box-shadow: 0 0 0 6px rgba(0, 181, 120, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 181, 120, 0); }
}
@media (max-width: 900px) {
  .stat-grid { grid-template-columns: 1fr; }
  .stat-card.span2 { grid-column: span 1; }
  .ij-grid { grid-template-columns: 1fr; }
  .adv-sum { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .adv-sum b { font-size: 14px; }
}

/* ==================== 通用列配置（ColCfg）：任意表格的列可改名 / 换位 / 调宽 / 显隐 ==================== */
table.dt thead th.ccol { cursor: grab; user-select: none; }
table.dt thead th.ccol:active { cursor: grabbing; }
table.dt thead th.ccol.locked { cursor: default; }
table.dt thead th.ccol.dragging { opacity: .45; }
table.dt thead th.ccol.drop-col { background: var(--th-hover); box-shadow: inset 2px 0 0 var(--primary), inset -2px 0 0 var(--primary); }
table.dt thead th.ccol .th-lbl { padding-right: 7px; }
table.dt thead th.ccol input.cname {
  width: 100%; height: 24px; padding: 0 7px; border: 1px solid var(--primary); border-radius: 6px;
  background: var(--card); color: var(--text); font: inherit; font-weight: 600; outline: none;
  box-shadow: 0 0 0 3px rgba(61, 109, 245, .14);
}
.ccol-panel {
  position: fixed; z-index: 320; width: 336px; display: flex; flex-direction: column;
  background: var(--card); border: 1px solid var(--line2); border-radius: 12px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, .24); overflow: hidden;
}
.ccol-panel .cp-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px 8px; font-size: 12.5px; font-weight: 700; color: var(--text); }
.ccol-panel .cp-x { border: none; background: none; color: var(--text3); cursor: pointer; font-size: 13px; padding: 2px 5px; border-radius: 6px; }
.ccol-panel .cp-x:hover { background: var(--subtle-bg2); color: var(--text); }
.ccol-panel .cp-tip { font-size: 10.5px; color: var(--text3); padding: 0 12px 8px; line-height: 1.6; }
.ccol-panel .cp-tip b { color: var(--primary); }
.ccol-panel .cp-sec { display: flex; align-items: baseline; gap: 6px; padding: 7px 12px 5px; border-top: 1px solid var(--line); font-size: 11px; font-weight: 700; color: var(--text2); }
.ccol-panel .cp-sub { font-weight: 400; color: var(--text3); }
.ccol-panel .cp-list { max-height: 300px; overflow-y: auto; padding: 0 6px 6px; }
.ccol-panel .cp-row { display: flex; align-items: center; gap: 6px; padding: 5px 6px; border-radius: 7px; border: 1px solid transparent; font-size: 12.5px; }
.ccol-panel .cp-row:hover { background: var(--primary-bg); }
.ccol-panel .cp-row.dragging { opacity: .45; }
.ccol-panel .cp-row.drop { border-color: var(--primary); box-shadow: inset 2px 0 0 var(--primary); }
.ccol-panel .cp-grip { cursor: grab; color: var(--dash); user-select: none; font-size: 12px; }
.ccol-panel .cp-grip.lock { cursor: default; font-size: 11px; }
.ccol-panel .cp-row input[type=checkbox] { cursor: pointer; }
.ccol-panel .cp-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ccol-panel .cp-w { font-size: 10.5px; color: var(--text3); }
.ccol-panel .cp-ib { width: 18px; height: 18px; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; color: var(--text3); font-size: 11.5px; cursor: pointer; flex: none; }
.ccol-panel .cp-ib:hover { background: var(--primary); color: #fff; }
.ccol-panel .cp-ib.del:hover { background: var(--red); }
.ccol-panel input.cpn { flex: 1; min-width: 60px; height: 22px; padding: 0 6px; border: 1px solid var(--primary); border-radius: 6px; background: var(--input-bg); color: var(--text); font: inherit; outline: none; }
.ccol-panel .cp-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 12px 9px; max-height: 140px; overflow-y: auto; }
.ccol-panel .cp-chip { font-size: 11.5px; padding: 4px 9px; border-radius: 999px; cursor: pointer; border: 1px dashed var(--line2); color: var(--text2); background: transparent; transition: all .15s; }
.ccol-panel .cp-chip:hover { border-style: solid; border-color: var(--primary); color: var(--primary); background: var(--primary-bg); }
.ccol-panel .cp-foot { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-top: 1px solid var(--line); background: var(--th-bg); }
.ccol-panel .btn[disabled] { opacity: .45; cursor: not-allowed; }
.ccol-panel .cp-save { font-size: 10.5px; color: var(--text3); white-space: nowrap; }
/* 「⚏ 列设置」按钮上的小圆点：该表列已自定义过 */
.cc-dot { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--primary); margin-left: 5px; vertical-align: 1px; }
@media (max-width: 900px) { .ccol-panel { width: min(340px, calc(100vw - 24px)); } }

/* ==================== 日常记录管理（待办提醒卡片 / 处理记录） ==================== */
.dl-grp { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; color: var(--text2); margin: 16px 0 9px; }
.dl-grp:first-child { margin-top: 2px; }
.dl-gcnt { font-size: 11px; font-weight: 600; color: var(--text3); background: var(--subtle-bg2); border-radius: 999px; padding: 1px 8px; }
.dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(306px, 1fr)); gap: 12px; }
.dl-card {
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--line2);
  border-radius: 12px; padding: 12px 14px; box-shadow: var(--shadow);
  transition: box-shadow .18s, transform .18s;
}
.dl-card:hover { box-shadow: 0 4px 18px rgba(15, 23, 42, .10); transform: translateY(-1px); }
[data-theme="dark"] .dl-card:hover { box-shadow: 0 4px 18px rgba(0, 0, 0, .5); }
.dl-card.ov { border-left-color: var(--red); }
.dl-card.today { border-left-color: var(--orange); }
.dl-card.soon { border-left-color: var(--gold); }
.dl-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.dl-amt { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.dl-title { font-size: 13.5px; font-weight: 600; color: var(--text); margin: 8px 0 7px; line-height: 1.45; word-break: break-word; }
.dl-meta { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; font-size: 11.5px; color: var(--text3); }
.dl-note { margin-top: 8px; font-size: 11.5px; color: var(--text2); background: var(--subtle-bg); border-radius: 8px; padding: 6px 9px; line-height: 1.5; }
/* 处理痕迹提示行：已记几步 + 最近一次处理摘要 */
.dl-lg { margin-top: 8px; font-size: 11.5px; color: var(--text3); background: var(--subtle-bg2); border-radius: 8px; padding: 5px 9px; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-lg b { color: var(--primary); font-weight: 700; }
.dl-act { display: flex; gap: 4px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--line); flex-wrap: wrap; }
.dl-logsec { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
.dl-loghead { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 700; color: var(--text2); margin-bottom: 8px; }
.dl-logs { max-height: 230px; overflow-y: auto; }
.dl-logrow { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.dl-logrow .dl-lgd { width: 132px; flex: none; height: 30px; padding: 0 8px; border: 1px solid var(--line2); border-radius: 7px; background: var(--input-bg); color: var(--text); outline: none; font-size: 12.5px; }
.dl-logrow .dl-lgn { flex: 1; min-width: 90px; height: 30px; padding: 0 9px; border: 1px solid var(--line2); border-radius: 7px; background: var(--input-bg); color: var(--text); outline: none; font-size: 12.5px; }
.dl-logrow .dl-lgd:focus, .dl-logrow .dl-lgn:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(61, 109, 245, .14); }
.dl-logempty { font-size: 11.5px; color: var(--text3); padding: 6px 2px; }
.dl-hist { font-size: 12px; color: var(--text2); padding: 6px 2px; border-bottom: 1px dashed var(--line); line-height: 1.5; }
.dl-hist b { color: var(--text3); font-weight: 600; margin-right: 6px; }
@media (max-width: 900px) { .dl-grid { grid-template-columns: 1fr; } }

/* ===== 系统设置 · 运行概览 + 分区布局 ===== */
.sys-ov { padding: 15px 18px 16px; margin-bottom: 14px; }
.sys-ov-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 13px; }
.sys-ov-title { font-size: 15px; font-weight: 800; display: inline-flex; align-items: center; gap: 7px; }
.sys-live { font-size: 11px; color: var(--green); background: var(--green-bg); padding: 2px 9px; border-radius: 99px; display: inline-flex; align-items: center; gap: 5px; }
.sys-live i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); animation: sysPulse 1.6s ease-in-out infinite; }
@keyframes sysPulse { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }
.sys-badge { font-size: 11.5px; padding: 3px 10px; border-radius: 99px; background: var(--subtle-bg); color: var(--text2); border: 1px solid var(--line); }
.sys-badge.on { color: var(--green); background: var(--green-bg); border-color: transparent; }
.sys-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.sys-chip { font-size: 12px; padding: 4px 10px; border-radius: 8px; border: 1px solid var(--line); background: var(--subtle-bg); color: var(--text2); cursor: pointer; user-select: none; }
.sys-chip:hover { color: var(--primary); border-color: var(--primary); background: var(--card); }
.sys-ov-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.sys-cell { background: var(--subtle-bg); border: 1px solid var(--line); border-radius: 10px; padding: 11px 14px; min-width: 0; }
.sys-cell .k { font-size: 11.5px; color: var(--text3); margin-bottom: 5px; }
.sys-cell .v { font-size: 21px; font-weight: 800; letter-spacing: .3px; line-height: 28px; }
.sys-cell .v.v-sm { font-size: 15px; line-height: 28px; }
.sys-cell .v .u { font-size: 12px; font-weight: 500; color: var(--text3); margin-left: 2px; }
.sys-cell .s { font-size: 11.5px; color: var(--text3); margin-top: 3px; line-height: 1.55; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sys-cell .s b { color: var(--text2); font-weight: 600; }
/* 分区标题 */
.set-sec { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 2px 2px 0; border-radius: 8px; }
.set-sec:first-child { margin-top: 0; }
.set-sec.ss-flash { animation: ssFlash 1.2s ease-out; }
@keyframes ssFlash { 0% { background: var(--green-bg); } 100% { background: transparent; } }
.set-sec .ss-ico { width: 30px; height: 30px; border-radius: 8px; background: var(--subtle-bg); display: flex; align-items: center; justify-content: center; font-size: 15px; border: 1px solid var(--line); flex: none; }
.set-sec .ss-t b { font-size: 13.5px; display: block; line-height: 1.25; }
.set-sec .ss-t span { font-size: 11.5px; color: var(--text3); }
.set-sec .ss-top { font-size: 11.5px; color: var(--text3); cursor: pointer; user-select: none; }
.set-sec .ss-top:hover { color: var(--primary); }
@media (max-width: 1100px) { .sys-ov-grid { grid-template-columns: 1fr 1fr; } .sys-chips { margin-left: 0; } }
@media (max-width: 900px) { .sys-ov-grid { grid-template-columns: 1fr 1fr; } }

/* ===== 生日管理（window.Birthday） ===== */
.avatar.sm { width: 18px; height: 18px; font-size: 9.5px; }
/* 汇总条 */
.bd-sum { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line); font-size: 12px; color: var(--text3); }
.bd-sum-i b { font-size: 13.5px; color: var(--text); }
.bd-sum-i.g b { color: var(--green); }
.bd-sum-i.o b { color: var(--orange); }
.bd-sum-i.r b { color: var(--red); }
/* 卡片网格 */
.bd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 12px; }
.bd-card { position: relative; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; cursor: pointer; transition: box-shadow .16s, transform .16s, border-color .16s; }
.bd-card:hover { box-shadow: 0 4px 16px rgba(0, 0, 0, .07); transform: translateY(-1px); }
.bd-card.ov { border-color: var(--red); background: linear-gradient(180deg, var(--red-bg) 0%, transparent 42%); }
.bd-card.today { border-color: var(--orange); background: linear-gradient(180deg, var(--orange-bg, #fff7e6) 0%, transparent 42%); }
.bd-card.soon { border-color: var(--line2, var(--line)); }
.bd-card.done { opacity: .92; background: var(--subtle-bg); }
.bd-ctop { display: flex; align-items: center; gap: 9px; }
.bd-cnm b { font-size: 13.5px; }
.bd-csub { font-size: 11.5px; color: var(--text3); margin-top: 2px; }
.bd-cmid { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; font-size: 12px; color: var(--text2); }
.bd-bdnum { font-variant-numeric: tabular-nums; font-weight: 600; }
.bd-bdnum i { font-style: normal; font-size: 11px; color: var(--text3); margin-left: 3px; }
.bd-cage { color: var(--text3); }
.bd-cnth { font-size: 11.5px; color: var(--text3); }
.bd-cnth b { color: var(--primary); font-size: 13px; }
.bd-csent { margin-top: 9px; font-size: 11.5px; color: var(--text2); background: var(--subtle-bg); border-radius: 8px; padding: 6px 9px; line-height: 1.5; }
.bd-cnote { color: var(--text3); margin-top: 3px; }
.bd-act { display: flex; gap: 4px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--line); flex-wrap: wrap; }
/* 生日日历 */
.bd-cal { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.bd-mcard { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px 8px; }
.bd-mcard.cur { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-bg, rgba(0,0,0,.03)); }
.bd-mhead { display: flex; align-items: center; gap: 7px; padding-bottom: 7px; border-bottom: 1px dashed var(--line); margin-bottom: 6px; }
.bd-mhead b { font-size: 13px; }
.bd-mcnt { font-size: 11px; color: var(--text3); }
.bd-mrow { display: flex; align-items: center; gap: 7px; padding: 5px 6px 5px 8px; border-radius: 7px; font-size: 12px; cursor: pointer; border-left: 3px solid transparent; }
.bd-mrow:hover { background: var(--subtle-bg); }
/* 第 71 轮：逾期未发不再整行铺红底（全年视角下 200 行全红没法看）→ 只用红色左边框示意 */
.bd-mrow.ov { border-left-color: var(--red); }
.bd-mrow.done { background: var(--green-bg); color: var(--text2); border-left-color: var(--green); }
.bd-mdate { font-variant-numeric: tabular-nums; color: var(--text3); font-size: 11.5px; width: 42px; flex: none; }
.bd-mnm { font-weight: 600; }
.bd-mdept { font-size: 11px; color: var(--text3); max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bd-mst { font-size: 11px; color: var(--text2); }
.bd-mrow.ov .bd-mst { color: var(--red); font-weight: 600; }
.bd-mempty { font-size: 11.5px; color: var(--text3); padding: 6px 4px 8px; }
/* 发放弹窗：员工信息条 */
.bd-who { display: flex; align-items: center; gap: 10px; background: var(--subtle-bg); border-radius: 10px; padding: 10px 12px; }
.bd-who b { font-size: 14px; }
.bd-who-s { font-size: 11.5px; color: var(--text3); margin-top: 3px; }
.bd-who-b { font-size: 12.5px; font-weight: 600; }
/* 批量发放 */
.bd-range { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 12px 0 10px; }
.bd-range input[type="date"] { height: 32px; }
.bd-chk { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--text2); cursor: pointer; }
.bd-bhead { display: flex; align-items: center; gap: 8px; padding: 7px 2px; border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line); }
.bd-blist { max-height: 300px; overflow-y: auto; margin-top: 6px; }
.bd-brow { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 8px; font-size: 12.5px; cursor: pointer; border: 1px solid transparent; }
.bd-brow:hover { background: var(--subtle-bg); }
.bd-brow.on { background: var(--primary-bg, var(--subtle-bg)); border-color: var(--primary); }
.bd-brow input { width: 15px; height: 15px; flex: none; }
.bd-bsub { font-size: 11.5px; color: var(--text3); }
.bd-bdate { font-variant-numeric: tabular-nums; color: var(--text2); }
/* 统计：月度双条 */
.bd-mbars { display: flex; flex-direction: column; gap: 7px; }
.bd-mbar { display: flex; align-items: center; gap: 9px; font-size: 11.5px; padding: 2px 5px; border-radius: 6px; transition: background .15s; }
.bd-mbar.clk-num:hover { background: var(--row-hover); }
.bd-mbar.clk-num:hover .bd-mbv { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.bd-mbl { width: 34px; color: var(--text3); flex: none; }
.bd-mtrack { position: relative; flex: 1; height: 12px; background: var(--subtle-bg2, var(--subtle-bg)); border-radius: 6px; overflow: hidden; }
.bd-mtrack i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; display: block; }
.bd-mtrack i.due { background: var(--line2, #d8dbe2); }
.bd-mtrack i.sent { background: var(--green); }
.bd-mbv { width: 92px; text-align: right; color: var(--text3); font-variant-numeric: tabular-nums; flex: none; }
@media (max-width: 1100px) { .bd-cal { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .bd-grid { grid-template-columns: 1fr; } .bd-cal { grid-template-columns: 1fr; } }

/* ================= 排除规则（生日 / 工衣 / 饭卡） ================= */
/* 宽浮窗：与「员工明细浮窗」同款（可拖边框 / 尺寸预设 / 记忆） */
/* 规则列表 · 应用模块筛选 pills */
.excl-fmods { display: inline-flex; gap: 4px; flex: none; }
.excl-fpill {
  display: inline-flex; align-items: center; gap: 3px; padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--line2); background: var(--input-bg); color: var(--text2);
  font-size: 12px; cursor: pointer; user-select: none; white-space: nowrap; transition: all .12s;
}
.excl-fpill:hover { border-color: var(--primary); color: var(--primary); }
.excl-fpill.on { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); font-weight: 600; }
/* 第 54 轮：浮窗改为「真实高度」模型——拖下边框直接改窗口高度（flex 拉伸滚动区），
   内容不满时拖动也始终跟手；分页器控件宽度不被 .f-item 的 width:100% 拉伸 */
/* 专属遮罩：上下只留 24px、垂直居中、不出滚动条——浮窗永远完整落在视口内 */
.mask.exclmask { align-items: center; padding: 24px 16px; overflow: hidden; }
.exclbox { position: relative; display: flex; flex-direction: column; margin-bottom: 0; max-height: calc(100vh - 48px); }
.exclbox .m-body { flex: 1 1 auto; min-height: 0; overflow: auto; }
.excl-scroll { flex: 1 1 auto; overflow: auto; padding: 14px 20px; min-height: 120px; }
.excl-tip {
  font-size: 12px; line-height: 1.7; color: var(--text3);
  background: var(--subtle-bg); border-left: 3px solid var(--primary);
  border-radius: 8px; padding: 9px 12px; margin-bottom: 12px;
}
.excl-tip b { color: var(--text2); font-weight: 600; }
.excl-dim { color: var(--text3); font-size: 12px; }
.excl-lbhint { display: block; font-size: 11.5px; color: var(--text3); margin-top: 5px; line-height: 1.55; }
label .excl-lbhint { display: inline; margin: 0 0 0 6px; font-weight: 400; }

/* 顶部统计：🎂 6 人 · 👕 2 人 */
.excl-sum { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-left: 4px; }
.excl-sum-i {
  font-size: 12px; color: var(--text2); padding: 3px 9px; border-radius: 999px;
  background: var(--subtle-bg); cursor: pointer; transition: all .15s; white-space: nowrap;
}
.excl-sum-i b { color: var(--primary); font-variant-numeric: tabular-nums; }
.excl-sum-i:hover { background: var(--primary-bg); color: var(--primary); }

/* 规则卡 */
.excl-rule {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px;
  padding: 11px 12px; margin-bottom: 8px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--card); transition: border-color .15s, box-shadow .15s;
}
.excl-rule:last-child { margin-bottom: 0; }
.excl-rule:hover { border-color: var(--line2); box-shadow: 0 2px 10px rgba(29, 33, 41, .06); }
.excl-rule.off { background: var(--subtle-bg); }
.excl-rule.off .excl-cond { color: var(--text3); text-decoration: line-through; text-decoration-thickness: 1px; }
.excl-rule.off .excl-tag { opacity: .5; }
.excl-main { min-width: 0; }
.excl-cond { font-weight: 600; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.excl-sub { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: var(--text3); margin-top: 3px; }
.excl-sub b { color: var(--text2); font-variant-numeric: tabular-nums; }
.excl-dot { color: var(--line2); }
.excl-tag {
  font-size: 11px; padding: 1px 7px; border-radius: 999px;
  background: var(--primary-bg); color: var(--primary); white-space: nowrap;
}
.excl-ops { display: flex; gap: 2px; flex: none; }

/* 启用开关 */
.excl-sw { position: relative; display: inline-block; width: 32px; height: 18px; flex: none; cursor: pointer; }
.excl-sw input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.excl-sw i { position: absolute; inset: 0; border-radius: 999px; background: var(--line2); transition: background .18s; }
.excl-sw i::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .18s;
}
.excl-sw input:checked + i { background: var(--primary); }
.excl-sw input:checked + i::after { transform: translateX(14px); }
.excl-sw input:focus-visible + i { box-shadow: 0 0 0 3px rgba(61, 109, 245, .25); }

/* 应用范围（.f-item label 会把 display 改成 block，这里必须提高特异性） */
.excl-tgts { display: flex; gap: 8px; flex-wrap: wrap; }
.excl-tgts .excl-tgt {
  display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line2);
  border-radius: 999px; padding: 6px 14px; margin: 0; font-size: 13px; line-height: 1.2;
  color: var(--text2); cursor: pointer; user-select: none;
  background: var(--input-bg); transition: all .15s;
}
.excl-tgts .excl-tgt:hover { border-color: var(--primary); color: var(--primary); }
.excl-tgts .excl-tgt.on { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); font-weight: 600; }
.excl-tgts .excl-tgt input { display: none; }
.excl-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.excl-chips .adv-chip { cursor: pointer; opacity: .55; }
.excl-chips .adv-chip.sel { opacity: 1; border-color: var(--primary); color: var(--primary); background: var(--primary-bg); font-weight: 600; }
.excl-addrow { display: flex; gap: 6px; margin-top: 8px; }
.excl-addrow input, .excl-addrow select { flex: 1; min-width: 0; height: 32px; }

/* 员工选择区（搜索 / 表格 / 分页 / 已选） */
.excl-pick { border: 1px solid var(--line2); border-radius: 10px; background: var(--input-bg); padding: 8px 8px 6px; }
.excl-pick-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 0 2px 8px; }
.excl-pick-n { font-size: 12px; color: var(--text3); white-space: nowrap; }
.excl-pick-n b { color: var(--primary); font-variant-numeric: tabular-nums; }

/* 表格化选人列表：与「员工明细浮窗」同款规格（吸顶表头 / 点击排序 / 斑马行 / 整行勾选） */
.excl-pick-tbl { border: 1px solid var(--line); border-radius: 8px; overflow: auto; max-height: 300px; background: var(--card); }
table.excl-dt { border-collapse: separate; border-spacing: 0; width: 100%; table-layout: fixed; font-size: 13px; }
table.excl-dt thead th {
  position: sticky; top: 0; z-index: 3; background: var(--th-bg); color: var(--text2);
  font-size: 12px; font-weight: 600; text-align: left; padding: 7px 9px;
  border-bottom: 1px solid var(--line2); white-space: nowrap; user-select: none;
}
table.excl-dt thead th.sortable { cursor: pointer; }
table.excl-dt thead th.sortable:hover { color: var(--primary); background: var(--th-hover, var(--row-hover)); }
table.excl-dt thead th.sorted { color: var(--primary); }
table.excl-dt thead th .arrow { font-size: 9px; margin-left: 3px; }
table.excl-dt .ck-cell { text-align: center; padding-left: 2px; padding-right: 2px; }
table.excl-dt tbody td {
  padding: 5px 9px; height: 34px; border-bottom: 1px solid var(--line); color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums;
}
table.excl-dt tbody tr:last-child td { border-bottom: none; }
table.excl-dt tbody .excl-emp { cursor: pointer; }
table.excl-dt tbody .excl-emp:hover td { background: var(--row-hover); }
table.excl-dt tbody .excl-emp.on td { background: var(--primary-bg); }
table.excl-dt tbody .excl-emp.on .nm { color: var(--primary); font-weight: 600; }
table.excl-dt .nmwrap { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; }
table.excl-dt .avatar { width: 22px; height: 22px; line-height: 22px; font-size: 11px; flex: none; }
table.excl-dt .nm, table.excl-dt .mono { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
table.excl-dt .mono { color: var(--text2); }

/* 自绘勾选框：16px 圆角方块，与 22px 头像垂直居中 */
.excl-pick input.ck {
  appearance: none; -webkit-appearance: none; width: 16px; height: 16px; margin: 0; padding: 0;
  display: inline-block; vertical-align: middle;
  border: 1.5px solid var(--line2); border-radius: 4px; background: var(--input-bg); align-self: center;
  cursor: pointer; position: relative; flex: none; transition: background .15s, border-color .15s;
}
.excl-pick input.ck:hover { border-color: var(--primary); }
.excl-pick input.ck:checked { background: var(--primary); border-color: var(--primary); }
.excl-pick input.ck:checked::after {
  content: ""; position: absolute; left: 4.4px; top: 1px; width: 4px; height: 7.5px;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(43deg);
}
.excl-pick input.ck:indeterminate { background: var(--primary); border-color: var(--primary); }
.excl-pick input.ck:indeterminate::after {
  content: ""; position: absolute; left: 3px; top: 6px; width: 8px; height: 2px;
  background: #fff; border-radius: 1px;
}
.excl-pick input.ck:focus-visible { box-shadow: 0 0 0 3px rgba(61, 109, 245, .22); }
.excl-nones { padding: 26px 10px; text-align: center; font-size: 12.5px; color: var(--text3); }
.excl-pager .pager {
  position: static; margin: 0; padding: 6px 2px 0; border: none; border-radius: 0;
  box-shadow: none; background: transparent; font-size: 12px;
}
/* .f-item input/select 的 width:100% 会把分页器的每页条数下拉拉成整行宽 → 收回来自适应 */
.excl-pager .pager select, .excl-pager .pager input { width: auto; flex: none; }
.excl-selbar {
  display: flex; align-items: flex-start; gap: 8px; flex-wrap: wrap;
  margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 12px;
}
.excl-selbar-t { color: var(--text3); white-space: nowrap; padding-top: 2px; }
.excl-selbar-t b { color: var(--primary); font-variant-numeric: tabular-nums; }
.excl-selchips { display: flex; flex-wrap: wrap; gap: 5px; max-height: 58px; overflow-y: auto; flex: 1; min-width: 0; }
.excl-pick-chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px;
  background: var(--primary-bg); color: var(--primary); font-size: 11.5px; cursor: pointer; transition: all .15s;
}
.excl-pick-chip i { font-style: normal; font-size: 10px; opacity: .6; }
.excl-pick-chip:hover { background: var(--red-bg); color: var(--red); }
.excl-pick-chip:hover i { opacity: 1; }
.excl-preview {
  margin-top: 4px; padding: 10px 12px; background: var(--subtle-bg);
  border-radius: 8px; font-size: 12.5px; color: var(--text2); line-height: 1.6;
}
.excl-preview b { color: var(--primary); }
@media (max-width: 720px) {
  .excl-rule { grid-template-columns: auto minmax(0, 1fr); }
  .excl-ops { grid-column: span 2; justify-content: flex-end; }
  table.excl-dt thead th:nth-child(5), table.excl-dt tbody td:nth-child(5) { display: none; }
}

/* ============================================================
   玻璃流光质感 2.0（第 67 轮）：光斑背景 + 磨砂卡片 + 流光扫过
   与登录页 / 弹窗 / 侧栏已有玻璃语言统一；纯 CSS、无布局改动
   ============================================================ */
:root {
  /* --card 保持不透明：浮层 / 抽屉 / 冻结列等 20+ 处引用它，半透明会透字。
     玻璃感只给明确选中的元素（--card-glass） */
  --card-glass: rgba(255, 255, 255, .80);
  --glass-line: rgba(255, 255, 255, .66);
  --glass-hi: rgba(255, 255, 255, .75);
}
[data-theme="dark"] {
  --card-glass: rgba(23, 30, 46, .84);
  --glass-line: rgba(255, 255, 255, .08);
  --glass-hi: rgba(255, 255, 255, .07);
}
/* 背景：三团淡彩光斑（亮色）/两团（暗色），透过磨砂卡片形成玻璃感 */
body {
  background:
    radial-gradient(1100px 720px at 88% -12%, rgba(61, 109, 245, .10), transparent 60%),
    radial-gradient(950px 680px at -10% 104%, rgba(0, 181, 120, .09), transparent 55%),
    radial-gradient(760px 520px at 55% 118%, rgba(255, 125, 0, .05), transparent 55%),
    var(--bg);
}
[data-theme="dark"] body {
  background:
    radial-gradient(1100px 720px at 88% -12%, rgba(107, 147, 255, .10), transparent 60%),
    radial-gradient(950px 680px at -10% 104%, rgba(47, 201, 155, .07), transparent 55%),
    var(--bg);
}
/* 侧栏 / 顶栏 / 卡片：磨砂玻璃（背景用 --card-glass，不影响浮层等不透明场景） */
.sidebar, .topbar {
  background: var(--card-glass);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
}
.card, .kpi {
  background: var(--card-glass);
  -webkit-backdrop-filter: blur(12px) saturate(1.35);
  backdrop-filter: blur(12px) saturate(1.35);
  border-color: var(--glass-line);
  box-shadow: var(--shadow), inset 0 1px 0 var(--glass-hi);
}
.card {
  transition: box-shadow .25s ease, border-color .25s ease;
}
.card:hover {
  border-color: var(--line2);
  box-shadow: 0 10px 30px rgba(30, 60, 120, .12), inset 0 1px 0 var(--glass-hi);
}
[data-theme="dark"] .card:hover {
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45), inset 0 1px 0 var(--glass-hi);
}
/* KPI：hover 一道柔光缓缓扫过（与侧栏同语言）；图标加柔光晕 */
.kpi::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 24%, var(--sheen) 50%, transparent 76%);
  transform: translateX(-135%);
  transition: transform 1.05s cubic-bezier(.25, .8, .35, 1);
}
.kpi:hover::after { transform: translateX(135%); }
.kpi .k-ico {
  box-shadow: 0 4px 12px rgba(15, 23, 42, .10), inset 0 1px 0 rgba(255, 255, 255, .55);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
/* 主按钮：渐变底 + hover 流光扫过 */
.btn.primary {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-deep) 100%);
  box-shadow: 0 2px 8px rgba(61, 109, 245, .28), inset 0 1px 0 rgba(255, 255, 255, .28);
  position: relative; overflow: hidden;
}
.btn.primary:hover { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-deep) 100%); filter: brightness(1.06); }
.btn.primary::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .35) 50%, transparent 70%);
  transform: translateX(-140%);
  transition: transform .9s cubic-bezier(.25, .8, .35, 1);
}
.btn.primary:hover::after { transform: translateX(140%); }
/* 冻结列保持不透明（--card 未动，天然安全；显式声明防止后续改动破坏） */
table.dt .freeze { background: var(--card); }
table.dt thead th.freeze { background: var(--th-bg); }
table.dt tbody tr:hover td.freeze { background: var(--row-hover); }
/* 低性能设备自动关掉磨砂（保流畅不保玻璃） */
@media (prefers-reduced-transparency: reduce) {
  .card, .kpi, .sidebar, .topbar { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--card); }
  :root { --card-glass: #ffffff; }
  [data-theme="dark"] { --card-glass: #171e2e; }
}

/* ================= 第 68 轮：手动转正操作（表单操作条 + 提醒行内快捷按钮） ================= */
/* 员工表单「合同状态」下方的操作条 */
.prob-ops { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.prob-state { font-size: 11.5px; font-weight: 600; color: var(--orange); background: var(--orange-bg); border-radius: 20px; padding: 1px 9px; }
.prob-state.ok { color: var(--green); background: var(--green-bg); }
.prob-due { font-size: 11.5px; color: var(--text3); }
.pob { border: 1px solid var(--line2); background: var(--card); color: var(--text); border-radius: 8px; padding: 3px 10px; font-size: 12px; cursor: pointer; transition: all .18s; }
.pob:hover { border-color: var(--primary); color: var(--primary); }
.pob.ok { background: var(--primary); border-color: var(--primary); color: #fff; }
.pob.ok:hover { background: var(--primary-deep); color: #fff; }
.pob.warn { background: var(--orange-bg); border-color: var(--orange); color: var(--orange); }
.pob.warn:hover { filter: brightness(.95); }
/* 到期提醒行内快捷按钮（试用期转正组） */
.pq-ops { display: flex; gap: 5px; flex: none; margin-left: 6px; }
.pq-btn { border: 1px solid var(--line2); background: var(--card); color: var(--text2); border-radius: 7px; padding: 2px 9px; font-size: 11.5px; cursor: pointer; transition: all .18s; white-space: nowrap; }
.pq-btn:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-1px); }
.pq-btn.ok { background: var(--green); border-color: var(--green); color: #fff; }
.pq-btn.ok:hover { filter: brightness(1.06); }
.pq-btn.warn { background: var(--orange-bg); border-color: var(--orange); color: var(--orange); }
.pq-btn.warn:hover { filter: brightness(.96); }

/* ================= 第 69 轮：生日管理优化 ================= */
/* 今日生日卡片：暖色渐变底 + 描边，一眼锁定要祝福的人 */
.bd-card.today { background: linear-gradient(135deg, var(--orange-bg), var(--card-glass) 65%); border-color: var(--orange); box-shadow: 0 2px 10px rgba(255, 125, 0, .12); }
.bd-card.today .bd-bdnum { color: var(--orange); }
/* 日历里今天生日的行 */
.bd-mrow.tdy { background: var(--orange-bg); border-radius: 8px; }
.bd-mrow.tdy .bd-mnm, .bd-mrow.tdy .bd-mst { color: var(--orange); font-weight: 700; }

/* ================= 第 71 轮：生日日历热力导航 ================= */
.bd-heat { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; margin-top: 9px; }
.bd-ht {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  padding: 5px 0 4px; border: 1px solid var(--line2); border-radius: 8px;
  background: var(--card); cursor: pointer; transition: transform .12s, box-shadow .12s;
  font-size: 10.5px; color: var(--text3); line-height: 1.15;
}
.bd-ht b { font-size: 12px; color: var(--text2); }
.bd-ht:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(15, 23, 42, .10); }
.bd-ht.l1 { background: var(--primary-bg); }
.bd-ht.l2 { background: var(--blue-bg); }
.bd-ht.l3 { background: var(--primary); border-color: var(--primary); }
.bd-ht.l3 b, .bd-ht.l3 span { color: #fff; }
.bd-ht.cur { border-color: var(--orange); box-shadow: 0 0 0 2px var(--orange-bg); }
.bd-ht.cur b { color: var(--orange); }
.bd-ht.cur.l3 b { color: #fff; }
/* 热力点击后月卡闪一下，帮助定位 */
@keyframes bdFlash { 0%, 100% { box-shadow: none; } 30% { box-shadow: 0 0 0 3px var(--primary-bg), 0 0 18px rgba(61, 109, 245, .35); } }
.bd-mcard.flash { animation: bdFlash 1.1s ease; }
.bd-ht.on { outline: 2px solid var(--primary); outline-offset: 1px; }

/* ================= 第 72 轮：生日日历 · 底部月份跳转条 ================= */
/* 卡片改成自适应多列：原来固定 3 列，人多时要滚很久 */
.bd-cal { grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); padding-bottom: 58px; }
@media (max-width: 1100px) { .bd-cal { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); } }
@media (max-width: 900px) { .bd-cal { grid-template-columns: 1fr; } }
.bd-mcard.empty { opacity: .72; }
.bd-mcard.empty .bd-mhead { border-bottom: none; padding-bottom: 2px; margin-bottom: 2px; }
.bd-mtodo { font-size: 10.5px; color: var(--orange); background: var(--orange-bg); border-radius: 20px; padding: 1px 7px; }
.bd-mlate { font-size: 10.5px; color: var(--red); background: var(--red-bg); border-radius: 20px; padding: 1px 7px; }

/* 常驻浮窗：不管滚到哪，12 个月随手一点就到 */
.bd-jump {
  position: fixed; bottom: 14px; left: 240px; right: 20px;
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px; border-radius: 14px;
  background: var(--card-glass, var(--card));
  border: 1px solid var(--line2);
  box-shadow: 0 8px 26px rgba(15, 23, 42, .16);
  backdrop-filter: blur(12px) saturate(1.3);
  -webkit-backdrop-filter: blur(12px) saturate(1.3);
  z-index: 60;
}
.bdj-lbl { font-size: 11.5px; color: var(--text3); white-space: nowrap; }
.bdj-months { flex: 1; display: flex; gap: 4px; min-width: 0; overflow-x: auto; padding: 1px; }
.bdj-months::-webkit-scrollbar { height: 0; }
.bd-jm {
  flex: 1 1 0; min-width: 34px;
  display: flex; flex-direction: column; align-items: center; gap: 0;
  padding: 3px 0 2px; border: 1px solid var(--line2); border-radius: 8px;
  background: var(--card); color: var(--text3); cursor: pointer;
  transition: transform .12s, box-shadow .12s, border-color .12s;
  line-height: 1.1;
}
.bd-jm b { font-size: 12px; color: var(--text2); font-weight: 600; }
.bd-jm i { font-size: 9.5px; font-style: normal; color: var(--text3); }
.bd-jm:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(15, 23, 42, .12); border-color: var(--primary); }
.bd-jm:hover b { color: var(--primary); }
.bd-jm.cur { border-color: var(--orange); background: var(--orange-bg); }
.bd-jm.cur b { color: var(--orange); }
.bd-jm.todo i { color: var(--orange); font-weight: 700; }
.bd-jm.late::after { content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--red); margin-top: -1px; }
.bd-jm.on { background: var(--primary); border-color: var(--primary); box-shadow: 0 3px 10px rgba(61, 109, 245, .35); }
.bd-jm.on b, .bd-jm.on i { color: #fff; }
.bdj-btn {
  flex: none; height: 30px; padding: 0 10px; border-radius: 9px;
  border: 1px solid var(--line2); background: var(--card); color: var(--text2);
  font-size: 12px; cursor: pointer; white-space: nowrap; transition: all .15s;
}
.bdj-btn:hover { border-color: var(--primary); color: var(--primary); }
@media (max-width: 900px) {
  .bd-jump { left: 8px !important; right: 8px; width: auto !important; bottom: 8px; }
  .bdj-lbl { display: none; }
  .bdj-btn { padding: 0 7px; }
}

/* ================= 第 70 轮：日常记录 · 行式待办清单 + 快速记一笔 ================= */
/* 快速记录条：一条输入框 + 类别 + 日期 + 记下，回车即存 */
.dl-quick {
  display: flex; align-items: center; gap: 8px; padding: 9px 12px; margin-bottom: 12px;
  border-radius: 12px; border: 1px solid var(--line2);
  background: linear-gradient(135deg, var(--primary-bg), var(--card-glass) 70%);
  box-shadow: inset 0 1px 0 var(--glass-hi);
}
.dl-quick .dlq-ico { font-size: 17px; filter: drop-shadow(0 1px 4px rgba(61,109,245,.35)); }
.dl-quick input#dlqTitle { flex: 1; min-width: 0; height: 34px; border: 1px solid var(--line2); border-radius: 9px; padding: 0 11px; font-size: 13px; background: var(--card); color: var(--text); }
.dl-quick input#dlqTitle:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-bg); outline: none; }
.dl-quick select, .dl-quick input[type="date"] { height: 34px; border: 1px solid var(--line2); border-radius: 9px; padding: 0 8px; font-size: 12.5px; background: var(--card); color: var(--text); }

/* 行式清单：一行一件事 */
.dl-rows { display: flex; flex-direction: column; gap: 6px; }
.dl-row {
  display: flex; align-items: center; gap: 12px; padding: 9px 12px;
  border: 1px solid var(--line2); border-left: 3px solid transparent; border-radius: 10px;
  background: var(--card); cursor: pointer; transition: transform .15s, box-shadow .15s, border-color .15s;
}
.dl-row:hover { box-shadow: 0 4px 16px rgba(15, 23, 42, .09); transform: translateX(2px); border-color: var(--line2); }
.dl-row.ov { border-left-color: var(--red); background: linear-gradient(90deg, var(--red-bg), var(--card) 42%); }
.dl-row.tdy { border-left-color: var(--orange); background: linear-gradient(90deg, var(--orange-bg), var(--card) 42%); }
.dl-row.soon { border-left-color: var(--gold); }
.dlr-due { display: flex; flex-direction: column; align-items: center; gap: 3px; width: 74px; flex: none; }
.dlr-due b { font-size: 13.5px; font-variant-numeric: tabular-nums; color: var(--text); }
.dlr-main { flex: 1; min-width: 0; }
.dlr-t { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--text); line-height: 1.45; }
.dlr-t b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dlr-fire { font-size: 12px; flex: none; }
.dlr-fire.imp { filter: saturate(.9); }
.dlr-s { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 3px; font-size: 11.5px; color: var(--text3); }
.dlr-lg { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dlr-amt { flex: none; font-size: 13.5px; font-weight: 700; font-variant-numeric: tabular-nums; padding-right: 2px; }
.dlr-act { display: flex; align-items: center; gap: 2px; flex: none; opacity: .55; transition: opacity .15s; }
.dl-row:hover .dlr-act { opacity: 1; }
@media (max-width: 900px) {
  .dlr-amt { display: none; }
  .dlr-due { width: 58px; }
  .dl-quick { flex-wrap: wrap; }
}

/* ---------- 台账：金额小计条 ---------- */
.dl-sum {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  font-size: 12px; color: var(--text3); font-variant-numeric: tabular-nums;
  padding: 5px 12px; border-radius: 9px; background: var(--primary-bg);
  border: 1px solid var(--line2);
}
.dl-sum b { color: var(--text); font-size: 12.5px; }
.dl-sum .sep { color: var(--line2); }
.dl-rng { height: 28px; padding: 0 9px; font-size: 12px; }

/* ---------- 统计：进度漏斗 + 逾期账龄 ---------- */
.dl-fun { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; font-size: 12.5px; cursor: pointer; }
.dl-fun:hover .dlf-k { color: var(--primary); }
.dlf-k { width: 62px; flex: none; color: var(--text2); }
.dlf-bar { flex: 1; height: 16px; border-radius: 8px; background: var(--subtle-bg2); overflow: hidden; }
.dlf-bar i { display: block; height: 100%; border-radius: 8px; background: var(--primary); transition: width .3s ease; min-width: 2px; }
.dlf-bar i.r { background: var(--red); }
.dlf-bar i.o { background: var(--orange); }
.dlf-bar i.gold { background: var(--gold); }
.dlf-bar i.g { background: var(--green); }
.dlf-bar i.b { background: var(--blue); }
.dlf-bar i.gray { background: var(--text3); }
.dl-fun b { width: 38px; text-align: right; flex: none; color: var(--text); font-variant-numeric: tabular-nums; }
.dlf-p { width: 40px; flex: none; color: var(--text3); font-size: 11.5px; }
.dl-fun-note { margin-top: 8px; font-size: 11.5px; color: var(--text3); }

/* ---------- 统计：卡住最久 / 最近办结 行 ---------- */
.dl-mini {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px; margin-bottom: 6px;
  border-radius: 9px; border: 1px solid var(--line2); background: var(--card);
  font-size: 12.5px; cursor: pointer; transition: border-color .15s, transform .15s;
}
.dl-mini:hover { border-color: var(--primary); transform: translateX(2px); }
.dl-mini .dlm-t { font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 58%; }
.dl-mini .dlm-who { color: var(--text3); font-size: 11.5px; }


/* ================= 通用附件（第 79 轮） ================= */
.att { margin-top: 10px; }
.att-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.att-title { font-size: 12.5px; font-weight: 700; color: var(--text); letter-spacing: .2px; }
.att-title b { color: var(--text3); font-weight: 500; }
.att-hint { font-size: 11.5px; color: var(--text3); }
.att-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)); gap: 10px; }
.att-card {
  position: relative; border: 1px solid var(--line2); border-radius: 10px; background: var(--subtle-bg);
  padding: 6px 6px 7px; cursor: pointer; transition: border-color .15s, transform .12s, box-shadow .15s;
  min-width: 0;
}
.att-card:hover { border-color: var(--primary); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 0, 0, .10); }
.att-th {
  height: 78px; border-radius: 7px; overflow: hidden; background: var(--subtle-bg2);
  display: flex; align-items: center; justify-content: center;
}
.att-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.att-ph { font-size: 11px; color: var(--text3); }
.att-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 56px; border-radius: 6px; font-size: 11px; font-weight: 800;
  color: #fff; letter-spacing: .4px; background: #8a94a6;
  box-shadow: inset 0 -14px 0 rgba(0, 0, 0, .10);
}
.att-ico.k-pdf { background: #e5484d; }
.att-ico.k-doc, .att-ico.k-docx { background: #2b6cf6; }
.att-ico.k-xls, .att-ico.k-xlsx { background: #12a150; }
.att-ico.k-txt { background: #7b8699; }
.att-n {
  margin-top: 6px; font-size: 11.5px; color: var(--text); line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  word-break: break-all;
}
.att-s { margin-top: 2px; font-size: 10.5px; color: var(--text3); }
.att-x {
  position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%;
  border: 1px solid var(--line2); background: var(--card); color: var(--text3);
  font-size: 11px; line-height: 1; cursor: pointer; display: none; align-items: center; justify-content: center;
  padding: 0; box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}
.att-card:hover .att-x { display: inline-flex; }
.att-x:hover { color: #fff; background: var(--red); border-color: var(--red); }
.att-empty {
  border: 1px dashed var(--line2); border-radius: 10px; padding: 14px; text-align: center;
  font-size: 12px; color: var(--text3); background: var(--subtle-bg);
}
.att-drop {
  margin-top: 8px; border: 1px dashed var(--line2); border-radius: 10px; padding: 10px 12px;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 12.5px; font-weight: 600; color: var(--primary); cursor: pointer;
  background: var(--subtle-bg); transition: border-color .15s, background .15s;
}
.att-drop:hover, .att-drop.over { border-color: var(--primary); background: var(--primary-bg); }
.att-drop .att-sub { font-size: 11.5px; font-weight: 400; color: var(--text3); }
.att-prog { margin-top: 6px; font-size: 11.5px; color: var(--orange); }

/* ---------- 附件预览（灯箱 / PDF） ---------- */
#attViewer .att-vw { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
#attViewer .att-vw-mask { position: absolute; inset: 0; background: rgba(8, 12, 20, .86); }
#attViewer .att-vw-win {
  position: relative; width: 92vw; height: 88vh; background: var(--card); border-radius: 12px;
  display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 80px rgba(0, 0, 0, .5);
}
#attViewer .att-vw-bar {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px;
  border-bottom: 1px solid var(--line); background: var(--card); flex: none;
}
#attViewer .att-vw-n {
  font-size: 13px; font-weight: 700; color: var(--text); max-width: 46vw;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#attViewer .att-vw-m { font-size: 11.5px; color: var(--text3); white-space: nowrap; }
#attViewer .att-vw-body {
  flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center;
  background: var(--subtle-bg2); position: relative; overflow: auto;
}
#attViewer .att-vw-body img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
#attViewer .att-vw-body iframe { width: 100%; height: 100%; border: 0; background: #fff; }
#attViewer .att-vw-load, #attViewer .att-vw-na {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  font-size: 13px; color: var(--text2); padding: 20px; text-align: center;
}
#attViewer .att-vw-hint { font-size: 12px; color: var(--text3); }
#attViewer .att-vw-tip { position: absolute; left: 0; right: 0; bottom: 6px; text-align: center; font-size: 11.5px; color: var(--text3); }
#attViewer .att-vw-txt {
  margin: 0; padding: 16px; width: 100%; height: 100%; overflow: auto;
  font: 12.5px/1.7 Consolas, Monaco, monospace; color: var(--text); background: var(--card); white-space: pre-wrap;
}
#attViewer .att-vw-nav {
  position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 62px;
  border: 0; border-radius: 10px; background: rgba(0, 0, 0, .42); color: #fff; font-size: 26px;
  cursor: pointer; line-height: 1; display: flex; align-items: center; justify-content: center;
}
#attViewer .att-vw-nav:hover { background: rgba(0, 0, 0, .62); }
#attViewer .att-vw-nav.prev { left: 12px; }
#attViewer .att-vw-nav.next { right: 12px; }
@media (max-width: 720px) {
  #attViewer .att-vw-win { width: 100vw; height: 100vh; border-radius: 0; }
  .att-grid { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); }
}

/* 附件删除确认（独立于 #modalRoot，避免把正在编辑的弹窗一起清掉） */
#attConfirm .att-cf { position: fixed; inset: 0; z-index: 9998; display: flex; align-items: center; justify-content: center; }
#attConfirm .att-cf-mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .42); }
#attConfirm .att-cf-win {
  position: relative; width: 360px; max-width: calc(100vw - 40px); background: var(--card);
  border-radius: 12px; box-shadow: 0 18px 48px rgba(0, 0, 0, .24); padding: 18px 18px 14px;
}
#attConfirm .att-cf-t { font-size: 14.5px; font-weight: 700; color: var(--text); margin-bottom: 8px; }
#attConfirm .att-cf-b { font-size: 13px; line-height: 1.7; color: var(--text2); word-break: break-all; }
#attConfirm .att-cf-f { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }

/* ---------- 备份 / 恢复进度浮层 ---------- */
#bakBusy { position: fixed; inset: 0; z-index: 9600; display: flex; align-items: center; justify-content: center; background: rgba(15, 23, 42, .34); }
#bakBusy .bb-in {
  width: 380px; max-width: calc(100vw - 40px); background: var(--card); border-radius: 14px;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .26); padding: 20px 20px 16px;
}
#bakBusy .bb-t { font-size: 14.5px; font-weight: 700; color: var(--text); margin-bottom: 12px; }
#bakBusy .bb-bar { height: 7px; border-radius: 999px; background: var(--subtle-bg2); overflow: hidden; }
#bakBusy .bb-bar > i { display: block; height: 100%; width: 0; border-radius: 999px; background: var(--primary); transition: width .18s ease; }
#bakBusy .bb-s { margin-top: 9px; font-size: 11.5px; line-height: 1.6; color: var(--text3); word-break: break-all; }

/* ---------- 恢复预览里的附件提示 ---------- */
.rv-att {
  margin-bottom: 10px; padding: 9px 11px; border-radius: 9px; font-size: 12px; line-height: 1.7;
  border: 1px solid var(--line); background: var(--subtle-bg2); color: var(--text2); word-break: break-word;
}
.rv-att.ok { border-color: rgba(22, 163, 74, .35); background: rgba(22, 163, 74, .07); }
.rv-att.warn { border-color: rgba(234, 88, 12, .35); background: rgba(234, 88, 12, .07); color: var(--text); }
.rv-att code { padding: 1px 4px; border-radius: 4px; background: rgba(15, 23, 42, .07); font-size: 11.5px; }

/* ================= 社保公积金管理（第 82 轮） ================= */
.soc-tip {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 11px 14px; margin-bottom: 14px; border-radius: 10px;
  border: 1px solid rgba(255, 125, 0, .28); background: var(--orange-bg);
  font-size: 12.5px; color: var(--text2);
}
.soc-tip b { color: var(--text); }
.soc-tip.warn { border-color: rgba(245, 63, 63, .26); background: var(--red-bg); }

/* ---- 顶部：在缴人数按单位分布（第 83 轮） ---- */
.soc-dist {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 12px 15px 6px; margin-bottom: 14px;
}
.soc-dist-h { font-size: 12.5px; font-weight: 700; color: var(--text2); margin-bottom: 8px; }
.soc-dist-h > span { font-weight: 400; font-size: 11.5px; color: var(--text3); margin-left: 8px; }
.soc-dist-r { display: flex; align-items: flex-start; gap: 10px; padding: 5px 0 7px; }
.soc-dist-r + .soc-dist-r { border-top: 1px dashed var(--line2); }
.soc-dist-k {
  flex: none; width: 108px; font-size: 12px; color: var(--text2);
  display: flex; align-items: center; gap: 5px; padding-top: 4px;
}
.soc-dist-k > b { font-size: 13.5px; color: var(--text); }
.soc-dist-k.si > b { color: var(--primary); }
.soc-dist-k.hf { }
.soc-dist-k.hf > b { color: var(--green); }
.soc-dc { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; flex: 1; min-width: 0; }
.soc-chip {
  display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 9px;
  border: 1px solid var(--line2); border-radius: 999px; background: var(--subtle-bg);
  font-size: 12px; color: var(--text2); cursor: pointer;
  transition: border-color .15s, background .15s, color .15s;
}
.soc-chip > span { max-width: 128px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-chip > b { font-size: 12.5px; color: var(--text); }
.soc-chip:hover { border-color: var(--primary); background: var(--primary-bg); color: var(--primary); }
.soc-chip:hover > b { color: var(--primary); }
.soc-chip.si > b { color: var(--primary); }
.soc-chip.hf > b { color: var(--green); }
.soc-chip.none { border-style: dashed; color: var(--text3); }
.soc-chip.none > b { color: var(--text3); }
.soc-dc-empty { font-size: 11.5px; color: var(--text3); padding-top: 5px; }
.soc-fchip {
  display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 4px 0 9px;
  border-radius: 999px; background: var(--primary-bg); color: var(--primary); font-size: 11.5px;
}
.soc-fchip > b { cursor: pointer; font-size: 11px; opacity: .7; padding: 0 3px; }
.soc-fchip > b:hover { opacity: 1; }
.soc-bw {
  font-style: normal; font-size: 10px; line-height: 1; padding: 1px 3px; margin-left: 3px;
  border-radius: 3px; vertical-align: 1px;
}
.soc-bw.low { background: var(--orange-bg); color: var(--orange); }
.soc-bw.high { background: var(--blue-bg); color: var(--blue); }

/* ---- 按单位汇总卡片 ---- */
.soc-ugrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 12px; margin-bottom: 14px; }
.soc-ucard { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 15px; }
.soc-uc-h { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.soc-uc-h > b { flex: 1; min-width: 0; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-uc-n { flex: none; font-size: 12px; font-weight: 600; color: var(--primary); background: var(--primary-bg); padding: 2px 8px; border-radius: 999px; }
.soc-clk { cursor: pointer; }
.soc-clk:hover { text-decoration: underline; }
.soc-uc-bar { height: 6px; border-radius: 999px; background: var(--subtle-bg2); overflow: hidden; margin-bottom: 9px; }
.soc-uc-bar > i { display: block; height: 100%; border-radius: 999px; background: var(--primary); }
.soc-uc-r { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--text3); padding: 2.5px 0; }
.soc-uc-r > b { color: var(--text2); font-size: 12.5px; }
.soc-uc-f { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line2); font-size: 11.5px; color: var(--text3); }
.soc-uc-f b { color: var(--text2); }
.soc-note { margin-top: 4px; padding: 14px 16px; font-size: 12px; line-height: 1.95; color: var(--text3); }
.soc-note b { color: var(--text2); }

/* ---- 差异核对 ---- */
.soc-dgrp { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 12px; overflow: hidden; }
.soc-dg-h { display: flex; align-items: center; gap: 10px; padding: 11px 14px; background: var(--th-bg); border-bottom: 1px solid var(--line); font-size: 12.5px; color: var(--text2); }
.soc-dg-h > b { color: var(--text); }
.soc-drow { display: flex; align-items: center; gap: 10px; padding: 7px 14px; font-size: 12.5px; }
.soc-drow:hover { background: var(--row-hover); }
.soc-drow + .soc-drow { border-top: 1px solid var(--line); }
.soc-dw { flex: none; width: 78px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-dd { flex: none; width: 92px; color: var(--text3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-dm { flex: 1; min-width: 0; color: var(--text2); }
.soc-dmore { padding: 8px 14px; font-size: 11.5px; color: var(--orange); background: var(--orange-bg); }

/* ---- 统计（第 83 轮重排） ---- */
.soc-kpi {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px;
  margin-bottom: 14px;
}
.soc-kpi-i {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 13px 15px 12px; display: flex; flex-direction: column; gap: 4px;
  transition: border-color .15s, box-shadow .15s;
}
.soc-kpi-i.clk { cursor: pointer; }
.soc-kpi-i.clk:hover { border-color: var(--primary); box-shadow: 0 6px 18px rgba(15, 23, 42, .07); }
.soc-kpi-k { font-size: 11.5px; color: var(--text3); }
.soc-kpi-v { font-size: 21px; font-weight: 700; line-height: 1.25; color: var(--text); letter-spacing: -.2px; }
.soc-kpi-v > em { font-style: normal; font-size: 12px; font-weight: 500; color: var(--text3); margin-left: 3px; }
.soc-kpi-v.sm { font-size: 16px; }
.soc-kpi-v .up { color: var(--red); }
.soc-kpi-v .down { color: var(--green); }
.soc-kpi-s { font-size: 11.5px; color: var(--text3); }
.soc-kpi-s b { color: var(--text2); }

.soc-sgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.soc-sgrid > .stat-card { margin: 0; }
.soc-sgrid > .soc-span2 { grid-column: span 2; }
.soc-sh { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.soc-sh > b { font-size: 13px; color: var(--text); }
.soc-sh > i { font-style: normal; font-size: 11.5px; color: var(--text3); }
.soc-sh-n {
  flex: none; width: 18px; height: 18px; border-radius: 5px; background: var(--primary-bg);
  color: var(--primary); font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}

.soc-matrix { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-bottom: 12px; }
.soc-mx {
  border: 1px solid var(--line); border-radius: 10px; padding: 9px 10px;
  background: var(--subtle-bg2); cursor: pointer; transition: border-color .15s, transform .15s;
}
.soc-mx:hover { border-color: var(--primary); transform: translateY(-1px); }
.soc-mx-v { font-size: 20px; font-weight: 700; line-height: 1.2; }
.soc-mx-k { font-size: 11px; color: var(--text3); margin-top: 2px; white-space: nowrap; }
.soc-mx.on .soc-mx-v { color: var(--purple); }
.soc-mx.si .soc-mx-v { color: var(--primary); }
.soc-mx.hf .soc-mx-v { color: var(--green); }
.soc-mx.off .soc-mx-v { color: var(--text3); }

/* 100% 堆叠条：结构 / 成本 */
.soc-stack, .soc-stack2 {
  display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: var(--subtle-bg2);
}
.soc-stack > i, .soc-stack2 > i { display: block; height: 100%; }
.soc-stack > i + i, .soc-stack2 > i + i { border-left: 2px solid var(--card); }
.soc-stack .both, .soc-legend i.both { background: var(--purple); }
.soc-stack .si, .soc-legend i.si { background: var(--primary); }
.soc-stack .hf, .soc-legend i.hf { background: var(--green); }
.soc-stack .off, .soc-legend i.off { background: var(--dash); }
.soc-legend { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 9px; font-size: 11.5px; color: var(--text3); }
.soc-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.soc-legend i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.soc-st-note { margin-top: 11px; padding-top: 9px; border-top: 1px dashed var(--line2); font-size: 11.5px; line-height: 1.85; color: var(--text3); }
.soc-st-note b { color: var(--text2); }

.soc-cost { margin-top: 12px; }
.soc-cost-row { display: flex; align-items: center; gap: 10px; padding: 5px 0; }
.soc-cost-k { flex: none; width: 96px; font-size: 12px; color: var(--text2); display: flex; align-items: center; gap: 6px; }
.soc-cost-k > i { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.soc-cost-bar { flex: 1; height: 8px; border-radius: 999px; background: var(--subtle-bg2); overflow: hidden; }
.soc-cost-bar > i { display: block; height: 100%; border-radius: 999px; }
.soc-cost-row > b { flex: none; width: 92px; text-align: right; font-size: 12.5px; }
.soc-cost-p { flex: none; width: 36px; text-align: right; font-size: 11.5px; color: var(--text3); }
.soc-cost2 {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px;
  padding-top: 10px; border-top: 1px dashed var(--line2);
}
.soc-cost2 > div { display: flex; flex-direction: column; gap: 2px; }
.soc-cost2 span { font-size: 11px; color: var(--text3); }
.soc-cost2 b { font-size: 14px; }
.soc-cost-note { margin-top: 10px; font-size: 11.5px; line-height: 1.95; color: var(--text3); }
.soc-cost-note b { color: var(--text2); }

/* 按单位分布（统计页两栏） */
.soc-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.soc-two-c { min-width: 0; }
.soc-two-c + .soc-two-c { border-left: 1px dashed var(--line2); padding-left: 18px; }
.soc-two-h { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--text2); margin-bottom: 9px; }
.soc-two-h > b { font-size: 14px; color: var(--text); }
.soc-two-h > i { font-style: normal; font-size: 11px; color: var(--text3); margin-left: auto; }
.soc-two-h .dot { width: 8px; height: 8px; border-radius: 50%; }
.soc-two-h .dot.si { background: var(--primary); }
.soc-two-h .dot.hf { background: var(--green); }
.soc-bars .sb-l { width: 84px; }
.soc-mini-empty { padding: 18px 0; text-align: center; font-size: 11.5px; color: var(--text3); }

/* 近 12 个月柱状（纯 div，无依赖） */
.soc-trend { display: flex; align-items: flex-end; gap: 6px; height: 132px; padding-top: 4px; }
.soc-tr { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; height: 100%; }
.soc-tr-b { flex: 1; width: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 3px; }
.soc-tr-b > i { width: 46%; max-width: 15px; border-radius: 3px 3px 0 0; transition: height .3s ease; }
.soc-tr-b > i.si { background: var(--primary); }
.soc-tr-b > i.hf { background: var(--green); }
.soc-tr.zero .soc-tr-b > i { background: var(--subtle-bg2); }
.soc-tr-v { height: 15px; font-size: 11px; color: var(--text2); line-height: 15px; }
.soc-tr-x { font-size: 10.5px; color: var(--text3); white-space: nowrap; }
.soc-tr-x > i { font-style: normal; font-size: 9px; opacity: .6; margin-left: 1px; }
.soc-tr:hover .soc-tr-b > i { filter: brightness(1.12); }
.soc-tr:hover .soc-tr-x { color: var(--text2); }
.soc-trend-f {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--line2);
  font-size: 11.5px; color: var(--text3);
}
.soc-trend-f b { color: var(--text2); }
.soc-trend-lg { display: inline-flex; align-items: center; gap: 5px; }
.soc-trend-lg > i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.soc-trend-lg > i.si { background: var(--primary); }
.soc-trend-lg > i.hf { background: var(--green); margin-left: 8px; }

@media (max-width: 1180px) {
  .soc-kpi { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .soc-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .soc-sgrid { grid-template-columns: 1fr; }
  .soc-sgrid > .soc-span2 { grid-column: span 1; }
  .soc-two { grid-template-columns: 1fr; gap: 12px; }
  .soc-two-c + .soc-two-c { border-left: 0; padding-left: 0; border-top: 1px dashed var(--line2); padding-top: 12px; }
  .soc-matrix { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- 表单 ---- */
.soc-modal .m-body { max-height: 74vh; overflow-y: auto; }
.soc-empcard {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-bottom: 12px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--subtle-bg2);
}
.soc-empcard > div { display: flex; flex-direction: column; gap: 2px; }
.soc-empcard > div > b { font-size: 13px; }
.soc-empcard > div > span { font-size: 11.5px; color: var(--text3); }
.soc-sec { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px 4px; margin-bottom: 10px; }
.soc-sec-h { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; font-size: 13px; }
.soc-sec-h > b { font-size: 13px; }
.soc-sec-h .seg { margin-left: auto; height: 28px; }
.soc-sec-h .seg button { padding: 0 12px; font-size: 11.5px; }
.soc-sec-b { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 10px; }
.soc-sec-b.off { opacity: .42; }
.soc-sec-note {
  grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 2px; padding: 5px 8px; border-radius: 7px;
  background: var(--subtle-bg); font-size: 11.5px; color: var(--text3);
}
.soc-sec-note > b { color: var(--text2); }
.soc-sec-note .soc-fill {
  margin-left: auto; border: 1px solid var(--line2); background: var(--card);
  border-radius: 999px; height: 22px; padding: 0 9px; font-size: 11px; color: var(--primary); cursor: pointer;
}
.soc-sec-note .soc-fill:hover { border-color: var(--primary); background: var(--primary-bg); }
.soc-sec-b .f-item { margin-bottom: 8px; }
.soc-sec-b .f-item > label { font-size: 11.5px; color: var(--text3); }
.soc-sec-b .f-item > input { padding: 6px 8px; font-size: 12.5px; }
.soc-duo { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.soc-calc {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-top: 10px; padding: 10px 12px; border-radius: 10px;
  background: var(--primary-bg); font-size: 12px; color: var(--text2);
}
.soc-calc > b { font-size: 12.5px; color: var(--text); }
.soc-calc > b > i { font-style: normal; font-weight: 400; font-size: 11.5px; color: var(--text3); }
.soc-calc-t { margin-left: auto; }
.soc-warn { width: 100%; color: var(--orange); font-size: 11.5px; }

/* ---- 参保设置：单位 / 比例 / 基数上下限 ---- */
.soc-cfg {
  border: 1px solid var(--line); border-radius: 10px; padding: 11px 12px 10px;
  margin-bottom: 12px; background: var(--subtle-bg);
}
.soc-cfg-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 9px; font-size: 12.5px; }
.soc-cfg-h > span { font-size: 11.5px; color: var(--text3); }
.soc-cfg-g { display: grid; gap: 8px; margin-bottom: 8px; }
.soc-cfg-g.c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.soc-cfg-g.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.soc-cfg-g > label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; color: var(--text3); }
.soc-cfg-g input { padding: 6px 8px; font-size: 12.5px; }
.soc-cfg-f { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.soc-cfg-t { font-size: 11px; color: var(--text3); line-height: 1.6; }

.soc-uh { font-size: 11.5px; line-height: 1.9; color: var(--text3); margin-bottom: 10px; }
.soc-utable { display: flex; flex-direction: column; gap: 6px; }
.soc-ur { display: grid; grid-template-columns: 1.6fr .8fr .8fr .9fr .9fr 48px 60px; gap: 8px; align-items: center; }
.soc-ur > input { padding: 6px 8px; font-size: 12.5px; width: 100%; min-width: 0; }
.soc-uhead { font-size: 11.5px; color: var(--text3); padding: 0 2px; }
.soc-uused { text-align: center; font-size: 12px; color: var(--text3); }
.soc-uempty { padding: 18px; text-align: center; font-size: 12.5px; color: var(--text3); }

@media (max-width: 720px) {
  .soc-sec-b { grid-template-columns: repeat(2, 1fr); }
  .soc-ur { grid-template-columns: 1.4fr .9fr .9fr 44px 56px; }
  .soc-ur > input[data-f="siCom"], .soc-ur > input[data-f="hfCom"] { display: none; }
  .soc-trend { gap: 3px; height: 118px; }
  .soc-tr-x > i { display: none; }
  .soc-cfg-g.c3, .soc-cfg-g.c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .soc-dist-r { flex-direction: column; gap: 6px; }
  .soc-dist-k { width: auto; }
  .soc-kpi { grid-template-columns: 1fr; }
}
/* 弹窗容器获得焦点时不要描边（我们只是用它接管 Enter / Esc） */
.modal:focus, .modal:focus-visible { outline: none; }

/* ================= 就餐管理（第 85 轮） ================= */
/* ---- 月度矩阵（工作台） ---- */
.mr-mwrap { border: 1px solid var(--line); border-radius: 12px; background: var(--card); box-shadow: var(--shadow); max-height: 74vh; overflow: auto; }
.mr-matrix { border-collapse: separate; border-spacing: 0; font-size: 12px; width: 100%; }
.mr-matrix th, .mr-matrix td {
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  padding: 4px 5px; text-align: center; white-space: nowrap;
  background: var(--card); font-variant-numeric: tabular-nums;
}
.mr-matrix th:last-child, .mr-matrix td:last-child { border-right: 0; }
.mr-matrix tbody tr:last-child td { border-bottom: 0; }

/* 表头：上下左右都粘住，滚多远都知道是哪天、哪个部门 */
.mr-matrix thead th {
  position: sticky; top: 0; z-index: 5;
  background: var(--th-bg); font-weight: 600; font-size: 11px;
  padding: 7px 4px; color: var(--text2);
  box-shadow: inset 0 -1px 0 var(--line2);
}
.mr-matrix thead th i { display: block; font-style: normal; font-weight: 400; font-size: 10px; color: var(--text3); margin-top: 1px; }
.mr-matrix thead th.wkend { color: var(--text3); background: var(--subtle-bg); }
.mr-matrix thead th.today { background: var(--primary-bg); color: var(--primary-deep); box-shadow: inset 0 -2px 0 var(--primary); }

/* 左侧部门列 */
.mr-matrix .mr-dept { text-align: left; font-weight: 600; padding: 5px 10px; background: var(--th-bg); position: sticky; left: 0; z-index: 3; }
.mr-matrix thead .mr-dept { z-index: 7; }
.mr-matrix tbody tr[data-deptrow]:hover .mr-dept, .mr-matrix tbody tr[data-deptrow]:hover .mr-cell { background: var(--row-hover); }
.mr-matrix tbody tr[data-deptrow]:hover .mr-cell.odd { background: var(--orange-bg); }
.mr-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 5px; vertical-align: middle; opacity: .8; }
.mr-dname { cursor: pointer; }
.mr-dname:hover { color: var(--primary); }

/* 格子 */
.mr-cell { cursor: pointer; min-width: 42px; }
.mr-cell b { font-weight: 600; color: var(--text); }
.mr-cell i { font-style: normal; color: var(--text3); margin: 0 1px; opacity: .8; }
.mr-cell span { color: var(--text2); }
.mr-cell:hover { background: var(--primary-bg); }
.mr-cell.empty { color: var(--text3); cursor: pointer; }
.mr-cell.empty:hover { background: var(--primary-bg); color: var(--primary); }
.mr-cell.odd { background: var(--orange-bg); }
.mr-cell.odd b, .mr-cell.odd span { color: var(--orange); }
.mr-cell.zero { opacity: .55; }
.mr-cell.today { box-shadow: inset 1px 0 0 var(--primary), inset -1px 0 0 var(--primary); }
.mr-cell.ft, .mr-sum.ft { font-weight: 700; background: var(--subtle-bg2); color: var(--text2); }
.mr-sum { font-weight: 600; min-width: 56px; }
.mr-sum.amt { color: var(--orange); font-weight: 700; cursor: pointer; }
.mr-sum.amt:hover { background: var(--orange-bg); }
.mr-sum.amt.has-adj { background: var(--orange-bg); }
.mr-plus { font-style: normal; font-size: 9px; margin-left: 2px; vertical-align: super; color: var(--orange); }
.mr-unit { font-size: 11.5px; color: var(--text2); min-width: 70px; }
.mr-unit.ft { font-weight: 700; background: var(--subtle-bg2); color: var(--text2); }
.mr-unit.has-adj { color: var(--orange); }
.mr-foot td { background: var(--subtle-bg2); }
.mr-foot .mr-dept { background: var(--subtle-bg2); font-weight: 700; }

/* 右侧固定三列：合计 / 单价 / 金额（偏移量由 bindMatrix 按实测列宽写入 CSS 变量） */
.mr-matrix .fixr { position: sticky; z-index: 4; }
.mr-matrix thead .fixr { z-index: 6; }
.mr-matrix .c-qty { width: 66px; right: var(--mr-qty-r, 178px); border-left: 2px solid var(--line2); }
.mr-matrix .c-unit { width: 78px; right: var(--mr-amt-w, 100px); }
.mr-matrix .c-amt { width: 100px; right: 0; }

/* 拖动排序 */
.mr-drag { font-style: normal; display: inline-block; cursor: grab; color: var(--text3); opacity: .35; margin-right: 6px; font-size: 13px; letter-spacing: -2px; transition: opacity .12s, color .12s; }
.mr-matrix tbody tr[data-deptrow]:hover .mr-drag { opacity: .85; }
.mr-drag:hover { color: var(--primary); opacity: 1; }
.mr-drag:active { cursor: grabbing; }
.mr-matrix tr.dragging td { opacity: .45; }
.mr-matrix tr.dragging .mr-dept { box-shadow: inset 3px 0 0 var(--primary); }
.mr-matrix tr.drop-a td { box-shadow: inset 0 3px 0 var(--primary); }
.mr-matrix tr.drop-b td { box-shadow: inset 0 -3px 0 var(--primary); }
.mr-thsub { font-style: normal; font-weight: 400; font-size: 10px; color: var(--text3); margin-left: 6px; opacity: .9; }

/* 图例（chip 化） */
.mr-legend { display: flex; flex-wrap: wrap; gap: 6px 8px; margin-top: 10px; font-size: 11.5px; line-height: 1.7; color: var(--text3); }
.mr-legend .lg { background: var(--subtle-bg); border: 1px solid var(--line); border-radius: 999px; padding: 3px 11px; }
.mr-legend .lg b { color: var(--text2); font-weight: 600; margin-right: 3px; }
.mr-legend code { background: var(--subtle-bg2); border-radius: 4px; padding: 0 4px; font-size: 11px; font-family: var(--font); }
.mr-legend .odd-demo { background: var(--orange-bg); color: var(--orange); padding: 0 5px; border-radius: 4px; font-style: normal; }

/* 本月额外费用提示条 */
.mr-adjbar { margin-top: 8px; padding: 8px 12px; border-radius: 9px; border: 1px dashed var(--orange); background: var(--orange-bg); color: var(--orange); font-size: 12px; line-height: 1.7; }
.mr-adjtag { font-style: normal; font-size: 9px; vertical-align: super; margin-left: 2px; }
.mr-adjmini { background: var(--orange-bg); color: var(--orange); border: 1px solid var(--orange); border-radius: 999px; padding: 1px 8px; font-size: 11.5px; }

.mr-empty { padding: 28px; text-align: center; color: var(--text3); font-size: 13px; }

/* ---- 部门筛选（下拉多选，矩阵 / 统计共用） ---- */
.mr-dflt { position: relative; display: inline-block; }
.mr-dfltpanel { position: absolute; right: 0; top: calc(100% + 6px); z-index: 80; width: 248px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 14px 36px rgba(29, 33, 41, .18); padding: 10px 12px; text-align: left; }
.mr-dflthd { display: flex; align-items: center; gap: 12px; font-size: 12.5px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.mr-dflthd b { color: var(--text); }
.mr-dflthd i { font-style: normal; font-size: 12px; color: var(--primary); cursor: pointer; }
.mr-dflthd i:hover { text-decoration: underline; }
.mr-dfltlst { max-height: 242px; overflow: auto; padding: 4px 0; }
.mr-dfltlst label { display: flex; align-items: center; gap: 8px; padding: 5px 6px; font-size: 13px; color: var(--text); cursor: pointer; border-radius: 6px; user-select: none; }
.mr-dfltlst label:hover { background: var(--subtle-bg2); }
.mr-dfltlst input[type="checkbox"] { accent-color: var(--primary); width: 15px; height: 15px; cursor: pointer; flex: none; }
.mr-dfltlst span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mr-dfltft { display: flex; gap: 8px; padding-top: 9px; border-top: 1px dashed var(--line); }
.mr-dfltft .btn { flex: 1; }

/* ---- 花名册打印字段（复用 .mr-dfltpanel 面板样式） ---- */
.dm-fltwrap { position: relative; display: inline-block; }
.dm-fltwrap .mr-dfltpanel { width: 268px; }
.dm-flthint { font-size: 11.5px; color: var(--text3); align-self: center; padding-left: 2px; }

/* 筛选生效提示条（统计 / 年度页） */
.mr-fltnote { margin-bottom: 12px; padding: 8px 12px; border-radius: 9px; border: 1px dashed var(--primary); background: var(--subtle-bg); color: var(--text2); font-size: 12px; line-height: 1.7; }
.mr-fltnote b { color: var(--primary); }

/* ---- 今天未报 chips ---- */
.mr-miss { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; font-size: 12.5px; color: var(--text2); }
.mr-misschip { background: var(--red-bg, rgba(220,38,38,.10)); color: var(--red); border: 1px solid var(--red); border-radius: 999px; padding: 2px 10px; font-size: 12px; cursor: pointer; }
.mr-misschip:hover { filter: brightness(1.1); }

/* ---- 统计卡（月度统计页） ---- */
.mr-stat { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-bottom: 12px; }
.mr-scard { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; padding: 13px 16px 13px 19px; background: var(--card); box-shadow: var(--shadow); }
.mr-scard::before { content: ''; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--primary); }
.mr-scard:nth-child(1)::before { background: var(--blue); }
.mr-scard:nth-child(2)::before { background: var(--orange); }
.mr-scard:nth-child(3)::before { background: var(--green); }
.mr-scard:nth-child(4)::before { background: var(--purple); }
.mr-scard .v { font-size: 22px; font-weight: 700; line-height: 1.25; font-variant-numeric: tabular-nums; }
.mr-scard .k { font-size: 11.5px; color: var(--text3); margin-top: 2px; }
.mr-scard .k span { display: block; color: var(--text3); opacity: .85; margin-top: 1px; }

/* ---- 按部门汇总 ---- */
.mr-drows { display: flex; flex-direction: column; gap: 4px; }
.mr-drow { display: flex; align-items: center; gap: 10px; padding: 5px 6px; border-radius: 8px; cursor: pointer; }
.mr-drow:hover { background: var(--subtle-bg2); }
.mr-drow .k { flex: none; width: 110px; font-size: 12.5px; font-weight: 600; }
.mr-drow .bar2 { flex: 1; height: 10px; border-radius: 999px; background: var(--subtle-bg2); overflow: hidden; }
.mr-drow .bar2 > i { display: block; height: 100%; border-radius: 999px; background: var(--primary); }
.mr-drow .n { flex: none; width: 128px; text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; }
.mr-drow .n .sub { color: var(--text3); font-size: 11px; }
.mr-drow .a { flex: none; width: 116px; text-align: right; font-weight: 700; color: var(--orange); font-variant-numeric: tabular-nums; }

/* ---- 每天趋势 ---- */
.mr-trend { display: flex; align-items: flex-end; gap: 2px; height: 150px; padding-top: 8px; }
.mr-tcol { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; min-width: 0; }
.mr-tcol i { display: block; width: 100%; max-width: 22px; border-radius: 3px 3px 0 0; background: var(--primary); opacity: .82; }
.mr-tcol em { font-style: normal; font-size: 9.5px; color: var(--text3); margin-top: 4px; }

/* ---- 第 90 轮：统计重做（部门表格 + ECharts 图表 + 年度统计） ---- */
.mr-chart { height: 300px; }
.mr-chart:empty::after { content: '图表加载中…'; display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text3); font-size: 12px; }
.card h3 .h-sub { margin-left: 8px; font-size: 11px; color: var(--text3); font-weight: 400; }
.mr-depttbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.mr-depttbl th, .mr-depttbl td { padding: 7px 10px; border-bottom: 1px solid var(--line); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mr-depttbl thead th { color: var(--text3); font-weight: 600; font-size: 11.5px; background: var(--subtle-bg2); border-bottom: 1px solid var(--line2); }
.mr-depttbl thead th.l, .mr-depttbl td.l { text-align: left; }
.mr-depttbl tbody tr:hover { background: var(--hover, var(--subtle-bg)); }
.mr-depttbl td .bar { display: inline-block; vertical-align: middle; width: 78%; max-width: 180px; height: 8px; border-radius: 4px; background: var(--subtle-bg2); overflow: hidden; margin-right: 6px; }
.mr-depttbl td .bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--primary), #6a9bff); }
.mr-depttbl td .pct { font-size: 11px; color: var(--text3); }
.mr-depttbl td.sub2, .mr-depttbl .sub2 { color: var(--text3); }
.mr-depttbl td .pos { color: var(--green); font-weight: 600; }
.mr-depttbl td .neg { color: var(--red); font-weight: 600; }
.mr-depttbl tfoot td { font-weight: 700; background: var(--subtle-bg2); border-top: 1px solid var(--line2); border-bottom: 0; }
.mr-depttbl .mr-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 7px; vertical-align: 1px; }
.mr-depttbl .mr-dname { cursor: pointer; font-weight: 600; }
.mr-depttbl .mr-dname:hover { color: var(--primary); text-decoration: underline; }
.mr-depttbl .mr-plus { font-style: normal; color: var(--orange); font-size: 10px; margin-left: 4px; vertical-align: 1px; }
.mr-scard .v-sub { font-style: normal; font-size: 13px; color: var(--text3); font-weight: 500; }
/* 年度统计：部门×月份矩阵横向滚动时首列固定 */
.mr-ydept th:first-child, .mr-ydept td:first-child { position: sticky; left: 0; background: var(--card); z-index: 1; }
.mr-ydept thead th:first-child { background: var(--subtle-bg2); z-index: 2; }
.mr-ydept tfoot td:first-child { background: var(--subtle-bg2); }
/* 年份下拉复用月份胶囊样式 */
select.mr-mcur { height: 30px; padding: 0 8px; border: 0; border-radius: 7px; font-size: 12.5px; color: var(--text); background: var(--card); cursor: pointer; }
select.mr-mcur:focus { outline: 1px solid var(--primary); }

/* ---- 粘贴报餐弹窗 ---- */
.modal.mr-modal { max-width: 780px; }
.mr-modal .m-body { max-height: 66vh; overflow-y: auto; }
.mr-hint { font-size: 12.5px; line-height: 1.9; color: var(--text2); margin-bottom: 8px; }
.mr-hint b { color: var(--text); }
#mrText { width: 100%; resize: vertical; font-size: 12.5px; line-height: 1.7; }
.mr-ptable .pv { width: 100%; min-width: 52px; padding: 3px 6px; font-size: 12px; }
.mr-ptable .pv.num { min-width: 46px; text-align: center; }
.mr-ptable td.raw { font-size: 11px; color: var(--text3); max-width: 240px; }
.mr-ptable tr.bad td { background: var(--red-bg, rgba(220,38,38,.07)); }
.mr-ptable .why { color: var(--red); font-size: 11px; }
.mr-skip { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 12px; color: var(--text2); cursor: pointer; }

/* ---- 编辑弹窗 ---- */
.mr-calc { margin-top: 8px; padding: 8px 10px; border-radius: 8px; background: var(--subtle-bg2); font-size: 12px; color: var(--text2); }
.mr-calc b { color: var(--orange); font-size: 13px; }
.mr-note { margin-top: 8px; font-size: 11.5px; line-height: 1.8; color: var(--text3); }
.mr-note b { color: var(--text2); }

@media (max-width: 720px) {
  .mr-drow .k { width: 84px; }
  .mr-drow .n { width: 96px; }
  .mr-drow .n .sub { display: none; }
  .mr-trend { height: 110px; }
  .mr-tcol em { display: none; }
}

/* ================= 就餐管理 2.0（第 86 轮） ================= */
/* ---- 月份导航（第 89 轮：整组做成胶囊） ---- */
.mr-mnav { display: inline-flex; align-items: center; gap: 2px; position: relative; padding: 2px; border: 1px solid var(--line); border-radius: 9px; background: var(--subtle-bg); }
.mr-mnav .btn { border: 0; background: transparent; box-shadow: none; }
.mr-mnav .btn:hover { background: var(--card); }
.mr-mnav .mr-mcur { min-width: 100px; font-weight: 700; background: var(--card); box-shadow: 0 1px 3px rgba(29, 33, 41, .08); }

/* ---- 矩阵：固定列（第 89 轮已在上方 .c-qty / .c-unit / .c-amt 定义偏移，这里只补细节） ---- */
.mr-matrix .mr-cell.ft { background: var(--subtle-bg2); }
.mr-matrix .mr-cell.zero { color: var(--text3); opacity: .7; }

/* ---- 部门行尾删除 ---- */
.mr-del { font-style: normal; color: var(--text3); font-size: 11px; margin-left: 6px; cursor: pointer; opacity: 0; transition: opacity .12s; }
.mr-matrix tbody tr:hover .mr-del { opacity: 1; }
.mr-del:hover { color: var(--red); }

/* ---- 添加部门行 ---- */
.mr-addrow td { background: var(--subtle-bg2); }
.mr-addrow .mr-dept.add { background: var(--subtle-bg2); }
.mr-addrow input { width: 100%; border: 1px dashed var(--line2); background: transparent; padding: 5px 8px; font-size: 12px; color: var(--text2); border-radius: 6px; }
.mr-addrow input:focus { border-color: var(--primary); outline: none; color: var(--text); background: var(--card); }

/* ---- 格子行内编辑 ---- */
.mr-cell.editing { padding: 1px 2px; background: var(--primary-bg); }
.mr-cell.editing input.ed { width: 34px; min-width: 30px; padding: 2px 3px; font-size: 12px; text-align: center; border: 1px solid var(--primary); border-radius: 4px; background: var(--card); color: var(--text); }
.mr-cell.editing input.ed::placeholder { color: var(--text3); font-size: 10px; }
/* ---- 行金额行内编辑 ---- */
td.mr-sum.editing, td.mr-sum.amt.editing { padding: 2px 4px; background: var(--orange-bg); }
td.mr-sum.editing input.ed.amt { width: 92px; padding: 3px 6px; font-size: 12px; text-align: right; border: 1px solid var(--orange); border-radius: 5px; background: var(--card); color: var(--text); font-variant-numeric: tabular-nums; }

/* ---- 单价设置应用范围 ---- */
.mr-scope { margin-top: 10px; padding: 10px 12px; border-radius: 8px; background: var(--subtle-bg2); display: flex; flex-direction: column; gap: 7px; }
.mr-scope .row { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text2); cursor: pointer; flex-wrap: wrap; }
.mr-scope select { max-width: 150px; }

/* ---- 批量操作（删除）---- */
.mr-bdays-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; font-size: 12.5px; color: var(--text2); }
.mr-bdays-head b { color: var(--text); }
.mr-bdays-ops { display: flex; gap: 2px; }
.mr-bdays { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--subtle-bg2, rgba(127,127,127,.05)); }
.mr-bday { min-width: 34px; height: 28px; padding: 0 6px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--text2); font-size: 12px; cursor: pointer; transition: all .12s; }
.mr-bday:hover { border-color: var(--primary); color: var(--primary); }
.mr-bday.wkend { color: var(--text3); }
.mr-bday.none { opacity: .38; }
.mr-bday.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.mr-bday.on.wkend { color: #fff; }
.mr-bprev { margin-top: 10px; padding: 9px 12px; border-radius: 8px; background: var(--red-bg, rgba(200,50,50,.08)); border: 1px solid var(--red, #c33); display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; }
.mr-bprev .n { color: var(--red, #c33); font-weight: 600; }
.mr-bprev .n b { font-size: 15px; }
.mr-bprev .sub { color: var(--text3); font-size: 11.5px; word-break: break-all; line-height: 1.7; }
.mr-bprev .z { color: var(--text3); font-weight: 600; }

/* ---- 粘贴报餐 · 同部门同日期重复提示 ---- */
.mr-dupbox { margin: 10px 0 2px; padding: 10px 12px; border: 1px solid var(--orange, #d97706); border-radius: 8px; background: var(--orange-bg, rgba(217, 119, 6, .07)); }
.mr-duptitle { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--text); font-weight: 600; }
.mr-duptitle b { color: var(--orange, #d97706); }
.mr-duptools { display: flex; gap: 4px; margin-left: auto; font-weight: 400; }
.mr-dup { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); }
.mr-dup-h { font-size: 12.5px; font-weight: 600; color: var(--text); }
.mr-dup-h .sub { margin-left: 6px; font-size: 11.5px; font-weight: 400; color: var(--text3); }
.mr-dup-rows { display: flex; flex-wrap: wrap; gap: 5px; margin: 5px 0 6px; }
.mr-dup-rows span { font-size: 11.5px; padding: 1px 7px; border-radius: 10px; background: var(--subtle-bg2); color: var(--text2); cursor: help; }
.mr-dup-ops { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 12px; color: var(--text2); }
.mr-dup-ops label { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.mr-dup-ops label:hover { color: var(--text); }
.mr-dup-res { margin-left: auto; font-size: 11.5px; color: var(--text3); }
.mr-dup-res b { color: var(--primary); font-size: 12.5px; }
.mr-ptable tr.dup { background: var(--orange-bg, rgba(217, 119, 6, .06)); }
.mr-ptable tr.dup td.ctr { color: var(--orange, #d97706); }

/* ================= 工资管理（第 98 轮） ================= */
.sa-mnav { display: flex; align-items: center; gap: 4px; }
.sa-mnav .btn { min-width: 0; }
.sa-deptsel { height: 30px; border: 1px solid var(--line2); border-radius: 8px; background: var(--card); color: var(--text); padding: 0 8px; font-size: 12.5px; }
.sa-lock { font-size: 12px; color: var(--red); background: var(--red-bg); border-radius: 6px; padding: 3px 8px; }
.sa-st { font-size: 12px; color: var(--text2); background: var(--subtle-bg2); border-radius: 6px; padding: 3px 8px; }
.sa-seg2 { border: 1px solid var(--line2); border-radius: 8px; overflow: hidden; }
.sa-seg2 button { border: 0; background: var(--card); color: var(--text2); font-size: 12.5px; padding: 5px 10px; cursor: pointer; }
.sa-seg2 button.on { background: var(--primary); color: #fff; }
.sa-wrap { margin-top: 2px; }
.sa-scroll { max-height: calc(100vh - 290px); }
.sa-tip { font-size: 12px; color: var(--text3); margin-top: 10px; line-height: 1.8; }
.sa-empty { text-align: center; color: var(--text3); font-size: 13px; padding: 44px 12px; background: var(--card); border: 1px dashed var(--line2); border-radius: var(--radius); }

/* 考勤网格 */
.sa-tbl { table-layout: fixed; width: auto; min-width: 100%; }
.sa-tbl thead th { font-size: 11px; padding: 4px 2px; position: sticky; top: 0; background: var(--th-bg); z-index: 3; }
.sa-tbl td { height: 26px; padding: 0 2px; border-bottom: 1px solid var(--line); }
.sa-tbl .sa-i, .sa-tbl .sa-nm, .sa-tbl .sa-pos { position: sticky; z-index: 2; background: var(--card); }
.sa-tbl thead .sa-i, .sa-tbl thead .sa-nm, .sa-tbl thead .sa-pos { z-index: 4; background: var(--th-bg); }
.sa-tbl .sa-i { left: 0; width: 34px; text-align: center; color: var(--text3); font-size: 11px; }
.sa-tbl .sa-nm { left: 34px; width: 118px; text-align: left; padding-left: 6px; }
.sa-tbl .sa-nm b { font-size: 12.5px; font-weight: 500; }
/* 姓名旁小字（工号）横排在右侧，不再折行 → 行高更矮（第 104 轮） */
.sa-tbl .sa-nm i { display: inline-block; margin-left: 5px; font-style: normal; font-size: 10px; color: var(--text3); }
.sa-tbl .sa-pos { left: 122px; width: 66px; font-size: 11.5px; color: var(--text2); }
.sa-tbl thead .sa-d { width: 26px; text-align: center; font-weight: 500; color: var(--text2); }
.sa-tbl thead .sa-d.sun { color: var(--red); }
.sa-dm { display: block; margin: 0 auto; border: 0; background: none; padding: 0; font-size: 8px; line-height: 10px; cursor: pointer; opacity: .28; }
.sa-dm:hover { opacity: 1; }
.sa-cell { width: 26px; text-align: center; font-size: 11.5px; cursor: pointer; position: relative; user-select: none; font-variant-numeric: tabular-nums; }
.sa-cell .sa-v { display: block; line-height: 25px; min-height: 25px; }
.sa-cell .sa-moon { position: absolute; right: 0; top: -1px; font-size: 7px; font-style: normal; opacity: 0; transition: opacity .15s; }
.sa-cell:hover .sa-moon { opacity: .5; }
.sa-cell:hover { background: var(--row-hover); }
/* 夜班格 hover：提亮而不是盖灰色——否则白字在浅灰上看不清（第 104 轮修复） */
.sa-cell.nt:hover { background: var(--nt-bg, #1d3f7a); filter: brightness(1.22); }
.sa-cell.sun { background: var(--subtle-bg); }
.sa-cell.rest .sa-v { color: var(--text3); }
.sa-cell.leave .sa-v { color: var(--orange); }
.sa-cell.absent .sa-v { color: var(--red); }
.sa-cell.left .sa-v { color: var(--red); font-weight: 600; }
.sa-cell.borrow .sa-v { color: var(--purple); font-size: 9.5px; }
.sa-cell.nt { background: #dcecff; }
.sa-cell.nt .sa-moon { opacity: 1; }
.sa-cell.nt.sun { background: #d3e4fa; }
.sa-cell.editing { padding: 0; background: var(--primary-bg); }
.sa-in { width: 100%; height: 24px; border: 1px solid var(--primary); border-radius: 3px; text-align: center; font-size: 11.5px; padding: 0; outline: none; background: var(--input-bg); color: var(--text); }
[data-theme="dark"] .sa-cell.nt { background: #1b3358; }
[data-theme="dark"] .sa-cell.nt.sun { background: #1a2f4e; }
.sa-s { width: 46px; text-align: center; font-size: 11.5px; color: var(--text2); font-variant-numeric: tabular-nums; }
.sa-full { font-size: 10px; color: var(--green); background: var(--green-bg); border-radius: 4px; padding: 1px 4px; }
.sa-range { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sa-range input { width: 62px; text-align: center; }
.ck.night-on { background: var(--primary-bg); color: var(--primary); }

/* 计件 */
.sa-pctbl td { font-size: 12px; }
.sa-pctbl .sa-nmw { font-weight: 500; }
.sa-warn { font-size: 9.5px; color: var(--orange); background: var(--orange-bg); border-radius: 4px; padding: 0 3px; }
.sa-pctbl .sa-act { white-space: nowrap; }
.sa-mtbl { table-layout: fixed; }
.sa-mtbl td { padding: 0; height: 30px; }
.sa-mtbl .sa-mc { width: 40px; text-align: center; font-size: 9.5px; border-left: 1px solid var(--line); line-height: 1.25; }
.sa-mtbl .sa-mc b { display: block; font-weight: 500; color: var(--text); }
.sa-mtbl .sa-mc i { font-style: normal; color: var(--text3); font-size: 9px; }
.sa-mtbl .sa-mc.sun { background: var(--subtle-bg); }
.sa-tot td { background: var(--subtle-bg2); font-weight: 600; }
.sa-imp-prev { margin-top: 10px; font-size: 12px; color: var(--text2); }
.sa-imp-sum b { font-size: 14px; color: var(--primary); }
.sa-imp-note { color: var(--text3); margin-top: 4px; }
.sa-imp-warn { color: var(--orange); margin-top: 6px; line-height: 1.7; }

/* 工资表 */
.sa-dtabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.sa-dtab { border: 1px solid var(--line2); background: var(--card); color: var(--text2); border-radius: 16px; padding: 4px 12px; font-size: 12.5px; cursor: pointer; }
.sa-dtab i { font-style: normal; font-size: 10.5px; color: var(--text3); margin-left: 5px; }
.sa-dtab.on { border-color: var(--primary); background: var(--primary-bg); color: var(--primary); font-weight: 500; }
.sa-stbl { table-layout: auto; width: max-content; min-width: 100%; }
table.dt.sa-stbl thead th { text-align: center; }
/* 第 128 轮：表头跟数据对齐 —— 数据格默认居中，左对齐的列（姓名/岗位/备注）表头也左对齐 */
table.dt.sa-stbl thead th.sa-c-name, table.dt.sa-stbl thead th.sa-c-pos, table.dt.sa-stbl thead th.sa-c-note { text-align: left; }
table.dt.sa-stbl thead th.sa-c-name { padding-left: 6px; }
table.dt.sa-stbl td.sa-c-note { text-align: left; }
.sa-stbl td { padding: 2px 3px; font-size: 11.5px; white-space: nowrap; text-align: center; }
.sa-stbl .sa-c-name { text-align: left; padding-left: 6px; }
.sa-stbl .sa-c-name b { font-weight: 500; }
/* 工号小字横排右侧（第 104 轮），行高跟正文一致 */
.sa-stbl .sa-c-name i { display: inline-block; margin-left: 5px; font-style: normal; font-size: 9.5px; color: var(--text3); }
/* 工资表横向冻结：序号 + 姓名两列固定在左侧，列多滚动时始终认得到人（第 104 轮） */
.sa-stbl .sa-c-idx, .sa-stbl .sa-c-name { position: sticky; z-index: 2; background: var(--card); }
.sa-stbl .sa-c-idx { left: 0; }
.sa-stbl .sa-c-name { left: 34px; }
.sa-stbl thead .sa-c-idx, .sa-stbl thead .sa-c-name { z-index: 4; background: var(--th-bg); }
.sa-stbl tr.sa-tot .sa-c-idx, .sa-stbl tr.sa-tot .sa-c-name { background: var(--card); }
.sa-stbl .sa-c-pos { text-align: left; color: var(--text2); }
/* 第 133 轮：借调合并后的分部门计件列（只读，金额淡色区分来源） */
.sa-stbl td.sa-c-pcby { font-variant-numeric: tabular-nums; color: var(--text2); }
.sa-stbl td.sa-c-pcby.dim { color: var(--text3); }
/* 第 136 轮：工资表列间竖线 —— 28 列宽表横向扫读不错行；金额列统一等宽数字 */
.sa-stbl thead th, .sa-stbl tbody td { border-right: 1px solid var(--line); }
.sa-stbl tbody tr.sa-tot > td { border-top: 2px solid var(--line2); }
.sa-stbl td { font-variant-numeric: tabular-nums; }
.sa-stbl thead th[draggable="true"] { cursor: grab; }
.sa-stbl thead th[draggable="true"]:active { cursor: grabbing; }
.sa-tag { font-size: 9.5px; border-radius: 4px; padding: 1px 5px; }
.sa-tag.pc { color: var(--orange); background: var(--orange-bg); }
.sa-tag.mo { color: var(--blue); background: var(--blue-bg); }
.sa-tag.hr { color: var(--teal, #0b7a6b); background: var(--teal-bg, #e0f2f0); }
.sa-mn { width: 58px; height: 24px; text-align: right; font-size: 11.5px; border: 1px solid var(--line2); border-radius: 5px; background: var(--input-bg); color: var(--text); padding: 0 4px; font-variant-numeric: tabular-nums; }
.sa-mn:focus { border-color: var(--primary); outline: none; }
.sa-mn.ov { background: #fffbe6; border-color: #ffe58f; }
[data-theme="dark"] .sa-mn.ov { background: #3a3416; border-color: #6b5c1e; }
.sa-note { width: 96px; height: 24px; font-size: 11.5px; border: 1px solid var(--line2); border-radius: 5px; background: var(--input-bg); color: var(--text); padding: 0 5px; }
.sa-c-gross, .sa-c-total, .sa-c-due, .sa-c-net { background: var(--subtle-bg); font-variant-numeric: tabular-nums; }
.sa-c-net b { color: var(--green); }
[data-theme="dark"] .sa-c-net b { color: #2fd39a; }

/* 参数设置 */
.sa-cards { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; align-items: start; }
/* #view.listview 是 flex 纵向布局：.sa-card 自带 overflow:hidden，会被压缩到 2px（第 109 轮踩坑）——禁止收缩 */
#view.listview > .sa-cards, #view.listview > .sa-card { flex: none; }
.sa-cards .span2 { grid-column: span 2; }
.sa-cards .cfg-one { grid-template-columns: 1fr; }
.sa-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.sa-card-h { padding: 11px 14px; border-bottom: 1px solid var(--line); font-size: 13px; font-weight: 500; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.sa-card-x { font-size: 11.5px; color: var(--text3); font-weight: 400; }
.sa-card-b { padding: 12px 14px; }
.sa-scroll2 { max-height: 320px; overflow: auto; }
.sa-cfgtbl { width: 100%; }
.sa-cfgtbl th, .sa-cfgtbl td { font-size: 12px; padding: 4px 6px; }
.sa-cfgtbl td.l, .sa-cfgtbl th.l { text-align: left; }
.sa-cfgtbl select { height: 26px; font-size: 12px; }
.sa-cfgtbl .sa-auto { color: var(--text3); }
.sa-q { width: 100%; height: 32px; margin-bottom: 8px; border: 1px solid var(--line2); border-radius: 8px; background: var(--input-bg); color: var(--text); padding: 0 10px; font-size: 12.5px; }
.sa-ck { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text2); margin-bottom: 6px; font-weight: 400; }
.sa-ck input { width: auto; }
@media (max-width: 1100px) { .sa-cards { grid-template-columns: 1fr; } }

/* ================= 工资管理 2.0（第 99 轮：四个独立页面 / 拖选 / 自定义列 / 明细） ================= */
.tabseg.sa-pgseg { display: flex; gap: 6px; flex-wrap: wrap; }
.sa-plink { display: inline-flex; align-items: center; height: 30px; padding: 0 13px; border-radius: 8px; font-size: 12.5px; color: var(--text2); background: var(--card); border: 1px solid var(--line2); text-decoration: none; }
.sa-plink:hover { color: var(--text); border-color: var(--primary); text-decoration: none; }
.sa-plink.on { color: #fff; background: var(--primary); border-color: var(--primary); font-weight: 500; }

/* 夜班：整格深蓝 + 白色数字 + 右下角「夜」角标（颜色可在计薪参数里自定义，第 104 轮） */
.sa-cell.nt { background: var(--nt-bg, #1d3f7a); }
.sa-cell.nt .sa-v { color: var(--nt-fg, #fff); font-weight: 600; }
.sa-cell.nt .sa-moon { opacity: 1; }
.sa-cell.nt.sun { background: var(--nt-bg, #17335f); }
[data-theme="dark"] .sa-cell.nt { background: var(--nt-bg, #2a5cab); }
[data-theme="dark"] .sa-cell.nt.sun { background: var(--nt-bg, #24509a); }
.sa-nttag { position: absolute; right: 0; bottom: 0; font-size: 8px; line-height: 9px; font-weight: 700; color: #fff; background: #3b82f6; border-radius: 3px 0 0 0; padding: 0 2px; }

/* 拖选多格 */
.sa-cell.sel { outline: 2px solid var(--primary); outline-offset: -2px; background: var(--primary-bg); }
.sa-cell.sel.nt { background: var(--nt-bg, #1d3f7a); }
.sa-selbar { position: sticky; top: 0; z-index: 6; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 7px 10px; margin: 0 0 8px; background: var(--primary-bg); border: 1px solid var(--primary); border-radius: 8px; font-size: 12px; color: var(--text2); }
.sa-seln b { color: var(--primary); font-size: 13px; }

/* 考勤自定义列 */
.sa-csttd { width: 60px; }
.sa-cst { width: 56px; height: 22px; text-align: right; border: 1px solid var(--line2); border-radius: 4px; background: var(--input-bg); color: var(--text); font-size: 11px; padding: 0 3px; }
.sa-cst:focus { border-color: var(--primary); outline: none; }
.sa-csth { min-width: 58px; }
.sa-manual { font-style: normal; font-size: 9px; color: var(--purple); background: var(--purple-bg); border-radius: 3px; padding: 0 3px; margin-left: 4px; }
/* 工资归属标记（第 105 轮）：考勤名单「归」+ 加人弹窗「→ 部门」 */
.sa-ownem { color: var(--green); background: var(--green-bg); cursor: help; }
.sa-pick-d .sa-own { font-style: normal; font-size: 10.5px; color: var(--green); font-weight: 600; }

/* 自定义列编辑器 */
.sa-cetbl { width: 100%; }
.sa-cetbl th, .sa-cetbl td { font-size: 12px; padding: 4px 6px; }
.sa-cetbl input, .sa-cetbl select { height: 26px; font-size: 12px; width: 100%; }
.sa-ce-add { display: flex; gap: 8px; margin-top: 10px; }
.sa-ce-add input { flex: 1; height: 30px; border: 1px solid var(--line2); border-radius: 8px; background: var(--input-bg); color: var(--text); padding: 0 8px; font-size: 12.5px; }
.sa-empty.sm { padding: 16px 8px; font-size: 12px; }

/* 添加人员 */
.sa-addtop { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.sa-addtop .sa-q { margin-bottom: 0; flex: 1; }
.sa-picklist { max-height: 350px; overflow: auto; border: 1px solid var(--line2); border-radius: 8px; }
.sa-pick { display: grid; grid-template-columns: 22px 1.4fr 1fr 1fr 56px; align-items: center; gap: 6px; padding: 6px 9px; border-bottom: 1px solid var(--line); font-size: 12.5px; cursor: pointer; }
.sa-pick:last-child { border-bottom: 0; }
.sa-pick:hover { background: var(--row-hover); }
.sa-pick input { width: auto; }
.sa-pick-n b { font-weight: 500; }
.sa-pick-n i { font-style: normal; color: var(--text3); font-size: 11px; margin-left: 6px; }
.sa-pick-d, .sa-pick-p { color: var(--text2); font-size: 12px; }
.sa-pick-s { font-size: 11px; color: var(--green); text-align: right; }
.sa-pick-s.off { color: var(--text3); }

/* 粘贴 / 列对应 */
.sa-ta { width: 100%; border: 1px solid var(--line2); border-radius: 8px; background: var(--input-bg); color: var(--text); padding: 8px; font-size: 12px; font-family: inherit; resize: vertical; line-height: 1.6; }
.sa-maptitle { font-size: 12px; color: var(--text3); margin: 10px 0 6px; }
.sa-mapgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.sa-map { display: flex; flex-direction: column; gap: 2px; font-size: 11px; color: var(--text3); }
.sa-map span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sa-map select { height: 26px; font-size: 12px; }

/* 计件筛选条 */
.sa-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.sa-filters .sa-q { margin-bottom: 0; width: 260px; height: 30px; }
.sa-fhint { font-size: 12px; color: var(--text3); }
.sa-filters .sa-ck { margin-bottom: 0; }

/* 个人工资单详情 */
.sa-detail .sa-dhead { display: flex; justify-content: space-between; align-items: flex-start; padding: 4px 0 10px; border-bottom: 1px solid var(--line); }
.sa-dhead-l b { font-size: 16px; }
.sa-dhead-l span { display: block; font-size: 12px; color: var(--text3); margin-top: 3px; }
.sa-dhead-r { display: flex; align-items: center; gap: 8px; }
.sa-dhead-r .sa-dnet { font-size: 20px; color: var(--green); font-variant-numeric: tabular-nums; }
.sa-dhead-r i { font-style: normal; font-size: 11px; color: var(--text3); }
[data-theme="dark"] .sa-dhead-r .sa-dnet { color: #2fd39a; }
.sa-dkpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin: 10px 0; }
.sa-dkpis > div { background: var(--subtle-bg); border-radius: 8px; padding: 7px 9px; }
.sa-dkpis span { display: block; font-size: 11px; color: var(--text3); }
.sa-dkpis b { font-size: 13px; font-variant-numeric: tabular-nums; }
.sa-dcal { display: flex; flex-wrap: wrap; gap: 3px; margin-bottom: 12px; }
.sa-mini-c { width: 38px; border: 1px solid var(--line2); border-radius: 5px; text-align: center; padding: 2px 0; background: var(--card); }
.sa-mini-c b { display: block; font-size: 9px; color: var(--text3); font-weight: 400; }
.sa-mini-c span { display: block; font-size: 10.5px; min-height: 13px; }
.sa-mini-c.sun { background: var(--subtle-bg); }
.sa-mini-c.rest span { color: var(--text3); }
.sa-mini-c.leave span { color: var(--orange); }
.sa-mini-c.absent span { color: var(--red); }
.sa-mini-c.left span { color: var(--red); font-weight: 600; }
.sa-mini-c.borrow span { color: var(--purple); font-size: 9.5px; }
.sa-mini-c.nt { background: var(--nt-bg, #dcecff); }
.sa-mini-c.nt .sa-v { color: var(--nt-fg, var(--text)); }
[data-theme="dark"] .sa-mini-c.nt { background: var(--nt-bg, #1b3358); }
.sa-dcols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.sa-dcol-h { font-size: 12px; font-weight: 500; margin-bottom: 6px; color: var(--text2); }
.sa-dtbl { width: 100%; }
.sa-dtbl td { font-size: 12px; padding: 3px 6px; }
.sa-dtbl .l { text-align: left; }
.sa-dtbl tr.ov td { background: #fffbe6; }
[data-theme="dark"] .sa-dtbl tr.ov td { background: #3a3416; }
.sa-dtbl tr.ft td { font-weight: 500; border-top: 1px solid var(--line2); }
.sa-ovtag { font-style: normal; font-size: 9px; color: var(--orange); background: var(--orange-bg); border-radius: 3px; padding: 0 3px; }
.sa-dpc { margin-top: 12px; }
.sa-dnote { margin-top: 10px; font-size: 12px; color: var(--text2); background: var(--subtle-bg); padding: 8px 10px; border-radius: 8px; }
@media (max-width: 900px) {
  .sa-dkpis { grid-template-columns: repeat(3, 1fr); }
  .sa-dcols { grid-template-columns: 1fr; }
}

/* ================= 工资管理（第 100 轮：历史数据导入 · 花名册里没有的人） ================= */
.sa-missbox { margin-top: 10px; border: 1px solid var(--orange); border-radius: 9px; background: var(--orange-bg); padding: 9px 11px; }
.sa-miss-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--text); }
.sa-miss-h b { font-weight: 600; }
.sa-miss-opt { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--text2); }
.sa-miss-opt select { height: 24px; font-size: 11.5px; padding: 0 4px; border-radius: 6px; }
.sa-miss-note { margin-left: auto; font-size: 11.5px; color: var(--text3); }
.sa-miss-list { margin-top: 7px; max-height: 190px; overflow: auto; background: var(--card); border-radius: 7px; padding: 3px 6px; }
.sa-miss-row { display: flex; align-items: center; gap: 8px; padding: 3px 2px; border-bottom: 1px dashed var(--line2); }
.sa-miss-row:last-child { border-bottom: 0; }
.sa-miss-nm { min-width: 82px; font-size: 12.5px; font-weight: 500; }
.sa-miss-sub { flex: 1; font-size: 11px; color: var(--text3); font-variant-numeric: tabular-nums; }
.sa-miss-act, .sa-miss-emp { height: 26px; font-size: 11.5px; border-radius: 6px; padding: 0 4px; max-width: 200px; }
.sa-miss-row.linking .sa-miss-sub { display: none; }
.sa-miss-tip { margin-top: 6px; font-size: 11px; color: var(--text2); line-height: 1.55; }
.sa-newtag { font-style: normal; font-size: 9.5px; color: var(--orange); border: 1px solid var(--orange); border-radius: 3px; padding: 0 3px; margin-left: 3px; white-space: nowrap; }
[data-theme="dark"] .sa-missbox { background: #3a2c14; border-color: #7a5c22; }
[data-theme="dark"] .sa-miss-list { background: #22272f; }

/* ================= 工资管理（第 101 轮：列宽 / 隐藏列 / 结算归属 / 更像 Excel） ================= */
/* 表头拖拽调宽手柄 */
.sa-rsx { position: absolute; right: -3px; top: 0; bottom: 0; width: 7px; cursor: col-resize; z-index: 3; }
.sa-rsx::after { content: ''; position: absolute; right: 2px; top: 20%; bottom: 20%; width: 2px; border-radius: 2px; background: transparent; }
.sa-rsx:hover::after { background: var(--primary); opacity: .55; }
th { position: relative; }
.sa-tbl th, .sa-stbl th, .sa-pctbl th { white-space: nowrap; }
/* 工资表金额输入框：平时像正文，点进去才能改（0 显示为空白，整表更干净） */
.sa-stbl .sa-mn { width: 100%; border-color: transparent; background: transparent; box-shadow: none; }
.sa-stbl .sa-mn:hover { border-color: var(--line2); background: var(--input-bg); }
.sa-stbl .sa-mn:focus { border-color: var(--primary); background: var(--input-bg); }
.sa-stbl .sa-mn.ov { background: #fffbe6; border-color: #ffe58f; }
/* 第 137 轮：计薪方式下拉（默认融入表格，悬停显边；指定过 = 黄底提示覆盖生效中） */
.sa-stbl select.sa-paysel { border: 1px solid transparent; background: transparent; padding: 1px 3px; font-size: 11.5px; color: var(--text); border-radius: 4px; cursor: pointer; max-width: 96px; height: 24px; }
.sa-stbl select.sa-paysel:hover, .sa-stbl select.sa-paysel:focus { border-color: var(--line); background: var(--card); }
.sa-stbl select.sa-paysel.ov { background: #fffbe6; border-color: #ffe58f; }
[data-theme="dark"] .sa-stbl select.sa-paysel.ov { background: #3a3416; border-color: #6b5c1e; }
.sa-stbl td, .sa-stbl th { white-space: nowrap; }
.sa-stbl .sa-c-gross, .sa-stbl .sa-c-total, .sa-stbl .sa-c-due, .sa-stbl .sa-c-net { font-variant-numeric: tabular-nums; }
/* 夜班格：深蓝底 + 「夜」角标已经够醒目，去掉月亮图标减少噪音 */
.sa-cell.nt .sa-moon { display: none; }
/* 考勤格不换行，行更紧凑 */
.sa-tbl td, .sa-tbl th { white-space: nowrap; }
/* 「列显示」弹窗 */
.sa-cs-list { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-bottom: 10px; }
.sa-cs-list .sa-ck { width: calc(50% - 14px); margin: 0; }
.sa-cs-w { margin: 6px 0 10px; font-size: 12.5px; }
.sa-cs-w input { width: 64px; height: 26px; text-align: center; }
.sa-hints { display: block; font-size: 11px; color: var(--text3); margin-top: 2px; }
[data-theme="dark"] .sa-stbl .sa-mn.ov { background: #3a3416; border-color: #6b5c1e; }

/* ================= 工资管理（第 102 轮：应出勤小时化 / 计件批量删除） ================= */
/* 应出勤设置：部门单独设置提示行 + 当前生效列 */
.sa-std-h { font-size: 12px; color: var(--text2); margin: 10px 0 6px; }
.sa-std-cur { color: var(--text2); font-variant-numeric: tabular-nums; }
/* 计件批量删除 */
.sa-bd-top { display: flex; align-items: center; gap: 8px; margin: 10px 0 8px; flex-wrap: wrap; }
.sa-bd-sum { font-size: 12px; color: var(--text2); margin-left: auto; }
.sa-bd-list { max-height: 260px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; padding: 4px 0; }
.sa-bd-row { display: flex; align-items: center; gap: 6px; padding: 6px 10px; margin: 0; cursor: pointer; }
.sa-bd-row:hover { background: var(--subtle-bg); }
.sa-bd-row.cur { background: var(--subtle-bg2); }
.sa-bd-n { margin-left: auto; font-size: 11.5px; color: var(--text3); white-space: nowrap; }
[data-theme="dark"] .sa-bd-list { background: #22272f; }
[data-theme="dark"] .sa-bd-row.cur { background: #2b323c; }

/* 清空数据（第 109 轮） */
.sa-card.sa-danger { border-color: #f3c1c1; background: var(--red-bg); }
[data-theme="dark"] .sa-card.sa-danger { border-color: #5c3030; background: #2a1e20; }
.sa-wipe-warn { margin: 8px 0 2px; padding: 8px 12px; border-radius: 8px; background: var(--red-bg); color: var(--red); font-size: 13px; border: 1px solid #f3c1c1; }

/* 行/页签拖动 + 本月不发薪折叠区（第 116 轮） */
[data-dragid] { cursor: grab; user-select: none; }
[data-dragid]:hover { background: var(--subtle-bg); }
tr.dragging, .sa-dtab.dragging { opacity: 0.45; }
tr.drop-to td { border-top: 2px solid var(--primary) !important; background: var(--primary-bg); }
.sa-dtabs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* 第 126 轮：⚠ 列表页是 flex 纵向布局，这些「横条」区块默认 flex-shrink:1，
   其中 .sa-hidebox 带 overflow:hidden —— 内容和表格一起超高时会被压成一条 18px 的细线（入口等于消失）。
   一律禁止收缩，内容多了让整页滚。 */
#view.listview > .mini-stats,
#view.listview > .tabs,
#view.listview > .tabtools,
#view.listview > .sa-noticebar,
#view.listview > .sa-hidebox,
#view.listview > .sa-dtabs,
#view.listview > .sa-tip { flex: none; }
.sa-hidebox { margin: 10px 0 0; border: 1px dashed var(--line2); border-radius: 10px; overflow: hidden; }
.sa-hidetoggle { width: 100%; text-align: left; border: 0; background: var(--subtle-bg); color: var(--text2); padding: 8px 14px; font-size: 13px; cursor: pointer; display: flex; align-items: center; gap: 10px; }
.sa-hidetoggle:hover { background: var(--subtle-bg2); }
.sa-hidetoggle .sa-hb-t b { color: var(--red); font-size: 14px; }
.sa-hidetoggle .sa-hb-s { color: var(--text3); font-size: 12px; }
.sa-hidetoggle i { font-style: normal; font-size: 11.5px; color: var(--text3); margin-left: auto; }
.sa-hidetoggle.on { background: var(--subtle-bg2); }
.sa-hidelist { padding: 10px 14px 12px; }
.sa-hidelist .sa-hints { margin-top: 8px; }
/* 折叠区表格：跟主表同列同宽，横向可滚、纵向限高，不把页面撑爆 */
.sa-scroll3 { max-height: 46vh; }
.sa-hideem {
  font-style: normal; font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 999px;
  margin-left: 4px; vertical-align: 1px; white-space: nowrap;
  color: var(--text3); background: var(--subtle-bg2); border: 1px solid var(--line2);
}
/* 岗位排序面板（第 126 轮） */
.sa-poslist { max-height: 46vh; overflow: auto; border: 1px solid var(--line2); border-radius: 8px; }
.sa-posrow { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-bottom: 1px solid var(--line); font-size: 13px; }
.sa-posrow:last-child { border-bottom: 0; }
.sa-posrow:hover { background: var(--subtle-bg); }
.sa-posno { width: 22px; flex: none; text-align: right; color: var(--text3); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.sa-posrow b { flex: 1 1 auto; font-weight: 600; color: var(--text); }
.sa-posrow i { font-style: normal; font-size: 11.5px; color: var(--text3); }
.sa-posbtn { display: flex; gap: 4px; flex: none; }
.btn.sm .sa-on, .sa-on { font-style: normal; font-size: 9.5px; font-weight: 700; color: var(--card); background: var(--primary); border-radius: 999px; padding: 0 4px; margin-left: 3px; vertical-align: 1px; }
.btn.xs.warn { color: #b3591d; border-color: #e8c9a8; }
/* 第 133 轮：计时切换弹窗 */
.sa-hrbox .sa-hrtools { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.sa-hrfill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text2); }
.sa-hrfill label { display: inline-flex; align-items: center; gap: 4px; }
.sa-hrfill input { width: 66px; height: 24px; text-align: right; font-size: 12px; border: 1px solid var(--line2); border-radius: 5px; background: var(--input-bg); color: var(--text); padding: 0 6px; font-variant-numeric: tabular-nums; }
.sa-hrfill .btn { height: 24px; line-height: 22px; padding: 0 10px; font-size: 12px; }
.sa-hrlist { max-height: 46vh; overflow: auto; border: 1px solid var(--line2); border-radius: 8px; }
.sa-hrrow { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-bottom: 1px solid var(--line); font-size: 13px; cursor: pointer; }
.sa-hrrow:last-child { border-bottom: 0; }
.sa-hrrow:hover { background: var(--subtle-bg); }
.sa-hrrow b { font-weight: 600; color: var(--text); }
.sa-hrrow i { font-style: normal; font-size: 11.5px; color: var(--text3); }
.sa-hrrow .sa-tag { flex: none; }
.sa-hrh { width: 86px; height: 24px; text-align: right; font-size: 11.5px; border: 1px solid var(--line2); border-radius: 5px; background: var(--input-bg); color: var(--text); padding: 0 6px; margin-left: auto; font-variant-numeric: tabular-nums; }
.sa-hrbox .sa-hint2 { font-size: 11.5px; color: var(--text3); margin-top: 8px; }
[data-theme="dark"] .btn.xs.warn { color: #e8a86a; border-color: #6a4c30; }

/* ============ 日常记录 · 类别多选筛选（第 119 轮） ============ */
.dl-msel-btn { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-msel-btn .cv { font-size: 9px; color: var(--text3); margin-left: 2px; }
.dl-msel-btn.on { border-color: var(--primary); color: var(--primary); background: var(--primary-bg); font-weight: 600; }
.dl-msel-btn.on .cv { color: var(--primary); }
.dl-msel-pop {
  position: fixed; z-index: 9000; width: 320px; max-height: 60vh; display: flex; flex-direction: column;
  background: var(--card); border: 1px solid var(--line2); border-radius: 10px;
  box-shadow: 0 6px 24px rgba(29, 33, 41, .14); overflow: hidden;
}
.dl-msel-pop .mp-h { padding: 10px 14px 8px; font-size: 13px; font-weight: 700; color: var(--text); border-bottom: 1px solid var(--line); }
.dl-msel-pop .mp-h span { font-size: 11px; font-weight: 400; color: var(--text3); margin-left: 6px; }
.dl-msel-pop .mp-list { overflow: auto; padding: 6px; flex: 1; }
.dl-msel-pop .mp-it { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 7px; cursor: pointer; font-size: 12.5px; }
.dl-msel-pop .mp-it:hover { background: var(--primary-bg); }
.dl-msel-pop .mp-it.on { background: var(--primary-bg); }
.dl-msel-pop .mp-it.on .mp-n { color: var(--primary); font-weight: 600; }
.dl-msel-pop .mp-it input { accent-color: var(--primary); margin: 0; }
.dl-msel-pop .mp-n { margin-left: auto; font-size: 11.5px; color: var(--text3); font-variant-numeric: tabular-nums; }
.dl-msel-pop .mp-empty { padding: 18px; text-align: center; color: var(--text3); font-size: 12px; }
.dl-msel-pop .mp-f { display: flex; align-items: center; gap: 4px; padding: 8px 12px; border-top: 1px solid var(--line); background: var(--th-bg); }
.dl-msel-pop .mp-cnt { font-size: 11.5px; color: var(--text3); margin-right: 8px; }
.dl-msel-pop .mp-cnt b { color: var(--primary); }
/* 已选类别汇总条 */
.dl-chiprow { flex-wrap: wrap; gap: 6px; }
.dl-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 6px 3px 4px;
  border: 1px solid var(--line2); border-radius: 999px; background: var(--th-bg); font-size: 12px;
}
.dl-chip b { font-size: 11.5px; color: var(--text2); font-variant-numeric: tabular-nums; }
.dl-chip i { font-style: normal; font-size: 11px; font-variant-numeric: tabular-nums; }
.dl-chip i.neg { color: var(--red); }
.dl-chip i.pos { color: var(--green); }
.dl-chip i.mut { color: var(--text3); }
.dl-chip .x { cursor: pointer; color: var(--text3); font-size: 11px; padding: 0 3px; border-radius: 50%; line-height: 1.4; }
.dl-chip .x:hover { color: var(--red); background: var(--red-bg); }
.dl-chip .cvjump { cursor: pointer; }
.dl-chip.total { background: var(--primary-bg); border-color: var(--primary); }
.dl-chip.total b { color: var(--primary); }
.dl-chip.total i { color: var(--primary); font-weight: 600; }

/* ============ 第 121 轮：导入优先（离职红名 / 借调待确认 / 待确认汇总条） ============ */
.sa-leftem, .sa-borrowem {
  font-style: normal; font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 999px;
  margin-left: 4px; vertical-align: 1px; white-space: nowrap;
}
.sa-leftem { color: var(--red); background: var(--red-bg); border: 1px solid var(--red); }
.sa-borrowem { color: var(--orange); background: var(--orange-bg); border: 1px solid var(--orange); }
/* 第 130 轮：已离职（非本月）—— 灰红描边，弱于本月离职的红底，但一眼能认出来 */
.sa-goneem { font-style: normal; font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 999px; margin-left: 4px; vertical-align: 1px; white-space: nowrap; color: var(--text2); background: var(--subtle-bg); border: 1px dashed var(--red); }
tr.sa-leftrow > td { background: var(--red-bg); }
tr.sa-leftrow td.sa-c-name b { color: var(--red); }
/* 第 131 轮：已离职（非本月）整行淡灰底，跟灰标呼应 */
tr.sa-gonerow > td { background: var(--subtle-bg); }
tr.sa-gonerow td.sa-c-name b { color: var(--text2); }
tr.sa-borrowrow > td { background: var(--orange-bg); }
.sa-noticebar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.sa-nb {
  display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 12.5px; padding: 6px 12px; border-radius: 8px; line-height: 1.5;
}
.sa-nb.warn { color: var(--orange); background: var(--orange-bg); border: 1px solid var(--orange); }
.sa-nb.info { color: var(--red); background: var(--red-bg); border: 1px solid var(--red); }
.sa-nb b { font-size: 13px; }

/* ============ 第 122 轮：工资表「操作」列固定在最右侧 ============
   ★踩坑：.sa-stbl 是 table-layout:auto + width:max-content，前面每列都写了 inline width，
   操作列没有任何宽度约束 → 被前面定宽列吃光，横向滚到底 th/td 实测宽 0px（按钮看不见）。
   解法：width:1%（auto 布局下 = 不被压缩的内容宽度）+ nowrap；同时 sticky right 固定，
   列再多也不用滚到最右就能点「详情 / 合并到本表 / 移至离职表」。 */
.sa-stbl .sa-act {
  position: sticky; right: 0; z-index: 3;
  width: 172px;              /* auto 布局 + max-content 表格：百分比/最小宽都会被吞成 0，只能给像素 */
  white-space: nowrap;
  background: var(--card);
  box-shadow: inset 10px 0 8px -9px rgba(15, 23, 42, .22);
  padding-left: 7px; padding-right: 7px;
}
.sa-stbl thead .sa-act { top: 0; right: 0; z-index: 6; background: var(--th-bg); }
.sa-stbl tr.sa-tot > td.sa-act { background: var(--subtle-bg2); }
.sa-stbl tr.sa-leftrow > td.sa-act { background: var(--red-bg); }
.sa-stbl tr.sa-gonerow > td.sa-act { background: var(--subtle-bg); }
.sa-stbl tr.sa-borrowrow > td.sa-act { background: var(--orange-bg); }
/* 操作列里的按钮紧凑一点，别把操作列撑得太宽 */
.sa-stbl .sa-act .btn { height: 21px; line-height: 21px; padding: 0 6px; font-size: 11px; }
.sa-stbl .sa-act .btn + .btn { margin-left: 4px; }
[data-theme="dark"] .sa-stbl .sa-act { box-shadow: inset 10px 0 8px -9px rgba(0, 0, 0, .6); }

/* ================= 第 139 轮：工具栏 / 户页签 动效美化 =================
   1) .tabtools 改 flex 拉开按钮间距（原来按钮拼接无空格挤成一团）
   2) 按钮 hover 上浮 + 按下回弹特效；银发页各按钮按功能配色一眼区分
   3) 户页签胶囊化动效（银发 / 报餐等 .tabs>.tabseg 通用） */
.tabtools { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.tabtools .btn { transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease, color .16s ease; }
.tabtools .btn:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(15, 23, 42, .16); }
.tabtools .btn:active { transform: translateY(0) scale(.95); box-shadow: none; transition-duration: .06s; }
[data-theme="dark"] .tabtools .btn:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, .45); }

/* 户页签：胶囊化 + 悬浮上浮 + 选中主色（选中带主色光晕） */
.tabs .tabseg { display: flex; gap: 6px; flex-wrap: wrap; }
.tabs .tabseg button {
  height: 30px; padding: 0 15px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--line2); background: var(--card); color: var(--text2);
  font-size: 12.5px; transition: all .18s ease;
}
.tabs .tabseg button:hover { color: var(--primary); border-color: var(--primary); transform: translateY(-1px); box-shadow: 0 3px 8px rgba(15, 23, 42, .12); }
.tabs .tabseg button:active { transform: translateY(0) scale(.96); box-shadow: none; }
.tabs .tabseg button.on { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; box-shadow: 0 3px 10px rgba(61, 109, 245, .32); }
.tabs .tabseg button.on:hover { background: var(--primary-deep); color: #fff; }

/* 银发页工具按钮按功能配色（一眼区分 添加 / 沿用 / 导入 / 导出 / 打印） */
#yinAddBtn { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 500; }
#yinAddBtn:hover { background: var(--primary-deep); border-color: var(--primary-deep); color: #fff; }
#yinPrevBtn { background: var(--blue-bg); border-color: transparent; color: var(--blue); }
#yinPrevBtn:hover { color: var(--blue); }
#yinPasteBtn, #yinImpBtn { background: var(--cyan-bg); border-color: transparent; color: var(--cyan); }
#yinPasteBtn:hover, #yinImpBtn:hover { color: var(--cyan); }
#yinExpBtn, #yinBookBtn { background: var(--purple-bg); border-color: transparent; color: var(--purple); }
#yinExpBtn:hover, #yinBookBtn:hover { color: var(--purple); }
#yinPrintBtn { background: var(--orange-bg); border-color: transparent; color: var(--orange); }
#yinPrintBtn:hover { color: var(--orange); }
#yinGrpsBtn, #yinXColBtn { border-style: dashed; }

/* 银发表格：行悬浮提示 + 表头拖动感（表头 grab / 拖中半透明在工资表 136 轮已全局） */
.sa-stbl thead th[draggable="true"] { cursor: grab; }
.sa-stbl tbody tr { transition: background .12s ease; }

/* 第 140 轮：待办提醒 金额汇总条（应付红 / 应收绿，跟筛选走） */
.dl-todo-sums {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 12px; border-radius: 999px; font-size: 12px; color: var(--text2);
  background: var(--subtle-bg); border: 1px solid var(--line);
  white-space: nowrap;
}
.dl-todo-sums i { font-style: normal; color: var(--dash); margin: 0 2px; }
.dl-todo-sums b { font-variant-numeric: tabular-nums; font-size: 12.5px; }

/* ============ 第 144 轮：系统设置 · 数据体检 ============ */
.sys-mods { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 4px; }
.sys-mods span { font-size: 11.5px; color: var(--text3); white-space: nowrap; }
.sys-mods b { color: var(--text2); font-variant-numeric: tabular-nums; }
.sys-size-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-left: 5px; vertical-align: 1px; }
.sys-size-dot.ok { background: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 18%, transparent); }
.sys-size-dot.warn { background: var(--orange); box-shadow: 0 0 0 3px color-mix(in srgb, var(--orange) 18%, transparent); }
.sys-size-dot.bad { background: var(--red); box-shadow: 0 0 0 3px color-mix(in srgb, var(--red) 18%, transparent); }
.sys-size-bar { display: inline-block; width: 110px; height: 6px; border-radius: 3px; background: var(--line); margin-left: 10px; vertical-align: 5px; overflow: hidden; }
.sys-size-bar i { display: block; height: 100%; border-radius: 3px; transition: width .4s; }
.sys-size-bar.ok i { background: var(--green); }
.sys-size-bar.warn i { background: var(--orange); }
.sys-size-bar.bad i { background: var(--red); }

/* 第 146b 轮：组名再长也要完整显示——去掉截断，标签内自动换行
   （全局 .tag 是 inline-flex + 固定 20px 高 + nowrap，必须一并覆盖，否则长名被裁进一行） */
.dl-grptag { background: color-mix(in srgb, var(--primary) 12%, transparent); color: var(--primary);
  border: 1px solid color-mix(in srgb, var(--primary) 28%, transparent);
  display: inline-block; height: auto; min-height: 20px; padding: 2px 8px;
  white-space: normal; word-break: break-all; overflow-wrap: anywhere;
  text-align: left; line-height: 1.5; vertical-align: middle; }
tr.dlrow { cursor: pointer; }
/* 选中行：整行实色主色底 + 反色文字 + 序号打勾（第 145c 轮：原来 --brand 变量不存在，选中毫无反馈）
   文字用 var(--card) 反色：浅色主题=白字蓝底，深色主题=深字浅蓝底，两边都清晰 */
tr.dlrow.dl-on > td { background: var(--primary) !important; color: var(--card, #fff); font-weight: 600; }
tr.dlrow.dl-on > td b, tr.dlrow.dl-on > td .num b { color: inherit; }
tr.dlrow.dl-on > td:first-child { box-shadow: inset 5px 0 0 color-mix(in srgb, var(--card, #fff) 70%, transparent); color: var(--card, #fff); font-weight: 800; }
tr.dlrow.dl-on > td:last-child { box-shadow: inset -3px 0 0 color-mix(in srgb, var(--card, #fff) 55%, transparent); }
tr.dlrow.dl-on:hover > td { background: var(--primary-deep) !important; }
tr.dlrow.dl-on td.seqc { position: relative; }
tr.dlrow.dl-on td.seqc::after { content: '✓'; position: absolute; right: 1px; top: 50%; transform: translateY(-50%);
  font-size: 9px; font-weight: 800; color: var(--card, #fff); }
tr.dlrow.dl-on .dl-grptag { background: color-mix(in srgb, var(--card, #fff) 22%, transparent); color: var(--card, #fff);
  border-color: color-mix(in srgb, var(--card, #fff) 45%, transparent); }
tr.dlrow.dl-on .tag:not(.dl-grptag) { background: color-mix(in srgb, var(--card, #fff) 22%, transparent);
  color: var(--card, #fff) !important; border-color: transparent; }
tr.dlrow.dl-on td i.adv-sub { color: inherit; opacity: .85; }
.dl-selbar { position: sticky; bottom: 10px; z-index: 30; display: flex; align-items: center; gap: 8px;
  margin: 12px 2px 2px; padding: 9px 14px; border-radius: 12px;
  background: var(--card, #fff); border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--line));
  box-shadow: 0 8px 26px rgba(0, 0, 0, .16); backdrop-filter: blur(6px); }
.dl-sel-cnt { font-size: 13px; color: var(--text2); }
.dl-sel-cnt b { color: var(--primary); font-size: 15px; font-variant-numeric: tabular-nums; }
.dl-selbar .btn[disabled] { opacity: .45; cursor: not-allowed; }

/* 第 146b 轮：归组列完整显示——放开该列 td 的 nowrap/ellipsis，长组名自动折行 */
table.dt tbody td.dl-c-grp { white-space: normal; overflow: visible; text-overflow: clip; }
table.dt tbody td.dl-c-grp .dl-grptag { display: inline-block; max-width: 100%; }