The ThemeToggle component was causing hydration errors because the server
and client rendered different icons (Sun/Moon) based on the theme state.
Changes:
- Render a placeholder button until component is mounted
- Only render the actual theme icon after client-side hydration
- This ensures server and client HTML match during initial render
Fixes console error: 'Expected server HTML to contain a matching <circle> in <svg>'
- Receiver: auto-fill and join on Retrieve tab when input empty, not in room, no URL roomId, and cachedId exists (ClipboardApp + roomIdCache)
- Sender: “Use cached ID” now immediately joins the room (add onUseCached + disabled to CachedIdActionButton; wire in SendTabPanel)
- UI: add ThemeToggle and integrate into Header (desktop and mobile)
- Styles: replace hardcoded white with design tokens in Retrieve panel (bg-card/text-card-foreground) for dark mode
- Docs: update AI playbook flows and code-map
david_bai