diff --git a/app/static/script.js b/app/static/script.js
index ae301a9..9282d56 100644
--- a/app/static/script.js
+++ b/app/static/script.js
@@ -150,7 +150,6 @@ function renderLiveGame(game, opts = {}) {
${periodBadge}
${time}
- ${ppBadge(game)}
${dot}
@@ -241,9 +240,14 @@ function teamRow(game, side, state) {
const score = game[`${side} Score`];
const sog = game[`${side} Shots`];
const record = game[`${side} Record`];
+ const pp = game[`${side} Power Play`];
const sogHtml = (state === 'live' || state === 'final') && sog !== undefined
? `${sog} SOG` : '';
+ const ppHtml = state === 'live' && pp ? teamPpIndicator(pp) : '';
+
+ const subParts = [sogHtml, ppHtml].filter(Boolean).join('');
+ const subline = subParts ? `${subParts}
` : '';
const right = state === 'pre'
? `${record}`
@@ -254,24 +258,17 @@ function teamRow(game, side, state) {
${name}
- ${sogHtml}
+ ${subline}
${right}
`;
}
-function ppBadge(game) {
- const awayPP = game['Away Power Play'];
- const homePP = game['Home Power Play'];
- const pp = awayPP || homePP;
- if (!pp) return '';
-
- const team = awayPP ? game['Away Team'] : game['Home Team'];
+function teamPpIndicator(pp) {
const timeStr = pp.replace('PP ', '');
const seconds = timeToSeconds(timeStr);
const attrs = `data-seconds="${seconds}" data-received-at="${Date.now()}" data-pp-clock`;
-
- return `PP ${team} ${timeStr}`;
+ return `PP ${timeStr}`;
}
function gameKey(game) {
diff --git a/app/static/styles.css b/app/static/styles.css
index 0ec49fc..71d2bbd 100644
--- a/app/static/styles.css
+++ b/app/static/styles.css
@@ -209,6 +209,13 @@ main {
font-size: 0.68rem;
color: var(--red);
font-weight: 600;
+ font-variant-numeric: tabular-nums;
+}
+
+.team-subline {
+ display: flex;
+ align-items: baseline;
+ gap: 0.5rem;
}
.team-score {
@@ -229,15 +236,6 @@ main {
white-space: nowrap;
}
-/* ── Power Play Badge (inline in card header) ─── */
-
-.badge-pp {
- background: rgba(239, 68, 68, 0.15);
- color: var(--red);
- border: 1px solid rgba(239, 68, 68, 0.35);
- font-variant-numeric: tabular-nums;
-}
-
/* ── Hype Meter ─────────────────────────────────── */
.hype-meter {