fix(articles): 用evidence-inline替换cancer/diabetes/osteoporosis断链截图

- cancer.html: 4个 shot-placeholder → evidence-inline引用块+CSS
- diabetes.html: 4个 ref-shot → evidence-inline引用块
- osteoporosis.html: 3个 ref-shot → evidence-inline引用块+CSS
- footer.js: 增加子目录路径自适应，logo和链接自动添加../前缀

web/articles/cancer.html

@@ -548,6 +548,57 @@
     margin: 1.25rem 0;
   }
   .shot-placeholder .shot-icon { font-size: 2.2rem; opacity: 0.35; }
+  .ref-shot { width:100%; max-width:720px; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,0.1); margin:1.25rem 0; display:block; }
+  .evidence-inline {
+    margin: 1.5rem 0;
+    padding: 1rem;
+    background: #f8fafc;
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    box-shadow: 0 4px 24px rgba(0,0,0,0.08);
+  }
+  .evidence-inline .evidence-title {
+    font-size: 0.9rem;
+    font-weight: 600;
+    margin-bottom: 0.6rem;
+    display: flex;
+    align-items: center;
+    gap: 0.4rem;
+  }
+  .evidence-inline .evidence-image-wrap {
+    position: relative;
+    display: inline-block;
+    max-width: 100%;
+    border-radius: 8px;
+    overflow: hidden;
+    border: 1px solid #e2e8f0;
+  }
+  .evidence-inline .evidence-image-wrap img {
+    display: block;
+    max-width: 100%;
+    height: auto;
+    max-height: 220px;
+  }
+  .evidence-inline .evidence-caption {
+    margin-top: 0.75rem;
+    font-size: 0.85rem;
+    line-height: 1.6;
+  }
+  .evidence-inline .evidence-translation {
+    margin-top: 0.5rem;
+    padding: 0.5rem 0.7rem;
+    background: #f0f7ff;
+    border-left: 3px solid #2d7d9a;
+    border-radius: 0 6px 6px 0;
+    font-size: 0.82rem;
+  }
+  .evidence-inline .evidence-meta {
+    margin-top: 0.6rem;
+    font-size: 0.8rem;
+    color: #718096;
+  }
+  .evidence-inline .evidence-meta a { color: #2d7d9a; }
+  .evidence-inline .evidence-meta a:hover { text-decoration: underline; }
 </style>
 </head>
 <body>
@@ -653,10 +704,18 @@
       </div>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">🧬</div>
-      <span>../img/ref-screenshots/cancer_ref1.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">📊 全球癌症负担数据 — CA Cancer Statistics 2022</div>
+  <div class="evidence-caption">
+    <strong>CA: A Cancer Journal for Clinicians 2022:</strong> 全球新发癌症病例1929万、死亡996万。中国新发457万、死亡300万，均为世界第一。肺癌、结直肠癌、胃癌、肝癌、乳腺癌为前五大癌种。
+  </div>
+  <div class="evidence-translation">
+    📖 中文翻译：全球癌症负担持续增长，中国新发病例占全球24%，死亡占30%——相当于每10秒就有一人被确诊癌症。早期筛查和生活方式干预是降低癌症死亡率最有效的手段。
+  </div>
+  <div class="evidence-meta">
+    来源：Sung H et al. "Global Cancer Statistics 2020" · <a href="https://doi.org/10.3322/caac.21660" target="_blank" rel="noopener">doi:10.3322/caac.21660</a>
+  </div>
+</div>
 
     <div class="evidence-box" style="margin-top:2rem;">
       <div class="evidence-box-header">
@@ -925,10 +984,18 @@
       <p><strong>临床转化：</strong>肠道菌群还可影响免疫检查点抑制剂（如PD-1/PD-L1抗体）的治疗效果——对免疫治疗有响应的患者肠道菌群中Akkermansia muciniphila和Ruminococcaceae的丰度显著更高。抗生素暴露会降低免疫治疗的治疗效果。</p>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">🧬</div>
-      <span>../img/ref-screenshots/cancer_ref2.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">🧬 癌症十大特征 — Hallmarks of Cancer</div>
+  <div class="evidence-caption">
+    <strong>Cell 2011, Hallmarks of Cancer: The Next Generation:</strong> Hanahan & Weinberg 提出癌症十大特征：自给自足生长信号、抗生长信号不敏感、抵抗细胞死亡、无限复制潜能、持续血管生成、组织侵袭转移、免疫逃逸、促肿瘤炎症、基因组不稳定、能量代谢重编程。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：癌症绝不是单一疾病，而是涉及多条信号通路、多种微环境改变的复杂系统性疾病。这解释了为什么单一靶点药物容易耐药——从多维度（炎症、代谢、免疫、肠道菌群）同时干预才是治本之道。
+  </div>
+  <div class="evidence-meta">
+    来源：Hanahan D, Weinberg RA. "Hallmarks of Cancer: The Next Generation" · <a href="https://doi.org/10.1016/j.cell.2011.02.013" target="_blank" rel="noopener">doi:10.1016/j.cell.2011.02.013</a>
+  </div>
+</div>
 
     <div class="process-steps" style="margin-top:1rem;">
       <div class="process-step">
@@ -986,10 +1053,18 @@
     </div>
     <p style="color:var(--text-muted);font-size:0.82rem;margin-bottom:1.5rem;">参考：《中国癌症筛查指南》2023 · 国家癌症中心</p>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">🧬</div>
-      <span>../img/ref-screenshots/cancer_ref3.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">🧬 遗传性癌症易感基因筛查指南 — JCO 2021</div>
+  <div class="evidence-caption">
+    <strong>Journal of Clinical Oncology 2021:</strong> ASCO/AHC 指南建议对符合家族史标准的癌症患者进行多基因胚系突变检测。BRCA1/2、MLH1/MSH2（林奇综合征）、TP53（Li-Fraumeni）等基因突变携带者患癌风险显著升高。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：约5-10%的癌症由遗传易感基因突变引起。携带者并非一定会患癌，但需要更早期、更频繁的专项筛查。家族中有多位年轻癌症患者、或同一人患多种原发癌时，建议进行遗传咨询和基因检测。
+  </div>
+  <div class="evidence-meta">
+    来源：Daly MB et al. "Genetic/Familial High-Risk Assessment: Breast, Ovarian, and Pancreatic" · <a href="https://doi.org/10.1200/JCO.20.02299" target="_blank" rel="noopener">doi:10.1200/JCO.20.02299</a>
+  </div>
+</div>
 
     <div class="grid-2" style="margin-bottom:1.5rem;">
       <div>
@@ -1113,10 +1188,21 @@
       </div>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">🧬</div>
-      <span>../img/ref-screenshots/cancer_ref4.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">🦠 肠道菌群与结直肠癌 — Science 2015</div>
+  <div class="evidence-image-wrap">
+    <img src="../img/gut-microbiome-damage.jpg" alt="Colorectal cancer - Fusobacterium nucleatum and gut microbiota" style="max-height:200px;">
+  </div>
+  <div class="evidence-caption">
+    <strong>Science 2015:</strong> Fusobacterium nucleatum（具核梭杆菌）在结直肠癌组织中富集，可通过FadA黏附素结合E-cadherin激活β-catenin信号通路，促进癌细胞的增殖和肿瘤进展。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：口腔中的条件致病菌——具核梭杆菌，竟然能通过血液循环到达肠道并直接促进结直肠癌的发展。这揭示了口腔-肠道-癌症的微生物通路。维护口腔菌群健康、促进肠道微生态平衡，可能是预防结直肠癌的重要策略。
+  </div>
+  <div class="evidence-meta">
+    来源：Rubinstein MR et al. "Fusobacterium nucleatum promotes colorectal carcinogenesis by modulating E-cadherin/β-catenin signaling" · <a href="https://doi.org/10.1016/j.chom.2013.07.012" target="_blank" rel="noopener">doi:10.1016/j.chom.2013.07.012</a>
+  </div>
+</div>
 
 <!-- STEP 04 -->
     <h3 style="font-size:1.15rem;font-weight:700;margin:2rem 0 1rem;color:var(--orange);">④ 筛查追踪——用数据验证预防是否有效</h3>

web/articles/diabetes.html

@@ -656,6 +656,7 @@
     .compare-table { font-size: 0.8rem; }
     .compare-table th, .compare-table td { padding: 0.5rem 0.75rem; }
   }
