@kidsinai/kids-client 0.0.1

package/src/render/ink/components/Header.tsx

@@ -0,0 +1,35 @@
+import React from "react"
+import { Box, Text } from "ink"
+import { getTheme } from "../theme.ts"
+
+interface HeaderProps {
+  packTitle: string | null
+  missionTitle: string | null
+  missionIndex: number | null
+  missionTotal: number | null
+  starsBalance: number
+  starsBudget: number
+}
+
+export function Header({ packTitle, missionTitle, missionIndex, missionTotal, starsBalance, starsBudget }: HeaderProps): React.ReactElement {
+  const theme = getTheme()
+  // Per PRD §3.2 mockup: "Mission 1/3 · 项目设置 + 第一个 HTML 页面 · ⭐ 余 36/40"
+  let left: string
+  if (missionIndex && missionTotal && missionTitle) {
+    left = `Mission ${missionIndex}/${missionTotal} · ${missionTitle}`
+  } else if (packTitle) {
+    left = packTitle
+  } else {
+    left = "Free play"
+  }
+  const stars =
+    starsBudget > 0
+      ? `⭐ ${starsBalance}/${starsBudget}`
+      : `⭐ ${starsBalance}`
+  return (
+    <Box borderStyle="round" borderColor={theme.border} paddingX={1} justifyContent="space-between">
+      <Text color={theme.accent}>{left}</Text>
+      <Text color={theme.stars}>{stars}</Text>
+    </Box>
+  )
+}

package/src/render/ink/components/Input.tsx

@@ -0,0 +1,28 @@
+import React from "react"
+import { Box, Text } from "ink"
+import TextInput from "ink-text-input"
+import { getTheme } from "../theme.ts"
+
+interface InputProps {
+  value: string
+  onChange: (v: string) => void
+  onSubmit: (v: string) => void
+  placeholder: string
+  disabled?: boolean
+}
+
+export function Input({ value, onChange, onSubmit, placeholder, disabled }: InputProps): React.ReactElement {
+  const theme = getTheme()
+  return (
+    <Box borderStyle="single" borderColor={theme.fgDim} paddingX={1}>
+      <Text color={theme.kid}>💬 </Text>
+      {disabled ? (
+        <Text color={theme.fgDim} dimColor>
+          {value || placeholder}
+        </Text>
+      ) : (
+        <TextInput value={value} onChange={onChange} onSubmit={onSubmit} placeholder={placeholder} />
+      )}
+    </Box>
+  )
+}

package/src/render/ink/components/KeyHints.tsx

@@ -0,0 +1,21 @@
+import React from "react"
+import { Box, Text } from "ink"
+import { getTheme } from "../theme.ts"
+
+interface KeyHintsProps {
+  hints: Array<{ key: string; label: string }>
+}
+
+export function KeyHints({ hints }: KeyHintsProps): React.ReactElement {
+  const theme = getTheme()
+  return (
+    <Box paddingX={1}>
+      {hints.map((h, i) => (
+        <Box key={h.key} marginRight={i < hints.length - 1 ? 2 : 0}>
+          <Text color={theme.accent}>[{h.key}]</Text>
+          <Text color={theme.fg}> {h.label}</Text>
+        </Box>
+      ))}
+    </Box>
+  )
+}

package/src/render/ink/components/Thinking.tsx

@@ -0,0 +1,21 @@
+import React from "react"
+import { Box, Text } from "ink"
+import Spinner from "ink-spinner"
+import { getTheme } from "../theme.ts"
+
+interface ThinkingProps {
+  locale: "zh-Hans" | "en"
+}
+
+export function Thinking({ locale }: ThinkingProps): React.ReactElement {
+  const theme = getTheme()
+  const label = locale === "zh-Hans" ? "AI 老师在想…" : "Your AI teacher is thinking…"
+  return (
+    <Box>
+      <Text color={theme.agent}>
+        <Spinner type="dots" />
+      </Text>
+      <Text color={theme.agent}> {label}</Text>
+    </Box>
+  )
+}

package/src/render/ink/components/Toast.tsx

