feat(后台): 手机上也能用了——菜单收进左边抽屉，列表一行一张卡，不用再横着滑

- 侧栏手机上不再占一列图标，顶栏左边 ☰ 拉出整张菜单，按返回键先关菜单
- 题目、比赛、用户、公告、题单列表手机上一项一张卡：名字一行、小字一行、按钮一行，
  「学生看得到」开关单独一列靠右
- 卡点分析、AI 报告手机上点开一项整屏看，返回键关掉；年度趋势、自学情况、首页改成上下排
- 出题页、教程编辑、题单编辑、标签、设置手机上排成一列；测试数据「删掉」手机上常驻
- 弹框一律收进屏幕宽度

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/admin/problem/Trend.vue

@@ -150,14 +150,14 @@ onMounted(async () => {
       <n-select
         :value="selected || null"
         :options="gradeOptions"
-        style="width: 100px"
+        class="grade-select"
         @update:value="pickGrade"
       />
       <span class="muted">和</span>
       <n-select
         :value="compare"
         :options="compareOptions"
-        style="width: 170px"
+        class="compare-select"
         @update:value="(value: string) => (compare = value)"
       />
     </div>
@@ -455,6 +455,12 @@ a.c-title:hover .ptitle {
   border-radius: 5px;
   background: var(--worse);
 }
+.grade-select {
+  width: 100px;
+}
+.compare-select {
+  width: 170px;
+}
 .dot-before {
   width: 10px;
   height: 10px;
@@ -462,4 +468,78 @@ a.c-title:hover .ptitle {
   box-sizing: border-box;
   border: 2px solid rgba(128, 128, 128, 0.8);
 }
+
+/* 手机上一道题两行：题名和两个百分比一行，下面一整行是轨道；人数藏掉 */
+@media (max-width: 768px) {
+  .top {
+    flex-wrap: wrap;
+  }
+  .top .title {
+    width: 100%;
+  }
+  .top .grow {
+    display: none;
+  }
+  .grade-select {
+    width: 90px;
+  }
+  .compare-select {
+    flex: 1;
+    width: auto;
+    min-width: 0;
+  }
+  .stats {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+  .stat {
+    padding: 12px 14px;
+  }
+  .value {
+    font-size: 22px;
+  }
+  .row {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) auto auto;
+    column-gap: 10px;
+    row-gap: 4px;
+  }
+  .axis {
+    height: auto;
+    grid-template-columns: minmax(0, 1fr);
+  }
+  .axis .c-title {
+    display: none;
+  }
+  .legend {
+    grid-row: 1;
+    margin-left: 0;
+  }
+  .item {
+    height: auto;
+    padding-top: 8px;
+    padding-bottom: 8px;
+  }
+  .c-title {
+    width: auto;
+  }
+  .c-track {
+    grid-column: 1 / -1;
+    min-width: 0;
+  }
+  .item .c-track {
+    grid-row: 2;
+  }
+  .c-values {
+    grid-row: 1;
+    grid-column: 2;
+    width: auto;
+  }
+  .c-delta {
+    grid-row: 1;
+    grid-column: 3;
+  }
+  .c-users {
+    display: none;
+  }
+}
 </style>