Replaces the bare red Mermaid error with a contained callout that says what went wrong in plain words and keeps the useful part of Mermaid's message.

**Stacked on #218 (code block header bar).** The callout sits inside that block's box, so this PR targets `design/code-block`. GitHub will retarget it to `main` when #218 merges.

## Change - A failed diagram shows a pale red callout with a red warning icon in a disc, the title "This diagram could not be drawn", and a one-line reason. - The reason comes from a new, unit-tested `describeDiagramError()` in `code.ts`: - For an unknown diagram type, Mermaid echoes the whole source back after "for text:". The source is already on screen, so only "The diagram type is not recognised." is kept. - For a parse error, it shows "Parse error on line 3", the caret excerpt in monospace, and the "Expecting …" hint wrapped in the same type size and colour as the message. - Anything that matches no known shape falls back to Mermaid's own first line. An empty message gets a generic sentence. - Text uses `--text-sm` and `--text-xs` with their line-height tokens, and colours use theme tokens. The design contract passes with no new exceptions. - It is not a live region. The diagram re-renders on every keystroke while someone types, so an announcement would repeat constantly. KaTeX (math) errors keep their existing rendering.

## Screenshots

Captured from the dev-only design audit page at 2x, with a parse-error diagram added temporarily to the audit to show that case.

| Before (#218) | After (this PR) | | --- | --- | |  |  |

## Verification - Conflicts resolved against the latest #218 branch (e4e2e280); both code-language focus and invalid-diff filename fixes are retained. - The diff against #218 contains only the five diagram-error callout files. - All 32 focused code/diagram unit tests, types, CI checks, and build pass. - All 17 code-block and 10 responsive-content Chromium tests pass, including #218’s two regression tests and the diagram-error callout checks.

### After resolving the stack

The real editor still shows the parse-error explanation and unknown-diagram callout inside the updated code block.


🤖 Generated with [Claude Code](https://claude.com/claude-code)