[pythonicode]

Summary

A responsive pass over the shell for tablets and phones. Tested at phone portrait (390×844), landscape phone (844×390), tablet portrait (834×1112), iPad landscape (1024×768) and desktop (1440×900).

Stacked on #2 (feat/project-library). Its base is that branch, so the diff shows only this work.

Changes

• Map fits the screen, and keeps fitting on resize. Before, the map was only fitted when first imported, so rotating a device or resizing the window left it tiny in a corner. It now refits on resize until the user zooms or pans. A Fit button in the status bar (the zoom readout) refits on demand.
• Touch status bar no longer wraps or overflows. Text size moves into the Style sheet, which uses a new shared TextSizeSlider.
• Compact status bar caps the rotation slider so the bar fits at 1024px.
• Touch tips hide after 12 seconds and are hidden on short landscape screens (height ≤ 500px).
• Bottom toolbar buttons shrink on narrow screens (≤ 420px), so all eight fit at 390px. On short landscape screens the labels drop, which gives the canvas the height.

Not changed

• Desktop layout (≥ 1280px) is unchanged apart from the Fit button.
• Layout is still chosen by window width in useLayoutMode (1280 / 1024 breakpoints), not by device type.

Testing

• bun run test, bun run lint, bun run build pass.
• Checked in the browser at each size above. The map fills the canvas, the status bar and bottom toolbar fit without overflow, and the Style sheet shows the text-size slider.
• Found and fixed a case where the status bar's rotation slider pushed other items off the right edge at 1024px.
• Not verified on real devices. Safe-area insets on notched phones are unchanged.

🤖 Generated with Claude Code

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
analysis	Ready	Preview	Oct 14, 2026 9:01am UTC