/* 编制模型 · 全局样式（浅色后台） */
:root {
  --bg: #f5f7fa;
  --panel: #ffffff;
  --border: #e4e7ed;
  --text: #1f2329;
  --text-sub: #6b7280;
  --brand: #1f6feb;
  --up: #d93026;    /* 增加/上升：红（中文习惯） */
  --down: #12924a;  /* 减少/下降：绿 */
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  background: var(--bg);
  color: var(--text);
  font: 14px/1.5 "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
}
#app { height: 100%; }

/* ---------------- 登录 ---------------- */
.login-wrap { height: 100%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1f2937 0%, #2d3f56 55%, #1f6feb 140%); }
.login-box { display: flex; width: 820px; height: 420px; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.28); }
.login-left { flex: 1; background: #18212f; color: #e5e7eb; padding: 40px 34px; display: flex; flex-direction: column; }
.login-left .brand { font-size: 30px; font-weight: 700; letter-spacing: 3px; }
.login-left .brand-sub { margin-top: 10px; font-size: 13px; color: #9ca3af; line-height: 1.7; }
.brand-points { margin: auto 0 0; padding-left: 18px; font-size: 12.5px; color: #b6c0cd; line-height: 2.1; }
.login-right { width: 330px; padding: 46px 34px; display: flex; flex-direction: column; justify-content: center; }
.login-title { font-size: 20px; font-weight: 700; margin-bottom: 22px; }
.login-tip { margin-top: 16px; font-size: 12px; color: var(--text-sub); text-align: center; }

/* ---------------- 侧边栏 ---------------- */
.layout { display: flex; height: 100%; }
.sidebar { width: 224px; flex: 0 0 224px; background: #1f2937; color: #e5e7eb; display: flex; flex-direction: column; }
.brand { padding: 18px 16px 12px; border-bottom: 1px solid #374151; }
.brand-title { font-size: 17px; font-weight: 700; letter-spacing: 1px; }
.brand-sub { font-size: 12px; color: #9ca3af; margin-top: 4px; }
/* 菜单保留滚动但隐藏滚动条（滚轮/拖拽仍可用） */
.menu { flex: 1; padding: 8px 0; overflow: auto; scrollbar-width: none; -ms-overflow-style: none; }
.menu::-webkit-scrollbar { display: none; }
.menu-group { margin-bottom: 2px; }
.menu-l1 { display: flex; align-items: center; gap: 8px; padding: 9px 16px; cursor: pointer; border-left: 3px solid transparent; user-select: none; }
.menu-l1:hover { background: #374151; }
.menu-l1.open { color: #fff; }
.menu-l1 .menu-idx { font-size: 11px; color: #9ca3af; width: 22px; }
.menu-l1 .menu-name { font-size: 14px; flex: 1; font-weight: 600; }
.menu-l1 .menu-arrow { font-size: 14px; color: #9ca3af; width: 12px; text-align: center; }
.menu-l2wrap { padding: 2px 0 6px; background: #18212f; }
.menu-l2 { display: flex; align-items: center; gap: 8px; padding: 7px 16px 7px 41px; cursor: pointer; font-size: 13px; color: #cbd5e1; border-left: 3px solid transparent; }
.menu-l2 .dot { width: 4px; height: 4px; border-radius: 50%; background: #64748b; }
.menu-l2:hover { background: #233044; color: #fff; }
.menu-l2.active { background: #111827; color: #fff; border-left-color: var(--brand); }
.menu-l2.active .dot { background: var(--brand); }
.side-foot { padding: 10px 16px; border-top: 1px solid #374151; }
.db-state { font-size: 11px; color: #9ca3af; }

/* ---------------- 主区 ---------------- */
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar { background: var(--panel); border-bottom: 1px solid var(--border); padding: 10px 20px; display: flex; align-items: center; gap: 12px; position: sticky; top: 0; z-index: 10; }
.crumb { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.crumb .c-g { color: var(--text-sub); }
.crumb .c-sep { color: #c0c4cc; }
.crumb .c-s { font-weight: 600; }
.top-right { margin-left: auto; font-size: 13px; color: var(--text-sub); }
.user { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; }
.avatar.big { width: 56px; height: 56px; font-size: 22px; }
.content { flex: 1; overflow: auto; padding: 20px 24px 40px; }

/* ---------------- 页面骨架 ---------------- */
.page-head { margin-bottom: 16px; }
.ph-t { font-size: 20px; font-weight: 700; letter-spacing: .5px; }
.ph-d { font-size: 12px; color: var(--text-sub); margin-top: 6px; max-width: 960px; line-height: 1.7; }

.card { background: var(--panel); border: 1px solid var(--border); border-radius: 6px; padding: 16px; margin-bottom: 16px; }
.card-title { font-size: 15px; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.card-title .sub { font-size: 12px; font-weight: 400; color: var(--text-sub); }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

/* 上下文条：窄、只在需要的页面出现 */
.ctx-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; background: var(--panel); border: 1px solid var(--border); border-radius: 6px; padding: 8px 12px; margin-bottom: 14px; }
.ctx-bar .cb-label { font-size: 12px; color: var(--text-sub); }
.ctx-bar .cb-wh { width: 190px; }
.ctx-bar .cb-range { width: 250px; }
.ctx-bar .cb-algo { width: 110px; }
.ctx-bar .el-button { margin-left: auto; }

/* 查询套件 */
.query-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.query-bar .qb-kw { width: 230px; }
.query-bar .qb-extra { margin-left: auto; display: flex; align-items: center; gap: 8px; }

/* KPI */
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.kpi { background: #fafbfc; border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; }
.kpi .k-n { font-size: 12px; color: var(--text-sub); }
.kpi .k-v { font-size: 22px; font-weight: 700; margin-top: 4px; font-variant-numeric: tabular-nums; }
.kpi .k-u { font-size: 12px; color: var(--text-sub); margin-left: 3px; font-weight: 400; }
.kpi .k-s { font-size: 12px; color: var(--text-sub); margin-top: 4px; }

/* ---------------- 首页 ---------------- */
.home { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 16px; align-items: start; }
.banner { height: 100%; border-radius: 8px; padding: 34px 30px; color: #fff; display: flex; flex-direction: column; justify-content: center; }
.banner.b1 { background: linear-gradient(120deg, #1f6feb, #4f9cf9); }
.banner.b2 { background: linear-gradient(120deg, #7c3aed, #a78bfa); }
.banner.b3 { background: linear-gradient(120deg, #0f9d58, #34d399); }
.banner .bt { font-size: 24px; font-weight: 700; }
.banner .bd { margin-top: 10px; font-size: 13px; opacity: .92; line-height: 1.7; }
.welcome { display: flex; gap: 16px; padding: 20px; }
.wc-line1 { display: flex; align-items: baseline; gap: 10px; }
.wc-line1 b { font-size: 20px; }
.wc-dept { font-size: 12px; color: var(--text-sub); }
.wc-line2 { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
.wc-chip { font-size: 12px; background: #f3f4f6; border: 1px solid var(--border); border-radius: 20px; padding: 3px 12px; color: var(--text-sub); }
.wc-chip b { color: var(--brand); }
.wc-motto { margin-top: 14px; font-size: 13px; color: #4b5563; border-left: 3px solid var(--brand); padding-left: 10px; }
.home-right { display: flex; flex-direction: column; gap: 14px; }
.panel { padding: 14px 16px; }
.panel-t { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.panel-t .cnt { font-size: 11px; background: var(--brand); color: #fff; border-radius: 10px; padding: 0 7px; }
.panel-row { padding: 8px 0; border-top: 1px dashed var(--border); cursor: pointer; }
.panel-row:first-child { border-top: none; }
.panel-row:hover .pr-t { color: var(--brand); }
.pr-t { font-size: 13px; }
.pr-k { font-size: 12px; color: var(--text-sub); margin-top: 3px; }

/* 首页左栏：欢迎轮播 */
.home-left { position: sticky; top: 16px; }
.hl-carousel { background: var(--card-bg, #fff); border: 1px solid var(--border); border-radius: 8px; height: 460px; padding: 18px 18px 0; }
.hl-carousel .el-carousel__container { height: calc(100% - 30px); }
.hl-page { height: 100%; overflow: hidden; }
.hl-welcome { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 12px; }
.hl-greet { font-size: 20px; font-weight: 700; margin-top: 14px; }
.hl-date { font-size: 13px; color: var(--text-sub); margin-top: 6px; }
.hl-dept { font-size: 13px; color: var(--text-sub); margin-top: 4px; }
.hl-motto { margin-top: 16px; font-size: 13px; color: #4b5563; border-left: 3px solid var(--brand); padding-left: 10px; text-align: left; }
.hl-chips { margin-top: 14px; display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.hl-t { font-size: 15px; font-weight: 600; display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.hl-t .cnt { font-size: 11px; background: var(--brand); color: #fff; border-radius: 10px; padding: 0 7px; }
.hl-row { padding: 9px 0; border-top: 1px dashed var(--border); cursor: pointer; }
.hl-row:first-of-type { border-top: none; }
.hl-row:hover .pr-t { color: var(--brand); }
.hl-more { margin-top: 8px; font-size: 12px; color: var(--text-sub); }

/* 首页右栏：统计卡 + 快捷入口 */
.stat-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.stat-card { background: var(--card-bg, #fff); border: 1px solid var(--border); border-radius: 8px; padding: 16px 18px; cursor: pointer; transition: box-shadow .15s, border-color .15s; }
.stat-card:hover { border-color: var(--brand); box-shadow: 0 2px 10px rgba(31, 111, 235, .10); }
.st-v { font-size: 24px; font-weight: 700; color: var(--brand); }
.st-n { font-size: 12px; color: var(--text-sub); margin-top: 4px; }
.quick-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.quick-item { border: 1px solid var(--border); border-radius: 8px; padding: 14px 10px; text-align: center; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.quick-item:hover { border-color: var(--brand); box-shadow: 0 2px 10px rgba(31, 111, 235, .10); }
.q-icon { width: 36px; height: 36px; margin: 0 auto; border-radius: 8px; background: rgba(31, 111, 235, .10); color: var(--brand); font-size: 16px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.q-name { font-size: 13px; font-weight: 600; margin-top: 8px; }
.q-desc { font-size: 12px; color: var(--text-sub); margin-top: 3px; }

/* ---------------- 驾驶舱 ---------------- */
.role-tab { margin-bottom: 14px; }
.placeholder { text-align: center; padding: 60px 20px; }
.ph-icon { width: 72px; height: 72px; margin: 0 auto 14px; border-radius: 16px; background: #eef2f7; color: var(--brand); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; }
.ph-title { font-size: 18px; font-weight: 700; }
.ph-desc { margin-top: 10px; font-size: 13px; color: var(--text-sub); }
.q3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.q3.mini { margin-top: 12px; }
.q-card { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.q-card.pass { border-left: 4px solid var(--down); }
.q-card.fail { border-left: 4px solid var(--up); }
.qc-h { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: #fafbfc; border-bottom: 1px solid var(--border); }
.qc-no { font-size: 11px; background: #1f2937; color: #fff; border-radius: 4px; padding: 1px 6px; }
.qc-t { font-size: 13px; font-weight: 600; flex: 1; }
.qc-tag { font-size: 11px; border-radius: 10px; padding: 1px 8px; background: #f3f4f6; }
.q-card.pass .qc-tag { color: var(--down); background: #eaf7f0; }
.q-card.fail .qc-tag { color: var(--up); background: #fdeceb; }
.qc-b { padding: 10px 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
.qc-item { font-size: 12px; color: var(--text-sub); }
.qc-item b { display: block; color: var(--text); font-size: 13.5px; margin-top: 2px; font-variant-numeric: tabular-nums; }
.qc-f { padding: 8px 12px; font-size: 12px; color: #4b5563; background: #fcfcfd; border-top: 1px dashed var(--border); }
.q3.mini .qc-f { border-top: none; padding-top: 0; }
.trace { font-size: 13px; }
.tr-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--border); }
.tr-row span { color: var(--text-sub); width: 100px; font-size: 12px; }
.tr-row b { font-variant-numeric: tabular-nums; }
.tr-row i { margin-left: auto; font-style: normal; font-size: 12px; color: var(--text-sub); }
.chart { width: 100%; height: 300px; }

/* ---------------- 模型公式 ---------------- */
.formula-flow { display: flex; align-items: stretch; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.ff-card { flex: 1; min-width: 280px; background: var(--panel); border: 1px solid var(--border); border-radius: 8px; padding: 16px; }
.ff-h { display: flex; align-items: center; gap: 8px; }
.ff-no { width: 22px; height: 22px; border-radius: 50%; background: var(--brand); color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; }
.ff-name { font-weight: 700; }
.ff-formula { margin: 12px 0; padding: 12px; background: #f7f9fc; border-radius: 6px; font-size: 13.5px; line-height: 1.8; border: 1px dashed #d6e0ee; }
.ff-note { font-size: 12px; color: var(--text-sub); line-height: 1.7; }
.ff-terms { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.ft-k { font-size: 11.5px; background: #eef2f7; color: #334155; border-radius: 4px; padding: 3px 8px; cursor: help; }
.ff-arrow { align-self: center; color: var(--brand); font-size: 20px; }
.src-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.src-item { border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; background: #fafbfc; }
.si-t { font-weight: 600; font-size: 13px; }
.si-d { margin-top: 6px; font-size: 12px; color: var(--text-sub); line-height: 1.7; }

/* 参数字典 */
.dict-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; }
.dict-item { border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; }
.di-h { display: flex; align-items: center; gap: 8px; }
.di-n { font-weight: 600; font-size: 13.5px; flex: 1; }
.di-g { font-size: 11px; color: var(--text-sub); background: #f3f4f6; border-radius: 4px; padding: 1px 6px; }
.di-k { margin-top: 6px; font-size: 11.5px; color: var(--text-sub); font-family: Consolas, monospace; }
.di-v { margin-top: 4px; font-size: 13px; }
.di-u { font-size: 11px; color: var(--text-sub); }
.di-d { margin-top: 6px; font-size: 12px; color: var(--text-sub); line-height: 1.6; }

/* 参数分组 */
.pgroup { border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; margin-bottom: 10px; }
.pg-name { font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.pg-items { display: flex; flex-wrap: wrap; gap: 12px 18px; }
.pg-item { display: flex; align-items: center; gap: 6px; }
.pg-label { font-size: 12.5px; width: 130px; color: #374151; cursor: help; }
.pg-unit { font-size: 11.5px; color: var(--text-sub); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }

/* ---------------- 口径试算器 ---------------- */
.gauge { background: #fafbfc; border: 1px solid var(--border); border-radius: 8px; padding: 14px 16px; margin-top: 14px; }
.gauge-in-card { margin-top: 14px; }
.gauge-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.gauge-head .gt { font-weight: 700; }
.gauge-head .gd { font-size: 12px; color: var(--text-sub); flex: 1; }
.gauge-body { display: flex; gap: 10px; flex-wrap: wrap; align-items: stretch; }
.g-kpi { flex: 1; min-width: 110px; border: 1px solid var(--border); border-radius: 6px; padding: 10px 12px; cursor: pointer; background: #fff; }
.g-kpi.on { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.gk-n { font-size: 12px; color: var(--text-sub); }
.gk-v { font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; }
.gk-s { font-size: 11.5px; color: var(--text-sub); }
.g-extra { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px 14px; padding: 8px 12px; border-left: 1px dashed var(--border); }
.g-extra div { font-size: 12px; color: var(--text-sub); }
.g-extra b { color: var(--text); margin-left: 6px; font-variant-numeric: tabular-nums; }
.gauge-empty { font-size: 12px; color: var(--text-sub); }
.gauge.mini .gk-v { font-size: 16px; }

/* ---------------- 组织 ---------------- */
.org-wrap { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: start; }
.org-tree { margin-bottom: 0; }

/* ---------------- 日志 ---------------- */
.log-box { max-height: 320px; overflow: auto; }
.log-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px dashed var(--border); font-size: 12px; }
.lg-t { color: var(--text-sub); width: 150px; font-variant-numeric: tabular-nums; }
.lg-s { color: #374151; }
.lg-m { color: var(--text-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------------- 通用 ---------------- */
.up { color: var(--up); }
.down { color: var(--down); }
.muted { color: var(--text-sub); }
.mono { font-variant-numeric: tabular-nums; }
.note { background: #fff8e6; border: 1px solid #ffe0a3; color: #8a5a00; padding: 10px 12px; border-radius: 4px; font-size: 12px; margin-bottom: 16px; line-height: 1.7; }
.ok-tip { margin-left: 12px; font-size: 12.5px; color: var(--down); }
.md-desc { font-size: 11.5px; color: var(--text-sub); margin-left: 8px; }
.tbl-scroll { max-height: 420px; overflow: auto; }
.tbl-scroll.tall { max-height: 560px; }
.tier-chip { display: inline-block; background: #f3f4f6; border: 1px solid var(--border); border-radius: 4px; padding: 2px 8px; margin: 0 6px 4px 0; font-size: 12px; }
.diff-pos { color: var(--up); font-weight: 600; }
.diff-neg { color: var(--down); font-weight: 600; }
.pass { color: var(--down); font-weight: 600; }
.fail { color: var(--up); font-weight: 600; }
table.pk { width: 100%; border-collapse: collapse; font-size: 13px; }
table.pk th, table.pk td { border: 1px solid var(--border); padding: 9px 12px; text-align: right; }
table.pk th:first-child, table.pk td:first-child { text-align: left; background: #fafafa; }
table.pk thead th { background: #f3f4f6; font-weight: 600; }
table.pk td.base { background: #fafafa; }

/* ===== 正常量分析 / 新版公共 ===== */
.na-steps { margin-bottom: 12px; }
.mb8 { margin-bottom: 8px; }
.src-grid.four { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.wk-bars { display: flex; align-items: flex-end; gap: 18px; padding: 14px 8px 6px; }
.wk-bar { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 64px; }
.wkb-v { font-size: 12px; color: #5a6478; }
.wkb-bar { width: 26px; background: linear-gradient(180deg, #4f8ef7, #1f6feb); border-radius: 4px 4px 0 0; min-height: 12px; }
.wkb-n { font-size: 12px; color: #8a94a6; }
.g-kpi { cursor: default; }

/* ===== 模型整体说明 / 台账工具条 ===== */
.ph-x:empty { display: none; }
.ph-x { margin-top: 6px; }
.mf-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.mf-card { border: 1px solid var(--line, #e6eaf0); border-radius: 8px; padding: 12px 14px; background: var(--bg2, #fafbfd); }
.mf-h { font-size: 14px; font-weight: 600; color: var(--fg, #1f2d3d); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.mf-no { display: inline-flex; width: 20px; height: 20px; border-radius: 50%; background: #1f6feb; color: #fff; font-size: 12px; align-items: center; justify-content: center; }
.mf-f { font-size: 15px; font-weight: 600; color: #1f6feb; margin-bottom: 6px; word-break: break-all; }
.mf-n { font-size: 12px; color: var(--muted, #8a94a6); line-height: 1.7; }
.q-lines { margin-top: 12px; border-top: 1px dashed var(--line, #e6eaf0); padding-top: 10px; }
.q-line { display: flex; align-items: baseline; gap: 10px; padding: 5px 0; font-size: 13px; }
.ql-no { color: #1f6feb; font-weight: 600; min-width: 42px; }
.ql-t { color: var(--fg, #1f2d3d); font-weight: 600; min-width: 190px; }
.ql-d { color: var(--muted, #8a94a6); }
.tool-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ref-val { color: #e8850c; font-size: 12px; }

/* 卡片标题右侧的功能按钮区（把按钮推到右上，标题长也不挤） */
.title-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card-title .sub { margin-right: 4px; }
/* 查询栏里的字段名 */
.qb-label { font-size: 12px; color: var(--text-sub); }
/* 图装进框里：不挤压、可横向滚动 */
.chart-wrap { width: 100%; overflow-x: auto; overflow-y: hidden; }
.chart-wrap .chart { min-width: 640px; }
.chart-tabs .el-tabs__content { padding-top: 4px; }
/* 正常量：当前格工作底稿的格子标识条（这一套修正只作用于这一格） */
.cur-cell {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  margin: 2px 0 8px; padding: 7px 12px; border-radius: 6px;
  background: #f5f7fb; border: 1px solid #e8edf5; font-size: 12.5px;
}
.cur-cell b { color: #6445c0; font-weight: 600; }
.cur-cell .save-dot {
  margin-left: auto; color: #2f9e44; font-size: 12px;
  background: #ebf7ee; border: 1px solid #cfe9d6; border-radius: 10px; padding: 1px 8px;
}
.bad { color: #e5533d; }

/* 码表维护：左分组右选项 */
.code-wrap { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 14px; align-items: start; }
.cg-list { display: flex; flex-direction: column; }
.cg-item { padding: 9px 10px; border-radius: 6px; cursor: pointer; border: 1px solid transparent; }
.cg-item:hover { background: #f6f8fb; }
.cg-item.on { border-color: var(--brand); background: rgba(31, 111, 235, .06); }
.cg-n { font-size: 13px; font-weight: 600; }
.cg-k { font-size: 12px; color: var(--text-sub); margin-top: 2px; }

/* 科目编辑大页面 */
.cf-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 18px; max-width: 1080px; }
.cf-grid .el-form-item { margin-right: 0; }
.std-editor { margin-top: 14px; border-top: 1px dashed var(--border); padding-top: 12px; }

/* 角色管理：左角色列表 + 右菜单权限 */
.role-wrap { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 14px; align-items: start; }
.rl-items { display: flex; flex-direction: column; }
.rl-item { padding: 9px 10px; border-radius: 6px; cursor: pointer; border: 1px solid transparent; }
.rl-item:hover { background: #f6f8fb; }
.rl-item.on { border-color: var(--brand); background: rgba(31, 111, 235, .06); }
.rl-n { font-size: 13px; font-weight: 600; display: flex; align-items: center; }
.rl-k { font-size: 12px; color: var(--text-sub); margin-top: 2px; }
.rp-form { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.rp-treehead { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.rp-h { font-size: 13px; font-weight: 600; }
.rp-tip { font-size: 12px; color: var(--text-sub); }
.rp-act { display: flex; align-items: center; gap: 8px; margin-top: 14px; border-top: 1px dashed var(--border); padding-top: 12px; }
.role-perm .el-tree { background: transparent; }
/* 超管：树只读展示 */
.role-perm .tree-ro .el-checkbox { pointer-events: none; opacity: .75; }
/* 账号弹窗两列排布，少滚动 */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; }
.form-grid .el-form-item { margin-right: 0; }
@media (max-width: 900px) {
  .role-wrap { grid-template-columns: minmax(0, 1fr); }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
}

/* 薪酬测算：三口径总量对比卡片 */
.cmp-row { display: flex; gap: 12px; flex-wrap: wrap; }
.cmp-card { flex: 1 1 260px; min-width: 250px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); overflow: hidden; }
.cmp-hd { padding: 8px 12px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cmp-bd { padding: 6px 12px 10px; }
.cmp-line { display: flex; align-items: baseline; gap: 8px; padding: 5px 0; border-bottom: 1px dashed var(--border); }
.cmp-line:last-child { border-bottom: none; }
.cmp-line span { width: 108px; flex: none; font-size: 12px; color: var(--text-sub); }
.cmp-line b { font-size: 15px; }
.cmp-line i { margin-left: auto; font-style: normal; font-size: 12px; }
.cmp-up { color: #e5533d; }    /* 变大 */
.cmp-down { color: #18a058; }  /* 变小 */

/* ===== 语义分区：同一组字段在不同页面语义不同（数据范围 / 参数口径 / 切片口径 / 筛选），
   用颜色 + 徽标 + 标题把「这是干什么的」写在脸上，别让人靠猜 ===== */
.sec { border: 1px solid var(--border); border-left: 3px solid var(--border); border-radius: 4px;
       padding: 12px 14px 2px; margin-bottom: 14px; }
.sec-h { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; margin-bottom: 12px; flex-wrap: wrap; }
.sec-h .badge { font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 10px; border: 1px solid currentColor; letter-spacing: .3px; }
/* 独立徽标（表格里用） */
.badge { display: inline-block; font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 10px;
         border: 1px solid currentColor; letter-spacing: .3px; line-height: 18px; }
.sec-h .sec-d { font-size: 12px; font-weight: 400; color: var(--text-sub); }
/* 数据范围：取哪段数据做分析（蓝） */
.sec-data { border-left-color: #409eff; background: #f6faff; }
.sec-data .badge { color: #2f6fd0; }
/* 参数口径：参数挂在哪一层（橙） */
.sec-param { border-left-color: #e6a23c; background: #fffcf5; }
.sec-param .badge { color: #b0781f; }
/* 切片口径：方案的分析单位与 Σ 上界（紫） */
.sec-slice { border-left-color: #7c5cd6; background: #faf8ff; }
.sec-slice .badge { color: #6445c0; }
/* 筛选：只是看，不改数据（灰） */
.q-label { font-size: 12px; color: var(--text-sub); padding: 1px 8px; border: 1px dashed var(--border);
           border-radius: 10px; margin-right: 2px; }
/* 切片口径卡片式单选 */
.slice-cards { display: flex; gap: 10px; flex-wrap: wrap; }
.slice-card { border: 1px solid var(--border); border-radius: 4px; padding: 10px 12px; width: 210px;
              cursor: pointer; background: #fff; transition: all .15s; }
.slice-card:hover { border-color: #b9a6f0; }
.slice-card.on { border-color: #7c5cd6; background: #f6f2ff; box-shadow: 0 0 0 1px #7c5cd6 inset; }
.slice-card .sc-k { font-weight: 600; font-size: 13px; display: flex; align-items: center; gap: 6px; }
.slice-card .sc-u { font-size: 12px; color: var(--text-sub); margin-top: 4px; line-height: 1.6; }
.slice-card .sc-s { font-size: 12px; color: #6445c0; margin-top: 4px; }
.slice-card.off { opacity: .55; cursor: not-allowed; }

/* ---------------- 门户首页 ---------------- */
.portal { display: grid; grid-template-columns: 300px 1fr 1fr; gap: 14px; align-items: start; max-width: 1400px; }
.pt-card { background: var(--panel); border: 1px solid var(--border); border-radius: 8px; padding: 14px 16px; }
.pt-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.pt-title { font-size: 15px; font-weight: 700; }
.pt-more { font-size: 12px; color: var(--text-sub); cursor: pointer; }
.pt-more:hover { color: var(--brand); }
.pt-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.pt-col > .pt-card { flex: 1; }
.pt-span { grid-column: 1 / -1; }

/* 左列：banner + 欢迎 + 格言 + 心情 */
.pt-banner { border-radius: 8px; overflow: hidden; }
.pt-bn { height: 150px; border-radius: 8px; padding: 22px 24px; color: #fff; display: flex; flex-direction: column; justify-content: center; position: relative; }
.pt-bn.s1 { background: linear-gradient(120deg, #123a8f 0%, #1f6feb 60%, #38a3ff 110%); }
.pt-bn.s2 { background: linear-gradient(120deg, #123a8f 0%, #1f6feb 70%, #29b6f6 130%); }
.pt-bn-t { font-size: 24px; font-weight: 800; letter-spacing: 2px; }
.pt-bn-s { margin-top: 10px; font-size: 12.5px; opacity: .85; }
.pt-bn-chip { position: absolute; top: 14px; right: 16px; font-size: 11px; background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.4); border-radius: 10px; padding: 2px 10px; }
.pt-hi { display: flex; gap: 12px; align-items: flex-start; }
.pt-hi-main { flex: 1; min-width: 0; }
.pt-hi-t { font-size: 16px; font-weight: 700; }
.pt-hi-role { margin-top: 2px; font-size: 12.5px; color: var(--text-sub); }
.pt-hi-msg { margin-top: 10px; font-size: 13px; line-height: 1.7; color: #374151; }
.pt-hi-mood { margin-top: 12px; background: #f9fafb; border-radius: 8px; padding: 10px 12px; }
.pt-mood-t { font-size: 13px; font-weight: 600; margin-bottom: 8px; }
.pt-mood-faces { display: flex; align-items: center; gap: 14px; }
.pt-hi-mood .pt-face { font-size: 20px; padding: 2px; }
.pt-face { font-size: 22px; cursor: pointer; border-radius: 50%; padding: 4px; line-height: 1; border: 2px solid transparent; }
.pt-face:hover { background: #f3f4f6; }
.pt-face.on { border-color: var(--brand); background: #eef3fe; }
.pt-mood-done { font-size: 12.5px; color: #12924a; }

/* 中/右列：列表卡 */
.pt-list { min-height: 120px; }
.pt-row { display: flex; align-items: center; gap: 10px; padding: 8px 2px; border-bottom: 1px dashed #eef0f4; cursor: pointer; }
.pt-row:last-child { border-bottom: none; }
.pt-row:hover .pt-row-t { color: var(--brand); }
.pt-row-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.pt-row-k { font-size: 11.5px; color: #9ca3af; white-space: nowrap; }
.pt-tag { font-size: 11px; border: 1px solid currentColor; border-radius: 3px; padding: 0 6px; line-height: 18px; background: #fff; white-space: nowrap; }
.pt-tag.ok { color: #12924a; }
.pt-tag.warn { color: #e8912d; }
.pt-tag.off { color: #9ca3af; }

/* 快捷服务：外部链接（可维护） + 内页跳转 */
.pt-srv-actions { display: flex; gap: 8px; align-items: center; }
.pt-srv { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; margin-top: 12px; }
.pt-srv-item { text-align: center; padding: 12px 4px; border-radius: 8px; cursor: pointer; position: relative; }
.pt-srv-item:hover { background: #f0f4ff; }
.pt-srv-ico { width: 42px; height: 42px; margin: 0 auto 6px; border-radius: 11px; background: linear-gradient(135deg, #eef3fe, #e3ecff);
  color: #1d3f97; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; }
.pt-srv-ico svg { display: block; }
.pt-srv-ico.char { font-size: 17px; }
.pt-srv-name { font-size: 12.5px; }
.pt-srv-desc { font-size: 11px; color: #9ca3af; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-srv-item .pt-srv-del, .pt-srv-item .pt-srv-edit { position: absolute; top: 2px; font-size: 11px; padding: 0; }
.pt-srv-item .pt-srv-del { right: 4px; }
.pt-srv-item .pt-srv-edit { left: 4px; }
.pt-srv-empty { grid-column: 1 / -1; text-align: center; color: #9ca3af; font-size: 12.5px; padding: 22px 0; }
.pt-srv-form { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed #eef0f4; flex-wrap: wrap; }

@media (max-width: 1100px) {
  .portal { grid-template-columns: 1fr 1fr; }
  .pt-col.left { grid-column: 1 / -1; }
  .pt-srv { grid-template-columns: repeat(4, 1fr); }
}

/* 说明点：规则收进悬浮提示 */
.hint-dot { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px;
  border-radius: 50%; border: 1px solid #c9ced6; color: #9aa3b2; font-size: 10px; line-height: 1;
  cursor: help; vertical-align: middle; margin-left: 6px; font-weight: 600; }
.hint-dot:hover { border-color: #1d3f97; color: #1d3f97; }
.hint-dot-pop { max-width: 380px; line-height: 1.7; font-size: 12px; }

/* 方案 PK：方案为列、指标为行（懂车帝式对比矩阵） */
.pk-matrix .pk-grp-row td { background: #f5f7fb !important; }
.pk-matrix .pk-grp { color: #14244a; font-size: 12.5px; letter-spacing: .3px; }
.pk-col-h { line-height: 1.5; padding: 2px 0; }
.pk-col-h b { font-size: 12.5px; color: #14244a; }
.pk-col-h .muted { font-size: 11px; color: #9aa3b2; }
.pk-diff { color: #1f6feb; font-weight: 600; }
.pk-same { color: #9aa3b2; }
.pk-strong { font-size: 13px; }
/* 格子编制单元格：调整后为主（正常黑），调整前灰字小号附注 */
.pk-before { font-size: 11px; color: #9aa3b2; font-weight: 400; margin-top: 1px; }

/* 首页 banner 轮播：可点击圆点 + 悬浮暂停 */
.pt-banner .el-carousel__indicators { bottom: 8px; }
.pt-banner .el-carousel__button { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.55); opacity: 1; }
.pt-banner .el-carousel__indicator.is-active .el-carousel__button { width: 20px; border-radius: 4px; background: #fff; }

/* 快捷服务：内置图标选择器 */
.pt-ico-pick { display: flex; flex-wrap: wrap; gap: 4px; max-width: 330px; }
.pt-ico-opt { width: 30px; height: 30px; border-radius: 8px; background: #f3f6fc; border: 1.5px solid transparent;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.pt-ico-opt:hover { border-color: #b9c9ef; }
.pt-ico-opt.on { border-color: #1f6feb; background: #e8f0ff; }

/* ---- 角色权限三级树（组 / 页面 / 按钮）与数据范围 ---- */
.rl-k2 { font-size: 11px; color: var(--text-sub); margin-top: 2px; opacity: .9; }
.perm-tree { max-height: 400px; overflow: auto; border: 1px solid var(--border); border-radius: 6px; padding: 4px 2px; }
.perm-tree .el-tree-node__content { height: 28px; }
.pn { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pn-key { font-size: 11px; color: var(--text-sub); font-family: ui-monospace, Menlo, Consolas, monospace; opacity: .65; }
.pn.lv-group .pn-name { font-weight: 600; }
.pn.lv-btn { font-size: 12px; }
.pn-act { padding: 1px 8px; border-radius: 10px; background: #eef2f8; color: #4a5b73; font-size: 12px; line-height: 18px; }
.pn-act.ed { background: #e8f6ee; color: #1a7f4b; }
.rp-scope { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 2px 0 4px; }
.plan-owner { display: inline-flex; align-items: center; gap: 4px; }
.plan-ro { color: var(--text-sub); font-size: 12px; }
