feat: recreate Guardian Pacts tab for Invoker attunement

- Add GuardianPactsTab.tsx with guardian cards organized by floor tier
- Display HP, armor, power stats, boons, unique perk, pact cost per guardian
- Show status: Undefeated / Defeated (pact available) / Pact Signed
- Allow starting pact rituals with defeated guardians
- Show pact ritual progress bar
- Display active pacts and cumulative boon effects
- Show remaining pact slots
- Add tier filter (All / Early / Mid / Late Spire)
- Add to tabs barrel export and page.tsx with lazy loading
- Add DebugName wrapper
- Write 13 tests covering module structure, data integrity, store shape, file size

src/app/page.tsx

@@ -50,6 +50,7 @@ const AttunementsTab = lazy(() => import('@/components/game/tabs').then(module =
 const PrestigeTab = lazy(() => import('@/components/game/tabs').then(module => ({ default: module.PrestigeTab })));
 const EquipmentTab = lazy(() => import('@/components/game/tabs').then(module => ({ default: module.EquipmentTab })));
 const GolemancyTab = lazy(() => import('@/components/game/tabs').then(module => ({ default: module.GolemancyTab })));
+const GuardianPactsTab = lazy(() => import('@/components/game/tabs').then(module => ({ default: module.GuardianPactsTab })));
 
 const TabLoadingFallback = () => <div className="p-4 text-center text-gray-400">Loading...</div>;
 
@@ -245,6 +246,7 @@ export default function ManaLoopGame() {
                   <TabsTrigger value="prestige" className="text-xs px-2 py-1">✨ Prestige</TabsTrigger>
                   <TabsTrigger value="equipment" className="text-xs px-2 py-1">⚔️ Equipment</TabsTrigger>
                   <TabsTrigger value="golemancy" className="text-xs px-2 py-1">🗿 Golemancy</TabsTrigger>
+                  <TabsTrigger value="pacts" className="text-xs px-2 py-1">📜 Pacts</TabsTrigger>
                 </TabsList>
 
                 <TabsContent value="spells">
@@ -322,6 +324,14 @@ export default function ManaLoopGame() {
                     </Suspense>
                   </ErrorBoundary>
                 </TabsContent>
+
+                <TabsContent value="pacts">
+                  <ErrorBoundary fallback={<div className="p-4 text-red-400">pacts tab failed to load.</div>}>
+                    <Suspense fallback={<TabLoadingFallback />}>
+                      <GuardianPactsTab />
+                    </Suspense>
+                  </ErrorBoundary>
+                </TabsContent>
               </Tabs>
             </div>
           </main>