@@ -0,0 +1,29 @@
+/**
+ * Transient toast renderer for non-blocking feedback. Used for "已停止"
+ * after Esc abort, "上下文压缩中" during compaction, etc.
+ *
+ * The store holds the toast; App.tsx overlays it as the last row of the
+ * mission screen.
+ */
+
+import React from "react"
+import { Box, Text } from "ink"
+import { getTheme } from "../theme.ts"
+
+export interface ToastState {
+  kind: "info" | "warn" | "success"
+  text: string
+}
+
+export function Toast({ toast }: { toast: ToastState }): React.ReactElement {
+  const theme = getTheme()
+  const color = toast.kind === "warn" ? theme.warn : toast.kind === "success" ? theme.success : theme.accent
+  const icon = toast.kind === "warn" ? "⚠️" : toast.kind === "success" ? "✓" : "ℹ"
+  return (
+    <Box paddingX={1}>
+      <Text color={color}>
+        {icon} {toast.text}
+      </Text>
+    </Box>
+  )
+}

package/src/render/ink/screens/CoursePackPicker.tsx

@@ -0,0 +1,90 @@
+/**
+ * §3.1 [c] option — list installed Course Packs and let the kid pick one.
+ * On selection, the parent transitions to MissionScreen with that pack
+ * loaded.
+ *
+ * Up / Down to move, Enter to select, Esc to go back.
+ */
+
+import React, { useState } from "react"
+import { Box, Text, useInput } from "ink"
+import { getTheme } from "../theme.ts"
+import type { InstalledPack } from "../../../core/course-pack.ts"
+
+interface CoursePackPickerProps {
+  locale: "zh-Hans" | "en"
+  packs: InstalledPack[]
+  onPick: (packId: string) => void
+  onBack: () => void
+}
+
+export function CoursePackPicker({ locale, packs, onPick, onBack }: CoursePackPickerProps): React.ReactElement {
+  const theme = getTheme()
+  const [idx, setIdx] = useState(0)
+  useInput((_, key) => {
+    if (key.escape) onBack()
+    else if (key.upArrow) setIdx((i) => Math.max(0, i - 1))
+    else if (key.downArrow) setIdx((i) => Math.min(packs.length - 1, i + 1))
+    else if (key.return && packs[idx]) onPick(packs[idx]!.id)
+  })
+  const t = STRINGS[locale]
+  if (packs.length === 0) {
+    return (
+      <Box flexDirection="column" borderStyle="round" borderColor={theme.warn} paddingX={2} paddingY={1}>
+        <Text color={theme.warn} bold>{t.empty}</Text>
+        <Box marginTop={1}>
+          <Text color={theme.fgDim}>{t.emptyHint}</Text>
+        </Box>
+        <Box marginTop={1}>
+          <Text color={theme.accent}>{t.backHint}</Text>
+        </Box>
+      </Box>
+    )
+  }
+  return (
+    <Box flexDirection="column" borderStyle="round" borderColor={theme.accent} paddingX={2} paddingY={1}>
+      <Text color={theme.accent} bold>{t.title}</Text>
+      <Box marginTop={1} flexDirection="column">
+        {packs.map((p, i) => {
+          const active = i === idx
+          return (
+            <Box key={p.id} marginBottom={i === packs.length - 1 ? 0 : 0}>
+              <Text color={active ? theme.kid : theme.fg}>{active ? "▶ " : "  "}</Text>
+              <Box flexDirection="column" flexGrow={1}>
+                <Text color={active ? theme.accent : theme.fg} bold={active}>{p.title}</Text>
+                {p.shortDescription && (
+                  <Text color={theme.fgDim} dimColor={!active}>  {p.shortDescription}</Text>
+                )}
+                <Text color={theme.fgDim} dimColor>  {t.meta(p.missionCount, p.starsBudget)}</Text>
+              </Box>
+            </Box>
+          )
+        })}
+      </Box>
+      <Box marginTop={1}>
+        <Text color={theme.accent}>{t.hints}</Text>
+      </Box>
+    </Box>
+  )
+}
+
+const STRINGS = {
+  "zh-Hans": {
+    title: "选一个 Course Pack",
+    empty: "还没装任何 Course Pack",
+    emptyHint: "Course Pack 是 Airbotix 老师做的引导式项目。请家长重新装 kids-opencode 把它带回来。",
+    backHint: "[Esc / Enter] 返回",
+    hints: "[↑↓] 选 · [Enter] 确认 · [Esc] 返回",
+    meta: (missions: number, stars: number) =>
+      stars > 0 ? `${missions} 个 Mission · 预算 ${stars}⭐` : `${missions} 个 Mission`,
+  },
+  en: {
+    title: "Pick a Course Pack",
+    empty: "No Course Packs installed yet",
+    emptyHint: "Course Packs are guided projects from Airbotix. Ask a grown-up to reinstall kids-opencode.",
+    backHint: "[Esc / Enter] Back",
+    hints: "[↑↓] move · [Enter] choose · [Esc] back",
+    meta: (missions: number, stars: number) =>
+      stars > 0 ? `${missions} missions · budget ${stars}⭐` : `${missions} missions`,
+  },
+} as const