+  .ref-shot { width:100%; max-width:720px; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,0.1); margin:1.25rem 0; display:block; }
 </style>
 </head>
 <body>
@@ -723,10 +724,18 @@
       <p style="margin-top:0.5rem;">唯一可靠的识别方式是<strong>血液检测</strong>：空腹血糖（FPG）、餐后2小时血糖（2hPG）、糖化血红蛋白（HbA1c）。当这些指标异常时，即使你"感觉良好"，损伤可能已在发生。</p>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">📊</div>
-      <span>../img/ref-screenshots/diabetes_ref1.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">📊 UKPDS 16 — 确诊时β细胞功能已丧失50%</div>
+  <div class="evidence-caption">
+    <strong>UKPDS 16 (United Kingdom Prospective Diabetes Study):</strong> 新诊断2型糖尿病患者在确诊时，胰岛β细胞功能已降至正常的约50%。研究追踪了509例新诊T2DM患者，发现β细胞功能在确诊前就已呈进行性下降，且这种下降在确诊后仍持续。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：2型糖尿病不是"突然发生"的——在血糖指标达到诊断标准之前，β细胞的损伤已经持续了多年。这解释了为什么"感觉良好"完全不可靠，也说明了为什么早期筛查（空腹血糖、HbA1c）和早期干预对阻止β细胞进一步凋亡至关重要。
+  </div>
+  <div class="evidence-meta">
+    来源：UKPDS Group. "UK Prospective Diabetes Study 16: Overview of 6 Years' Therapy of Type II Diabetes" · <a href="https://doi.org/10.2337/diacare.18.9.1239" target="_blank" rel="noopener">doi:10.2337/diacare.18.9.1239</a>
+  </div>
+</div>
 
   </div>
 </section>
