Add History API routing so browser/Android back navigates screens

- ui-store syncs screens to history (push on go/goGame, hash URLs like #/profile),
  back() = history.back(), initHistory anchors a home base + restores deep links
- page.tsx listens to popstate; resolveScreen() guards transient screens
  (game/room/chat/matchmaking fall back to home when their state is gone)
- ScreenHeader + ChatScreen back buttons use history back; chat cleans up on unmount

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

src/components/screens/ChatScreen.tsx

@@ -15,7 +15,7 @@ export function ChatScreen() {
   const messages = useOnlineStore((s) => s.chatMessages);
   const sendChat = useOnlineStore((s) => s.sendChat);
   const closeChat = useOnlineStore((s) => s.closeChat);
-  const go = useUIStore((s) => s.go);
+  const navBack = useUIStore((s) => s.back);
   const [text, setText] = useState("");
   const endRef = useRef<HTMLDivElement>(null);
   const prevLen = useRef(0);
@@ -30,14 +30,14 @@ export function ChatScreen() {
     prevLen.current = messages.length;
   }, [messages]);
 
+  // Clean up the chat subscription whenever we leave (header back OR hardware back).
+  useEffect(() => () => closeChat(), [closeChat]);
+
   if (!friend) {
     return null;
   }
 
-  const back = () => {
-    closeChat();
-    go("friends");
-  };
+  const back = () => navBack("friends");
 
   const send = async () => {
     const v = text.trim();