Phase 3: Check my work, follow-ups and turn-into-deck

Check my work (third homework mode)
- One model call with its own system prompt marks the student's own
  attempt: verdict, what's right, each issue with why + fix, and the
  corrected version that keeps everything the student got right.
  Unasked-for extras are never errors. The attempt is typed/pasted
  (photos of handwriting are documented as unsupported) and stored in
  the record so Redo re-checks the same work.
- Server: mode "check" + solution on POST /api/homework (zod, 400
  server.needSolution without one) and the same NDJSON stream; new
  checkHomework() pipeline with repair-once validation.

Follow-ups
- New POST /api/homework/refine (plain JSON, RATE_LIMIT_REFINE, zod,
  auth before body): shorter / more detail / explain, plain text back,
  language preserved.
- Shorter + More detail + Original rewrite the finished answer and the
  corrected version in place (FollowUpBar); every guide step has
  Explain step N differently; failed calls say so without losing text.

Turn into a study deck
- Any result hands its content (answer, corrected version or assembled
  guide) to New deck through a one-shot sessionStorage seed with the
  options step pre-filled.

UI
- Phone step 2 gains the third card: tapping it reveals the solution
  field + submit; desktop has three cards and the solution field shows
  with the mode. Homework history labels and share/card previews cover
  the new mode.

Verified: new phase-3 suite 20/20 against a stub Ollama (check payload,
missing-solution 400, refine validation, phone + desktop check flows,
shorter follow-up with restore, guide explain, deck hand-off) plus
regression 74/74, mobile 52/52, declutter 116/116, wizard 80/80,
animation 8/8, native 35/35, phase1 38/38, phase2 43/43, i18n 25/25.
Key parity 734/734. Lint + build clean. SW freezmo-v27.

components/homework/HomeworkGuide.tsx

@@ -11,6 +11,7 @@ import { assembleSolution } from "@/lib/homework";
 import { useI18n } from "@/lib/i18n";
 import type { HomeworkGuideRecord, HomeworkStep } from "@/lib/schemas";
 import { useWakeLock } from "@/lib/use-wake-lock";
+import { refineHomework } from "@/lib/client-api";
 
 import { CopyButton } from "./CopyButton";
 
@@ -25,12 +26,14 @@ export function HomeworkGuide({
   onClose,
   onAgain,
   onNew,
+  onToDeck,
   againLoading,
 }: {
   record: HomeworkGuideRecord;
   onClose: () => void;
   onAgain: () => void;
   onNew: () => void;
+  onToDeck: () => void;
   againLoading: boolean;
 }) {
   const { t } = useI18n();
@@ -40,8 +43,30 @@ export function HomeworkGuide({
   const slideCount = steps.length + 1; // + the solution slide
   const [index, setIndex] = useState(0);
   const [revealed, setRevealed] = useState<Record<number, number>>({});
+  /** "Explain this step differently" overrides, per step index. */
+  const [explained, setExplained] = useState<Record<number, string>>({});
+  const [explaining, setExplaining] = useState<number | null>(null);
+  const [explainFailed, setExplainFailed] = useState<number | null>(null);
   const scrollRef = useRef<HTMLDivElement>(null);
 
+  const explainStep = async (stepIndex: number) => {
+    if (explaining !== null) return;
+    setExplaining(stepIndex);
+    setExplainFailed(null);
+    try {
+      const next = await refineHomework({
+        instruction: "explain",
+        text: steps[stepIndex].explanation,
+        context: record.sourceText,
+      });
+      setExplained((current) => ({ ...current, [stepIndex]: next }));
+    } catch {
+      setExplainFailed(stepIndex);
+    } finally {
+      setExplaining(null);
+    }
+  };
+
   const goTo = useCallback(
     (target: number) => {
       const container = scrollRef.current;
@@ -164,8 +189,25 @@ export function HomeworkGuide({
               <PromptCard>
                 <QuestionText>{step.title}</QuestionText>
                 <p className="mt-2 text-[15px] leading-relaxed text-frost-700 dark:text-frost-200">
-                  {step.explanation}
+                  {explained[stepIndex] ?? step.explanation}
                 </p>
+                <div className="mt-2 flex flex-wrap items-center gap-2">
+                  <Button
+                    size="sm"
+                    variant="ghost"
+                    className="touch-target"
+                    loading={explaining === stepIndex}
+                    disabled={explaining !== null}
+                    onClick={() => void explainStep(stepIndex)}
+                  >
+                    {t("homework.followup.step", { n: stepIndex + 1 })}
+                  </Button>
+                  {explainFailed === stepIndex ? (
+                    <span className="text-[12px] font-medium text-rose-600 dark:text-rose-300">
+                      {t("homework.followup.failed")}
+                    </span>
+                  ) : null}
+                </div>
               </PromptCard>
 
               {/* progressive hints */}
@@ -242,12 +284,16 @@ export function HomeworkGuide({
             <div className="flex flex-wrap items-start gap-2">
               <CopyButton text={solution} />
               <Button variant="secondary" className="touch-target" onClick={onAgain} loading={againLoading}>
-                {t("homework.result.again")}
+                {t("homework.followup.redo")}
+              </Button>
+              <Button variant="secondary" className="touch-target" onClick={onToDeck}>
+                {t("homework.toDeck")}
               </Button>
               <Button variant="ghost" className="touch-target" onClick={onNew}>
                 {t("homework.result.new")}
               </Button>
             </div>
+            <p className="text-[11.5px] text-[var(--text-subtle)]">{t("homework.toDeckNote")}</p>
           </div>
         </section>
       </div>