/* /assets/css/machines/home-equipment/how-a-toilet-flushing-mechanism-works-cutaway.css — 本页专属样式（en/zh 共用） */
/* merged from svgs/machine-13 source <style> · visual classes only */

/* ============ 图形基础 ============ */
.svg-title{
  fill:#16202c;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:17px;font-weight:600;letter-spacing:.07em;text-anchor:middle;
}
.svg-sub{fill:#64748b;font-size:12.5px;text-anchor:middle}
.tag{fill:#334155;font-size:19px;font-weight:600;text-anchor:middle}
.tag-sm{fill:#5b6472;font-size:14px;text-anchor:middle}

/* ============ 外壳（玻璃态 · 最上层） ============ */
.shell-fill{fill:rgba(203,213,225,.10)}
.shell-line{stroke:#94a3b8;fill:none;stroke-linejoin:round;stroke-linecap:round}
.shell-hi{stroke:#e2e8f0;fill:none;stroke-linecap:round}

/* ============ 内部零件（主题蓝） ============ */
.metal-v{fill:url(#metalV)}
.metal-h{fill:url(#metalH)}
.part-line{stroke:#1e3a8a;stroke-width:1.5;fill:none;stroke-linejoin:round}
.part-fill-dark{fill:#1e3a8a}

/* ============ 流体路径 ============ */
.flow-line{
  fill:none;stroke:#60a5fa;stroke-width:4.5;
  stroke-linecap:round;stroke-dasharray:14 10;
  opacity:0;transition:opacity .3s ease;
}
.flow-line.active{opacity:1;animation:flowDash .7s linear infinite}
@keyframes flowDash{to{stroke-dashoffset:-24}}

/* 高亮 */
.svg-focus{filter:drop-shadow(0 0 8px #60a5fa) drop-shadow(0 0 18px #3b82f6)}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  .flow-line.active{stroke-dasharray:none;opacity:.85}
}