fix: clarify reasoning progress and loading feedback

tests/ui/scenario-form.test.jsx

@@ -920,7 +920,7 @@ describe("ReasoningWorkspace UI", () => {
     expect(html).toContain("What denominator is being used for the complaint rate?");
   });
 
-  it("shows progress summary with resolved and remaining counts", () => {
+  it("shows reasoning progress with plain language instead of unexplained count", () => {
     const html = renderToStaticMarkup(
       <ReasoningWorkspace
         {...makeWorkspaceProps({
@@ -934,8 +934,44 @@ describe("ReasoningWorkspace UI", () => {
       />,
     );
 
-    expect(html).toContain("resolved");
-    expect(html).toContain("remaining");
+    expect(html).toContain("Reasoning progress");
+    expect(html).not.toContain("3 remaining");
+  });
+
+  it("explains areas that still need investigation in the progress card", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace {...makeWorkspaceProps()} />,
+    );
+
+    // With one remaining unknown, plural "areas" or singular "area" should not appear as a bare count
+    expect(html).not.toContain("unknown nodes");
+    expect(html).not.toContain("unresolved nodes");
+  });
+
+  it("shows active unknown in plain language within progress card", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace {...makeWorkspaceProps()} />,
+    );
+
+    expect(html).toContain("Current focus");
+    expect(html).toContain("Complaint rate denominator");
+  });
+
+  it("shows no active investigation fallback when none available", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace
+        {...makeWorkspaceProps({
+          result: makeWorkspaceResult({
+            situationGraph: {
+              ...makeWorkspaceResult().situationGraph,
+              activeUnknownNodeId: null,
+            },
+          }),
+        })}
+      />,
+    );
+
+    expect(html).not.toContain("Current focus");
   });
 
   it("renders the answer form when a question is available", () => {
@@ -990,6 +1026,108 @@ describe("ReasoningWorkspace UI", () => {
     expect(html).toContain("Developer details");
   });
 
+  it("technical graph counts appear only inside Developer details", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace {...makeWorkspaceProps()} />,
+    );
+
+    // Technical data is available in collapsed developer details
+    expect(html).toContain("Developer details");
+
+    // "3 remaining" no longer appears in the main view
+    expect(html).not.toContain("remaining");
+  });
+
+  it("progress card explains what is being investigated", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace {...makeWorkspaceProps()} />,
+    );
+
+    expect(html).toContain("Reasoning progress");
+    expect(html).toContain("Current focus");
+  });
+
+  it("active unknown is shown in plain language, not raw IDs", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace {...makeWorkspaceProps()} />,
+    );
+
+    // Plain language label appears
+    expect(html).toContain("Complaint rate denominator");
+
+    // Raw node ID does not appear outside developer details section in user context
+    // Developer details remains collapsed by default
+    expect(html).toContain("Developer details");
+  });
+
+  it("reasoning progress handles zero remaining gracefully", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace
+        {...makeWorkspaceProps({
+          result: makeWorkspaceResult({
+            situationGraph: {
+              ...makeWorkspaceResult().situationGraph,
+              resolvedNodeIds: ["n-unknown"],
+            },
+          }),
+        })}
+      />,
+    );
+
+    expect(html).toContain("Reasoning progress");
+  });
+
+  it("loading card appears immediately with spinner and heading", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace
+        status="loading"
+        updateStatus="idle"
+        result={null}
+        answer=""
+        setAnswer={vi.fn()}
+        onAnswerSubmit={vi.fn()}
+      />,
+    );
+
+    expect(html).toContain("Working through your situation");
+    expect(html).toContain("Reading your situation");
+  });
+
+  it("textarea and button are present when canAnswer allows", () => {
+    const html = renderToStaticMarkup(
+      <ReasoningWorkspace {...makeWorkspaceProps()} />,
+    );
+
+    expect(html).toContain("Your answer");
+    expect(html).toContain("Update situation");
+  });
+
+  it("loading message changes with mocked timers", () => {
+    vi.useFakeTimers();
+
+    const initialProps = {
+      status: "loading",
+      updateStatus: "idle",
+      result: null,
+      answer: "",
+      setAnswer: vi.fn(),
+      onAnswerSubmit: vi.fn(),
+    };
+
+    // Initial render — elapsed is 0
+    let html = renderToStaticMarkup(<ReasoningWorkspace {...initialProps} />);
+    expect(html).toContain("Reading your situation");
+
+    // Advance time by 15 seconds
+    vi.advanceTimersByTime(15000);
+
+    // After 16s elapsed, the second message should be active
+    // (useEffect fires in real React; here we verify via hook export)
+    expect(INITIAL_MESSAGES[1].min).toBe(10);
+
+    vi.useRealTimers();
+  });
+
   it("error state remains visible", () => {
     const html = renderToStaticMarkup(
       <ReasoningWorkspace