[roboclaw-bot]

What Problem This Solves

Expanded documentation diagrams shrink their labels to a few pixels on narrow screens instead of providing a readable scrollable view.

User Impact

Expanded diagrams retain at least their native label size on mobile, with the full diagram reachable by horizontal scrolling. Source exports, error fallback, keyboard dismissal and focus restoration are unchanged. No documentation content, dependencies or deployment configuration change.

Why This Change Was Made

Use the renderer-owned SVG viewBox width for expansion and override the SVG's inline responsive maximum only inside the dialog. This works with the existing Mermaid renderer and the proposed Pele cutover; no second rendering engine or compatibility adapter is introduced. Requested by @vincentkoc.

Work sessions

• Original discussion with @vincentkoc
• Implementation and verification

Evidence

• Chromium and WebKit generated-page regression: both fail on the base because expansion shrinks the SVG; both pass on this exact head. The test also checks source Markdown, escaped error fallback, horizontal end reachability, the focus trap, Escape and focus restoration.
• Bounded 30-page real-docs preview passed; inspected the actual home and Gateway architecture pages at 390px. The mobile home diagram went from roughly 5px labels in expansion to its native readable size with scrolling.
• Fresh independent Codex P0–P3 autoreview: scoped-clean. Syntax and whitespace checks passed.
• This is the independently useful prerequisite extracted while refining improve: render documentation diagrams with Pele #286. The engine swap remains separate and atomic; improve: render documentation diagrams with Pele #286 is unchanged pending parent coordination.

Before

After