feat(studio): clarify live compare scope and results

Refine the Simple Compare composer per the studio-compare-ux-refinement
spec: show the checkpoint as fixed context instead of a one-option
selector, lead lane headers with the selected Agent while the effective
model is shown separately, and label the comparison as repeatability,
single-variable, or descriptive based on retained lane configuration.
Completed runs now lead with a factual delta summary derived only from
lane state. The resource map keeps its symmetric three-column layout at
wide and compact widths and stacks per-resource lane sections at narrow
widths. Browser checks assert control bounds, prompt width, action
visibility, keyboard tab order, and overflow at 1440x900, 1024x768, and
390x844, with no console or page errors.

Validated with the full Studio browser spec, the comparison-model unit
suite, npm run check, and the documentation link-graph test under Node 24.

Co-authored-by: QoderAI (Qwen 3.8 Max) <qoder_ai@qoder.com>

Author: phodal

docs/specs/2026-08-27-studio-compare-ux-refinement.md

@@ -0,0 +1,105 @@
+# Clear and responsive live comparison
+
+## Traceability
+
+- Spec ID: studio-compare-ux-refinement
+- Status: Implemented
+
+## Intent
+
+Make the default live Compare surface answer three user questions in order:
+which project and Agents will run, what variable the run can honestly compare,
+and what observable differences the two runs produced. Preserve the existing
+resource-linked Tool Call evidence while making the setup and results usable at
+390px without clipped controls or character-wide text.
+
+## Acceptance Scenarios
+
+- AC-1: At 390x844, Current project, both Agent selectors, Prompt, comparison
+  scope, Advanced details, and Run compare remain fully inside the viewport,
+  readable, and keyboard reachable. No paragraph or textarea collapses to a
+  character-wide column.
+- AC-2: Before Run, the surface names the selected Agent and effective model
+  policy for each lane and states the observable comparison variables. Two
+  effectively identical selections are labelled as a repeatability comparison;
+  multiple changed variables are labelled descriptive rather than controlled.
+- AC-3: A single checkpoint-bound project is presented as fixed context rather
+  than as a one-option selector. The UI does not claim arbitrary project
+  rebinding.
+- AC-4: Run compare is the only visually primary action in the composer.
+  Advanced details remains available as a lower-weight disclosure, and status
+  copy explains readiness instead of saying only `Ready`.
+- AC-5: Lane headers lead with the selected Agent, then show the effective model
+  separately. `Agent default` is never presented as the Agent's primary name.
+- AC-6: Completed results lead with a factual delta summary derived only from
+  retained lane state and projected operations: lane outcome, shared/run-only
+  resources, edits, and verification activity. It does not emit an aggregate
+  quality score or single-trial winner.
+- AC-7: Wide and compact resource comparison retains the symmetric three-column
+  map. Narrow comparison renders each resource as one row header followed by
+  full-width AI 1 and AI 2 operation sections, keeping inline Tool Call results
+  owned by their originating lane.
+- AC-8: Browser regression checks assert bounding rectangles for critical
+  controls, meaningful minimum Prompt width, primary-action visibility,
+  keyboard tab semantics, no document-level overflow, and screenshots at
+  1440x900, 1024x768, and 390x844 with no console/page errors.
+
+## Non-goals
+
+- Add filesystem project discovery or implement the workspace chooser in this
+  change.
+- Rank an Agent or model from one comparison, add a composite score, or infer
+  hidden intent from Tool Calls.
+- Replace Messages or Advanced evidence, redesign Evidence results, or change
+  experiment execution and ACP permission semantics.
+- Add new Agent adapters or installation actions.
+
+## Plan and Tasks
+
+1. Add pure comparison-scope and factual-result projections beside the existing
+   resource comparison model, with focused unit coverage.
+2. Refactor the Simple Compare composer into fixed project context, explicit
+   Agent/model lanes, one comparison-scope row, and one primary Run action.
+3. Add the factual result summary above Resources/Messages and correct lane
+   header hierarchy.
+4. Override every Agent-catalog grid placement at the narrow breakpoint and
+   stack each resource's two lane sections vertically.
+5. Strengthen Playwright assertions around actual element bounds and retain
+   screenshots for wide, compact, and narrow review.
+
+## Test and Review Evidence
+
+- AC-2/AC-6: comparison-model tests cover identical Agent-default lanes,
+  lane-model changes, mixed Agent/model-policy attribution, shared/run-only
+  resources, edits, verification, and failed lane state.
+- AC-1/AC-3/AC-4/AC-5/AC-7/AC-8: built Studio Playwright checks inspect control
+  bounds, Prompt width, action visibility, headers, resource stacking, tab
+  keyboard behavior, overflow, screenshots, and console/page errors at all
+  three design widths.
+- Validation target: `npm run harness-studio:test`, the complete Studio browser
+  spec, `npm run check`, documentation link-graph validation, and
+  `git diff --check` under Node 24.
+- Risk: a concise scope label can still overstate attribution. Derive it only
+  from selected Agent ids, model policies, and lane models; call any multi-axis
+  movement descriptive.
+- Risk: stacking lanes can obscure cross-lane alignment. Keep a single resource
+  header and stable AI 1 then AI 2 ordering, with full-width operation controls.
+- Risk: summary copy can turn observations into a verdict. Use factual verbs
+  such as observed, edited, verified, passed, failed, or cancelled and retain
+  Advanced evidence for sufficiency and controlled attribution.
+
+## Implementation Evidence
+
+- `PATH="/opt/homebrew/opt/node@24/bin:$PATH" npm run check` passed: 1,545
+  root tests with 2 skips, 172 Harness tests, 31 Harness UI tests, 293 Studio
+  tests, generated-source checks, and package verification.
+- `npx playwright test packages/harness-studio/test/browser/tool-call.spec.mjs`
+  passed all 10 browser scenarios with empty console/page-error collections.
+- Wide, compact, and narrow `bench-*.png` and
+  `compare-resource-map-*.png` screenshots were inspected for hierarchy,
+  clipping, overflow, and resource-to-lane association.
+- `npx vitest run test/skills-docs/doc-link-graph.test.mjs` passed all 8 link
+  graph checks after regenerating `docs/better-harness-doc-links.mmd`; the
+  graph remained unchanged.
+- `git diff --check` passed, and the change adds no generated or package
+  artifacts to the worktree.