Adding a syndicate pairing page with some notes

Chrono/Shared/Pages/Agents.razor

@@ -42,7 +42,7 @@
                     @(((CardData)context).StatEfficiency)
                 </Template>
             </GridColumn>
-            <GridColumn Field="@nameof(CardData.Faction)" Title="Faction" Width="140px"/>
+            <GridColumn Field="@nameof(CardData.Syndicate)" Title="Faction" Width="140px"/>
             <GridColumn Field="@nameof(CardData.Attack)" Title="ATK" Width="120px"/>
             <GridColumn Field="@nameof(CardData.Health)" Title="HP" Width="120px"/>
             <GridColumn Field="@nameof(CardData.Description)" Title="Description" Width="400px"/>

Chrono/Shared/Pages/DeckDetail.razor

@@ -6,7 +6,7 @@
 
 <HeadContent>
     <meta name="description"
-          content="@(deck != null ? $"View details for the {deck.Name} deck. {deck.Cards.Count} cards, {deck.Factions.Count} factions." : "Deck details and card list.")"/>
+          content="@(deck != null ? $"View details for the {deck.Name} deck. {deck.Cards.Count} cards, {deck.Syndicates.Count} factions." : "Deck details and card list.")"/>
 </HeadContent>
 
 <div class="deck-detail-page">
@@ -26,10 +26,10 @@
                 <h1>@deck.Name</h1>
                 <b>Deck Code:</b>
                 <pre>@deck.DeckCode</pre>
-                @if (deck.Factions.Count > 0)
+                @if (deck.Syndicates.Count > 0)
                 {
                     <div class="deck-factions">
-                        @foreach (var f in deck.Factions)
+                        @foreach (var f in deck.Syndicates)
                         {
                             <span class="faction-badge">@f</span>
                         }

Chrono/Shared/Pages/Decks.razor

@@ -27,10 +27,10 @@
             <a class="deck-card" href="/decks/@Uri.EscapeDataString(deck.Name)">
                 <div class="deck-card-body">
                     <h2 class="deck-card-title">@deck.Name</h2>
-                    @if (deck.Factions.Count > 0)
+                    @if (deck.Syndicates.Count > 0)
                     {
                         <div class="deck-card-factions">
-                            @foreach (var f in deck.Factions)
+                            @foreach (var f in deck.Syndicates)
                             {
                                 <span class="faction-badge">@f</span>
                             }

Chrono/Shared/Pages/Docs.razor

@@ -1,4 +1,4 @@
-@namespace Shared.Pages
+@namespace Shared.Pages
 @page "/docs"
 
 <PageTitle>Docs</PageTitle>

Chrono/Shared/Pages/Home.razor

@@ -1,3 +1,4 @@
+@implements IDisposable
 @namespace Shared.Pages
 @page "/home"
 
@@ -6,6 +7,10 @@
 <div class="home-hero">
     <div class="hero-glow"></div>
     <div class="hero-content">
+        <div class="free-pack-countdown">
+            <span class="countdown-label">Free Pack Countdown:</span>
+            <span class="countdown-value">@_countdownString</span>
+        </div>
         <h1 class="hero-title">Slop Game Reference - Chrono CCG</h1>
         <p class="hero-subtitle">
             AI generated website for reference notes on playing Chrono CCG.
@@ -23,3 +28,36 @@
         </div>
     </div>
 </div>
+
+@code {
+    private string _countdownString = "00:00:00";
+    private System.Threading.Timer? _timer;
+
+    protected override void OnInitialized()
+    {
+        _timer = new System.Threading.Timer(_ =>
+        {
+            UpdateCountdown();
+            InvokeAsync(StateHasChanged);
+        }, null, 0, 1000);
+    }
+
+    private void UpdateCountdown()
+    {
+        var now = DateTime.Now;
+        var target = now.Date.AddHours(20); // 8 PM today
+
+        if (now >= target)
+        {
+            target = target.AddDays(1); // 8 PM tomorrow
+        }
+
+        var remaining = target - now;
+        _countdownString = $"{(int)remaining.TotalHours:D2}:{remaining.Minutes:D2}:{remaining.Seconds:D2}";
+    }
+
+    public void Dispose()
+    {
+        _timer?.Dispose();
+    }
+}

Chrono/Shared/Pages/Home.razor.css

@@ -25,6 +25,34 @@
     margin: 0 auto;
 }
 
+.free-pack-countdown {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.6rem;
+    background: rgba(108, 99, 255, 0.1);
+    border: 1px solid rgba(108, 99, 255, 0.2);
+    padding: 0.4rem 1rem;
+    border-radius: 999px;
+    margin-bottom: 1.5rem;
+    backdrop-filter: blur(4px);
+}
+
+.countdown-label {
+    font-size: 0.75rem;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    color: var(--text-secondary);
+}
+
+.countdown-value {
+    font-size: 0.9rem;
+    font-weight: 700;
+    color: var(--accent);
+    font-family: 'JetBrains Mono', monospace;
+    min-width: 4.5rem;
+}
+
 .hero-badge {
     display: inline-block;
     font-size: 0.75rem;
@@ -257,7 +285,6 @@
 }
 
 /* ── Responsive ── */
-@
 @media (max-width: 900px) {
     .home-stats {
         grid-template-columns: repeat(3, 1fr);
@@ -268,7 +295,6 @@
     }
 }
 
-@
 @media (max-width: 600px) {
     .hero-title {
         font-size: 2.2rem;