fix(mobile): 修移动端顶栏塌陷，窄屏默认卡片视图

问题（用户报告移动端异常）：窄屏下顶栏统计挤成竖排并与标题重叠，
表格在手机上必须横向拖动，固定装饰在小屏上可能溢出或压住内容。

修复：
- 顶栏结构拆为「标题 / 统计(.stats) / 控件(.controls)」三段；
  ≤820px 改为纵向三行，统计均分视口宽度，页脚改纵向堆叠
- ≤700px 且用户未显式选择视图时自动用卡片（横竖屏切换时重算，
  显式选择仍尊重 localStorage）
- ≤820px（及横屏手机）撤掉立绘、公路车、光环水印等固定装饰

验证：
- 390x844 / 360x640 / 414x896 / 844x390 四种视口：0 横向溢出，顶栏三行
- verify-views 新增移动端 7 条断言（22/22 通过）
- 四套合计 81 项全通过（17+22+20+22）

public/index.html

@@ -20,23 +20,27 @@
     </div>
     <div class="summary">
       <span id="overall-pill" class="pill pending">检测中…</span>
-      <div class="stat"><b id="stat-total">–</b><label>监控数</label></div>
-      <div class="stat stat-up"><b id="stat-up">–</b><label>在线</label></div>
-      <div class="stat stat-down"><b id="stat-down">–</b><label>离线</label></div>
-      <div class="stat"><b id="stat-latency">–</b><label>平均延迟</label></div>
-      <div class="stat"><b id="stat-uptime">–</b><label>90天可用率</label></div>
-      <div class="view-switch" id="view-switch" role="group" aria-label="视图切换"></div>
-      <button id="theme-btn" type="button" class="icon-btn" title="切换主题">
-        <svg viewBox="0 0 100 100" aria-hidden="true">
-          <circle cx="50" cy="50" r="31" fill="none" stroke="currentColor" stroke-width="8"/>
-          <circle cx="50" cy="50" r="15" fill="none" stroke="currentColor" stroke-width="4" opacity="0.7"/>
-          <polygon points="46.4,4 53.6,4 51.2,15 48.8,15" fill="currentColor"/>
-          <polygon points="46.4,96 53.6,96 51.2,85 48.8,85" fill="currentColor"/>
-          <polygon points="4,46.4 4,53.6 15,51.2 15,48.8" fill="currentColor"/>
-          <polygon points="96,46.4 96,53.6 85,51.2 85,48.8" fill="currentColor"/>
-        </svg>
-      </button>
-      <button id="refresh-btn" type="button">刷新</button>
+      <div class="stats">
+        <div class="stat"><b id="stat-total">–</b><label>监控数</label></div>
+        <div class="stat stat-up"><b id="stat-up">–</b><label>在线</label></div>
+        <div class="stat stat-down"><b id="stat-down">–</b><label>离线</label></div>
+        <div class="stat"><b id="stat-latency">–</b><label>平均延迟</label></div>
+        <div class="stat"><b id="stat-uptime">–</b><label>90天可用率</label></div>
+      </div>
+      <div class="controls">
+        <div class="view-switch" id="view-switch" role="group" aria-label="视图切换"></div>
+        <button id="theme-btn" type="button" class="icon-btn" title="切换主题">
+          <svg viewBox="0 0 100 100" aria-hidden="true">
+            <circle cx="50" cy="50" r="31" fill="none" stroke="currentColor" stroke-width="8"/>
+            <circle cx="50" cy="50" r="15" fill="none" stroke="currentColor" stroke-width="4" opacity="0.7"/>
+            <polygon points="46.4,4 53.6,4 51.2,15 48.8,15" fill="currentColor"/>
+            <polygon points="46.4,96 53.6,96 51.2,85 48.8,85" fill="currentColor"/>
+            <polygon points="4,46.4 4,53.6 15,51.2 15,48.8" fill="currentColor"/>
+            <polygon points="96,46.4 96,53.6 85,51.2 85,48.8" fill="currentColor"/>
+          </svg>
+        </button>
+        <button id="refresh-btn" type="button">刷新</button>
+      </div>
     </div>
   </header>
 
@@ -52,7 +56,7 @@
     <span id="ur-chip" class="footer-item warn-chip" hidden>UptimeRobot 同步异常</span>
     <span id="updated-at" class="footer-item">–</span>
     <span id="countdown" class="footer-item">–</span>
-    <span class="footer-item version">shiroko-monitor v0.8.0</span>
+    <span class="footer-item version">shiroko-monitor v0.8.1</span>
   </footer>
 
   <script type="module" src="assets/app.js"></script>