ui: the unified ThinkingBlock — one visual language for the learner's thinking

Owner round (2026-10-05): the same act (a human thinking in text) had two
visual languages — the quiz cards' quote block vs the practice container
with a collapsing chevron and raw pre-wrap text that read oversized.

- components/thinking-block.tsx: the quiz quote-block recipe verbatim
  (rail + uppercase label + lh-prose at foreground/90) carried by a
  faint user-side shell — ml-auto, max-w-[95%] mirroring the user
  bubble's geometry, px-4/py-3 rhythm. Never collapsible. Rails reuse
  the existing vocabulary: primary = committed register, muted =
  working register.
- ThinkingCard becomes the practice adapter: 'Your solution' (primary)
  / 'Your thinking' (muted) — one component, two registers.
- The reading channel LIFTS out of the answered card: chronologically
  prior to the question, it renders above it as its own user-side
  block under the plain 'Your thinking' label; the in-card inset and
  the 'while reading' phrasing are gone.
- lh-card-enter (globals.css): the one-shot 150ms fade+rise mount,
  the app's motion register; honors reduced-motion.

components/thinking-block.tsx

@@ -0,0 +1,46 @@
+"use client";
+
+import { cn } from "@/lib/utils";
+
+/** The unified user-thinking block (owner round, 2026-10-05): ONE visual
+ *  language for every surface where the learner's own thinking renders —
+ *  practice thinking traces (nudge / commit), the reading channel lifted
+ *  above the answered card. The recipe is the quiz cards' quote block
+ *  verbatim (rail + uppercase label + prose), carried by a faint shell
+ *  so it still reads user-side at a glance — right-aligned, message
+ *  width, never collapsible (they arrive open; collapsing bought
+ *  nothing and cost the chevron-on-the-right weirdness).
+ *
+ *  Rails reuse the existing vocabulary: primary for the committed
+ *  register (the quiz answer thinking, practice commits), muted for the
+ *  working register (nudges, reading thoughts). */
+
+export function ThinkingBlock({
+	label,
+	text,
+	rail = "muted",
+	testId,
+	dataCommit,
+}: {
+	label: string;
+	text: string;
+	rail?: "primary" | "muted";
+	testId?: string;
+	/** The practice marker's register flag (commit vs nudge). */
+	dataCommit?: boolean;
+}) {
+	return (
+		<div
+			data-testid={testId}
+			data-commit={dataCommit === undefined ? undefined : dataCommit ? "true" : "false"}
+			className="lh-card-enter ml-auto max-w-[95%] rounded-2xl border border-border/60 bg-muted/40 px-4 py-3"
+		>
+			<div className={cn("border-l-2 pl-3", rail === "primary" ? "border-primary/40" : "border-muted-foreground/30")}>
+				<span className="mb-0.5 block text-xs font-medium uppercase tracking-wide text-muted-foreground">
+					{label}
+				</span>
+				<span className="lh-prose block whitespace-pre-wrap text-foreground/90">{text}</span>
+			</div>
+		</div>
+	);
+}