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

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

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

apps/web/src/admin/learn/index.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { Icon } from "@iconify/vue"
+import { useThemeVars } from "naive-ui"
 import type { LearnBoard, LearnBoardStudent, LearnExerciseProgress } from "utils/types"
 import { getLearnBoard, getLearnExercises } from "admin/api"
 import { parseTime, readableDuration } from "utils/functions"
@@ -18,6 +19,7 @@ import ExerciseAttempts from "./ExerciseAttempts.vue"
  * 不选班就按排名页同一套规则猜老师在教哪个班。
  */
 const configStore = useConfigStore()
+const theme = useThemeVars()
 
 const KIND: Record<string, string> = {
   mcq: "选择",
@@ -148,7 +150,7 @@ onMounted(load)
         :options="classOptions"
         filterable
         placeholder="选班级"
-        style="width: 170px"
+        class="class-select"
       />
     </div>
 
@@ -257,7 +259,7 @@ onMounted(load)
                 v-model:value="lessonId"
                 :options="lessonOptions"
                 size="small"
-                style="width: 170px"
+                class="lesson-select"
               />
             </div>
             <div v-if="!lessonExercises.length" class="muted none">这课没有练一练</div>
@@ -595,4 +597,63 @@ onMounted(load)
 .flag {
   color: var(--learn-orange-text);
 }
+.class-select,
+.lesson-select {
+  width: 170px;
+}
+
+/* 手机上：方块格在自己的框里横着滑（名字列钉在左边），练一练排到下面 */
+@media (max-width: 768px) {
+  .top {
+    flex-wrap: wrap;
+  }
+  .top .title {
+    width: 100%;
+  }
+  .top .grow {
+    display: none;
+  }
+  .class-select {
+    flex: 1;
+    width: auto;
+    min-width: 0;
+  }
+  .stats {
+    gap: 8px;
+    margin-bottom: 12px;
+  }
+  .stat {
+    padding: 10px 12px;
+  }
+  .stat-label {
+    font-size: 12px;
+  }
+  .stat-value {
+    font-size: 18px;
+  }
+  .unit {
+    font-size: 13px;
+  }
+  .main {
+    flex-direction: column;
+    align-items: stretch;
+  }
+  .c-name {
+    position: sticky;
+    left: 0;
+    z-index: 1;
+    width: 96px;
+    margin-left: -16px;
+    padding-left: 16px;
+    background: v-bind("theme.bodyColor");
+  }
+  .side {
+    width: auto;
+  }
+  .lesson-select {
+    flex: 1;
+    width: auto;
+    min-width: 0;
+  }
+}
 </style>