streamit-player 1.0.2 → 1.0.3

package/dist/streamit-player.esm.min.js

@@ -2582,7 +2582,7 @@ const ys = { attribute: !0, type: String, converter: mt, reflect: !1, hasChanged
   }
   throw Error("Unsupported decorator location: " + i);
 };
-function O(c) {
+function F(c) {
   return (e, t) => typeof t == "object" ? bs(c, e, t) : ((i, s, r) => {
     const a = s.hasOwnProperty(r);
     return s.constructor.createProperty(r, i), a ? Object.getOwnPropertyDescriptor(s, r) : void 0;
@@ -2594,7 +2594,7 @@ function O(c) {
  * SPDX-License-Identifier: BSD-3-Clause
  */
 function W(c) {
-  return O({ ...c, state: !0, attribute: !1 });
+  return F({ ...c, state: !0, attribute: !1 });
 }
 /**
  * @license
@@ -2936,7 +2936,7 @@ async function Hi() {
 async function qi() {
   return _e("org.w3.clearkey");
 }
-async function Xr() {
+async function Zr() {
   const [c, e, t, i] = await Promise.all([
     zi(),
     _i(),
@@ -3527,11 +3527,11 @@ const ke = class ke {
         return await b.arrayBuffer();
       const S = await b.text();
       try {
-        const A = JSON.parse(S);
-        if (A.ckc)
-          return this.base64ToArrayBuffer(A.ckc);
-        if (A.license)
-          return this.base64ToArrayBuffer(A.license);
+        const E = JSON.parse(S);
+        if (E.ckc)
+          return this.base64ToArrayBuffer(E.ckc);
+        if (E.license)
+          return this.base64ToArrayBuffer(E.license);
       } catch {
       }
       const T = S.trim();
@@ -3834,42 +3834,42 @@ class Us {
             licenseServers: p,
             emeConfigurations: f,
             licenseXhrSetup: (b, S, T, x) => {
-              var $, M;
-              let A = null, P = "";
-              if (T && T.keySystem && (T.keySystem.includes("widevine") ? (A = d.widevine, P = "widevine") : T.keySystem.includes("playready") ? (A = d.playready, P = "playready") : T.keySystem.includes("clearkey") && (A = d.clearkey, P = "clearkey")), ($ = this.controller) == null || $.dispatchEvent("drmlicenserequest", {
+              var O, M;
+              let E = null, A = "";
+              if (T && T.keySystem && (T.keySystem.includes("widevine") ? (E = d.widevine, A = "widevine") : T.keySystem.includes("playready") ? (E = d.playready, A = "playready") : T.keySystem.includes("clearkey") && (E = d.clearkey, A = "clearkey")), (O = this.controller) == null || O.dispatchEvent("drmlicenserequest", {
                 url: S,
                 challengeSize: x && x.byteLength || 0,
-                system: P || "hls"
-              }), (M = this.drmManager) == null || M.noteLicenseRequest(P || "hls", S), A && (A.headers && Object.entries(A.headers).forEach(([I, R]) => {
-                b.setRequestHeader(I, R);
-              }), A.withCredentials && (b.withCredentials = !0)), A && A.licenseRequestInterceptor) {
+                system: A || "hls"
+              }), (M = this.drmManager) == null || M.noteLicenseRequest(A || "hls", S), E && (E.headers && Object.entries(E.headers).forEach(([I, D]) => {
+                b.setRequestHeader(I, D);
+              }), E.withCredentials && (b.withCredentials = !0)), E && E.licenseRequestInterceptor) {
                 const I = x instanceof Uint8Array ? x.buffer : x;
                 return Promise.resolve(
-                  A.licenseRequestInterceptor(I, P)
-                ).then((R) => {
+                  E.licenseRequestInterceptor(I, A)
+                ).then((D) => {
                   let N = x;
-                  return R instanceof ArrayBuffer ? N = new Uint8Array(R) : R && typeof R == "object" && (R.body instanceof ArrayBuffer ? N = new Uint8Array(R.body) : R.body && (N = R.body), R.headers && Object.entries(R.headers).forEach(([U, C]) => {
-                    b.setRequestHeader(U, C);
+                  return D instanceof ArrayBuffer ? N = new Uint8Array(D) : D && typeof D == "object" && (D.body instanceof ArrayBuffer ? N = new Uint8Array(D.body) : D.body && (N = D.body), D.headers && Object.entries(D.headers).forEach(([P, C]) => {
+                    b.setRequestHeader(P, C);
                   })), N;
                 });
               }
             },
             licenseResponseCallback: (b, S, T) => {
               var M, I;
-              let x = null, A = "";
-              T && T.keySystem && (T.keySystem.includes("widevine") ? (x = d.widevine, A = "widevine") : T.keySystem.includes("playready") ? (x = d.playready, A = "playready") : T.keySystem.includes("clearkey") && (x = d.clearkey, A = "clearkey"));
-              const P = b.response, $ = P && (P.byteLength || P.size) || 0;
+              let x = null, E = "";
+              T && T.keySystem && (T.keySystem.includes("widevine") ? (x = d.widevine, E = "widevine") : T.keySystem.includes("playready") ? (x = d.playready, E = "playready") : T.keySystem.includes("clearkey") && (x = d.clearkey, E = "clearkey"));
+              const A = b.response, O = A && (A.byteLength || A.size) || 0;
               if ((M = this.controller) == null || M.dispatchEvent("drmlicenseresponse", {
                 url: S,
-                responseSize: $,
-                system: A || "hls"
-              }), (I = this.drmManager) == null || I.noteLicenseResponse(A || "hls", S), x && x.licenseResponseInterceptor) {
-                const R = P instanceof ArrayBuffer ? P : P ? P.buffer : new ArrayBuffer(0);
+                responseSize: O,
+                system: E || "hls"
+              }), (I = this.drmManager) == null || I.noteLicenseResponse(E || "hls", S), x && x.licenseResponseInterceptor) {
+                const D = A instanceof ArrayBuffer ? A : A ? A.buffer : new ArrayBuffer(0);
                 return Promise.resolve(
-                  x.licenseResponseInterceptor(R, A)
+                  x.licenseResponseInterceptor(D, E)
                 );
               }
-              return P;
+              return A;
             }
           };
         })().then((f) => {
@@ -3890,10 +3890,10 @@ class Us {
             if (v) {
               const y = v.live, b = v.partTarget !== void 0 && v.partTarget > 0, S = v.partHoldBack !== void 0 && v.partHoldBack > 0, T = v.fragments && v.fragments.some(
                 (I) => I.parts && I.parts.length > 0
-              ), x = y && (b || S || T), A = y ? v.totalduration : 0, P = y && (v.type === "EVENT" || A > 30);
-              this._isLive = y, this._isLowLatency = x, this._dvrWindow = A, this._hasDvr = P;
-              const $ = i.getState(), M = {};
-              $.isLive !== y && (M.isLive = y, y && (M.isAtLiveEdge = !0)), $.isLowLatency !== x && (M.isLowLatency = x), Object.keys(M).length > 0 && i.updateStatePublic(M), i.dispatchEvent("live-status-change", { isLive: y, isLowLatency: x }), y ? (i.updateLiveState(), this.startLivePolling()) : this.stopLivePolling();
+              ), x = y && (b || S || T), E = y ? v.totalduration : 0, A = y && (v.type === "EVENT" || E > 30);
+              this._isLive = y, this._isLowLatency = x, this._dvrWindow = E, this._hasDvr = A;
+              const O = i.getState(), M = {};
+              O.isLive !== y && (M.isLive = y, y && (M.isAtLiveEdge = !0)), O.isLowLatency !== x && (M.isLowLatency = x), Object.keys(M).length > 0 && i.updateStatePublic(M), i.dispatchEvent("live-status-change", { isLive: y, isLowLatency: x }), y ? (i.updateLiveState(), this.startLivePolling()) : this.stopLivePolling();
             }
           }), p.on(r.Events.MANIFEST_PARSED, () => {
             i.dispatchEvent("manifestloaded", { system: "hls", levels: p.levels.length }), this.hlsRetryCount = 0, this.mediaRecoveryCount = 0;
@@ -4408,49 +4408,49 @@ class Ns {
         if (this.controller !== i || !this.player) return;
         if (Object.keys(h).length > 0 && this.player.setProtectionData(h), d) {
           const N = (C) => {
-            var H, le;
-            let E = null, z = "";
+            var _, le;
+            let R = null, H = "";
             const J = C.url || "", B = J.toLowerCase();
-            o.widevine && o.widevine.licenseUrl && B.includes(o.widevine.licenseUrl.toLowerCase()) ? (E = o.widevine, z = "widevine") : o.playready && o.playready.licenseUrl && B.includes(o.playready.licenseUrl.toLowerCase()) ? (E = o.playready, z = "playready") : o.clearkey && o.clearkey.licenseUrl && B.includes(o.clearkey.licenseUrl.toLowerCase()) && (E = o.clearkey, z = "clearkey");
-            const F = C.data && (C.data.byteLength || C.data.length) || 0;
-            if ((H = this.controller) == null || H.dispatchEvent("drmlicenserequest", {
+            o.widevine && o.widevine.licenseUrl && B.includes(o.widevine.licenseUrl.toLowerCase()) ? (R = o.widevine, H = "widevine") : o.playready && o.playready.licenseUrl && B.includes(o.playready.licenseUrl.toLowerCase()) ? (R = o.playready, H = "playready") : o.clearkey && o.clearkey.licenseUrl && B.includes(o.clearkey.licenseUrl.toLowerCase()) && (R = o.clearkey, H = "clearkey");
+            const U = C.data && (C.data.byteLength || C.data.length) || 0;
+            if ((_ = this.controller) == null || _.dispatchEvent("drmlicenserequest", {
               url: J,
-              challengeSize: F,
-              system: z || "dash"
-            }), (le = this.drmManager) == null || le.noteLicenseRequest(z || "dash", J), !E || !E.licenseRequestInterceptor)
+              challengeSize: U,
+              system: H || "dash"
+            }), (le = this.drmManager) == null || le.noteLicenseRequest(H || "dash", J), !R || !R.licenseRequestInterceptor)
               return Promise.resolve();
-            const L = C.data, D = L instanceof Uint8Array ? L.buffer : L;
+            const L = C.data, $ = L instanceof Uint8Array ? L.buffer : L;
             return Promise.resolve(
-              E.licenseRequestInterceptor(D, z)
+              R.licenseRequestInterceptor($, H)
             ).then((oe) => {
               oe instanceof ArrayBuffer ? C.data = oe : oe && typeof oe == "object" && (oe.body && (C.data = oe.body), oe.headers && (C.headers = {
                 ...C.headers,
                 ...oe.headers
               }));
             });
-          }, U = (C) => {
-            var H, le;
-            let E = null, z = "";
+          }, P = (C) => {
+            var _, le;
+            let R = null, H = "";
             const J = C.url || "", B = J.toLowerCase();
-            o.widevine && o.widevine.licenseUrl && B.includes(o.widevine.licenseUrl.toLowerCase()) ? (E = o.widevine, z = "widevine") : o.playready && o.playready.licenseUrl && B.includes(o.playready.licenseUrl.toLowerCase()) ? (E = o.playready, z = "playready") : o.clearkey && o.clearkey.licenseUrl && B.includes(o.clearkey.licenseUrl.toLowerCase()) && (E = o.clearkey, z = "clearkey");
-            const F = C.data && (C.data.byteLength || C.data.length) || 0;
-            if ((H = this.controller) == null || H.dispatchEvent("drmlicenseresponse", {
+            o.widevine && o.widevine.licenseUrl && B.includes(o.widevine.licenseUrl.toLowerCase()) ? (R = o.widevine, H = "widevine") : o.playready && o.playready.licenseUrl && B.includes(o.playready.licenseUrl.toLowerCase()) ? (R = o.playready, H = "playready") : o.clearkey && o.clearkey.licenseUrl && B.includes(o.clearkey.licenseUrl.toLowerCase()) && (R = o.clearkey, H = "clearkey");
+            const U = C.data && (C.data.byteLength || C.data.length) || 0;
+            if ((_ = this.controller) == null || _.dispatchEvent("drmlicenseresponse", {
               url: J,
-              responseSize: F,
-              system: z || "dash"
-            }), (le = this.drmManager) == null || le.noteLicenseResponse(z || "dash", J), !E || !E.licenseResponseInterceptor)
+              responseSize: U,
+              system: H || "dash"
+            }), (le = this.drmManager) == null || le.noteLicenseResponse(H || "dash", J), !R || !R.licenseResponseInterceptor)
               return Promise.resolve();
-            const L = C.data, D = L instanceof Uint8Array ? L.buffer : L;
+            const L = C.data, $ = L instanceof Uint8Array ? L.buffer : L;
             return Promise.resolve(
-              E.licenseResponseInterceptor(D, z)
+              R.licenseResponseInterceptor($, H)
             ).then((oe) => {
               oe instanceof ArrayBuffer && (C.data = oe);
             });
           };
-          this.player.registerLicenseRequestFilter(N), this.player.registerLicenseResponseFilter(U);
+          this.player.registerLicenseRequestFilter(N), this.player.registerLicenseResponseFilter(P);
         }
         this.player.initialize(t, e.src, t.autoplay);
-        const g = r.MediaPlayer && r.MediaPlayer.events || {}, m = g.STREAM_INITIALIZED || "streamInitialized", v = g.QUALITY_CHANGE_RENDERED || "qualityChangeRendered", y = g.TEXT_TRACK_CHANGED || "textTrackChanged", b = g.ERROR || "error", S = g.TRACK_CHANGE_RENDERED || "trackChangeRendered", T = g.EVENT_MODE_ON_RECEIVE || "eventModeOnReceive", x = g.KEY_SYSTEM_SELECTED || "keySystemSelected", A = g.KEY_SESSION_CREATED || "keySessionCreated", P = g.KEY_SESSION_CLOSED || "keySessionClosed", $ = g.KEY_SESSION_REMOVED || "keySessionRemoved", M = g.KEY_STATUSES_CHANGED || "keyStatusesChanged", I = g.KEY_MESSAGE || "keyMessage", R = g.PROTECTION_ERROR || "protectionError";
+        const g = r.MediaPlayer && r.MediaPlayer.events || {}, m = g.STREAM_INITIALIZED || "streamInitialized", v = g.QUALITY_CHANGE_RENDERED || "qualityChangeRendered", y = g.TEXT_TRACK_CHANGED || "textTrackChanged", b = g.ERROR || "error", S = g.TRACK_CHANGE_RENDERED || "trackChangeRendered", T = g.EVENT_MODE_ON_RECEIVE || "eventModeOnReceive", x = g.KEY_SYSTEM_SELECTED || "keySystemSelected", E = g.KEY_SESSION_CREATED || "keySessionCreated", A = g.KEY_SESSION_CLOSED || "keySessionClosed", O = g.KEY_SESSION_REMOVED || "keySessionRemoved", M = g.KEY_STATUSES_CHANGED || "keyStatusesChanged", I = g.KEY_MESSAGE || "keyMessage", D = g.PROTECTION_ERROR || "protectionError";
         this.eventNames = {
           streamInitialized: m,
           qualityChangeRendered: v,
@@ -4459,29 +4459,29 @@ class Ns {
           trackChangeRendered: S,
           eventModeOnReceive: T,
           keySystemSelected: x,
-          keySessionCreated: A,
-          keySessionClosed: P,
-          keySessionRemoved: $,
+          keySessionCreated: E,
+          keySessionClosed: A,
+          keySessionRemoved: O,
           keyStatusesChanged: M,
           keyMessage: I,
-          protectionError: R
-        }, a.on(S, this.handleTrackChangeRendered), a.on(m, this.handleStreamInitialized), a.on(v, this.handleQualityChangeRendered), a.on(y, this.handleTextTrackChanged), a.on(b, this.handleError), a.on(x, this.handleKeySystemSelected), a.on(A, this.handleKeySessionCreated), a.on(P, this.handleKeySessionClosed), a.on($, this.handleKeySessionRemoved), a.on(M, this.handleKeyStatusesChanged), a.on(I, this.handleKeyMessage), a.on(R, this.handleProtectionError), a.on(
+          protectionError: D
+        }, a.on(S, this.handleTrackChangeRendered), a.on(m, this.handleStreamInitialized), a.on(v, this.handleQualityChangeRendered), a.on(y, this.handleTextTrackChanged), a.on(b, this.handleError), a.on(x, this.handleKeySystemSelected), a.on(E, this.handleKeySessionCreated), a.on(A, this.handleKeySessionClosed), a.on(O, this.handleKeySessionRemoved), a.on(M, this.handleKeyStatusesChanged), a.on(I, this.handleKeyMessage), a.on(D, this.handleProtectionError), a.on(
           T,
           (N) => {
             if (!i) return;
-            const U = N.event;
-            U && i.emit("metadata", {
-              timestamp: U.presentationTime || 0,
-              type: U.schemeIdUri || "emsg",
+            const P = N.event;
+            P && i.emit("metadata", {
+              timestamp: P.presentationTime || 0,
+              type: P.schemeIdUri || "emsg",
               sourceProtocol: "dash",
-              rawData: U.messageData || new Uint8Array(),
+              rawData: P.messageData || new Uint8Array(),
               parsedData: {
-                schemeIdUri: U.schemeIdUri,
-                value: U.value,
-                timescale: U.timescale,
-                presentationTime: U.presentationTime,
-                duration: U.duration,
-                id: U.id
+                schemeIdUri: P.schemeIdUri,
+                value: P.value,
+                timescale: P.timescale,
+                presentationTime: P.presentationTime,
+                duration: P.duration,
+                id: P.id
               }
             });
           }
@@ -6067,109 +6067,109 @@ class ki {
         }
         if (T) {
           const M = ee(T, "Ad"), I = [];
-          for (let R = 0; R < M.length; R++) {
-            const N = (h = M[R].textContent) == null ? void 0 : h.trim();
+          for (let D = 0; D < M.length; D++) {
+            const N = (h = M[D].textContent) == null ? void 0 : h.trim();
             N && (N.startsWith("http://") || N.startsWith("https://")) && I.push(N);
           }
           if (I.length > 0) {
-            const R = [];
+            const D = [];
             for (let N = 0; N < I.length; N++)
               try {
-                const U = await this.fetchVastXml(I[N], d, (u = this.context.config) == null ? void 0 : u.request), C = It(U);
+                const P = await this.fetchVastXml(I[N], d, (u = this.context.config) == null ? void 0 : u.request), C = It(P);
                 if (C) {
-                  const E = G(C, "Inline"), z = G(C, "Wrapper");
-                  if (E) {
+                  const R = G(C, "Inline"), H = G(C, "Wrapper");
+                  if (R) {
                     const J = ee(C, "Ad");
                     for (let B = 0; B < J.length; B++) {
-                      const F = this.normalizeAdNode(J[B], R.length + 1, I.length);
-                      F && R.push(F);
+                      const U = this.normalizeAdNode(J[B], D.length + 1, I.length);
+                      U && D.push(U);
                     }
-                  } else if (z) {
+                  } else if (H) {
                     const J = G(C, "VASTAdTagURI");
                     if (J && J.textContent) {
-                      const B = await this.fetchVastXml(J.textContent.trim(), d, (f = this.context.config) == null ? void 0 : f.request), F = It(B);
-                      if (F) {
-                        const L = ee(F, "Ad");
-                        for (let D = 0; D < L.length; D++) {
-                          const H = this.normalizeAdNode(L[D], R.length + 1, I.length);
-                          H && R.push(H);
+                      const B = await this.fetchVastXml(J.textContent.trim(), d, (f = this.context.config) == null ? void 0 : f.request), U = It(B);
+                      if (U) {
+                        const L = ee(U, "Ad");
+                        for (let $ = 0; $ < L.length; $++) {
+                          const _ = this.normalizeAdNode(L[$], D.length + 1, I.length);
+                          _ && D.push(_);
                         }
                       }
                     }
                   }
                 }
-              } catch (U) {
-                console.warn(`[VastProvider] Failed to fetch playlist ad #${N + 1}:`, U);
+              } catch (P) {
+                console.warn(`[VastProvider] Failed to fetch playlist ad #${N + 1}:`, P);
               }
-            if (R.length > 0) {
-              R.sort(
-                (C, E) => (C.sequence ?? Number.MAX_SAFE_INTEGER) - (E.sequence ?? Number.MAX_SAFE_INTEGER)
+            if (D.length > 0) {
+              D.sort(
+                (C, R) => (C.sequence ?? Number.MAX_SAFE_INTEGER) - (R.sequence ?? Number.MAX_SAFE_INTEGER)
               );
-              const N = R[0];
+              const N = D[0];
               this.currentAd = N, this.currentAdIndex = 0;
-              const U = {
+              const P = {
                 id: `vast-break-${Date.now()}`,
                 timeOffset: 0,
                 type: "preroll",
-                ads: R,
-                duration: R.reduce((C, E) => C + (E.duration || 0), 0)
+                ads: D,
+                duration: D.reduce((C, R) => C + (R.duration || 0), 0)
               };
-              return this.currentAdBreak = U, this.manager.getAdBreakManager().registerBreak(U), this.manager.setCurrentAd(N), this.manager.transitionTo(w.LOADED), { success: !0 };
+              return this.currentAdBreak = P, this.manager.getAdBreakManager().registerBreak(P), this.manager.setCurrentAd(N), this.manager.transitionTo(w.LOADED), { success: !0 };
             }
           }
         }
-        const x = ge(), A = this.validateVastStructure(b);
-        if (this.diagnostics.validationDurationMs += ge() - x, A && !T)
-          throw new Error(`VAST Validation Failure: ${A}`);
+        const x = ge(), E = this.validateVastStructure(b);
+        if (this.diagnostics.validationDurationMs += ge() - x, E && !T)
+          throw new Error(`VAST Validation Failure: ${E}`);
         if (G(b, "Inline")) {
           const M = ge(), I = ee(b, "Ad");
           this.diagnostics.podCount = I.length;
-          const R = [];
-          for (let E = 0; E < I.length; E++) {
-            const z = I[E], J = this.normalizeAdNode(z, E + 1, I.length) || this.normalizeNonLinearAdNode(z, E + 1, I.length) || this.normalizeCompanionOnlyAdNode(z, E + 1, I.length);
-            J && R.push(J);
+          const D = [];
+          for (let R = 0; R < I.length; R++) {
+            const H = I[R], J = this.normalizeAdNode(H, R + 1, I.length) || this.normalizeNonLinearAdNode(H, R + 1, I.length) || this.normalizeCompanionOnlyAdNode(H, R + 1, I.length);
+            J && D.push(J);
           }
-          if (R.length === 0)
+          if (D.length === 0)
             throw new Error("No compatible ad or creative found in inline VAST.");
-          let N = R;
-          (n.length || l.length || o.length) && (N = N.map((E) => ({
-            ...E,
-            impressionUrls: [...E.impressionUrls || [], ...n],
-            errorUrls: [...E.errorUrls || [], ...l],
-            trackingUrls: [...E.trackingUrls || [], ...o]
+          let N = D;
+          (n.length || l.length || o.length) && (N = N.map((R) => ({
+            ...R,
+            impressionUrls: [...R.impressionUrls || [], ...n],
+            errorUrls: [...R.errorUrls || [], ...l],
+            trackingUrls: [...R.trackingUrls || [], ...o]
           }))), N = [...N].sort(
-            (E, z) => (E.sequence ?? Number.MAX_SAFE_INTEGER) - (z.sequence ?? Number.MAX_SAFE_INTEGER)
+            (R, H) => (R.sequence ?? Number.MAX_SAFE_INTEGER) - (H.sequence ?? Number.MAX_SAFE_INTEGER)
           ), this.diagnostics.parseDurationMs += ge() - M;
-          const U = N[0];
-          this.currentAd = U, this.currentAdIndex = 0;
+          const P = N[0];
+          this.currentAd = P, this.currentAdIndex = 0;
           const C = {
             id: `vast-break-${Date.now()}`,
             timeOffset: 0,
             type: "preroll",
             ads: N,
-            duration: N.reduce((E, z) => E + (z.duration || 0), 0)
+            duration: N.reduce((R, H) => R + (H.duration || 0), 0)
           };
-          return this.currentAdBreak = C, this.manager.getAdBreakManager().registerBreak(C), this.manager.setCurrentAd(U), this.manager.transitionTo(w.LOADED), { success: !0 };
+          return this.currentAdBreak = C, this.manager.getAdBreakManager().registerBreak(C), this.manager.setCurrentAd(P), this.manager.transitionTo(w.LOADED), { success: !0 };
         }
-        const $ = G(b, "Wrapper");
-        if ($) {
+        const O = G(b, "Wrapper");
+        if (O) {
           const M = G(b, "VASTAdTagURI");
           if (!M || !M.textContent)
             throw new Error("VAST wrapper is missing VASTAdTagURI node.");
-          const I = ee($, "Impression");
-          for (let U = 0; U < I.length; U++) {
-            const C = (p = I[U].textContent) == null ? void 0 : p.trim();
+          const I = ee(O, "Impression");
+          for (let P = 0; P < I.length; P++) {
+            const C = (p = I[P].textContent) == null ? void 0 : p.trim();
             C && n.push(C);
           }
-          const R = ee($, "Error");
-          for (let U = 0; U < R.length; U++) {
-            const C = (g = R[U].textContent) == null ? void 0 : g.trim();
+          const D = ee(O, "Error");
+          for (let P = 0; P < D.length; P++) {
+            const C = (g = D[P].textContent) == null ? void 0 : g.trim();
             C && l.push(C);
           }
-          const N = ee($, "Tracking");
-          for (let U = 0; U < N.length; U++) {
-            const C = N[U], E = C.getAttribute("event") || "", z = (m = C.textContent) == null ? void 0 : m.trim();
-            z && E && o.push({ url: z, event: E });
+          const N = ee(O, "Tracking");
+          for (let P = 0; P < N.length; P++) {
+            const C = N[P], R = C.getAttribute("event") || "", H = (m = C.textContent) == null ? void 0 : m.trim();
+            H && R && o.push({ url: H, event: R });
           }
           r = M.textContent.trim(), a++;
           continue;
@@ -6233,54 +6233,54 @@ class ki {
       const Y = S[q], ue = Y.getAttribute("event") || "", ve = (lt = Y.textContent) == null ? void 0 : lt.trim();
       ve && ue && T.push({ url: ve, event: ue });
     }
-    const x = G(u, "ClickThrough"), A = (re = x == null ? void 0 : x.textContent) == null ? void 0 : re.trim(), P = ee(s, "Impression"), $ = [];
-    for (let q = 0; q < P.length; q++) {
-      const Y = (Tt = P[q].textContent) == null ? void 0 : Tt.trim();
-      Y && $.push(Y);
+    const x = G(u, "ClickThrough"), E = (re = x == null ? void 0 : x.textContent) == null ? void 0 : re.trim(), A = ee(s, "Impression"), O = [];
+    for (let q = 0; q < A.length; q++) {
+      const Y = (Tt = A[q].textContent) == null ? void 0 : Tt.trim();
+      Y && O.push(Y);
     }
     const M = ee(u, "ClickTracking"), I = [];
     for (let q = 0; q < M.length; q++) {
       const Y = (xt = M[q].textContent) == null ? void 0 : xt.trim();
       Y && I.push(Y);
     }
-    const R = ee(e, "Error");
-    if (R.length === 0) {
+    const D = ee(e, "Error");
+    if (D.length === 0) {
       const q = ee(e.ownerDocument, "Error");
       for (let Y = 0; Y < q.length; Y++)
-        ((ct = q[Y].textContent) == null ? void 0 : ct.trim()) && R.push(q[Y]);
+        ((ct = q[Y].textContent) == null ? void 0 : ct.trim()) && D.push(q[Y]);
     }
     const N = [];
-    for (let q = 0; q < R.length; q++) {
-      const Y = (We = R[q].textContent) == null ? void 0 : We.trim();
+    for (let q = 0; q < D.length; q++) {
+      const Y = (We = D[q].textContent) == null ? void 0 : We.trim();
       Y && N.push(Y);
     }
-    let U = null;
+    let P = null;
     const C = G(s, "UniversalAdId");
-    C && (U = {
+    C && (P = {
       idRegistry: C.getAttribute("idRegistry") || "unknown",
       value: ((be = C.textContent) == null ? void 0 : be.trim()) || ""
     });
-    const E = [], z = ee(s, "Extension");
-    for (let q = 0; q < Math.min(z.length, this.limits.maxExtensions); q++)
-      E.push(Ws(z[q]));
+    const R = [], H = ee(s, "Extension");
+    for (let q = 0; q < Math.min(H.length, this.limits.maxExtensions); q++)
+      R.push(Ws(H[q]));
     const J = [], B = ee(s, "Verification");
     for (let q = 0; q < B.length; q++) {
       const Y = B[q], ue = Y.getAttribute("vendor") || "", ve = ((V = (Fe = G(Y, "JavaScriptResource")) == null ? void 0 : Fe.textContent) == null ? void 0 : V.trim()) || "";
       ve && J.push({ vendor: ue, script: ve });
     }
-    let F = ((ce = (ie = G(u, "InteractiveCreativeFile")) == null ? void 0 : ie.textContent) == null ? void 0 : ce.trim()) || null;
-    if (F || (F = ((je = (Ee = G(s, "InteractiveCreativeFile")) == null ? void 0 : Ee.textContent) == null ? void 0 : je.trim()) || null), !F)
+    let U = ((ce = (ie = G(u, "InteractiveCreativeFile")) == null ? void 0 : ie.textContent) == null ? void 0 : ce.trim()) || null;
+    if (U || (U = ((je = (Ee = G(s, "InteractiveCreativeFile")) == null ? void 0 : Ee.textContent) == null ? void 0 : je.trim()) || null), !U)
       for (let q = 0; q < p.length; q++) {
         const Y = p[q], ue = ((Zt = Y.getAttribute("apiFramework")) == null ? void 0 : Zt.toUpperCase()) || "", ve = ((Jt = Y.getAttribute("type")) == null ? void 0 : Jt.toLowerCase()) || "";
         if (ue === "SIMID" || ve === "text/html") {
           const Ue = (ei = Y.textContent) == null ? void 0 : ei.trim();
           if (Ue && (Ue.startsWith("http://") || Ue.startsWith("https://"))) {
-            F = Ue;
+            U = Ue;
             break;
           }
         }
       }
-    const L = G(u, "Mezzanine"), D = ((ti = L == null ? void 0 : L.textContent) == null ? void 0 : ti.trim()) || null, H = e.getAttribute("sequence"), le = H ? parseInt(H, 10) : void 0, oe = e.getAttribute("id") || `vast-${Date.now()}`, Te = ee(s, "Companion"), xe = [];
+    const L = G(u, "Mezzanine"), $ = ((ti = L == null ? void 0 : L.textContent) == null ? void 0 : ti.trim()) || null, _ = e.getAttribute("sequence"), le = _ ? parseInt(_, 10) : void 0, oe = e.getAttribute("id") || `vast-${Date.now()}`, Te = ee(s, "Companion"), xe = [];
     for (let q = 0; q < Te.length; q++) {
       const Y = this.normalizeCompanionNode(Te[q], e, q + 1, Te.length);
       Y && xe.push(Y);
@@ -6295,20 +6295,20 @@ class ki {
       linear: !0,
       skippable: y,
       skipOffset: b,
-      clickThroughUrl: A,
+      clickThroughUrl: E,
       trackingUrls: T,
-      impressionUrls: $,
+      impressionUrls: O,
       clickTrackingUrls: I,
       errorUrls: N,
       contentType: m.contentType,
       mediaUrl: m.url,
       creativeId: f,
       adSystem: l,
-      universalAdId: U,
-      extensions: E,
+      universalAdId: P,
+      extensions: R,
       adVerifications: J,
-      interactiveCreativeFile: F,
-      mezzanine: D,
+      interactiveCreativeFile: U,
+      mezzanine: $,
       sequence: le,
       podPosition: t,
       podSize: i,
@@ -6317,15 +6317,15 @@ class ki {
     };
   }
   normalizeNonLinearAdNode(e, t, i) {
-    var $, M, I, R, N, U;
+    var O, M, I, D, N, P;
     const s = G(e, "Inline");
     if (!s) return null;
-    const r = G(s, "AdTitle"), a = (($ = r == null ? void 0 : r.textContent) == null ? void 0 : $.trim()) || "VAST Ad", n = G(s, "AdSystem"), l = ((M = n == null ? void 0 : n.textContent) == null ? void 0 : M.trim()) || "Unknown", o = ee(s, "Creative");
+    const r = G(s, "AdTitle"), a = ((O = r == null ? void 0 : r.textContent) == null ? void 0 : O.trim()) || "VAST Ad", n = G(s, "AdSystem"), l = ((M = n == null ? void 0 : n.textContent) == null ? void 0 : M.trim()) || "Unknown", o = ee(s, "Creative");
     let d = null, h = "";
     for (let C = 0; C < o.length; C++) {
-      const E = o[C], z = G(E, "NonLinear");
-      if (z) {
-        d = z, h = E.getAttribute("id") || "";
+      const R = o[C], H = G(R, "NonLinear");
+      if (H) {
+        d = H, h = R.getAttribute("id") || "";
         break;
       }
     }
@@ -6338,18 +6338,18 @@ class ki {
       ), null;
     const f = parseInt(d.getAttribute("width") || "0", 10) || void 0, p = parseInt(d.getAttribute("height") || "0", 10) || void 0, g = ht(d.getAttribute("minSuggestedDuration")), m = G(d, "NonLinearClickThrough"), v = (I = m == null ? void 0 : m.textContent) == null ? void 0 : I.trim(), y = ee(d, "Tracking"), b = [];
     for (let C = 0; C < y.length; C++) {
-      const E = y[C], z = E.getAttribute("event") || "", J = (R = E.textContent) == null ? void 0 : R.trim();
-      J && z && b.push({ url: J, event: z });
+      const R = y[C], H = R.getAttribute("event") || "", J = (D = R.textContent) == null ? void 0 : D.trim();
+      J && H && b.push({ url: J, event: H });
     }
     const S = ee(s, "Impression"), T = [];
     for (let C = 0; C < S.length; C++) {
-      const E = (N = S[C].textContent) == null ? void 0 : N.trim();
-      E && T.push(E);
+      const R = (N = S[C].textContent) == null ? void 0 : N.trim();
+      R && T.push(R);
     }
-    const x = ee(e, "Error"), A = [];
+    const x = ee(e, "Error"), E = [];
     for (let C = 0; C < x.length; C++) {
-      const E = (U = x[C].textContent) == null ? void 0 : U.trim();
-      E && A.push(E);
+      const R = (P = x[C].textContent) == null ? void 0 : P.trim();
+      R && E.push(R);
     }
     return {
       id: e.getAttribute("id") || `vast-nonlinear-${Date.now()}`,
@@ -6362,7 +6362,7 @@ class ki {
       clickThroughUrl: v,
       trackingUrls: b,
       impressionUrls: T,
-      errorUrls: A,
+      errorUrls: E,
       creativeId: h,
       adSystem: l,
       podPosition: t,
@@ -6411,19 +6411,19 @@ class ki {
     if (r.length === 0) return null;
     const a = [];
     for (let x = 0; x < r.length; x++) {
-      const A = this.normalizeCompanionNode(r[x], e, x + 1, r.length);
-      A && a.push(A);
+      const E = this.normalizeCompanionNode(r[x], e, x + 1, r.length);
+      E && a.push(E);
     }
     if (a.length === 0) return null;
     const n = G(s, "AdTitle"), l = ((y = n == null ? void 0 : n.textContent) == null ? void 0 : y.trim()) || "VAST Ad", o = G(s, "AdSystem"), d = ((b = o == null ? void 0 : o.textContent) == null ? void 0 : b.trim()) || "Unknown", h = ee(s, "Impression"), u = [];
     for (let x = 0; x < h.length; x++) {
-      const A = (S = h[x].textContent) == null ? void 0 : S.trim();
-      A && u.push(A);
+      const E = (S = h[x].textContent) == null ? void 0 : S.trim();
+      E && u.push(E);
     }
     const f = ee(e, "Error"), p = [];
     for (let x = 0; x < f.length; x++) {
-      const A = (T = f[x].textContent) == null ? void 0 : T.trim();
-      A && p.push(A);
+      const E = (T = f[x].textContent) == null ? void 0 : T.trim();
+      E && p.push(E);
     }
     const g = e.getAttribute("sequence"), m = g ? parseInt(g, 10) : void 0;
     return {
@@ -6462,8 +6462,8 @@ class ki {
         r++;
         const p = parseInt(u.getAttribute("width") || "0", 10) || void 0, g = parseInt(u.getAttribute("height") || "0", 10) || void 0, m = ht(u.getAttribute("minSuggestedDuration")), v = G(u, "NonLinearClickThrough"), y = (a = v == null ? void 0 : v.textContent) == null ? void 0 : a.trim(), b = ee(u, "Tracking"), S = [];
         for (let x = 0; x < b.length; x++) {
-          const A = b[x], P = A.getAttribute("event") || "", $ = (n = A.textContent) == null ? void 0 : n.trim();
-          $ && P && S.push({ url: $, event: P });
+          const E = b[x], A = E.getAttribute("event") || "", O = (n = E.textContent) == null ? void 0 : n.trim();
+          O && A && S.push({ url: O, event: A });
         }
         const T = u.getAttribute("id") || `${t.getAttribute("id") || "vast"}-nonlinear-${r}`;
         s.push({
@@ -11775,7 +11775,7 @@ class Sr {
       }
   }
 }
-class Yr {
+class Jr {
   /**
    * Performs an automated validation of the player's DRM state.
    */
@@ -12231,10 +12231,10 @@ const Kt = class Kt extends fe {
 Kt.styles = wr;
 let qe = Kt;
 Gi([
-  O({ type: Boolean, reflect: !0 })
+  F({ type: Boolean, reflect: !0 })
 ], qe.prototype, "playing");
 Gi([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], qe.prototype, "player");
 if (typeof window < "u" && typeof customElements < "u" && (customElements.get("streamit-play-button") || customElements.define("streamit-play-button", qe), !customElements.get("player-play-button"))) {
   class c extends qe {
@@ -12321,13 +12321,13 @@ const Wt = class Wt extends fe {
 Wt.styles = Mr;
 let Re = Wt;
 Ht([
-  O({ type: String })
+  F({ type: String })
 ], Re.prototype, "direction");
 Ht([
-  O({ type: Number })
+  F({ type: Number })
 ], Re.prototype, "amount");
 Ht([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], Re.prototype, "player");
 if (typeof window < "u" && typeof customElements < "u" && (customElements.get("streamit-seek-button") || customElements.define("streamit-seek-button", Re), !customElements.get("player-seek-button"))) {
   class c extends Re {
@@ -12963,41 +12963,41 @@ const jt = class jt extends fe {
     }, 60));
   }
   computeTooltipPosition(e) {
-    var A;
+    var E;
     const { hostRect: t, trackRect: i } = this.getInteractiveRects();
     if (!i || !t) return;
     const s = (e - i.left) / i.width, r = Math.max(0, Math.min(s, 1)), { isInteractive: a } = this.getTimelineRange();
     if (!a)
       return;
-    const n = i.left - t.left + r * i.width, l = (A = this.renderRoot) == null ? void 0 : A.querySelector(".hover-tooltip");
+    const n = i.left - t.left + r * i.width, l = (E = this.renderRoot) == null ? void 0 : E.querySelector(".hover-tooltip");
     let o = 0;
     if (l)
       if (l.offsetWidth > 0)
         o = l.offsetWidth;
       else {
-        const P = l.getBoundingClientRect();
-        P.width > 0 && (o = P.width);
+        const A = l.getBoundingClientRect();
+        A.width > 0 && (o = A.width);
       }
     const d = !!this.activeThumbnail || this.isThumbnailLoading;
     if (o === 0) {
-      const P = d ? this.variant === "vertical" ? 94 : 204 : 50;
-      o = window.innerWidth <= 480 ? P * 0.85 : P;
+      const A = d ? this.variant === "vertical" ? 94 : 204 : 50;
+      o = window.innerWidth <= 480 ? A * 0.85 : A;
     }
     const h = o / 2;
     let u = this.player || null;
     if (!u) {
-      const P = this.getRootNode();
-      P instanceof ShadowRoot && P.host && (u = P.host);
+      const A = this.getRootNode();
+      A instanceof ShadowRoot && A.host && (u = A.host);
     }
     u || (u = this.parentElement || this.offsetParent);
     let f = 0, p = t.width;
     if (u) {
-      const P = u.getBoundingClientRect();
-      P.width > 0 && (f = Math.min(0, P.left - t.left), p = Math.max(t.width, P.right - t.left));
+      const A = u.getBoundingClientRect();
+      A.width > 0 && (f = Math.min(0, A.left - t.left), p = Math.max(t.width, A.right - t.left));
     }
     if (typeof window < "u") {
-      const P = -t.left, $ = window.innerWidth - t.left;
-      f = Math.max(f, P), p = Math.min(p, $);
+      const A = -t.left, O = window.innerWidth - t.left;
+      f = Math.max(f, A), p = Math.min(p, O);
     }
     const g = 3, m = f + h + g, v = p - h - g;
     this.tooltipLeft = Math.max(
@@ -13041,8 +13041,8 @@ const jt = class jt extends fe {
     let o = pe.percentToTime(s * 100, r, a);
     this.hoverTime = o, this.isDragging && (this.dragTime = o), this.computeTooltipPosition(e), this.computeActiveMarker(o);
     const d = s <= 5e-3 || s >= 0.995, h = (T) => {
-      var x, A, P, $, M, I;
-      return ((A = (x = this.player) == null ? void 0 : x.controllerInstance) == null ? void 0 : A.isPreciseSeekEnabled()) === !1 ? !1 : T.type === "chapter" ? (($ = (P = this.player) == null ? void 0 : P.controllerInstance) == null ? void 0 : $.shouldSnapToChapters()) !== !1 : ((I = (M = this.player) == null ? void 0 : M.controllerInstance) == null ? void 0 : I.shouldSnapToMarkers()) !== !1;
+      var x, E, A, O, M, I;
+      return ((E = (x = this.player) == null ? void 0 : x.controllerInstance) == null ? void 0 : E.isPreciseSeekEnabled()) === !1 ? !1 : T.type === "chapter" ? ((O = (A = this.player) == null ? void 0 : A.controllerInstance) == null ? void 0 : O.shouldSnapToChapters()) !== !1 : ((I = (M = this.player) == null ? void 0 : M.controllerInstance) == null ? void 0 : I.shouldSnapToMarkers()) !== !1;
     };
     !d && this.activeMarker && h(this.activeMarker) && (o = this.activeMarker.time, this.hoverTime = o);
     const u = ((y = (v = this.player) == null ? void 0 : v.controllerInstance) == null ? void 0 : y.isSmartSeekEnabled()) === !1, f = (S = (b = this.player) == null ? void 0 : b.config) == null ? void 0 : S.smartSeek, p = u || f && typeof f == "object" && f.thumbnails === !1, g = u || f && typeof f == "object" && f.storyboard === !1, m = p || g || this.thumbnailProvider && typeof this.thumbnailProvider.isUnavailable == "function" && this.thumbnailProvider.isUnavailable();
@@ -13050,38 +13050,38 @@ const jt = class jt extends fe {
       if (this.thumbnailProvider && !m) {
         if (this.isPreciseSeeking) {
           const x = Math.round(o);
-          let A = this.activeFilmstripThumbnail || null;
-          if (!A && typeof this.thumbnailProvider.getNearestCachedThumbnail == "function") {
-            const P = this.thumbnailProvider.getNearestCachedThumbnail(x);
-            P && P.time !== void 0 && Math.abs(P.time - x) <= 5 && (A = P);
+          let E = this.activeFilmstripThumbnail || null;
+          if (!E && typeof this.thumbnailProvider.getNearestCachedThumbnail == "function") {
+            const A = this.thumbnailProvider.getNearestCachedThumbnail(x);
+            A && A.time !== void 0 && Math.abs(A.time - x) <= 5 && (E = A);
           }
-          A ? (this.activeThumbnail = A, this.lastSuccessfulThumbnail = A, this.isThumbnailLoading = !1) : (this.activeThumbnail = null, this.isThumbnailLoading = !0);
+          E ? (this.activeThumbnail = E, this.lastSuccessfulThumbnail = E, this.isThumbnailLoading = !1) : (this.activeThumbnail = null, this.isThumbnailLoading = !0);
           return;
         }
         const T = ++this.latestThumbnailRequestId;
         try {
           const x = this.thumbnailProvider.getThumbnail(o);
           if (x instanceof Promise) {
-            let A = null;
+            let E = null;
             if (typeof this.thumbnailProvider.getNearestCachedThumbnail == "function") {
-              const $ = this.thumbnailProvider.getNearestCachedThumbnail(o);
-              if ($ && $.time !== void 0) {
-                const M = Math.abs($.time - o), I = Math.max(15, n * 0.05);
-                M <= I && (A = $);
+              const O = this.thumbnailProvider.getNearestCachedThumbnail(o);
+              if (O && O.time !== void 0) {
+                const M = Math.abs(O.time - o), I = Math.max(15, n * 0.05);
+                M <= I && (E = O);
               }
             }
-            if (A)
-              this.activeThumbnail = A;
+            if (E)
+              this.activeThumbnail = E;
             else if (this.activeThumbnail && this.activeThumbnail.time !== void 0) {
-              const $ = Math.abs(this.activeThumbnail.time - o), M = Math.max(15, n * 0.05);
-              $ > M && (this.activeThumbnail = null);
+              const O = Math.abs(this.activeThumbnail.time - o), M = Math.max(15, n * 0.05);
+              O > M && (this.activeThumbnail = null);
             } else if (this.activeThumbnail = this.lastSuccessfulThumbnail || null, this.activeThumbnail && this.activeThumbnail.time !== void 0) {
-              const $ = Math.abs(this.activeThumbnail.time - o), M = Math.max(15, n * 0.05);
-              $ > M && (this.activeThumbnail = null);
+              const O = Math.abs(this.activeThumbnail.time - o), M = Math.max(15, n * 0.05);
+              O > M && (this.activeThumbnail = null);
             }
             this.isThumbnailLoading = !0;
-            const P = await x.catch(($) => (console.debug("[Seekbar] Exception caught during thumbnail fetch (async):", $), null));
-            T === this.latestThumbnailRequestId && (this.isHovered || this.isDragging) && (P ? (this.activeThumbnail = P, this.lastSuccessfulThumbnail = P) : this.activeThumbnail = this.lastSuccessfulThumbnail || null, this.isThumbnailLoading = !1);
+            const A = await x.catch((O) => (console.debug("[Seekbar] Exception caught during thumbnail fetch (async):", O), null));
+            T === this.latestThumbnailRequestId && (this.isHovered || this.isDragging) && (A ? (this.activeThumbnail = A, this.lastSuccessfulThumbnail = A) : this.activeThumbnail = this.lastSuccessfulThumbnail || null, this.isThumbnailLoading = !1);
           } else
             T === this.latestThumbnailRequestId && (this.activeThumbnail = x, x && (this.lastSuccessfulThumbnail = x), this.isThumbnailLoading = !1);
         } catch (x) {
@@ -13132,11 +13132,11 @@ const jt = class jt extends fe {
     ));
   }
   render() {
-    var $, M, I, R, N, U, C, E, z, J, B, F;
-    const { start: e, end: t, range: i, isInteractive: s } = this.getTimelineRange(), r = this.player ? this.player.localize("live", "LIVE") : "LIVE", a = this.player ? this.player.localize("preciseSeeking", "Precise seeking") : "Precise seeking", n = this.player ? this.player.localize("pullUpForPreciseSeeking", "Pull up for precise seeking") : "Pull up for precise seeking", l = ((M = ($ = this.player) == null ? void 0 : $.controllerInstance) == null ? void 0 : M.isMarkersEnabled()) !== !1, o = (R = (I = this.player) == null ? void 0 : I.config) == null ? void 0 : R.smartSeek, d = ((U = (N = this.player) == null ? void 0 : N.controllerInstance) == null ? void 0 : U.isSmartSeekEnabled()) !== !1 && (o === void 0 || typeof o != "object" || o.hoverTime !== !1), h = l && !(this.isLive && !this.canSeekInDvr) && this.markers ? this.markers.filter((L) => {
-      const D = !this.visibleMarkerTypes || this.visibleMarkerTypes.includes(L.type), H = L.time >= e && L.time <= t;
-      return D && H;
-    }) : [], u = ((E = (C = this.player) == null ? void 0 : C.controllerInstance) == null ? void 0 : E.isSmoothDraggingEnabled()) !== !1, f = u ? "transition: width 0.05s ease-out;" : "", p = u ? "transition: left 0.05s ease-out;" : "", g = this.isDragging ? this.dragTime : this.currentTime, m = this.isLive && (!this.canSeekInDvr || this.isAtLiveEdge) ? 100 : this.paused && this.frozenPercent !== null && !this.isDragging ? this.frozenPercent : i > 0 ? pe.timeToPercent(g, e, t) : 0, v = this.getBufferedPercent(), y = s && (this.isDragging || this.isHovered || this.isSeeking), b = this.isLive ? i >= 3600 : t >= 3600;
+    var O, M, I, D, N, P, C, R, H, J, B, U;
+    const { start: e, end: t, range: i, isInteractive: s } = this.getTimelineRange(), r = this.player ? this.player.localize("live", "LIVE") : "LIVE", a = this.player ? this.player.localize("preciseSeeking", "Precise seeking") : "Precise seeking", n = this.player ? this.player.localize("pullUpForPreciseSeeking", "Pull up for precise seeking") : "Pull up for precise seeking", l = ((M = (O = this.player) == null ? void 0 : O.controllerInstance) == null ? void 0 : M.isMarkersEnabled()) !== !1, o = (D = (I = this.player) == null ? void 0 : I.config) == null ? void 0 : D.smartSeek, d = ((P = (N = this.player) == null ? void 0 : N.controllerInstance) == null ? void 0 : P.isSmartSeekEnabled()) !== !1 && (o === void 0 || typeof o != "object" || o.hoverTime !== !1), h = l && !(this.isLive && !this.canSeekInDvr) && this.markers ? this.markers.filter((L) => {
+      const $ = !this.visibleMarkerTypes || this.visibleMarkerTypes.includes(L.type), _ = L.time >= e && L.time <= t;
+      return $ && _;
+    }) : [], u = ((R = (C = this.player) == null ? void 0 : C.controllerInstance) == null ? void 0 : R.isSmoothDraggingEnabled()) !== !1, f = u ? "transition: width 0.05s ease-out;" : "", p = u ? "transition: left 0.05s ease-out;" : "", g = this.isDragging ? this.dragTime : this.currentTime, m = this.isLive && (!this.canSeekInDvr || this.isAtLiveEdge) ? 100 : this.paused && this.frozenPercent !== null && !this.isDragging ? this.frozenPercent : i > 0 ? pe.timeToPercent(g, e, t) : 0, v = this.getBufferedPercent(), y = s && (this.isDragging || this.isHovered || this.isSeeking), b = this.isLive ? i >= 3600 : t >= 3600;
     let S = "";
     const T = this.isDragging ? this.dragTime : this.isHovered ? this.hoverTime : this.currentTime;
     if (this.hideCurrentTime && this.hideDuration)
@@ -13154,14 +13154,14 @@ const jt = class jt extends fe {
     if (this.activeThumbnail)
       if (this.variant === "vertical")
         if (this.activeThumbnail.x !== void 0) {
-          const L = this.activeThumbnail.width || 200, D = this.activeThumbnail.height || 112, H = Math.min(90 / L, 160 / D);
+          const L = this.activeThumbnail.width || 200, $ = this.activeThumbnail.height || 112, _ = Math.min(90 / L, 160 / $);
           x = `
             background-image: url('${this.activeThumbnail.url}');
             background-position: -${this.activeThumbnail.x || 0}px -${this.activeThumbnail.y || 0}px;
             width: ${L}px;
-            height: ${D}px;
+            height: ${$}px;
             background-size: auto;
-            transform: translate(-50%, -50%) scale(${H});
+            transform: translate(-50%, -50%) scale(${_});
             position: absolute;
             left: 50%;
             top: 50%;
@@ -13183,7 +13183,7 @@ const jt = class jt extends fe {
           height: ${this.activeThumbnail.y !== void 0 ? `${this.activeThumbnail.height || 112}px` : "100%"};
           background-size: ${this.activeThumbnail.x !== void 0 ? "auto" : "cover"};
         `;
-    const A = ((J = (z = this.player) == null ? void 0 : z.config) == null ? void 0 : J.controls) || {}, P = s && (this.isHovered || this.isDragging) && i > 0 && A.timelinePreview !== !1 && A.hoverTooltip !== !1 && A.tooltip !== !1 && ((F = (B = this.player) == null ? void 0 : B.controllerInstance) == null ? void 0 : F.isSmartSeekEnabled()) !== !1;
+    const E = ((J = (H = this.player) == null ? void 0 : H.config) == null ? void 0 : J.controls) || {}, A = s && (this.isHovered || this.isDragging) && i > 0 && E.timelinePreview !== !1 && E.hoverTooltip !== !1 && E.tooltip !== !1 && ((U = (B = this.player) == null ? void 0 : B.controllerInstance) == null ? void 0 : U.isSmartSeekEnabled()) !== !1;
     return k`
       <div
         part="seekbar-container"
@@ -13195,7 +13195,7 @@ const jt = class jt extends fe {
       >
         <div
           part="hover-tooltip"
-          class="hover-tooltip ${P ? "visible" : ""} ${this.activeThumbnail || this.isThumbnailLoading ? "has-thumbnail" : ""}"
+          class="hover-tooltip ${A ? "visible" : ""} ${this.activeThumbnail || this.isThumbnailLoading ? "has-thumbnail" : ""}"
           style="left: ${this.tooltipLeft}px; --caret-left: calc(50% + ${this.caretOffset}px);"
         >
           ${this.isDragging && this.variant !== "vertical" && !this.isLive && this.thumbnailProvider && !(typeof this.thumbnailProvider.isUnavailable == "function" && this.thumbnailProvider.isUnavailable()) ? k`<div class="precise-seek-label">
@@ -13235,12 +13235,12 @@ const jt = class jt extends fe {
           <div part="buffer-bar" class="buffer-bar" style="width: ${v}%"></div>
           <div part="progress-bar" class="progress-bar" style="width: ${m}%; ${f}"></div>
           ${h.map((L) => {
-      const D = pe.timeToPercent(L.time, e, t), H = L.color ? `background-color: ${L.color};` : "";
+      const $ = pe.timeToPercent(L.time, e, t), _ = L.color ? `background-color: ${L.color};` : "";
       return k`
               <div
                 part="marker marker-${L.type || "default"}"
                 class="marker ${L.type || ""}"
-                style="left: ${D}%; ${H}"
+                style="left: ${$}%; ${_}"
                 @click=${(le) => this.handleMarkerClick(le, L)}
                 @pointerdown=${(le) => le.stopPropagation()}
               >
@@ -13279,64 +13279,64 @@ const jt = class jt extends fe {
 jt.styles = Lr;
 let X = jt;
 Z([
-  O({ type: Number })
+  F({ type: Number })
 ], X.prototype, "currentTime");
 Z([
-  O({ type: Number })
+  F({ type: Number })
 ], X.prototype, "duration");
 Z([
-  O({ type: Array })
+  F({ type: Array })
 ], X.prototype, "bufferedRanges");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "isSeeking");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "isLive");
 Z([
-  O({ type: Object })
+  F({ type: Object })
 ], X.prototype, "seekableRange");
 Z([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], X.prototype, "thumbnailProvider");
 Z([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], X.prototype, "player");
 Z([
-  O({ type: String })
+  F({ type: String })
 ], X.prototype, "currentSource");
 Z([
-  O({ type: String, reflect: !0 })
+  F({ type: String, reflect: !0 })
 ], X.prototype, "variant");
 Z([
-  O({ type: Array })
+  F({ type: Array })
 ], X.prototype, "markers");
 Z([
-  O({ type: Array })
+  F({ type: Array })
 ], X.prototype, "visibleMarkerTypes");
 Z([
-  O({ type: Array })
+  F({ type: Array })
 ], X.prototype, "chapters");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "canSeekInDvr");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "isAtLiveEdge");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "paused");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "hideCurrentTime");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "hideDuration");
 Z([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], X.prototype, "isAdPlaying");
 Z([
-  O({ type: Object })
+  F({ type: Object })
 ], X.prototype, "activeFilmstripThumbnail");
 Z([
   W()
@@ -13645,13 +13645,13 @@ const Gt = class Gt extends fe {
 Gt.styles = Dr;
 let De = Gt;
 qt([
-  O({ type: Number })
+  F({ type: Number })
 ], De.prototype, "volume");
 qt([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], De.prototype, "muted");
 qt([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], De.prototype, "player");
 if (typeof window < "u" && typeof customElements < "u" && (customElements.get("streamit-volume-control") || customElements.define("streamit-volume-control", De), !customElements.get("player-volume-control"))) {
   class c extends De {
@@ -13943,13 +13943,13 @@ const Qt = class Qt extends fe {
 Qt.styles = Or;
 let ye = Qt;
 nt([
-  O({ type: Array })
+  F({ type: Array })
 ], ye.prototype, "chapters");
 nt([
-  O({ type: Number })
+  F({ type: Number })
 ], ye.prototype, "activeChapterIndex");
 nt([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], ye.prototype, "player");
 nt([
   W()
@@ -14501,15 +14501,15 @@ const Xt = class Xt extends fe {
     }
   }
   render() {
-    var u, f, p, g, m, v, y, b, S, T, x, A, P, $, M, I, R, N, U, C, E, z, J, B, F, L, D;
-    const { currentTime: e, duration: t, isPlaying: i, bufferedRanges: s } = this.playerState, r = ((p = (f = (u = this.player) == null ? void 0 : u.config) == null ? void 0 : f.vertical) == null ? void 0 : p.railPosition) || "right", l = (((y = (v = (m = (g = this.player) == null ? void 0 : g.config) == null ? void 0 : m.controls) == null ? void 0 : v.groups) == null ? void 0 : y.rail) || ((x = (T = (S = (b = this.player) == null ? void 0 : b.config) == null ? void 0 : S.controls) == null ? void 0 : T.groups) == null ? void 0 : x.actionRail) || (($ = (P = (A = this.player) == null ? void 0 : A.config) == null ? void 0 : P.vertical) == null ? void 0 : $.railButtons) || [
+    var u, f, p, g, m, v, y, b, S, T, x, E, A, O, M, I, D, N, P, C, R, H, J, B, U, L, $;
+    const { currentTime: e, duration: t, isPlaying: i, bufferedRanges: s } = this.playerState, r = ((p = (f = (u = this.player) == null ? void 0 : u.config) == null ? void 0 : f.vertical) == null ? void 0 : p.railPosition) || "right", l = (((y = (v = (m = (g = this.player) == null ? void 0 : g.config) == null ? void 0 : m.controls) == null ? void 0 : v.groups) == null ? void 0 : y.rail) || ((x = (T = (S = (b = this.player) == null ? void 0 : b.config) == null ? void 0 : S.controls) == null ? void 0 : T.groups) == null ? void 0 : x.actionRail) || ((O = (A = (E = this.player) == null ? void 0 : E.config) == null ? void 0 : A.vertical) == null ? void 0 : O.railButtons) || [
       "prev-btn",
       "next-btn",
       "volume-btn",
       "caption-btn",
       "fullscreen-btn",
       "settings-btn"
-    ]).map((H) => H === "play-button" || H === "play" ? "play-btn" : H === "playlist-prev" || H === "playlist-previous" ? "prev-btn" : H === "playlist-next" ? "next-btn" : H === "volume-control" || H === "volume" ? "volume-btn" : H === "caption-btn" || H === "captions" || H === "subtitles" ? "caption-btn" : H === "fullscreen-btn" || H === "fullscreen" ? "fullscreen-btn" : H === "settings-btn" || H === "settings" ? "settings-btn" : H), o = ((R = (I = (M = this.player) == null ? void 0 : M.config) == null ? void 0 : I.vertical) == null ? void 0 : R.showProgressBar) !== !1 && ((C = (U = (N = this.player) == null ? void 0 : N.config) == null ? void 0 : U.controls) == null ? void 0 : C.timeline) !== !1 && ((J = (z = (E = this.player) == null ? void 0 : E.config) == null ? void 0 : z.controls) == null ? void 0 : J.seekbar) !== !1, d = ((L = (F = (B = this.player) == null ? void 0 : B.config) == null ? void 0 : F.controls) == null ? void 0 : L.actionRail) !== !1, h = this.controlsVisible && !((D = this.playerState) != null && D.isAdPlaying);
+    ]).map((_) => _ === "play-button" || _ === "play" ? "play-btn" : _ === "playlist-prev" || _ === "playlist-previous" ? "prev-btn" : _ === "playlist-next" ? "next-btn" : _ === "volume-control" || _ === "volume" ? "volume-btn" : _ === "caption-btn" || _ === "captions" || _ === "subtitles" ? "caption-btn" : _ === "fullscreen-btn" || _ === "fullscreen" ? "fullscreen-btn" : _ === "settings-btn" || _ === "settings" ? "settings-btn" : _), o = ((D = (I = (M = this.player) == null ? void 0 : M.config) == null ? void 0 : I.vertical) == null ? void 0 : D.showProgressBar) !== !1 && ((C = (P = (N = this.player) == null ? void 0 : N.config) == null ? void 0 : P.controls) == null ? void 0 : C.timeline) !== !1 && ((J = (H = (R = this.player) == null ? void 0 : R.config) == null ? void 0 : H.controls) == null ? void 0 : J.seekbar) !== !1, d = ((L = (U = (B = this.player) == null ? void 0 : B.config) == null ? void 0 : U.controls) == null ? void 0 : L.actionRail) !== !1, h = this.controlsVisible && !(($ = this.playerState) != null && $.isAdPlaying);
     return k`
       <div
         part="vertical-controls-container"
@@ -14523,7 +14523,7 @@ const Xt = class Xt extends fe {
                 <!-- Top Section Slot -->
                 <slot name="top-actions"></slot>
 
-                ${l.map((H) => this.renderRailButton(H))}
+                ${l.map((_) => this.renderRailButton(_))}
 
                 <!-- Social Actions Slot -->
                 <slot name="social-actions"></slot>
@@ -14568,31 +14568,31 @@ const Xt = class Xt extends fe {
 Xt.styles = Ur;
 let he = Xt;
 me([
-  O({ type: Object })
+  F({ type: Object })
 ], he.prototype, "playerState");
 me([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], he.prototype, "controlsVisible");
 me([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], he.prototype, "settingsMenuOpen");
 me([
-  O({ type: String })
+  F({ type: String })
 ], he.prototype, "activeMenuScreen");
 me([
-  O({ type: Number })
+  F({ type: Number })
 ], he.prototype, "pendingSeekTime");
 me([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], he.prototype, "showNavigation");
 me([
-  O({ attribute: !1 })
+  F({ attribute: !1 })
 ], he.prototype, "player");
 me([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], he.prototype, "hideCurrentTime");
 me([
-  O({ type: Boolean })
+  F({ type: Boolean })
 ], he.prototype, "hideDuration");
 me([
   W()
@@ -15698,7 +15698,36 @@ const Pi = [
   { value: "depressed", label: "Depressed" },
   { value: "uniform", label: "Uniform" },
   { value: "drop-shadow", label: "Drop Shadow" }
-], Kr = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2, 2.5, 3, 4], Wr = [0.5, 1, 2], Yt = class Yt extends fe {
+], Kr = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2, 2.5, 3, 4], Wr = [0.5, 1, 2];
+function jr(c) {
+  const e = /* @__PURE__ */ new Map();
+  for (const t of c)
+    if (t.includes("-"))
+      for (const i of [t.replace(/-/g, ""), t.replace(/-/g, "_")])
+        i !== t && !c.includes(i) && e.set(i, t);
+  return e;
+}
+function Gr(c) {
+  if (c === null) return;
+  const e = c.trim();
+  if (e !== "") {
+    if (e.startsWith("[object ")) {
+      console.warn(
+        `[streamit-player] The "config" attribute received a stringified object ("${e}") and has been ignored. Pass config as a DOM property (element.config = {...}, or .config=\${...} / :config="..." in a framework template) rather than as an attribute.`
+      );
+      return;
+    }
+    try {
+      return JSON.parse(e);
+    } catch {
+      console.warn(
+        '[streamit-player] The "config" attribute is not valid JSON and has been ignored. Pass config as a DOM property instead.'
+      );
+      return;
+    }
+  }
+}
+const Yt = class Yt extends fe {
   constructor() {
     super(...arguments), this.src = "", this.captions = "", this.autoplay = !1, this.muted = !1, this.volume = 1, this.displayMode = "standard", this.nearEndThreshold = 1, this.autoScroll = !1, this.liveMode = "live-dvr", this.preload = "metadata", this.loop = !1, this.playsinline = !0, this.poster = "", this.isFeedTransitioning = !1, this.iconRegistry = new Pr(), this.customControls = /* @__PURE__ */ new Map(), this.customOverlays = /* @__PURE__ */ new Map(), this.isVisualTransitioning = !1, this.transitionDirection = "next", this.transitionStage = "idle", this.shouldAutoplayAfterTransition = !1, this.suppressPlayPauseFeedback = !1, this.contextMenuOpen = !1, this.contextMenuX = 0, this.contextMenuY = 0, this.isContextMenuDisabled = !1, this.customContextMenuItems = [], this.customSettingsItems = [], this.customSettingsScreens = /* @__PURE__ */ new Map(), this.playerState = {
       status: "idle",
@@ -15892,6 +15921,19 @@ const Pi = [
     const i = ((r = this.config) == null ? void 0 : r.locale) || {};
     return (((n = (a = this.config) == null ? void 0 : a.settings) == null ? void 0 : n.labels) || {})[e] || i[e] || t;
   }
+  static get observedAttributes() {
+    const e = super.observedAttributes;
+    return Object.prototype.hasOwnProperty.call(this, "attributeAliases") || (this.attributeAliases = jr(e)), [...e, ...this.attributeAliases.keys()];
+  }
+  attributeChangedCallback(e, t, i) {
+    var r;
+    const s = (r = this.constructor.attributeAliases) == null ? void 0 : r.get(e);
+    if (s) {
+      i === null ? this.removeAttribute(s) : this.getAttribute(s) !== i && this.setAttribute(s, i);
+      return;
+    }
+    super.attributeChangedCallback(e, t, i);
+  }
   get controllerInstance() {
     return this.controller;
   }
@@ -16110,7 +16152,25 @@ const Pi = [
     this.controller && this.controller.seekToChapter(e);
   }
   willUpdate(e) {
-    e.has("liveMode") && this.controller && this.controller.setLiveMode(this.liveMode);
+    e.has("liveMode") && this.controller && this.controller.setLiveMode(this.liveMode), this.adoptDisplayModeFromConfig(e);
+  }
+  /**
+   * `displayMode` is the single source of truth for the layout: the host
+   * stylesheet keys off the attribute it reflects and render() picks the
+   * control set from it. `config.displayMode` and `config.layout.mode` are
+   * equivalent ways to ask for a mode, so they are folded into the property
+   * here - before the first render - rather than being read separately further
+   * down, which is how a 9:16 host could end up wearing the standard control
+   * bar.
+   *
+   * Only a config that changes the mode it asks for wins, so an unrelated
+   * config update never clobbers a display-mode set on the element itself.
+   */
+  adoptDisplayModeFromConfig(e) {
+    var i, s, r;
+    if (!e.has("config")) return;
+    const t = ((i = this.config) == null ? void 0 : i.displayMode) || ((r = (s = this.config) == null ? void 0 : s.layout) == null ? void 0 : r.mode);
+    !t || t === this.configRequestedMode || (this.configRequestedMode = t, this.displayMode !== t && (this.displayMode = t));
   }
   firstUpdated() {
     var r, a, n, l, o, d, h, u, f;
@@ -16160,20 +16220,20 @@ const Pi = [
     for (const p of this.pendingListeners)
       p.action === "on" ? this.controller.on(p.event, p.callback) : p.action === "off" && this.controller.off(p.event, p.callback);
     if (this.pendingListeners = [], this.unsubscribe = this.controller.onStateChange((p) => {
-      var A;
+      var E;
       if (this.isVisualTransitioning && this.gestures.checkTransitionCompletion(), this.videoElement && (p.isPlaying || p.status === "playing" || this.videoElement.readyState >= 2) && this.videoElement.removeAttribute("poster"), this.playerState && this.playerState.currentSource !== p.currentSource && (this.isFeedTransitioning = !0, p.currentSource)) {
-        const P = this.thumbnailCache.getProvider(p.currentSource);
-        if (P && P !== this.thumbnailCache.getMainProvider()) {
-          if (this.thumbnailCache.setMainProvider(P), this.controller) {
-            const $ = this.controller;
-            $.thumbnailProvider = P, $.state.thumbnailProvider = P;
+        const A = this.thumbnailCache.getProvider(p.currentSource);
+        if (A && A !== this.thumbnailCache.getMainProvider()) {
+          if (this.thumbnailCache.setMainProvider(A), this.controller) {
+            const O = this.controller;
+            O.thumbnailProvider = A, O.state.thumbnailProvider = A;
           }
-          p.thumbnailProvider = P;
+          p.thumbnailProvider = A;
         }
       }
       if (this.playerState && this.playerState.isAdPlaying !== p.isAdPlaying && (p.isAdPlaying ? (this.cleanupControlsTimer(), this.controlsVisible = !1, this.classList.add("controls-hidden")) : (this.controlsVisible = !0, this.classList.remove("controls-hidden"))), this.playerState && this.playerState.isPlaying !== p.isPlaying && p.status !== "idle" && p.status !== "error" && !(p.status === "ended" && this.displayMode === "vertical")) {
-        const P = this.displayMode === "vertical" && ((A = this.videoElement) == null ? void 0 : A.ended);
-        !this.isFeedTransitioning && !this.suppressPlayPauseFeedback && !P && this.triggerPlayPauseFeedback(p.isPlaying ? "play" : "pause");
+        const A = this.displayMode === "vertical" && ((E = this.videoElement) == null ? void 0 : E.ended);
+        !this.isFeedTransitioning && !this.suppressPlayPauseFeedback && !A && this.triggerPlayPauseFeedback(p.isPlaying ? "play" : "pause");
       }
       this.isFeedTransitioning && (p.status === "playing" || p.status === "paused" || p.status === "error" || p.status === "ended") && (this.isFeedTransitioning = !1), (p.isPlaying || p.status === "playing") && (this.suppressPlayPauseFeedback = !1, this.shouldAutoplayAfterTransition = !1), this.playerState && (this.playerState.volume !== p.volume || this.playerState.isMuted !== p.isMuted) && p.status !== "idle" && p.status !== "error" && this.triggerVolumeFeedback(p.volume, p.isMuted), this.playerState && this.playerState.playbackRate !== p.playbackRate && p.status !== "idle" && p.status !== "error" && this.triggerSpeedFeedback(p.playbackRate), this.shouldShowQualityFeedback && this.playerState && this.playerState.activeQuality !== p.activeQuality && p.activeQuality && p.status !== "idle" && p.status !== "loading" && p.status !== "error" && (this.triggerQualityFeedback(p.activeQuality), this.shouldShowQualityFeedback = !1);
       const m = this.playerState;
@@ -16205,7 +16265,7 @@ const Pi = [
         "liveLatency",
         "dvrWindow",
         "canSeekInDvr"
-      ].some((P) => m[P] !== p[P]), x = (m ? Math.abs(m.currentTime - p.currentTime) : 0) >= 0.2 || p.isSeeking || m && m.isSeeking !== p.isSeeking;
+      ].some((A) => m[A] !== p[A]), x = (m ? Math.abs(m.currentTime - p.currentTime) : 0) >= 0.2 || p.isSeeking || m && m.isSeeking !== p.isSeeking;
       (S || x) && this.dispatchEvent(
         new CustomEvent("player-state-change", {
           detail: p,
@@ -16839,7 +16899,7 @@ const Pi = [
         const I = e.getNearestCachedThumbnail(b);
         I && I.time !== void 0 && Math.abs(I.time - b) <= 5 && (S = I);
       }
-      const T = v === d, x = !S, A = S && S.width || 200, P = S && S.height || 112, $ = f / A, M = S ? S.x !== void 0 ? `background-image: url('${S.url}'); background-position: -${S.x || 0}px -${S.y || 0}px; width: ${A}px; height: ${P}px; background-size: auto; transform: translate(-50%, -50%) scale(${$}); position: absolute; left: 50%; top: 50%; transform-origin: center;` : `background-image: url('${S.url}'); width: 100%; height: 100%; background-size: cover;` : "";
+      const T = v === d, x = !S, E = S && S.width || 200, A = S && S.height || 112, O = f / E, M = S ? S.x !== void 0 ? `background-image: url('${S.url}'); background-position: -${S.x || 0}px -${S.y || 0}px; width: ${E}px; height: ${A}px; background-size: auto; transform: translate(-50%, -50%) scale(${O}); position: absolute; left: 50%; top: 50%; transform-origin: center;` : `background-image: url('${S.url}'); width: 100%; height: 100%; background-size: cover;` : "";
       return k`
               <div
                 class="filmstrip-thumbnail-cell ${T ? "active" : ""} ${x ? "loading" : ""}"
@@ -16880,7 +16940,7 @@ const Pi = [
   }
   // --- Sub-menu renders ---
   renderSettingsMenuContent() {
-    var s, r, a, n, l, o, d, h, u, f, p, g, m, v, y, b, S, T, x, A, P, $, M, I, R, N, U, C, E, z, J;
+    var s, r, a, n, l, o, d, h, u, f, p, g, m, v, y, b, S, T, x, E, A, O, M, I, D, N, P, C, R, H, J;
     const e = k`<slot name="icon-arrow-back"
       >${j(this.getIcon("arrow-back"))}</slot
     >`, t = k`<slot name="icon-check">${j(this.getIcon("check"))}</slot>`, i = k`<slot name="icon-arrow-forward"
@@ -16902,17 +16962,17 @@ const Pi = [
           </div>
           <div class="settings-list-scroll" role="menu">
             ${B.map(
-          (F) => k`
+          (U) => k`
                 <div
                   class="settings-item"
-                  @click=${() => this.handleSelectSpeed(F)}
+                  @click=${() => this.handleSelectSpeed(U)}
                   role="menuitemradio"
-                  aria-checked=${this.playerState.playbackRate === F}
+                  aria-checked=${this.playerState.playbackRate === U}
                   tabindex="0"
                   @keydown=${this.settingsMenu.handleItemKey}
                 >
-                  <span>${F === 1 ? this.localize("normal", "Normal") : `${F}x`}</span>
-                  ${this.playerState.playbackRate === F ? t : ""}
+                  <span>${U === 1 ? this.localize("normal", "Normal") : `${U}x`}</span>
+                  ${this.playerState.playbackRate === U ? t : ""}
                 </div>
               `
         )}
@@ -16932,22 +16992,22 @@ const Pi = [
             ${e} ${this.localize("quality", "Quality")}
           </div>
           <div class="settings-list-scroll" role="menu">
-            ${this.playerState.qualities.map((B, F) => {
-          const L = B === "Auto" && this.playerState.activeQuality.startsWith("Auto") || this.playerState.activeQuality === B, D = (() => {
-            const H = B.match(/^(\d+)p$/);
-            return H ? parseInt(H[1], 10) >= 720 : !1;
+            ${this.playerState.qualities.map((B, U) => {
+          const L = B === "Auto" && this.playerState.activeQuality.startsWith("Auto") || this.playerState.activeQuality === B, $ = (() => {
+            const _ = B.match(/^(\d+)p$/);
+            return _ ? parseInt(_[1], 10) >= 720 : !1;
           })();
           return k`
                 <div
                   class="settings-item"
-                  @click=${() => this.handleSelectQuality(F)}
+                  @click=${() => this.handleSelectQuality(U)}
                   role="menuitemradio"
                   aria-checked=${L ? "true" : "false"}
                   tabindex="0"
                   @keydown=${this.settingsMenu.handleItemKey}
                 >
                   <span style="display: flex; align-items: center; gap: 6px;">
-                    ${B} ${D ? k`<span class="hd-badge">HD</span>` : ""}
+                    ${B} ${$ ? k`<span class="hd-badge">HD</span>` : ""}
                   </span>
                   ${L ? t : ""}
                 </div>
@@ -16969,17 +17029,17 @@ const Pi = [
           </div>
           <div class="settings-list-scroll" role="menu">
             ${this.playerState.audioTracks.map(
-          (B, F) => k`
+          (B, U) => k`
                 <div
                   class="settings-item"
-                  @click=${() => this.handleSelectAudio(F)}
+                  @click=${() => this.handleSelectAudio(U)}
                   role="menuitemradio"
-                  aria-checked=${this.playerState.activeAudioTrack === F}
+                  aria-checked=${this.playerState.activeAudioTrack === U}
                   tabindex="0"
                   @keydown=${this.settingsMenu.handleItemKey}
                 >
                   <span>${B}</span>
-                  ${this.playerState.activeAudioTrack === F ? t : ""}
+                  ${this.playerState.activeAudioTrack === U ? t : ""}
                 </div>
               `
         )}
@@ -17002,8 +17062,8 @@ const Pi = [
               >${e} ${this.localize("subtitles", "Subtitles")}</span
             >
             <span
-              @click=${(F) => {
-          F.stopPropagation(), this.settingsMenu.goTo("subtitle-options");
+              @click=${(U) => {
+          U.stopPropagation(), this.settingsMenu.goTo("subtitle-options");
         }}
               style="font-size: 11px; text-decoration: underline; color: var(--player-primary-color, #6366f1); cursor: pointer;"
               role="button"
@@ -17022,18 +17082,18 @@ const Pi = [
               <span>${this.localize("off", "Off")}</span>
               ${B ? t : ""}
             </div>
-            ${this.playerState.subtitleTracks.map((F) => {
-          const L = !B && this.playerState.activeSubtitleTrackId === F.id;
+            ${this.playerState.subtitleTracks.map((U) => {
+          const L = !B && this.playerState.activeSubtitleTrackId === U.id;
           return k`
                 <div
                   class="settings-item"
-                  @click=${() => this.handleSelectSubtitle(F.id)}
+                  @click=${() => this.handleSelectSubtitle(U.id)}
                   role="menuitemradio"
                   aria-checked=${L ? "true" : "false"}
                   tabindex="0"
                   @keydown=${this.settingsMenu.handleItemKey}
                 >
-                  <span>${F.label || F.language || "Unknown"}</span>
+                  <span>${U.label || U.language || "Unknown"}</span>
                   ${L ? t : ""}
                 </div>
               `;
@@ -17042,7 +17102,7 @@ const Pi = [
         `;
       }
       case "subtitle-options": {
-        const B = this.playerState.subtitleAppearance, F = ((s = Pi.find((se) => se.value === B.fontFamily)) == null ? void 0 : s.label) || "Default", L = ((r = Ne.find((se) => se.value === B.fontColor)) == null ? void 0 : r.label) || "White", D = ((a = Ci.find((se) => se.value === B.fontSize)) == null ? void 0 : a.label) || "100%", H = ((n = Ne.find((se) => se.value === B.backgroundColor)) == null ? void 0 : n.label) || "Black", le = ((l = Be.find((se) => se.value === B.backgroundOpacity)) == null ? void 0 : l.label) || "75%", oe = ((o = Ne.find((se) => se.value === B.windowColor)) == null ? void 0 : o.label) || "Black", Te = ((d = Be.find((se) => se.value === B.windowOpacity)) == null ? void 0 : d.label) || "0%", xe = ((h = Mi.find((se) => se.value === B.characterEdgeStyle)) == null ? void 0 : h.label) || "None", Oe = ((u = Be.find((se) => se.value === B.fontOpacity)) == null ? void 0 : u.label) || "100%";
+        const B = this.playerState.subtitleAppearance, U = ((s = Pi.find((se) => se.value === B.fontFamily)) == null ? void 0 : s.label) || "Default", L = ((r = Ne.find((se) => se.value === B.fontColor)) == null ? void 0 : r.label) || "White", $ = ((a = Ci.find((se) => se.value === B.fontSize)) == null ? void 0 : a.label) || "100%", _ = ((n = Ne.find((se) => se.value === B.backgroundColor)) == null ? void 0 : n.label) || "Black", le = ((l = Be.find((se) => se.value === B.backgroundOpacity)) == null ? void 0 : l.label) || "75%", oe = ((o = Ne.find((se) => se.value === B.windowColor)) == null ? void 0 : o.label) || "Black", Te = ((d = Be.find((se) => se.value === B.windowOpacity)) == null ? void 0 : d.label) || "0%", xe = ((h = Mi.find((se) => se.value === B.characterEdgeStyle)) == null ? void 0 : h.label) || "None", Oe = ((u = Be.find((se) => se.value === B.fontOpacity)) == null ? void 0 : u.label) || "100%";
         return k`
           <div
             class="settings-header"
@@ -17064,7 +17124,7 @@ const Pi = [
             >
               <span>${this.localize("fontFamily", "Font family")}</span>
               <span style="color: #9ca3af; display: flex; align-items: center; gap: 4px;"
-                >${F} ${i}</span
+                >${U} ${i}</span
               >
             </div>
             <div
@@ -17088,7 +17148,7 @@ const Pi = [
             >
               <span>${this.localize("fontSize", "Font size")}</span>
               <span style="color: #9ca3af; display: flex; align-items: center; gap: 4px;"
-                >${D} ${i}</span
+                >${$} ${i}</span
               >
             </div>
             <div
@@ -17100,7 +17160,7 @@ const Pi = [
             >
               <span>${this.localize("backgroundColour", "Background colour")}</span>
               <span style="color: #9ca3af; display: flex; align-items: center; gap: 4px;"
-                >${H} ${i}</span
+                >${_} ${i}</span
               >
             </div>
             <div
@@ -17203,9 +17263,9 @@ const Pi = [
       case "opt-font-opacity":
         return this.renderAppearanceSelectionScreen("Font opacity", Be, "fontOpacity");
       case "sleeptimer": {
-        const B = !!((f = this.playerState) != null && f.isLive), F = ((g = (p = this.config) == null ? void 0 : p.sleepTimer) == null ? void 0 : g.presets) || [10, 15, 20, 30, 45, 60], L = [
+        const B = !!((f = this.playerState) != null && f.isLive), U = ((g = (p = this.config) == null ? void 0 : p.sleepTimer) == null ? void 0 : g.presets) || [10, 15, 20, 30, 45, 60], L = [
           { value: "off", label: this.localize("off", "Off") },
-          ...F.map((D) => ({ value: D, label: `${D} ${this.localize("minutes", "minutes")}` })),
+          ...U.map(($) => ({ value: $, label: `${$} ${this.localize("minutes", "minutes")}` })),
           ...B ? [] : [{ value: "end", label: this.localize("endOfVideo", "End of video") }]
         ];
         return k`
@@ -17220,30 +17280,30 @@ const Pi = [
             ${e} ${this.localize("sleepTimer", "Sleep Timer")}
           </div>
           <div class="settings-list-scroll" role="menu">
-            ${L.map((D) => {
-          const H = this.playerState.sleepTimerSetting === D.value;
+            ${L.map(($) => {
+          const _ = this.playerState.sleepTimerSetting === $.value;
           return k`
                 <div
                   class="settings-item"
                   @click=${() => this.handleSelectSleepTimer(
-            D.value
+            $.value
           )}
                   role="menuitemradio"
-                  aria-checked=${H ? "true" : "false"}
+                  aria-checked=${_ ? "true" : "false"}
                   tabindex="0"
                   @keydown=${this.settingsMenu.handleItemKey}
                 >
-                  ${D.value === "end" ? k`
+                  ${$.value === "end" ? k`
                         <span
                           style="display: flex; flex-direction: column; align-items: flex-start;"
                         >
-                          <span>${D.label}</span>
+                          <span>${$.label}</span>
                           ${this.getRemainingVideoTimeText() ? k`<span style="font-size: 11px; color: #9ca3af; margin-top: 2px;">
                                 ${this.getRemainingVideoTimeText()}
                               </span>` : ""}
                         </span>
-                      ` : k`<span>${D.label}</span>`}
-                  ${H ? t : ""}
+                      ` : k`<span>${$.label}</span>`}
+                  ${_ ? t : ""}
                 </div>
               `;
         })}
@@ -17264,14 +17324,14 @@ const Pi = [
           </div>
           <div class="settings-list-scroll" role="menu">
             ${this.playerState.chapters.map(
-          (B, F) => k`
+          (B, U) => k`
                 <div
                   class="settings-item"
                   @click=${() => {
-            this.handleSelectChapter(F), this.settingsMenu.close();
+            this.handleSelectChapter(U), this.settingsMenu.close();
           }}
                   role="menuitemradio"
-                  aria-checked=${this.playerState.activeChapterIndex === F}
+                  aria-checked=${this.playerState.activeChapterIndex === U}
                   tabindex="0"
                   @keydown=${this.settingsMenu.handleItemKey}
                 >
@@ -17281,7 +17341,7 @@ const Pi = [
                       ${de(B.startTime)}
                     </span>
                   </span>
-                  ${this.playerState.activeChapterIndex === F ? t : ""}
+                  ${this.playerState.activeChapterIndex === U ? t : ""}
                 </div>
               `
         )}
@@ -17313,7 +17373,7 @@ const Pi = [
               if (ce) return ce;
             }
         }
-        const B = this.playerState.playbackRate === 1 ? this.localize("normal", "Normal") : `${this.playerState.playbackRate}x`, F = ((m = this.config) == null ? void 0 : m.controls) || {}, L = this.displayMode === "vertical", D = (y = (v = this.config) == null ? void 0 : v.vertical) == null ? void 0 : y.menus, H = L && (D == null ? void 0 : D.playbackSpeed) !== void 0 ? D.playbackSpeed : F.playbackSpeed !== !1, le = L && (D == null ? void 0 : D.quality) !== void 0 ? D.quality : F.quality !== !1, oe = L && (D == null ? void 0 : D.audioTracks) !== void 0 ? D.audioTracks : F.audioTracks !== !1, Te = L && (D == null ? void 0 : D.subtitles) !== void 0 ? D.subtitles : F.subtitles !== !1, xe = L && (D == null ? void 0 : D.sleepTimer) !== void 0 ? D.sleepTimer : F.sleepTimer !== !1, Oe = F.loop !== !1 && ((S = (b = this.config) == null ? void 0 : b.playback) == null ? void 0 : S.loop) !== !1, se = L && (D == null ? void 0 : D.autoScroll) !== void 0 ? D.autoScroll : F.autoScroll !== !1, ot = L && (D == null ? void 0 : D.chapters) !== void 0 ? D.chapters : F.chapters === !0, Ke = [];
+        const B = this.playerState.playbackRate === 1 ? this.localize("normal", "Normal") : `${this.playerState.playbackRate}x`, U = ((m = this.config) == null ? void 0 : m.controls) || {}, L = this.displayMode === "vertical", $ = (y = (v = this.config) == null ? void 0 : v.vertical) == null ? void 0 : y.menus, _ = L && ($ == null ? void 0 : $.playbackSpeed) !== void 0 ? $.playbackSpeed : U.playbackSpeed !== !1, le = L && ($ == null ? void 0 : $.quality) !== void 0 ? $.quality : U.quality !== !1, oe = L && ($ == null ? void 0 : $.audioTracks) !== void 0 ? $.audioTracks : U.audioTracks !== !1, Te = L && ($ == null ? void 0 : $.subtitles) !== void 0 ? $.subtitles : U.subtitles !== !1, xe = L && ($ == null ? void 0 : $.sleepTimer) !== void 0 ? $.sleepTimer : U.sleepTimer !== !1, Oe = U.loop !== !1 && ((S = (b = this.config) == null ? void 0 : b.playback) == null ? void 0 : S.loop) !== !1, se = L && ($ == null ? void 0 : $.autoScroll) !== void 0 ? $.autoScroll : U.autoScroll !== !1, ot = L && ($ == null ? void 0 : $.chapters) !== void 0 ? $.chapters : U.chapters === !0, Ke = [];
         if (this.controller) {
           const V = this.controller.getPlugins();
           for (const ie of V)
@@ -17331,7 +17391,7 @@ const Pi = [
           "sleepTimer",
           "loop"
         ]).map((V) => V === "captions" ? "subtitles" : V === "playbackSpeed" ? "speed" : V === "audio" ? "audioTracks" : V), re = /* @__PURE__ */ new Map();
-        if (H && re.set("speed", k`
+        if (_ && re.set("speed", k`
             <div
               class="settings-item"
               @click=${() => this.settingsMenu.goTo("speed")}
@@ -17382,9 +17442,9 @@ const Pi = [
               <span>${this.localize("subtitles", "Subtitles")}</span>
               <span class="settings-item-value">
                 <span>
-                  ${this.playerState.activeSubtitleTrackId === null || !this.playerState.captionsEnabled ? this.localize("off", "Off") : ((A = this.playerState.subtitleTracks.find(
+                  ${this.playerState.activeSubtitleTrackId === null || !this.playerState.captionsEnabled ? this.localize("off", "Off") : ((E = this.playerState.subtitleTracks.find(
           (V) => V.id === this.playerState.activeSubtitleTrackId
-        )) == null ? void 0 : A.label) || this.localize("on", "On")}
+        )) == null ? void 0 : E.label) || this.localize("on", "On")}
                 </span>
                 ${i}
               </span>
@@ -17406,7 +17466,7 @@ const Pi = [
             </div>
           `);
         }
-        ((($ = (P = this.config) == null ? void 0 : P.settings) == null ? void 0 : $.pictureInPicture) === !0 || ((I = (M = this.config) == null ? void 0 : M.settings) == null ? void 0 : I.pip) === !0) && re.set("pictureInPicture", k`
+        (((O = (A = this.config) == null ? void 0 : A.settings) == null ? void 0 : O.pictureInPicture) === !0 || ((I = (M = this.config) == null ? void 0 : M.settings) == null ? void 0 : I.pip) === !0) && re.set("pictureInPicture", k`
             <div
               class="settings-item"
               @click=${() => {
@@ -17420,7 +17480,7 @@ const Pi = [
               <span>${this.localize("pictureInPicture", "Picture in Picture")}</span>
               <span class="settings-toggle ${this.playerState.pictureInPicture ? "active" : ""}"></span>
             </div>
-          `), ((N = (R = this.config) == null ? void 0 : R.settings) == null ? void 0 : N.fullscreen) === !0 && re.set("fullscreen", k`
+          `), ((N = (D = this.config) == null ? void 0 : D.settings) == null ? void 0 : N.fullscreen) === !0 && re.set("fullscreen", k`
             <div
               class="settings-item"
               @click=${() => {
@@ -17508,7 +17568,7 @@ const Pi = [
           `;
           re.set(V.id || `custom-${ie}`, ce);
         });
-        const ct = (U = this.config) == null ? void 0 : U.customItems, We = ((E = (C = this.config) == null ? void 0 : C.settings) == null ? void 0 : E.customItems) || ct || [];
+        const ct = (P = this.config) == null ? void 0 : P.customItems, We = ((R = (C = this.config) == null ? void 0 : C.settings) == null ? void 0 : R.customItems) || ct || [];
         Array.isArray(We) && We.forEach((V, ie) => {
           const ce = k`
               <div
@@ -17528,7 +17588,7 @@ const Pi = [
             `;
           re.set(V.id || `static-custom-${ie}`, ce);
         });
-        const be = [], Fe = (J = (z = this.config) == null ? void 0 : z.settings) == null ? void 0 : J.groups;
+        const be = [], Fe = (J = (H = this.config) == null ? void 0 : H.settings) == null ? void 0 : J.groups;
         if (Fe && typeof Fe == "object") {
           Object.entries(Fe).forEach(([V, ie]) => {
             if (!Array.isArray(ie)) return;
@@ -18010,13 +18070,12 @@ const Pi = [
     ` : "";
   }
   renderDefaultLiveOverlay(e) {
-    var i, s;
-    return (((s = (i = e.config) == null ? void 0 : i.layout) == null ? void 0 : s.mode) || e.displayMode) !== "vertical" || !e.playerState.isLive ? "" : k`
+    return e.displayMode !== "vertical" || !e.playerState.isLive ? "" : k`
       <div
         class="vertical-persistent-live-badge ${e.playerState.isAtLiveEdge ? "live" : "behind"}"
         @click=${e.handleLiveBadgeClick}
-        @keydown=${(r) => {
-      (r.key === "Enter" || r.key === " ") && (r.preventDefault(), e.handleLiveBadgeClick(r));
+        @keydown=${(i) => {
+      (i.key === "Enter" || i.key === " ") && (i.preventDefault(), e.handleLiveBadgeClick(i));
     }}
         role="button"
         tabindex="0"
@@ -18268,11 +18327,11 @@ const Pi = [
       }
   }
   renderAdUIOverlay() {
-    var m, v, y, b, S, T, x, A, P, $, M, I, R;
+    var m, v, y, b, S, T, x, E, A, O, M, I, D;
     if (!((m = this.playerState) != null && m.isAdPlaying)) return "";
     const e = this.playerState.currentAd;
     if (e && e.linear === !1 || this.playerState.adLinear === !1) return "";
-    const t = this.playerState.currentAdBreak, i = this.playerState.adPosition, s = ((v = t == null ? void 0 : t.ads) == null ? void 0 : v.length) || 1, r = (e == null ? void 0 : e.title) || "", a = !!this.playerState.canSkipAd, n = this.playerState.skipAvailableAt, l = a || n != null, o = this.playerState.adDuration || (e == null ? void 0 : e.duration) || 0, d = this.playerState.adCurrentTime ?? Math.max(0, o - (this.playerState.adRemainingTime ?? o)), h = Math.ceil(this.playerState.adRemainingTime ?? Math.max(0, o - d)), u = o > 0 ? Math.min(100, d / o * 100) : 0, f = !!((S = (b = (y = this.controller) == null ? void 0 : y.config) == null ? void 0 : b.ads) != null && S.showAdTitle), p = ((P = (A = (x = (T = this.controller) == null ? void 0 : T.config) == null ? void 0 : x.ads) == null ? void 0 : A.ui) == null ? void 0 : P.showSkipButton) ?? !0, g = ((R = (I = (M = ($ = this.controller) == null ? void 0 : $.config) == null ? void 0 : M.ads) == null ? void 0 : I.ui) == null ? void 0 : R.showCountdown) ?? !0;
+    const t = this.playerState.currentAdBreak, i = this.playerState.adPosition, s = ((v = t == null ? void 0 : t.ads) == null ? void 0 : v.length) || 1, r = (e == null ? void 0 : e.title) || "", a = !!this.playerState.canSkipAd, n = this.playerState.skipAvailableAt, l = a || n != null, o = this.playerState.adDuration || (e == null ? void 0 : e.duration) || 0, d = this.playerState.adCurrentTime ?? Math.max(0, o - (this.playerState.adRemainingTime ?? o)), h = Math.ceil(this.playerState.adRemainingTime ?? Math.max(0, o - d)), u = o > 0 ? Math.min(100, d / o * 100) : 0, f = !!((S = (b = (y = this.controller) == null ? void 0 : y.config) == null ? void 0 : b.ads) != null && S.showAdTitle), p = ((A = (E = (x = (T = this.controller) == null ? void 0 : T.config) == null ? void 0 : x.ads) == null ? void 0 : E.ui) == null ? void 0 : A.showSkipButton) ?? !0, g = ((D = (I = (M = (O = this.controller) == null ? void 0 : O.config) == null ? void 0 : M.ads) == null ? void 0 : I.ui) == null ? void 0 : D.showCountdown) ?? !0;
     return k`
       <div class="player-ad-ui-overlay" part="ad-ui-overlay">
         <!-- Top Left Ad Info Badge (Compact by default) -->
@@ -18315,7 +18374,7 @@ const Pi = [
     `;
   }
   render() {
-    var u, f, p, g, m, v, y, b, S, T, x, A, P, $, M, I, R, N, U, C;
+    var u, f, p, g, m, v, y, b, S, T, x, E, A, O, M, I, D, N;
     const {
       isPlaying: e,
       status: t,
@@ -18326,7 +18385,7 @@ const Pi = [
       error: n,
       currentSource: l,
       loop: o
-    } = this.playerState, d = this.controlsVisible || !e, h = ((f = (u = this.config) == null ? void 0 : u.layout) == null ? void 0 : f.mode) || this.displayMode;
+    } = this.playerState, d = this.controlsVisible || !e, h = this.displayMode;
     return k`
       <div
         part="player-container"
@@ -18347,12 +18406,12 @@ const Pi = [
           <canvas part="transition-canvas" class="transition-canvas"></canvas>
         </div>
 
-        ${!l && this.emptyStateSectionEnabled && ((g = (p = this.config) == null ? void 0 : p.controls) == null ? void 0 : g.emptyState) !== !1 ? this.renderEmptyState() : k`
+        ${!l && this.emptyStateSectionEnabled && ((f = (u = this.config) == null ? void 0 : u.controls) == null ? void 0 : f.emptyState) !== !1 ? this.renderEmptyState() : k`
               <!-- Custom overlay slot -->
               <slot name="top-overlay"></slot>
 
               <!-- Center Play Button Overlay -->
-              ${(m = this.playerState) != null && m.isAdPlaying ? "" : this.renderOverlay("center-play", (E) => this.renderDefaultCenterPlayOverlay(E))}
+              ${(p = this.playerState) != null && p.isAdPlaying ? "" : this.renderOverlay("center-play", (P) => this.renderDefaultCenterPlayOverlay(P))}
 
               <!-- Audio only cover -->
               ${h === "audio-only" ? k`
@@ -18383,7 +18442,7 @@ const Pi = [
                       aria-modal="true"
                       aria-labelledby="sleep-title"
                       aria-describedby="sleep-desc"
-                      @click=${(E) => E.stopPropagation()}
+                      @click=${(P) => P.stopPropagation()}
                     >
                       <div part="sleep-timer-dialog-content" class="sleep-timer-dialog-card">
                         <div part="sleep-timer-title" class="sleep-timer-dialog-title" id="sleep-title">
@@ -18396,8 +18455,8 @@ const Pi = [
                           <button
                             part="sleep-timer-btn sleep-timer-btn-add"
                             class="sleep-timer-btn sleep-timer-btn-add secondary"
-                            @click=${(E) => {
-      E.stopPropagation(), this.handleSleepTimerAddTime();
+                            @click=${(P) => {
+      P.stopPropagation(), this.handleSleepTimerAddTime();
     }}
                           >
                             ${this.localize("addTime", "Add time")}
@@ -18405,8 +18464,8 @@ const Pi = [
                           <button
                             part="sleep-timer-btn sleep-timer-btn-close"
                             class="sleep-timer-btn sleep-timer-btn-close primary"
-                            @click=${(E) => {
-      E.stopPropagation(), this.handleSleepTimerClose();
+                            @click=${(P) => {
+      P.stopPropagation(), this.handleSleepTimerClose();
     }}
                           >
                             ${this.localize("close", "Close")}
@@ -18417,28 +18476,28 @@ const Pi = [
                   ` : ""}
 
               <!-- Error State Overlay -->
-              ${n ? this.renderOverlay("error", (E) => this.renderDefaultErrorOverlay(E)) : ""}
+              ${n ? this.renderOverlay("error", (P) => this.renderDefaultErrorOverlay(P)) : ""}
 
               <!-- Buffering Loading Spinner Overlay -->
-              ${a && !n ? this.renderOverlay("buffering", (E) => this.renderDefaultBufferingOverlay(E)) : ""}
+              ${a && !n ? this.renderOverlay("buffering", (P) => this.renderDefaultBufferingOverlay(P)) : ""}
 
               <!-- Centered Replay Overlay (not shown in vertical mode) -->
-              ${t === "ended" && !this.playerState.isLive && this.displayMode !== "vertical" && !o && !((v = this.playerState) != null && v.isAdPlaying) ? this.renderOverlay("replay", (E) => this.renderDefaultReplayOverlay(E)) : ""}
+              ${t === "ended" && !this.playerState.isLive && this.displayMode !== "vertical" && !o && !((g = this.playerState) != null && g.isAdPlaying) ? this.renderOverlay("replay", (P) => this.renderDefaultReplayOverlay(P)) : ""}
 
               <!-- Ambient Tap Skip / Volume / Playback Speed gesture feedback ripples -->
-              ${this.tapFeedback && !((y = this.playerState) != null && y.isAdPlaying) ? this.renderOverlay(
+              ${this.tapFeedback && !((m = this.playerState) != null && m.isAdPlaying) ? this.renderOverlay(
       "seek",
-      (E, z) => this.renderDefaultSeekOverlay(E, z),
+      (P, C) => this.renderDefaultSeekOverlay(P, C),
       this.tapFeedback
     ) : ""}
-              ${this.playPauseFeedback && !((b = this.playerState) != null && b.isAdPlaying) ? this.renderOverlay("play-pause", (E) => this.renderDefaultPlayPauseOverlay(E)) : ""}
-              ${this.activeVolumeFeedback && !((S = this.playerState) != null && S.isAdPlaying) ? this.renderOverlay("volume", (E) => this.renderDefaultVolumeOverlay(E)) : ""}
-              ${this.activeSpeedFeedback && !((T = this.playerState) != null && T.isAdPlaying) ? this.renderOverlay("speed", (E) => this.renderDefaultSpeedOverlay(E)) : ""}
+              ${this.playPauseFeedback && !((v = this.playerState) != null && v.isAdPlaying) ? this.renderOverlay("play-pause", (P) => this.renderDefaultPlayPauseOverlay(P)) : ""}
+              ${this.activeVolumeFeedback && !((y = this.playerState) != null && y.isAdPlaying) ? this.renderOverlay("volume", (P) => this.renderDefaultVolumeOverlay(P)) : ""}
+              ${this.activeSpeedFeedback && !((b = this.playerState) != null && b.isAdPlaying) ? this.renderOverlay("speed", (P) => this.renderDefaultSpeedOverlay(P)) : ""}
 
               <!-- Persistent Live Badge for Vertical Player -->
-              ${h === "vertical" && this.playerState.isLive && !((x = this.playerState) != null && x.isAdPlaying) ? this.renderOverlay("live", (E) => this.renderDefaultLiveOverlay(E)) : ""}
+              ${h === "vertical" && this.playerState.isLive && !((S = this.playerState) != null && S.isAdPlaying) ? this.renderOverlay("live", (P) => this.renderDefaultLiveOverlay(P)) : ""}
 
-              ${(A = this.playerState) != null && A.isAdPlaying ? "" : k`
+              ${(T = this.playerState) != null && T.isAdPlaying ? "" : k`
                   <!-- Ambient top/bottom vignette scrim -->
                   <div part="scrim" class="scrim ${d ? "visible" : ""}"></div>
 
@@ -18457,12 +18516,12 @@ const Pi = [
 
                   <!-- Control overlays wrapper -->
                   <div part="controls-overlay" class="controls-overlay">
-                    ${h === "custom" ? k`<slot></slot>` : h === "vertical" ? (($ = (P = this.config) == null ? void 0 : P.controls) == null ? void 0 : $.verticalControls) !== !1 && this.controlsSectionEnabled ? k`
+                    ${h === "custom" ? k`<slot></slot>` : h === "vertical" ? ((E = (x = this.config) == null ? void 0 : x.controls) == null ? void 0 : E.verticalControls) !== !1 && this.controlsSectionEnabled ? k`
                             <player-vertical-controls
                               part="vertical-controls"
                               exportparts="vertical-controls-container, action-rail, rail-btn, seekbar, seekbar-container, hover-tooltip, tooltip-marker-label, thumbnail-container, thumbnail-preview, tooltip-time-text, track, buffer-bar, progress-bar, handle, marker, time-display"
-                              ?hideCurrentTime=${((I = (M = this.config) == null ? void 0 : M.controls) == null ? void 0 : I.currentTime) === !1}
-                              ?hideDuration=${((N = (R = this.config) == null ? void 0 : R.controls) == null ? void 0 : N.duration) === !1}
+                              ?hideCurrentTime=${((O = (A = this.config) == null ? void 0 : A.controls) == null ? void 0 : O.currentTime) === !1}
+                              ?hideDuration=${((I = (M = this.config) == null ? void 0 : M.controls) == null ? void 0 : I.duration) === !1}
                               .currentTime=${i}
                               .duration=${s}
                               .bufferedRanges=${r}
@@ -18489,7 +18548,7 @@ const Pi = [
                               <slot name="social-actions" slot="social-actions"></slot>
                               <slot name="bottom-actions" slot="bottom-actions"></slot>
                             </player-vertical-controls>
-                          ` : "" : ((C = (U = this.config) == null ? void 0 : U.controls) == null ? void 0 : C.controlsBar) !== !1 && this.controlsSectionEnabled ? this.renderStandardControls() : ""}
+                          ` : "" : ((N = (D = this.config) == null ? void 0 : D.controls) == null ? void 0 : N.controlsBar) !== !1 && this.controlsSectionEnabled ? this.renderStandardControls() : ""}
                   </div>
                 `}
 
@@ -18513,14 +18572,14 @@ const Pi = [
                       @keydown=${this.handleContextMenuKeyDown}
                     >
                       ${this.getContextMenuItems().map(
-      (E) => k`
+      (P) => k`
                           <div
-                            class="context-menu-item ${E.disabled ? "disabled" : ""}"
-                            @click=${() => this.handleContextMenuItemClick(E)}
+                            class="context-menu-item ${P.disabled ? "disabled" : ""}"
+                            @click=${() => this.handleContextMenuItemClick(P)}
                             role="menuitem"
-                            tabindex="${E.disabled ? "-1" : "0"}"
+                            tabindex="${P.disabled ? "-1" : "0"}"
                           >
-                            ${E.label}
+                            ${P.label}
                           </div>
                         `
     )}
@@ -18591,76 +18650,79 @@ const Pi = [
   }
 };
 Yt.styles = vs;
-let _ = Yt;
+let z = Yt;
 K([
-  O({ type: String, reflect: !0 })
-], _.prototype, "src");
+  F({ type: String, reflect: !0 })
+], z.prototype, "src");
 K([
-  O({ type: String, reflect: !0 })
-], _.prototype, "captions");
+  F({ type: String, reflect: !0 })
+], z.prototype, "captions");
 K([
-  O({ type: Boolean, reflect: !0 })
-], _.prototype, "autoplay");
+  F({ type: Boolean, reflect: !0 })
+], z.prototype, "autoplay");
 K([
-  O({ type: Boolean, reflect: !0 })
-], _.prototype, "muted");
+  F({ type: Boolean, reflect: !0 })
+], z.prototype, "muted");
 K([
-  O({ type: Number, reflect: !0 })
-], _.prototype, "volume");
+  F({ type: Number, reflect: !0 })
+], z.prototype, "volume");
 K([
-  O({ type: String, attribute: "display-mode", reflect: !0 })
-], _.prototype, "displayMode");
+  F({ type: String, attribute: "display-mode", reflect: !0 })
+], z.prototype, "displayMode");
 K([
-  O({ type: Number })
-], _.prototype, "nearEndThreshold");
+  F({ type: Number })
+], z.prototype, "nearEndThreshold");
 K([
-  O({ type: Boolean, attribute: "auto-scroll", reflect: !0 })
-], _.prototype, "autoScroll");
+  F({ type: Boolean, attribute: "auto-scroll", reflect: !0 })
+], z.prototype, "autoScroll");
 K([
-  O({ type: String, attribute: "live-mode", reflect: !0 })
-], _.prototype, "liveMode");
+  F({ type: String, attribute: "live-mode", reflect: !0 })
+], z.prototype, "liveMode");
 K([
-  O({ type: Object })
-], _.prototype, "config");
+  F({
+    type: Object,
+    converter: { fromAttribute: Gr }
+  })
+], z.prototype, "config");
 K([
-  O({ type: Boolean, attribute: "precise-seek", reflect: !0 })
-], _.prototype, "preciseSeekEnabled");
+  F({ type: Boolean, attribute: "precise-seek", reflect: !0 })
+], z.prototype, "preciseSeekEnabled");
 K([
-  O({ type: Boolean, attribute: "smart-seek", reflect: !0 })
-], _.prototype, "smartSeekEnabled");
+  F({ type: Boolean, attribute: "smart-seek", reflect: !0 })
+], z.prototype, "smartSeekEnabled");
 K([
-  O({ type: String, reflect: !0 })
-], _.prototype, "preload");
+  F({ type: String, reflect: !0 })
+], z.prototype, "preload");
 K([
-  O({ type: Boolean, reflect: !0 })
-], _.prototype, "loop");
+  F({ type: Boolean, reflect: !0 })
+], z.prototype, "loop");
 K([
-  O({ type: Boolean, reflect: !0 })
-], _.prototype, "playsinline");
+  F({ type: Boolean, reflect: !0 })
+], z.prototype, "playsinline");
 K([
-  O({ type: String, reflect: !0 })
-], _.prototype, "poster");
+  F({ type: String, reflect: !0 })
+], z.prototype, "poster");
 K([
-  O({ type: String, reflect: !0 })
-], _.prototype, "crossorigin");
+  F({ type: String, reflect: !0 })
+], z.prototype, "crossorigin");
 K([
   W()
-], _.prototype, "isVisualTransitioning");
+], z.prototype, "isVisualTransitioning");
 K([
   W()
-], _.prototype, "transitionDirection");
+], z.prototype, "transitionDirection");
 K([
   W()
-], _.prototype, "transitionStage");
+], z.prototype, "transitionStage");
 K([
   W()
-], _.prototype, "contextMenuOpen");
+], z.prototype, "contextMenuOpen");
 K([
   W()
-], _.prototype, "contextMenuX");
+], z.prototype, "contextMenuX");
 K([
   W()
-], _.prototype, "contextMenuY");
+], z.prototype, "contextMenuY");
 K([
   W({
     hasChanged(c, e) {
@@ -18731,63 +18793,63 @@ K([
       }) : !0;
     }
   })
-], _.prototype, "playerState");
+], z.prototype, "playerState");
 K([
   W()
-], _.prototype, "controlsVisible");
+], z.prototype, "controlsVisible");
 K([
   W()
-], _.prototype, "settingsMenuOpen");
+], z.prototype, "settingsMenuOpen");
 K([
   W()
-], _.prototype, "activeMenuScreen");
+], z.prototype, "activeMenuScreen");
 K([
   W()
-], _.prototype, "toastMessage");
+], z.prototype, "toastMessage");
 K([
   W()
-], _.prototype, "toastType");
+], z.prototype, "toastType");
 K([
   W()
-], _.prototype, "toastVisible");
+], z.prototype, "toastVisible");
 K([
   W()
-], _.prototype, "tapFeedback");
+], z.prototype, "tapFeedback");
 K([
   W()
-], _.prototype, "feedbackTaps");
+], z.prototype, "feedbackTaps");
 K([
   W()
-], _.prototype, "playPauseFeedback");
+], z.prototype, "playPauseFeedback");
 K([
   W()
-], _.prototype, "activeVolumeFeedback");
+], z.prototype, "activeVolumeFeedback");
 K([
   W()
-], _.prototype, "isSeekingInteraction");
+], z.prototype, "isSeekingInteraction");
 K([
   W()
-], _.prototype, "activeSpeedFeedback");
+], z.prototype, "activeSpeedFeedback");
 K([
   W()
-], _.prototype, "activeQualityFeedback");
+], z.prototype, "activeQualityFeedback");
 K([
   Ss("video")
-], _.prototype, "videoElement");
+], z.prototype, "videoElement");
 K([
   W()
-], _.prototype, "isPreciseSeeking");
+], z.prototype, "isPreciseSeeking");
 K([
   W()
-], _.prototype, "speedLockState");
+], z.prototype, "speedLockState");
 K([
   W()
-], _.prototype, "isSpeedOverlayFadingOut");
+], z.prototype, "isSpeedOverlayFadingOut");
 K([
   W()
-], _.prototype, "isVolumeFeedbackFadingOut");
-if (typeof window < "u" && typeof customElements < "u" && (customElements.get("streamit-player") || customElements.define("streamit-player", _), !customElements.get("player-player"))) {
-  class c extends _ {
+], z.prototype, "isVolumeFeedbackFadingOut");
+if (typeof window < "u" && typeof customElements < "u" && (customElements.get("streamit-player") || customElements.define("streamit-player", z), !customElements.get("player-player"))) {
+  class c extends z {
   }
   customElements.define("player-player", c);
 }
@@ -18804,7 +18866,7 @@ export {
   As as AdsValidator,
   rt as AutoThumbnailProvider,
   He as DrmManager,
-  Yr as DrmValidator,
+  Jr as DrmValidator,
   ut as HtmlOverlayRenderer,
   Q as IconRegistry,
   kt as ImaProvider,
@@ -18813,7 +18875,7 @@ export {
   Sr as PlayerController,
   Pr as PlayerIconRegistry,
   qe as PlayerPlayButton,
-  _ as PlayerPlayer,
+  z as PlayerPlayer,
   Re as PlayerSeekButton,
   X as PlayerSeekbar,
   he as PlayerVerticalControls,
@@ -18832,7 +18894,7 @@ export {
   pr as VideoFrameThumbnailProvider,
   wi as VmapProvider,
   Br as compileTheme,
-  Xr as detectSupportedKeySystems,
+  Zr as detectSupportedKeySystems,
   de as formatTime,
   qi as isClearKeySupported,
   Hi as isFairPlaySupported,