feat(editor): the left bar folds away, and the device sheet takes the whole editor on a phone

A button at the top of the palette and the documentation's bar folds it to a
slim column, as the dashboard's own bar does; one state for both, kept in the
browser. Up to 639 px the device sheet covers the whole editor, over the bar
and the mode buttons, instead of sharing half the height below the surface.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

packages/editor/browser/documentation.spec.ts

@@ -54,7 +54,8 @@ test('makes, moves, resizes, colours and types documentation as Java does, and p
   await expect(canvas).toHaveAttribute('data-mode', 'documentation');
   await expect(page.getByRole('navigation', { name: 'Komponenten' })).toHaveCount(0);
   const sidebar = page.getByRole('navigation', { name: 'Dokumentation' });
-  await expect(sidebar.getByRole('button')).toHaveText(['Text', 'Gliederungsfläche', 'Exportieren', 'Report']);
+  await expect(sidebar.getByRole('button', { name: 'Leiste einklappen' })).toBeVisible();
+  await expect(sidebar.locator('.side-bar__items').getByRole('button')).toHaveText(['Text', 'Gliederungsfläche', 'Exportieren', 'Report']);
 
   // A rectangle dragged onto the surface: 100 × 50, its middle where it was dropped, grey, with the focus.
   const surface = (await canvas.boundingBox())!;