/* 江南水务一线党建 AI 沙盘 · 样式
   视觉语言：水厂中控台账（刻度、栅格、留痕）+ 红头文件（宋体标题、朱砂印记） */

:root{
  --bg:#e6ebed;
  --paper:#fff;
  --paper2:#f3f6f7;
  --ink:#14262f;
  --ink2:#2c414b;
  --muted:#5f727b;
  --rule:#c6d4d9;
  --rule2:#dde7ea;
  --seal:#ab2f2a;
  --seal-soft:#f2e0de;
  --water:#0f6f89;
  --water-soft:#e0eef2;
  --moss:#3d6a49;
  --amber:#9d6c14;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif CJK SC","SimSun",serif;
  --gut:clamp(16px,4vw,32px);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:16px;line-height:1.7;
  background-image:linear-gradient(var(--rule2) 1px,transparent 1px),linear-gradient(90deg,var(--rule2) 1px,transparent 1px);
  background-size:44px 44px;background-position:-1px -1px;
}
img{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--water)}
:focus-visible{outline:2px solid var(--seal);outline-offset:2px}

/* ---------- 顶栏 ---------- */
.bar{position:sticky;top:0;z-index:40;background:rgba(230,235,237,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.bar-in{max-width:1180px;margin:0 auto;padding:9px var(--gut);display:flex;align-items:center;gap:12px}
.mark{display:flex;align-items:center;gap:9px;min-width:0}
.seal{width:34px;height:34px;flex:none;border:1.5px solid var(--seal);color:var(--seal);border-radius:5px;
  display:grid;place-items:center;font-family:var(--serif);font-size:11px;line-height:1.1;text-align:center;letter-spacing:.02em}
.mark b{font-family:var(--serif);font-size:15px;font-weight:600;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mark span{display:block;font-size:11px;color:var(--muted);letter-spacing:.06em}
.bar-sp{flex:1}
.tally{display:flex;align-items:center;gap:7px;border:1px solid var(--rule);background:var(--paper);
  border-radius:4px;padding:4px 9px;font-size:12px;color:var(--ink2);white-space:nowrap}
.tally b{font-family:var(--serif);font-size:16px;color:var(--seal);font-weight:600;font-variant-numeric:tabular-nums}
.ghost{border:1px solid var(--rule);background:var(--paper);border-radius:4px;padding:5px 10px;font-size:12.5px;color:var(--ink2)}
.ghost:hover{border-color:var(--water);color:var(--water)}
.ghost[hidden]{display:none}

/* ---------- 导航 ---------- */
.nav{border-bottom:1px solid var(--rule);background:rgba(243,246,247,.9);position:sticky;top:53px;z-index:35}
.nav-in{max-width:1180px;margin:0 auto;padding:0 var(--gut);display:flex;gap:0;overflow-x:auto;scrollbar-width:none}
.nav-in::-webkit-scrollbar{display:none}
.nav-in a{flex:none;padding:9px 13px;font-size:13.5px;color:var(--ink2);border-bottom:2px solid transparent;text-decoration:none;white-space:nowrap}
.nav-in a.on{color:var(--seal);border-bottom-color:var(--seal)}

/* ---------- 布局 ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--gut) 96px}
section{padding:44px 0;border-bottom:1px solid var(--rule)}
section:last-of-type{border-bottom:0}
.head{display:flex;align-items:baseline;gap:12px;margin-bottom:6px}
.head .no{font-family:var(--serif);font-size:13px;color:var(--seal);border:1px solid var(--seal);border-radius:3px;padding:1px 6px;flex:none}
.head h2{font-family:var(--serif);font-size:clamp(21px,4.4vw,28px);font-weight:600;margin:0;letter-spacing:.01em}
.sub{color:var(--muted);font-size:14px;margin:0 0 22px;max-width:62ch}

/* ---------- 工况牌（Hero） ---------- */
.board{background:var(--paper);border:1px solid var(--rule);border-top:4px solid var(--seal);margin:26px 0 0;padding:clamp(20px,4vw,34px)}
.board-t{font-family:var(--serif);font-size:clamp(26px,6.6vw,44px);line-height:1.22;margin:0;font-weight:600}
.board-t em{font-style:normal;color:var(--seal)}
.board-m{color:var(--muted);font-size:14px;margin:10px 0 0;max-width:64ch}
.board-id{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--muted);margin-top:14px;padding-top:14px;border-top:1px dashed var(--rule)}
.board-id b{color:var(--ink2);font-weight:600}

.gauges{display:grid;gap:0;margin-top:24px;border-top:1px solid var(--rule)}
.gauge{padding:13px 0;border-bottom:1px solid var(--rule2);display:grid;grid-template-columns:1fr auto;gap:4px 14px;align-items:baseline}
.gauge-k{font-size:13.5px;color:var(--ink2)}
.gauge-v{font-family:var(--serif);font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}
.gauge-v i{font-style:normal;font-size:12px;color:var(--muted);margin-left:3px;font-family:var(--sans)}
.gauge-track{grid-column:1/-1;height:7px;background:var(--paper2);border:1px solid var(--rule2);position:relative;overflow:hidden}
.gauge-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--water);transition:width 1.1s cubic-bezier(.22,.9,.3,1)}
.gauge.seal .gauge-fill{background:var(--seal)}
.gauge-n{grid-column:1/-1;font-size:11.5px;color:var(--muted)}
@media (prefers-reduced-motion:reduce){.gauge-fill{transition:none}}

