/* assets/css/physics/basic-mechanics/stress-distribution-in-a-bent-beam-cutaway.css — 本页专属样式（en/zh 共用） */
/* ============ 弯曲梁的应力分布 · Stress in a bent beam ============ */
/* 页面专属类统一 bs- 前缀；基础骨架与 .part/.body/.tag 等共享类在 /assets/css/style.css。
   零件区分色与动画用 body[data-topic="beam-stress"] 作用域限定，避免与其它页互扰。 */
body[data-topic="beam-stress"] .part .body{stroke:#2563eb;stroke-width:1.6}
body[data-topic="beam-stress"] .part .body2{stroke:#60a5fa;stroke-width:1.2}
body[data-topic="beam-stress"] .tag{font-size:14px}
body[data-topic="beam-stress"] .tag-sm{fill:#5b6472;font-size:11.5px}

/* 高亮态：换色 + 描边加粗 + 发光（SVG-SPEC §4.9） */
body[data-topic="beam-stress"] .part.is-active .body{fill:#9dc3f5;stroke:#1d4ed8;stroke-width:2.2}
body[data-topic="beam-stress"] .part.is-active .body2{fill:#c4daf8;stroke:#3b82f6;stroke-width:1.4}
body[data-topic="beam-stress"] .part.is-active .body3{fill:#1d4ed8}
body[data-topic="beam-stress"] .part.is-active{filter:drop-shadow(0 0 12px rgba(29,78,216,.5))}

/* 各部件区分色（作用域限定 · 均在中灰蓝值域内，禁用近白） */
body[data-topic="beam-stress"] .part[data-id="part-beam"]:not(.is-active) .body{fill:#c2d1e4}
body[data-topic="beam-stress"] .part[data-id="part-support-left"]:not(.is-active) .body{fill:#b9c9de}
body[data-topic="beam-stress"] .part[data-id="part-support-left"]:not(.is-active) .body2{fill:#d5e1f1}
body[data-topic="beam-stress"] .part[data-id="part-support-right"]:not(.is-active) .body{fill:#bfcbdd}
body[data-topic="beam-stress"] .part[data-id="part-support-right"]:not(.is-active) .body2{fill:#d5e1f1}
body[data-topic="beam-stress"] .part[data-id="part-cross-section"]:not(.is-active) .body{fill:#cbd7e7}

/* 载荷箭头（橙 · 材质专用饱和色，不受中灰蓝限制） */
body[data-topic="beam-stress"] .bs-force{fill:none;stroke:#c2410c;stroke-width:4;stroke-linecap:round}
/* 应力梯度带（顶部受压橙 → 中性轴 → 底部受拉蓝） */
body[data-topic="beam-stress"] .bs-band{fill:url(#bs-stress);opacity:.82}
/* 中性轴 / 剖切标记 / 引线 / 挠度 */
body[data-topic="beam-stress"] .bs-na{fill:none;stroke:#334155;stroke-width:1.8;stroke-dasharray:7 5}
body[data-topic="beam-stress"] .bs-cut{fill:none;stroke:#475569;stroke-width:1.6;stroke-dasharray:7 5}
body[data-topic="beam-stress"] .bs-lead{fill:none;stroke:#94a3b8;stroke-width:1.4;stroke-dasharray:5 5}
body[data-topic="beam-stress"] .bs-sag{fill:none;stroke:#94a3b8;stroke-width:1.6;stroke-dasharray:6 6}
body[data-topic="beam-stress"] .bs-cutdot{fill:#ffffff;stroke:#475569;stroke-width:1.6}
body[data-topic="beam-stress"] .bs-cuttxt{fill:#334155;font-family:var(--mono);font-size:11px;text-anchor:middle}
/* 受压 / 受拉小箭头 */
body[data-topic="beam-stress"] .bs-ca{fill:none;stroke:#c2410c;stroke-width:3;stroke-linecap:round}
body[data-topic="beam-stress"] .bs-ta{fill:none;stroke:#1d4ed8;stroke-width:3;stroke-linecap:round}
body[data-topic="beam-stress"] .part.is-active .bs-band{opacity:1}
body[data-topic="beam-stress"] .part.is-active .bs-ca{stroke:#9a3412}
body[data-topic="beam-stress"] .part.is-active .bs-ta{stroke:#1e40af}

/* ============ 动画（纯 CSS · 打开即运行） ============ */
body[data-topic="beam-stress"] .bs-pulse{transform-box:view-box;transform-origin:400px 228px;animation:bs-pulse 3.4s ease-in-out infinite}
@keyframes bs-pulse{0%,100%{transform:scaleY(.82)}50%{transform:scaleY(1.12)}}
body[data-topic="beam-stress"] .bs-sag{animation:bs-sag 1.4s linear infinite}
@keyframes bs-sag{to{stroke-dashoffset:-24}}
body[data-topic="beam-stress"] .bs-band{animation:bs-band 3.4s ease-in-out infinite}
@keyframes bs-band{0%,100%{opacity:.72}50%{opacity:.95}}

@media (prefers-reduced-motion:reduce){
  body[data-topic="beam-stress"] .bs-pulse,
  body[data-topic="beam-stress"] .bs-sag,
  body[data-topic="beam-stress"] .bs-band{animation:none}
}