package/src/render/ink/screens/DangerousTopicModal.tsx

@@ -0,0 +1,63 @@
+/**
+ * Hard overlay shown when the kid types or the AI emits content matching
+ * one of the patterns in kids-tui-plugin/src/dangerous-topic.ts. Blocks
+ * chat until kid presses Enter to acknowledge.
+ *
+ * The point isn't to be punitive — it's to make sure the Kids Helpline
+ * number is on-screen at the moment a kid might need it.
+ */
+
+import React from "react"
+import { Box, Text, useInput } from "ink"
+import { getTheme } from "../theme.ts"
+import type { DangerousTopic } from "../../../core/store.ts"
+
+interface DangerousTopicModalProps {
+  topic: DangerousTopic
+  locale: "zh-Hans" | "en"
+  onAcknowledge: () => void
+}
+
+export function DangerousTopicModal({ locale, onAcknowledge }: DangerousTopicModalProps): React.ReactElement {
+  const theme = getTheme()
+  useInput((_, key) => {
+    if (key.return) onAcknowledge()
+  })
+  const t = STRINGS[locale]
+  return (
+    <Box flexDirection="column" borderStyle="double" borderColor={theme.danger} paddingX={2} paddingY={1}>
+      <Text color={theme.danger} bold>
+        {t.title}
+      </Text>
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.fg}>{t.body1}</Text>
+        <Text color={theme.fg}>{t.body2}</Text>
+      </Box>
+      <Box marginTop={1}>
+        <Text color={theme.warn} bold>
+          {t.helpline}
+        </Text>
+      </Box>
+      <Box marginTop={1}>
+        <Text color={theme.fgDim}>{t.dismiss}</Text>
+      </Box>
+    </Box>
+  )
+}
+
+const STRINGS = {
+  "zh-Hans": {
+    title: "想跟你说一件重要的事",
+    body1: "AI 不是真人，没办法帮你处理特别难受或者特别紧急的事。",
+    body2: "请马上找你信任的大人（家长、老师、亲戚），或者拨打求助热线。",
+    helpline: "Kids Helpline 澳大利亚 1800 55 1800（免费 24 小时）",
+    dismiss: "[Enter] 我知道了",
+  },
+  en: {
+    title: "Something important to tell you",
+    body1: "I'm an AI, not a person. I'm not the right help for something hard or urgent.",
+    body2: "Please tell an adult you trust right now (a parent, teacher, or relative), or call the helpline below.",
+    helpline: "Kids Helpline AU 1800 55 1800 — free, 24/7",
+    dismiss: "[Enter] I understand",
+  },
+} as const

package/src/render/ink/screens/ErrorScreen.tsx