/* ---------- 通用块 ---------- */
.grid{display:grid;gap:14px}
@media(min-width:760px){
  .g2{grid-template-columns:1fr 1fr}
  .g3{grid-template-columns:repeat(3,1fr)}
  .g4{grid-template-columns:repeat(4,1fr)}
}
.slab{background:var(--paper);border:1px solid var(--rule);padding:16px}
.slab h3{font-family:var(--serif);font-size:16px;margin:0 0 8px;font-weight:600}
.slab p{margin:0;font-size:13.5px;color:var(--ink2)}
.kv{font-size:13px;color:var(--muted)}
.kv b{display:block;font-family:var(--serif);font-size:20px;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}

/* 表格 */
.tbl{width:100%;border-collapse:collapse;background:var(--paper);font-size:13.5px}
.tbl th,.tbl td{border:1px solid var(--rule2);padding:9px 11px;text-align:left;vertical-align:top}
.tbl th{background:var(--paper2);font-weight:600;font-size:12.5px;color:var(--ink2);white-space:nowrap}
.tbl tr:hover td{background:#fbfdfd}
.scroll{overflow-x:auto;border:1px solid var(--rule);-webkit-overflow-scrolling:touch}
.scroll .tbl{border:0;min-width:560px}

/* 条形对比 */
.bars{background:var(--paper);border:1px solid var(--rule);padding:16px}
.bar-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:7px 0;font-size:13.5px}
.bar-row .t{width:5.6em;color:var(--ink2)}
.bar-row .v{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12.5px;white-space:nowrap}
.bar-b{height:16px;background:var(--water-soft);position:relative}
.bar-b i{position:absolute;inset:0 auto 0 0;background:var(--water);display:block}
.bar-b.s i{background:var(--seal)}

