feat: offline resilience and connection status

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

frontend/src/pages/FightPage.vue

@@ -5,6 +5,7 @@ import FightViewer from '../components/FightViewer.vue'
 import { useNostr } from '../composables/useNostr'
 import { useFightPolling } from '../composables/useFightPolling'
 import { useHumanChallenge } from '../composables/useHumanChallenge'
+import { cacheFight, getCachedFight } from '../composables/useFightCache'
 import { createFightScene, type FightSceneController } from '../game/FightScene'
 import {
   fanfareRound,
@@ -434,7 +435,22 @@ watch(liveFightData, async (val) => {
 
 // --- Mount / Unmount ---
 onMounted(async () => {
-  const status = await loadFight()
+  let status = await loadFight()
+
+  // If fetch failed (offline), try IndexedDB cache
+  if (status === null && fight.value === null) {
+    const cached = await getCachedFight(fightId.value)
+    if (cached) {
+      fight.value = cached
+      status = 'finished'
+    }
+  }
+
+  // Cache finished fights for offline replay
+  if (status === 'finished' && fight.value) {
+    cacheFight(fight.value).catch(() => {})
+  }
+
   isLoading.value = false
 
   if (status === null || status !== 'finished') {