feat: toggle word wrap on code snippets - #556

Closes #525.

The snippet viewer rendered SyntaxHighlighter without wrapLongLines, so a long line could only be reached by scrolling sideways inside a card that is already narrow. A Wrap button next to Copy now switches between the two.

What changed

Three small edits in TaskCard.jsx:

• a wrapLines state next to selectedSnippet
• a Wrap button in the same row as Copy
• wrapLongLines={wrapLines} on the highlighter

Two decisions worth naming

The setting is per viewer, not global. One card can hold a wide table that reads better wrapped, while another holds code whose shape is the point and where wrapping would hide it. Keeping it on the card means each one can be what it needs to be, and nothing has to be remembered across the board.

The button is not colour-only. It carries aria-pressed, and its title says what a click will do ("Long lines wrap; click to scroll instead") rather than what the state currently is, which is the part that is ambiguous when you are looking at a toggle for the first time.

Test plan

npm run build passes (the chunk-size warning is pre-existing and unrelated).

There is no test setup in the client, so the behaviour itself I verified by reading the installed react-syntax-highlighter 15.6.6: wrapLongLines puts whiteSpace: 'pre-wrap' on the code element's style, while the existing customStyle here goes on the pre element. The two do not collide, so the prop takes effect as it should with this viewer's styling.