/* ============ 水务生产日报系统 样式 v20260902f ============ */
:root {
  /* 中国水务色调：水务绿为主（对齐 HHO 门户风格） */
  --primary: #00A651;
  --primary-dark: #008040;
  --primary-light: #E6F7EF;
  --primary-faint: #F0FBF5;
  --secondary: #1FA971;
  --secondary-light: #EDF5FF;
  --success: #0E9F6E;
  --success-light: #E6F6EF;
  --danger: #DC2F2F;
  --danger-light: #FCEDED;
  --warn: #E8890C;
  --warn-light: #FDF3E3;
  --info: #00A651;
  --info-light: #E6F7EF;
  --purple: #7B5EA7;
  --purple-light: #F0EDFA;
  --text: #1F2937;
  --text-sub: #5B6B7C;
  --text-hint: #8A97A5;
  --bg: #EDF1F3;
  --surface: #FFFFFF;
  --surface-2: #F4F8F6;
  --bg-alt: #E4E9EB;
  --card-bg: #FFFFFF;
  --border: #DDE3E3;
  --border-light: #E5EAEA;
  --radius: 10px;
  --radius-sm: 6px;
  --radius-lg: 14px;
  --shadow: 0 2px 8px rgba(0,60,30,.06), 0 1px 3px rgba(0,60,30,.04);
  --shadow-md: 0 6px 20px rgba(0,60,30,.10), 0 2px 6px rgba(0,60,30,.05);
  --shadow-lg: 0 12px 36px rgba(0,60,30,.14), 0 4px 12px rgba(0,60,30,.07);
  --calc-bg: #FFF8E1;
  --transition: .2s cubic-bezier(.4,0,.2,1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
/* v20260902z：body 背景改为更柔和的浅蓝灰，让侧栏深绿与主区形成明确"深-浅"对比 */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
  background: #F1F4F7;             /* 比之前 #EDF1F3 略偏蓝，与深绿对比更专业 */
  color: var(--text);
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
.hidden { display: none !important; }
a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 1px solid transparent; border-radius: var(--radius-sm);
  padding: 8px 16px; font-size: 14px; font-family: inherit;
  cursor: pointer; transition: all var(--transition); white-space: nowrap;
  background: #EEF1F4; color: var(--text);
}
.btn:hover { filter: brightness(.96); transform: translateY(-1px); box-shadow: 0 2px 8px rgba(31,45,61,.1); }
.btn:active { transform: scale(.98); }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.btn-primary { background: #0B5438; color: #fff; }
.btn-primary:hover { background: #0D6B42; }
.btn-ghost { background: transparent; border-color: var(--border); color: var(--text-sub); }
.btn-ghost:hover { background: var(--primary-faint); color: var(--primary); border-color: var(--primary-light); }
.btn-danger-ghost { background: transparent; border-color: var(--border); color: var(--danger); }
.btn-danger-ghost:hover { background: var(--danger-light); border-color: #F5C6C0; }
.btn-lg { padding: 12px 24px; font-size: 16px; border-radius: 10px; }
.btn-sm { padding: 5px 10px; font-size: 13px; }
.btn-block { width: 100%; }
.btn-group { display: flex; gap: 8px; flex-wrap: wrap; }
.btn-success { background: #0B5438; color: #fff; }
.btn-success:hover { background: #0D6B42; }

/* ---------- 登录页 ---------- */
.login-view {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #0B5438 0%, #0A4833 50%, #073D29 100%);
  padding: 20px;
}
.login-card {
  background: #fff; border-radius: 20px; padding: 40px 36px; width: 100%; max-width: 460px;
  box-shadow: var(--shadow-lg); text-align: center;
  animation: card-in .4s ease;
}
@keyframes card-in { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.login-logo-img { height: 64px; width: auto; display: block; margin: 0 auto 8px; }
.login-hho-img { height: 68px; width: auto; display: block; margin: 0 auto 4px; }   /* v20260903c：参考图透明 PNG（146×50，比例 2.92:1），68px 高按比例缩放 */
.login-card h1 { font-size: 24px; color: #0B5438; margin: 10px 0 4px; }
.login-sub { color: var(--text-sub); margin-bottom: 24px; }
.login-form { text-align: left; }
.login-label { display: block; font-size: 13px; color: var(--text-sub); margin: 14px 0 8px; }
.role-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.role-card {
  border: 2px solid var(--border); border-radius: 12px; background: #fff;
  padding: 14px 8px; cursor: pointer; text-align: center; transition: all var(--transition);
  display: flex; flex-direction: column; gap: 4px; font-family: inherit;
}
.role-card:hover { border-color: var(--primary); background: var(--primary-faint); }
.role-card.active { border-color: var(--primary); background: var(--primary-faint); box-shadow: 0 0 0 3px rgba(0,166,81,.15); }
.role-icon { font-size: 24px; }
.role-name { font-size: 14px; font-weight: 600; color: var(--text); }
.role-desc { font-size: 11px; color: var(--text-sub); }
.login-input {
  width: 100%; padding: 12px 14px; border: 1.5px solid var(--border); border-radius: 10px;
  font-size: 15px; font-family: inherit; outline: none; transition: border-color var(--transition), box-shadow var(--transition);
}
.login-input:focus { border-color: #0B5438; box-shadow: 0 0 0 3px rgba(11,84,56,.12); }
#login-btn { margin-top: 18px; }
.login-tip { text-align: center; color: var(--text-sub); font-size: 12px; margin-top: 12px; line-height: 1.6; }

/* ---------- 顶栏 ---------- */
.app { min-height: 100vh; display: flex; flex-direction: column; }
.topbar {
  background: #fff; border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 100;
  box-shadow: 0 1px 6px rgba(31,45,61,.06);
}
.topbar::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, #0B5438, #0D6B42);
  z-index: 1;
}
.topbar-inner {
  max-width: 1320px; margin: 0 auto; padding: 0 22px;
  display: flex; align-items: center; gap: 20px; height: 58px;
  flex-wrap: nowrap;
}
.brand { display: flex; align-items: center; gap: 10px; cursor: pointer; flex-shrink: 0; min-width: 0; text-decoration: none; }
.brand-logo { height: 34px; width: auto; display: block; object-fit: contain; min-width: 0; }   /* v20260903c：参考图透明 PNG，34px 高按比例缩放（原 SVG 版 40px，图更扁取 34px 视觉等高） */
.brand-title { font-size: 16px; font-weight: 700; color: var(--text); letter-spacing: .2px; }
/* v20260902t：顶栏当前页面名 — 椭圆软底 + 主色文字（去掉旗帜前缀，保持简洁）+ 与后面放大镜留出距离 */
.topbar-page-name {
  display: inline-flex; align-items: center;
  padding: 0 14px;
  margin-left: 8px;             /* 与 logo 视觉间距 */
  margin-right: 14px;           /* v20260902t：与后面放大镜留出距离，避免挤一块 */
  height: 30px;
  background: rgba(31,45,61,.045);
  color: var(--primary);
  font-size: 14px; font-weight: 600;
  border-radius: 16px;
  letter-spacing: .3px;
  white-space: nowrap;
  flex-shrink: 0;
  border: 1px solid rgba(31,45,61,.06);
}
/* v20260902t：去掉原旗帜前缀图标（大哥反馈不需要） */
/* .topbar-page-name::before 已废弃，无前缀 */
/* 顶栏搜索按钮（放大镜图标） */
.topbar-search-btn {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; flex-shrink: 0;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg); color: var(--text-sub);
  cursor: pointer; transition: all .15s;
}
.topbar-search-btn:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-faint); }
.topbar-search-btn svg { width: 18px; height: 18px; display: block; }
.main-nav { display: flex; gap: 2px; flex-wrap: nowrap; align-items: center; flex-shrink: 1; min-width: 0; overflow: hidden; }
.nav-item {
  border: none; background: transparent; padding: 6px 10px; border-radius: var(--radius-sm);
  font-size: 13px; font-family: inherit; color: var(--text-sub); cursor: pointer; transition: all var(--transition);
  position: relative; white-space: nowrap; flex-shrink: 0;
}
.nav-item:hover { background: var(--primary-faint); color: var(--primary); }
.nav-item.active { background: #0B5438; color: #fff; font-weight: 600; }
.nav-item.active::after {
  content: ""; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%);
  width: 60%; height: 3px; background: #0D6B42; border-radius: 3px 3px 0 0;
}
.user-box { display: flex; align-items: center; gap: 10px; flex-shrink: 0; margin-left: auto; }

/* ---------- 云端连接状态角标（v20260902d：从页内顶部 banner 收敛到右上角） ---------- */
.cloud-status-slot { display: inline-flex; align-items: center; flex-shrink: 0; margin-right: 4px; }
.cloud-status-dot {
  position: relative; width: 10px; height: 10px; border-radius: 50%;
  display: inline-block; cursor: pointer; transition: transform .15s;
  box-shadow: 0 0 0 2px rgba(255,255,255,.85);
}
.cloud-status-dot:hover { transform: scale(1.25); }
.cloud-status-dot.cloud-status-ok     { background: #1FA971; }   /* 已连云端 */
.cloud-status-dot.cloud-status-warn   { background: #E8890C; }   /* 降级或异常 */
.cloud-status-dot.cloud-status-local  { background: #8A97A5; }   /* 本地模式 */
.cloud-status-dot.cloud-status-err    { background: #DC2F2F; }   /* 故障 */
.cloud-status-dot::after {
  content: attr(data-tip);
  position: absolute; top: 50%; right: calc(100% + 10px);
  transform: translateY(-50%) translateX(6px);
  background: #1F2937; color: #fff; padding: 7px 12px; border-radius: 6px;
  font-size: 12px; line-height: 1.5; white-space: nowrap;
  opacity: 0; pointer-events: none; transition: all .18s;
  box-shadow: 0 4px 12px rgba(0,0,0,.15); z-index: 1000;
  max-width: 340px; white-space: normal; width: max-content;
}
.cloud-status-dot::before {
  content: ""; position: absolute; top: 50%; right: calc(100% + 4px);
  transform: translateY(-50%); border: 6px solid transparent; border-left-color: #1F2937;
  opacity: 0; pointer-events: none; transition: opacity .18s; z-index: 1000;
}
.cloud-status-dot:hover::after,
.cloud-status-dot:hover::before { opacity: 1; transform: translateY(-50%) translateX(0); }
.cloud-status-dot:hover::before { transform: translateY(-50%); }
.cloud-status-dot.cloud-status-warn,
.cloud-status-dot.cloud-status-err { animation: cloud-dot-pulse 1.6s ease-in-out infinite; }
@keyframes cloud-dot-pulse {
  0%, 100% { box-shadow: 0 0 0 2px rgba(255,255,255,.85), 0 0 0 0 rgba(232,137,12,.5); }
  50%      { box-shadow: 0 0 0 2px rgba(255,255,255,.85), 0 0 0 6px rgba(232,137,12,0); }
}
.user-badge {
  width: 34px; height: 34px; border-radius: 50%; background: var(--primary-light);
  display: flex; align-items: center; justify-content: center; font-size: 16px;
}
.user-meta { line-height: 1.25; }
.user-name { font-weight: 600; font-size: 14px; display: block; }
.user-role { font-size: 12px; color: var(--text-sub); }

/* ---------- 内容区 ---------- */
.content { flex: 1; width: 100%; max-width: 1200px; margin: 0 auto; padding: 24px 20px 60px; position: relative; }
.content::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 180px;
  background: linear-gradient(180deg, rgba(11,84,56,.08) 0%, transparent 100%);
  pointer-events: none; z-index: 0; border-radius: 0 0 16px 16px;
}
.content > * { position: relative; z-index: 1; }
.page { display: none; }
.page.active { display: block; animation: page-in .3s ease; }
@keyframes page-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.row-between { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
/* v20260902r：.page-desc 兜底（部分老页面可能还在用，统一灰色 12px） */
.page-desc { color: var(--text-sub); font-size: 12px; line-height: 1.45; margin: 4px 0 0; }
.filter-bar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.filter-bar select {
  height: 36px; padding: 0 28px 0 12px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: #fff; font-size: 13.5px; font-family: inherit; color: var(--text);
  outline: none; cursor: pointer; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%238A97A5' d='M3 4.5l3 3 3-3'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center;
  transition: border-color .15s, box-shadow .15s;
  min-width: 110px; flex-shrink: 0;
}
.filter-bar select:hover { border-color: var(--primary-light); }
.filter-bar select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.filter-bar input {
  height: 36px; padding: 0 12px; min-width: 220px; flex: 1;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg); font-size: 13.5px; font-family: inherit; color: var(--text);
  outline: none; transition: border-color .15s, box-shadow .15s;
}
.filter-bar input::placeholder { color: var(--text-hint); }
.filter-bar input:hover { border-color: var(--primary-light); }
.filter-bar input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.filter-bar .btn { height: 36px; flex-shrink: 0; }

/* ---------- 卡片 ---------- */
.card {
  background: var(--card-bg); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 20px; margin-bottom: 20px; border: none;
  transition: box-shadow var(--transition), transform var(--transition);
}
.card:hover { box-shadow: var(--shadow-md); transform: translateY(-1px); }
.card-title { font-size: 15px; font-weight: 700; margin-bottom: 14px; color: var(--text); box-shadow: inset 3px 0 0 #0B5438; padding-left: 10px; padding-top: 4px; }
/* v20260902ac：卡片底部条 —— 用来承载"自动保存提示" + "保存/重置/删除"等次要操作。
  比顶部按钮更克制：用户读完表格才看到辅助操作，不再跟主操作抢视觉位。 */
.card-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border-light); font-size: 13px; }
.grid-2col { display: grid; grid-template-columns: 1.3fr .7fr; gap: 20px; align-items: start; }
.grid-2col > .card { margin-bottom: 0; min-width: 0; }
/* v20260902j：驾驶舱底部两卡片（安全整改 / 法务整改）平均分布、强制等高 */
.grid-2col.grid-2col-equal { grid-template-columns: 1fr 1fr; align-items: stretch; }
.grid-2col.grid-2col-equal > .card { display: flex; flex-direction: column; }
.grid-2col.grid-2col-equal > .card .ck-sf-list { flex: 1; }

/* 填报页右侧卡片与左侧等高对齐，记录列表过长时内部滚动 */
#page-report .grid-2col { align-items: stretch; }
#page-report .grid-2col > .card { display: flex; flex-direction: column; }
.report-side-card .calc-box,
.report-side-card .card-title,
.report-side-card .alert { flex-shrink: 0; }
.report-side-card .today-list {
  flex: 1 1 auto;
  overflow: auto;
  min-height: 0;
  max-height: 420px;
}
@media (max-width: 1000px) {
  #page-report .grid-2col { align-items: start; }
  #page-report .grid-2col > .card { display: block; }
  .report-side-card .today-list { flex: none; max-height: none; overflow: visible; }
}

/* ---------- 表单 ---------- */
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; align-items: start; }
.form-group { display: flex; flex-direction: column; }
.form-group label { display: block; font-size: 13px; color: var(--text-sub); margin-bottom: 6px; min-height: 19px; line-height: 1.45; }
.form-group label .req { color: var(--danger); }
.form-group label .label-hint { font-size: 12px; color: var(--text-hint); font-weight: normal; margin-left: 2px; }
.form-group select, .form-group input, .form-group textarea { flex-shrink: 0; }
.form-group input[type="date"],
.form-group input[type="number"],
.form-group input[type="text"],
.form-group input[type="url"],
.form-group input[type="password"],
.form-group select,
.form-group textarea,
.login-input {
  width: 100%; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: 14px; font-family: inherit; outline: none; background: #fff;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(0,166,81,.12); }
.form-group textarea { resize: vertical; }
.form-group input[readonly],
.form-group select[disabled],
.form-group textarea[readonly] {
  background: #f5f7fa;
  color: var(--text-main);
  cursor: default;
  border-color: var(--border);
}
.form-group input[readonly]:focus,
.form-group select[disabled]:focus,
.form-group textarea[readonly]:focus {
  box-shadow: none;
  border-color: var(--border);
}
.form-label { display: block; font-size: 13px; color: var(--text-sub); margin-bottom: 6px; }
.form-actions { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.form-tip { font-size: 12px; color: var(--text-sub); }

/* v20260906o：填报页单位自动换算提示（输入框下方的实时换算回显） */
.unit-hint {
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-hint);
  margin: 4px 0 0;
  min-height: 0;
  transition: color .15s;
}
.unit-hint:empty { display: none; }
.unit-hint.ok { color: var(--success, #2e9e5b); }
.unit-hint.warn { color: var(--danger, #d64545); }

/* 自定义图表弹窗：标题输入区醒目 */
.cc-title-group {
  background: linear-gradient(135deg, rgba(0,166,81,0.06) 0%, rgba(0,166,81,0.02) 100%);
  border: 1.5px solid var(--primary);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  margin: 0 -4px 16px;
}
.cc-title-group label {
  font-size: 15px;
  font-weight: 700;
  color: var(--primary-dark);
  margin-bottom: 8px;
}
.cc-title-group input[type="text"] {
  font-size: 16px;
  font-weight: 600;
  padding: 12px 14px;
  border-width: 2px;
  border-color: var(--primary);
  background: #fff;
}
.cc-title-group input[type="text"]::placeholder { color: #a8b5c4; font-weight: 400; }
.cc-title-group input[type="text"]:focus {
  border-color: var(--primary-dark);
  box-shadow: 0 0 0 4px rgba(0,166,81,.16);
}

/* 数据看板自由网格：flex 布局支持卡片自由缩放（grid 下固定宽度无效） */
.dash-source-grid { display: none !important; }
.dash-free-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
  align-items: stretch;
}
.dash-free-grid > .dash-detail-card {
  flex: 0 0 100%;
  margin-bottom: 0;
}
/* 明细卡片进入自由网格后会被加上 .dash-sortable-card，须强制独占一行；
   overflow:visible 避免明细表横向滚动被卡片边界截断 */
.dash-free-grid > .dash-detail-card.dash-sortable-card {
  flex: 0 0 100%;
  margin-bottom: 0;
  overflow: visible;
}
.dash-free-grid > .dash-sortable-card:not(.dash-detail-card) {
  flex: 0 0 calc(50% - 10px);
  min-width: 300px;
  min-height: 96px;
}
.dash-free-grid > .dash-sortable-card.kpi-card {
  flex: 0 0 calc(16.666% - 17px);
  min-width: 140px;
  min-height: 110px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.dash-free-grid > .kpi-card { min-height: 110px; display: flex; flex-direction: column; justify-content: center; }
.dash-free-grid > .chart-card { margin-bottom: 0; }
.dash-free-grid .chart-box { height: 420px; }

/* 数据看板板块拖拽排序 */
#page-dashboard .dash-sortable-card {
  cursor: grab;
  position: relative;
  transition: border-color var(--transition), box-shadow var(--transition), opacity var(--transition);
  overflow: hidden;
}
#page-dashboard .dash-sortable-card:hover {
  border-color: var(--primary);
  box-shadow: 0 2px 12px rgba(0,166,81,.14);
}
#page-dashboard .dash-sortable-card:hover::before {
  content: '⠿ 拖动排序';
  position: absolute; top: 8px; left: 10px; z-index: 7; pointer-events: none;
  font-size: 11px; color: var(--primary-dark); white-space: nowrap;
  background: rgba(0,166,81,.1); border: 1px dashed var(--primary);
  border-radius: 6px; padding: 2px 8px;
}
#page-dashboard .dash-sortable-card.dash-dragging {
  opacity: .45; border-style: dashed; cursor: grabbing;
}
#page-dashboard .dash-sortable-card.dash-over {
  border-color: var(--primary-dark);
  box-shadow: 0 0 0 3px rgba(0,166,81,.22);
}
#page-dashboard .dash-sortable-card.dash-over::after {
  content: '⇩ 放到这里';
  position: absolute; top: 8px; left: 10px; z-index: 7; pointer-events: none;
  font-size: 11px; color: #fff; background: rgba(0,166,81,.75);
  border-radius: 6px; padding: 2px 8px;
}
/* 卡片右上角操作按钮（编辑 / 删除） */
#page-dashboard .dash-card-actions {
  position: absolute; top: 8px; right: 10px; z-index: 8;
  display: flex; gap: 4px; opacity: 0;
  transition: opacity .2s;
}
#page-dashboard .dash-sortable-card:hover .dash-card-actions { opacity: 1; }
#page-dashboard .dash-card-actions .dash-act-btn {
  width: 26px; height: 26px; line-height: 24px; text-align: center;
  font-size: 13px; cursor: pointer; border-radius: 6px;
  background: #fff; border: 1px solid #DCE4EC; color: #45505C;
  box-shadow: 0 1px 4px rgba(15,40,30,.08);
  user-select: none;
}
#page-dashboard .dash-card-actions .dash-act-btn:hover { border-color: var(--primary); color: var(--primary-dark); background: rgba(0,166,81,.06); }
#page-dashboard .dash-card-actions .dash-act-btn.dash-act-del:hover { border-color: var(--danger); color: var(--danger); background: rgba(220,50,47,.06); }
/* 卡片右下角缩放手柄 */
#page-dashboard .dash-resize-handle {
  position: absolute; right: 2px; bottom: 2px; z-index: 8;
  width: 16px; height: 16px; cursor: nwse-resize;
  opacity: 0; transition: opacity .2s;
  background:
    linear-gradient(135deg, transparent 0 48%, rgba(0,166,81,.85) 48% 55%, transparent 55% 68%, rgba(0,166,81,.85) 68% 75%, transparent 75%);
}
#page-dashboard .dash-sortable-card:hover .dash-resize-handle { opacity: .9; }
#page-dashboard .dash-resize-handle:hover { opacity: 1; }
#page-dashboard .dash-edit-title {
  margin-left: 8px;
  font-size: 13px;
  cursor: pointer;
  opacity: .55;
  transition: opacity .2s;
}
#page-dashboard .dash-edit-title:hover { opacity: 1; }
#page-dashboard .card-title:hover .dash-edit-title { opacity: .85; }

/* ---------- 计算区 ---------- */
.calc-box { display: flex; flex-direction: column; gap: 8px; }
.calc-item {
  background: var(--calc-bg); border: 1.5px solid #F0DFB2; border-radius: 10px;
  padding: 10px 12px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  transition: box-shadow var(--transition);
}
.calc-item:hover { box-shadow: 0 2px 8px rgba(183,121,31,.1); }
.calc-label { font-size: 13px; font-weight: 600; color: var(--text); width: 96px; }
.calc-value { font-size: 22px; font-weight: 800; color: var(--primary-dark); font-variant-numeric: tabular-nums; }
.calc-unit { font-size: 11px; color: var(--text-sub); margin-left: auto; text-align: right; }
.today-list { display: flex; flex-direction: column; gap: 8px; }
/* 当日填报表格（可按天直接查看填报数据 + 自动计算结果） */
.today-table { width: 100%; border-collapse: collapse; font-size: 12px; table-layout: fixed; min-width: 520px; }
.today-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; max-width: 100%; }
.today-table th, .today-table td {
  padding: 6px 8px; border-bottom: 1px solid var(--border-light); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.today-table th { background: var(--primary-faint); color: var(--text); font-weight: 600; text-align: center; }
.today-table td:first-child, .today-table td:nth-child(2) { text-align: left; }
.today-table tr:last-child td { border-bottom: none; }
.today-table .num { font-variant-numeric: tabular-nums; }
.today-table .tt-actions { text-align: center; white-space: nowrap; }
.today-table .tt-actions .btn { margin-left: 4px; }
/* 当日/当月数据概览卡片 */
.today-ov { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 12px 0 4px; }
.today-ov-card {
  border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px;
  background: #f8fafc; text-align: center;
}
.tov-label { font-size: 12px; color: var(--text-sub); margin-bottom: 4px; }
.tov-value { font-size: 20px; font-weight: 800; color: var(--primary-dark); font-variant-numeric: tabular-nums; }
.tov-value small { font-size: 12px; font-weight: 500; color: var(--text-sub); }
.today-item {
  border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 12px;
  display: flex; justify-content: space-between; align-items: center; font-size: 13px;
  background: #fff; transition: all var(--transition);
}
.today-item:hover { border-color: var(--primary-light); box-shadow: 0 2px 6px rgba(31,45,61,.05); }
.today-item .ti-left { display: flex; flex-direction: column; gap: 2px; }
.today-item .ti-station { font-weight: 600; }
.today-item .ti-meta { color: var(--text-sub); font-size: 12px; }
.today-item .ti-status { font-size: 12px; padding: 3px 10px; border-radius: 20px; }
.ti-status.ok { background: var(--success-light); color: var(--success); }
.today-date-sep {
  font-size: 12px; font-weight: 600; color: var(--text-sub);
  padding: 6px 0 2px; border-bottom: 1px dashed var(--border-light); margin-top: 6px;
}
.today-date-sep:first-child { margin-top: 0; }
.empty-tip { color: var(--text-sub); font-size: 13px; text-align: center; padding: 24px 0; }

/* ---------- 提示条 ---------- */
.alert { border-radius: 10px; padding: 12px 14px; font-size: 13px; line-height: 1.6; }
.alert-info { background: var(--primary-faint); border: 1px solid var(--primary-light); color: var(--text); }
.alert-warn { background: var(--warn-light); border: 1px solid #F0DFB2; color: #7A5A12; }
.alert-success { background: var(--success-light); border: 1px solid #BFE6D0; color: #1E6B45; }

/* ---------- 看板 KPI ---------- */
.kpi-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-bottom: 20px; }
.kpi-card {
  background: linear-gradient(135deg, #fff 0%, var(--primary-faint) 100%); border: none; border-radius: var(--radius);
  padding: 16px 14px; box-shadow: var(--shadow); position: relative; overflow: hidden;
  transition: all var(--transition);
}
.kpi-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.kpi-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #0B5438;
}
.kpi-card.kpi-danger::before { background: var(--danger); }
.kpi-card.kpi-danger .kpi-value { color: var(--danger); }
.kpi-card.kpi-warn::before { background: var(--warn); }
.kpi-label { font-size: 12px; color: var(--text-sub); }
.kpi-value { font-size: 24px; font-weight: 800; color: var(--text); margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.kpi-unit { font-size: 12px; color: var(--text-sub); }
.chart-grid-2 { display: grid; grid-template-columns: 1fr; gap: 20px; }
.chart-card { margin-bottom: 20px; }
.chart-card:hover { box-shadow: var(--shadow-md); }
.chart-box { width: 100%; height: 400px; }
@media (min-width: 992px) {
  .chart-grid-2 { grid-template-columns: 1fr 1fr; }
  .chart-grid-2 .chart-card:nth-child(4) .chart-box,
  .chart-grid-2 .chart-card:nth-last-child(1):nth-child(odd) .chart-box { height: 420px; }
}

/* ---------- 表格 ---------- */
.table-wrap {
  overflow-x: auto; overflow-y: visible;
  /* v20260902ab：去掉固定 height —— 之前 v20260902v 用 height 强制容器高度来让横向滚动条常驻底部，
     副作用是右侧永远多一条竖直滚动条（表格被"框"在 60vh 里，内容要么溢出滚动、要么底部留白），很碍眼。
     现在改回自然高度：表格多高容器就多高，页面整体滚动，右侧不再出现竖直滚动条。
     max-height 仅作极端兜底（表格超 3 屏才限制），绝大多数日常表格不会触发。 */
  max-height: 300vh;
  border-radius: var(--radius-sm);
  /* 滚动条预留固定 gutter，避免横滚动条出现/消失时表格跳动 */
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; min-width: 1100px; }
.data-table th, .data-table td { border-bottom: 1px solid var(--border); padding: 9px 10px; text-align: right; white-space: nowrap; }
/* v20260902ac：表头重叠修复 + 取消 sticky
  上一版 v20260902ab 用 sticky top:58px 让表头吸顶，本意是长表格滚时方便看列名。
  实际副作用：sticky 表头在内容上方浮动，跟下方数据行视觉上"骑"在一起（截图大哥指出的重叠）。
  修正：去掉 sticky 表头，回归"表头随数据自然滚"——宁可回头看一眼列名，也不要数据被表头压住。
  横向滚动条仍在容器底部，自然触发。 */
.data-table th { background: #0B5438; color: #fff; font-weight: 600; text-align: center; z-index: 5; }
.data-table th:first-child { border-top-left-radius: var(--radius-sm); }
.data-table th:last-child { border-top-right-radius: var(--radius-sm); }
.data-table td:first-child, .data-table th:first-child { text-align: center; }
.data-table td:nth-child(2), .data-table th:nth-child(2) { text-align: center; }
.data-table tbody tr:nth-child(even) td { background: #F6F9F8; }
.data-table tbody tr:hover td { background: var(--primary-faint); }
.data-table .num { font-variant-numeric: tabular-nums; }
.badge {
  background: var(--primary-light); color: var(--primary-dark); border-radius: 20px;
  padding: 2px 10px; font-size: 12px; font-weight: 600;
}
.cell-actions { display: flex; gap: 6px; justify-content: center; }

/* ---------- 设置页 ---------- */
.mode-banner {
  display: flex; align-items: center; gap: 8px; border-radius: 10px; padding: 12px 14px;
  margin-bottom: 14px; font-size: 14px; font-weight: 600;
}
.mode-banner.local { background: var(--danger-light); border: 1px solid #F5C6C0; color: var(--danger); }
.mode-banner.cloud { background: var(--success-light); border: 1px solid #BFE6D0; color: var(--success); }
.mode-dot { width: 10px; height: 10px; border-radius: 50%; background: currentColor; }
.help-text { color: var(--text-sub); font-size: 13px; margin-bottom: 12px; }
.steps { margin: 0 0 16px 20px; font-size: 13px; line-height: 1.9; color: var(--text); }
.sql-box {
  width: 100%; min-height: 180px; padding: 12px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-family: "Consolas", "Courier New", monospace; font-size: 12px; background: #F7F9FC;
  color: var(--text); resize: vertical; outline: none;
}
.divider { border: none; border-top: 1px solid var(--border); margin: 18px 0; }
.role-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; border-radius: var(--radius-sm); overflow: hidden; }
.role-table th, .role-table td { border-bottom: 1px solid var(--border); padding: 9px 10px; text-align: left; }
.role-table th { background: var(--primary-light); color: var(--primary-dark); }
.role-table tr:last-child td { border-bottom: none; }
.help-list { margin-left: 20px; font-size: 13px; line-height: 2; color: var(--text); }

/* ---------- 弹窗 ---------- */
.modal-mask {
  position: fixed; inset: 0; background: rgba(20,30,45,.5); z-index: 200;
  display: flex; align-items: center; justify-content: center; padding: 20px;
  animation: mask-in .2s ease;
}
@keyframes mask-in { from { opacity: 0; } to { opacity: 1; } }
.modal {
  background: #fff; border-radius: 16px; padding: 24px; width: 100%; max-width: 560px;
  max-height: 86vh; overflow-y: auto; box-shadow: var(--shadow-lg);
  animation: modal-in .25s ease;
}
@keyframes modal-in { from { opacity: 0; transform: scale(.96) translateY(10px); } to { opacity: 1; transform: scale(1) translateY(0); } }
.modal h3 { font-size: 17px; margin-bottom: 16px; }
.modal .form-grid { grid-template-columns: 1fr 1fr; }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

/* ---------- 统一确认弹窗（v20260902w） ---------- */
/* 替代浏览器原生 confirm()：标题居中、图标醒目、消息滚动、危险操作红框 */
.confirm-host { max-width: 460px; padding: 26px 26px 22px; }
.confirm-dialog { display: flex; flex-direction: column; align-items: center; text-align: center; }
.confirm-dialog .confirm-icon { font-size: 38px; line-height: 1; margin-bottom: 8px; filter: drop-shadow(0 2px 6px rgba(0,0,0,.08)); }
.confirm-dialog .confirm-title { font-size: 17px; font-weight: 700; color: var(--text); margin: 0 0 10px; line-height: 1.4; }
.confirm-dialog .confirm-message { font-size: 13.5px; color: var(--text-sub); line-height: 1.7; word-break: break-word; max-height: 40vh; overflow-y: auto; width: 100%; }
.confirm-dialog .confirm-message b, .confirm-dialog .confirm-message strong { color: var(--text); font-weight: 700; }
.confirm-dialog .modal-actions { width: 100%; justify-content: center; margin-top: 18px; gap: 12px; }
.confirm-dialog .modal-actions .btn { min-width: 96px; }
.confirm-dialog.is-danger { animation: confirm-shake .35s ease; }
.confirm-dialog.is-danger .confirm-icon { animation: confirm-icon-pulse 1.2s ease infinite; }
@keyframes confirm-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(2px); }
}
@keyframes confirm-icon-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

/* ---------- Toast ---------- */
.toast {
  position: fixed; left: 50%; bottom: 40px; transform: translateX(-50%);
  background: rgba(31,45,61,.92); color: #fff; padding: 12px 22px; border-radius: 10px;
  font-size: 14px; z-index: 300; box-shadow: var(--shadow-lg); max-width: 90vw;
  animation: toast-in .25s ease;
}
.toast.success { background: rgba(46,158,107,.95); }
.toast.error { background: rgba(192,57,43,.95); }
@keyframes toast-in { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* ---------- 底部 ---------- */
.footer { text-align: center; color: var(--text-sub); font-size: 12px; padding: 20px; }

/* ---------- 加载遮罩 ---------- */
.loading-mask {
  position: fixed; inset: 0; background: rgba(255,255,255,.85); z-index: 400;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
}
.spinner {
  width: 40px; height: 40px; border: 4px solid var(--primary-light);
  border-top-color: var(--primary); border-radius: 50%; animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- 响应式 ---------- */
@media (max-width: 1000px) {
  .kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .chart-grid-2 { grid-template-columns: 1fr; }
  .grid-2col { grid-template-columns: 1fr; }
  .dash-free-grid > .dash-sortable-card { flex: 0 0 100%; min-width: 0; }
  .dash-free-grid .chart-box { height: 320px; }
}
@media (max-width: 720px) {
  .topbar-inner { padding: 0 14px; gap: 10px; flex-wrap: wrap; min-height: 50px; }
  .brand-title { display: none; }
  .brand-logo { height: 34px; }
  .main-nav { order: 3; width: 100%; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-bottom: 6px; justify-content: flex-start; }
  .main-nav::after { content: ""; flex: 0 0 4px; }
  .nav-item { flex-shrink: 0; text-align: center; padding: 6px 10px; font-size: 13px; }
  .user-meta { display: none; }
  .user-box { gap: 8px; }
  .form-grid { grid-template-columns: 1fr 1fr; }
  .form-grid .form-group:nth-child(odd) { grid-column: 1; }
  .content { padding: 16px 12px 50px; }
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .dash-free-grid > .dash-sortable-card { flex: 0 0 100%; min-width: 0; }
  .dash-free-grid .chart-box { height: 300px; }
  .role-grid { grid-template-columns: 1fr; }
  .role-card { flex-direction: row; align-items: center; gap: 12px; padding: 12px 16px; }
  .role-icon { font-size: 22px; }
  .role-desc { margin-left: auto; }
  .page-head h2 { font-size: 18px; }
  .filter-bar { width: 100%; gap: 6px; }
  .filter-bar select { min-width: 0; flex: 1; }
  .filter-bar input { min-width: 0; flex: 2; }
  .filter-bar .btn { width: 100%; }
  .calc-value { font-size: 22px; }
  .card { padding: 16px 14px; }
  .modal { padding: 18px 16px; border-radius: 14px; }
}
@media (max-width: 420px) {
  .form-grid { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .btn-lg { width: 100%; }
  .nav-item { padding: 8px 8px; font-size: 12px; }
}


/* ---------- 复选框行 ---------- */
.checkbox-row { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.checkbox-row input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; }
.checkbox-row span { font-size: 14px; color: var(--text); }

/* ---------- 字段管理表格 ---------- */
.fm-table { min-width: 800px; }
.fm-table th, .fm-table td { text-align: left !important; }
.fm-table .col-idx { width: 40px; text-align: center !important; }
.fm-table .col-key code {
  background: #F0F4FA; padding: 2px 8px; border-radius: 4px;
  font-size: 12px; color: var(--primary-dark); font-family: "Consolas", monospace;
}
.fm-table .col-type { width: 80px; }
.fm-table .col-unit { width: 80px; }
.fm-table .col-flags { width: 120px; white-space: nowrap; }
.fm-table .col-actions { width: 200px; white-space: nowrap; }
.fm-table .col-actions button { margin-right: 4px; }
.fm-table .col-actions button:disabled { opacity: .3; }
.lock-note { font-size: 11px; color: var(--text-sub); margin-left: 4px; }

/* ---------- 标签 ---------- */
.req-tag {
  display: inline-block; background: var(--danger-light); color: var(--danger);
  padding: 1px 6px; border-radius: 4px; font-size: 11px; margin-right: 4px;
}
.sys-tag {
  display: inline-block; background: var(--primary-light); color: var(--primary-dark);
  padding: 1px 6px; border-radius: 4px; font-size: 11px;
}

/* ---------- 厂站管理 ---------- */
.station-list { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
/* v20260903f：站点分两类（厂站/营业所）展示 */
.station-kind-row { display: flex; align-items: flex-start; gap: 12px; margin-top: 8px; }
.station-kind-label {
  flex: none; width: 92px; padding-top: 7px;
  font-size: 12.5px; font-weight: 700; color: var(--text-sub);
  display: inline-flex; flex-direction: column; gap: 2px;
}
.station-kind-label i { font-style: normal; font-weight: 500; color: var(--text-faint, #9aa7b3); font-size: 11.5px; }
.station-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--primary-faint); border: 1px solid var(--primary-light);
  border-radius: 20px; padding: 6px 12px; font-size: 14px;
  transition: all var(--transition);
}
.station-chip:hover { box-shadow: 0 2px 6px rgba(31,45,61,.08); }
.station-chip .station-del {
  width: 22px; height: 22px; border-radius: 50%; padding: 0;
  border: none; background: transparent; color: var(--danger);
  font-size: 14px; cursor: pointer; line-height: 1;
}
.station-chip .station-del:hover { background: var(--danger-light); }
.station-add { display: flex; gap: 8px; align-items: center; }
.station-add input {
  padding: 6px 12px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: 14px; font-family: inherit; outline: none; width: 160px;
}
.station-add input:focus { border-color: var(--primary); }

/* ---------- 公司 / 厂站分组管理 ---------- */
.company-group {
  border: 1px solid var(--border); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 12px; background: var(--card-bg);
  transition: box-shadow var(--transition);
}
.company-group:hover { box-shadow: var(--shadow); }
.company-group:last-child { margin-bottom: 0; }
.company-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 10px;
}
.company-head .co-icon { font-size: 16px; }
.company-head .co-name {
  font-weight: 600; font-size: 15px; color: var(--text);
  border: 1px dashed transparent; border-radius: 6px;
  padding: 2px 6px; cursor: pointer; outline: none; min-width: 60px;
  background: transparent; font-family: inherit;
}
.company-head .co-name:hover { border-color: var(--primary-light); background: var(--primary-faint); }
.company-head .co-name:focus { border-color: var(--primary); background: var(--primary-faint); }
.company-head .co-count { font-size: 12px; color: var(--text-sub); }
.company-head .co-spacer { flex: 1; }
.company-body .station-list { margin-top: 8px; }
.station-del-note { font-size: 12px; color: var(--text-sub); }
.um-co-group { margin-bottom: 10px; }
/* 账号列表按公司分组标题行 */
.um-group-head td {
  background: rgba(0,166,81,.07);
  font-weight: 700;
  color: var(--primary-dark);
  padding: 8px 14px;
  border-bottom: 1px solid rgba(0,166,81,.18);
}
.um-group-head td .muted { font-weight: 400; }
.um-co-title {
  font-size: 13px; font-weight: 600; color: var(--primary-dark);
  border-bottom: 1px dashed var(--border); padding-bottom: 4px; margin-bottom: 6px;
  display: flex; align-items: center; gap: 8px;
}

/* ---------- 密码管理 ---------- */
.pw-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 0; border-bottom: 1px solid var(--border); gap: 16px; flex-wrap: wrap;
}
.pw-row:last-child { border-bottom: none; }
.pw-info { display: flex; align-items: center; gap: 10px; }
.pw-icon { font-size: 20px; }
.pw-role { font-weight: 600; font-size: 14px; }
.pw-status { font-size: 12px; }
.pw-status.pw-default { color: var(--warn); }
.pw-status.pw-changed { color: var(--success); }
.pw-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pw-input {
  width: 130px; padding: 7px 10px; border: 1.5px solid var(--border);
  border-radius: var(--radius-sm); font-size: 13px; font-family: inherit; outline: none;
}
.pw-input:focus { border-color: var(--primary); }

/* ---------- 响应式补充 ---------- */
@media (max-width: 720px) {
  .pw-row { flex-direction: column; align-items: flex-start; }
  .pw-form { width: 100%; }
  .pw-input { flex: 1; min-width: 0; }
  .fm-table .col-key, .fm-table .col-unit { display: none; }
}

/* ---------- 板块选择条（填报页） ---------- */
.module-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: var(--primary-faint); border: 1px solid var(--primary-light);
  border-radius: 10px; padding: 10px 14px; margin-bottom: 16px;
}
.module-bar-label { font-size: 13px; font-weight: 700; color: var(--primary-dark); }
.module-bar select {
  flex: 1; min-width: 160px; max-width: 320px; padding: 8px 12px;
  border: 1.5px solid var(--border); border-radius: var(--radius-sm); font-size: 14px;
  font-family: inherit; outline: none; background: #fff;
}
.module-bar select:focus { border-color: var(--primary); }

/* ---------- 模板选择下拉 ---------- */
.tpl-select {
  min-width: 200px; padding: 8px 12px; border: 1.5px solid var(--border);
  border-radius: var(--radius-sm); font-size: 14px; font-family: inherit; outline: none; background: #fff;
}
.tpl-select:focus { border-color: var(--primary); }

/* ---------- 角色标签 / 弱化文本 ---------- */
.role-chip {
  display: inline-block; background: var(--primary-light); color: var(--primary-dark);
  border-radius: 20px; padding: 2px 10px; font-size: 12px; font-weight: 600;
  margin: 2px 3px 2px 0; white-space: nowrap;
}
.muted { color: var(--text-sub); font-size: 12px; }

/* ---------- 配置勾选网格（看板/板块/账号弹窗） ---------- */
.cfg-check-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px; background: #F7F9FC; border: 1px solid var(--border);
  border-radius: 10px; padding: 12px; max-height: 220px; overflow-y: auto;
}
.cfg-check-grid .checkbox-row {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 8px 10px; transition: border-color var(--transition);
}
.cfg-check-grid .checkbox-row:hover { border-color: var(--primary); }

/* ---------- v20260906d：看板模板「图标卡片式」开关 ---------- */
.tpl-icon-cards {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: 10px; background: #F7F9FC; border: 1px solid var(--border);
  border-radius: 10px; padding: 12px;
}
.tpl-icon-card {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 14px 10px 16px; border: 1.5px solid var(--border); border-radius: 12px;
  background: #fff; cursor: pointer; transition: all .15s ease; text-align: center; user-select: none;
  min-height: 78px;
}
.tpl-icon-card .ic-emoji { font-size: 26px; line-height: 1; }
.tpl-icon-card .ic-label { font-size: 12.5px; color: var(--text); line-height: 1.3; }
.tpl-icon-card:hover { border-color: var(--primary); transform: translateY(-1px); }
.tpl-icon-card.on {
  border-color: var(--primary); background: var(--primary-faint);
  box-shadow: 0 2px 10px rgba(11, 84, 56, .12);
}
.tpl-icon-card.on::after {
  content: '✓'; position: absolute; top: 6px; right: 8px;
  color: var(--primary); font-weight: 700; font-size: 13px;
}
.tpl-icon-card.off { opacity: .5; }
.tpl-icon-card.off:hover { opacity: .8; }
.tpl-icon-card .ic-def {
  position: absolute; bottom: 6px; font-size: 10px; color: var(--primary); font-weight: 600;
}
.tpl-icon-card .ic-setdef {
  position: absolute; bottom: 6px; font-size: 10px; padding: 2px 7px; cursor: pointer;
  border: 1px solid var(--primary); border-radius: 10px; background: #fff; color: var(--primary);
}

/* ---------- 看板筛选条 ---------- */
.dash-filter {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 12px 16px; margin-bottom: 18px; box-shadow: var(--shadow);
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
}
.dash-filter select, .dash-filter input[type="date"], .dash-filter input[type="search"] {
  padding: 8px 12px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: 13px; font-family: inherit; outline: none; background: #fff;
  transition: border-color var(--transition);
}
.dash-filter select:focus, .dash-filter input[type="date"]:focus, .dash-filter input[type="search"]:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(0,166,81,.1); }
.dash-filter select:hover, .dash-filter input[type="date"]:hover, .dash-filter input[type="search"]:hover { border-color: var(--primary-light); }
#dash-month-wrap { display: inline-flex; gap: 6px; align-items: center; }
#dash-custom-wrap { display: inline-flex; gap: 6px; align-items: center; }

/* ---------- 看板明细（可折叠 + 固定高度） ---------- */
.dash-detail-card { margin-bottom: 8px; padding: 8px 14px; }
.dash-detail-card .card-title { margin-bottom: 0; padding-top: 2px; padding-bottom: 2px; font-size: 14px; }
.dash-detail-head { cursor: pointer; user-select: none; }
.dash-detail-head:hover { color: var(--primary); }
.dash-detail-head:hover .dash-detail-toggle { color: var(--primary); }
.dash-detail-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 6px;
  font-size: 12px; color: var(--text-sub); background: var(--primary-faint);
  transition: transform var(--transition), background var(--transition);
}
.dash-detail-body {
  max-height: 360px; overflow-y: auto;
  transition: max-height .25s ease, opacity .2s ease, padding .25s ease;
  padding-top: 6px;
}
.dash-detail-card.collapsed .dash-detail-body {
  max-height: 0; opacity: 0; overflow: hidden; padding-top: 0; padding-bottom: 0;
}
.dash-detail-card.collapsed .dash-detail-toggle { transform: rotate(-90deg); }
#detail-wrap .data-table { margin-bottom: 0; }
/* v20260906s：明细表太高时横向滚动条沉在表格最底看不见——给看板明细容器限高，
   让「左右横拉栏」始终出现在可视范围内（表格内部滚动，页面不再被拉长） */
#dash-detail-card .table-wrap {
  max-height: 62vh;
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#dash-detail-card .data-table th { position: sticky; top: 0; z-index: 6; }
/* v20260906y：明细横拉条沉在最底，调左右时看不见表头数据——给容器顶部插一条联动横拉栏，
   滚动条紧贴表头下面，调左右时一眼看得到当前在看哪几列；纵滚时横拉栏一直钉在容器顶 */
#dash-detail-card .table-h-scroll {
  position: sticky; top: 0; left: 0; right: 0;
  height: 14px;
  overflow-x: auto; overflow-y: hidden;
  background: var(--bg-card, #fff);
  border-bottom: 1px solid var(--border-light, #e5e7eb);
  z-index: 7;
}
#dash-detail-card .table-h-scroll-inner { height: 1px; }

/* v20260906z：每张图表卡标题旁的「汇总/按公司」徽章——大哥反馈"怎么让人知道这张卡是按公司显现的数据"。
   默认汇总态（淡灰），点了切到按公司对比（主色填充，一眼能看出当前是分组对比）；
   复用 card-title 容器内的内联布局，标题左对齐 + 徽章右贴不挡图 */
.dim-badge {
  display: inline-flex; align-items: center;
  margin-left: 10px;
  height: 22px; padding: 0 10px;
  font-size: 12px; font-weight: 500;
  background: #f1f5f4; color: var(--text-sub, #475569);
  border: 1px solid var(--border-light, #e5e7eb); border-radius: 11px;
  cursor: pointer; user-select: none;
  transition: all .12s;
  vertical-align: middle;
}
.dim-badge:hover { border-color: var(--primary, #007A32); color: var(--primary, #007A32); }
.dim-badge.dim-badge-on {
  background: var(--primary, #007A32); color: #fff;
  border-color: var(--primary, #007A32); font-weight: 600;
}
.dim-badge::before {
  content: '📊';
  margin-right: 4px;
  font-size: 11px;
}

/* ---------- 多选下拉（公司 / 厂站筛选） ---------- */
.ms { position: relative; display: inline-block; }
.ms-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 12px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: 13px; font-family: inherit; background: #fff; color: var(--text);
  cursor: pointer; outline: none; transition: border-color var(--transition);
  max-width: 240px; white-space: nowrap;
}
.ms-btn:hover { border-color: var(--primary-light); }
.ms-btn:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(0,166,81,.1); }
.ms-btn:disabled { background: #F2F5F8; color: var(--text-sub); cursor: not-allowed; }
.ms-btn .label { overflow: hidden; text-overflow: ellipsis; }
.ms-btn .caret { color: var(--text-sub); font-size: 11px; }
.ms-panel {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; z-index: 60;
  min-width: 180px; max-width: 300px; max-height: 320px; overflow: auto;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: 0 8px 24px rgba(31,56,88,.14); padding: 6px;
}
.ms.open .ms-panel { display: block; }
.ms-actions { display: flex; gap: 8px; padding: 4px 6px 8px; border-bottom: 1px dashed var(--border); margin-bottom: 4px; }
.ms-actions button {
  border: none; background: none; font-size: 12px; color: var(--primary);
  cursor: pointer; padding: 2px 4px; font-family: inherit;
}
.ms-actions button:hover { text-decoration: underline; }
.ms-item {
  display: flex; align-items: center; gap: 8px; padding: 6px 8px;
  border-radius: var(--radius-sm); cursor: pointer; font-size: 13px;
}
.ms-item:hover { background: var(--primary-faint); }
.ms-item input[type="checkbox"] {
  flex-shrink: 0; margin: 0; width: 16px !important; height: 16px !important;
  min-width: 16px; max-width: 16px; min-height: 16px; max-height: 16px;
  accent-color: var(--primary); cursor: pointer;
  vertical-align: middle;
}
.ms-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 分组单选下拉（v20260902w 替代原生 <select>） ---------- */
/* 用于「板块选择」等多组多选一场景，按组显示 */
.gp { position: relative; display: inline-block; }
.gp-btn {
  border: 1px solid var(--border); background: #fff; border-radius: var(--radius-sm);
  padding: 7px 14px; font-size: 13px; color: var(--text); cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  transition: border-color .15s, box-shadow .15s;
}
.gp-btn:hover { border-color: var(--primary-light); }
.gp-btn:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(0,166,81,.1); outline: 0; }
.gp-btn .label { font-weight: 600; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-btn .caret { color: var(--text-sub); font-size: 11px; }
.gp-panel {
  position: absolute; left: 0; top: calc(100% + 6px); z-index: 90;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: 0 6px 24px rgba(31,45,61,.14);
  padding: 6px; min-width: 220px; max-width: 320px;
  display: none;
}
.gp.open .gp-panel { display: block; }
.gp-group { padding: 4px 0; }
.gp-group + .gp-group { border-top: 1px dashed var(--border-light); margin-top: 4px; padding-top: 8px; }
.gp-group-title {
  font-size: 11.5px; font-weight: 700; color: var(--text-sub);
  padding: 4px 10px 6px; letter-spacing: .3px;
}
.gp-item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 8px 10px; border-radius: 6px; font-size: 13px;
  background: transparent; border: 0; color: var(--text); cursor: pointer; text-align: left;
  transition: background-color .12s, color .12s;
}
.gp-item:hover { background: var(--primary-faint); color: var(--primary); }
.gp-item.active { background: var(--primary); color: #fff; font-weight: 600; }
.gp-item.active .gp-item-check { color: #fff; }
.gp-item-check { margin-left: auto; font-size: 14px; opacity: .9; }
.gp-item-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 640px) {
  .gp-panel { left: 0; right: auto; min-width: 200px; }
  .gp-btn .label { max-width: 140px; }
}
@media (max-width: 768px) {
  .ms { width: 100%; }
  .ms-btn { width: 100%; }
}

/* ---------- 自定义说明页内容 ---------- */
.custom-content {
  font-size: 14px; line-height: 1.9; color: var(--text);
  white-space: pre-wrap; word-break: break-word;
}

/* ---------- 字段管理列 ---------- */
.fm-table .col-label { min-width: 140px; }

/* ---------- 看板配置弹窗勾选项 ---------- */
.cfg-item {
  display: flex; align-items: center; gap: 8px;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 8px 10px; cursor: pointer; font-size: 13px;
  transition: border-color var(--transition);
}
.cfg-item:hover { border-color: var(--primary); }
.cfg-item input { width: 16px; height: 16px; cursor: pointer; }

/* ---------- 模板绑定面板 ---------- */
.fm-bind-table { min-width: 600px; }
.fm-bind-table th, .fm-bind-table td { text-align: left !important; }
.fm-bind-table .fm-bind-status {
  display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600;
}
.fm-bind-status.current { background: var(--success-light); color: var(--success); }

/* ---------- 图表空状态 ---------- */
.chart-box:empty::before {
  content: "暂无数据"; display: flex; align-items: center; justify-content: center;
  height: 100%; color: var(--text-hint); font-size: 14px;
}

/* ---------- 图表组件加载失败提示（与"暂无数据"区分开，避免误导） ---------- */
.chart-error {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 100%; padding: 16px; text-align: center;
  color: var(--warn, #E6A23C); background: rgba(230, 162, 60, .06);
  border: 1px dashed rgba(230, 162, 60, .35); border-radius: 8px; box-sizing: border-box;
}
.chart-error-title { font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.chart-error-msg { font-size: 12px; opacity: .85; line-height: 1.6; }
.chart-error-hint { font-size: 12px; opacity: .75; margin-top: 8px; }

/* ---------- 页面标题增强 ---------- */
.page-head {
  display: flex; align-items: center; gap: 8px;
  padding-bottom: 6px; border-bottom: 1px solid var(--border-light);
  margin-bottom: 10px;
}
/* v20260902i：icon 进一步缩到 18×18，更克制 */
.page-head-icon { font-size: 11px; flex-shrink: 0; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; background: rgba(31,45,61,.04); border-radius: 4px; filter: grayscale(.55); opacity: .82; }
.page-head-text { flex: 1; min-width: 0; }
.page-head h2 { font-size: 16px; color: var(--text); font-weight: 700; line-height: 1.3; margin: 0; }
.page-desc { color: var(--text-sub); margin-top: 0; font-size: 12px; line-height: 1.45; }

/* ---------- 面包屑/快速操作 ---------- */
.page-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- 操作留痕（按天折叠 + 紧凑卡片） ---------- */
.audit-box {
  max-height: 380px; overflow-y: auto;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: #FAFCFB; padding: 8px 10px;
}
.audit-day { margin-bottom: 8px; }
.audit-day:last-child { margin-bottom: 0; }
.audit-day-head {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px;
  background: #fff; border: 1px solid var(--border); border-radius: 8px;
  cursor: pointer; user-select: none; transition: background .15s;
}
.audit-day-head:hover { background: var(--primary-faint); }
.audit-day-head.collapsed .audit-day-toggle { color: var(--text-sub); }
.audit-day-date { font-size: 13px; font-weight: 700; color: var(--primary-dark); }
.audit-day-count {
  font-size: 11px; color: var(--text-sub); background: var(--primary-faint);
  padding: 1px 7px; border-radius: 10px; font-weight: 600;
}
.audit-day-toggle { margin-left: auto; font-size: 12px; color: var(--primary); font-weight: 600; }
.audit-day-list {
  display: flex; flex-direction: column; gap: 6px; padding: 8px 4px 4px 8px;
}
.audit-day-list.hidden { display: none; }
.audit-card {
  background: #fff; border: 1px solid var(--border-light); border-left: 3px solid var(--primary-light);
  border-radius: 7px; padding: 8px 10px; font-size: 12.5px; line-height: 1.6;
}
.audit-card-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.audit-time { color: var(--text-hint); font-variant-numeric: tabular-nums; font-size: 12px; }
.audit-action {
  display: inline-block; font-weight: 700; border-radius: 4px; padding: 1px 7px; font-size: 11.5px;
}
.audit-action.audit-add { background: var(--success-light); color: var(--success); }
.audit-action.audit-edit { background: var(--info-light); color: var(--info); }
.audit-action.audit-del { background: var(--danger-light); color: var(--danger); }
.audit-user { font-weight: 600; color: var(--text); }
.audit-user .audit-role {
  font-style: normal; font-weight: 500; font-size: 11px; color: var(--text-sub);
  margin-left: 4px; padding-left: 6px; border-left: 1px solid var(--border);
}
.audit-brief { color: var(--text-sub); font-size: 12px; }
.audit-toggle { margin-left: auto; padding: 2px 8px; font-size: 11.5px; }
.audit-card-ctx { color: var(--text-sub); margin-top: 3px; font-size: 12px; }
.audit-card-detail {
  margin-top: 6px; padding: 6px 8px; background: #F7FAF9; border-radius: 5px;
  border-left: 2px solid var(--primary); font-size: 12px; line-height: 1.7;
  color: var(--text-sub); word-break: break-all;
}
.audit-card-detail.hidden { display: none; }
.audit-role { font-size: 11px; color: var(--text-sub); }
.audit-detail-cell {
  text-align: left !important; padding: 10px 14px;
  font-size: 12px; color: var(--text-sub); line-height: 1.7;
  word-break: break-all;
}
.audit-detail-cell br { display: block; margin-bottom: 2px; content: ""; }

/* ============================================================
   v20260901a 水务日报系统升级样式
   - 配色：水务绿 #00A651（v20260901d 对齐 HHO 门户风格）
   - 布局：顶栏 + 侧边栏（五大板块分组导航）+ 内容区
   - 组件：驾驶舱指标卡 / 安全整改状态 / 法务台账
   ============================================================ */

/* ---------- 主题色覆盖（水务绿 #00A651，对齐 HHO 门户风格 v20260901d） ---------- */
:root {
  --primary: #00A651;
  --primary-dark: #008040;
  --primary-light: #E6F7EF;
  --primary-faint: #F0FBF5;
  --bg: #EDF1F3;
  --bg-alt: #E4E9EB;
  --border: #DDE3E3;
  --border-light: #E5EAEA;
  --shadow: 0 2px 8px rgba(0,60,30,.06), 0 1px 3px rgba(0,60,30,.04);
  --shadow-md: 0 6px 20px rgba(0,60,30,.10), 0 2px 6px rgba(0,60,30,.05);
  --shadow-lg: 0 12px 36px rgba(0,60,30,.14), 0 4px 12px rgba(0,60,30,.07);
}

/* ---------- 顶栏：v20260902ah 改为深绿底（与侧栏同色，顶部 logo/搜索框/账号区统一配色） ---------- */
.topbar {
  background: linear-gradient(180deg, #0E6B43 0%, #08432A 100%);
  border-bottom: 1px solid rgba(0,0,0,.18);
  box-shadow: 0 2px 6px rgba(0,0,0,.10);
}
.brand-title { color: #fff; font-weight: 700; }
.user-name { color: #fff; font-weight: 600; }
.user-role { color: rgba(255,255,255,.7); }
.topbar .btn-ghost { color: rgba(255,255,255,.92); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.06); }
.topbar .btn-ghost:hover { background: rgba(255,255,255,.18); color: #fff; border-color: rgba(255,255,255,.55); }
.user-badge { background: rgba(255,255,255,.18); color: #fff; }
/* 顶栏上的"快速填报"主按钮：浅底深字，保证在深绿顶栏上仍高对比 */
.topbar .btn-primary { background: #fff; color: #0a6b40; border-color: #fff; }
.topbar .btn-primary:hover { background: #f0f7f4; color: #0a6b40; border-color: #f0f7f4; }
/* 顶栏搜索按钮：白圈描边 + 透明底，与深绿顶栏和谐 */
.topbar-search-btn { color: #fff; border: 1px solid rgba(255,255,255,.30); background: rgba(255,255,255,.06); }
.topbar-search-btn:hover { background: rgba(255,255,255,.18); border-color: #fff; color: #fff; }
/* 顶栏页名 slot：白色文字，与深绿底对比 */
.topbar-page-name { color: #fff; }

/* ---------- 侧边栏：v20260902z 重做（玻璃感渐变深绿 + 容器感阴影 + 行业图标）---------- */
/* v20260902z 设计思路：
   - 侧栏从"贴墙深绿"升级到"渐变深绿"，从顶部亮 → 底部暗，制造容器空间感
   - 主区加 16px 左 padding + 浅灰背景，让左右两边天然有"凹陷"对比
   - 一级菜单加 emoji 行业图标（从 cockpit 的 SVG 图标同源），选中态保留左竖条 + 加绿色圆点
   - 整体气质：从"贴上去的侧栏"→"专业管理控制台驾驶舱" */
.app-body { display: flex; flex: 1; min-height: 0; align-items: stretch; background: var(--bg); }
.sidebar {
  width: 240px; flex: 0 0 240px; flex-shrink: 0;
  /* v20260902z：渐变深绿（顶部 #0E6B43 → 底部 #053A24），中间层次模拟"凹陷"立体感 */
  background: linear-gradient(180deg, #0E6B43 0%, #08432A 55%, #053A24 100%);
  position: sticky; top: 58px; align-self: flex-start;
  height: calc(100vh - 58px); max-height: calc(100vh - 58px);
  overflow-y: auto; overscroll-behavior: contain;
  padding: 18px 0 16px; display: flex; flex-direction: column;
  /* v20260902z：右侧加 4px 深色阴影边界，让侧栏从主区"凸起"出来，制造容器感 */
  box-shadow: 4px 0 16px rgba(5,58,36,.16), 1px 0 0 rgba(255,255,255,.04) inset;
}
.main-nav { display: flex; flex-direction: column; gap: 2px; align-items: stretch; }

/* 分组之间的统一分割线：上间距均衡，消除参差不齐 */
.nav-group { margin-bottom: 4px; border-top: 1px solid rgba(255,255,255,.07); padding-top: 10px; }
.nav-group:first-of-type { border-top: none; padding-top: 0; }
.nav-group:last-of-type { margin-bottom: 0; }

/* v20260902aj：侧栏统一对齐锚点 ——
   红线 = 侧栏最左边缘；侧栏内容起始点全部用 var(--nav-content-x) 控制：
   - 一级标题文字、二级菜单图标、选中态左竖条全 = 14px 同一基线
   - 改一个变量，整侧栏基线一起动，永不打架
   历史教训：之前改 padding 是 14/14/28/各居各，撞了基线调一整天 */
:root { --nav-content-x: 14px; }

/* 一级菜单（分组标题）：左对齐、无图标、字号更克制、箭头统一靠右、高度适中 */
.nav-group-title {
  display: flex; align-items: center;
  height: 38px;
  padding: 0 14px 0 var(--nav-content-x);     /* v20260902aj：左对齐锚点变量 */
  font-size: 13.5px; font-weight: 600;
  color: rgba(255,255,255,.92);
  letter-spacing: .6px;
  cursor: pointer; user-select: none;
  position: relative;
  transition: color .15s;
}
/* 左侧 4px 圆点指示器：默认隐藏，hover 时淡入（替代图标位的克制指示） */
.nav-group-title::before {
  content: "";
  position: absolute; left: 0; top: 50%;     /* v20260902aj：圆点移到对齐锚点（即红线） */
  width: 4px; height: 4px; border-radius: 50%;
  background: rgba(46,212,122,.7);
  transform: translateY(-50%) scale(0);
  transition: transform .15s ease, left .15s ease;
}
.nav-group-title:hover::before { left: var(--nav-content-x); transform: translateY(-50%) scale(1); }
.nav-group-title:hover { color: rgba(255,255,255,.95); }
/* 箭头：margin-left:auto 推到最右，距导航栏右侧恒定 18px，所有一级项一致 */
.nav-group-title::after {
  content: "\25BE";
  margin-left: auto; flex-shrink: 0;
  width: 12px; text-align: right;
  font-size: 10px;
  color: rgba(255,255,255,.32);
  transition: transform .22s ease, color .15s;
  display: inline-flex; align-items: center; justify-content: flex-end;
  line-height: 1;
}
.nav-group-title:hover::after { color: rgba(255,255,255,.7); }
.nav-group.collapsed .nav-group-title::after { transform: rotate(-90deg); }

/* 折叠容器：柔和顺滑（高度 + 透明度过渡） */
.nav-group-items {
  overflow: hidden;
  max-height: 1200px;
  opacity: 1;
  transition: max-height .3s cubic-bezier(.4,0,.2,1), opacity .25s ease;
}
.nav-group.collapsed .nav-group-items { max-height: 0; opacity: 0; }

/* 二级菜单项：与一级同基线左对齐 ——
   v20260902aj 改为：margin 0 + padding-left 跟一级标题共用 --nav-content-x，
   容器不再左右 8px 内缩进，二级图标起点 = 红线 = 14px，跟一级标题文字起点对齐。
   唯一例外：margin-top 1px + 容器左内缩 6px（保留小间隔） */
.nav-item {
  display: flex; align-items: center;
  height: 36px;
  margin: 1px 6px 1px 6px;                  /* v20260902aj：左右 8→6，对齐锚点更严 */
  width: calc(100% - 12px);
  padding: 0 12px 0 8px;   /* v20260905f：6px 缩进 + 8px 内边距 = 14px，让图标/选中条与一级标题文字对齐 */
  font-size: 13.5px; font-weight: 500; font-family: inherit;
  color: rgba(255,255,255,.92);
  cursor: pointer;
  border: none; background: transparent; border-radius: 7px;
  box-sizing: border-box; position: relative;
  white-space: nowrap; flex-shrink: 0; text-align: left;
  transition: background .15s ease, color .15s ease;
}
.nav-item-icon {
  display: flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; min-width: 16px;
  margin-right: 9px; flex-shrink: 0;   /* 图标与文字固定间距 9px */
  color: inherit; opacity: .88;
}
.nav-item-icon svg { width: 16px; height: 16px; display: block; }
.nav-item-text {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  line-height: 1.3;
}

/* 选中态：去掉白色大圆角浮框 → 左侧竖高亮条 + 文字变亮 + 浅绿底色（不跳出卡片） */
.nav-item::before {
  content: ""; position: absolute;
  left: 8px; top: 7px; bottom: 7px; width: 3px;   /* v20260905f：6px 缩进 + 8px = 14px 对齐锚点 */
  border-radius: 0 3px 3px 0;
  background: transparent;
  transition: background .15s ease;
}
/* 选中态：v20260902aj 改成薄荷绿实色底 + 深绿文字（与深绿侧栏同色系但亮一档）——
   大哥原话："换个跟绿色搭配完美的颜色"。薄荷绿 #7BE0A8 是深绿 #0E6B43 的"亮一档"补色，
   同色系搭配永远最稳；深绿 #053A24 文字在亮薄荷底上对比度爆表。
   - 整行实色亮薄荷（#A8F0C8 → #7BE0A8 渐变）
   - 文字深绿 #053A24 加粗
   - 图标也变深绿
   - 左侧 3px 白色竖条保留（视觉锚点，跟一级圆点呼应） */
.nav-item.active::before { background: #fff; width: 3px; }
.nav-item.active {
  background: linear-gradient(90deg, #A8F0C8 0%, #7BE0A8 100%);
  color: #053A24; font-weight: 700;
  box-shadow: 0 2px 6px rgba(123,224,168,.35), inset 0 0 0 1px rgba(255,255,255,.18);
}
.nav-item.active .nav-item-icon { color: #053A24; opacity: 1; }
.nav-item.active::after { display: none; }          /* 中和顶栏遗留底边条，避免重复浮层 */
.nav-item.active:hover { background: linear-gradient(90deg, #C5F4DB 0%, #A8F0C8 100%); }

/* hover：轻微底色变化，无大白框 */
.nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.nav-item:hover .nav-item-icon { color: #fff; opacity: 1; }

/* 底部版本：sticky 兜底 + 紧凑两行 chip（v20260902g 精修） */
.sidebar-foot {
  position: sticky; bottom: 0;
  margin-top: auto; padding: 12px 16px 12px;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.18) 35%, rgba(0,0,0,.22) 100%);
  border-top: 1px solid rgba(255,255,255,.12);
  font-size: 10.5px; line-height: 1.5;
  color: rgba(255,255,255,.42);
  letter-spacing: .3px; flex-shrink: 0;
  display: flex; align-items: center; gap: 8px;
  z-index: 2;
}
.sidebar-foot .sf-tag {
  display: inline-flex; align-items: center;
  padding: 1px 6px; border-radius: 3px;
  background: rgba(46,212,122,.22); color: #7BE0A8;        /* v20260902ai：文字提亮，浅绿徽章更醒目 */
  font-size: 9.5px; font-weight: 700; letter-spacing: .4px;
  font-family: 'SF Mono', Menlo, Consolas, monospace;
}
.sidebar-foot .sf-name {
  color: rgba(255,255,255,.88); font-weight: 500;           /* v20260902ai：.55→.88 系统名清晰 */
}
/* v20260902z：主区左右 padding 加大，让侧栏（深绿）和主区（浅灰）天然形成「凹陷」对比容器感。
   同时主区背景由透明（继承 body 浅灰）改为白色卡片感，凸显"驾驶舱中控台"气质。 */
.content {
  flex: 1; width: 100%; max-width: 1280px; margin: 0 auto;
  padding: 22px 28px 60px 28px;       /* 左 padding 与右一致，强化中央视觉 */
  position: relative;
}
.content::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 180px;
  background: linear-gradient(180deg, rgba(11,84,56,.08) 0%, transparent 100%);
  pointer-events: none; z-index: 0; border-radius: 0 0 16px 16px;
}
.content > * { position: relative; z-index: 1; }

/* 移动端：侧边栏折叠为顶部横向分组条 */
@media (max-width: 860px) {
  .app-body { flex-direction: column; }
  .sidebar {
    position: static; width: 100%; height: auto;
    background: #0B5438; border-bottom: none;
    padding: 10px 12px; overflow: visible;
  }
  .main-nav { flex-direction: row; flex-wrap: wrap; gap: 4px; }
  .nav-group { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-bottom: 0; }
  .nav-group-title {
    height: auto; padding: 5px 10px;
    font-size: 11px; background: rgba(255,255,255,.15); color: rgba(255,255,255,.9);
    letter-spacing: .5px; border-radius: 4px;
  }
  .nav-group-title::before, .nav-group-title::after { display: none; }
  .nav-group-items { display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px; max-height: none !important; }
  .nav-group.collapsed .nav-group-items { display: none; }
  .nav-item {
    width: auto; margin: 0; padding: 5px 10px; font-size: 12.5px; height: auto;
    color: rgba(255,255,255,.8); background: transparent; border-radius: 6px;
  }
  .nav-item:hover { color: #fff; background: rgba(255,255,255,.1); }
  .nav-item-icon { display: none; }
  .nav-item.active {
    background: rgba(46,212,122,.24); color: #fff; box-shadow: none;
  }
  .nav-item.active::before { display: none; }
  .nav-item.active::after { display: none; }
  .sidebar-foot { display: none; }
  .content { padding: 16px 14px 50px; }
}

/* ---------- 驾驶舱 ---------- */
/* v20260902p：紧凑标题条，替代原 page-head 的双行结构（图标 + h2 + p 占两行）；
   标题 + 描述一行 flex 显示，工具栏紧贴下方，整体视觉重心从 page-head 收敛到工具栏 */
.ck-toolbar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 10px 14px; margin-bottom: 18px; box-shadow: var(--shadow);
}
.dim-toggle {
  display: inline-flex; background: var(--bg-alt); border-radius: 8px; padding: 3px; gap: 2px;
}
.dim-btn {
  border: none; background: transparent; padding: 6px 18px; border-radius: 6px;
  font-size: 13px; font-family: inherit; color: var(--text-sub); cursor: pointer;
  font-weight: 600; transition: all var(--transition);
}
.dim-btn.active { background: #fff; color: var(--primary); box-shadow: 0 1px 4px rgba(31,45,61,.12); }
.ck-caption { font-size: 12.5px; color: var(--text-sub); margin-left: auto; }

/* 日期/月份输入框（紧凑胶囊风格，v20260902d 改） */
.ck-input {
  height: 32px; padding: 0 32px 0 32px; min-width: 110px;
  border: 1px solid var(--border); border-radius: 18px;
  background-color: #fff;
  background-repeat: no-repeat;
  font-size: 13px; font-family: inherit; font-weight: 600; color: var(--text);
  outline: none; cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background-color .15s;
  flex-shrink: 0;
}
.ck-input:hover { border-color: var(--primary); background-color: #FAFFFB; }
.ck-input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(0,166,81,.12); }
.ck-input::placeholder { color: var(--text-hint); font-weight: 400; }
/* select：仅右侧下拉箭头 */
select.ck-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='%238A97A5'%3E%3Cpath d='M3 4.5l3 3 3-3'/%3E%3C/svg%3E");
  background-position: right 12px center; background-size: 10px 10px;
  appearance: none;
  min-width: 130px;
}
/* date input：左侧日历 + 右侧原生选择图标（提供透明占位避免遮挡） */
input[type="date"].ck-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2300A651'%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10h14V4H1z'/%3E%3C/svg%3E");
  background-position: 10px center; background-size: 14px 14px;
  padding-right: 30px; min-width: 124px;
}
#ck-custom-from, #ck-custom-to { min-width: 110px; }
.ck-tilde { color: var(--text-hint); font-size: 13px; padding: 0 2px; }

/* 五大板块快捷入口 */
.ck-entries { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 18px; }
@media (max-width: 1000px) { .ck-entries { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .ck-entries { grid-template-columns: repeat(2, 1fr); } }
.ck-entry {
  display: flex; align-items: center; gap: 10px; text-align: left;
  background: #fff; border: none; border-radius: var(--radius);
  padding: 12px 14px; cursor: pointer; transition: all var(--transition); font-family: inherit;
  min-width: 0; box-shadow: var(--shadow);
}
.ck-entry:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.ck-entry-off { opacity: .45; cursor: not-allowed; }
/* v20260902e：适配 inline SVG 线性图标（替代原 emoji 块） */
.ck-entry-icon { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex-shrink: 0; color: #0B5438; background: rgba(11,84,56,.08); border-radius: 8px; }
.ck-entry-icon svg { width: 18px; height: 18px; }
.ck-entry-text { min-width: 0; }
.ck-entry-name { display: block; font-size: 14px; font-weight: 700; color: var(--text); }
.ck-entry-desc { display: block; font-size: 11px; color: var(--text-hint); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-entry-count { margin-left: auto; flex-shrink: 0; font-size: 11px; font-weight: 700;
  background: var(--primary-faint); color: var(--primary); padding: 2px 8px; border-radius: 10px; }

/* KPI 分板块指标卡 */
/* v20260902z 改版：三大板块用专属色块一眼区分——
   - 生产运行：主色水务绿（取水/制水/损耗等水厂一线数据）
   - 营业分析：营收质量改蓝色（应收/实收/回收率/抄见率都是"钱+服务"指标）
   - 财务管理：财务盈亏改紫色（利润/应收余额/折旧是典型财务语义）
   改法：把原来 3px 顶部色条升级为「左竖色条 + 板块专属浅色头 + emoji图标 + 标题同色」
   —— 用户一眼看到色块就知道这是哪个域，看 KPI 不需要"先读标题"再判断。 */
.ck-kpis { display: flex; flex-direction: column; gap: 16px; margin-bottom: 18px; }
.ck-domain {
  background: #fff; border: none; border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: hidden;
  position: relative;
}
/* 每个 domain 头部加 4px 实心色条 + 浅色色头 */
.ck-domain::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 4px;
}
.ck-domain-head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 11px 16px 10px 20px;
  border-bottom: 1px solid var(--border-light);
}
/* 板块 emoji 图标：圆形浅色底 + 主色字 */
.ck-domain-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 7px;
  font-size: 13px; line-height: 1; flex-shrink: 0;
}
.ck-domain-title { font-size: 14.5px; font-weight: 700; letter-spacing: 0.2px; }
.ck-domain-note { font-size: 11.5px; color: var(--text-hint); margin-left: auto; }

/* 生产运行：水务绿（主色） */
.ck-dom-production { background: linear-gradient(180deg, #F0FBF5 0%, #FFFFFF 32%); }
.ck-dom-production::before { background: #00A651; }
.ck-dom-production .ck-domain-icon { background: #00A651; color: #fff; }
.ck-dom-production .ck-domain-title { color: #008040; }

/* 营业分析：营收质量蓝 */
.ck-dom-business { background: linear-gradient(180deg, #F0F6FE 0%, #FFFFFF 32%); }
.ck-dom-business::before { background: #1F73E8; }
.ck-dom-business .ck-domain-icon { background: #1F73E8; color: #fff; }
.ck-dom-business .ck-domain-title { color: #0E5AC4; }

/* 财务管理：财务紫 */
.ck-dom-finance { background: linear-gradient(180deg, #F7F2FE 0%, #FFFFFF 32%); }
.ck-dom-finance::before { background: #7B5EA7; }
.ck-dom-finance .ck-domain-icon { background: #7B5EA7; color: #fff; }
.ck-dom-finance .ck-domain-title { color: #5E4585; }

.ck-domain-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; background: var(--border-light); }
.ck-kpi {
  background: #fff; padding: 14px 16px; transition: background .15s; min-width: 0;
  cursor: default;
}
.ck-kpi-label { font-size: 12px; color: var(--text-sub); margin-bottom: 6px; }
.ck-kpi-value { font-size: 22px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-kpi-unit { font-size: 12px; color: var(--text-hint); font-weight: normal; margin-left: 3px; }
/* v20260902n：KPI tip 直接说明，不再写"数据来源："前缀 */
.ck-kpi-tip {
  font-size: 11.5px; color: var(--text-hint); line-height: 1.45;
  margin-top: 7px; padding-top: 6px; border-top: 1px dashed var(--border-light);
}
.ck-kpi-na { color: var(--text-hint); font-weight: 600; }
/* v20260902p：异常 KPI 仅染数据值（value），文字（label / tip）保持原色；新增严重档（warning / 黄色）覆盖原普通档 */
.ck-kpi-danger .ck-kpi-value { color: var(--danger); }
.ck-kpi-warning .ck-kpi-value { color: #C77800; font-weight: 800; }
/* v20260902p 删：label 与 tip 不再随异常变色（大哥要求"只把数据标红，文字不变"） */

/* 驾驶舱安全整改跟踪卡 */
.ck-safety-card { display: flex; flex-direction: column; }
.ck-sf-top { display: flex; gap: 20px; align-items: center; margin-bottom: 14px; }
.ck-sf-rate {
  flex-shrink: 0; text-align: center; background: var(--primary-faint); border-radius: var(--radius-sm);
  padding: 14px 18px; min-width: 120px;
}
/* 闭环率数值按达成度着色：≥80 绿 / 50-79 橙 / <50 红 */
.ck-sf-rate-value.rate-high { color: #1E9E62; }
.ck-sf-rate-value.rate-mid  { color: #E08A1E; }
.ck-sf-rate-value.rate-low  { color: #D94A4A; }
.ck-sf-rate-label { font-size: 12px; color: var(--text-sub); }
.ck-sf-rate-value { font-size: 30px; font-weight: 800; color: var(--primary-dark); font-variant-numeric: tabular-nums; }
.ck-sf-rate-unit { font-size: 13px; font-weight: normal; color: var(--text-sub); }
.ck-sf-rate-sub { font-size: 11px; color: var(--text-sub); margin-top: 2px; }
.ck-sf-bars { flex: 1; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.ck-sf-bar { display: flex; align-items: center; gap: 10px; }
.ck-sf-bar-name { width: 48px; flex-shrink: 0; font-size: 12px; color: var(--text-sub); text-align: right; }
.ck-sf-bar-track { flex: 1; height: 12px; background: var(--bg-alt); border-radius: 6px; overflow: hidden; }
.ck-sf-bar-fill { height: 100%; border-radius: 6px; transition: width .4s ease; }
.ck-sf-bar-num { width: 26px; flex-shrink: 0; font-size: 12px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.ck-sf-list-title { font-size: 13px; font-weight: 700; color: var(--text); margin: 10px 0 8px; }
.ck-sf-list { display: flex; flex-direction: column; gap: 6px; }
.ck-sf-item {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  background: #FAFCFE; border: 1px solid var(--border-light); border-radius: 7px;
  cursor: pointer; transition: all .15s; min-width: 0;
}
.ck-sf-item:hover { border-color: var(--primary); background: var(--primary-faint); }
.ck-sf-item-name { font-size: 12.5px; font-weight: 600; color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.ck-sf-item-meta { font-size: 11px; color: var(--text-hint); flex-shrink: 0; }
.ck-safety-card .ck-sf-list { max-height: 200px; overflow-y: auto; }

/* 自定义时间框 + 公司选项栏（v20260902d：紧凑化，一行内并排，去掉强制换行） */
.ck-custom-box { display: inline-flex; align-items: center; gap: 6px; }
.ck-tilde { color: var(--text-hint); font-size: 13px; }
.ck-company {
  margin-left: auto; display: flex; align-items: center; gap: 10px;
  padding-left: 12px; border-left: 1px dashed var(--border-light);
  flex-shrink: 1; min-width: 0;
}
/* v20260902v：公司 chip 多时（4+）会溢出原 max-width:340px 被截断。
   改为 chip 内部自然换行 + max-width:60vw 兜底，避免撑爆驾驶舱工具栏。 */
.ck-company > .ck-company-chips { flex-wrap: wrap; overflow: visible; max-width: 60vw; }
.ck-company-label { font-size: 12.5px; font-weight: 700; color: var(--text-sub); flex-shrink: 0; }
/* v20260903c：厂站/营业所筛选下拉（跟在公司筛选后面，紧凑胶囊样式） */
/* v20260903d：厂站/营业所下拉已按大哥要求从驾驶舱撤除，ck-selwrap/ck-select-sm 样式一并移除 */
.ck-company-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ck-chip {
  border: 1px solid var(--border); background: #fff; color: var(--text-sub);
  font-family: inherit; font-size: 12.5px; font-weight: 600; padding: 4px 12px;
  border-radius: 20px; cursor: pointer; transition: all var(--transition);
  white-space: nowrap;
}
.ck-chip:hover { border-color: var(--primary); color: var(--primary); }
.ck-chip-on { background: var(--primary); border-color: var(--primary); color: #fff; }
.ck-company-none { font-size: 12px; color: var(--text-hint); }

/* v20260902q：多公司对比改为"每个公司各占一行"——column 排版 + grid 两列（公司名 1fr + 数据 auto）
   公司名靠左下对齐、数据靠右贴边，数据字号大且粗，颜色由 --cmp-color 注入（柔和不同色相） */
.ck-kpi-cmp {
  display: flex; flex-direction: column; gap: 7px;
  margin-top: 10px; padding-top: 9px;
  border-top: 1px dashed var(--border-light);
}
/* column 排版下不需要分隔点 */
.ck-cmp-sep { display: none; }
/* 每家公司一行：grid 两列（公司名+数据），让数据严格贴右对齐 */
.ck-cmp-item {
  display: grid; grid-template-columns: 1fr auto;
  align-items: baseline; column-gap: 14px;
  font-size: 13px; line-height: 1.55;
  color: var(--cmp-color, var(--text-sub));
}
.ck-cmp-item .ck-cmp-name {
  font-weight: 600; color: var(--cmp-color, var(--text-sub));
  text-align: left;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 0;
}
.ck-cmp-item .ck-cmp-val {
  font-weight: 800; font-size: 15px; color: var(--cmp-color, var(--text));
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}
/* v20260902x：单独公司的指标值超标时，仅该子行的 val 变红，不污染公司名/分隔线。
   与 .ck-kpi-danger 同款色（var(--danger)），便于一眼看出"谁家公司哪项异常"。
   v20260902y 加强：在数字前加一个小红点 ⚠ + 字号加大 16px + 字重 900 + 文字深红粗体，
   确保即使在多色公司名横向并列时也能一眼挑出异常行（避免被公司名颜色干扰视读）。 */
.ck-cmp-item.ck-cmp-danger .ck-cmp-val {
  color: var(--danger);
  font-size: 16px;
  font-weight: 900;
  display: inline-flex; align-items: center; gap: 4px;
}
.ck-cmp-item.ck-cmp-danger .ck-cmp-val::before {
  content: '⚠';
  color: var(--danger);
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
}

/* 关键预警：一行紧凑 chip 条（v20260902c 压缩处理栏 · v20260902d 紧贴工具栏） */
.ck-alert-box { margin-bottom: 14px; }
.ck-alert-strip {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 9px 14px; box-shadow: var(--shadow);
}
.ck-alert-strip-ok { border-color: #BFE9CF; background: #F3FBF6; }
.ck-alert-dot { width: 8px; height: 8px; border-radius: 50%; background: #2E9E6B; flex-shrink: 0; }
.ck-alert-strip-text { font-size: 12.5px; color: var(--text-sub); }
.ck-alert-strip-label { font-size: 12.5px; font-weight: 800; color: var(--text); flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; }
.ck-alert-strip-label::before { content: ''; width: 6px; height: 6px; background: #D97706; border-radius: 50%; display: inline-block; }
.ck-alert-chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ck-alert-chip {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  font-family: inherit; font-size: 12px; font-weight: 700; padding: 4px 11px; border-radius: 14px;
  border: 1px solid transparent; transition: all var(--transition);
}
.ck-alert-chip-warn { background: #FFF4E5; color: #B26A00; border-color: #F6D9A8; }
.ck-alert-chip-warn:hover { background: #FCE6C4; }
.ck-alert-chip-danger { background: #FDE8E8; color: #C0392B; border-color: #F3B7B2; }
.ck-alert-chip-danger:hover { background: #F8D2D2; }
/* v20260902e：左侧 3px 颜色条 + 12px 内距（替代原 emoji chip 图标，更克制专业） */
.ck-alert-chip-bar { width: 3px; height: 14px; border-radius: 2px; flex-shrink: 0; }
.ck-alert-chip-warn .ck-alert-chip-bar { background: #B26A00; }
.ck-alert-chip-danger .ck-alert-chip-bar { background: #C0392B; }

/* ---------- 安全整改 / 法务台账组件 ---------- */
.sf-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 18px; }
@media (max-width: 860px) { .sf-stats { grid-template-columns: repeat(2, 1fr); } }
.sf-stat-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 14px 16px;
}
.sf-stat-label { font-size: 12px; color: var(--text-sub); }
.sf-stat-value { font-size: 26px; font-weight: 800; color: var(--text); margin-top: 4px; font-variant-numeric: tabular-nums; }
.sf-stat-unit { font-size: 12px; color: var(--text-hint); font-weight: normal; margin-left: 2px; }
.sf-stat-sub { font-size: 11px; color: var(--text-hint); margin-top: 4px; }
.sf-c-total   { border-top: 3px solid #00A651; }
.sf-c-closed  { border-top: 3px solid #2E9E6B; }
.sf-c-doing   { border-top: 3px solid #B7791F; }
.sf-c-overdue { border-top: 3px solid #C0392B; }
.sf-c-ok      { border-top: 3px solid #2E9E6B; }
.lg-c-open    { border-top: 3px solid #00A651; }
.lg-c-new     { border-top: 3px solid #1FA971; }
.lg-c-amount  { border-top: 3px solid #36B386; }

.sf-dist { padding: 6px 2px 2px; }
.sf-dist-bar { display: flex; height: 16px; border-radius: 8px; overflow: hidden; background: var(--bg-alt); }
.sf-seg { transition: flex .3s; min-width: 0; }
.sf-dist-legend { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 10px; }
.sf-legend { font-size: 12px; color: var(--text-sub); display: inline-flex; align-items: center; gap: 5px; }
.sf-legend b { color: var(--text); font-variant-numeric: tabular-nums; }
.sf-dot { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

/* 状态标签 */
.sf-tag {
  display: inline-block; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 10px;
  white-space: nowrap;
}
.st-todo     { background: #EDF1F5; color: #5B6B7C; }
.st-doing    { background: #FDF3E1; color: #B7791F; }
.st-verify   { background: #E3F4F2; color: #0E7C86; }
.st-closed   { background: #E3F6EC; color: #2E9E6B; }
.st-overdue  { background: #FDECEA; color: #C0392B; }
.lg-open     { background: #E6F7EF; color: #00897B; }
.lg-closed   { background: #E3F6EC; color: #2E9E6B; }
.lg-archived { background: #EDF1F5; color: #5B6B7C; }

.sf-seg.st-todo     { background: #5B6B7C; }
.sf-seg.st-doing    { background: #B7791F; }
.sf-seg.st-verify   { background: #0E7C86; }
.sf-seg.st-closed   { background: #2E9E6B; }
.ck-sf-bar-fill.st-todo     { background: #5B6B7C; }
.ck-sf-bar-fill.st-doing    { background: #B7791F; }
.ck-sf-bar-fill.st-verify   { background: #0E7C86; }
.ck-sf-bar-fill.st-closed   { background: #2E9E6B; }
.ck-sf-bar-fill.st-overdue  { background: #C0392B; }

/* 隐患等级 / 风险等级 */
.sf-lv { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 4px; white-space: nowrap; }
.sf-lv-major { background: #FDECEA; color: #C0392B; }
.sf-lv-mid   { background: #FDF3E1; color: #B7791F; }
.sf-lv-minor { background: #E3F6EC; color: #2E9E6B; }

.sf-deadline-overdue { color: #C0392B; font-weight: 700; }
.sf-col-name { max-width: 320px; }
.sf-note { font-size: 12px; color: var(--text-sub); margin-top: 3px; line-height: 1.5; }
.lg-col-amount { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* 弹窗两列表单 */
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
@media (max-width: 600px) { .form-grid-2 { grid-template-columns: 1fr; } }

/* ============ v20260901b：驾驶舱关键预警中心 ============ */
.ck-alert-box { margin-bottom: 18px; }
.ck-alert-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.ck-alert-head-title { font-size: 15px; font-weight: 800; color: var(--text); }
.ck-alert-head-sub { font-size: 12.5px; color: var(--text-sub); }
.ck-danger-text { color: #C0392B; }
.ck-alert {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 14px; margin-bottom: 8px;
  background: #fff; border: 1px solid var(--border);
  border-left: 4px solid #7A869A; border-radius: 8px;
  cursor: pointer; transition: box-shadow .15s ease, transform .15s ease;
}
.ck-alert:hover { box-shadow: 0 2px 10px rgba(13, 59, 102, .12); transform: translateY(-1px); }
.ck-alert-danger { border-left-color: #C0392B; background: #FFF7F6; }
.ck-alert-warn   { border-left-color: #E08A1E; background: #FFFAF0; }
.ck-alert-ok     { border-left-color: #2E9E6B; background: #F3FBF7; cursor: default; }
.ck-alert-ok:hover { box-shadow: none; transform: none; }
.ck-alert-icon { font-size: 20px; flex-shrink: 0; line-height: 1; }
.ck-alert-body { flex: 1; min-width: 0; }
.ck-alert-title { font-size: 13.5px; font-weight: 700; color: var(--text); }
.ck-alert-desc  { font-size: 12px; color: var(--text-sub); margin-top: 2px; line-height: 1.5; }
.ck-alert-go { flex-shrink: 0; font-size: 12px; font-weight: 700; color: var(--primary); }

/* ============ v20260901b：厂站运行明细 ============ */
.ck-station-card { margin-top: 18px; }
.ck-station-table th, .ck-station-table td { white-space: nowrap; }
.ck-station-row { cursor: pointer; transition: background .12s ease; }
.ck-station-row:hover { background: var(--bg-alt); }
.ck-td-danger { color: #C0392B; font-weight: 700; }

/* ============ v20260901b：安全无事故天数卡片 ============ */
.sf-c-safe { border-left: 3px solid #2E9E6B; }
.sf-c-safe:hover { box-shadow: 0 2px 10px rgba(13, 59, 102, .12); }
.sf-stat-unit { font-size: 11.5px; font-weight: 600; color: var(--text-sub); margin-left: 3px; }

/* ============ v20260902a：台账模式（法务 / 安全隐患）统一能力 ============ */
/* 统计卡片：卡片数量不固定，改为自适应列 */
.sf-stats { grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)); }
@media (max-width: 860px) { .sf-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .sf-stats { grid-template-columns: 1fr; } }

/* 新增统计卡配色 */
.sf-c-rate  { border-top: 3px solid #0E7C86; }
.lg-c-risk  { border-top: 3px solid #C0392B; }
.sf-c-safe  { border-top: 3px solid #2E9E6B; border-left: 3px solid #2E9E6B; }

/* 闭环率进度条 */
.sf-rate-bar { margin-top: 7px; height: 6px; border-radius: 4px; background: var(--bg-alt); overflow: hidden; }
.sf-rate-bar i { display: block; height: 100%; background: linear-gradient(90deg, #0E7C86, #2E9E6B); border-radius: 4px; transition: width .35s ease; }

/* 台账操作按钮组（导入导出等），窄屏自动换行 */
.card-title > .btn-group { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 900px) {
  .card-title.row-between { flex-wrap: wrap; gap: 8px; }
  .card-title > .btn-group { justify-content: flex-start; }
}
/* 周期选择下拉（历史区块） */
.ledger-period {
  height: 30px; padding: 0 8px; font-size: 12.5px; border: 1px solid var(--border);
  border-radius: 6px; background: #fff; color: var(--text); cursor: pointer;
}
.ledger-period:focus { outline: none; border-color: var(--primary); }

/* 历史条目中的事项名 */
.audit-meta { font-size: 12px; color: var(--text-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 列配置弹窗 */
.col-cfg-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 14px; max-height: 46vh; overflow-y: auto; padding: 4px 2px; }
@media (max-width: 560px) { .col-cfg-list { grid-template-columns: 1fr; } }
.col-cfg-item {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: 7px; font-size: 13px; cursor: pointer; transition: background .12s ease;
}
.col-cfg-item:hover { background: var(--bg-alt); }
.col-cfg-item.locked { background: var(--bg-alt); cursor: default; opacity: .85; }
.col-cfg-item input[type=checkbox] { width: 15px; height: 15px; accent-color: var(--primary); cursor: pointer; }
.col-cfg-item input[type=checkbox]:disabled { cursor: not-allowed; }
.col-cfg-tag { margin-left: auto; font-size: 10.5px; color: var(--text-hint); background: var(--bg-alt); border-radius: 4px; padding: 1px 6px; }

/* 导入诊断面板 */
.diag-wrap { max-height: 260px; overflow-y: auto; border: 1px solid var(--border); border-radius: 6px; padding: 10px; background: var(--bg-alt); }
.diag-box {
  background: #fff; padding: 6px 8px; border-radius: 6px; font-family: Consolas, Monaco, monospace;
  font-size: 12px; word-break: break-all;
}

/* loading 文案 */
.loading-text { font-size: 14px; color: var(--text-sub); font-weight: 600; }

/* ===== v20260902b 业务台账统一入口（数据管理页） ===== */
/* 预览表：超出预览条数的提示行 */
.lgd-more { text-align: center; color: var(--text-hint); font-size: 12px; background: var(--bg-alt); }
/* 台账 Tab 组（模板管理 → 台账列配置），与数据管理页的台账清单同源 */
#lgc-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
#lgc-tabs .btn { white-space: nowrap; }
/* 数据管理页台账卡片内的筛选栏更紧凑，避免与页面顶部筛选栏混淆 */
#lgd-ledger, #lgd-status { min-width: 132px; }
@media (max-width: 700px) {
  #lgd-ledger, #lgd-status { min-width: 0; width: 100%; }
}

/* ---------- v20260902ad：数据分析 v2 · 跨板块「填报视角」chip 行 ---------- */
.dash-scope-card { margin-bottom: 16px; }
.dash-scope-head { cursor: pointer; user-select: none; }
.dash-scope-head:hover { color: var(--primary); }
.dash-scope-head:hover .dash-detail-toggle { color: var(--primary); }
.dash-scope-body { padding: 12px 18px 14px; transition: max-height .25s ease, opacity .2s ease, padding .25s ease; }
.dash-scope-card.collapsed .dash-scope-body { max-height: 0; opacity: 0; overflow: hidden; padding-top: 0; padding-bottom: 0; }
.dash-scope-card.collapsed .dash-detail-toggle { transform: rotate(-90deg); }
.dash-chip-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 7px;
  padding: 5px 0;
}
.dash-chip-label {
  font-size: 12.5px; color: var(--text-sub); font-weight: 700;
  margin-right: 2px; min-width: 56px; flex-shrink: 0;
}
.dash-chip {
  font-family: inherit;
  border: 1px solid var(--border); background: #fff; color: var(--text-sub);
  font-size: 12.5px; font-weight: 600; padding: 4px 11px;
  border-radius: 18px; cursor: pointer;
  transition: all var(--transition);
  white-space: nowrap; line-height: 1.5;
}
.dash-chip:hover { border-color: var(--primary); color: var(--primary); }
.dash-chip-on { background: var(--primary-faint); border-color: var(--primary); color: var(--primary); }
.dash-chip-mini { padding: 2px 9px; font-size: 12px; color: var(--text-hint); border-color: var(--border-light); background: #F7F9FA; }
.dash-scope-stat {
  font-size: 12px; color: var(--text-sub);
  padding-top: 8px; margin-top: 8px;
  border-top: 1px dashed var(--border-light);
}
.dash-scope-stat b { color: var(--text); font-weight: 700; }

/* 跨板块明细表 / 表头彩色 chip */
.dash-merged-card { margin-bottom: 16px; }
.dash-legend { display: inline-flex; align-items: center; gap: 4px; color: var(--text-sub); }
.dash-legend .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.dash-legend .dot.d-ok { background: var(--primary); }
.dash-legend .dot.d-warn { background: var(--warn); }
.dash-legend .dot.d-err { background: var(--danger); }
.dash-cat-badge {
  display: inline-block; padding: 1px 8px; border-radius: 999px;
  font-size: 11.5px; line-height: 1.6; font-weight: 600;
}
.dash-cat-production { background: #EAF3DE; color: #27500A; }
.dash-cat-business   { background: #E6F1FB; color: #0C447C; }
.dash-cat-finance    { background: #EEEDFE; color: #3C3489; }
.dash-cat-legal      { background: #FBEAF0; color: #72243E; }
.dash-cat-safety     { background: #FAEEDA; color: #633806; }
.dash-status-st {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 600;
}
.dash-status-st.s-ok { color: var(--primary); }
.dash-status-st.s-warn { color: var(--warn); }
.dash-status-st.s-err { color: var(--danger); }
.dash-status-st.s-miss { color: var(--text-hint); }
.dash-row-abnormal td { background: rgba(245, 158, 11, 0.06); }
.dash-row-missing td { background: rgba(220, 38, 38, 0.05); }

/* 填报事实 KPI 区（cat=all 时主显示） */
#dash-fact-kpi { display: none; }
#dash-fact-kpi .kpi-card.kpi-good::before { background: var(--primary); }
#dash-fact-kpi .kpi-card.kpi-good .kpi-value { color: var(--primary); }
#dash-fact-kpi .kpi-card.kpi-warn::before { background: var(--warn); }
#dash-fact-kpi .kpi-card.kpi-warn .kpi-value { color: var(--warn); }
#dash-fact-kpi .kpi-card.kpi-danger::before { background: var(--danger); }
#dash-fact-kpi .kpi-card.kpi-danger .kpi-value { color: var(--danger); }

/* ---------- v20260902af：数据分析 · 时间节点对比分析区 ---------- */
.dash-compare-card { margin-bottom: 16px; }
.dash-compare-head { cursor: pointer; user-select: none; }
.dash-compare-head:hover { color: var(--primary); }
.dash-compare-head:hover .dash-detail-toggle { color: var(--primary); }
.dash-compare-body { padding: 12px 18px 14px; transition: max-height .25s ease, opacity .2s ease, padding .25s ease; }
.dash-compare-card.collapsed .dash-compare-body { max-height: 0; opacity: 0; overflow: hidden; padding-top: 0; padding-bottom: 0; }
.dash-compare-card.collapsed .dash-detail-toggle { transform: rotate(-90deg); }
/* v20260906g：旧 .dash-cmp-bar / .dash-cmp-sep / .dash-cmp-bar-metric / .dash-metric-box 已被 .dash-compare-toolbar + .dash-compare-row + .dash-metric-grid 取代，保留仅作历史兼容 */
/* 指标 chip 按所属板块着色（保留原 v20260906f 配色） */
.dash-chip[data-mcat="production"].dash-chip-on { background: #EAF3DE; border-color: #7FA63C; color: #27500A; }
.dash-chip[data-mcat="business"].dash-chip-on   { background: #E6F1FB; border-color: #4A8CC4; color: #0C447C; }
.dash-chip[data-mcat="finance"].dash-chip-on    { background: #EEEDFE; border-color: #8079C9; color: #3C3489; }
.dash-compare-body .chart-box { height: 320px; }
/* v20260906b：对比对象多时卡片内部滚动，避免图表溢出卡片破坏整页布局（排行条数多 / 占比对象多） */
#dash-compare-grid .chart-card { max-height: 460px; overflow-y: auto; }
.dash-compare-body .chart-card .card-title { font-size: 14px; }
.dash-cmp-tip { font-size: 12px; color: var(--text-hint); padding-top: 6px; line-height: 1.7; }
.cmp-empty {
  display: flex; align-items: center; justify-content: center;
  height: 100%; min-height: 220px;
  color: var(--text-hint); font-size: 13px;
}
.cmp-guide { min-height: 160px; font-size: 13.5px; }

/* ============ v20260906c：数据管理页（#page-manage）紧凑化 ============
   仅作用于数据管理页，不影响其他页面（如看板明细、台账等共用 .table-wrap/.data-table 的区块）。
   目标：表格行更矮、内边距更小、表格限制高度内部滚动；筛选条与卡片间距收紧，避免超大单框。 */
#page-manage .dash-filter { padding: 9px 12px; margin-bottom: 12px; gap: 6px; }
#page-manage .dash-filter select,
#page-manage .dash-filter input[type="date"],
#page-manage .dash-filter input[type="search"] { padding: 6px 10px; font-size: 12.5px; }
#page-manage .card { margin-top: 12px !important; }
#page-manage .table-wrap {
  max-height: 56vh; overflow-y: auto; overflow-x: auto;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
}
#page-manage .data-table { font-size: 12.5px; }
#page-manage .data-table th,
#page-manage .data-table td { padding: 6px 9px; }
#page-manage .data-table tbody tr { line-height: 1.45; }

/* ============ v20260902ag：数据分析页统一工具条（一行式筛选入口） ============
   历史问题：ad 加的 scope-card、af 加的 compare-card 各有自己的 chip 条，
   加上 ae 砍掉的 filter-bar，三套筛选并存。ag 把「板块 / 时间 / 对比对象」
   收进这一条工具条，全页唯一筛选入口。 */
.dash-bar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
  padding: 10px 16px; margin-bottom: 16px;
  background: #fff; border: 1px solid var(--border-light); border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
}
/* v20260906af：恢复工具条 sticky 定位——大哥再反馈「筛选栏冻结」（滚动时保持可见方便切换） */
/* v20260906g：工具条下滑时吸顶（顶栏 58px 下方），方便改筛选条件不必滚回顶部；z-index 低于顶栏避免遮挡 */
#page-dashboard .dash-bar {
  position: sticky; top: 58px; z-index: 90;
  box-shadow: 0 2px 8px rgba(11,84,56,.10);
}
.dash-bar-item { display: flex; align-items: center; gap: 8px; min-width: 0; }
.dash-bar-label {
  flex: none; white-space: nowrap;
  font-size: 12px; font-weight: 600; letter-spacing: .5px; color: var(--text-sub);
}
.dash-bar-sep { flex: none; width: 1px; height: 18px; background: var(--border-light); }
.dash-bar-right { margin-left: auto; display: flex; align-items: center; gap: 6px; }

/* v20260906p：显示单位切换按钮（万m³/万元 ⇄ m³/元） */
.dash-unit-btn {
  font-size: 12px;
  line-height: 1.4;
  padding: 4px 9px;
  border: 1px solid var(--border-tertiary);
  border-radius: 6px;
  background: var(--background-secondary);
  color: var(--text-secondary);
  cursor: pointer;
  white-space: nowrap;
  transition: border-color .15s, color .15s, background .15s;
}
.dash-unit-btn:hover { border-color: var(--border-secondary); color: var(--text-primary); }
.dash-unit-btn.on {
  background: var(--color-info, #E6F1FB);
  border-color: var(--primary, #378ADD);
  color: var(--primary, #185FA5);
}
.dash-bar .dash-chip-row { padding: 0; gap: 6px; }
.dash-bar .dash-chip { padding: 4px 12px; font-size: 13px; }
/* v20260905c：对比分析卡片内的「对比维度」切换栏（还原图1样式）——
   灰色标签「对比维度」「时间」+ 白底圆角内三个维度 Tab，选中绿色填充白字 */
.dash-cmp-bar-dim {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 6px 4px 12px;
  background: #F2F5F8; border: 1px solid var(--border-light); border-radius: 8px;
  flex-wrap: wrap;
}
.dash-cmp-dim-label,
.dash-cmp-dim-label-sub {
  font-size: 13px; font-weight: 500; color: var(--text-hint);
  white-space: nowrap;
}
/* v20260906x：对比维度 Tab 已删除（大哥确认筛选已覆盖对比功能），dash-dim-tabs/dash-dim-tab/#dash-cmp-dims 样式随之移除 */
/* v20260903e：筛选栏 公司/厂站/营业所 多选勾选（点开面板勾选，可任意组合） */
.dash-f-multi { position: relative; flex: none; }
.dash-f-btn {
  height: 30px; max-width: 190px; padding: 2px 10px; font-size: 12.5px;
  border: 1px solid var(--border-light); border-radius: 6px; background: #fff;
  color: var(--text-main); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dash-f-btn:hover { border-color: var(--primary, #007A32); color: var(--primary, #007A32); }
.dash-f-multi.open .dash-f-btn { border-color: var(--primary, #007A32); color: var(--primary, #007A32); }
.dash-f-btn.on { border-color: var(--primary, #007A32); color: var(--primary, #007A32); font-weight: 600; }
.dash-f-panel {
  position: absolute; top: 34px; left: 0; z-index: 200; min-width: 190px; max-width: 260px;
  background: #fff; border: 1px solid var(--border-light); border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12); padding: 6px;
}
.dash-f-actions { display: flex; gap: 6px; padding: 2px 2px 6px; border-bottom: 1px solid var(--border-light); margin-bottom: 4px; }
.dash-f-actions button {
  flex: 1; height: 26px; font-size: 12px; border: 1px solid var(--border-light);
  border-radius: 5px; background: #fff; color: var(--text-sub); cursor: pointer;
}
.dash-f-actions button:hover { border-color: var(--primary, #007A32); color: var(--primary, #007A32); }
.dash-f-list { max-height: 260px; overflow-y: auto; }
.dash-f-item { display: flex; align-items: center; gap: 6px; padding: 5px 6px; font-size: 12.5px; cursor: pointer; border-radius: 4px; white-space: nowrap; }
.dash-f-item:hover { background: var(--bg-hover, #f2f6f3); }
.dash-f-item input { flex: none; cursor: pointer; }
.dash-f-empty { padding: 10px 6px; font-size: 12px; color: var(--text-sub); text-align: center; }
/* 窄屏：三组各自占一行，分隔符隐藏 */
@media (max-width: 1180px) {
  .dash-bar-sep { display: none; }
}
@media (max-width: 780px) {
  .dash-bar { gap: 10px 8px; }
  .dash-bar-item { flex: 1 1 100%; }
  .dash-bar-right { margin-left: 0; }
}

/* v20260906g：旧的 .dash-bar-cmp 顶部「视图+指标」整块已删除（移到自定义分析卡内），
   这里保留窄屏媒体查询给新的 .dash-compare-toolbar 用 */
@media (max-width: 900px) {
  .dash-compare-toolbar { padding: 10px 12px 4px; }
  .dash-compare-row { flex-direction: column; gap: 4px; }
  .dash-compare-label { padding-left: 9px; }
}

/* ===== v20260902al：自定义日期浮层（数据分析页"时间"工具条） ===== */
.dash-bar-time-wrap { position: relative; display: inline-flex; align-items: center; gap: 8px; }   /* 浮层定位基准 = 时间组的容器 */
.dash-time-sel {
  height: 30px; padding: 0 8px; font-size: 12.5px; color: var(--text-main);
  border: 1px solid var(--border-light); border-radius: 6px; background: #fff; cursor: pointer;
}
.dash-time-sel:focus { outline: none; border-color: var(--primary, #007A32); }
.dash-custom-popover {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 50;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12), 0 0 0 4px rgba(0, 166, 81, .06);
  white-space: nowrap;
}
.dash-custom-popover-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.dash-custom-popover-inner label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-sub);
}
.dash-custom-popover-inner .ck-input {
  height: 30px;
  font-size: 13px;
  padding: 0 10px;
}
.dash-custom-tilde {
  color: var(--text-hint);
  font-weight: 600;
  padding: 0 2px;
}

/* ===== v20260902al：月度数据明细栏（三小节：生产/经营/财务） ===== */
.dash-detail-section {
  margin-bottom: 14px;
}
.dash-detail-section:last-child {
  margin-bottom: 0;
}
.dash-detail-subhead {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--primary-dark);
  padding: 7px 12px;
  margin-bottom: 8px;
  background: linear-gradient(90deg, rgba(0, 166, 81, .08), rgba(0, 166, 81, .02));
  border-left: 3px solid var(--primary);
  border-radius: 0 6px 6px 0;
}
.dash-detail-tag {
  display: inline-block;
  font-size: 11px;
  font-weight: 500;
  color: var(--text-hint);
  background: #fff;
  border: 1px solid var(--border-light);
  padding: 1px 7px;
  border-radius: 10px;
  letter-spacing: .3px;
}

/* ============ v20260906f：自定义分析栏 + 工具条 + chip 美化（纯 CSS 增强） ============ */

/* 1. 自定义分析卡：顶部主色色条 + 渐变底 + 精致阴影 */
.dash-compare-card {
  position: relative;
  border: 1px solid var(--border);
  border-top: 3px solid var(--primary);
  border-radius: 12px;
  background: linear-gradient(180deg, #FAFCFB 0%, #fff 60%);
  box-shadow: 0 2px 8px rgba(11, 84, 56, .06), 0 0 0 1px rgba(11, 84, 56, .03);
  overflow: hidden;
}
.dash-compare-head {
  padding: 10px 14px;
  border-bottom: 1px dashed var(--border-light);
  background: linear-gradient(90deg, rgba(0, 122, 50, .04) 0%, transparent 60%);
  font-weight: 700;
  color: var(--primary-dark, #007A32);
  font-size: 15px;
}
/* v20260906h：折叠态头部压到最扁，只留一行标题 */
.dash-compare-card.collapsed .dash-compare-head {
  padding: 5px 12px;
  font-size: 14px;
}
/* v20260906q：头栏右侧状态文字（如「未渲染 · 请选择指标开始对比」）强制贴最右 */
/* v20260906t：只保留摘要的 margin-left:auto——原来 first-child 也给了 margin-right:auto，
   两个 auto 平分空间把「2026-09 · 按日 · N 项指标 ▼」挤到正中间，跟折叠态贴右的 ▶ 对不上 */
.dash-compare-head { align-items: center; }
.dash-compare-head > span:last-child { margin-left: auto; justify-content: flex-end; text-align: right; }
/* v20260906s：折叠按钮（▼/▶）永远贴头栏最右——状态文字过长时截断省略，不许把箭头挤离右缘 */
.dash-compare-head { flex-wrap: nowrap; }
.dash-compare-head > span:last-child { flex: none; max-width: 70%; }
.dash-compare-head #dash-cmp-summary { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-compare-head .dash-detail-toggle { flex: none; margin-left: 8px; }.dash-compare-body {
  padding: 10px 14px 12px;
  background: #FAFBFC;
}
.dash-compare-body .chart-grid-2 { gap: 12px; }
.dash-compare-body .chart-card {
  border: 1px solid var(--border-light);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .03);
  overflow: hidden;
}
.dash-compare-body .chart-card .card-title {
  padding: 8px 14px;
  background: linear-gradient(90deg, #F5F8F6 0%, #fff 100%);
  border-bottom: 1px solid var(--border-light);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text);
}
.dash-compare-body .chart-box { background: #fff; }

/* 2. 引导态/空状态：图标 + 虚线框 + 浅色底 */
.cmp-empty, .cmp-guide {
  flex-direction: column;
  gap: 10px;
  padding: 28px 16px;
  min-height: 200px;
  border: 1.5px dashed var(--border);
  border-radius: 12px;
  background: linear-gradient(180deg, #F8FAF9 0%, #fff);
  color: var(--text-sub);
  text-align: center;
}
.cmp-empty::before, .cmp-guide::before {
  content: '📊';
  font-size: 32px;
  opacity: .65;
  line-height: 1;
}
.cmp-guide::before { content: '🎯'; }

/* 3. chip 美化：圆角加大 + 悬停上浮 + 通用激活态主色填充白字 */
.dash-chip {
  border-radius: 14px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .03);
}
.dash-chip:hover:not(.dash-chip-on) {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(11, 84, 56, .10);
}
/* 通用激活态（板块/时间/视图等无 mcat 属性的 chip）→ 主色填充白字；指标 chip 保留原分组色 */
.dash-chip-on:not([data-mcat]) {
  background: linear-gradient(180deg, var(--primary) 0%, #006B2C 100%);
  border-color: var(--primary);
  color: #fff;
  box-shadow: 0 2px 6px rgba(11, 84, 56, .25);
}
.dash-chip-on:not([data-mcat]):hover { transform: none; }

/* 4. dash-bar 工具条：圆角加大 + 主色左色条 + 精致阴影 + 分隔线柔化 */
.dash-bar {
  border-radius: 12px;
  border-left: 3px solid var(--primary);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .05);
}
.dash-bar-label {
  position: relative;
  padding-left: 9px;
}
.dash-bar-label::before {
  content: '';
  position: absolute; left: 0; top: 50%;
  width: 2.5px; height: 12px; margin-top: -6px;
  background: var(--primary);
  border-radius: 2px;
  opacity: .55;
}
.dash-bar-sep {
  background: linear-gradient(180deg, transparent, var(--border-light), transparent);
}

/* 5. KPI 指标折叠卡 + 数据明细卡：与自定义分析卡统一视觉族
      注意：原 .card-title 已有 box-shadow: inset 3px 0 0 #0B5438（左侧深绿色块），
      这里只增强背景/字体/边框，不重复加伪元素，避免色块叠加 */
.dash-detail-card {
  border-top: 3px solid var(--primary);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(11, 84, 56, .06), 0 0 0 1px rgba(11, 84, 56, .03);
}
.dash-detail-head {
  font-weight: 700;
  color: var(--primary-dark, #007A32);
  background: linear-gradient(90deg, rgba(0, 122, 50, .04) 0%, transparent 60%);
  border-bottom: 1px dashed var(--border-light);
}
.dash-detail-body { background: #FAFBFC; }

/* 6. v20260906g：自定义分析卡内嵌 toolbar（视图+指标 chip），与卡同宽，工具条只留板块/时间/筛选 */
.dash-compare-toolbar {
  padding: 3px 3px 8px;
  margin-bottom: 8px;
  background: #F4F7F4;
  border-radius: 10px;
  border: 1px dashed var(--border-light);
}
.dash-compare-row {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 2px 5px;
}
.dash-compare-row + .dash-compare-row {
  margin-top: 1px;
  padding-top: 5px;
  border-top: 1px dashed #E4E8E4;
}
/* v20260906i：指标行默认折叠态，只显示摘要+展开按钮 */
.dash-compare-row.dash-compare-metric {
  align-items: center;
  flex-wrap: wrap;
}
.dash-metric-summary {
  flex: 1; min-width: 0;
  font-size: 12px;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 2px 0;
}
.dash-metric-summary.empty {
  color: var(--text-hint);
  font-style: italic;
}
.dash-metric-toggle {
  flex: none;
  margin-left: 6px;
  padding: 2px 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary);
  background: #fff;
  border: 1px solid var(--primary-light, #A8D5BA);
  border-radius: 12px;
  cursor: pointer;
  transition: all var(--transition-fast);
  user-select: none;
}
.dash-metric-toggle:hover {
  background: var(--primary-faint);
  border-color: var(--primary);
}
.dash-metric-grid.collapsed {
  display: none;
}
.dash-compare-row.dash-compare-metric.expanded {
  align-items: flex-start;
}
.dash-compare-row.dash-compare-metric.expanded .dash-metric-grid {
  width: 100%;
  margin-top: 6px;
  flex-basis: 100%;
}
.dash-compare-label {
  flex: none;
  min-width: 34px;
  padding: 3px 0 3px 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--primary-dark, #007A32);
  position: relative;
}
.dash-compare-label::before {
  content: '';
  position: absolute; left: 0; top: 50%;
  width: 3px; height: 12px; margin-top: -6px;
  background: var(--primary);
  border-radius: 2px;
  opacity: .65;
}
.dash-compare-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  flex: 1; min-width: 0;
}
.dash-compare-chips .dash-chip { padding: 3px 9px; font-size: 12px; }
/* v20260906i：视图按钮恢复文字+图标，保持紧凑 */
.dash-compare-chips [data-cmp-view] {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 10px;
  font-size: 12px;
  white-space: nowrap;
}

/* v20260906j：指标按板块横向排列，每个板块一行，行内 chip 横排换行，更矮更省地方 */
.dash-metric-grid {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1; min-width: 0;
}
.dash-metric-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
  padding: 4px 8px;
  background: #fff;
  border: 1px solid var(--border-light);
  border-radius: 8px;
}
.dash-metric-group-label {
  flex: none;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--text-hint);
  letter-spacing: .2px;
  padding: 2px 0;
  border-bottom: none;
  min-width: 42px;
}
.dash-metric-group .dash-chip {
  padding: 2px 7px;
  font-size: 11px;
  border-radius: 10px;
  width: fit-content;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 指标 chip 激活态：按板块分组色（保留原 v20260906f 配色） */
.dash-chip[data-mcat="production"].dash-chip-on { background: #EAF3DE; border-color: #7FA63C; color: #27500A; }
.dash-chip[data-mcat="business"].dash-chip-on   { background: #E6F1FB; border-color: #4A8CC4; color: #0C447C; }
.dash-chip[data-mcat="finance"].dash-chip-on    { background: #EEEDFE; border-color: #8079C9; color: #3C3489; }

/* 7. v20260906g：卡片大小固定模板——4 档预设（1/3 / 1/2 / 2/3 / 满行），取代旧鼠标拖拽 */
/* v20260906j：尺寸按钮默认可见，只显示图标，避免用户找不到 */
.dash-size-toggle {
  position: absolute;
  top: 8px; right: 78px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px; height: 24px;
  padding: 0;
  background: rgba(255, 255, 255, .92);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--primary-dark, #007A32);
  cursor: pointer;
  z-index: 10;
  opacity: 1;
  transition: background var(--transition), border-color var(--transition);
  user-select: none;
}
.dash-size-toggle:hover { background: var(--primary-faint); border-color: var(--primary); }
.dash-size-toggle:active { transform: translateY(1px); }
.dash-size-toggle-menu {
  position: absolute;
  top: 100%; right: 0;
  margin-top: 4px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
  padding: 4px;
  display: none;
  z-index: 10;
  min-width: 110px;
}
.dash-size-toggle-menu.open { display: block; }
.dash-size-toggle-menu button {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 6px 8px;
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-size: 12px;
  color: var(--text);
  cursor: pointer;
  text-align: left;
}
.dash-size-toggle-menu button:hover { background: var(--primary-faint); color: var(--primary); }
.dash-size-toggle-menu button.on { background: var(--primary); color: #fff; }
.dash-size-toggle-menu button .icon { display: inline-block; width: 18px; text-align: center; }

/* v20260906w：每卡 🎚 筛选按钮已删（与顶部筛选/维度重叠鸡肋，整体收敛为一套控件）；
   卡片标题右侧只预留 尺寸/编辑/删除 按钮宽度 */
.card.chart-card .card-title { padding-right: 96px; }

/* 4 档宽度预设：1/3 / 1/2 / 2/3 / 满行 100% */
.dash-free-grid > .dash-sortable-card.dash-size-1\/3 { flex: 0 0 calc(33.333% - 14px); min-width: 280px; }
.dash-free-grid > .dash-sortable-card.dash-size-1\/2 { flex: 0 0 calc(50% - 10px); min-width: 360px; }
.dash-free-grid > .dash-sortable-card.dash-size-2\/3 { flex: 0 0 calc(66.666% - 14px); min-width: 480px; }
.dash-free-grid > .dash-sortable-card.dash-size-full { flex: 0 0 100%; min-width: 0; }
.dash-free-grid > .dash-sortable-card.dash-size-1\/3 .chart-box { height: 320px; }
.dash-free-grid > .dash-sortable-card.dash-size-1\/2 .chart-box { height: 360px; }
.dash-free-grid > .dash-sortable-card.dash-size-2\/3 .chart-box { height: 400px; }
.dash-free-grid > .dash-sortable-card.dash-size-full .chart-box { height: 440px; }
/* 明细卡独占整行；分析卡支持尺寸档位，默认满行 */
.dash-free-grid > .dash-detail-card {
  flex: 0 0 100% !important;
  min-width: 0 !important;
}
.dash-free-grid > .dash-compare-card {
  flex: 0 0 100%;
  min-width: 0;
}
.dash-free-grid > .dash-compare-card.dash-size-1\/3 { flex: 0 0 calc(33.333% - 14px); min-width: 280px; }
.dash-free-grid > .dash-compare-card.dash-size-1\/2 { flex: 0 0 calc(50% - 10px); min-width: 360px; }
.dash-free-grid > .dash-compare-card.dash-size-2\/3 { flex: 0 0 calc(66.666% - 14px); min-width: 480px; }
.dash-free-grid > .dash-compare-card.dash-size-full { flex: 0 0 100%; min-width: 0; }
.dash-free-grid > .dash-compare-card .chart-box { height: 320px; }
.dash-free-grid > .dash-compare-card.dash-size-1\/3 .chart-box { height: 260px; }
.dash-free-grid > .dash-compare-card.dash-size-1\/2 .chart-box { height: 290px; }
.dash-free-grid > .dash-compare-card.dash-size-2\/3 .chart-box { height: 310px; }
.dash-free-grid > .dash-compare-card.dash-size-full .chart-box { height: 320px; }
@media (max-width: 900px) {
  .dash-free-grid > .dash-compare-card.dash-size-1\/3,
  .dash-free-grid > .dash-compare-card.dash-size-1\/2,
  .dash-free-grid > .dash-compare-card.dash-size-2\/3 {
    flex: 0 0 100%; min-width: 0;
  }
  .dash-free-grid > .dash-compare-card.dash-size-1\/3 .chart-box,
  .dash-free-grid > .dash-compare-card.dash-size-1\/2 .chart-box,
  .dash-free-grid > .dash-compare-card.dash-size-2\/3 .chart-box { height: 280px; }
}
@media (max-width: 900px) {
  /* 窄屏全部强制满行 + 降低 chart 高度 */
  .dash-free-grid > .dash-sortable-card.dash-size-1\/3,
  .dash-free-grid > .dash-sortable-card.dash-size-1\/2,
  .dash-free-grid > .dash-sortable-card.dash-size-2\/3 { flex: 0 0 100%; min-width: 0; }
  .dash-free-grid > .dash-sortable-card.dash-size-1\/3 .chart-box,
  .dash-free-grid > .dash-sortable-card.dash-size-1\/2 .chart-box,
  .dash-free-grid > .dash-sortable-card.dash-size-2\/3 .chart-box { height: 280px; }
}

/* v20260906aa：分析卡头栏和明细/KPI 头栏统一结构（标题+摘要一体 + 右侧折叠三角），
   三个卡折叠按钮现在垂直对齐 */
.dash-cmp-summary {
  font-style: normal;
  font-size: 12px;
  color: var(--text-sub);
  font-weight: 400;
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid var(--border-light);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60%;
  vertical-align: middle;
}
.dash-cmp-summary:empty { display: none; }

/* v20260906ab：三个折叠卡（明细/KPI/分析）的三角完全对齐——
   分析卡原本有自己的 toggle 尺寸样式且因父卡 border-top:3px 主色 + padding 不一致，
   导致三角看起来比上两个大一圈；统一为 22×22px + 同样 6px 圆角 + 同样底色 */
.dash-compare-card .dash-detail-toggle,
.dash-compare-card #dash-compare-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 6px;
  font-size: 12px; color: var(--text-sub); background: var(--primary-faint);
  flex: none;
  margin-left: 8px;
}

/* v20260906ae：撤销 ad 版的三角左移——大哥要求"三角和文字换回来"，
   三角恢复贴头栏右端（跟 ab/aa 之前一致：title 左，▼ 右） */

/* v20260906ah：默认（内置）图卡顶部固定标注——「本卡仅支持公司维度统计对比」。
   细浅条带，位于标题下方、图上方，一眼告知卡片统计口径 */
.card-dim-note {
  margin: -4px 0 10px;
  padding: 4px 12px;
  font-size: 12px;
  color: var(--text-sub, #475569);
  background: linear-gradient(90deg, rgba(0,122,50,.08), rgba(0,122,50,.02));
  border-left: 3px solid var(--primary, #007A32);
  border-radius: 4px;
  line-height: 1.4;
}
/* 老徽章不再使用，显式隐藏兜底 */
.card .dim-badge { display: none !important; }

/* v20260906ak：单公司权限账号锁定 chip 样式——只显示本公司且不可点开其他公司 */
.ck-chip.ck-chip-locked {
  cursor: default;
  border: 1.5px solid var(--primary, #007A32);
  background: var(--primary, #007A32);
  color: #fff;
  font-weight: 600;
}
.ck-chip.ck-chip-locked:hover { background: var(--primary, #007A32); color: #fff; }
/* 数据分析页公司筛选按钮在锁定态显示 🔒 公司名 */
.dash-f-btn.dash-f-locked {
  cursor: default;
  border-color: var(--primary, #007A32);
  color: var(--primary, #007A32);
  background: var(--primary-faint, #EAF3EE);
}