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

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

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

apps/web/src/oj/class/components/PkDuel.vue

@@ -80,7 +80,8 @@ const shownRows = computed(() =>
 const weeks = computed(() => {
   const from = Math.max(0, props.pk.weeks.length - 8)
   const list = props.pk.weeks.slice(from).map((week, k) => ({
-    label: parseTime(week, "M月D日"),
+    // 手机上八根柱挤在一行，「10月12日」只能用 10px 才放得下，太小；改短写法换大一号字
+    label: parseTime(week, props.compact ? "M/D" : "M月D日"),
     values: [left.value.weekly[from + k] ?? 0, right.value.weekly[from + k] ?? 0],
   }))
   const max = Math.max(1, ...list.flatMap((week) => week.values))
@@ -779,6 +780,6 @@ const tab = ref<"weekly" | "dist">("weekly")
 }
 
 .compact .axis {
-  font-size: 10px;
+  font-size: 12px;
 }
 </style>

apps/web/src/oj/contest/pages/rank.vue

@@ -97,10 +97,16 @@ const meBackground = computed(
     `linear-gradient(${success.value.background}, ${success.value.background}), ${theme.value.cardColor}`,
 )
 const danger = computed(() => tone("error"))
-const columns = computed(
-  () =>
-    `40px ${running.value ? "36px " : ""}170px 48px 80px repeat(${problems.value.length}, 64px)`,
-)
+// 手机上照桌面的列宽，名字 + 做对 + 用时就占满一屏，每题的格子全在屏幕外，看不出能往右滑。
+// 收窄到第一两道题的格子露出半截
+const narrow = useMediaQuery("(max-width: 640px)")
+const columns = computed(() => {
+  const move = running.value ? "36px " : ""
+  const count = problems.value.length
+  return narrow.value
+    ? `28px ${move}112px 36px 70px repeat(${count}, 52px)`
+    : `40px ${move}170px 48px 80px repeat(${count}, 64px)`
+})
 </script>
 
 <template>