/* assets/css/physics/thermodynamics/how-heat-conduction-transfers-energy-explained.css — 本页专属样式（en/zh 共用） */
/* 依赖 /assets/css/style.css（设计令牌 + .part/.tag 骨架 + 外壳态）。
   图形/动画样式自 svgs/todo/physics-12-how-heat-conduction-transfers-energy-explained.html 预览 <style> 并入驻此
   （页面禁止内联 <style>）。规则按 body[data-topic="heat-conduction"] 作用域限定，
   动画由 #stage 的 .is-running 驱动，减弱动效由 base 全局兜底。 */

/* 零件本体/区分色（作用域限定 · 均在中灰蓝值域内） */
body[data-topic="heat-conduction"] .part .body{fill:#c2d1e4;stroke:#7d8ea3;stroke-width:1.6}
body[data-topic="heat-conduction"] .part .body2{fill:#dde7f4;stroke:#a9b7c9;stroke-width:1.2}
body[data-topic="heat-conduction"] .part .body3{fill:#aab9cd;stroke:none}
body[data-topic="heat-conduction"] .part .accent{fill:none;stroke:#6b7b8c;stroke-width:2;stroke-linecap:round}
body[data-topic="heat-conduction"] .part.is-active .body{fill:#9dc3f5;stroke:#1d4ed8;stroke-width:2.2}
body[data-topic="heat-conduction"] .part.is-active .body2{fill:#c4daf8;stroke:#3b82f6;stroke-width:1.4}
body[data-topic="heat-conduction"] .part.is-active .body3{fill:#1d4ed8}
body[data-topic="heat-conduction"] .part.is-active{filter:drop-shadow(0 0 12px rgba(29,78,216,.5))}

/* 图形基础 */
body[data-topic="heat-conduction"] .svg-title{fill:#16202c;font-family:var(--mono);font-size:17px;font-weight:600;letter-spacing:.08em;text-anchor:middle;}
body[data-topic="heat-conduction"] .svg-sub{fill:#5b6472;font-size:12px;text-anchor:middle;}

/* 金属棒：由热端（橙）到冷端（蓝）的温差渐变（材质专用色，§4.9.3 豁免） */
body[data-topic="heat-conduction"] .hc-rod{fill:url(#hc-rod-grad);stroke:#7d8ea3;stroke-width:2}
body[data-topic="heat-conduction"] .part[data-id="part-rod"].is-active .hc-rod{stroke:#1d4ed8;stroke-width:2.6}
body[data-topic="heat-conduction"] .hc-scale{fill:url(#hc-scale-grad);stroke:#7d8ea3;stroke-width:1.5}

/* 原子（点阵）：原地振动、传给邻居 */
body[data-topic="heat-conduction"] .hc-atom{fill:#cbd7e7;stroke:#2563eb;stroke-width:1.6;transform-box:fill-box;transform-origin:center}
body[data-topic="heat-conduction"] .part.is-active .hc-atom{fill:#c4daf8;stroke:#1d4ed8}
body[data-topic="heat-conduction"] .hc-bond{stroke:#8ea0b5;stroke-width:3;stroke-linecap:round}

/* 火焰（材质专用饱和色，保留） */
body[data-topic="heat-conduction"] .hc-flame{fill:#fb923c;stroke:#ea580c;stroke-width:1.5}
body[data-topic="heat-conduction"] .hc-flame-core{fill:#fde047;stroke:none}
body[data-topic="heat-conduction"] .is-running .hc-flame{animation:hc-flicker 1.1s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
@keyframes hc-flicker{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.08)}}

/* 能量箭头：热 → 冷的虚线流动 */
body[data-topic="heat-conduction"] .hc-energy{fill:none;stroke:#ea580c;stroke-width:3;stroke-linecap:round;stroke-dasharray:10 8;animation-play-state:paused}
body[data-topic="heat-conduction"] .is-running .hc-energy{animation:hc-flow 1.1s linear infinite;animation-play-state:running}
@keyframes hc-flow{to{stroke-dashoffset:-36}}

/* 冷端散热鳍片 */
body[data-topic="heat-conduction"] .hc-fin{fill:#bfdbfe;stroke:#2563eb;stroke-width:1.5}

/* 原子振动：靠热端的振幅大，冷端几乎静止 */
body[data-topic="heat-conduction"] .is-running .hc-a1,body[data-topic="heat-conduction"] .is-running .hc-a2{animation:hc-jig1 .5s ease-in-out infinite}
body[data-topic="heat-conduction"] .is-running .hc-a3,body[data-topic="heat-conduction"] .is-running .hc-a4{animation:hc-jig2 .75s ease-in-out infinite}
@keyframes hc-jig1{0%,100%{transform:translateX(-6px)}50%{transform:translateX(6px)}}
@keyframes hc-jig2{0%,100%{transform:translateX(-2.5px)}50%{transform:translateX(2.5px)}}