P1: Complete restrained Slack-like UI polish pass

[jusso-dev]

Parent: #21

Goal

Make Muster a coherent, professional, Buzz-simple security workspace without template-like or AI-generated styling.

User-observed problems (homelab, 2026-07-26)

• Normal text is difficult to read.
• Chat messages have unnecessary boxes and odd separator/border lines.
• Spacing, hierarchy, and component treatment feel unfinished.
• The overall interface is busier and less polished than Buzz.

Design constraints

• Prefer conversation rows and whitespace over a box around every message.
• Reserve bordered cards for structured security activity, approvals, findings, and focus/selection states.
• No gradients, neon, glow, cyberpunk, giant cards, decorative AI flows, sparkle motifs, oversized pills, or novelty buttons.
• Use charcoal/slate surfaces, restrained accents, consistent radii, quiet dividers, and dense readable layout.
• Keep navigation and actions obvious through progressive disclosure; avoid decorative chrome.

Scope

• Audit every route at desktop, tablet, and mobile widths.
• Establish readable type tokens for body, metadata, labels, and code; remove arbitrary fixed-pixel text that breaks browser zoom.
• Simplify chat message layout, thread separators, hover actions, timestamps, agent identity, and structured event cards.
• Normalize spacing, buttons, badges, focus, empty/loading/error states, drawers, and context panels.
• Fix copy, console warnings, hydration errors, overflow, visual dead ends, and dead controls.
• Ensure Enter sends and Shift+Enter adds a newline.
• Validate dark/light themes, keyboard-only use, 200% zoom, and reduced motion.

Acceptance criteria

• Normal message/body copy is comfortably readable at default zoom and remains usable at 200% zoom.
• Metadata meets practical WCAG 2.2 AA contrast; essential state is never colour-only.
• Ordinary chat messages are not individually boxed; dividers/borders have a clear semantic purpose.
• Structured events remain compact and visually distinct from conversation.
• No CSS gradients, glow/neon UI, robot emoji, or sparkle as primary agent identity.
• Every visible control works or is honestly disabled/removed.
• Composer, threads, reactions, navigation, command palette, drafts, theme, and mobile pass Playwright.
• No console errors or React warnings in core paths.
• Dark/light screenshots look coherent at 375, 768, 1280, and 1920 px.

Verification

• Playwright interaction and visual-regression suite.
• Axe scan plus keyboard-only and 200% zoom checks.
• CSS banned-pattern and arbitrary fixed-size text scans.
• Human visual review of room, task, investigation, agent, and search surfaces.

References

• Buzz simplicity direction: https://github.com/block/buzz
• Zoom-safe text example: fix(web): scale avatar initials with zoom, wire up the px-text guard block/buzz#2946

[jusso-dev]

Implemented on main in a2f9c5c. Raised all fixed-pixel UI text to scalable tokens, kept ordinary messages unboxed, removed decorative side stripes, made dead controls functional or explicitly disabled, added keyboard palette navigation, fixed editor/severity accessibility, replaced failing Monaco runtime with a quiet YAML editor, added Axe/console/zoom/policy gates, and refreshed dark/light screenshots at 375/768/1280/1920. Verified frozen install, lint, strict typecheck, unit tests, production build, 40 applicable cross-browser E2E tests, 4/4 keyboard tests, and screenshot generation.