fix(specimens): restore a coherent responsive browser shell

[BunsDev]

Objective

Recover the specimen browser’s visual hierarchy after the React/package migration while preserving the public @opencoven/ui API and keeping Cave as production UI authority.

What changed

• restores a sticky application top bar with explicit Library / Assembled navigation
• replaces the hidden-child density hack with an accessible Cozy / Compact control
• groups all 16 specimens into Composer, Run rail, and Blocks sections
• keeps in-page navigation aligned with filtered catalog sections
• restores editorial hierarchy, consistent card rhythm, useful stage sizing, and a deliberate empty-search state
• upgrades /lab into a framed assembled workbench using exported blocks
• removes decorative gradients from specimen chrome
• fixes malformed registry install copy and the components versus blocks import path
• fixes mobile shrink/wrap behavior in SessionHeader, TranscriptTurn, and tabs
• adds a stable 320px viewport floor that does not scale under enlarged root text
• prevents assembled tabs, transcript metadata, and composer content from clipping at narrow widths
• regenerates affected registry payloads so source, package, and installable artifacts remain deterministic
• adds unit and architecture contracts for shell landmarks, catalog hierarchy, density, responsive navigation, mobile containment, reduced motion, and no-gradient chrome
• pins the ordinary CI workflow actions to immutable revisions

Deliberate non-goals

• no public prop or export changes
• no token ownership changes
• no attempt to make this repository canonical over Cave production UI behavior
• no new runtime dependencies

Verification

Final head: 36c2b6371b664a5453fd143dd224ba12f667c897

• GitHub CI — success
• pnpm check — pass
  • formatting and lint
  • workspace type checking
  • unit tests
  • architecture/design contracts
  • registry validation and deterministic regeneration
  • clean consumer installation
  • package and specimen production builds
  • deploy-output and packed-package verification
• all four review threads — resolved
• mergeability — clean
• downstream stacked PR test(specimens): add reviewable viewport receipts #2 visual verification — success, including 320/375/390/430px, RTL, reduced motion, and 390px at 200% text

Final file set

• .github/workflows/ci.yml
• apps/specimens/src/app.tsx
• apps/specimens/src/main.tsx
• apps/specimens/src/specimens-fixes.css
• apps/specimens/src/specimens.css
• packages/ui/src/blocks/session-header.tsx
• packages/ui/src/blocks/transcript-turn.tsx
• packages/ui/src/components/ui/tabs.tsx
• packages/ui/tests/mobile-blocks.test.tsx
• packages/ui/tests/tabs.test.tsx
• public/r/session-header.json
• public/r/tabs.json
• public/r/transcript-turn.json
• scripts/verify-contracts.mjs

Risk and rollback

The shell work is isolated to the specimen app. Exported block changes are additive responsive corrections with matching generated registry payloads; no prop or export contract changes are introduced. Revert this PR to restore the preceding presentation and compositions.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
opencoven-ui	Ready	Preview	Aug 30, 2026 2:31pm
ui	Error		Aug 30, 2026 2:31pm

[Copilot]

Pull request overview

Restores the specimens app “browser shell” UI/UX (top bar, navigation rail, catalog hierarchy, density control, and assembled lab framing) and extends the contract verifier to assert these shell behaviors post-migration, without changing @opencoven/ui exported component contracts.

Changes:

• Rebuilds the specimens shell layout (sticky top bar, rail navigation, grouped catalog, explicit density control, empty-search state).
• Refactors specimen styling to restore hierarchy/rhythm, add responsive rail behavior, and remove decorative gradients.
• Expands scripts/verify-contracts.mjs with new assertions covering shell landmarks, hierarchy, density control, responsive nav, and “no gradients”.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 4 comments.

File	Description
scripts/verify-contracts.mjs	Adds contract assertions for the specimens shell structure, hierarchy, density control, responsive rail behavior, and gradient avoidance.
apps/specimens/src/specimens.css	Replaces the previous minimal styling with a full shell + catalog + responsive layout stylesheet and reduced-motion/forced-colors handling.
apps/specimens/src/app.tsx	Rebuilds the specimens app shell (top bar/rail/main), groups specimens into sections, adds an explicit density control, and reframes /lab as an assembled workbench.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.