diff --git a/frontend/src/pages/RunEncounters.tsx b/frontend/src/pages/RunEncounters.tsx
index 45577a2..4640cfd 100644
--- a/frontend/src/pages/RunEncounters.tsx
+++ b/frontend/src/pages/RunEncounters.tsx
@@ -610,6 +610,13 @@ export function RunEncounters() {
     }
   }, [organizedRoutes, encounterByRoute]) // eslint-disable-line react-hooks/exhaustive-deps
 
+  // Resolve HoF team encounters from IDs
+  const hofTeam = useMemo(() => {
+    if (!run?.hofEncounterIds || run.hofEncounterIds.length === 0) return null
+    const idSet = new Set(run.hofEncounterIds)
+    return normalEncounters.filter((e) => idSet.has(e.id))
+  }, [run?.hofEncounterIds, normalEncounters])
+
   if (isLoading || loadingRoutes) {
     return (
       <div className="flex items-center justify-center py-16">
@@ -669,13 +676,6 @@ export function RunEncounters() {
     (e) => e.status === 'caught' && e.faintLevel !== null,
   )
 
-  // Resolve HoF team encounters from IDs
-  const hofTeam = useMemo(() => {
-    if (!run.hofEncounterIds || run.hofEncounterIds.length === 0) return null
-    const idSet = new Set(run.hofEncounterIds)
-    return normalEncounters.filter((e) => idSet.has(e.id))
-  }, [run.hofEncounterIds, normalEncounters])
-
   const toggleGroup = (groupId: number) => {
     updateExpandedGroups((prev) => {
       const next = new Set(prev)