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

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

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

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

public/assets/style.css

@@ -91,6 +91,8 @@ body {
 .brand-text p { margin: 0; font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 
 .summary { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
+.stats { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
+.controls { display: flex; align-items: center; gap: 8px; }
 
 .pill {
   padding: 4px 12px;
@@ -323,9 +325,20 @@ body {
 .demo-chip { padding: 1px 8px; border-radius: 999px; background: var(--pending-bg); color: var(--pending); font-weight: 600; }
 .warn-chip { padding: 1px 8px; border-radius: 999px; background: var(--down-bg); color: var(--down); font-weight: 600; }
 
+/* 窄屏（手机 / 竖屏平板）：顶栏改为三行——标题 / 统计 / 控件，避免挤成一团 */
+@media (max-width: 820px) {
+  .topbar { flex-direction: column; align-items: stretch; gap: 10px; padding: 12px 14px 14px; }
+  .summary { flex-direction: column; align-items: stretch; gap: 8px; }
+  .stats { justify-content: space-between; gap: 4px; }
+  .stat { min-width: 0; flex: 1 1 0; }
+  .stat b { font-size: 15px; }
+  .stat label { font-size: 10px; }
+  .controls { justify-content: flex-end; gap: 10px; }
+  .footer { flex-direction: column; align-items: flex-start; gap: 4px; padding-bottom: 20px; }
+  .footer .version { margin-left: 0; }
+}
+
 @media (max-width: 640px) {
-  .topbar { padding: 10px 14px; }
-  .summary { gap: 6px 12px; }
   .grid { grid-template-columns: 1fr; padding: 12px 14px 8px; }
   .group-tabs { padding: 12px 14px 0; }
   .footer { padding: 8px 14px 24px; }