@@ -827,10 +836,18 @@
       <span class="quote-source">— 浠艾福 · 主动健康学院 · 五维幸福理念</span>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">📊</div>
-      <span>../img/ref-screenshots/diabetes_ref2.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">📈 UKPDS 35 — HbA1c每降低1%，并发症风险显著下降</div>
+  <div class="evidence-caption">
+    <strong>UKPDS 35 (BMJ 2000):</strong> 对4585例2型糖尿病患者平均随访10.4年，HbA1c每降低1%（例如从8%降至7%），糖尿病相关死亡风险降低21%、心肌梗死降低14%、微血管并发症降低37%。HbA1c没有"安全阈值"——越低越好，但需平衡低血糖风险。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：血糖控制是糖尿病管理的核心。HbA1c反映过去2-3个月的平均血糖水平，是评估糖尿病控制状态的"金标准"。将HbA1c控制在7%以下，可显著降低眼病、肾病、神经病变等微血管并发症的发生率和进展速度。
+  </div>
+  <div class="evidence-meta">
+    来源：Stratton IM et al. "Association of glycaemia with macrovascular and microvascular complications of type 2 diabetes (UKPDS 35)" · <a href="https://doi.org/10.1136/bmj.321.7258.405" target="_blank" rel="noopener">doi:10.1136/bmj.321.7258.405</a>
+  </div>
+</div>
 
   </div>
 </section>
@@ -928,10 +945,21 @@
       <p>具体策略：每日膳食纤维摄入>30g（全谷物、杂豆、菌菇、绿叶蔬菜），每周摄入发酵食品（酸奶、泡菜、纳豆），减少红肉和加工肉制品，控制脂肪总量。</p>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">📊</div>
-      <span>../img/ref-screenshots/diabetes_ref3.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">🦠 肠道菌群与2型糖尿病 — Nature 2012里程碑研究</div>
+  <div class="evidence-image-wrap">
+    <img src="../img/gut-microbiome-damage.jpg" alt="Gut microbiota in T2DM" style="max-height:200px;">
+  </div>
+  <div class="evidence-caption">
+    <strong>Nature 2012:</strong> 中国深圳华大基因研究院对345例中国2型糖尿病患者的宏基因组关联研究，发现T2DM患者存在中度肠道菌群失调，产丁酸细菌（如Roseburia、Faecalibacterium prausnitzii）减少，而条件致病菌增多。菌群功能基因分析显示，肠道菌群参与了T2DM的代谢调控。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：2型糖尿病不仅是胰腺和胰岛素的问题，还是"肠道的问题"。肠道菌群通过影响短链脂肪酸（SCFAs）产生、胆汁酸代谢、内毒素（LPS）进入血液等途径，直接参与胰岛素抵抗和全身慢性炎症。修复肠道菌群平衡，是改善2型糖尿病的重要靶点。
+  </div>
+  <div class="evidence-meta">
+    来源：Qin J et al. "A metagenome-wide association study of gut microbiota in type 2 diabetes" · <a href="https://doi.org/10.1038/nature11450" target="_blank" rel="noopener">doi:10.1038/nature11450</a>
+  </div>
+</div>
 
   </div>
 </section>
@@ -1132,10 +1160,18 @@
       </ul>
     </div>
 
