fix(手机): 比赛排名表看不出能往右滑；班级 PK 每周图日期字太小；后台题目列表「藏着的」被切掉

- 比赛排名：手机上名字、做对、用时就占满一屏，每题的格子全在屏幕外。列收窄，前一两道题的格子露出来
- 班级 PK：每周人均横轴在手机上是 10px 的「10月12日」，改成 12px 的「10/12」
- 后台题目列表：手机上「全部 / 学生看得到 / 藏着的」换小号按钮，放不下就横着滑

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

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

@@ -96,6 +96,8 @@ const { query, clearQuery } = usePagination<ProblemQuery>({
 })
 
 const counts = ref<{ all: number; visible: number; hidden: number } | null>(null)
+// 手机上后台左边还有一列图标，三个按钮放不下、「藏着的」被切掉：换小号，再不够就横着滑
+const narrow = useMediaQuery("(max-width: 640px)")
 const visibleTabs = computed(() => [
   { value: "" as const, label: "全部", count: counts.value?.all },
   { value: "1" as const, label: "学生看得到", count: counts.value?.visible },
@@ -324,10 +326,11 @@ watch(() => [query.page, query.limit, query.author, query.kind, query.visible],
         <n-text depth="3">出题人</n-text>
         <AuthorSelect v-model:value="query.author" all />
       </n-flex>
-      <n-button-group v-if="!props.contestID">
+      <n-button-group v-if="!props.contestID" class="visible-tabs">
         <n-button
           v-for="tab in visibleTabs"
           :key="tab.value"
+          :size="narrow ? 'small' : 'medium'"
           :type="query.visible === tab.value ? 'primary' : 'default'"
           :secondary="query.visible === tab.value"
           @click="query.visible = tab.value"
@@ -388,6 +391,11 @@ watch(() => [query.page, query.limit, query.author, query.kind, query.visible],
   flex: 1 1 auto;
 }
 
+.visible-tabs {
+  max-width: 100%;
+  overflow-x: auto;
+}
+
 .tab-count {
   margin-left: 6px;
   font-variant-numeric: tabular-nums;