@@ -0,0 +1,133 @@
+/**
+ * Friendly error screens — 6 variants per PRD §3.4 / plan Day 9.
+ *
+ * Variants:
+ *   serve_unreachable | network_down | stars_exhausted |
+ *   auth_failed       | config_missing | ai_hung
+ *
+ * Each variant has a short title + a one-sentence action + an optional
+ * recovery key hint. Detail text (technical) is shown dimmed in case
+ * a parent / engineer needs to debug.
+ */
+
+import React from "react"
+import { Box, Text, useInput } from "ink"
+import { getTheme } from "../theme.ts"
+import type { ErrorVariant } from "../../../core/store.ts"
+
+interface ErrorScreenProps {
+  variant: ErrorVariant
+  locale: "zh-Hans" | "en"
+  detail?: string
+  onRetry?: () => void
+  onQuit?: () => void
+}
+
+export function ErrorScreen({ variant, locale, detail, onRetry, onQuit }: ErrorScreenProps): React.ReactElement {
+  const theme = getTheme()
+  useInput((input, key) => {
+    if (key.return && onRetry) onRetry()
+    else if (input === "q" && onQuit) onQuit()
+  })
+  const t = STRINGS[locale][variant]
+  return (
+    <Box flexDirection="column" borderStyle="round" borderColor={theme.danger} paddingX={2} paddingY={1}>
+      <Text color={theme.danger} bold>
+        {t.title}
+      </Text>
+      <Box marginTop={1}>
+        <Text color={theme.fg}>{t.body}</Text>
+      </Box>
+      {detail && (
+        <Box marginTop={1}>
+          <Text color={theme.fgDim} dimColor>
+            {detail}
+          </Text>
+        </Box>
+      )}
+      <Box marginTop={1}>
+        {onRetry && (
+          <Box marginRight={2}>
+            <Text color={theme.accent}>[Enter]</Text>
+            <Text color={theme.fg}> {t.retry}</Text>
+          </Box>
+        )}
+        {onQuit && (
+          <Box>
+            <Text color={theme.accent}>[q]</Text>
+            <Text color={theme.fg}> {STRINGS[locale].quit}</Text>
+          </Box>
+        )}
+      </Box>
+    </Box>
+  )
+}
+
+const STRINGS = {
+  "zh-Hans": {
+    quit: "退出",
+    serve_unreachable: {
+      title: "AI 老师还没起来",
+      body: "后台 AI 服务好像没启动。要不要再试一次？",
+      retry: "重试",
+    },
+    network_down: {
+      title: "网络有点问题",
+      body: "我没办法连上 AI。等会儿再来，或者问家长检查网络。",
+      retry: "重试",
+    },
+    stars_exhausted: {
+      title: "今天的 ⭐ 用完了",
+      body: "明天再来，或者请家长在 airbotix.ai/portal/wallet 充值。",
+      retry: "重试",
+    },
+    auth_failed: {
+      title: "AI 老师认不出你",
+      body: "请家长重新跑一下 `kids-opencode register`。",
+      retry: "重试",
+    },
+    config_missing: {
+      title: "配置丢了",
+      body: "重新装一下 kids-opencode 就好。",
+      retry: "重试",
+    },
+    ai_hung: {
+      title: "AI 老师好像睡着了",
+      body: "30 秒没回应。按 Enter 重来一遍。",
+      retry: "重试",
+    },
+  },
+  en: {
+    quit: "Quit",
+    serve_unreachable: {
+      title: "AI teacher didn't start",
+      body: "The background AI service isn't running. Try again?",
+      retry: "Retry",
+    },
+    network_down: {
+      title: "Network trouble",
+      body: "I can't reach the AI. Try later, or ask an adult to check the connection.",
+      retry: "Retry",
+    },
+    stars_exhausted: {
+      title: "Out of ⭐ for today",
+      body: "Come back tomorrow, or ask a parent to top up at airbotix.ai/portal/wallet.",
+      retry: "Retry",
+    },
+    auth_failed: {
+      title: "AI doesn't recognise you",
+      body: "Ask a parent to run `kids-opencode register` again.",
+      retry: "Retry",
+    },
+    config_missing: {
+      title: "Config is missing",
+      body: "Reinstall kids-opencode to fix this.",
+      retry: "Retry",
+    },
+    ai_hung: {
+      title: "AI seems to be asleep",
+      body: "30 seconds without a reply. Press Enter to try again.",
+      retry: "Retry",
+    },
+  },
+} as const

package/src/render/ink/screens/HelpScreen.tsx

