style(题目): 题目页照设计稿「机房（方案 B）」重排——顶满的两栏、带底色的上下文条、下划线页签、新的结果和题面样式

原来实施时只照了设计文档，没对照设计稿，一路套 Naive 现成的分段页签、提示框、单选组，
功能对了、样子差很多。这次逐块对着设计稿的画板改：

- 两栏顶满内容区，中间一条 1px 分隔线；上下文条、页签行、工具栏下面各一道分隔线
- 上下文条：课堂浅绿、题单浅蓝、比赛浅黄三种底色；‹ › 是不带边框的箭头；比赛的题号是方角、
  做错的是红色 ✕；手机上不摆一排题号，写「这节课 做完 2/5 · 这是第 3 道」配 44px 的箭头
- 「题目 / 结果」是下划线页签，右边「统计 / 点评 / 我的提交」是胶囊按钮
- 抽屉盖住整个左栏（连上下文条、页签行），顶上有自己的「我的提交 / 统计 / 点评」页签，Esc 能关
- 结果页签：三个分段是胶囊，选中的深色实心、带时间（「提交结果 · 10:42」）；标题是圆形图标 +
  大字 + 灰字（「答案错误　在例子 1 上就错了」），不再套整块彩色提示框；答错的对比三栏并排、
  只把不一样的那几个字标红；「题目要求的输出」是一行小字；「让 AI 分析我的代码」是描边按钮；
  答对后的「下一题」是浅绿卡片里 44px 的大按钮
- 工具栏：语言、运行例子（描边）、提交（实心，就叫「提交」）靠左，求助、⋯ 推到最右；
  交对之后「提交」变成绿色描边；协作条换成设计稿的深蓝
- 题面：标题下「简单 · 还没交过」，流程图过关的加「流程图 A 级」；代码要求压成一行；
  小标题不带图标；输入、输出左右两栏；参考流程图是一行可以点开的条；例子表带「例子 1」和「复制」
- 去掉「限时 1 秒」：执行时间、内存对中职学生只会添迷惑（和设计稿不同，用户定的）
- 我的提交：一整块带框的列表，结果用彩色文字；展开的代码先露 5 行；题单锁住的几次合成一行
- 错在隐藏测试点时「去自己输入」给的数跳过例子里出现过的

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

apps/web/src/oj/problem/utils/plainText.ts

@@ -0,0 +1,19 @@
+/**
+ * 把题面里的一段 Markdown 摊成一行纯文字，放进结果页签里那种「题目原话：……」的小字里。
+ * 不是完整的 Markdown 解析：题面用到的就是强调、行内代码、链接、图片、标题、列表、
+ * 公式这几样，去掉记号、留下字就够了。太长的截断，免得一句提示撑满半屏。
+ */
+export function markdownToText(markdown: string, max = 120) {
+  const text = markdown
+    .replace(/```[\s\S]*?```/g, " ")
+    .replace(/!\[[^\]]*\]\([^)]*\)/g, " ")
+    .replace(/\[([^\]]*)\]\([^)]*\)/g, "$1")
+    .replace(/<[^>]+>/g, " ")
+    .replace(/`([^`]*)`/g, "$1")
+    .replace(/\$\$?([^$]*)\$\$?/g, "$1")
+    .replace(/^\s{0,3}(#{1,6}|>|[-*+]|\d+\.)\s+/gm, "")
+    .replace(/(\*\*|__|\*|_|~~)(.+?)\1/g, "$2")
+    .replace(/\s+/g, " ")
+    .trim()
+  return text.length > max ? `${text.slice(0, max)}…` : text
+}