/* /assets/css/sim/physical/heat-exchanger-temperature-simulator.css — 本页专属样式（en/zh 共用） */
/* ============ 模拟器控制面板（源文件 .controls 搬入，作用域限定本页） ============ */
body[data-topic="heat-exchanger-temperature"] .controls{max-width:920px;width:100%;margin:8px 6px 4px;background:#fff;border:1px solid #dbe3ee;border-radius:12px;padding:16px 20px 18px;display:flex;flex-wrap:wrap;gap:14px 24px}
body[data-topic="heat-exchanger-temperature"] .ctrl-group{flex:1 1 200px;display:flex;flex-direction:column;gap:6px}
body[data-topic="heat-exchanger-temperature"] .ctrl-group label{font-size:13px;color:#475569;display:flex;justify-content:space-between;align-items:baseline}
body[data-topic="heat-exchanger-temperature"] .ctrl-group label b{color:#2563eb;font-size:14px}
body[data-topic="heat-exchanger-temperature"] input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:4px;background:linear-gradient(90deg,#bfdbfe,#2563eb);outline:none;cursor:pointer}
body[data-topic="heat-exchanger-temperature"] input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #2563eb;box-shadow:0 2px 6px rgba(37,99,235,.35);cursor:grab}
body[data-topic="heat-exchanger-temperature"] input[type="range"]::-webkit-slider-thumb:active{cursor:grabbing}
body[data-topic="heat-exchanger-temperature"] input[type="range"]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid #2563eb;box-shadow:0 2px 6px rgba(37,99,235,.35);cursor:grab}

/* ---------- 流向切换按钮 ---------- */
body[data-topic="heat-exchanger-temperature"] .flow-toggle{flex:1 1 180px;display:flex;flex-direction:column;gap:6px}
body[data-topic="heat-exchanger-temperature"] .flow-toggle span{font-size:13px;color:#475569}
body[data-topic="heat-exchanger-temperature"] .toggle-btns{display:flex;gap:6px}
body[data-topic="heat-exchanger-temperature"] .toggle-btns button{flex:1;padding:8px 12px;border:1.5px solid #cbd5e1;border-radius:8px;background:#f8fafc;color:#475569;font-size:13px;font-family:inherit;cursor:pointer;transition:all .15s}
body[data-topic="heat-exchanger-temperature"] .toggle-btns button.active{background:#2563eb;border-color:#2563eb;color:#fff;font-weight:600}
body[data-topic="heat-exchanger-temperature"] .toggle-btns button:hover:not(.active){border-color:#94a3b8;background:#f1f5f9}

/* ---------- 读数卡片 ---------- */
body[data-topic="heat-exchanger-temperature"] .readouts{display:flex;gap:10px;flex-wrap:wrap;width:100%}
body[data-topic="heat-exchanger-temperature"] .readout{flex:1 1 120px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:8px 12px;text-align:center}
body[data-topic="heat-exchanger-temperature"] .readout .k{font-size:11px;color:#5b6472;letter-spacing:.03em;margin-bottom:3px}
body[data-topic="heat-exchanger-temperature"] .readout .v{font-size:18px;font-weight:700;color:#1d4ed8;font-variant-numeric:tabular-nums;line-height:1.1}
body[data-topic="heat-exchanger-temperature"] .readout .v small{font-size:11px;font-weight:500;color:#5b6472;margin-left:2px}
body[data-topic="heat-exchanger-temperature"] .readout.hot{background:#fef2f2;border-color:#fecaca}
body[data-topic="heat-exchanger-temperature"] .readout.hot .v{color:#dc2626}
body[data-topic="heat-exchanger-temperature"] .readout.cold{background:#eff6ff;border-color:#bfdbfe}
body[data-topic="heat-exchanger-temperature"] .readout.cold .v{color:#2563eb}
body[data-topic="heat-exchanger-temperature"] .readout.gold{background:#fefce8;border-color:#fde68a}
body[data-topic="heat-exchanger-temperature"] .readout.gold .v{color:#b45309}

/* ============ SVG 内文字 ============ */
body[data-topic="heat-exchanger-temperature"] .svg-title{fill:#16202c}
body[data-topic="heat-exchanger-temperature"] .tag    {fill:#334155;font-size:13px}
body[data-topic="heat-exchanger-temperature"] .tag-sm {fill:#5b6472;font-size:11px}
body[data-topic="heat-exchanger-temperature"] .tag-num{fill:#5b6472;font-size:11px}
body[data-topic="heat-exchanger-temperature"] .legend {fill:#5b6472;font-size:11px}

/* ============ 流动虚线（源文件 dashFlow） ============ */
body[data-topic="heat-exchanger-temperature"] .hot-flow{fill:none;stroke:#ea580c;stroke-width:3;stroke-linecap:round;stroke-dasharray:10 8;animation:heat-exchanger-flowDash 1.1s linear infinite}
body[data-topic="heat-exchanger-temperature"] .cold-flow{fill:none;stroke:#3b82f6;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:8 8;animation:heat-exchanger-flowDash 1.4s linear infinite}
@keyframes heat-exchanger-flowDash{to{stroke-dashoffset:-18}}

/* ============ 无障碍：减弱动效 ============ */
@media (prefers-reduced-motion:reduce){
  body[data-topic="heat-exchanger-temperature"] .hot-flow,
  body[data-topic="heat-exchanger-temperature"] .cold-flow{animation:none;stroke-dasharray:none;opacity:.45}
}

/* ============ 响应式：控制面板排在能量链之后 ============ */
@media (max-width:1160px){
  body[data-topic="heat-exchanger-temperature"] .controls{order:4}
}