feat(multi): add go back button with extra click penalty

app/components/GameScreen.tsx

@@ -18,6 +18,8 @@ type GameScreenProps = {
   elapsed: string;
   countdown: number | null;
   onNavigate: (title: string) => void;
+  onGoBack: () => void;
+  canGoBack: boolean;
   onRetry: () => void;
   onNextRound: () => void;
   onResetGame: () => void;
@@ -36,6 +38,8 @@ export function GameScreen({
   elapsed,
   countdown,
   onNavigate,
+  onGoBack,
+  canGoBack,
   onRetry,
   onNextRound,
   onResetGame,
@@ -262,6 +266,15 @@ export function GameScreen({
             <span>{clicks} clics</span>
             <span className="hidden sm:inline">{myPlayer?.score ?? 0} pts</span>
           </div>
+          {!myFinished && canGoBack && (
+            <button
+              onClick={onGoBack}
+              disabled={loading}
+              className="min-h-8 px-2 rounded-lg text-xs font-semibold bg-[#242424] border border-[#2e2e2e] text-[#f0f0f0] hover:bg-[#1a1a1a] disabled:opacity-50 cursor-pointer shrink-0"
+            >
+              ← +1
+            </button>
+          )}
           {!myFinished && (
             <button
               onClick={onSurrender}

app/components/ScreenRouter.tsx

@@ -176,6 +176,8 @@ export function ScreenRouter({
         elapsed={fmt(multi.elapsed)}
         countdown={multi.countdown}
         onNavigate={multi.navigate}
+        onGoBack={multi.goBack}
+        canGoBack={multi.canGoBack}
         onRetry={multi.retryLoad}
         onNextRound={handlers.handleNextRound}
         onResetGame={handlers.handleResetGame}

lib/useMultiGame.ts

@@ -297,6 +297,41 @@ export function useMultiGame() {
     return {};
   }
 
+  const goBack = useCallback(async () => {
+    if (!room || !playerId || loadingRef.current || room.phase !== "playing") return;
+    if (historyRef.current.length <= 1) return;
+
+    clicksRef.current += 1;
+    setClicksDisplay(clicksRef.current);
+    if (!timerStartedRef.current) { timer.start(); timerStartedRef.current = true; }
+
+    const newHistory = historyRef.current.slice(0, -1);
+    const target = newHistory[newHistory.length - 1];
+
+    fetch(`/api/rooms/${room.code}`, {
+      method: "PATCH",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ action: "heartbeat", playerId }),
+    }).catch(() => {});
+
+    const canonical = await loadArticle(target);
+    if (!canonical) return;
+
+    historyRef.current = newHistory;
+    setHistory(newHistory);
+    window.scrollTo({ top: 0, behavior: "smooth" });
+
+    try {
+      const res = await fetch(`/api/rooms/${room.code}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ action: "navigate", playerId, article: canonical }),
+      });
+      if (res.ok) setRoom((await res.json() as { room: Room }).room);
+    } catch { /* on continue localement */ }
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [room, playerId]);
+
   async function setSearchAllowed(value: boolean) {
     if (!room || !playerId) return;
     const res = await fetch(`/api/rooms/${room.code}`, {
@@ -390,6 +425,8 @@ export function useMultiGame() {
     resetGame,
     leave,
     navigate,
+    goBack,
+    canGoBack: historyRef.current.length > 1,
     surrender,
     setSearchAllowed,
     restore,