refactor(header): 断点阶梯升级为 clamp 流式自适应（用户设计诉求）

- 430/370 两档阶梯替换为 clamp() 连续收缩（字号/间距/图标钮随视口
  线性插值）——任意宽度合身，不再逐档打补丁
- <350px 超窄兜底：导航内滚（scrollbar 隐藏）代替页面晃动——页面级
  scrollWidth 恒等视口，任何机型不破版
- 设计哲学入档：布局层早已流式（auto-fill/容器查询），正文排版断点
  是可读性台阶（有意），Header 是最后的固定像素残留——本次归流

验证: 密集扫描 44 检 × 11 宽度档（320-768）全过；E2E 30/30 PASS

Spec: 2026-10-25_add-blog-5c

Co-authored-by: GLM-5.3

src/components/Header.astro

@@ -124,18 +124,20 @@ const switchLabel = curLocale === 'zh' ? 'EN' : '中';
   }
   /* 移动端审计 B1：7 项一行在 390px 溢出 50-88px（主题钮被推出屏）——
      更窄一档整体收紧，估算总宽 ~344px < 360 */
-  @media (max-width: 430px) {
-    .brand { font-size: 16px; }
-    .nav-link { font-size: 12.5px; padding-inline: 3px; }
-    nav ul { gap: 2px; }
-    .header-inner { gap: 6px; padding-inline: 10px; }
-    /* 图标钮在此密度下 32px（WCAG 24px 下限之上，44 标准的密度妥协） */
-    .header-inner .tap { min-width: 32px; min-height: 32px; }
-    .nav-lang { font-size: 12px; padding-inline: 2px; }
-  }
-  @media (max-width: 370px) {
-    /* en "Open Source" 长词最后 4px：再收字距 */
-    .nav-link { font-size: 12px; padding-inline: 2px; }
-    .brand { letter-spacing: 0; }
+  /* 流式自适应（用户设计诉求）：440→360px 区间字号/间距/图标钮连续收缩
+     （clamp = min~max 随视口线性插值），替代阶梯断点——任何宽度都合身，
+     不再需要逐档补丁；触控目标同步流式但下限钉 28px（WCAG 24 之上） */
+  .header-inner { gap: clamp(6px, 1.6vw, 12px); padding-inline: clamp(10px, 3vw, 20px); }
+  .brand { font-size: clamp(15px, 4vw, 18px); }
+  .nav-link { font-size: clamp(12px, 3.2vw, 14px); padding-inline: clamp(2px, 1vw, 8px); }
+  nav ul { gap: clamp(2px, 0.8vw, 8px); }
+  .header-inner .tap { min-width: clamp(28px, 8vw, 44px); min-height: clamp(28px, 8vw, 44px); }
+  .nav-lang { font-size: clamp(11.5px, 3vw, 13px); }
+  /* 超窄兜底（<350px，en 长词流式下限后仍溢）：导航内滚代替页面晃动——
+     页面级 scrollWidth 恒等于视口，任何机型不破版 */
+  @media (max-width: 350px) {
+    nav ul { overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
+    nav { min-width: 0; }
+    .header-inner { flex-wrap: nowrap; }
   }
 </style>