feat(media): loop mode + high-quality OggOpus music playback

- Loop: toggle via POST /api/media/loop → COMMAND_MEDIA_LOOP; gateway
  replays finished music track on natural end (queue untouched); status
  payload exposes loop flag; FE tombol Loop di music-player + mini-player.
- Kualitas suara: music playback sekarang di-transcode sekali via ffmpeg ke
  OggOpus 48kHz stereo 192kbps dengan volume di-bake ke encode — menghindari
  double lossy encode (inlineVolume) yang bikin suara buram. Screen share
  tetap pakai jalur lama.
- Backend: MediaState.loop, setLoop service, route + schema validation.

services/frontend/src/lib/api/media.ts

@@ -7,4 +7,5 @@ export const mediaApi = {
     api.post<MediaState>("/api/media/queue", { source, mode }),
   skip: () => api.post<MediaState>("/api/media/skip", {}),
   stop: () => api.post<MediaState>("/api/media/stop", {}),
+  loop: (loop: boolean) => api.post<MediaState>("/api/media/loop", { loop }),
 };

services/frontend/src/lib/hooks/use-media-player.tsx

@@ -20,6 +20,8 @@ interface MediaPlayerContextValue {
   current: MediaItem | null;
   /** Upcoming queue */
   queue: MediaItem[];
+  /** Loop mode (replay current track on natural end) */
+  loop: boolean;
   /** True while a mutation is in flight */
   pending: boolean;
 
@@ -27,6 +29,8 @@ interface MediaPlayerContextValue {
   skip: () => void;
   /** Stop playback */
   stop: () => void;
+  /** Toggle loop mode */
+  toggleLoop: () => void;
   /** Queue a URL for playback */
   queueUrl: (url: string) => void;
 }
@@ -38,6 +42,7 @@ export function MediaPlayerProvider({ children }: { children: ReactNode }) {
   const [state, setState] = useState<MediaState>({
     playing: false,
     musicVolume: 0.3,
+    loop: false,
     current: null,
     queue: [],
   });
@@ -105,15 +110,30 @@ export function MediaPlayerProvider({ children }: { children: ReactNode }) {
       .finally(() => setPending(false));
   }, []);
 
+  const toggleLoop = useCallback(() => {
+    setPending(true);
+    mediaApi
+      .loop(!state.loop)
+      .then((data) => {
+        if (data) setState(data as MediaState);
+      })
+      .catch(() => {
+        // ignore
+      })
+      .finally(() => setPending(false));
+  }, [state.loop]);
+
   return (
     <MediaPlayerContext.Provider
       value={{
         playing: state.playing,
         current: state.current,
         queue: state.queue,
+        loop: state.loop,
         pending,
         skip,
         stop,
+        toggleLoop,
         queueUrl,
       }}
     >

services/frontend/src/lib/types/media.ts

@@ -13,6 +13,7 @@ export interface MediaState {
   playing: boolean;
   activeMode?: MediaMode | null;
   musicVolume: number;
+  loop: boolean;
   current: MediaItem | null;
   queue: MediaItem[];
 }