/* ================= 专项监测 · 四项考核指标样式 ================= */
.lw-kpi { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.lw-kpi-c { background: var(--panel); border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow); border-left: 3px solid var(--line); }
.lw-kpi-c .k { font-size: 12.5px; color: var(--ink-2); }
.lw-kpi-c .v { font-size: 25px; font-weight: 800; line-height: 1.3; font-variant-numeric: tabular-nums; }
.lw-kpi-c .v small { font-size: 11.5px; font-weight: 500; color: var(--ink-3); margin-left: 4px; }
.lw-kpi-c .s { font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.lw-kpi-c.blue { border-left-color: var(--brand); } .lw-kpi-c.blue .v { color: var(--brand); }
.lw-kpi-c.green { border-left-color: var(--green); } .lw-kpi-c.green .v { color: var(--green); }
.lw-kpi-c.orange { border-left-color: var(--orange-solid); } .lw-kpi-c.orange .v { color: var(--orange); }
.lw-kpi-c.red { border-left-color: var(--red-solid); } .lw-kpi-c.red .v { color: var(--red); }
.lw-kpi-c.purple { border-left-color: #8b5cf6; } .lw-kpi-c.purple .v { color: #7c3aed; }

/* ---- 测点选择 ---- */
.lw-pick { display: flex; gap: 18px; align-items: flex-end; flex-wrap: wrap; padding: 4px 0 14px; border-bottom: 1px dashed var(--line); }
.lw-pick-l { flex: 1 1 320px; min-width: 260px; }
.lw-pick-l label { display: block; font-size: 12.5px; color: var(--ink-2); margin-bottom: 6px; }
.lw-pick-l select {
  width: 100%; padding: 9px 12px; border: 1px solid var(--line); border-radius: 9px;
  font-size: 13.5px; color: var(--ink); background: #fff; font-family: inherit; cursor: pointer;
}
.lw-pick-l select:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.lw-pick-meta { font-size: 11.5px; color: var(--ink-3); margin-top: 6px; }
.lw-pick-r { display: flex; flex-direction: column; gap: 6px; }
.lw-btn {
  border: none; cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 600;
  color: #fff; background: linear-gradient(135deg, var(--brand), var(--brand-2));
  padding: 11px 26px; border-radius: 10px; box-shadow: 0 4px 12px rgba(22, 104, 220, .25);
  transition: all .15s; min-width: 176px;
}
.lw-btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(22, 104, 220, .32); }
.lw-btn:disabled { opacity: .75; cursor: wait; }
.lw-pick-tip { font-size: 11.5px; color: var(--ink-3); }

.lw-empty { padding: 42px 16px; text-align: center; color: var(--ink-3); font-size: 13.5px; background: #fafcff; border-radius: 10px; }
.lw-alert { margin-top: 12px; padding: 10px 14px; border-radius: 9px; font-size: 13px; }
.lw-alert.bad { background: var(--red-bg); color: var(--red); }

/* ---- 解读结果 ---- */
.lw-read { display: flex; gap: 18px; align-items: stretch; }
.lw-read-l { flex: 1 1 58%; min-width: 0; }
.lw-read-r { flex: 1 1 34%; background: #fafcff; border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.lw-verdict { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.lw-verdict .lv { font-size: 15px; padding: 6px 18px; }
.lw-conf, .lw-risk { text-align: center; }
.lw-conf b, .lw-risk b { display: block; font-size: 22px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.lw-conf b { color: var(--brand); }
.lw-risk b { color: var(--orange); }
.lw-conf span, .lw-risk span { font-size: 11px; color: var(--ink-3); }
.lw-sum { font-size: 15px; line-height: 1.75; color: var(--ink); background: var(--brand-soft); border-radius: 10px; padding: 13px 16px; margin-bottom: 14px; }
.lw-ev-hd, .lw-acts-hd, .lw-factors-hd { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 8px; }
.lw-ev-i { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.7; color: var(--ink-2); padding: 3px 0; }
.lw-ev-i i, .lw-act i { flex-shrink: 0; width: 18px; height: 18px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); font-size: 11px; font-style: normal; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.lw-num { display: flex; justify-content: space-between; align-items: baseline; padding: 7px 0; border-bottom: 1px dashed var(--line); }
.lw-num span { font-size: 12.5px; color: var(--ink-2); }
.lw-num b { font-size: 19px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.lw-num b em { font-size: 11px; font-weight: 500; color: var(--ink-3); font-style: normal; margin-left: 3px; }
.lw-spark { width: 100%; height: 54px; margin-top: 10px; display: block; }
.lw-num-s { font-size: 11px; color: var(--ink-3); text-align: center; }

.lw-cause { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.lw-cause > div { background: #fafcff; border: 1px solid var(--line); border-radius: 10px; padding: 11px 14px; font-size: 13px; line-height: 1.7; color: var(--ink-2); }
.lw-cause b { display: block; color: var(--ink); font-size: 12.5px; margin-bottom: 4px; }
.lw-acts { margin-top: 14px; }
.lw-act { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.7; padding: 4px 0; }
.lw-act i { background: var(--green-bg); color: var(--green); }
.lw-factors { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--line); }
.lw-f-row { display: grid; grid-template-columns: 92px 120px 96px 1fr; gap: 10px; align-items: center; padding: 5px 0; font-size: 12.5px; }
.lw-f-k { color: var(--ink-2); }
.lw-f-b { height: 8px; background: #eef2f7; border-radius: 4px; overflow: hidden; }
.lw-f-b i { display: block; height: 100%; background: linear-gradient(90deg, #7aa9f0, var(--brand)); border-radius: 4px; }
.lw-f-v { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink); }
.lw-f-v em { font-size: 10.5px; font-weight: 500; color: var(--ink-3); font-style: normal; margin-left: 5px; }
.lw-f-n { color: var(--ink-3); font-size: 11.5px; }

/* ---- 效率对照 ---- */
.lw-eff { display: flex; gap: 16px; align-items: stretch; }
.lw-eff-side { flex: 1; border-radius: 12px; padding: 15px 16px; border: 1px solid var(--line); }
.lw-eff-side.before { background: #fdfaf6; border-color: #f3e3cc; }
.lw-eff-side.after { background: #f6fbf8; border-color: #d6eedd; }
.lw-eff-hd { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 8px; }
.lw-eff-v { font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; margin-bottom: 10px; }
.lw-eff-side.before .lw-eff-v { color: var(--orange); }
.lw-eff-side.after .lw-eff-v { color: var(--green); }
.lw-eff-v small { font-size: 12px; font-weight: 500; color: var(--ink-3); margin-left: 4px; }
.lw-eff-step { display: flex; gap: 8px; align-items: center; font-size: 12.5px; color: var(--ink-2); padding: 3px 0; }
.lw-eff-step i { width: 17px; height: 17px; border-radius: 50%; background: #fff; border: 1px solid var(--line); font-size: 10.5px; font-style: normal; display: flex; align-items: center; justify-content: center; color: var(--ink-3); flex-shrink: 0; }
.lw-eff-mid { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 96px; }
.lw-eff-arrow { font-size: 22px; color: var(--ink-3); line-height: 1; }
.lw-eff-gain { font-size: 12px; color: var(--ink-2); text-align: center; margin-top: 6px; }
.lw-eff-gain b { display: block; font-size: 20px; color: var(--green); font-weight: 800; }
.lw-eff-note { margin-top: 13px; font-size: 12px; line-height: 1.85; color: var(--ink-3); background: #fafcff; border-radius: 9px; padding: 10px 13px; }
.lw-eff-note b { color: var(--ink); }
.lw-ok { color: var(--green); font-weight: 700; margin-left: 6px; }
.lw-bad { color: var(--red); font-weight: 700; margin-left: 6px; }

/* ---- 表格 ---- */
.lw-tb { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.lw-tb th {
  text-align: left; font-weight: 600; color: var(--ink-3); font-size: 11.5px;
  padding: 8px 9px; border-bottom: 1px solid var(--line); white-space: nowrap; background: #fafcff;
}
.lw-tb td { padding: 8px 9px; border-bottom: 1px solid #f2f6fb; color: var(--ink-2); }
.lw-tb tbody tr:hover td { background: #fafcff; }
.lw-tb td b { color: var(--ink); }
.lw-tb td em { font-style: normal; }
.lw-tb td.mono, .lw-tb .mono { font-variant-numeric: tabular-nums; }
.lw-tb td.ok { color: var(--green); font-weight: 700; }
.lw-tb td.dim, .lw-tb .dim { color: var(--ink-3); }
.lw-tb.mini th { width: 42%; background: transparent; color: var(--ink-2); font-size: 12.5px; border-bottom: 1px dashed var(--line); }
.lw-tb.mini td { text-align: right; font-size: 13px; color: var(--ink); font-weight: 600; border-bottom: 1px dashed var(--line); }

/* ---- 权重 / 等级 ---- */
.lw-w-row { display: grid; grid-template-columns: 84px 1fr 1fr; gap: 10px; align-items: center; padding: 6px 0; }
.lw-w-k { font-size: 12.5px; color: var(--ink); font-weight: 600; }
.lw-w-b { position: relative; height: 9px; background: #eef2f7; border-radius: 5px; overflow: hidden; min-width: 0; }
.lw-w-b i { display: block; height: 100%; background: linear-gradient(90deg, #93b8f2, var(--brand)); border-radius: 5px; }
.lw-w-b b { position: absolute; right: -38px; top: -6px; font-size: 11.5px; color: var(--brand); font-weight: 700; }
.lw-w-n { font-size: 11.5px; color: var(--ink-3); grid-column: 2 / 4; margin-top: -4px; }
.lw-split { height: 1px; background: var(--line); margin: 12px 0; }
.lw-grade { display: flex; gap: 10px; flex-wrap: wrap; }
.lw-grade > div { flex: 1; min-width: 96px; background: #fafcff; border-radius: 9px; padding: 9px 10px; text-align: center; border: 1px solid var(--line); }
.lw-grade b { display: block; font-size: 12.5px; color: var(--ink-2); margin-bottom: 5px; font-variant-numeric: tabular-nums; }
.lw-grade .lv { font-size: 11.5px; padding: 2px 9px; }

.lw-note { margin-top: 12px; font-size: 12px; line-height: 1.9; color: var(--ink-3); background: #fafcff; border-radius: 9px; padding: 11px 14px; }
.lw-note.long { line-height: 2.05; }
.lw-note b { color: var(--ink); }
.lw-dir { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11px; background: #eef2f7; color: var(--ink-3); }
.lw-dir.up { background: var(--orange-bg); color: var(--orange); }
.lw-dir.down { background: var(--blue-bg); color: var(--blue); }

/* ---- 混淆矩阵 ---- */
.lw-cm { width: 100%; border-collapse: separate; border-spacing: 5px; font-size: 12.5px; }
.lw-cm th { font-weight: 600; color: var(--ink-3); font-size: 11.5px; padding: 5px; text-align: center; }
.lw-cm tbody th { text-align: left; width: 78px; color: var(--ink-2); }
.lw-cm td { text-align: center; padding: 13px 8px; border-radius: 9px; font-weight: 800; font-size: 16px; font-variant-numeric: tabular-nums; }
.lw-cm td em { display: block; font-size: 10.5px; font-weight: 500; font-style: normal; opacity: .8; margin-top: 2px; }
.lw-cm .hit { background: var(--green-bg); color: var(--green); }
.lw-cm .false { background: var(--red-bg); color: var(--red); }
.lw-cm .miss { background: var(--orange-bg); color: var(--orange); }
.lw-cm .tn { background: #f2f6fb; color: var(--ink-3); }
.lw-cm-side { margin-top: 12px; }
.lw-cm-side > div { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.lw-cm-side span { color: var(--ink-2); }
.lw-cm-side b { font-variant-numeric: tabular-nums; color: var(--ink); }
.lw-cm-side b.dim { color: var(--ink-3); font-weight: 600; }

/* ---- 流程 ---- */
.lw-flow { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.lw-flow-hd { font-size: 12.5px; font-weight: 700; padding: 7px 12px; border-radius: 8px; margin-bottom: 9px; }
.lw-flow-hd.bad { background: var(--orange-bg); color: var(--orange); }
.lw-flow-hd.ok { background: var(--green-bg); color: var(--green); }
.lw-flow-i { display: flex; gap: 9px; align-items: center; padding: 5px 10px; font-size: 12.5px; color: var(--ink-2); border-left: 2px solid var(--line); margin-left: 6px; }
.lw-flow-i i { width: 17px; height: 17px; border-radius: 50%; background: #fff; border: 1px solid var(--line); font-size: 10.5px; font-style: normal; display: flex; align-items: center; justify-content: center; color: var(--ink-3); flex-shrink: 0; }
.lw-flow-i span { flex: 1; }
.lw-flow-i em { font-size: 11px; color: var(--ink-3); font-style: normal; }

/* ---- 试点 ---- */
.lw-pilot { display: flex; gap: 22px; align-items: center; }
.lw-pilot-l { flex: 1; }
.lw-pilot-t { font-size: 21px; font-weight: 800; color: var(--ink); margin-bottom: 6px; }
.lw-pilot-d { font-size: 13px; color: var(--ink-2); margin-bottom: 14px; }
.lw-pilot-d b { color: var(--brand); font-size: 16px; }
.lw-pilot-kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.lw-pilot-kv > div { background: #fafcff; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; }
.lw-pilot-kv span { display: block; font-size: 11.5px; color: var(--ink-3); margin-bottom: 3px; }
.lw-pilot-kv b { font-size: 18px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.lw-ring {
  width: 132px; height: 132px; border-radius: 50%; flex-shrink: 0;
  background: conic-gradient(var(--brand) calc(var(--p) * 1%), #eef2f7 0);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  position: relative;
}
.lw-ring::before { content: ""; position: absolute; inset: 11px; background: #fff; border-radius: 50%; }
.lw-ring b { position: relative; font-size: 27px; font-weight: 800; color: var(--brand); line-height: 1; font-variant-numeric: tabular-nums; }
.lw-ring b small { font-size: 12px; font-weight: 600; }
.lw-ring span { position: relative; font-size: 11px; color: var(--ink-3); margin-top: 5px; }

.lw-score { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lw-score-i { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; background: #fff; position: relative; overflow: hidden; }
.lw-score-i.pass { border-color: #cbead6; background: linear-gradient(180deg, #f6fbf8, #fff); }
.lw-score-i.fail { border-color: #f6dcc4; background: linear-gradient(180deg, #fefaf5, #fff); }
.lw-score-hd { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.lw-score-id { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 6px; background: var(--brand-soft); color: var(--brand); }
.lw-score-hd b { font-size: 14px; color: var(--ink); flex: 1; }
.lw-score-badge { font-size: 11.5px; font-weight: 700; padding: 2px 10px; border-radius: 999px; }
.lw-score-i.pass .lw-score-badge { background: var(--green-bg); color: var(--green); }
.lw-score-i.fail .lw-score-badge { background: var(--orange-bg); color: var(--orange); }
.lw-score-t { font-size: 12px; color: var(--ink-3); margin-bottom: 4px; }
.lw-score-a { font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 9px; }
.lw-score-ev { font-size: 11.5px; line-height: 1.85; color: var(--ink-2); background: #fafcff; border-radius: 8px; padding: 9px 12px; }
.lw-score-m { font-size: 11px; color: var(--ink-3); margin-top: 8px; }

@media (max-width: 1200px) {
  .lw-kpi { grid-template-columns: repeat(2, 1fr); }
  .lw-score { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .lw-read, .lw-eff, .lw-flow, .lw-cause, .lw-pilot { flex-direction: column; display: flex; }
  .lw-cause, .lw-flow { display: block; }
  .lw-cause > div + div, .lw-flow-col + .lw-flow-col { margin-top: 12px; }
  .lw-f-row { grid-template-columns: 76px 1fr 80px; }
  .lw-f-n { grid-column: 1 / 4; }
}
