fix: steer delivery renders bare in the transcript — no bubble, no model glue

Three refinements from live testing:

- Steer messages no longer sit inside the user Message container (the
  bubble background + right alignment it gave artifact cards). chat.tsx
  renders SubagentSteerCard directly in the transcript column — full
  width, centered, same register as the teacher's artifacts.
- Research steers render a quiet "Research complete · N sources" badge
  (the dispatch-settled idiom), not the full brief: briefs are long, the
  wake turn weaves them into the lesson anyway, and the full text stays
  persisted in the artifact part — a "view full research" affordance
  can be added later without any protocol change. Failures keep the
  failure card (the brief explains what went wrong).
- The sub-agents' verification notes (visual/demo builder notes) are
  model-facing glue and no longer render on success; failure notes
  remain the error explanation.

SSR-verified against a synthetic record: badge + SVG bare in the
transcript (no is-user wrapper), notes/brief confined to the RSC
payload. 229/229, typecheck, lint, build green.

components/artifacts/demo-card.tsx

@@ -99,10 +99,10 @@ export function DemoOutputCard({ output }: { output: unknown }) {
 			</div>
 		);
 	}
-	return <DemoFrame title={result.title} html={result.html} notes={result.notes} />;
+	return <DemoFrame title={result.title} html={result.html} />;
 }
 
-function DemoFrame({ title, html, notes }: { title: string; html: string; notes?: string }) {
+function DemoFrame({ title, html }: { title: string; html: string }) {
 	const actions = useContext(ChatActionsContext);
 	const iframeRef = useRef<HTMLIFrameElement | null>(null);
 	const [state, setState] = useState<DemoBridgeState>(INITIAL_DEMO_BRIDGE_STATE);
@@ -145,7 +145,6 @@ function DemoFrame({ title, html, notes }: { title: string; html: string; notes?
 				style={{ height: state.height ?? 360 }}
 				data-testid="demo-iframe"
 			/>
-			{notes && <p className="mt-2 text-sm text-muted-foreground">{notes}</p>}
 		</div>
 	);
 }

components/artifacts/steer-card.tsx

@@ -1,6 +1,8 @@
 "use client";
 
-import type { SubagentArtifactData, TeacherUIMessage } from "@/src/core";
+import { CheckIcon } from "lucide-react";
+import type { ResearchResult, SubagentArtifactData, TeacherUIMessage } from "@/src/core";
+import { isSubagentFailure } from "@/src/core";
 import { DemoOutputCard } from "@/components/artifacts/demo-card";
 import { ResearchBriefCard } from "@/components/artifacts/job-card";
 import { VisualOutputCard } from "@/components/artifacts/visual-card";
@@ -10,10 +12,17 @@ import { VisualOutputCard } from "@/components/artifacts/visual-card";
  *
  * When a background job completes, the wake pipeline injects a STEER message
  * into the transcript: a user-role UIMessage whose data part
- * ("data-subagent-artifact") carries the result. It must NEVER render as a
- * learner bubble: the model-facing text part is protocol glue, and the
- * artifact itself renders here, by kind, reusing the same artifact cards
- * the result always used.
+ * ("data-subagent-artifact") carries the result. It renders as an artifact —
+ * NEVER a learner bubble, never wrapped in a message container:
+ *
+ *   research — a quiet "Research complete" badge. The full brief is TOO LONG
+ *     to inline and the teacher's wake turn weaves it into the lesson anyway;
+ *     it stays persisted in the transcript (the artifact part), so a
+ *     "view full research" affordance can be added later. Failures keep the
+ *     failure card (the brief explains what went wrong).
+ *   demo / visual — the artifact itself (sandboxed iframe / sanitized SVG).
+ *     The sub-agent's verification notes are model-facing glue and do NOT
+ *     render; only a failure note does.
  */
 export function SubagentSteerCard({ message }: { message: TeacherUIMessage }) {
 	const artifactPart = message.parts.find((p) => p.type === "data-subagent-artifact");
@@ -27,10 +36,27 @@ export function SubagentSteerCard({ message }: { message: TeacherUIMessage }) {
 	}
 	switch (data.kind) {
 		case "research":
-			return <ResearchBriefCard output={data.result} />;
+			return isSubagentFailure("research", data.result as ResearchResult) ? (
+				<ResearchBriefCard output={data.result} />
+			) : (
+				<ResearchCompleteBadge result={data.result as ResearchResult} />
+			);
 		case "demo":
 			return <DemoOutputCard output={data.result} />;
 		case "visual":
 			return <VisualOutputCard output={data.result} />;
 	}
 }
+
+/** Quiet one-liner, the dispatch-settled idiom: the brief lives in the record,
+ * the lesson lives in the teacher's wake turn — the badge just marks delivery. */
+function ResearchCompleteBadge({ result }: { result: ResearchResult }) {
+	return (
+		<div className="flex items-center gap-2 text-xs text-muted-foreground" data-testid="research-complete-badge">
+			<CheckIcon className="size-3.5" />
+			<span className="font-medium uppercase tracking-wide">Research</span>
+			<span>complete</span>
+			{result.sources.length > 0 && <span>· {result.sources.length} sources</span>}
+		</div>
+	);
+}

components/artifacts/visual-card.tsx

@@ -61,7 +61,6 @@ export function VisualOutputCard({ output }: { output: unknown }) {
 				dangerouslySetInnerHTML={{ __html: sanitizeSvg(result.svg) }}
 				data-testid="visual-svg"
 			/>
-			{result.notes && <p className="mt-2 text-sm text-muted-foreground">{result.notes}</p>}
 		</div>
 	);
 }