feat: inline power play indicator as compact badge in card header

Moves the PP team + countdown into the badges row next to period and
clock, freeing up a full line of vertical space on each live card.

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

app/static/styles.css

@@ -212,44 +212,12 @@ main {
     white-space: nowrap;
 }
 
-/* ── Power Play Indicator ───────────────────────── */
+/* ── Power Play Badge (inline in card header) ─── */
 
-.pp-indicator {
-    display: flex;
-    align-items: center;
-    gap: 0.4rem;
-    margin-top: 0.5rem;
-    padding: 0.35rem 0.5rem;
-    background: rgba(239, 68, 68, 0.1);
-    border: 1px solid rgba(239, 68, 68, 0.3);
-    border-radius: 6px;
-}
-
-.pp-label {
-    font-size: 0.6rem;
-    font-weight: 700;
-    letter-spacing: 0.08em;
+.badge-pp {
+    background: rgba(239, 68, 68, 0.15);
     color: var(--red);
-    text-transform: uppercase;
-    flex-shrink: 0;
-}
-
-.pp-team {
-    font-size: 0.72rem;
-    font-weight: 600;
-    color: var(--text);
-    flex: 1;
-    min-width: 0;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-.pp-clock {
-    font-size: 0.72rem;
-    font-weight: 700;
-    color: var(--red);
-    flex-shrink: 0;
+    border: 1px solid rgba(239, 68, 68, 0.35);
     font-variant-numeric: tabular-nums;
 }