From 88f21e21868c5dadd9f90c63c580937a051c7e0a Mon Sep 17 00:00:00 2001
From: Carlos Valente <carlosvalente@pm.me>
Date: Mon, 23 Feb 2026 20:01:22 +0100
Subject: [PATCH] refactor: improve timer styling in playback controls

---
 .../control/playback/playback-timer/PlaybackTimer.tsx       | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/apps/client/src/features/control/playback/playback-timer/PlaybackTimer.tsx b/apps/client/src/features/control/playback/playback-timer/PlaybackTimer.tsx
index fca31935e..24cfcda66 100644
--- a/apps/client/src/features/control/playback/playback-timer/PlaybackTimer.tsx
+++ b/apps/client/src/features/control/playback/playback-timer/PlaybackTimer.tsx
@@ -42,7 +42,11 @@ export default function PlaybackTimer({ children }: PropsWithChildren) {
         <div className={style.indicatorNegative} data-active={isOvertime} />
         <Tooltip text={addedTimeLabel} render={<div />} className={style.indicatorDelay} data-active={hasAddedTime} />
       </div>
-      <TimerDisplay time={isWaiting ? timer.secondaryTimer : timer.current} phase={timer.phase} />
+      <TimerDisplay
+        className={style.timerDisplay}
+        time={isWaiting ? timer.secondaryTimer : timer.current}
+        phase={timer.phase}
+      />
       <div className={style.status}>
         {isWaiting ? (
           <span className={style.rolltag}>Roll: Countdown to start</span>