refactor: make the whole playoff banner clickable instead of a Bracket pill

Wrap the trophy + title + meta group in the bracket link itself so the
whole Stanley Cup Playoffs element doubles as the entry point. Cleaner
banner, one fewer control to style.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

app/static/styles.css

@@ -369,9 +369,9 @@ main {
 /* ── Playoff Banner ─────────────────────────────── */
 
 .playoff-banner {
-    display: grid;
+    display: flex;
-    grid-template-columns: 1fr auto 1fr;
     align-items: center;
+    justify-content: center;
     gap: 1rem;
     padding: 0.875rem 1.25rem;
     background: var(--banner-bg);
@@ -385,19 +385,25 @@ main {
 }
 
 .banner-main {
-    grid-column: 2;
     display: flex;
     align-items: center;
     gap: 1rem;
     min-width: 0;
+    color: inherit;
+    text-decoration: none;
+    border-radius: 8px;
+    padding: 0.25rem 0.5rem;
+    transition: background 120ms ease;
 }
 
-.banner-actions {
+.banner-main:hover,
-    grid-column: 3;
+.banner-main:focus-visible {
-    justify-self: end;
+    background: rgba(212, 175, 55, 0.08);
-    display: flex;
+}
-    align-items: center;
+
-    gap: 0.5rem;
+.banner-main:focus-visible {
+    outline: 2px solid var(--cup-gold-1);
+    outline-offset: 2px;
 }
 
 .banner-trophy {
@@ -465,12 +471,8 @@ main {
 
 @media (max-width: 640px) {
     .playoff-banner {
-        grid-template-columns: 1fr;
-        justify-items: center;
         padding: 0.75rem 1rem;
     }
-    .banner-main { grid-column: 1; }
-    .banner-actions { grid-column: 1; justify-self: center; }
 }
 
 /* ── Playoff Game Cards ─────────────────────────── */

app/templates/index.html

@@ -17,7 +17,7 @@
         <span class="header-title">NHL Scoreboard</span>
     </header>
     <section id="playoff-banner" class="playoff-banner hidden" aria-hidden="true">
-        <div class="banner-main">
+        <a class="banner-main" href="/bracket" aria-label="View the playoff bracket">
             <svg class="banner-trophy" viewBox="0 0 32 40" aria-hidden="true">
                 <defs>
                     <linearGradient id="cup-gold" x1="0" x2="1" y1="0" y2="1">
@@ -43,10 +43,7 @@
                     <span class="meta-game7 hidden"></span>
                 </div>
             </div>
-        </div>
+        </a>
-        <div class="banner-actions">
-            <a class="banner-bracket-link" href="/bracket">Bracket</a>
-        </div>
     </section>
     <main>
         <section id="pinned-section" class="section pinned-section hidden">