/* 流程 */
.flow{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.flow-i{flex:1 1 150px;background:var(--paper);border:1px solid var(--rule);border-left:3px solid var(--water);padding:11px 13px;font-size:13px}
.flow-i b{display:block;font-family:var(--serif);font-size:12px;color:var(--water);margin-bottom:3px;font-weight:600}
.flow-i:nth-child(2){border-left-color:var(--seal)}
.flow-i:nth-child(2) b{color:var(--seal)}

/* 标签 */
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
.tag{font-size:11.5px;border:1px solid var(--rule);background:var(--paper2);padding:2px 8px;border-radius:3px;color:var(--ink2)}
.tag.v{border-color:#bcd6c4;background:#eef5f0;color:var(--moss)}
.tag.n{border-color:#e2cfa6;background:#fbf5e8;color:var(--amber)}
.tag.s{border-color:#e3c4c2;background:var(--seal-soft);color:var(--seal)}

/* 提示条 */
.note{border-left:3px solid var(--amber);background:#fdf9f0;padding:11px 14px;font-size:13px;color:var(--ink2);margin:14px 0 0}
.note.s{border-left-color:var(--seal);background:var(--seal-soft)}

/* ---------- 岗位模块 ---------- */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.chip{border:1px solid var(--rule);background:var(--paper);padding:6px 11px;font-size:13px;border-radius:3px;color:var(--ink2)}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.post{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--water)}
.post-h{padding:16px 18px;border-bottom:1px solid var(--rule2)}
.post-h h3{font-family:var(--serif);font-size:20px;margin:0;font-weight:600}
.post-b{display:grid;gap:0}
@media(min-width:820px){.post-b{grid-template-columns:1fr 1fr}}
.cell{padding:15px 18px;border-bottom:1px solid var(--rule2)}
@media(min-width:820px){.cell:nth-child(odd){border-right:1px solid var(--rule2)}}
.cell h4{font-size:12.5px;color:var(--muted);margin:0 0 8px;font-weight:600;letter-spacing:.04em}
.cell ul{margin:0;padding-left:1.15em;font-size:13.5px}
.cell li{margin-bottom:5px}
.cell li small{display:block;color:var(--muted);font-size:11.5px}

/* 热力矩阵 */
.heat{display:grid;grid-template-columns:auto repeat(5,1fr);gap:2px;font-size:11px;background:var(--paper);border:1px solid var(--rule);padding:12px}
.heat-c{aspect-ratio:1.5;display:grid;place-items:center;text-align:center;padding:2px;line-height:1.2;font-size:10px;color:#fff;border-radius:2px}
.heat-ax{display:grid;place-items:center;color:var(--muted);font-size:10.5px}

/* ---------- AI 提示词 ---------- */
.builder{background:var(--paper);border:1px solid var(--rule);padding:18px}
.field{margin-bottom:14px}
.field label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:5px;font-weight:600}
.field select,.field textarea,.field input{width:100%;border:1px solid var(--rule);background:var(--paper2);padding:9px 10px;font-size:14px;border-radius:3px}
.field textarea{min-height:80px;resize:vertical;font-family:var(--sans);line-height:1.6}
.out{background:#f7fafb;border:1px solid var(--rule);border-left:3px solid var(--water);padding:14px;white-space:pre-wrap;font-size:13px;line-height:1.75;max-height:400px;overflow:auto}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.btn{border:1px solid var(--ink);background:var(--ink);color:#fff;padding:9px 16px;font-size:13.5px;border-radius:3px}
.btn:hover{background:#0b1a21}
.btn.o{background:transparent;color:var(--ink);}
.btn.o:hover{background:var(--paper2)}
.btn.s{background:var(--seal);border-color:var(--seal)}
.btn.s:hover{background:#942723}
.lib{display:grid;gap:10px;margin-top:16px}
.lib-i{background:var(--paper);border:1px solid var(--rule)}
.lib-i>summary{padding:12px 15px;font-size:14px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;align-items:center;list-style:none}
.lib-i>summary::-webkit-details-marker{display:none}
.lib-i>summary b{font-family:var(--serif);font-weight:600}
.lib-i>summary em{font-style:normal;font-size:11.5px;color:var(--muted)}
.lib-i[open]>summary{border-bottom:1px solid var(--rule2);background:var(--paper2)}
.lib-body{padding:14px 15px}

/* ---------- 沙盘 ---------- */
.sand{background:var(--paper);border:1px solid var(--rule)}
.sand-top{padding:16px 18px;border-bottom:1px solid var(--rule2)}
.sand-grid{display:grid;gap:0}
@media(min-width:880px){.sand-grid{grid-template-columns:300px 1fr}}
.sand-l{padding:16px 18px;border-bottom:1px solid var(--rule2)}
@media(min-width:880px){.sand-l{border-bottom:0;border-right:1px solid var(--rule2)}}
.sand-r{padding:16px 18px}
.sl{margin-bottom:15px}
.sl-h{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:4px}
.sl-h b{font-weight:600;color:var(--ink2)}
.sl-h span{color:var(--muted);font-variant-numeric:tabular-nums}
.sl input[type=range]{width:100%;accent-color:var(--water);margin:0}
.sl-e{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);margin-top:1px}
.risk{border:1px solid var(--rule);padding:14px;text-align:center;margin-bottom:14px;background:var(--paper2)}
.risk-v{font-family:var(--serif);font-size:38px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.risk-l{font-size:13px;margin-top:5px;font-weight:600}
.risk-track{height:6px;background:#fff;border:1px solid var(--rule2);margin-top:10px;position:relative;overflow:hidden}
.risk-track i{position:absolute;inset:0 auto 0 0;transition:width .35s ease,background .35s ease}
.tl{border-left:2px solid var(--rule);padding-left:16px;margin:0}
.tl-i{position:relative;padding-bottom:14px}
.tl-i:before{content:"";position:absolute;left:-21px;top:6px;width:8px;height:8px;background:var(--seal);border-radius:50%}
.tl-i b{display:block;font-family:var(--serif);font-size:13.5px;font-weight:600}
.tl-i span{font-size:13px;color:var(--ink2)}
.qs{margin:0;padding-left:1.2em;font-size:13.5px}
.qs li{margin-bottom:6px}

/* ---------- 累计台账 ---------- */
.ledger{background:var(--paper);border:1px solid var(--rule);border-top:4px solid var(--seal);padding:18px}
.led-grid{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media(min-width:700px){.led-grid{grid-template-columns:repeat(4,1fr)}}
.led-i{border:1px solid var(--rule2);padding:12px;background:var(--paper2)}
.led-i b{display:block;font-family:var(--serif);font-size:28px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums}
.led-i span{font-size:12px;color:var(--muted)}
.prog{margin-top:16px}
.prog-r{display:grid;grid-template-columns:7em 1fr auto;gap:10px;align-items:center;font-size:13px;padding:5px 0}
.prog-b{height:12px;background:var(--paper2);border:1px solid var(--rule2);position:relative}
.prog-b i{position:absolute;inset:0 auto 0 0;background:var(--moss);transition:width .4s ease}

/* 折叠 */
details.acc{background:var(--paper);border:1px solid var(--rule);margin-bottom:8px}
details.acc>summary{padding:12px 15px;cursor:pointer;font-size:14px;font-family:var(--serif);font-weight:600;list-style:none}
details.acc>summary::-webkit-details-marker{display:none}
details.acc>summary:before{content:"＋";color:var(--seal);margin-right:8px;font-family:var(--sans)}
details.acc[open]>summary:before{content:"－"}
details.acc[open]>summary{border-bottom:1px solid var(--rule2)}
.acc-b{padding:14px 15px}

/* 页脚 */
footer{background:var(--ink);color:#c9d7dd;padding:30px var(--gut);font-size:12.5px}
.foot-in{max-width:1180px;margin:0 auto}
.foot-in b{font-family:var(--serif);color:#fff;font-size:15px;display:block;margin-bottom:8px;font-weight:600}
.foot-in ol{padding-left:1.3em;margin:8px 0 0}
.foot-in li{margin-bottom:5px}

/* toast */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(14px);background:var(--ink);color:#fff;
  padding:10px 18px;border-radius:4px;font-size:13.5px;opacity:0;pointer-events:none;transition:.22s;z-index:90;max-width:88vw;text-align:center}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

@media print{
  .bar,.nav,.acts,.toast,footer{display:none}
  body{background:#fff}
  section{page-break-inside:avoid;border-bottom:1px solid #ccc}
}