refactor: move strain table from gut-microbiota to probiotics-science, add cross-links and new target audience cards

web/articles/gut-microbiota-testing.html

@@ -376,129 +376,53 @@
 
   .anchor { scroll-margin-top: 72px; }
 
-  /* ===== 菌株速查表 & 检测指标 ===== */
-  .strain-section { margin-top: 2rem; }
-  .strain-filter-bar {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 0.5rem;
-    margin-bottom: 1rem;
-  }
-  .strain-filter-btn {
-    background: white;
-    border: 2px solid var(--teal);
-    color: var(--teal);
-    padding: 0.35rem 0.9rem;
-    border-radius: 999px;
-    font-size: 0.78rem;
-    font-weight: 600;
-    cursor: pointer;
-    transition: all 0.2s;
-    font-family: inherit;
-  }
-  .strain-filter-btn:hover,
-  .strain-filter-btn.active {
-    background: var(--teal);
-    color: white;
-  }
-  .strain-table-wrap {
-    border-radius: var(--radius);
-    overflow: hidden;
-    box-shadow: var(--shadow-card);
-    margin-bottom: 0.8rem;
-  }
-  .strain-table-row {
-    display: grid;
-    grid-template-columns: 170px 2fr 130px 130px 55px 110px;
-    border-bottom: 1px solid #eee;
-    font-size: 0.8rem;
-    background: white;
-  }
-  .strain-table-row:last-child { border-bottom: none; }
-  .strain-table-row.hidden { display: none; }
-  .strain-table-header {
-    background: var(--bg-dark);
-    color: white;
-    font-size: 0.72rem;
-    font-weight: 700;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    padding: 0.65rem 0.75rem;
-  }
-  .strain-table-row:not(.strain-table-header) {
-    padding: 0.75rem;
-  }
-  .strain-table-row:not(.strain-table-header):hover { background: var(--bg-alt); }
-  .strain-name { font-weight: 700; color: var(--teal); font-size: 0.82rem; margin-bottom: 0.15rem; }
-  .strain-tag {
-    display: inline-block;
-    font-size: 0.62rem;
-    padding: 0.12rem 0.45rem;
-    border-radius: 999px;
-    font-weight: 600;
-  }
-  .strain-tag.teal { background: var(--teal-light); color: var(--teal); }
-  .strain-tag.purple { background: var(--purple-light); color: var(--purple); }
-  .strain-tag.orange { background: var(--orange-light); color: var(--orange); }
-  .strain-tag.pink { background: #fce4ec; color: #c2185b; }
-  .col-effect { color: var(--text-secondary); font-size: 0.77rem; line-height: 1.55; padding-right: 0.5rem; }
-  .col-source, .col-product { color: var(--text-muted); font-size: 0.73rem; padding-right: 0.5rem; }
-  .col-star { text-align: center; }
-  .col-crowd { font-size: 0.73rem; color: var(--text-muted); }
-  .stars { color: var(--orange); font-size: 0.82rem; letter-spacing: 1px; }
-  .strain-table-legend {
-    font-size: 0.73rem;
-    color: var(--text-muted);
-    margin-bottom: 0.5rem;
-    padding-left: 0.2rem;
-  }
-
-  /* 检测指标维度模块 */
-  .indicator-modules { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
+  /* ===== 检测指标维度模块（小卡片三列） ===== */
+  .indicator-modules { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.5rem 0; }
   .indicator-module {
     background: white;
-    border-radius: var(--radius);
-    padding: 1.1rem 1.2rem;
+    border-radius: 12px;
+    padding: 1rem 1.1rem;
     box-shadow: var(--shadow-card);
-    border-left: 4px solid;
+    border-top: 3px solid;
+    position: relative;
   }
-  .indicator-module.disease { border-left-color: #e74c3c; }
-  .indicator-module.microbiome { border-left-color: var(--teal); }
-  .indicator-module.barrier { border-left-color: var(--blue); }
-  .indicator-module.nutrition { border-left-color: var(--orange); }
-  .indicator-module.vitamin { border-left-color: #f1c40f; }
-  .indicator-module.scfa { border-left-color: #27ae60; }
-  .indicator-module.neuro { border-left-color: var(--purple); }
-  .indicator-module.pathogen { border-left-color: #c0392b; }
-  .indicator-module h4 { font-size: 0.9rem; font-weight: 700; margin-bottom: 0.5rem; }
+  .indicator-module.disease { border-top-color: #e74c3c; }
+  .indicator-module.microbiome { border-top-color: var(--teal); }
+  .indicator-module.barrier { border-top-color: var(--blue); }
+  .indicator-module.nutrition { border-top-color: var(--orange); }
+  .indicator-module.vitamin { border-top-color: #f1c40f; }
+  .indicator-module.scfa { border-top-color: #27ae60; }
+  .indicator-module.neuro { border-top-color: var(--purple); }
+  .indicator-module.pathogen { border-top-color: #c0392b; }
+  .indicator-module h4 { font-size: 0.85rem; font-weight: 700; margin-bottom: 0.3rem; }
   .indicator-module .module-meta {
-    font-size: 0.75rem;
+    font-size: 0.7rem;
     background: var(--bg-alt);
-    padding: 0.3rem 0.6rem;
+    padding: 0.2rem 0.5rem;
     border-radius: 6px;
     display: inline-block;
-    margin-bottom: 0.6rem;
+    margin-bottom: 0.5rem;
     color: var(--text-muted);
   }
   .indicator-module ul {
     list-style: none;
     padding: 0;
-    font-size: 0.8rem;
+    font-size: 0.75rem;
     color: var(--text-secondary);
-    line-height: 1.7;
+    line-height: 1.6;
   }
   .indicator-module ul li::before { content: "· "; font-weight: 700; }
   .indicator-module .value-hint {
-    font-size: 0.73rem;
+    font-size: 0.7rem;
     color: var(--text-muted);
-    margin-top: 0.5rem;
-    padding-top: 0.5rem;
+    margin-top: 0.4rem;
+    padding-top: 0.4rem;
     border-top: 1px dashed #eee;
   }
 
   /* 疾病风险参考表 */
   .disease-risk-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; margin: 1rem 0; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-card); }
-  .disease-risk-table th { background: var(--bg-dark); color: white; padding: 0.6rem 0.8rem; text-align: left; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; }
+  .disease-risk-table th { background: var(--accent); color: white; padding: 0.6rem 0.8rem; text-align: left; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; }
   .disease-risk-table td { padding: 0.5rem 0.8rem; border-bottom: 1px solid #eee; color: var(--text-secondary); }
   .disease-risk-table tr:last-child td { border-bottom: none; }
   .disease-risk-table tr:hover td { background: var(--bg-alt); }
@@ -507,11 +431,6 @@
   .risk-high { color: #e74c3c; font-weight: 600; }
 
   @media (max-width: 768px) {
-    .strain-filter-bar { gap: 0.35rem; }
-    .strain-table-row { grid-template-columns: 1fr 1fr; }
-    .strain-table-header { display: none; }
-    .col-strain { grid-column: 1 / -1; }
-    .col-effect { grid-column: 1 / -1; }
     .indicator-modules { grid-template-columns: 1fr; }
   }
 
@@ -605,11 +524,15 @@
         <li>个性化的饮食调整策略（什么该吃、什么不该吃）</li>
         <li>复查时间表（什么时候复查、预期改善多少）</li>
       </ul>
-    </div>
+</div><!-- end card-gold / grid-2 -->
+  </div><!-- /section-inner -->
+
+  <!-- 检测指标详细说明 full-width（突破 max-width 限制） -->
+  <div style="max-width:1400px;margin:0 auto;padding:0 1.5rem 1.5rem;">
 
     <!-- 检测指标详细说明（基于菌群检测知识库） -->
-    <div style="margin-top:1.5rem;">
-      <h3 style="font-size:1rem;font-weight:700;color:var(--text-primary);margin-bottom:0.8rem;">📊 菌群检测具体测什么？——8大维度全面解读</h3>
+    <div style="margin-top:0;">
+      <h3 style="font-size:1.1rem;font-weight:700;color:var(--text-primary);margin-bottom:0.8rem;">📊 菌群检测具体测什么？——8大维度全面解读</h3>
       <p style="font-size:0.82rem;color:var(--text-muted);margin-bottom:1.2rem;">一份完整的肠道菌群检测报告，涵盖以下8个核心维度。每一项都有明确的生理意义和干预价值：</p>
 
       <!-- 8维度模块 -->
@@ -766,184 +689,23 @@
         </tbody>
       </table>
       </div>
-    </div>
-
-  <div class="strain-section">
-      <h3 style="font-size:1rem;font-weight:700;color:var(--teal);margin:1.5rem 0 0.5rem;">附：常见益生菌菌株速查表</h3>
-      <p style="font-size:0.82rem;color:var(--text-muted);margin-bottom:1rem;">以下菌株拥有最多临床证据支持。选购时务必确认产品标注了完整的<strong>属＋种＋菌株号</strong>。</p>
 
-      <!-- 筛选标签栏 -->
-      <div class="strain-filter-bar">
-        <button class="strain-filter-btn active" data-filter="all">全部</button>
-        <button class="strain-filter-btn" data-filter="肠道">肠道健康</button>
-        <button class="strain-filter-btn" data-filter="免疫">免疫调节</button>
-        <button class="strain-filter-btn" data-filter="女性">女性健康</button>
-        <button class="strain-filter-btn" data-filter="情绪">情绪/睡眠</button>
-        <button class="strain-filter-btn" data-filter="代谢">代谢/体重</button>
+      <div style="background:#e6fffa;border-radius:12px;padding:1rem 1.2rem;margin-top:1.5rem;border-left:4px solid var(--teal);">
+        <p style="font-size:0.85rem;color:var(--text-secondary);margin-bottom:0.5rem;">💊 想了解具体益生菌菌株的功效、专利来源和适宜人群？</p>
+        <a href="probiotics-science.html" style="color:var(--teal);font-weight:700;font-size:0.9rem;">→ 查看：益生菌科学解读 · 核心菌株速查表（15株循证总结）</a>
       </div>
 
-      <div class="strain-table-wrap">
-        <div class="strain-table-row strain-table-header">
-          <div class="col-strain">菌株名称</div>
-          <div class="col-effect">主要功效</div>
-          <div class="col-source">专利/来源</div>
-          <div class="col-product">代表产品</div>
-          <div class="col-star">证据</div>
-          <div class="col-crowd">适宜人群</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,免疫">
-          <div class="col-strain"><div class="strain-name">动物双歧杆菌 BB-12</div><span class="strain-tag teal">Bifidobacterium animalis BB-12</span></div>
-          <div class="col-effect">改善便秘（排便频率+30-40%）·降低呼吸道感染风险 ·婴儿湿疹预防（与LGG联用）</div>
-          <div class="col-source">Chr. Hansen（丹麦）</div>
-          <div class="col-product">纽曼博士/合生元系列</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">全人群·婴儿可用</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,免疫">
-          <div class="col-strain"><div class="strain-name">鼠李糖乳杆菌 LGG</div><span class="strain-tag teal">Lactobacillus rhamnosus GG</span></div>
-          <div class="col-effect">预防抗生素相关腹泻（40-60%）·缩短儿童急性胃肠炎病程 ·孕妇补充降低婴儿特应性皮炎风险</div>
-          <div class="col-source">Chr. Hansen × 芬兰Turku大学</div>
-          <div class="col-product">康萃乐/妈咪爱</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">儿童·孕妇·旅行者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道">
-          <div class="col-strain"><div class="strain-name">布拉氏酵母 CNCM I-3799</div><span class="strain-tag purple">Saccharomyces boulardii</span></div>
-          <div class="col-effect">旅行腹泻预防（68-85%）·艰难梭菌感染辅助治疗 ·儿童急性胃肠炎（ESPGHAN推荐）</div>
-          <div class="col-source">Biocodex（法国）·唯一酵母益生菌</div>
-          <div class="col-product">亿活/布拉氏酵母散</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">旅行者·抗生素期间</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,情绪">
-          <div class="col-strain"><div class="strain-name">植物乳杆菌 299v</div><span class="strain-tag teal">Lactobacillus plantarum 299v</span></div>
-          <div class="col-effect">显著改善IBS整体症状和腹痛（JAMA 2021 RCT）·缓解焦虑（肠脑轴）·促进非血红素铁吸收</div>
-          <div class="col-source">Probi AB（瑞典）·Linköping大学</div>
-          <div class="col-product">GoodBelly/拜耳Florisan</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">IBS患者·焦虑人群·素食者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,女性">
-          <div class="col-strain"><div class="strain-name">罗伊氏乳杆菌 DSM 17938</div><span class="strain-tag teal">Lactobacillus reuteri DSM 17938</span></div>
-          <div class="col-effect">婴儿肠绞痛（多国指南推荐）·改善婴儿反流/便秘 ·辅助提高幽门螺杆菌根除率</div>
-          <div class="col-source">BioGaia（瑞典）</div>
-          <div class="col-product">拜奥(BioGaia)/唯氏康</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">婴儿·哺乳期·HP感染者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,免疫">
-          <div class="col-strain"><div class="strain-name">凝结芽孢杆菌 BC30</div><span class="strain-tag orange">Bacillus coagulans BC30</span></div>
-          <div class="col-effect">改善腹胀/肠道不适 ·增强流感疫苗免疫应答 ·减少运动后呼吸道感染</div>
-          <div class="col-source">GanedenBC（Kerry收购）</div>
-          <div class="col-product">Culturelle Sport/Thorne Florassist</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">运动人群·消化脆弱者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="情绪,免疫">
-          <div class="col-strain"><div class="strain-name">瑞士乳杆菌 R0052</div><span class="strain-tag teal">Lactobacillus helveticus R0052</span></div>
-          <div class="col-effect">缓解焦虑/压力（CNS Drugs 2023荟萃分析确认）·改善睡眠质量 ·减少皮质醇水平</div>
-          <div class="col-source">Institut Rosell（加拿大）</div>
-          <div class="col-product">Life Extension/NeuroScience</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">焦虑人群·高压人群·失眠者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="情绪,肠道">
-          <div class="col-strain"><div class="strain-name">长双歧杆菌 R0175</div><span class="strain-tag teal">Bifidobacterium longum R0175</span></div>
-          <div class="col-effect">改善整体情绪评分 ·缓解轻度抑郁（肠脑轴） ·减轻IBS症状</div>
-          <div class="col-source">Institut Rosell（加拿大）</div>
-          <div class="col-product">NeuroBiotic (Thorne)/ProbioBrain</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">情绪困扰者·IBS患者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,免疫,代谢">
-          <div class="col-strain"><div class="strain-name">嗜酸乳杆菌 NCFM</div><span class="strain-tag teal">Lactobacillus acidophilus NCFM</span></div>
-          <div class="col-effect">改善乳糖不耐受 ·增强疫苗抗体应答 ·辅助降低SIBO风险</div>
-          <div class="col-source">DuPont Danisco（美国）</div>
-          <div class="col-product">Culturelle!/Align（NCFM株）</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">乳糖不耐受·SIBO预防</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="女性">
-          <div class="col-strain"><div class="strain-name">鼠李糖乳杆菌 GR-1</div><span class="strain-tag pink">Lactobacillus rhamnosus GR-1</span></div>
-          <div class="col-effect">恢复阴道菌群平衡 ·预防复发性尿道感染 ·改善细菌性阴道炎</div>
-          <div class="col-source">Urex Biotech × LifeBridge Health</div>
-          <div class="col-product">Femilac/妇科益生菌复方制剂</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">女性·孕妇·尿道感染史</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,代谢">
-          <div class="col-strain"><div class="strain-name">格式塔氏乳杆菌 KS 13.1</div><span class="strain-tag teal">Lactobacillus gasseri KS 13.1</span></div>
-          <div class="col-effect">显著改善便秘（排便频率+43%）·降低餐后血脂 ·辅助控制BMI</div>
-          <div class="col-source">Korean Food Research Institute</div>
-          <div class="col-product">万年春LP/LG21株关联产品</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">便秘人群·血脂偏高者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="免疫">
-          <div class="col-strain"><div class="strain-name">副干酪乳杆菌 L. casei 431</div><span class="strain-tag teal">Lactobacillus paracasei 431</span></div>
-          <div class="col-effect">降低普通感冒发生率（25%）·缩短感冒病程 ·增强流感疫苗效果</div>
-          <div class="col-source">Chr. Hansen（丹麦）</div>
-          <div class="col-product">ImmuneDefense系列/拜耳专项</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">免疫力低下·老年人·办公人群</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="女性,免疫">
-          <div class="col-strain"><div class="strain-name">发酵乳杆菌 CECT5716</div><span class="strain-tag teal">Lactobacillus fermentum CECT5716</span></div>
-          <div class="col-effect">母乳中天然分离·提升母乳IgA ·降低哺乳期乳腺炎风险 ·婴儿免疫发育支持</div>
-          <div class="col-source">Instituto Halal（西班牙）</div>
-          <div class="col-product">MamiLab/母乳益生菌制剂</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">哺乳期·孕晚期</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="肠道,免疫,代谢">
-          <div class="col-strain"><div class="strain-name">长双歧杆菌 BB536</div><span class="strain-tag teal">Bifidobacterium longum BB536</span></div>
-          <div class="col-effect">改善老年人便秘 ·降低过敏症状 ·辅助降低血氨（肝脏健康）</div>
-          <div class="col-source">Morinaga Milk Industry（日本）</div>
-          <div class="col-product">Morinaga BB536散剂/儿童制剂</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">老年人·过敏人群·便秘者</div>
-        </div>
-
-        <div class="strain-table-row" data-tags="情绪,肠道">
-          <div class="col-strain"><div class="strain-name">唾液乳杆菌 LS01</div><span class="strain-tag teal">Lactobacillus salivarius LS01</span></div>
-          <div class="col-effect">改善特应性皮炎（成人）·缓解IBS ·辅助调节焦虑/抑郁评分</div>
-          <div class="col-source">VSL Pharmaceuticals（意大利）</div>
-          <div class="col-product">VSL#3（美系处方益生菌）</div>
-          <div class="col-star"><span class="stars">★★★</span></div>
-          <div class="col-crowd">AD患者·IBS·情绪共病</div>
-        </div>
-
-      </div><!-- /strain-table-wrap -->
+    </div>
+  </div><!-- /full-width wrapper -->
 
-      <div class="strain-table-legend">
-        <span class="stars">★★★</span> 高证据（多项RCT/指南推荐）&nbsp;&nbsp;
-        <span class="stars" style="color:#aaa">★★</span> 中等证据（多项临床研究）&nbsp;&nbsp;
-        <span class="stars" style="color:#aaa">★</span> 初步证据（机制明确/小规模研究）
-      </div>
-    </div><!-- /strain-section -->
-  </div>
-  </div>
+  <div class="section-inner">
 </section>
 
 <!-- 03: 谁需要做菌群检测 -->
 <section class="section" id="who-needs">
   <div class="section-tag gold">🎯 03 · 目标人群</div>
   <h2>这些人，最需要给肠道做一次"人口普查"</h2>
-  <p class="section-intro">菌群检测不是人人必做，但以下人群的"检测回报率"极高——一次检测，可能帮你省下半年以上的试错时间。</p>
+  <p class="section-intro">菌群检测不是人人必做，但以下人群的"检测回报率"极高。其中<strong>儿童和老年人建议每年检测一次</strong>，持续追踪菌群变化；其他人群在出现相关症状时进行针对性检测，可能帮你省下半年以上的试错时间。</p>
 
   <div class="grid-2">
     <div class="card card-blue">
@@ -963,6 +725,21 @@
       <h3><span class="card-icon">💊</span> 长期服药/抗生素史</h3>
       <p>抗生素就像对肠道菌群的一次"地毯式轰炸"——好菌坏菌一起杀。即使是一次抗生素疗程，菌群也需要数月才能部分恢复。长期服用PPI（抑酸药）、NSAIDs（抗炎药）也会显著改变菌群结构。</p>
     </div>
+    <div class="card card-teal">
+      <h3><span class="card-icon">👶</span> 儿童——建议每年检测</h3>
+      <p>0-12岁是肠道菌群建立"地基"的关键窗口期。剖腹产、配方奶喂养、反复使用抗生素等因素都会显著改变菌群定植轨迹。菌群失调在儿童期的表现往往不是腹泻腹胀，而是——湿疹反复、食物过敏、反复呼吸道感染、注意力不集中、生长发育迟缓。</p>
+      <p style="margin-top:0.5rem;font-size:0.85rem;color:var(--text-muted);">📌 <strong>建议每年检测一次</strong>，监测菌群建立是否正常，早发现早干预，别等到上学后才"亡羊补牢"。</p>
+    </div>
+    <div class="card card-gold">
+      <h3><span class="card-icon">👴</span> 老年人——建议每年检测</h3>
+      <p>60岁后，肠道菌群多样性显著下降，产丁酸菌减少、条件致病菌增加，这与衰老性炎症（inflammaging）密切相关。老年人菌群失调常见表现：便秘加重、营养吸收变差、免疫力下降（反复感冒/带状疱疹）、认知功能下滑。</p>
+      <p style="margin-top:0.5rem;font-size:0.85rem;color:var(--text-muted);">📌 <strong>建议每年检测一次</strong>，追踪菌群衰老速度，通过精准营养干预延缓菌群老化，降低慢病风险。</p>
+    </div>
+    <div class="card card-purple">
+      <h3><span class="card-icon">🤧</span> 易过敏人群</h3>
+      <p>过敏（鼻炎、哮喘、湿疹、食物过敏）的本质是免疫系统"反应过度"。肠道菌群是免疫系统最早的"教练"——菌群失调→免疫教育缺失→Th2免疫偏移→过敏。研究证实：过敏儿童的双歧杆菌和拟杆菌丰度显著低于健康儿童。</p>
+      <p style="margin-top:0.5rem;font-size:0.85rem;color:var(--text-muted);">📎 参考：<a href="probiotics-science.html" style="color:var(--purple);">益生菌科学解读</a>中的菌株-过敏证据汇总</p>
+    </div>
   </div>
 
   <div class="highlight-box gold" style="margin-top:2rem;">
@@ -1131,28 +908,5 @@
   </div>
 </footer>
 
-<!-- 菌株速查表筛选 -->
-<script>
-(function() {
-  var btns = document.querySelectorAll('.strain-filter-btn');
-  var rows = document.querySelectorAll('.strain-table-row[data-tags]');
-  btns.forEach(function(btn) {
-    btn.addEventListener('click', function() {
-      var filter = btn.getAttribute('data-filter');
-      btns.forEach(function(b) { b.classList.remove('active'); });
-      btn.classList.add('active');
-      rows.forEach(function(row) {
-        if (filter === 'all') {
-          row.classList.remove('hidden');
-        } else {
-          var tags = row.getAttribute('data-tags') || '';
-          row.classList.toggle('hidden', tags.indexOf(filter) === -1);
-        }
-      });
-    });
-  });
-})();
-</script>
-
 </body>
 </html>

web/articles/probiotics-science.html

@@ -365,6 +365,108 @@
   .list-styled { padding-left: 1.2rem; color: var(--text-secondary); font-size: 0.85rem; line-height: 1.8; }
   .list-styled li { margin-bottom: 0.3rem; }
 
+  /* ===== 菌株速查表 ===== */
+  .strain-filter-bar {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+    margin: 1.2rem 0 1rem;
+  }
+  .strain-filter-btn {
+    background: white;
+    border: 2px solid var(--purple);
+    color: var(--purple);
+    padding: 0.4rem 1rem;
+    border-radius: 999px;
+    font-size: 0.8rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.2s;
+    font-family: inherit;
+  }
+  .strain-filter-btn:hover,
+  .strain-filter-btn.active {
+    background: var(--purple);
+    color: white;
+  }
+  .strain-table-wrap {
+    border-radius: var(--radius);
+    overflow: hidden;
+    box-shadow: var(--shadow-card);
+    margin-bottom: 0.8rem;
+  }
+  .strain-table-row {
+    display: grid;
+    grid-template-columns: 180px 2fr 140px 140px 60px 120px;
+    gap: 0;
+    background: white;
+    border-bottom: 1px solid #eee;
+    font-size: 0.8rem;
+    align-items: start;
+    padding: 0;
+  }
+  .strain-table-row:last-child { border-bottom: none; }
+  .strain-table-header {
+    background: var(--bg-dark);
+    color: white;
+    font-size: 0.75rem;
+    font-weight: 700;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    padding: 0.7rem 0.8rem;
+    border-bottom: none;
+  }
+  .strain-table-row:not(.strain-table-header) {
+    padding: 0.8rem;
+  }
+  .strain-table-row:not(.strain-table-header):hover {
+    background: var(--bg-alt);
+  }
+  .strain-table-row.hidden { display: none; }
+  .col-strain { padding-right: 0.6rem; }
+  .col-effect { padding-right: 0.6rem; color: var(--text-secondary); font-size: 0.78rem; line-height: 1.6; }
+  .col-source, .col-product { padding-right: 0.6rem; color: var(--text-muted); font-size: 0.75rem; }
+  .col-star { text-align: center; }
+  .col-crowd { font-size: 0.75rem; color: var(--text-muted); }
+  .strain-name {
+    font-weight: 700;
+    color: var(--purple);
+    font-size: 0.85rem;
+    margin-bottom: 0.2rem;
+  }
+  .strain-tag {
+    display: inline-block;
+    font-size: 0.65rem;
+    padding: 0.15rem 0.5rem;
+    border-radius: 999px;
+    font-weight: 600;
+    margin-top: 0.15rem;
+  }
+  .strain-tag.purple { background: var(--purple-light); color: var(--purple); }
+  .strain-tag.teal { background: var(--teal-light); color: var(--teal); }
+  .strain-tag.orange { background: var(--orange-light); color: var(--orange); }
+  .strain-tag.pink { background: #fce4ec; color: #c2185b; }
+  .stars { color: var(--orange); font-size: 0.85rem; letter-spacing: 1px; }
+  .strain-table-legend {
+    font-size: 0.75rem;
+    color: var(--text-muted);
+    margin-bottom: 1.2rem;
+    padding: 0 0.3rem;
+  }
+
+  /* 移动端适配 */
+  @media (max-width: 768px) {
+    .strain-filter-bar { gap: 0.4rem; }
+    .strain-table-row {
+      grid-template-columns: 1fr 1fr;
+      gap: 0.4rem;
+    }
+    .strain-table-header { display: none; }
+    .col-strain { grid-column: 1 / -1; }
+    .col-effect { grid-column: 1 / -1; }
+    .col-star, .col-source, .col-product, .col-crowd { font-size: 0.72rem; }
+  }
+
   .compare-table {
     width: 100%;
     border-collapse: collapse;
@@ -746,84 +848,234 @@
 <!-- ===== 5. STRAINS ===== -->
 <section id="strains">
   <div class="container">
-    <h2>五、核心益生菌菌株——循证科学速览</h2>
-    <p>以下菌株是全球研究最充分、临床证据最强的益生菌，每一株都经过了严格的临床试验验证：</p>
-
-    <div class="grid-3">
-      <div class="strain-card">
-        <h4>动物双歧杆菌 BB-12</h4>
-        <div class="strain-tags"><span class="strain-tag">Bifidobacterium animalis BB-12</span></div>
-        <p style="font-size:0.85rem;">全球使用最广泛的益生菌菌株，拥有超过300项临床研究。1985年从健康成人肠道分离。</p>
-        <ul class="list-styled" style="font-size:0.82rem;">
-          <li><strong>肠道健康</strong>：改善便秘，排便频率增加30-40%</li>
-          <li><strong>免疫调节</strong>：降低呼吸道感染风险</li>
-          <li><strong>婴儿健康</strong>：与LGG联用对婴儿湿疹效果显著</li>
-        </ul>
-        <div class="evidence-note">研究剂量：≥10亿CFU/天</div>
+    <h2>五、核心益生菌菌株——循证科学速查表</h2>
+    <p>以下15株是全球临床证据最充分的益生菌。选购时务必确认产品标注了完整的<strong>属＋种＋菌株号</strong>（如 <em>B. lactis</em> BB-12），而非模糊的"双歧杆菌"。</p>
+
+    <!-- 筛选标签栏 -->
+    <div class="strain-filter-bar">
+      <button class="strain-filter-btn active" data-filter="all">全部(15)</button>
+      <button class="strain-filter-btn" data-filter="肠道">肠道健康</button>
+      <button class="strain-filter-btn" data-filter="免疫">免疫调节</button>
+      <button class="strain-filter-btn" data-filter="女性">女性健康</button>
+      <button class="strain-filter-btn" data-filter="情绪">情绪/睡眠</button>
+      <button class="strain-filter-btn" data-filter="代谢">代谢/体重</button>
+    </div>
+
+    <!-- 速查表头部 -->
+    <div class="strain-table-wrap">
+      <div class="strain-table-row strain-table-header">
+        <div class="col-strain">菌株名称</div>
+        <div class="col-effect">主要功效</div>
+        <div class="col-source">专利/来源</div>
+        <div class="col-product">代表产品</div>
+        <div class="col-star">证据</div>
+        <div class="col-crowd">适宜人群</div>
+      </div>
+
+      <!-- BB-12 -->
+      <div class="strain-table-row" data-tags="肠道,免疫">
+        <div class="col-strain">
+          <div class="strain-name">动物双歧杆菌 BB-12</div>
+          <span class="strain-tag purple">Bifidobacterium animalis BB-12</span>
+        </div>
+        <div class="col-effect">改善便秘（排便频率+30-40%）·降低呼吸道感染风险 ·婴儿湿疹预防（与LGG联用）</div>
+        <div class="col-source">Chr. Hansen（丹麦）</div>
+        <div class="col-product">纽曼博士益生菌/合生元系列</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">全人群·婴儿可用</div>
+      </div>
+
+      <!-- LGG -->
+      <div class="strain-table-row" data-tags="肠道,免疫">
+        <div class="col-strain">
+          <div class="strain-name">鼠李糖乳杆菌 LGG</div>
+          <span class="strain-tag purple">Lactobacillus rhamnosus GG</span>
+        </div>
+        <div class="col-effect">预防抗生素相关腹泻（40-60%）·缩短儿童急性胃肠炎病程 ·孕妇补充降低婴儿特应性皮炎风险</div>
+        <div class="col-source">Chr. Hansen × 芬兰Turku大学（1985）</div>
+        <div class="col-product">康萃乐(Culturelle)/妈咪爱</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">儿童·孕妇·旅行者</div>
+      </div>
+
+      <!-- 布拉氏酵母 -->
+      <div class="strain-table-row" data-tags="肠道">
+        <div class="col-strain">
+          <div class="strain-name">布拉氏酵母 CNCM I-3799</div>
+          <span class="strain-tag teal">Saccharomyces boulardii</span>
+        </div>
+        <div class="col-effect">旅行腹泻预防（68-85%）·艰难梭菌感染辅助治疗 ·儿童急性胃肠炎（ESPGHAN推荐）</div>
+        <div class="col-source">Biocodex（法国）·唯一酵母益生菌</div>
+        <div class="col-product">亿活(Enterol)/布拉氏酵母散</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">旅行者·抗生素期间·儿童</div>
+      </div>
+
+      <!-- 植物乳杆菌 299v -->
+      <div class="strain-table-row" data-tags="肠道,情绪">
+        <div class="col-strain">
+          <div class="strain-name">植物乳杆菌 299v</div>
+          <span class="strain-tag purple">Lactobacillus plantarum 299v</span>
+        </div>
+        <div class="col-effect">显著改善IBS整体症状和腹痛（JAMA 2021 RCT）·缓解焦虑（肠脑轴）·促进非血红素铁吸收</div>
+        <div class="col-source">Probi AB（瑞典）·Linköping大学</div>
+        <div class="col-product">GoodBelly/拜耳Florisan</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">IBS患者·素食者·焦虑人群</div>
+      </div>
+
+      <!-- 罗伊氏乳杆菌 DSM 17938 -->
+      <div class="strain-table-row" data-tags="肠道,女性">
+        <div class="col-strain">
+          <div class="strain-name">罗伊氏乳杆菌 DSM 17938</div>
+          <span class="strain-tag teal">Lactobacillus reuteri DSM 17938</span>
+        </div>
+        <div class="col-effect">婴儿肠绞痛（哭闹时间减少，多国指南推荐）·改善婴儿反流/便秘 ·辅助提高幽门螺杆菌根除率</div>
+        <div class="col-source">BioGaia（瑞典）·ATCC 55730</div>
+        <div class="col-product">拜奥(BioGaia)/唯氏康</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">婴儿·哺乳期·HP感染者</div>
+      </div>
+
+      <!-- 凝结芽孢杆菌 BC30 -->
+      <div class="strain-table-row" data-tags="肠道,免疫">
+        <div class="col-strain">
+          <div class="strain-name">凝结芽孢杆菌 BC30</div>
+          <span class="strain-tag orange">Bacillus coagulans BC30</span>
+        </div>
+        <div class="col-effect">改善腹胀/肠道不适 ·增强流感疫苗免疫应答 ·减少运动后呼吸道感染</div>
+        <div class="col-source">GanedenBC（后被Kerry收购）</div>
+        <div class="col-product">Culturelle Sport/Thorne Florassist</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">运动人群·消化脆弱者</div>
+      </div>
+
+      <!-- 瑞士乳杆菌 R0052 -->
+      <div class="strain-table-row" data-tags="情绪,免疫">
+        <div class="col-strain">
+          <div class="strain-name">瑞士乳杆菌 R0052</div>
+          <span class="strain-tag purple">Lactobacillus helveticus R0052</span>
+        </div>
+        <div class="col-effect">缓解焦虑/压力（CNS Drugs 2023荟萃分析确认）·改善睡眠质量 ·减少皮质醇水平</div>
+        <div class="col-source">Institut Rosell（加拿大）</div>
+        <div class="col-product">Life Extension/NeuroScience</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">焦虑人群·高压人群·失眠者</div>
+      </div>
+
+      <!-- 长双歧杆菌 R0175 -->
+      <div class="strain-table-row" data-tags="情绪,肠道">
+        <div class="col-strain">
+          <div class="strain-name">长双歧杆菌 R0175</div>
+          <span class="strain-tag purple">Bifidobacterium longum R0175</span>
+        </div>
+        <div class="col-effect">改善整体情绪评分 ·缓解轻度抑郁症状（肠脑轴） ·减轻肠易激综合征症状</div>
+        <div class="col-source">Institut Rosell（加拿大）</div>
+        <div class="col-product">NeuroBiotic (Thorne)/ProbioBrain</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">情绪困扰者·IBS患者</div>
+      </div>
+
+      <!-- 嗜酸乳杆菌 NCFM -->
+      <div class="strain-table-row" data-tags="肠道,免疫,代谢">
+        <div class="col-strain">
+          <div class="strain-name">嗜酸乳杆菌 NCFM</div>
+          <span class="strain-tag teal">Lactobacillus acidophilus NCFM</span>
+        </div>
+        <div class="col-effect">改善乳糖不耐受 ·增强疫苗抗体应答 ·辅助降低小肠细菌过度生长（SIBO）风险</div>
+        <div class="col-source">DuPont Danisco（美国）</div>
+        <div class="col-product">Culturelle!/Align（仅NCFM株）</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">乳糖不耐受·SIBO预防·免疫增强</div>
       </div>
 
-      <div class="strain-card">
-        <h4>鼠李糖乳杆菌 LGG</h4>
-        <div class="strain-tags"><span class="strain-tag">Lactobacillus rhamnosus GG</span></div>
-        <p style="font-size:0.85rem;">世界上研究最充分的益生菌菌株（1985年分离），以极强的胃酸耐受性和肠道定植能力著称。</p>
-        <ul class="list-styled" style="font-size:0.82rem;">
-          <li><strong>抗生素相关腹泻</strong>：预防率40-60%（多项RCT验证）</li>
-          <li><strong>儿童急性胃肠炎</strong>：缩短腹泻约1天（AAP/ESPGHAN推荐）</li>
-          <li><strong>湿疹预防</strong>：孕妇+婴儿补充降低特应性皮炎风险23-50%</li>
-        </ul>
-        <div class="evidence-note">研究剂量：≥100亿CFU/天</div>
+      <!-- 鼠李糖乳杆菌 GR-1 -->
+      <div class="strain-table-row" data-tags="女性">
+        <div class="col-strain">
+          <div class="strain-name">鼠李糖乳杆菌 GR-1</div>
+          <span class="strain-tag pink">Lactobacillus rhamnosus GR-1</span>
+        </div>
+        <div class="col-effect">恢复阴道菌群平衡（阴道健康核心菌株）·预防复发性尿道感染 ·改善细菌性阴道炎</div>
+        <div class="col-source">Urex Biotech（加拿大）× LifeBridge Health</div>
+        <div class="col-product">Femilac/妇科益生菌复方制剂</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">女性·孕妇·尿道感染史</div>
       </div>
 
-      <div class="strain-card">
-        <h4>布拉氏酵母菌</h4>
-        <div class="strain-tags"><span class="strain-tag">Saccharomyces boulardii CNCM I-3799</span></div>
-        <p style="font-size:0.85rem;">唯一的酵母类益生菌——不受抗生素影响，可与抗生素同服。常温稳定的天然优势。</p>
-        <ul class="list-styled" style="font-size:0.82rem;">
-          <li><strong>旅行腹泻</strong>：预防率68-85%（证据等级最高的适应症）</li>
-          <li><strong>艰难梭菌感染</strong>：辅助治疗降低复发率</li>
-          <li><strong>儿童急性胃肠炎</strong>：ESPGHAN指南推荐</li>
-        </ul>
-        <div class="evidence-note">优势：可与抗生素同服，不被杀灭</div>
+      <!-- 格式塔氏乳杆菌 KS 13.1 -->
+      <div class="strain-table-row" data-tags="肠道,免疫">
+        <div class="col-strain">
+          <div class="strain-name">格式塔氏乳杆菌 KS 13.1</div>
+          <span class="strain-tag teal">Lactobacillus gasseri KS 13.1</span>
+        </div>
+        <div class="col-effect">显著改善便秘（排便频率+43%）·降低餐后血脂 ·辅助控制BMI</div>
+        <div class="col-source">Korean Food Research Institute（韩国）</div>
+        <div class="col-product">万年春LP/LG21株关联产品</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">便秘人群·血脂偏高者</div>
       </div>
 
-      <div class="strain-card">
-        <h4>植物乳杆菌 299v</h4>
-        <div class="strain-tags"><span class="strain-tag">Lactobacillus plantarum 299v</span></div>
-        <p style="font-size:0.85rem;">源于健康人类肠道，具有优异的肠道存活率和定植能力。以肠-脑轴研究闻名。</p>
-        <ul class="list-styled" style="font-size:0.82rem;">
-          <li><strong>肠易激综合征</strong>：显著改善整体症状和腹痛（JAMA 2021 RCT）</li>
-          <li><strong>情绪调节</strong>：通过肠脑轴缓解焦虑症状</li>
-          <li><strong>铁吸收</strong>：促进非血红素铁吸收（对素食者有价值）</li>
-        </ul>
-        <div class="evidence-note">研究剂量：≥100亿CFU/天</div>
+      <!-- 副干酪乳杆菌 L. casei 431 -->
+      <div class="strain-table-row" data-tags="免疫">
+        <div class="col-strain">
+          <div class="strain-name">副干酪乳杆菌 L. casei 431</div>
+          <span class="strain-tag purple">Lactobacillus paracasei 431</span>
+        </div>
+        <div class="col-effect">降低普通感冒发生率（25%）·缩短感冒病程 ·增强流感疫苗效果</div>
+        <div class="col-source">Chr. Hansen（丹麦）</div>
+        <div class="col-product">ImmuneDefense系列/拜耳专项</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">免疫力低下者·老年人·办公人群</div>
       </div>
 
-      <div class="strain-card">
-        <h4>罗伊氏乳杆菌 DSM 17938</h4>
-        <div class="strain-tags"><span class="strain-tag">Lactobacillus reuteri DSM 17938</span></div>
-        <p style="font-size:0.85rem;">既能产生抗菌物质罗伊氏菌素，又能调节免疫的独特菌株。</p>
-        <ul class="list-styled" style="font-size:0.82rem;">
-          <li><strong>婴幼儿肠绞痛</strong>：减少哭闹时间（多项RCT验证，指南推荐）</li>
-          <li><strong>婴儿反流/便秘</strong>：改善胃肠功能</li>
-          <li><strong>幽门螺杆菌</strong>：辅助四联疗法提高根除率</li>
-        </ul>
-        <div class="evidence-note">研究剂量：≥1亿CFU/天（婴幼儿）</div>
+      <!-- 发酵乳杆菌 CECT5716 -->
+      <div class="strain-table-row" data-tags="女性,免疫">
+        <div class="col-strain">
+          <div class="strain-name">发酵乳杆菌 CECT5716</div>
+          <span class="strain-tag teal">Lactobacillus fermentum CECT5716</span>
+        </div>
+        <div class="col-effect">母乳中天然分离·提升母乳抗体IgA ·降低乳腺炎风险（哺乳期）·婴儿免疫发育支持</div>
+        <div class="col-source">Instituto Halal（西班牙）·益之源(Asperula)</div>
+        <div class="col-product">MamiLab/母乳益生菌制剂</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">哺乳期女性·孕晚期·婴儿免疫</div>
       </div>
 
-      <div class="strain-card">
-        <h4>凝结芽孢杆菌 BC30</h4>
-        <div class="strain-tags"><span class="strain-tag">Bacillus coagulans BC30</span></div>
-        <p style="font-size:0.85rem;">产芽胞益生菌——天然形成休眠体芽胞，极耐高温和胃酸，无需冷藏。</p>
-        <ul class="list-styled" style="font-size:0.82rem;">
-          <li><strong>消化健康</strong>：改善腹胀、肠道不适</li>
-          <li><strong>免疫调节</strong>：增强流感疫苗应答</li>
-          <li><strong>运动人群</strong>：减少运动后呼吸道感染</li>
-        </ul>
-        <div class="evidence-note">研究剂量：≥10亿CFU/天 | 无需冷藏</div>
+      <!-- 两歧双歧杆菌 B. longum BB536 -->
+      <div class="strain-table-row" data-tags="肠道,免疫,代谢">
+        <div class="col-strain">
+          <div class="strain-name">长双歧杆菌 BB536</div>
+          <span class="strain-tag purple">Bifidobacterium longum BB536</span>
+        </div>
+        <div class="col-effect">改善便秘（老年人群显著）·降低过敏症状 ·辅助降低血氨（肝脏健康）</div>
+        <div class="col-source">Morinaga Milk Industry（日本）</div>
+        <div class="col-product">Morinaga BB536散剂/儿童制剂</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">老年人·过敏人群·便秘者</div>
       </div>
+
+      <!-- 唾液乳杆菌 LS01 -->
+      <div class="strain-table-row" data-tags="情绪,肠道">
+        <div class="col-strain">
+          <div class="strain-name">唾液乳杆菌 LS01</div>
+          <span class="strain-tag teal">Lactobacillus salivarius LS01</span>
+        </div>
+        <div class="col-effect">改善特应性皮炎（成人）·缓解肠易激综合征 ·辅助调节情绪（焦虑/抑郁评分改善）</div>
+        <div class="col-source">VSL Pharmaceuticals（意大利）</div>
+        <div class="col-product">VSL#3（美系处方益生菌）</div>
+        <div class="col-star"><span class="stars">★★★</span></div>
+        <div class="col-crowd">AD患者·IBS·情绪障碍共病患者</div>
+      </div>
+
+    </div><!-- /strain-table-wrap -->
+
+    <div class="strain-table-legend">
+      <span class="stars">★★★</span> 高证据（多项RCT/指南推荐）&nbsp;&nbsp;
+      <span class="stars" style="color:#aaa">★★</span> 中等证据（多项临床研究）&nbsp;&nbsp;
+      <span class="stars" style="color:#aaa">★</span> 初步证据（机制明确/小规模研究）
     </div>
 
-    <div class="evidence-box purple">
+    <div class="evidence-box purple" style="margin-top:1.5rem;">
       <span class="evidence-box-title">菌株的特异性——不是所有乳杆菌都一样</span>
       <p>这一点再怎么强调也不为过：<em>Lactobacillus rhamnosus</em> 包含 GG（肠道/免疫）、GR-1（阴道健康）、E/N（口腔健康）等众多菌株，功能各不相同。选购时一定要核对产品是否标注了完整的属+种+菌株号（如 <em>Bifidobacterium animalis</em> subsp. <em>lactis</em> BB-12），而非模糊的"双歧杆菌"。</p>
     </div>
@@ -989,5 +1241,33 @@
 <div id="footer-placeholder"></div>
 <script src="js/footer.js"></script>
 
+<!-- 菌株速查表筛选 -->
+<script>
+(function() {
+  var btns = document.querySelectorAll('.strain-filter-btn');
+  var rows = document.querySelectorAll('.strain-table-row[data-tags]');
+
+  btns.forEach(function(btn) {
+    btn.addEventListener('click', function() {
+      var filter = btn.getAttribute('data-filter');
+
+      // 按钮激活状态
+      btns.forEach(function(b) { b.classList.remove('active'); });
+      btn.classList.add('active');
+
+      // 行筛选
+      rows.forEach(function(row) {
+        if (filter === 'all') {
+          row.classList.remove('hidden');
+        } else {
+          var tags = row.getAttribute('data-tags') || '';
+          row.classList.toggle('hidden', tags.indexOf(filter) === -1);
+        }
+      });
+    });
+  });
+})();
+</script>
+
 </body>
 </html>