fix(medicine): replace ECG animation with static diagram

1 files changed, 5 insertions, 9 deletions

diff --git a/source/_posts/房颤心电图解析.md b/source/_posts/房颤心电图解析.md
index 650927de..5624d01e 100644
--- a/source/_posts/房颤心电图解析.md
+++ b/source/_posts/房颤心电图解析.md
@@ -43,17 +43,13 @@ QRS 波群反映心室去极化过程。窄 QRS 通常提示当前搏动主要�
 
 下图为教学示意，不是患者原始心电图的重建，也不用于自动诊断。点击“播放动画”后，扫描线会沿时间轴移动；点击观察点按钮可以突出相应标注。动画用于说明“连续记录”和“节律间期”的概念，不代表真实心电设备的采样参数。
 
-<div class="ecg-demo" data-ecg-demo>
+<div class="ecg-demo">
 <style>
-.ecg-demo{--ink:#1c1917;--muted:#78716c;--paper:#faf8f5;--grid:rgba(210,190,174,.42);--red:#dc2626;--blue:#2563eb;--green:#15803d;margin:2rem 0;padding:1rem;background:var(--paper);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);color:var(--ink);overflow:hidden}.ecg-demo *{box-sizing:border-box}.ecg-demo h3{margin:0;font-size:1rem}.ecg-demo p{margin:.35rem 0 0;color:var(--muted);font-size:.8rem;line-height:1.65}.ecg-demo-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;border-bottom:1px solid #d6d3d1;padding-bottom:.7rem}.ecg-demo-badge{padding:.2rem .45rem;border:1px solid var(--red);color:var(--red);font:700 .7rem/1.2 monospace;transform:rotate(-1deg)}.ecg-demo-controls{display:flex;flex-wrap:wrap;gap:.45rem;margin:.8rem 0}.ecg-demo button{cursor:pointer;padding:.38rem .58rem;border:1px solid #a8a29e;background:#fff;color:var(--ink);font:700 .72rem/1.2 monospace}.ecg-demo button:hover,.ecg-demo button[data-active=true]{border-color:var(--ink);background:var(--ink);color:#fff}.ecg-demo-canvas{overflow-x:auto;padding:.55rem;border:1px solid #78716c;background-color:#fffdfb;background-image:linear-gradient(to right,var(--grid) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:10px 10px}.ecg-demo-canvas svg{display:block;width:100%;min-width:620px;height:auto}.ecg-demo .ecg-trace{stroke-dasharray:none}.ecg-demo .scan-line,.ecg-demo .pulse-dot{animation:ecg-scan 3.2s linear infinite}.ecg-demo.paused .scan-line,.ecg-demo.paused .pulse-dot{animation-play-state:paused}.ecg-demo .layer{transition:opacity .22s ease}@keyframes ecg-scan{from{transform:translateX(0)}to{transform:translateX(650px)}}.ecg-demo-note{margin-top:.7rem;padding:.65rem .75rem;border-left:4px solid var(--blue);background:#eff6ff;color:#1e3a8a;font-size:.82rem;line-height:1.7}.ecg-demo-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.75rem;font:.7rem/1.5 monospace}.ecg-demo-legend span{padding:.35rem;background:#fff;border:1px solid #d6d3d1}@media(max-width:640px){.ecg-demo-head{display:block}.ecg-demo-badge{display:inline-block;margin-top:.55rem}.ecg-demo-legend{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.ecg-demo .ecg-trace,.ecg-demo .scan-line,.ecg-demo .pulse-dot{animation:none}}
+.ecg-demo{--ink:#1c1917;--muted:#78716c;--paper:#faf8f5;--grid:rgba(210,190,174,.42);--red:#dc2626;--blue:#2563eb;--green:#15803d;margin:2rem 0;padding:1rem;background:var(--paper);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);color:var(--ink);overflow:hidden}.ecg-demo *{box-sizing:border-box}.ecg-demo h3{margin:0;font-size:1rem}.ecg-demo p{margin:.35rem 0 0;color:var(--muted);font-size:.8rem;line-height:1.65}.ecg-demo-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;border-bottom:1px solid #d6d3d1;padding-bottom:.7rem}.ecg-demo-badge{padding:.2rem .45rem;border:1px solid var(--red);color:var(--red);font:700 .7rem/1.2 monospace;transform:rotate(-1deg)}.ecg-demo-canvas{overflow-x:auto;padding:.55rem;border:1px solid #78716c;background-color:#fffdfb;background-image:linear-gradient(to right,var(--grid) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:10px 10px}.ecg-demo-canvas svg{display:block;width:100%;min-width:620px;height:auto}.ecg-demo-note{margin-top:.7rem;padding:.65rem .75rem;border-left:4px solid var(--blue);background:#eff6ff;color:#1e3a8a;font-size:.82rem;line-height:1.7}.ecg-demo-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.75rem;font:.7rem/1.5 monospace}.ecg-demo-legend span{padding:.35rem;background:#fff;border:1px solid #d6d3d1}@media(max-width:640px){.ecg-demo-head{display:block}.ecg-demo-badge{display:inline-block;margin-top:.55rem}.ecg-demo-legend{grid-template-columns:1fr}}
 </style>
-<div class="ecg-demo-head"><div><h3>连续节律示意：窦性心律与房颤</h3><p>教学示意｜动画表示时间轴移动，不代表原始检测记录</p></div><span class="ecg-demo-badge">ECG SKETCH</span></div>
-<div class="ecg-demo-controls" role="group" aria-label="心电图动画控制"><button type="button" data-play data-active="true">暂停动画</button><button type="button" data-focus="all" data-active="true">总览</button><button type="button" data-focus="pwave">P 波 / f 波</button><button type="button" data-focus="rr">R-R 间期</button><button type="button" data-focus="qrs">QRS 波群</button></div>
-<div class="ecg-demo-canvas"><svg viewBox="0 0 760 250" role="img" aria-label="窦性心律与房颤连续节律教学示意"><text x="10" y="20" fill="#15803d" font-size="14" font-family="monospace" font-weight="700">窦性心律</text><text x="10" y="137" fill="#dc2626" font-size="14" font-family="monospace" font-weight="700">房颤示意</text><path d="M90 55 Q102 43 114 55 L126 55 L130 22 L136 82 L142 50 L148 55 Q160 43 172 55 L205 55 Q217 43 229 55 L241 55 L245 22 L251 82 L257 50 L263 55 Q275 43 287 55 L320 55 Q332 43 344 55 L356 55 L360 22 L366 82 L372 50 L378 55 Q390 43 402 55 L435 55 Q447 43 459 55 L471 55 L475 22 L481 82 L487 50 L493 55 Q505 43 517 55" fill="none" stroke="#15803d" stroke-width="2.4" stroke-linecap="round"/><text x="91" y="98" fill="#15803d" font-size="11" font-family="monospace">P 波规则</text><line x1="130" y1="32" x2="245" y2="32" stroke="#15803d" stroke-dasharray="3 3"/><line x1="245" y1="32" x2="360" y2="32" stroke="#15803d" stroke-dasharray="3 3"/><text x="300" y="28" fill="#15803d" font-size="10" font-family="monospace">R-R 规则</text><path class="ecg-trace" d="M90 174 Q100 169 108 177 T124 172 T140 176 T155 171 L168 175 L172 142 L178 207 L184 168 L190 175 Q202 170 214 178 T232 171 T250 177 T268 170 T286 176 L300 175 L304 142 L310 207 L316 168 L322 175 Q333 169 344 178 T360 171 T377 177 T396 170 T415 176 T434 171 L448 175 L452 142 L458 207 L464 168 L470 175 Q483 170 498 178 T518 171 T536 177 T553 170 T570 176 L585 175 L589 142 L595 207 L601 168 L607 175 Q620 170 636 178 T655 171 T673 176" fill="none" stroke="#dc2626" stroke-width="2.4" stroke-linecap="round"/><rect class="layer" data-layer="pwave" x="195" y="161" width="105" height="27" fill="#fee2e2" stroke="#dc2626" stroke-dasharray="3 2"/><text class="layer" data-layer="pwave" x="247" y="205" text-anchor="middle" fill="#dc2626" font-size="10" font-family="monospace" font-weight="700">规则 P 波缺失</text><line class="layer" data-layer="rr" x1="172" y1="130" x2="304" y2="130" stroke="#b45309" stroke-dasharray="3 3"/><line class="layer" data-layer="rr" x1="304" y1="130" x2="452" y2="130" stroke="#2563eb" stroke-dasharray="3 3"/><text class="layer" data-layer="rr" x="365" y="125" text-anchor="middle" fill="#2563eb" font-size="10" font-family="monospace" font-weight="700">R-R 间期不规则</text><rect class="layer" data-layer="qrs" x="448" y="139" width="28" height="74" fill="#dcfce7" stroke="#15803d"/><text class="layer" data-layer="qrs" x="465" y="229" text-anchor="middle" fill="#15803d" font-size="10" font-family="monospace" font-weight="700">QRS</text><line class="scan-line" x1="90" y1="110" x2="90" y2="220" stroke="#2563eb" stroke-width="1.5" stroke-dasharray="4 4"/><circle class="pulse-dot" cx="90" cy="174" r="4" fill="#dc2626"/></svg></div>
-<div class="ecg-demo-note" data-explain>总览：动画扫描线沿时间轴移动。判读房颤时，应在连续记录中同时观察 P 波缺失和 R-R 间期绝对不规则。</div><div class="ecg-demo-legend"><span style="color:#dc2626">红色：房颤示意与动态波形</span><span style="color:#15803d">绿色：窦性心律</span><span style="color:#2563eb">蓝色：扫描线与间期标注</span></div>
-<script>
-(function(){var root=document.querySelector('[data-ecg-demo]');if(!root)return;var play=root.querySelector('[data-play]');var explain=root.querySelector('[data-explain]');var texts={all:'总览：动画扫描线沿时间轴移动。判读房颤时，应在连续记录中同时观察 P 波缺失和 R-R 间期绝对不规则。',pwave:'P 波 / f 波：窦性心律通常出现规则 P 波；房颤记录中缺少持续、规则的 P 波，基线可见不规则细小波动。',rr:'R-R 间期：房颤的心室节律通常绝对不规则。该判断需要基于连续记录，不能只观察两个搏动间隔。',qrs:'QRS 波群：QRS 宽窄用于描述室内传导状态。窄 QRS 不能单独推断整体预后或排除其他心律问题。'};var layers={pwave:root.querySelectorAll('[data-layer=pwave]'),rr:root.querySelectorAll('[data-layer=rr]'),qrs:root.querySelectorAll('[data-layer=qrs]')};function focus(mode){Object.keys(layers).forEach(function(key){layers[key].forEach(function(node){node.style.opacity=mode==='all'||mode===key?'1':'.12';});});root.querySelectorAll('[data-focus]').forEach(function(button){button.dataset.active=button.dataset.focus===mode?'true':'false';});explain.textContent=texts[mode];}play.addEventListener('click',function(){var paused=root.classList.toggle('paused');play.textContent=paused?'播放动画':'暂停动画';play.dataset.active=paused?'false':'true';});root.querySelectorAll('[data-focus]').forEach(function(button){button.addEventListener('click',function(){focus(button.dataset.focus);});});focus('all');}());
-</script>
+<div class="ecg-demo-head"><div><h3>心电图静态示意：窦性心律与房颤</h3><p>教学示意｜不代表原始检测记录</p></div><span class="ecg-demo-badge">ECG SKETCH</span></div>
+<div class="ecg-demo-canvas"><svg viewBox="0 0 760 260" role="img" aria-label="窦性心律与房颤静态心电图教学示意"><text x="12" y="22" fill="#15803d" font-size="14" font-family="monospace" font-weight="700">窦性心律</text><text x="12" y="150" fill="#dc2626" font-size="14" font-family="monospace" font-weight="700">房颤示意</text><path d="M90 58 Q102 46 114 58 L126 58 L130 28 L136 88 L142 52 L148 58 Q160 46 172 58 L205 58 Q217 46 229 58 L241 58 L245 28 L251 88 L257 52 L263 58 Q275 46 287 58 L320 58 Q332 46 344 58 L356 58 L360 28 L366 88 L372 52 L378 58 Q390 46 402 58 L435 58 Q447 46 459 58 L471 58 L475 28 L481 88 L487 52 L493 58 Q505 46 517 58" fill="none" stroke="#15803d" stroke-width="2.4" stroke-linecap="round"/><text x="130" y="108" text-anchor="middle" fill="#15803d" font-size="11" font-family="monospace">规则 P 波</text><line x1="130" y1="93" x2="130" y2="76" stroke="#15803d" stroke-dasharray="3 3"/><line x1="130" y1="35" x2="245" y2="35" stroke="#15803d" stroke-dasharray="3 3"/><line x1="245" y1="35" x2="360" y2="35" stroke="#15803d" stroke-dasharray="3 3"/><text x="300" y="29" text-anchor="middle" fill="#15803d" font-size="10" font-family="monospace">R-R 间期规则</text><path d="M90 188 Q100 183 108 191 T124 186 T140 190 T155 185 L168 189 L172 157 L178 221 L184 182 L190 189 Q202 184 214 192 T232 185 T250 191 T268 184 T286 190 L300 189 L304 157 L310 221 L316 182 L322 189 Q333 183 344 192 T360 185 T377 191 T396 184 T415 190 T434 185 L448 189 L452 157 L458 221 L464 182 L470 189 Q483 184 498 192 T518 185 T536 191 T553 184 T570 190 L585 189 L589 157 L595 221 L601 182 L607 189 Q620 184 636 192 T655 185 T673 190" fill="none" stroke="#dc2626" stroke-width="2.4" stroke-linecap="round"/><text x="247" y="238" text-anchor="middle" fill="#dc2626" font-size="10" font-family="monospace" font-weight="700">规则 P 波缺失，基线细小波动</text><line x1="172" y1="139" x2="304" y2="139" stroke="#b45309" stroke-dasharray="3 3"/><line x1="304" y1="139" x2="452" y2="139" stroke="#2563eb" stroke-dasharray="3 3"/><text x="365" y="133" text-anchor="middle" fill="#2563eb" font-size="10" font-family="monospace" font-weight="700">R-R 间期不规则</text><rect x="448" y="154" width="28" height="72" fill="none" stroke="#15803d" stroke-width="1.5"/><text x="462" y="252" text-anchor="middle" fill="#15803d" font-size="10" font-family="monospace" font-weight="700">QRS</text></svg></div>
+<div class="ecg-demo-note">判读重点：窦性心律保留规则 P 波，房颤示意缺少持续、规则的 P 波，并表现为 R-R 间期绝对不规则。QRS 标注仅表示波群位置，不用于推断整体风险。</div><div class="ecg-demo-legend"><span style="color:#dc2626">红色：房颤示意</span><span style="color:#15803d">绿色：窦性心律与 QRS 标注</span><span style="color:#2563eb">蓝色：R-R 间期标注</span></div>
 </div>
 
 ## 五、可穿戴设备提示与临床确认