-    <div class="shot-placeholder">
-      <div class="shot-icon">📊</div>
-      <span>../img/ref-screenshots/diabetes_ref4.png</span>
-    </div>
+    <div class="evidence-inline">
+  <div class="evidence-title">🏃 DPP研究 — 生活方式干预比二甲双胍更有效预防糖尿病</div>
+  <div class="evidence-caption">
+    <strong>DPP (Diabetes Prevention Program) 研究, NEJM 2002:</strong> 3234例糖耐量异常（IGT）患者随机分为安慰剂组、二甲双胍组和强化生活方式干预组。平均随访2.8年：生活方式干预组糖尿病发病率降低58%，二甲双胍组降低31%。生活方式干预——每周150分钟中等强度运动、减重7%——效果优于二甲双胍。
+  </div>
+  <div class="evidence-translation">
+    📖 中文意义：糖尿病前期（血糖已偏高但未达诊断标准）是逆转的最后窗口。通过生活方式干预（控制饮食+增加运动+减轻体重），可以将糖尿病发病率降低近60%。与药物相比，生活方式干预成本更低、无副作用、效果更持久——真正意义上的"治未病"。
+  </div>
+  <div class="evidence-meta">
+    来源：DPP Research Group. "Reduction in the Incidence of Type 2 Diabetes with Lifestyle Intervention or Metformin" · <a href="https://doi.org/10.1056/NEJMoa012512" target="_blank" rel="noopener">doi:10.1056/NEJMoa012512</a>
+  </div>
+</div>
 
   </div>
 </section>

web/js/footer.js

@@ -5,12 +5,14 @@
 (function() {
   var placeholder = document.getElementById('footer-placeholder');
   if (!placeholder) return;
+  // Detect if page is in a subdirectory (e.g. /articles/) to set correct relative paths
+  var p = window.location.pathname.indexOf('/articles/') !== -1 ? '../' : '';
   placeholder.innerHTML =
     '<footer class="site-footer">' +
     '  <div class="container">' +
     '    <div class="footer-inner">' +
     '      <div class="footer-brand">' +
-    '        <img src="logo.png" alt="\u6D60\u827E\u798F" class="footer-logo-img" width="48" height="48">' +
+    '        <img src="' + p + 'logo.png" alt="\u6D60\u827E\u798F" class="footer-logo-img" width="48" height="48">' +
     '        <span class="logo-text">\u6D60\u827E\u798F</span>' +
     '        <span class="logo-tag">\u4E3B\u52A8\u5065\u5EB7</span>' +
     '        <p>\u4EE5 AI \u79D1\u6280\u8D4B\u80FD\u6BCF\u4E2A\u5BB6\u5EAD\uFF0C\u8BA9\u5065\u5EB7\u4E0E\u5E78\u798F\u89E6\u624B\u53EF\u53CA\u3002</p>' +
@@ -19,18 +21,18 @@
     '        <div class="footer-col">' +
     '          <h4>\u4EA7\u54C1</h4>' +
     '          <ul>' +
-    '            <li><a href="index.html#product">\u6D60\u827E\u798F\u5E73\u53F0</a></li>' +
-    '            <li><a href="index.html#dimensions">\u4E94\u7EF4\u5E78\u798F</a></li>' +
-    '            <li><a href="index.html#features">\u6838\u5FC3\u529F\u80FD</a></li>' +
-    '            <li><a href="index.html#ai-tech">AI \u6280\u672F</a></li>' +
+    '            <li><a href="' + p + 'index.html#product">\u6D60\u827E\u798F\u5E73\u53F0</a></li>' +
+    '            <li><a href="' + p + 'index.html#dimensions">\u4E94\u7EF4\u5E78\u798F</a></li>' +
+    '            <li><a href="' + p + 'index.html#features">\u6838\u5FC3\u529F\u80FD</a></li>' +
+    '            <li><a href="' + p + 'index.html#ai-tech">AI \u6280\u672F</a></li>' +
     '          </ul>' +
     '        </div>' +
     '        <div class="footer-col">' +
     '          <h4>\u5173\u4E8E</h4>' +
     '          <ul>' +
-    '            <li><a href="index.html#about">\u516C\u53F8\u4ECB\u7ECD</a></li>' +
-    '            <li><a href="index.html#roles">\u5E73\u53F0\u89D2\u8272</a></li>' +
-    '            <li><a href="index.html#contact">\u8054\u7CFB\u65B9\u5F0F</a></li>' +
+    '            <li><a href="' + p + 'index.html#about">\u516C\u53F8\u4ECB\u7ECD</a></li>' +
+    '            <li><a href="' + p + 'index.html#roles">\u5E73\u53F0\u89D2\u8272</a></li>' +
+    '            <li><a href="' + p + 'index.html#contact">\u8054\u7CFB\u65B9\u5F0F</a></li>' +
     '          </ul>' +
     '        </div>' +
     '        <div class="footer-col">' +