feat: Enhance group display with hover effect for team visibility

src/components/event/GroupDisplay.svelte

@@ -5,6 +5,7 @@
     import EventCardOutline from "./EventCardOutline.svelte";
     import EventTeamChip from "./EventTeamChip.svelte";
     import EventFightChip from "./EventFightChip.svelte";
+    import { teamHoverService } from "./team-hover.svelte";
 
     const {
         event,
@@ -39,6 +40,8 @@
         if (currentRound.length) rounds.push(currentRound);
         return rounds;
     }
+
+    const hover = $teamHoverService;
 </script>
 
 {#each config.groups as groupId}
@@ -58,7 +61,8 @@
             </EventCard>
         </div>
         {#each rounds as round, index}
-            <div>
+            {@const teams = Array.from(new Set(round.flatMap((f) => [f.redTeam, f.blueTeam])))}
+            <div class="{hover.currentHover && !teams.some((t) => t?.id === hover.currentHover) ? 'opacity-30' : ''} transition-opacity">
                 <EventCard title="Runde {index + 1}">
                     {#each round as fight}
                         <EventFightChip {event} {fight} {group} />