P0 UI: Left sidebar consumes too much width on smaller screens (needs responsive collapse)

[clawderdan]

Priority: P0\n\n## Problem\nOn narrow viewports (tablet/phone, and even some laptop widths), the persistent left navigation sidebar takes a large percentage of the screen, leaving content cramped. This makes reading and scanning pages significantly harder, especially on long articles and the Directory.\n\n## Why it matters\n- Readability/accessibility: content column becomes very narrow\n- Higher bounce on mobile\n- Makes the wiki feel dated/unfinished on modern devices\n\n## Repro / affected URLs\n1. Visit https://wiki.aavegotchi.com/en/index\n2. Resize browser width down (e.g., < 1024px; also test common mobile widths like 390px)\n3. Observe the left sidebar remains visible and occupies substantial width, compressing the main content\n\nAlso visible on: https://wiki.aavegotchi.com/en/directory\n\n## Suggested fix direction\n- Add a responsive breakpoint where the left sidebar collapses by default\n- Provide a hamburger/menu button that toggles an overlay drawer for navigation\n- Ensure keyboard focus trapping in the drawer and close-on-escape\n\n## Acceptance criteria\n- At <= 1024px (or appropriate breakpoint), content area uses the majority of the viewport\n- Sidebar is hidden/collapsed by default and accessible via a menu button\n- Drawer supports keyboard navigation (Tab/Shift+Tab) and closes with Esc\n- No layout shift/jank when toggling\n