@@ -0,0 +1,96 @@
+/**
+ * Kid-friendly help. Reached via [h] on the Startup screen, or [?] from
+ * inside MissionScreen later.
+ *
+ * Year-6 reading level; key bindings spelled in plain language; emergency
+ * helpline pinned.
+ */
+
+import React from "react"
+import { Box, Text, useInput } from "ink"
+import { getTheme } from "../theme.ts"
+
+interface HelpScreenProps {
+  locale: "zh-Hans" | "en"
+  onBack: () => void
+}
+
+export function HelpScreen({ locale, onBack }: HelpScreenProps): React.ReactElement {
+  const theme = getTheme()
+  useInput((input, key) => {
+    if (key.escape || key.return || input === "b" || input === "q") onBack()
+  })
+  const t = STRINGS[locale]
+  return (
+    <Box flexDirection="column" borderStyle="round" borderColor={theme.accent} paddingX={2} paddingY={1}>
+      <Text color={theme.accent} bold>{t.title}</Text>
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.fg}>{t.intro1}</Text>
+        <Text color={theme.fg}>{t.intro2}</Text>
+      </Box>
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.warn} bold>{t.howAsk}</Text>
+        <Text color={theme.fg}>{t.how1}</Text>
+        <Text color={theme.fg}>{t.how2}</Text>
+        <Text color={theme.fg}>{t.how3}</Text>
+      </Box>
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.warn} bold>{t.keys}</Text>
+        {t.keymap.map((line, i) => (
+          <Text key={i} color={theme.fg}>{line}</Text>
+        ))}
+      </Box>
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.warn} bold>{t.safetyTitle}</Text>
+        <Text color={theme.fg}>{t.safety1}</Text>
+        <Text color={theme.danger}>{t.helpline}</Text>
+      </Box>
+      <Box marginTop={1}>
+        <Text color={theme.accent}>{t.backHint}</Text>
+      </Box>
+    </Box>
+  )
+}
+
+const STRINGS = {
+  "zh-Hans": {
+    title: "怎么用 Kids OpenCode",
+    intro1: "我是你的 AI 老师，可以帮你一起做编程项目。",
+    intro2: "你告诉我你想做什么，我会一步一步引导你做出来。",
+    howAsk: "怎么跟我说话",
+    how1: "· 直接打字。中文英文都行。",
+    how2: "· 想做完一关时打 /check 或者「我做完了」，我就帮你验收。",
+    how3: "· 我每次要动你电脑上的东西前都会问你，按 y 同意。",
+    keys: "按键提示",
+    keymap: [
+      "· Enter   送出消息",
+      "· y / n / e   答 AI 的请求（同意 / 不要 / 我自己来）",
+      "· Esc   AI 在说话时按一下可以打断它",
+      "· Ctrl+C   完全退出（serve 也会停）",
+    ],
+    safetyTitle: "安全",
+    safety1: "我不是真人，有时候会答错。遇到不懂的，问家长或老师。",
+    helpline: "澳大利亚紧急求助：Kids Helpline 1800 55 1800",
+    backHint: "[Enter / Esc / b] 回上一页",
+  },
+  en: {
+    title: "How to use Kids OpenCode",
+    intro1: "I'm your AI teacher. I can help you build coding projects.",
+    intro2: "You tell me what you want to make, and I'll walk you through it step by step.",
+    howAsk: "How to talk to me",
+    how1: "· Just type. English or Chinese both work.",
+    how2: "· When you think you're done, type /check or 'I'm done' and I'll check your work.",
+    how3: "· Before I touch anything on your computer I'll ask. Press y to allow.",
+    keys: "Keys",
+    keymap: [
+      "· Enter    Send a message",
+      "· y / n / e   Reply to my requests (allow / stop / I'll do it)",
+      "· Esc      Stop me while I'm talking",
+      "· Ctrl+C   Quit (serve stops too)",
+    ],
+    safetyTitle: "Safety",
+    safety1: "I'm not a real person and I can be wrong. Ask a parent or teacher if you're unsure.",
+    helpline: "Australia emergency help: Kids Helpline 1800 55 1800",
+    backHint: "[Enter / Esc / b] Back",
+  },
+} as const

package/src/render/ink/screens/LoadingScreen.tsx

@@ -0,0 +1,33 @@
+/**
+ * Visible during ServeManager.ensureReady() (~1-5s window depending on
+ * whether opencode serve is already running). Without this, the kid sees
+ * a black terminal while the wrapper polls /app.
+ */
+
+import React from "react"
+import { Box, Text } from "ink"
+import Spinner from "ink-spinner"
+import { getTheme } from "../theme.ts"
+
+interface LoadingScreenProps {
+  locale: "zh-Hans" | "en"
+  message?: string
+}
+
+export function LoadingScreen({ locale, message }: LoadingScreenProps): React.ReactElement {
+  const theme = getTheme()
+  const label = message ?? (locale === "zh-Hans" ? "AI 老师正在准备…" : "Your AI teacher is getting ready…")
+  return (
+    <Box flexDirection="column" paddingY={1} paddingX={2}>
+      <Box>
+        <Text color={theme.accent}>
+          <Spinner type="dots" />
+        </Text>
+        <Text color={theme.accent}> {label}</Text>
+      </Box>
+      <Box marginTop={1}>
+        <Text color={theme.fgDim}>{locale === "zh-Hans" ? "几秒后就好" : "Just a few seconds"}</Text>
+      </Box>
+    </Box>
+  )
+}

