Fix: Improves Chromecast casting experience

Fixes several issues and improves the overall Chromecast casting experience:

- Implements an AbortController for fetching item data to prevent race conditions.
- Syncs live progress in the mini player more accurately using elapsed real time.
- Prevents event propagation in the mini player's play/pause button.
- Ensures the disconnect callback in the connection menu is always called.
- Retries scrolling in the episode list on failure.
- Handles unmute failures gracefully in volume controls.
- Clamps seek positions to prevent exceeding duration.
- Fixes reporting playback start multiple times
- Improves segment calculation in `useChromecastSegments`
- Prevents race condition with `isPlaying` state in `Controls` component

Also includes minor UI and timing adjustments for a smoother user experience.

utils/segments.ts

@@ -185,38 +185,31 @@ const fetchLegacySegments = async (
   const introSegments: MediaTimeSegment[] = [];
   const creditSegments: MediaTimeSegment[] = [];
 
-  try {
-    const [introRes, creditRes] = await Promise.allSettled([
-      api.axiosInstance.get<IntroTimestamps>(
-        `${api.basePath}/Episode/${itemId}/IntroTimestamps`,
-        { headers: getAuthHeaders(api) },
-      ),
-      api.axiosInstance.get<CreditTimestamps>(
-        `${api.basePath}/Episode/${itemId}/Timestamps`,
-        { headers: getAuthHeaders(api) },
-      ),
-    ]);
+  const [introRes, creditRes] = await Promise.allSettled([
+    api.axiosInstance.get<IntroTimestamps>(
+      `${api.basePath}/Episode/${itemId}/IntroTimestamps`,
+      { headers: getAuthHeaders(api) },
+    ),
+    api.axiosInstance.get<CreditTimestamps>(
+      `${api.basePath}/Episode/${itemId}/Timestamps`,
+      { headers: getAuthHeaders(api) },
+    ),
+  ]);
 
-    if (introRes.status === "fulfilled" && introRes.value.data.Valid) {
-      introSegments.push({
-        startTime: introRes.value.data.IntroStart,
-        endTime: introRes.value.data.IntroEnd,
-        text: "Intro",
-      });
-    }
+  if (introRes.status === "fulfilled" && introRes.value.data.Valid) {
+    introSegments.push({
+      startTime: introRes.value.data.IntroStart,
+      endTime: introRes.value.data.IntroEnd,
+      text: "Intro",
+    });
+  }
 
-    if (
-      creditRes.status === "fulfilled" &&
-      creditRes.value.data.Credits.Valid
-    ) {
-      creditSegments.push({
-        startTime: creditRes.value.data.Credits.Start,
-        endTime: creditRes.value.data.Credits.End,
-        text: "Credits",
-      });
-    }
-  } catch (error) {
-    console.error("Failed to fetch legacy segments", error);
+  if (creditRes.status === "fulfilled" && creditRes.value.data.Credits.Valid) {
+    creditSegments.push({
+      startTime: creditRes.value.data.Credits.Start,
+      endTime: creditRes.value.data.Credits.End,
+      text: "Credits",
+    });
   }
 
   return {