fix(ui): make the message preview match the stage it stands in for

Three things measured wrong once the preview showed a real render:

- the pip timer kept leading zeros where the timer view drops them by
  default, so the preview read 00:59:07 against the stage's 59:07 - and its
  own secondary line already dropped them
- the extracted /messagecontrol route has no flex parent for the panel to
  grow into, so the stage collapsed to its minimum instead of filling the
  window
- a tall panel caps the stage at its own width, and the slack it leaves now
  sits either side of the stage rather than all below it

Covers the screen state controls in the e2e spec: the secondary source
select puts the typed text on the stage, blackout reaches the timer view,
and clear screen resets the state while keeping the text.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011CHxSQ6nWHuyar8feieRra

apps/client/src/features/control/message/TimerPreview.module.scss

@@ -3,6 +3,8 @@
   min-height: 0;
   display: flex;
   flex-direction: column;
+  /* the stage caps at the panel width, so centre whatever slack a tall panel leaves */
+  justify-content: center;
   gap: $element-inner-spacing;
 }