package/src/render/ink/screens/MissionCompleteScreen.tsx

@@ -0,0 +1,112 @@
+/**
+ * PRD §3.3 "Mission 完成有 ASCII 烟花". Renders when the in-TUI check
+ * runner reports `ok: true`. Includes the friendly completion message
+ * from the pack's acceptance.yml and a celebration animation.
+ *
+ * Esc / Enter to return to the Mission screen (for free play after) or
+ * pick the next Mission.
+ */
+
+import React from "react"
+import { Box, Text, useInput } from "ink"
+import { getTheme } from "../theme.ts"
+
+interface MissionCompleteScreenProps {
+  locale: "zh-Hans" | "en"
+  missionId: string
+  missionTitle: string | null
+  passed: number
+  total: number
+  completionMessage: string
+  hasNextMission: boolean
+  onNext: () => void
+  onBack: () => void
+}
+
+export function MissionCompleteScreen({
+  locale,
+  missionId,
+  missionTitle,
+  passed,
+  total,
+  completionMessage,
+  hasNextMission,
+  onNext,
+  onBack,
+}: MissionCompleteScreenProps): React.ReactElement {
+  const theme = getTheme()
+  useInput((input, key) => {
+    if (key.return && hasNextMission) onNext()
+    else if (key.escape || input === "b" || input === "q") onBack()
+    else if (input === "n" && hasNextMission) onNext()
+  })
+  const t = STRINGS[locale]
+  return (
+    <Box flexDirection="column" borderStyle="double" borderColor={theme.success} paddingX={2} paddingY={1}>
+      <Box flexDirection="column">
+        {FIREWORKS.map((line, i) => (
+          <Text key={i} color={pickColor(theme, i)}>{line}</Text>
+        ))}
+      </Box>
+      <Box marginTop={1}>
+        <Text color={theme.success} bold>
+          {t.headline}
+        </Text>
+      </Box>
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.fg}>{t.detail(missionTitle ?? missionId, passed, total)}</Text>
+        <Text color={theme.fgDim}>{completionMessage}</Text>
+      </Box>
+      <Box marginTop={1}>
+        {hasNextMission ? (
+          <>
+            <Box marginRight={2}>
+              <Text color={theme.accent}>[Enter / n]</Text>
+              <Text color={theme.fg}> {t.next}</Text>
+            </Box>
+            <Box>
+              <Text color={theme.accent}>[Esc / b]</Text>
+              <Text color={theme.fg}> {t.back}</Text>
+            </Box>
+          </>
+        ) : (
+          <Box>
+            <Text color={theme.accent}>[Enter / Esc]</Text>
+            <Text color={theme.fg}> {t.back}</Text>
+          </Box>
+        )}
+      </Box>
+    </Box>
+  )
+}
+
+const FIREWORKS = [
+  "        *       .      *",
+  "    .      *      .    *",
+  "  *    .       *    .   ",
+  "      🎆   🎉   🎆      ",
+  "  .    *       .    *   ",
+  "    *      .      *    .",
+]
+
+function pickColor(theme: ReturnType<typeof getTheme>, i: number): string {
+  const palette = [theme.accent, theme.success, theme.stars, theme.kid, theme.agent]
+  return palette[i % palette.length] ?? theme.fg
+}
+
+const STRINGS = {
+  "zh-Hans": {
+    headline: "Mission 完成！",
+    detail: (title: string, p: number, t: number) =>
+      `「${title}」 · ${p}/${t} 项检查全部通过 ✓`,
+    next: "下一个 Mission",
+    back: "回到项目",
+  },
+  en: {
+    headline: "Mission complete!",
+    detail: (title: string, p: number, t: number) =>
+      `"${title}" · ${p}/${t} checks passed ✓`,
+    next: "Next Mission",
+    back: "Back to project",
+  },
+} as const