fix(media): catch autoplay rejections from play()

Notification sounds called `audio.play()` without handling the promise,
so every message that arrived before the user interacted with the page
(e.g. right after launch) logged an uncaught NotAllowedError — 15 in a
short test run. Same pattern in the video thumbnail loader, the voice
preview (which now also resets its Play button) and useMediaPlay.

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

src/app/components/VoiceMessageRecorder.tsx

@@ -383,7 +383,7 @@ export function VoiceMessageRecorder({ onSend, onError }: VoiceRecorderProps) {
                 audio.pause();
                 setPreviewPlaying(false);
               } else {
-                audio.play();
+                audio.play().catch(() => setPreviewPlaying(false));
                 setPreviewPlaying(true);
               }
             }}

src/app/hooks/media/useMediaPlay.ts

@@ -17,7 +17,7 @@ export const useMediaPlay = (
     (play: boolean) => {
       const targetEl = getTargetElement();
       if (!targetEl) return;
-      if (play) targetEl.play();
+      if (play) targetEl.play().catch(() => undefined);
       else targetEl.pause();
     },
     [getTargetElement],

src/app/pages/client/ClientNonUIFeatures.tsx

@@ -259,7 +259,9 @@ function InviteNotifications() {
 
   const playSound = useCallback(() => {
     const audioElement = audioRef.current;
-    audioElement?.play();
+    // Rejects under the autoplay policy until the user has interacted with the
+    // page (e.g. messages arriving right after launch); nothing to do then.
+    audioElement?.play().catch(() => undefined);
   }, []);
 
   // Arm once the client's initial sync has settled (+ a short grace so the async
@@ -572,7 +574,9 @@ function MessageNotifications() {
 
   const playSound = useCallback(() => {
     const audioElement = audioRef.current;
-    audioElement?.play();
+    // Rejects under the autoplay policy until the user has interacted with the
+    // page (e.g. messages arriving right after launch); nothing to do then.
+    audioElement?.play().catch(() => undefined);
   }, []);
 
   // Shared delivery tail for both the main timeline and per-thread paths:

src/app/utils/dom.ts

@@ -134,7 +134,9 @@ export const loadVideoElement = (url: string): Promise<HTMLVideoElement> =>
 
     video.src = url;
     video.load();
-    video.play();
+    // Only nudges the decoder toward the first frame; `onloadeddata` settles
+    // the promise, so an autoplay refusal here is harmless.
+    video.play().catch(() => undefined);
   });
 
 export const getThumbnailDimensions = (width: number, height: number): [number, number] => {