Adding vibe hover effect

Chrono/Shared/Pages/Agents.razor

@@ -1,4 +1,5 @@
 @namespace Shared.Pages
+@inject Shared.Services.CardPreviewService PreviewService
 @page "/agents"
 
 <PageTitle>Chrono CCG - Agents</PageTitle>
@@ -29,10 +30,15 @@
             </GridColumn>
             <GridColumn Field="@nameof(CardData.Name)" Title="Card" Width="220px">
                 <Template>
-                    <div class="agent-name-cell">
-                        <img src="@(((CardData)context).ImagePath)" alt="@(((CardData)context).Name)"
+                    @{
+                        var card = (CardData)context;
+                    }
+                    <div class="agent-name-cell"
+                         @onmouseenter="@(e => PreviewService.Show(card, e.ClientX, e.ClientY))"
+                         @onmouseleave="@(() => PreviewService.Hide())">
+                        <img src="@(card.ImagePath)" alt="@(card.Name)"
                              class="agent-thumb"/>
-                        <span>@(((CardData)context).Name)</span>
+                        <span>@(card.Name)</span>
                     </div>
                 </Template>
             </GridColumn>