White countdown; centred plain cards, ragged-left only beside art

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

index.html

@@ -359,6 +359,6 @@
     </div>
   </div>
 </div>
-<script type="module" src="main.js?v=136"></script>
+<script type="module" src="main.js?v=137"></script>
 </body>
 </html>

render.js

@@ -1196,19 +1196,19 @@ const CARD_TOP = 88, CARD_H = 62, CARD_PAD = 20; // px of side padding inside th
 function drawCard(title, sub1, sub2, color, icon) {
   const img = icon && SPR[icon];
   ctx.fillStyle = 'rgba(10,6,8,0.72)'; ctx.fillRect(0, CARD_TOP, W, CARD_H);
-  // LEFT-ALIGNED layout on a padded column: icon inset by CARD_PAD, the type ragged-left beside
+  // TWO layouts, by whether there is art: a plain card (SET, CHAPTER, the intros) stays fully
-  // it — centred type next to a left icon read as two unrelated things sharing a band
+  // CENTRED, the classic announcement; an icon card goes ragged-left beside its inset art —
-  let tx = CARD_PAD;
+  // centred type next to a left icon read as two unrelated things sharing a band.
-  if (img) { // vertically centred, boxed so a wide tin can't reach the type
+  let tx = W / 2; ctx.textAlign = 'center';
-    const k = Math.min((CARD_H - 18) / img.height, 46 / img.width);
+  if (img) { // vertically centred, boxed small — the art is a bullet point, not the message
+    const k = Math.min(36 / img.height, 38 / img.width);
     const iw = Math.round(img.width * k), ih = Math.round(img.height * k);
     ctx.imageSmoothingEnabled = false;
     ctx.drawImage(img, CARD_PAD, Math.round(CARD_TOP + (CARD_H - ih) / 2), iw, ih);
-    tx += iw + 12;
+    tx = CARD_PAD + iw + 12; ctx.textAlign = 'left';
   }
   // the title still SHOUTS (Bangers) but at 22, not 30 — up here it shares the screen with the
   // scoreboard and the ads, and 30 read as oversized the moment it left centre court
-  ctx.textAlign = 'left';
   ctx.font = B(22); shadowText(title, tx, CARD_TOP + 4, color);
   ctx.font = F(8);
   if (sub1) shadowText(sub1, tx, CARD_TOP + 34, UI.cream);
@@ -1793,7 +1793,7 @@ export function render() {
     const txt = (G.changeover > 0 ? 'CHANGEOVER · ' : '') + 'RESUMING IN ' + Math.ceil(waitT);
     ctx.font = B(16);
     ctx.textBaseline = 'top';
-    shadowText(txt, W / 2, Math.round(proj(0, COURT.netH, COURT.netZ).y) - 26, hexA(UI.warm, 0.95));
+    shadowText(txt, W / 2, Math.round(proj(0, COURT.netH, COURT.netZ).y) - 26, '#ffffff');
   }
   if (G.phase === 'pretoss' && score.server === 'P' && G.mode !== 'eaten' && !G.horde && !(G.mgT > 0) && !G.aim && waitT <= 0.5) { // while pulling, the draw meter owns this slot
     ctx.font = F(8);