/* 过滤系统 · 叠片过滤器并联机组选型工作台（2026-09-18）
 * 宿主：index.html 的 #filterSystemSection（第七十一轮预留的空壳页）。
 * 变量约定与 modeling/workspace.css、hydraulic-calc.css 一致：一律 var(--u-x, 字面值) ——
 * 本项目从不定义 --u-*，全靠兜底字面值，颜色与宿主现有面板保持一致（绿系 + 石板灰）。
 *
 * @media print 隐藏：与 workspace.css / hydraulic-calc.css 同款（见文件末）。
 */
.fs-wrap{
  flex:1 1 auto;min-height:0;min-width:0;display:flex;flex-direction:column;overflow:hidden;
  font:13px/1.6 "Microsoft YaHei","PingFang SC","Segoe UI",system-ui,sans-serif;
  color:var(--u-ink,#243c35);background:var(--u-panel,#f7faf9);
}
.fs-wrap-body{flex:1 1 auto;min-height:0;min-width:0;display:flex;overflow:hidden}
.fs-main{flex:1;min-width:0;overflow:auto;padding:8px 10px 22px}

/* ---------- 滚动条：只写 ::-webkit-scrollbar（第六十五轮实测口径，见 hydraulic-calc.css） ----------
 * [v383 2026-10-12 用户要求] 与全站统一为最窄最短：5px→4px，拇指改半透明灰圆角丸（原 #bfd3c6 实色偏深）。 */
.fs-side::-webkit-scrollbar,.fs-main::-webkit-scrollbar{width:4px;height:4px}
.fs-side::-webkit-scrollbar-track,.fs-main::-webkit-scrollbar-track,
.fs-side::-webkit-scrollbar-corner,.fs-main::-webkit-scrollbar-corner{background:transparent}
.fs-side::-webkit-scrollbar-thumb,.fs-main::-webkit-scrollbar-thumb{background:rgba(100,116,139,.45);border-radius:999px}
.fs-side::-webkit-scrollbar-thumb:hover,.fs-main::-webkit-scrollbar-thumb:hover{background:rgba(100,116,139,.72)}

/* ---------- 回执消息条已取消（v19：整条删除）----------
 * 操作回执改写到页面底部状态栏 #ryStHint（见 filter-system.js planNote），本文件不再有回执条样式。 */
/* 按钮样式用于左栏顶部操作按钮组（.fs-actions，v88 起三个按钮同排）
   + 右列「切换接法」按钮（.fs-duo-col 内，靠 flex stretch 自动全宽） */
.fs-bar-btn{
  font:inherit;font-size:11.5px;padding:4px 10px;border:1px solid var(--u-accent-line,#cfe3da);
  border-radius:4px;background:#fff;color:var(--u-accent-2,#116447);cursor:pointer;white-space:nowrap;
}
.fs-bar-btn:hover{background:var(--u-accent-bg,#e0f2e9)}
.fs-bar-btn.solid{background:var(--u-accent-2,#116447);color:#fff;border-color:var(--u-accent-2,#116447)}
.fs-bar-btn.solid:hover{background:var(--u-accent,#18835e)}
.fs-bar-btn.on{background:var(--u-accent,#18835e);color:#fff;border-color:var(--u-accent,#18835e)}

/* ---------- 左栏 ---------- */
/* 宽度由 --fs-side-w 驱动（v12 拖拽条写入；没拖过不定义 → 兜底 348px，视觉逐像素不变） */
.fs-side{
  flex:0 0 var(--fs-side-w,348px);width:var(--fs-side-w,348px);min-height:0;overflow:auto;padding:8px 10px 22px;
  background:#fff;border-right:1px solid var(--u-accent-line,#cfe3da);
  display:flex;flex-direction:column;
}
/* ---------- 左栏宽度拖拽条（v12） ---------- */
.fs-resizer{
  flex:0 0 7px;cursor:col-resize;background:transparent;position:relative;
  user-select:none;-webkit-user-select:none;touch-action:none;
}
.fs-resizer::before{
  content:'';position:absolute;left:2px;top:0;bottom:0;width:3px;border-radius:2px;
  background:var(--u-accent-line,#cfe3da);transition:background .15s;
}
.fs-resizer:hover::before,.fs-resizer.on::before{background:var(--u-accent,#18835e)}

/* ---------- 操作按钮组（v13：从顶部条移到左栏顶部，复用 fs-group 卡片外观） ----------
   v88：三个按钮同排一行（取当前方案流量 / 写入过滤损失 / 恢复默认参数）。
   宽度账（实测，_p1/_v88_probe.cjs）：默认栏宽 348 ⇒ 组内可用 303px；
     保留箭头：119+106+91+2×8 = 332 > 303 ⇒ 必换行；
     去箭头后：103+91+91+16 = 301 ≤ 303 ⇒ 排得下；
   再给按钮左右内边距 10 → 7px（仅本作用域，右列「切换接法」不受影响）多腾 18px ⇒ 余量 20px。
   窄栏（< 340px）仍由 flex-wrap 优雅换行，不会横向溢出、不会裁字。 ---------- */
.fs-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}
.fs-actions .fs-bar-btn{flex:1 1 auto;text-align:center;white-space:nowrap;padding-left:7px;padding-right:7px}
.fs-group{margin:0 0 8px;padding:8px 9px 6px;border:1px solid var(--u-accent-line,#cfe3da);border-radius:6px;background:var(--u-accent-bg,#f4fbf7)}
.fs-gh{font-size:12px;font-weight:700;color:var(--u-accent-2,#116447);margin:0 0 6px;display:flex;align-items:center;gap:6px;letter-spacing:.3px}
.fs-gh>em{font-style:normal;font-weight:400;font-size:10.5px;color:var(--u-ink-2,#7b9188);margin-left:auto}
.fs-row{display:flex;align-items:center;gap:7px;margin:0 0 7px;min-width:0}
.fs-row>label{flex:0 0 88px;color:var(--u-ink-2,#4a6259);font-size:11.5px}
.fs-row input[type=number],.fs-row select{
  font:inherit;font-size:11.5px;padding:4px 6px;border:1px solid var(--u-accent-line,#cfe3da);
  border-radius:4px;background:#fff;color:inherit;min-width:0;
}
.fs-row input[type=number]{flex:0 0 60px;width:60px;text-align:right}
.fs-row select{flex:1}
.fs-row input:focus-visible,.fs-row select:focus-visible{outline:2px solid var(--u-water,#245f87);outline-offset:1px}
.fs-unit{flex:0 0 auto;font-size:10.5px;color:var(--u-ink-2,#7b9188);min-width:26px}
/* ---------- v36：机组参数 + 管路管径 并排（.fs-duo）；滑块已取消，数字框直接输入 ---------- */
.fs-duo{display:flex;gap:6px;align-items:flex-start;margin:0 0 8px}
.fs-duo-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px}
.fs-duo + .fs-note{margin:0 0 8px}   /* v39：duo 后的过滤损失说明为独立全宽块 */
.fs-duo .fs-group{min-width:0;margin:0;padding:8px 7px 4px}
.fs-duo .fs-row{gap:4px;margin:0 0 6px}
.fs-duo .fs-row>label{flex:0 0 auto;white-space:nowrap}
.fs-duo input[type=number]{flex:1 1 44px;min-width:44px;width:auto;padding:4px 3px}
.fs-duo select{flex:1 1 36px;min-width:36px;padding:4px 2px}
.fs-duo .fs-unit{min-width:0}
/* v49：组态胶囊改等宽网格，行列对齐；v53：minmax 104→64——左栏默认 280px 排 3 列，拖宽后自动 4 列 */
.fs-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px;margin:0 0 8px}
.fs-chips .fs-chip{text-align:center;justify-self:stretch}
.fs-chip{
  font:inherit;font-size:11px;padding:3px 6px;   /* v53：收窄内边距，4 列时按钮内容不溢出 */border:1px solid var(--u-accent-line,#cfe3da);
  border-radius:999px;background:#fff;color:var(--u-ink-2,#4a6259);cursor:pointer;white-space:nowrap;
}
.fs-chip:hover{border-color:var(--u-accent,#18835e);color:var(--u-accent-2,#116447)}
.fs-chip.on{background:#ede9fc;border-color:#7048e8;color:#5f3dc4;font-weight:700}   /* v35：反冲激活胶囊随图上高亮改紫 */
.fs-note{margin:2px 0 0;padding:7px 9px;border-left:3px solid var(--u-accent-line,#9bcbb4);background:#fbfdfc;color:var(--u-ink-2,#4a6259);font-size:10.5px;line-height:1.7}
.fs-note b{color:var(--u-ink,#243c35)}

/* ---------- 四视图 ---------- */
.fs-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 10px}
.fs-vcard{border:1px solid var(--u-accent-line,#cfe3da);border-radius:6px;background:#fff;padding:5px 7px 2px;min-width:0}
.fs-vcard-h{display:flex;align-items:baseline;gap:8px;margin:0 0 3px}
.fs-vcard-h>b{font-size:12.5px;font-weight:700;color:var(--u-accent-2,#116447)}
.fs-vcard-h>em{font-style:normal;font-size:11px;color:var(--u-ink-2,#7b9188);margin-left:auto}
.fs-vcard svg{width:100%;height:auto;display:block}

/* ---------- 结果区 ---------- */
.fs-block{margin:0 0 10px;border:1px solid var(--u-accent-line,#cfe3da);border-radius:6px;background:#fff;padding:8px 10px 6px}
.fs-block-h{font-size:13px;font-weight:700;color:var(--u-accent-2,#116447);margin:0 0 8px;display:flex;align-items:center;gap:8px}
.fs-block-h>em{font-style:normal;font-weight:400;font-size:11.5px;color:var(--u-ink-2,#7b9188)}
.fs-kv{display:flex;align-items:baseline;gap:8px;padding:3px 0;border-bottom:1px dashed #eef4f1;font-size:12.5px}
.fs-kv:last-child{border-bottom:0}
.fs-kv>span:first-child{flex:0 0 210px;color:var(--u-ink-2,#4a6259)}
.fs-kv>span:last-child{font-variant-numeric:tabular-nums;color:var(--u-ink,#243c35)}
.fs-kv>span:last-child b{color:var(--u-accent-2,#116447)}
.fs-ok{color:#15803d;font-weight:700}
.fs-bad{color:#b91c1c;font-weight:700}
.fs-warn{color:#c2410c;font-weight:700}
.fs-kv-note{flex:0 0 210px;color:var(--u-ink-2,#4a6259)}
.fs-leg{display:flex;flex-wrap:wrap;gap:12px;margin:6px 0 0;font-size:11.5px;color:var(--u-ink-2,#4a6259)}
.fs-leg>span{display:inline-flex;align-items:center;gap:5px}
.fs-lg{width:16px;height:3px;border-radius:2px;display:inline-block}
.fs-lg-square{width:11px;height:11px;border-radius:2px;display:inline-block}
/* ★ v99：压力表图例样本 —— 白底深灰圈 + 橙红指针（与图上 gauge() 同观感） */
.fs-lg-gauge{width:13px;height:13px;border-radius:50%;display:inline-block;background:#fff;
  border:1.5px solid #6E6E80;position:relative;flex:0 0 auto}
.fs-lg-gauge::after{content:'';position:absolute;left:50%;top:50%;width:5px;height:1.6px;
  background:#E8590C;transform-origin:0 50%;transform:rotate(-58deg) translateX(0.6px)}

/* ---------- 阀门交互 + 水流动画（v11） ---------- */
.fs-valve{cursor:pointer}
.fs-valve:hover{stroke-width:1.8}
.fs-flow{stroke-dasharray:6 7;animation:fsFlow .9s linear infinite;pointer-events:none}
@keyframes fsFlow{to{stroke-dashoffset:-26}}
/* v49：阀门一览改表格（.fs-vtable）；契约类 .fs-vchip 保留在 tr 上 */
.fs-valves{margin:0 0 8px}
.fs-vtable{width:100%;border-collapse:collapse;font-size:10.5px;line-height:1.5}
.fs-vtable th{font-weight:700;color:var(--u-ink-2,#4a6259);text-align:left;padding:3px 8px;border-bottom:1.5px solid var(--u-accent-line,#cfe3da);white-space:nowrap}
.fs-vtable td{padding:4px 8px;border-bottom:1px solid var(--u-accent-line,#cfe3da);color:var(--u-ink,#243c35);white-space:nowrap}
tr.fs-vchip{cursor:pointer;user-select:none}
tr.fs-vchip:hover td{background:#f0f7f4}
tr.fs-vchip[data-mode="backwash"] td{background:#ede9fc}
tr.fs-vchip[data-mode="backwash"] td:last-child{color:#5f3dc4;font-weight:700}
tr.fs-vchip[data-mode="dump"] td{background:#ffe3e3}
tr.fs-vchip[data-mode="dump"] td:last-child{color:#e03131;font-weight:700}
tr.fs-vchip[data-mode="off"] td{opacity:.72}
tr.fs-vchip[data-v0="closed"] td{background:#f1f3f5;color:#495057}
/* v49：旧 span 胶囊样式已删——display:inline-flex 会破坏 tr.fs-vchip 表格行布局 */

/* v49：以下三条旧胶囊配色由上方 tr.fs-vchip[data-mode]/[data-v0] 接管 */   /* v35：反冲态随图上高亮改紫 */




/* V0 出水总阀胶囊（v12）：关闭态灰底 */


.fs-lg-dash{background:repeating-linear-gradient(90deg,#37475f 0 4px,transparent 4px 7px)}

/* ---------- 响应式 ---------- */
@media (max-width:1180px){
  .fs-wrap-body{flex-direction:column}
  .fs-side{flex:0 0 auto;width:auto;max-height:46vh;border-right:0;border-bottom:1px solid var(--u-accent-line,#cfe3da)}
  .fs-resizer{display:none}
  .fs-grid{grid-template-columns:1fr}
}
@media print{
  #filterSystemSection{display:none!important}
}

/* v59：轴测图「放大」按钮 + 放大态（放大后该卡横跨两列 = 四窗之和的范围；默认不放大，视觉不变） */
.fs-zbtn{font:inherit;font-size:11px;line-height:1;padding:2px 8px;border:1px solid var(--u-accent-line,#cfe3da);border-radius:4px;background:#fff;color:var(--u-accent-2,#116447);cursor:pointer}
.fs-zbtn:hover{background:#f3f9f6;border-color:var(--u-accent-2,#116447)}
.fs-grid.is-axo-zoom .fs-vcard{display:none}
.fs-grid.is-axo-zoom .fs-vcard.is-axo-zoom{display:block;grid-column:1 / -1}

/* ---------- v85：轴测图「放大」后的标注文字缩放 ----------
 * 「放大」= 该卡横跨两列，SVG 宽度 ≈ 2.04×（实测 1600 视口 scale 0.868 → 1.772），
 * 字号随等比放大：11 用户单位 → 屏幕 26px，长引注（尤其顶部那行方式说明，宽近整个卡宽）
 * 会喧宾夺主。这里把「长引注」压到 9.5 用户单位（屏幕 ≈ 16.8px：比未放大时的 13px 略大、
 * 比原来的 26px 明显收敛，即「稍微缩小」）。
 * 管件引注码（G1…Gn / V1 / ⑥ / P1 常闭）带 class="fs-tcode"，被 :not() 排除，保持原尺寸 ——
 * 它们是读图索引，短、且需要四组之间大小一致。
 * ★ 要再小 / 再大，只改下面这一个 9.5（数值单位 = SVG 用户单位，脚本 _p1/_v85_measure.cjs 可实测）。
 * 只在放大态生效 ⇒ 未放大（默认）视觉逐像素不变。 */
.fs-grid.is-axo-zoom .fs-vcard.is-axo-zoom svg text:not(.fs-tcode){font-size:9.5px}
