itube-modern-player 0.1.0 → 0.2.0

package/dist/core.js

@@ -1,13 +1,13 @@
 import { d as I } from "./labels-C3gAZEm-.js";
 function l(r, t, e) {
-  const i = document.createElement(r);
-  if (t && (i.className = t), e)
-    for (const [s, n] of Object.entries(e)) i.setAttribute(s, n);
-  return i;
+  const s = document.createElement(r);
+  if (t && (s.className = t), e)
+    for (const [i, n] of Object.entries(e)) s.setAttribute(i, n);
+  return s;
 }
 function m(r, t, e) {
-  const i = l("button", `imp-btn ${r}`, { type: "button", "aria-label": t, title: t });
-  return i.innerHTML = e, i;
+  const s = l("button", `imp-btn ${r}`, { type: "button", "aria-label": t, title: t });
+  return s.innerHTML = e, s;
 }
 function E(r, t, e) {
   r.innerHTML = t, e !== void 0 && (r.setAttribute("aria-label", e), r.setAttribute("title", e));
@@ -17,29 +17,29 @@ function y(r, t, e) {
 }
 function w(r) {
   if (!Number.isFinite(r) || r < 0) return "0:00";
-  const t = Math.floor(r % 60), e = Math.floor(r / 60 % 60), i = Math.floor(r / 3600), s = i > 0 ? String(e).padStart(2, "0") : String(e), n = String(t).padStart(2, "0");
-  return i > 0 ? `${i}:${s}:${n}` : `${s}:${n}`;
+  const t = Math.floor(r % 60), e = Math.floor(r / 60 % 60), s = Math.floor(r / 3600), i = s > 0 ? String(e).padStart(2, "0") : String(e), n = String(t).padStart(2, "0");
+  return s > 0 ? `${s}:${i}:${n}` : `${i}:${n}`;
 }
 function R(r) {
   const t = r.trim().match(/^(?:(\d+):)?(\d{1,2}):(\d{2})(?:[.,](\d{1,3}))?$/);
   if (!t) return null;
-  const e = t[1] ? Number(t[1]) : 0, i = Number(t[2]), s = Number(t[3]), n = t[4] ? Number(t[4].padEnd(3, "0")) : 0;
-  return e * 3600 + i * 60 + s + n / 1e3;
+  const e = t[1] ? Number(t[1]) : 0, s = Number(t[2]), i = Number(t[3]), n = t[4] ? Number(t[4].padEnd(3, "0")) : 0;
+  return e * 3600 + s * 60 + i + n / 1e3;
 }
 function U(r) {
   const t = [], e = r.replace(/\r\n?/g, `
 `).split(/\n\n+/);
-  for (const i of e) {
-    const s = i.split(`
+  for (const s of e) {
+    const i = s.split(`
 `).filter((f) => f.trim() !== "");
-    if (s.length === 0) continue;
-    let n = s.findIndex((f) => f.includes("-->"));
+    if (i.length === 0) continue;
+    let n = i.findIndex((f) => f.includes("-->"));
     if (n === -1) continue;
-    const [o, a] = s[n].split("-->"), h = R(o), c = R((a ?? "").split(" ")[1] ?? a ?? "") ?? R(a ?? "");
-    if (h === null || c === null) continue;
-    const u = s.slice(n + 1).join(`
+    const [o, a] = i[n].split("-->"), c = R(o), h = R((a ?? "").split(" ")[1] ?? a ?? "") ?? R(a ?? "");
+    if (c === null || h === null) continue;
+    const u = i.slice(n + 1).join(`
 `).trim();
-    u && t.push({ start: h, end: c, text: u });
+    u && t.push({ start: c, end: h, text: u });
   }
   return t;
 }
@@ -56,24 +56,24 @@ class Y {
   }
   /** Subscribe. Returns an unsubscribe function. */
   on(t, e) {
-    let i = this.listeners.get(t);
-    return i || (i = /* @__PURE__ */ new Set(), this.listeners.set(t, i)), i.add(e), () => this.off(t, e);
+    let s = this.listeners.get(t);
+    return s || (s = /* @__PURE__ */ new Set(), this.listeners.set(t, s)), s.add(e), () => this.off(t, e);
   }
   once(t, e) {
-    const i = this.on(t, (s) => {
-      i(), e(s);
+    const s = this.on(t, (i) => {
+      s(), e(i);
     });
-    return i;
+    return s;
   }
   off(t, e) {
     this.listeners.get(t)?.delete(e);
   }
   emit(t, e) {
-    const i = this.listeners.get(t);
-    if (i)
-      for (const s of [...i])
+    const s = this.listeners.get(t);
+    if (s)
+      for (const i of [...s])
         try {
-          s(e);
+          i(e);
         } catch (n) {
           console.error("[itube-player] listener error", n);
         }
@@ -127,30 +127,30 @@ function xt() {
 }
 function et(r, t, e = 100) {
   if (r.length === 0 || !Number.isFinite(t) || t <= 0) return [];
-  const i = new Array(e).fill(0);
-  let s = !1;
-  for (const c of r) {
-    if (!Number.isFinite(c.time) || c.time < 0 || c.time > t) continue;
-    const u = Math.max(0, c.value);
+  const s = new Array(e).fill(0);
+  let i = !1;
+  for (const h of r) {
+    if (!Number.isFinite(h.time) || h.time < 0 || h.time > t) continue;
+    const u = Math.max(0, h.value);
     if (u === 0) continue;
-    const f = Math.min(e - 1, Math.floor(c.time / t * e));
-    i[f] += u, s = !0;
+    const f = Math.min(e - 1, Math.floor(h.time / t * e));
+    s[f] += u, i = !0;
   }
-  if (!s) return [];
-  const n = [0.06, 0.24, 0.4, 0.24, 0.06], o = i.map(
-    (c, u) => n.reduce((f, d, b) => f + d * (i[u + b - 2] ?? 0), 0)
+  if (!i) return [];
+  const n = [0.06, 0.24, 0.4, 0.24, 0.06], o = s.map(
+    (h, u) => n.reduce((f, d, b) => f + d * (s[u + b - 2] ?? 0), 0)
   ), a = Math.max(...o);
   if (a <= 0) return [];
-  const h = 0.08;
-  return o.map((c) => h + (1 - h) * (c / a));
+  const c = 0.08;
+  return o.map((h) => c + (1 - c) * (h / a));
 }
 function it(r, t = 1e3, e = 100) {
   if (r.length === 0) return "";
-  const i = t / (r.length - 1 || 1);
-  let s = `M 0 ${e}`;
+  const s = t / (r.length - 1 || 1);
+  let i = `M 0 ${e}`;
   return r.forEach((n, o) => {
-    s += ` L ${(o * i).toFixed(1)} ${(e - n * e).toFixed(1)}`;
-  }), s += ` L ${t} ${e} Z`, s;
+    i += ` L ${(o * s).toFixed(1)} ${(e - n * e).toFixed(1)}`;
+  }), i += ` L ${t} ${e} Z`, i;
 }
 async function st(r, t) {
   if (r.src)
@@ -164,8 +164,8 @@ async function st(r, t) {
   if (!r.vastTag) throw new Error('Ad roll has neither "vastTag" nor "src"');
   return j(r, r.vastTag, t, 0, { impressions: [], tracking: {} });
 }
-async function j(r, t, e, i, s) {
-  if (i > e.maxWrapperDepth) throw new Error("VAST wrapper depth limit exceeded");
+async function j(r, t, e, s, i) {
+  if (s > e.maxWrapperDepth) throw new Error("VAST wrapper depth limit exceeded");
   const n = new AbortController(), o = setTimeout(() => n.abort(), e.requestTimeout);
   let a;
   try {
@@ -175,18 +175,18 @@ async function j(r, t, e, i, s) {
   } finally {
     clearTimeout(o);
   }
-  const h = new DOMParser().parseFromString(a, "text/xml");
-  if (h.querySelector("parsererror")) throw new Error("VAST response is not valid XML");
-  const c = h.querySelector("VAST > Ad");
-  if (!c) throw new Error("VAST response contains no ads");
-  nt(c, s);
-  const u = c.querySelector(":scope > Wrapper");
+  const c = new DOMParser().parseFromString(a, "text/xml");
+  if (c.querySelector("parsererror")) throw new Error("VAST response is not valid XML");
+  const h = c.querySelector("VAST > Ad");
+  if (!h) throw new Error("VAST response contains no ads");
+  nt(h, i);
+  const u = h.querySelector(":scope > Wrapper");
   if (u) {
     const v = k(u.querySelector("VASTAdTagURI"));
     if (!v) throw new Error("VAST wrapper without VASTAdTagURI");
-    return j(r, v, e, i + 1, s);
+    return j(r, v, e, s + 1, i);
   }
-  const f = c.querySelector(":scope > InLine");
+  const f = h.querySelector(":scope > InLine");
   if (!f) throw new Error("VAST ad has neither InLine nor Wrapper");
   const d = f.querySelector("Creatives > Creative > Linear");
   if (!d) throw new Error("VAST ad has no Linear creative");
@@ -202,24 +202,24 @@ async function j(r, t, e, i, s) {
       d.getAttribute("skipoffset"),
       V(k(d.querySelector(":scope > Duration")))
     ),
-    impressions: s.impressions,
-    tracking: s.tracking,
+    impressions: i.impressions,
+    tracking: i.tracking,
     adTitle: k(f.querySelector(":scope > AdTitle")) ?? void 0
   };
 }
 function nt(r, t) {
-  var e, i;
-  for (const s of r.querySelectorAll("Impression")) {
-    const n = k(s);
+  var e, s;
+  for (const i of r.querySelectorAll("Impression")) {
+    const n = k(i);
     n && t.impressions.push(n);
   }
-  for (const s of r.querySelectorAll("Linear > TrackingEvents > Tracking")) {
-    const n = s.getAttribute("event"), o = k(s);
+  for (const i of r.querySelectorAll("Linear > TrackingEvents > Tracking")) {
+    const n = i.getAttribute("event"), o = k(i);
     !n || !o || ["start", "firstQuartile", "midpoint", "thirdQuartile", "complete", "skip", "pause", "resume"].includes(n) && ((e = t.tracking)[n] ?? (e[n] = [])).push(o);
   }
-  for (const s of r.querySelectorAll("Linear > VideoClicks > ClickTracking")) {
-    const n = k(s);
-    n && ((i = t.tracking).click ?? (i.click = [])).push(n);
+  for (const i of r.querySelectorAll("Linear > VideoClicks > ClickTracking")) {
+    const n = k(i);
+    n && ((s = t.tracking).click ?? (s.click = [])).push(n);
   }
 }
 function rt(r) {
@@ -234,7 +234,7 @@ function rt(r) {
   );
   if (e.length === 0) return null;
   e.sort((o, a) => o.bitrate - a.bitrate);
-  const i = e.filter((o) => o.delivery !== "streaming"), s = i.length > 0 ? i : e, n = s[Math.floor(s.length / 2)];
+  const s = e.filter((o) => o.delivery !== "streaming"), i = s.length > 0 ? s : e, n = i[Math.floor(i.length / 2)];
   return { url: n.url, type: n.type };
 }
 function V(r) {
@@ -310,7 +310,7 @@ class lt {
   /** Called from timeupdate; fires due mid-rolls. */
   checkMidRolls(t) {
     if (this.adPlaying) return;
-    const e = this.pending("midRoll").filter((i) => i.timer !== void 0 && t >= i.timer);
+    const e = this.pending("midRoll").filter((s) => s.timer !== void 0 && t >= s.timer);
     e.length > 0 && this.playRolls(e);
   }
   pending(t) {
@@ -321,8 +321,8 @@ class lt {
     if (this.activeBreak) return this.activeBreak;
     this.ensureAdVideo();
     const e = (async () => {
-      const i = this.host.contentVideo, s = !i.paused && !i.ended;
-      i.pause();
+      const s = this.host.contentVideo, i = !s.paused && !s.ended;
+      s.pause();
       for (const n of t) {
         this.playedRolls.add(n);
         try {
@@ -334,7 +334,7 @@ class lt {
         }
         if (this.destroyed) return;
       }
-      (s || t[0].roll === "preRoll") && i.play().catch(() => {
+      (i || t[0].roll === "preRoll") && s.play().catch(() => {
       });
     })();
     return this.activeBreak = e.finally(() => {
@@ -343,17 +343,17 @@ class lt {
   }
   playAd(t) {
     return new Promise((e) => {
-      const { labels: i } = this.host, s = l("div", "imp-ad"), n = this.ensureAdVideo(), o = new AbortController(), a = o.signal;
+      const { labels: s } = this.host, i = l("div", "imp-ad"), n = this.ensureAdVideo(), o = new AbortController(), a = o.signal;
       n.src = t.mediaUrl, n.muted = this.host.contentVideo.muted, n.volume = this.host.contentVideo.volume;
-      const h = l("div", "imp-spinner imp-ad__spinner"), c = l("div", "imp-ad__hud"), u = l("span", "imp-ad__badge");
-      u.textContent = t.adTitle ? `${i.adLabel} · ${t.adTitle}` : i.adLabel;
+      const c = l("div", "imp-spinner imp-ad__spinner"), h = l("div", "imp-ad__hud"), u = l("span", "imp-ad__badge");
+      u.textContent = t.adTitle ? `${s.adLabel} · ${t.adTitle}` : s.adLabel;
       const f = l("span", "imp-ad__countdown");
-      c.append(u, f);
+      h.append(u, f);
       const d = l("div", "imp-ad__actions");
       let b = null;
-      t.clickThrough && (b = l("button", "imp-ad__visit", { type: "button" }), b.textContent = i.visitAdvertiser, d.append(b));
+      t.clickThrough && (b = l("button", "imp-ad__visit", { type: "button" }), b.textContent = s.visitAdvertiser, d.append(b));
       const v = l("button", "imp-ad__skip", { type: "button" });
-      v.hidden = !0, d.append(v), s.append(n, h, c, d), this.host.container.append(s), this.layer = s;
+      v.hidden = !0, d.append(v), i.append(n, c, h, d), this.host.container.append(i), this.layer = i;
       const H = t.skipOffset ?? this.opts.skipDelay, N = /* @__PURE__ */ new Set(), L = (g) => {
         N.has(g) || (N.add(g), C(t.tracking[g]));
       };
@@ -372,21 +372,21 @@ class lt {
           error: new Error(`Ad media stalled for ${this.opts.mediaTimeout} ms — skipping`)
         }), A());
       }, 500), A = () => {
-        clearInterval(X), o.abort(), n.pause(), n.removeAttribute("src"), n.load(), s.remove(), this.layer = null, e();
+        clearInterval(X), o.abort(), n.pause(), n.removeAttribute("src"), n.load(), i.remove(), this.layer = null, e();
       }, O = (g) => {
         g ? (L("skip"), this.host.emitter.emit("adskip", { ad: t })) : L("complete"), this.host.emitter.emit("adend", { ad: t }), A();
       };
       n.addEventListener("playing", () => {
         C(t.impressions), L("start"), this.host.emitter.emit("adstart", { ad: t });
       }, { once: !0, signal: a }), n.addEventListener("playing", () => {
-        h.hidden = !0;
+        c.hidden = !0;
       }, { signal: a }), n.addEventListener("waiting", () => {
-        h.hidden = !1;
+        c.hidden = !1;
       }, { signal: a }), n.addEventListener("timeupdate", () => {
         const g = n.currentTime, x = n.duration;
         if (Number.isFinite(x) && x > 0 && (f.textContent = w(Math.max(0, x - g)), g / x >= 0.25 && L("firstQuartile"), g / x >= 0.5 && L("midpoint"), g / x >= 0.75 && L("thirdQuartile")), H >= 0) {
           const z = Math.ceil(H - g);
-          z > 0 ? (v.hidden = !1, v.disabled = !0, v.textContent = `${i.skipAdIn} ${z}`) : (v.hidden = !1, v.disabled = !1, v.textContent = i.skipAd);
+          z > 0 ? (v.hidden = !1, v.disabled = !0, v.textContent = `${s.skipAdIn} ${z}`) : (v.hidden = !1, v.disabled = !1, v.textContent = s.skipAd);
         }
       }, { signal: a }), n.addEventListener("ended", () => O(!1), { signal: a }), n.addEventListener("error", () => {
         this.host.emitter.emit("aderror", {
@@ -402,14 +402,14 @@ class lt {
       n.addEventListener("playing", () => {
         W = !0;
       }, { once: !0, signal: a }), n.addEventListener("pause", () => {
-        n.ended || !s.isConnected || (s.classList.add("imp-ad--paused"), W && !B && (B = !0, C(t.tracking.pause), this.host.emitter.emit("adpause", { ad: t })));
+        n.ended || !i.isConnected || (i.classList.add("imp-ad--paused"), W && !B && (B = !0, C(t.tracking.pause), this.host.emitter.emit("adpause", { ad: t })));
       }, { signal: a }), n.addEventListener("play", () => {
-        s.classList.remove("imp-ad--paused"), B && (B = !1, C(t.tracking.resume), this.host.emitter.emit("adresume", { ad: t }));
-      }, { signal: a }), s.addEventListener("click", (g) => {
-        (g.target === s || s.classList.contains("imp-ad--paused")) && n.paused && n.play().catch(() => {
+        i.classList.remove("imp-ad--paused"), B && (B = !1, C(t.tracking.resume), this.host.emitter.emit("adresume", { ad: t }));
+      }, { signal: a }), i.addEventListener("click", (g) => {
+        (g.target === i || i.classList.contains("imp-ad--paused")) && n.paused && n.play().catch(() => {
         });
       }), n.play().catch(() => {
-        s.classList.add("imp-ad--paused");
+        i.classList.add("imp-ad--paused");
       });
     });
   }
@@ -422,20 +422,20 @@ class lt {
   }
 }
 function at(r, t) {
-  const e = [...r].sort((s, n) => s.start - n.start), i = [];
-  for (let s = 0; s < e.length; s++) {
-    const n = Math.max(0, e[s].start);
+  const e = [...r].sort((i, n) => i.start - n.start), s = [];
+  for (let i = 0; i < e.length; i++) {
+    const n = Math.max(0, e[i].start);
     if (Number.isFinite(t) && n >= t) continue;
-    let o = e[s].end ?? e[s + 1]?.start ?? t;
-    Number.isFinite(t) && (o = Math.min(o, t)), !(o <= n) && i.push({ start: n, end: o, title: e[s].title });
+    let o = e[i].end ?? e[i + 1]?.start ?? t;
+    Number.isFinite(t) && (o = Math.min(o, t)), !(o <= n) && s.push({ start: n, end: o, title: e[i].title });
   }
-  return i;
+  return s;
 }
 async function ht(r) {
   const t = await fetch(r);
   if (!t.ok) throw new Error(`Failed to load chapters VTT (${t.status})`);
   const e = await t.text();
-  return U(e).map((i) => ({ start: i.start, end: i.end, title: i.text }));
+  return U(e).map((s) => ({ start: s.start, end: s.end, title: s.text }));
 }
 function K(r, t) {
   for (const e of r)
@@ -452,16 +452,16 @@ async function dt() {
   if (r)
     return S = r, S;
   try {
-    S = (await import("hls.js")).default;
+    S = (await import("hls.js/light")).default;
   } catch {
     S = null;
   }
   return S;
 }
-async function ut(r, t, e, i) {
+async function ut(r, t, e, s) {
   if (ct(t, e)) {
-    const s = r.canPlayType("application/vnd.apple.mpegurl"), n = s ? null : await dt();
-    return n && n.isSupported() ? pt(n, r, t, i) : s ? (r.src = t, $(r)) : (i.onError("HLS is not supported in this browser and hls.js could not be loaded."), $(r));
+    const i = r.canPlayType("application/vnd.apple.mpegurl"), n = i ? null : await dt();
+    return n && n.isSupported() ? pt(n, r, t, s) : i ? (r.src = t, $(r)) : (s.onError("HLS is not supported in this browser and hls.js could not be loaded."), $(r));
   }
   return r.src = t, $(r);
 }
@@ -477,50 +477,50 @@ function $(r) {
     }
   };
 }
-function pt(r, t, e, i) {
-  const s = new r({ enableWorker: !0 }), n = {
+function pt(r, t, e, s) {
+  const i = new r({ enableWorker: !0 }), n = {
     kind: "hls",
     levels: [],
     selected: -1,
-    setLevel(h) {
-      n.selected = h, s.currentLevel = h;
+    setLevel(c) {
+      n.selected = c, i.currentLevel = c;
     },
     destroy() {
-      s.destroy(), t.removeAttribute("src"), t.load();
+      i.destroy(), t.removeAttribute("src"), t.load();
     }
   };
-  s.on(r.Events.MANIFEST_PARSED, () => {
-    n.levels = s.levels.map((h, c) => ({
-      index: c,
-      label: h.height ? `${h.height}p` : `${Math.round(h.bitrate / 1e3)} kbps`
-    })).reverse(), i.onLevels(n.levels);
-  }), s.on(r.Events.LEVEL_SWITCHED, (h, c) => {
-    const u = s.levels[c.level];
-    u && i.onLevelSwitch(u.height ? `${u.height}p` : `${Math.round(u.bitrate / 1e3)} kbps`);
+  i.on(r.Events.MANIFEST_PARSED, () => {
+    n.levels = i.levels.map((c, h) => ({
+      index: h,
+      label: c.height ? `${c.height}p` : `${Math.round(c.bitrate / 1e3)} kbps`
+    })).reverse(), s.onLevels(n.levels);
+  }), i.on(r.Events.LEVEL_SWITCHED, (c, h) => {
+    const u = i.levels[h.level];
+    u && s.onLevelSwitch(u.height ? `${u.height}p` : `${Math.round(u.bitrate / 1e3)} kbps`);
   });
   let o = 0, a = !1;
-  return s.on(r.Events.ERROR, (h, c) => {
-    if (c.fatal)
-      switch (c.type) {
+  return i.on(r.Events.ERROR, (c, h) => {
+    if (h.fatal)
+      switch (h.type) {
         case r.ErrorTypes.NETWORK_ERROR:
-          s.startLoad();
+          i.startLoad();
           break;
         case r.ErrorTypes.MEDIA_ERROR:
-          o < 3 ? (o++, s.recoverMediaError()) : (i.onError(`HLS media error: ${c.details}`, c), s.destroy());
+          o < 3 ? (o++, i.recoverMediaError()) : (s.onError(`HLS media error: ${h.details}`, h), i.destroy());
           break;
         default:
           if (a)
-            i.onError(`HLS fatal error: ${c.details}`, c), s.destroy();
+            s.onError(`HLS fatal error: ${h.details}`, h), i.destroy();
           else {
             a = !0;
             try {
-              s.loadSource(e), s.startLoad();
+              i.loadSource(e), i.startLoad();
             } catch {
-              i.onError(`HLS fatal error: ${c.details}`, c), s.destroy();
+              s.onError(`HLS fatal error: ${h.details}`, h), i.destroy();
             }
           }
       }
-  }), s.loadSource(e), s.attachMedia(t), n;
+  }), i.loadSource(e), i.attachMedia(t), n;
 }
 class q {
   constructor(t) {
@@ -529,25 +529,25 @@ class q {
   static async load(t) {
     const e = await fetch(t);
     if (!e.ok) throw new Error(`Failed to load thumbnails VTT (${e.status})`);
-    const i = await e.text(), s = [];
-    for (const n of U(i)) {
+    const s = await e.text(), i = [];
+    for (const n of U(s)) {
       const [o, a] = n.text.trim().split("#");
       if (!o) continue;
-      const h = {
+      const c = {
         start: n.start,
         end: n.end,
         src: G(o, t)
-      }, c = a?.match(/xywh=(\d+),(\d+),(\d+),(\d+)/);
-      c && (h.xywh = { x: Number(c[1]), y: Number(c[2]), w: Number(c[3]), h: Number(c[4]) }), s.push(h);
+      }, h = a?.match(/xywh=(\d+),(\d+),(\d+),(\d+)/);
+      h && (c.xywh = { x: Number(h[1]), y: Number(h[2]), w: Number(h[3]), h: Number(h[4]) }), i.push(c);
     }
-    return s.sort((n, o) => n.start - o.start), new q(s);
+    return i.sort((n, o) => n.start - o.start), new q(i);
   }
   cueAt(t) {
-    let e = 0, i = this.cues.length - 1;
-    for (; e <= i; ) {
-      const s = e + i >> 1, n = this.cues[s];
-      if (t < n.start) i = s - 1;
-      else if (t >= n.end) e = s + 1;
+    let e = 0, s = this.cues.length - 1;
+    for (; e <= s; ) {
+      const i = e + s >> 1, n = this.cues[i];
+      if (t < n.start) s = i - 1;
+      else if (t >= n.end) e = i + 1;
       else return n;
     }
     return null;
@@ -569,27 +569,27 @@ class M {
     this.root.textContent = "";
     for (const e of t) {
       if (e.items.length === 0) continue;
-      const i = l("div", "imp-menu__section");
+      const s = l("div", "imp-menu__section");
       if (e.title) {
-        const s = l("div", "imp-menu__title");
-        s.textContent = e.title, i.append(s);
+        const i = l("div", "imp-menu__title");
+        i.textContent = e.title, s.append(i);
       }
-      for (const s of e.items) {
+      for (const i of e.items) {
         const n = l("button", "imp-menu__item", { type: "button", role: "menuitemradio" });
-        if (n.setAttribute("aria-checked", String(s.active)), s.active && n.classList.add("imp-menu__item--active"), s.icon) {
+        if (n.setAttribute("aria-checked", String(i.active)), i.active && n.classList.add("imp-menu__item--active"), i.icon) {
           const a = l("span", "imp-menu__icon");
-          s.icon.trimStart().startsWith("<svg") ? a.innerHTML = s.icon : a.append(l("img", "", { src: s.icon, alt: "" })), n.append(a);
+          i.icon.trimStart().startsWith("<svg") ? a.innerHTML = i.icon : a.append(l("img", "", { src: i.icon, alt: "" })), n.append(a);
         }
         const o = l("span", "imp-menu__label");
-        o.textContent = s.label, n.append(o), n.addEventListener("click", () => {
-          e.onSelect(s.value), this.close();
-        }), i.append(n);
+        o.textContent = i.label, n.append(o), n.addEventListener("click", () => {
+          e.onSelect(i.value), this.close();
+        }), s.append(n);
       }
-      this.root.append(i);
+      this.root.append(s);
     }
     this.root.hidden = !1, this.backdrop.hidden = !1, this.outsideListener = (e) => {
-      const i = e.target;
-      !this.root.contains(i) && !this.anchor.contains(i) && this.close();
+      const s = e.target;
+      !this.root.contains(s) && !this.anchor.contains(s) && this.close();
     }, setTimeout(() => {
       this.outsideListener && document.addEventListener("pointerdown", this.outsideListener);
     }, 0);
@@ -618,12 +618,12 @@ class mt {
   }
   setChapters(t) {
     this.chapters = t, this.track.textContent = "", this.segments = [];
-    const e = t.length > 0 ? t : [{ start: 0, end: this.duration || 1, title: "" }], i = [];
-    let s = 0;
+    const e = t.length > 0 ? t : [{ start: 0, end: this.duration || 1, title: "" }], s = [];
+    let i = 0;
     for (const n of e)
-      n.start > s && i.push({ start: s, end: n.start, title: "" }), i.push(n), s = n.end;
-    this.duration > 0 && s < this.duration && i.push({ start: s, end: this.duration, title: "" });
-    for (const n of i) {
+      n.start > i && s.push({ start: i, end: n.start, title: "" }), s.push(n), i = n.end;
+    this.duration > 0 && i < this.duration && s.push({ start: i, end: this.duration, title: "" });
+    for (const n of s) {
       const o = l("div", "imp-progress__segment");
       o.style.flexGrow = String(Math.max(n.end - n.start, 0.01));
       const a = l("div", "imp-progress__fill");
@@ -633,16 +633,16 @@ class mt {
   setThumbnails(t) {
     this.thumbnails = t;
   }
-  update(t, e, i) {
+  update(t, e, s) {
     if (e !== this.duration && Number.isFinite(e) && this.setDuration(e), this.scrubbing) return;
     this.render(t);
-    const s = this.duration > 0 ? y(i / this.duration, 0, 1) : 0;
-    this.buffered.style.width = `${s * 100}%`, this.root.setAttribute("aria-valuemin", "0"), this.root.setAttribute("aria-valuemax", String(Math.round(this.duration))), this.root.setAttribute("aria-valuenow", String(Math.round(t))), this.root.setAttribute("aria-valuetext", `${w(t)} / ${w(this.duration)}`);
+    const i = this.duration > 0 ? y(s / this.duration, 0, 1) : 0;
+    this.buffered.style.width = `${i * 100}%`, this.root.setAttribute("aria-valuemin", "0"), this.root.setAttribute("aria-valuemax", String(Math.round(this.duration))), this.root.setAttribute("aria-valuenow", String(Math.round(t))), this.root.setAttribute("aria-valuetext", `${w(t)} / ${w(this.duration)}`);
   }
   render(t) {
-    for (const { chapter: i, fill: s } of this.segments) {
-      const n = i.end - i.start, o = n > 0 ? y((t - i.start) / n, 0, 1) : 0;
-      s.style.transform = `scaleX(${o})`;
+    for (const { chapter: s, fill: i } of this.segments) {
+      const n = s.end - s.start, o = n > 0 ? y((t - s.start) / n, 0, 1) : 0;
+      i.style.transform = `scaleX(${o})`;
     }
     const e = this.duration > 0 ? y(t / this.duration, 0, 1) : 0;
     this.handle.style.left = `${e * 100}%`;
@@ -665,10 +665,10 @@ class mt {
   showTooltip(t) {
     const e = this.timeFromEvent(t);
     this.tooltipTime.textContent = w(e);
-    const i = K(this.chapters, e);
-    this.tooltipChapter.textContent = i?.title ?? "", this.tooltipChapter.hidden = !i?.title;
-    const s = this.thumbnails?.cueAt(e) ?? null;
-    s ? (this.tooltipThumb.hidden = !1, this.tooltipThumb.style.backgroundImage = `url("${s.src}")`, s.xywh ? (this.tooltipThumb.style.width = `${s.xywh.w}px`, this.tooltipThumb.style.height = `${s.xywh.h}px`, this.tooltipThumb.style.backgroundPosition = `-${s.xywh.x}px -${s.xywh.y}px`, this.tooltipThumb.style.backgroundSize = "auto") : (this.tooltipThumb.style.width = "160px", this.tooltipThumb.style.height = "90px", this.tooltipThumb.style.backgroundPosition = "center", this.tooltipThumb.style.backgroundSize = "cover")) : this.tooltipThumb.hidden = !0, this.tooltip.classList.add("imp-progress__tooltip--visible");
+    const s = K(this.chapters, e);
+    this.tooltipChapter.textContent = s?.title ?? "", this.tooltipChapter.hidden = !s?.title;
+    const i = this.thumbnails?.cueAt(e) ?? null;
+    i ? (this.tooltipThumb.hidden = !1, this.tooltipThumb.style.backgroundImage = `url("${i.src}")`, i.xywh ? (this.tooltipThumb.style.width = `${i.xywh.w}px`, this.tooltipThumb.style.height = `${i.xywh.h}px`, this.tooltipThumb.style.backgroundPosition = `-${i.xywh.x}px -${i.xywh.y}px`, this.tooltipThumb.style.backgroundSize = "auto") : (this.tooltipThumb.style.width = "160px", this.tooltipThumb.style.height = "90px", this.tooltipThumb.style.backgroundPosition = "center", this.tooltipThumb.style.backgroundSize = "cover")) : this.tooltipThumb.hidden = !0, this.tooltip.classList.add("imp-progress__tooltip--visible");
     const n = this.root.getBoundingClientRect(), o = y(t.clientX - n.left, 0, n.width), a = this.tooltip.offsetWidth / 2;
     this.tooltip.style.left = `${y(o, a, Math.max(a, n.width - a))}px`;
   }
@@ -679,7 +679,7 @@ class mt {
 const _ = class _ {
   constructor(t) {
     this.player = t, this.subtitlesBtn = null, this.settingsBtn = null, this.settingsMenu = null, this.subtitlesMenu = null, this.moreMenu = null, this.moreWrap = null, this.qualityBtn = null, this.qualityMenu = null, this.scenesBtn = null, this.likeBtn = null, this.dislikeBtn = null, this.likeCountEl = null, this.dislikeCountEl = null, this.prevBtn = null, this.nextBtn = null, this.seekBackBtn = null, this.seekFwdBtn = null, this.centerPlayBtn = null, this.centerPrevBtn = null, this.centerNextBtn = null, this.collapsibles = [], this.overflowed = /* @__PURE__ */ new Set(), this.resizeObserver = null, this.reflowScheduled = !1, this.actionItems = [], this.wasPlayingBeforeScrub = !1, this.disposers = [], this.onWindowResize = null;
-    const { labels: e, icons: i } = t, s = t.controlsOptions;
+    const { labels: e, icons: s } = t, i = t.controlsOptions;
     this.root = l("div", "imp-controls"), this.progress = new mt({
       onSeek: (d) => t.seek(d),
       onScrubStart: () => {
@@ -688,17 +688,17 @@ const _ = class _ {
       onScrubEnd: () => {
         this.wasPlayingBeforeScrub && t.play();
       }
-    }), s.progress && this.root.append(this.progress.root);
+    }), i.progress && this.root.append(this.progress.root);
     const n = l("div", "imp-controls__row");
     this.row = n, this.root.append(n);
     const o = l("div", "imp-controls__group"), a = l("div", "imp-controls__group");
     this.rightGroup = a;
-    const h = l("div", "imp-controls__spacer");
-    this.chapterLabel = l("div", "imp-controls__chapter"), n.append(o, h, a), h.append(this.chapterLabel);
-    const c = typeof s.seekButtons == "object" ? s.seekButtons : {}, u = c.back ?? t.seekStep, f = c.forward ?? t.seekStep;
-    if (s.playlist && t.hasPlaylist && (this.prevBtn = m("imp-btn--prev", e.previous, i.previous), this.prevBtn.addEventListener("click", () => t.previous()), o.append(this.prevBtn)), s.seekButtons && (this.seekBackBtn = m("imp-btn--seek-back", `${e.seekBack} ${u}s`, i.seekBack), this.seekBackBtn.addEventListener("click", () => t.skip(-u)), o.append(this.seekBackBtn)), s.play && (this.playBtn = m("imp-btn--play", e.play, i.play), this.playBtn.addEventListener("click", () => t.togglePlay()), o.append(this.playBtn)), s.seekButtons && (this.seekFwdBtn = m("imp-btn--seek-forward", `${e.seekForward} ${f}s`, i.seekForward), this.seekFwdBtn.addEventListener("click", () => t.skip(f)), o.append(this.seekFwdBtn)), s.playlist && t.hasPlaylist && (this.nextBtn = m("imp-btn--next", e.next, i.next), this.nextBtn.addEventListener("click", () => t.next()), o.append(this.nextBtn)), s.volume) {
+    const c = l("div", "imp-controls__spacer");
+    this.chapterLabel = l("div", "imp-controls__chapter"), n.append(o, c, a), c.append(this.chapterLabel);
+    const h = typeof i.seekButtons == "object" ? i.seekButtons : {}, u = h.back ?? t.seekStep, f = h.forward ?? t.seekStep;
+    if (i.playlist && t.hasPlaylist && (this.prevBtn = m("imp-btn--prev", e.previous, s.previous), this.prevBtn.addEventListener("click", () => t.previous()), o.append(this.prevBtn)), i.seekButtons && (this.seekBackBtn = m("imp-btn--seek-back", `${e.seekBack} ${u}s`, s.seekBack), this.seekBackBtn.addEventListener("click", () => t.skip(-u)), o.append(this.seekBackBtn)), i.play && (this.playBtn = m("imp-btn--play", e.play, s.play), this.playBtn.addEventListener("click", () => t.togglePlay()), o.append(this.playBtn)), i.seekButtons && (this.seekFwdBtn = m("imp-btn--seek-forward", `${e.seekForward} ${f}s`, s.seekForward), this.seekFwdBtn.addEventListener("click", () => t.skip(f)), o.append(this.seekFwdBtn)), i.playlist && t.hasPlaylist && (this.nextBtn = m("imp-btn--next", e.next, s.next), this.nextBtn.addEventListener("click", () => t.next()), o.append(this.nextBtn)), i.volume) {
       const d = l("div", "imp-volume");
-      this.muteBtn = m("imp-btn--mute", e.mute, i.volumeHigh), this.muteBtn.addEventListener("click", () => t.toggleMute()), this.volumeSlider = l("input", "imp-volume__slider", {
+      this.muteBtn = m("imp-btn--mute", e.mute, s.volumeHigh), this.muteBtn.addEventListener("click", () => t.toggleMute()), this.volumeSlider = l("input", "imp-volume__slider", {
         type: "range",
         min: "0",
         max: "1",
@@ -708,8 +708,8 @@ const _ = class _ {
         t.setVolume(Number(this.volumeSlider.value));
       }), d.append(this.muteBtn, this.volumeSlider), o.append(d);
     }
-    if (s.time && (this.timeLabel = l("div", "imp-controls__time"), this.liveBadge = l("span", "imp-controls__live"), this.liveBadge.textContent = e.live, this.liveBadge.hidden = !0, o.append(this.timeLabel, this.liveBadge)), this.buildLikeDislike(a), s.subtitles) {
-      this.subtitlesBtn = m("imp-btn--subtitles", e.subtitles, i.subtitles), this.subtitlesMenu = new M(this.subtitlesBtn);
+    if (i.time && (this.timeLabel = l("div", "imp-controls__time"), this.liveBadge = l("span", "imp-controls__live"), this.liveBadge.textContent = e.live, this.liveBadge.hidden = !0, o.append(this.timeLabel, this.liveBadge)), this.buildLikeDislike(a), i.subtitles) {
+      this.subtitlesBtn = m("imp-btn--subtitles", e.subtitles, s.subtitles), this.subtitlesMenu = new M(this.subtitlesBtn);
       const d = l("div", "imp-controls__menu-anchor");
       d.append(this.subtitlesBtn, this.subtitlesMenu.root), this.subtitlesBtn.addEventListener("click", () => this.toggleSubtitlesMenu()), a.append(d), this.registerCollapsible({
         key: "subtitles",
@@ -719,8 +719,8 @@ const _ = class _ {
         section: () => this.subtitlesSection()
       });
     }
-    if (s.settings) {
-      this.settingsBtn = m("imp-btn--settings", e.settings, i.speed), this.settingsMenu = new M(this.settingsBtn);
+    if (i.settings) {
+      this.settingsBtn = m("imp-btn--settings", e.settings, s.speed), this.settingsMenu = new M(this.settingsBtn);
       const d = l("div", "imp-controls__menu-anchor");
       d.append(this.settingsBtn, this.settingsMenu.root), this.settingsBtn.addEventListener("click", () => this.toggleSettingsMenu()), a.append(d), this.registerCollapsible({
         key: "settings",
@@ -730,8 +730,8 @@ const _ = class _ {
         section: () => this.speedSection()
       });
     }
-    if (s.quality) {
-      this.qualityBtn = m("imp-btn--quality", e.quality, i.settings), this.qualityMenu = new M(this.qualityBtn);
+    if (i.quality) {
+      this.qualityBtn = m("imp-btn--quality", e.quality, s.settings), this.qualityMenu = new M(this.qualityBtn);
       const d = l("div", "imp-controls__menu-anchor");
       d.append(this.qualityBtn, this.qualityMenu.root), this.qualityBtn.addEventListener("click", () => this.toggleQualityMenu()), a.append(d), this.registerCollapsible({
         key: "quality",
@@ -741,44 +741,44 @@ const _ = class _ {
         section: () => this.qualitySection()
       });
     }
-    if (s.scenes && (this.scenesBtn = m("imp-btn--scenes", e.scenes, i.scenes), this.scenesBtn.addEventListener("click", () => t.toggleScenesPanel()), a.append(this.scenesBtn), this.registerCollapsible({
+    if (i.scenes && (this.scenesBtn = m("imp-btn--scenes", e.scenes, s.scenes), this.scenesBtn.addEventListener("click", () => t.toggleScenesPanel()), a.append(this.scenesBtn), this.registerCollapsible({
       key: "scenes",
       el: this.scenesBtn,
       priority: 25,
       available: () => t.chapterList.length > 0,
-      section: () => this.simpleSection("scenes", e.scenes, i.scenes, () => t.toggleScenesPanel())
-    })), s.playlist && t.hasPlaylist) {
-      const d = m("imp-btn--list", e.playlist, i.list);
+      section: () => this.simpleSection("scenes", e.scenes, s.scenes, () => t.toggleScenesPanel())
+    })), i.playlist && t.hasPlaylist) {
+      const d = m("imp-btn--list", e.playlist, s.list);
       d.addEventListener("click", () => t.togglePlaylistPanel()), a.append(d), this.registerCollapsible({
         key: "list",
         el: d,
         priority: 50,
         available: () => !0,
-        section: () => this.simpleSection("list", e.playlist, i.list, () => t.togglePlaylistPanel())
+        section: () => this.simpleSection("list", e.playlist, s.list, () => t.togglePlaylistPanel())
       });
     }
-    if (s.pip && "requestPictureInPicture" in HTMLVideoElement.prototype) {
-      const d = m("imp-btn--pip", e.pip, i.pip);
+    if (i.pip && "requestPictureInPicture" in HTMLVideoElement.prototype) {
+      const d = m("imp-btn--pip", e.pip, s.pip);
       d.addEventListener("click", () => void t.togglePip()), a.append(d), this.registerCollapsible({
         key: "pip",
         el: d,
         priority: 20,
         available: () => !0,
-        section: () => this.simpleSection("pip", e.pip, i.pip, () => void t.togglePip())
+        section: () => this.simpleSection("pip", e.pip, s.pip, () => void t.togglePip())
       });
     }
-    if (s.fullscreen && (this.fullscreenBtn = m("imp-btn--fullscreen", e.fullscreen, i.fullscreen), this.fullscreenBtn.addEventListener("click", () => void t.toggleFullscreen()), a.append(this.fullscreenBtn)), this.prevBtn && this.registerCollapsible({
+    if (i.fullscreen && (this.fullscreenBtn = m("imp-btn--fullscreen", e.fullscreen, s.fullscreen), this.fullscreenBtn.addEventListener("click", () => void t.toggleFullscreen()), a.append(this.fullscreenBtn)), this.prevBtn && this.registerCollapsible({
       key: "prev",
       el: this.prevBtn,
       priority: 70,
       available: () => !0,
-      section: () => t.hasPrevious ? this.simpleSection("prev", e.previous, i.previous, () => t.previous()) : null
+      section: () => t.hasPrevious ? this.simpleSection("prev", e.previous, s.previous, () => t.previous()) : null
     }), this.nextBtn && this.registerCollapsible({
       key: "next",
       el: this.nextBtn,
       priority: 72,
       available: () => !0,
-      section: () => t.hasNext ? this.simpleSection("next", e.next, i.next, () => t.next()) : null
+      section: () => t.hasNext ? this.simpleSection("next", e.next, s.next, () => t.next()) : null
     }), this.seekBackBtn) {
       const d = this.seekBackBtn;
       this.registerCollapsible({
@@ -786,7 +786,7 @@ const _ = class _ {
         el: d,
         priority: 80,
         available: () => Number.isFinite(t.duration) && t.duration > 0,
-        section: () => this.simpleSection("seekBack", `${e.seekBack} ${u}s`, i.seekBack, () => t.skip(-u))
+        section: () => this.simpleSection("seekBack", `${e.seekBack} ${u}s`, s.seekBack, () => t.skip(-u))
       });
     }
     if (this.seekFwdBtn) {
@@ -796,64 +796,64 @@ const _ = class _ {
         el: d,
         priority: 82,
         available: () => Number.isFinite(t.duration) && t.duration > 0,
-        section: () => this.simpleSection("seekFwd", `${e.seekForward} ${f}s`, i.seekForward, () => t.skip(f))
+        section: () => this.simpleSection("seekFwd", `${e.seekForward} ${f}s`, s.seekForward, () => t.skip(f))
       });
     }
-    if (this.center = l("div", "imp-center-controls"), s.playlist && t.hasPlaylist && (this.centerPrevBtn = this.makeCenterButton("prev", e.previous, i.previous), this.centerPrevBtn.addEventListener("click", () => t.previous()), this.center.append(this.centerPrevBtn)), s.seekButtons) {
-      const d = this.makeCenterButton("seek-back", `${e.seekBack} ${u}s`, i.seekBack);
+    if (this.center = l("div", "imp-center-controls"), i.playlist && t.hasPlaylist && (this.centerPrevBtn = this.makeCenterButton("prev", e.previous, s.previous), this.centerPrevBtn.addEventListener("click", () => t.previous()), this.center.append(this.centerPrevBtn)), i.seekButtons) {
+      const d = this.makeCenterButton("seek-back", `${e.seekBack} ${u}s`, s.seekBack);
       d.addEventListener("click", () => t.skip(-u)), this.center.append(d);
     }
-    if (s.play && (this.centerPlayBtn = this.makeCenterButton("play", e.play, i.play), this.centerPlayBtn.addEventListener("click", () => t.togglePlay()), this.center.append(this.centerPlayBtn)), s.seekButtons) {
-      const d = this.makeCenterButton("seek-forward", `${e.seekForward} ${f}s`, i.seekForward);
+    if (i.play && (this.centerPlayBtn = this.makeCenterButton("play", e.play, s.play), this.centerPlayBtn.addEventListener("click", () => t.togglePlay()), this.center.append(this.centerPlayBtn)), i.seekButtons) {
+      const d = this.makeCenterButton("seek-forward", `${e.seekForward} ${f}s`, s.seekForward);
       d.addEventListener("click", () => t.skip(f)), this.center.append(d);
     }
-    s.playlist && t.hasPlaylist && (this.centerNextBtn = this.makeCenterButton("next", e.next, i.next), this.centerNextBtn.addEventListener("click", () => t.next()), this.center.append(this.centerNextBtn)), this.center.style.display = "none", this.buildMoreDropdown(a), this.bind(), this.syncVolume(), this.syncPlayState(), this.setLikeState(t.actionsOptions.likeState ?? null), typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => this.scheduleReflow()), this.resizeObserver.observe(t.container)), this.onWindowResize = () => this.scheduleReflow(), window.addEventListener("resize", this.onWindowResize);
+    i.playlist && t.hasPlaylist && (this.centerNextBtn = this.makeCenterButton("next", e.next, s.next), this.centerNextBtn.addEventListener("click", () => t.next()), this.center.append(this.centerNextBtn)), this.center.style.display = "none", this.buildMoreDropdown(a), this.bind(), this.syncVolume(), this.syncPlayState(), this.setLikeState(t.actionsOptions.likeState ?? null), typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => this.scheduleReflow()), this.resizeObserver.observe(t.container)), this.onWindowResize = () => this.scheduleReflow(), window.addEventListener("resize", this.onWindowResize);
   }
   registerCollapsible(t) {
     this.collapsibles.push(t);
   }
   /** Center-cluster button — deliberately NOT `.imp-btn` (own sizing/look). */
-  makeCenterButton(t, e, i) {
-    const s = l("button", `imp-center-btn imp-center-btn--${t}`, { type: "button", "aria-label": e, title: e });
-    return s.innerHTML = i, s;
+  makeCenterButton(t, e, s) {
+    const i = l("button", `imp-center-btn imp-center-btn--${t}`, { type: "button", "aria-label": e, title: e });
+    return i.innerHTML = s, i;
   }
   /** like/dislike — visible buttons (collapsible), highlightable via `setLikeState`. */
   buildLikeDislike(t) {
-    const e = this.player, i = e.actionsOptions, { labels: s, icons: n } = e;
-    if (i.like) {
-      this.likeBtn = m("imp-btn--like", s.like, n.like), this.likeBtn.addEventListener("click", () => e.emit("action", { id: "like" })), this.likeCountEl = this.attachCountTooltip(this.likeBtn, i.likeCount);
+    const e = this.player, s = e.actionsOptions, { labels: i, icons: n } = e;
+    if (s.like) {
+      this.likeBtn = m("imp-btn--like", i.like, n.like), this.likeBtn.addEventListener("click", () => e.emit("action", { id: "like" })), this.likeCountEl = this.attachCountTooltip(this.likeBtn, s.likeCount);
       const o = this.wrapWithTooltip(this.likeBtn, this.likeCountEl);
       t.append(o), this.registerCollapsible({
         key: "like",
         el: o,
         priority: 62,
         available: () => !0,
-        section: () => this.simpleSection("like", s.like, n.like, () => e.emit("action", { id: "like" }))
+        section: () => this.simpleSection("like", i.like, n.like, () => e.emit("action", { id: "like" }))
       });
     }
-    if (i.dislike) {
-      this.dislikeBtn = m("imp-btn--dislike", s.dislike, n.dislike), this.dislikeBtn.addEventListener("click", () => e.emit("action", { id: "dislike" })), this.dislikeCountEl = this.attachCountTooltip(this.dislikeBtn, i.dislikeCount);
+    if (s.dislike) {
+      this.dislikeBtn = m("imp-btn--dislike", i.dislike, n.dislike), this.dislikeBtn.addEventListener("click", () => e.emit("action", { id: "dislike" })), this.dislikeCountEl = this.attachCountTooltip(this.dislikeBtn, s.dislikeCount);
       const o = this.wrapWithTooltip(this.dislikeBtn, this.dislikeCountEl);
       t.append(o), this.registerCollapsible({
         key: "dislike",
         el: o,
         priority: 60,
         available: () => !0,
-        section: () => this.simpleSection("dislike", s.dislike, n.dislike, () => e.emit("action", { id: "dislike" }))
+        section: () => this.simpleSection("dislike", i.dislike, n.dislike, () => e.emit("action", { id: "dislike" }))
       });
     }
   }
   attachCountTooltip(t, e) {
-    const i = l("span", "imp-count-tooltip");
-    return this.setCountText(i, e), i;
+    const s = l("span", "imp-count-tooltip");
+    return this.setCountText(s, e), s;
   }
   wrapWithTooltip(t, e) {
-    const i = l("div", "imp-action");
-    return i.append(t, e), i;
+    const s = l("div", "imp-action");
+    return s.append(t, e), s;
   }
   setCountText(t, e) {
-    const i = e == null || e === "" ? "" : String(e);
-    t.textContent = i, t.hidden = i === "";
+    const s = e == null || e === "" ? "" : String(e);
+    t.textContent = s, t.hidden = s === "";
   }
   setLikeCounts(t, e) {
     this.likeCountEl && t !== void 0 && this.setCountText(this.likeCountEl, t), this.dislikeCountEl && e !== void 0 && this.setCountText(this.dislikeCountEl, e);
@@ -863,11 +863,11 @@ const _ = class _ {
   }
   // === ⋯ menu ===========================================================
   buildMoreDropdown(t) {
-    const e = this.player, i = e.actionsOptions, { labels: s, icons: n } = e;
-    i.addTo && this.actionItems.push({ value: "addTo", label: s.addTo, icon: n.addTo, run: () => e.emit("action", { id: "addTo" }) }), i.share && this.actionItems.push({ value: "share", label: s.share, icon: n.share, run: () => void e.share() }), i.report && this.actionItems.push({ value: "report", label: s.report, icon: n.report, run: () => e.emit("action", { id: "report" }) });
-    for (const h of i.custom ?? [])
-      this.actionItems.push({ value: `custom:${h.id}`, label: h.title, icon: h.icon, run: () => e.emit("customaction", { id: h.id }) });
-    const o = m("imp-btn--more", s.more, n.more);
+    const e = this.player, s = e.actionsOptions, { labels: i, icons: n } = e;
+    s.addTo && this.actionItems.push({ value: "addTo", label: i.addTo, icon: n.addTo, run: () => e.emit("action", { id: "addTo" }) }), s.share && this.actionItems.push({ value: "share", label: i.share, icon: n.share, run: () => void e.share() }), s.report && this.actionItems.push({ value: "report", label: i.report, icon: n.report, run: () => e.emit("action", { id: "report" }) });
+    for (const c of s.custom ?? [])
+      this.actionItems.push({ value: `custom:${c.id}`, label: c.title, icon: c.icon, run: () => e.emit("customaction", { id: c.id }) });
+    const o = m("imp-btn--more", i.more, n.more);
     this.moreMenu = new M(o);
     const a = l("div", "imp-controls__menu-anchor imp-controls__more");
     a.append(o, this.moreMenu.root), o.addEventListener("click", () => {
@@ -876,28 +876,28 @@ const _ = class _ {
   }
   /** ⋯ menu = overflowed controls (in display order) + consumer actions. */
   buildMoreSections() {
-    const t = [], e = /* @__PURE__ */ new Map(), i = [], s = ["prev", "next", "seekBack", "seekFwd", "like", "dislike", "scenes", "pip", "list", "subtitles", "settings", "quality"], n = this.collapsibles.filter((o) => this.overflowed.has(o.key) && o.available()).sort((o, a) => s.indexOf(o.key) - s.indexOf(a.key));
+    const t = [], e = /* @__PURE__ */ new Map(), s = [], i = ["prev", "next", "seekBack", "seekFwd", "like", "dislike", "scenes", "pip", "list", "subtitles", "settings", "quality"], n = this.collapsibles.filter((o) => this.overflowed.has(o.key) && o.available()).sort((o, a) => i.indexOf(o.key) - i.indexOf(a.key));
     for (const o of n) {
       const a = o.section();
       if (a)
         if (!a.title && a.items.length === 1) {
-          const h = a.items[0];
-          i.push(h), e.set(h.value, () => a.onSelect(h.value));
+          const c = a.items[0];
+          s.push(c), e.set(c.value, () => a.onSelect(c.value));
         } else
           t.push(a);
     }
-    if (i.length > 0 && t.unshift({ title: "", items: i, onSelect: (o) => e.get(o)?.() }), this.actionItems.length > 0) {
+    if (s.length > 0 && t.unshift({ title: "", items: s, onSelect: (o) => e.get(o)?.() }), this.actionItems.length > 0) {
       const o = new Map(this.actionItems.map((a) => [a.value, a.run]));
       t.push({
         title: "",
-        items: this.actionItems.map(({ value: a, label: h, icon: c }) => ({ value: a, label: h, icon: c, active: !1 })),
+        items: this.actionItems.map(({ value: a, label: c, icon: h }) => ({ value: a, label: c, icon: h, active: !1 })),
         onSelect: (a) => o.get(a)?.()
       });
     }
     return t;
   }
-  simpleSection(t, e, i, s) {
-    return { title: "", items: [{ value: t, label: e, icon: i, active: !1 }], onSelect: () => s() };
+  simpleSection(t, e, s, i) {
+    return { title: "", items: [{ value: t, label: e, icon: s, active: !1 }], onSelect: () => i() };
   }
   speedSection() {
     const t = this.player;
@@ -928,7 +928,7 @@ const _ = class _ {
       title: t.labels.subtitles,
       items: [
         { label: t.labels.subtitlesOff, value: "-1", active: t.activeSubtitle === -1 },
-        ...t.subtitleTracks.map((e, i) => ({ label: e.label, value: String(i), active: t.activeSubtitle === i }))
+        ...t.subtitleTracks.map((e, s) => ({ label: e.label, value: String(s), active: t.activeSubtitle === s }))
       ],
       onSelect: (e) => t.setSubtitle(Number(e))
     };
@@ -946,24 +946,24 @@ const _ = class _ {
   reflow() {
     const t = window.innerWidth <= 767;
     this.center.style.display = t ? "flex" : "none", this.playBtn && (this.playBtn.style.display = t ? "none" : ""), this.overflowed.clear();
-    for (const s of this.collapsibles) {
-      if (t && _.CENTER_KEYS.has(s.key)) {
-        s.el.style.display = "none";
+    for (const i of this.collapsibles) {
+      if (t && _.CENTER_KEYS.has(i.key)) {
+        i.el.style.display = "none";
         continue;
       }
-      const n = s.available();
-      s.el.style.display = n ? "" : "none", s.el.classList.remove("imp-collapsed");
+      const n = i.available();
+      i.el.style.display = n ? "" : "none", i.el.classList.remove("imp-collapsed");
     }
-    const e = this.collapsibles.filter((s) => s.available() && !(t && _.CENTER_KEYS.has(s.key))).sort((s, n) => s.priority - n.priority);
-    let i = e.length;
-    for (; i-- > 0 && this.overflowsRow(); ) {
-      const s = e.find((n) => !this.overflowed.has(n.key));
-      if (!s) break;
-      s.el.style.display = "none", s.el.classList.add("imp-collapsed"), this.overflowed.add(s.key);
+    const e = this.collapsibles.filter((i) => i.available() && !(t && _.CENTER_KEYS.has(i.key))).sort((i, n) => i.priority - n.priority);
+    let s = e.length;
+    for (; s-- > 0 && this.overflowsRow(); ) {
+      const i = e.find((n) => !this.overflowed.has(n.key));
+      if (!i) break;
+      i.el.style.display = "none", i.el.classList.add("imp-collapsed"), this.overflowed.add(i.key);
     }
     if (this.moreWrap) {
-      const s = this.actionItems.length > 0 || this.overflowed.size > 0;
-      this.moreWrap.style.display = s ? "" : "none";
+      const i = this.actionItems.length > 0 || this.overflowed.size > 0;
+      this.moreWrap.style.display = i ? "" : "none";
     }
   }
   overflowsRow() {
@@ -973,8 +973,8 @@ const _ = class _ {
   bind() {
     const t = this.player;
     this.disposers.push(
-      t.on("timeupdate", ({ currentTime: e, duration: i }) => {
-        this.progress.update(e, i, t.bufferedEnd), this.timeLabel && (t.live ? (this.timeLabel.hidden = !0, this.liveBadge.hidden = !1) : (this.timeLabel.hidden = !1, this.liveBadge.hidden = !0, this.timeLabel.textContent = `${w(e)} / ${w(i)}`));
+      t.on("timeupdate", ({ currentTime: e, duration: s }) => {
+        this.progress.update(e, s, t.bufferedEnd), this.timeLabel && (t.live ? (this.timeLabel.hidden = !0, this.liveBadge.hidden = !1) : (this.timeLabel.hidden = !1, this.liveBadge.hidden = !0, this.timeLabel.textContent = `${w(e)} / ${w(s)}`));
       }),
       t.on("play", () => this.syncPlayState()),
       t.on("pause", () => this.syncPlayState()),
@@ -995,13 +995,13 @@ const _ = class _ {
     ), this.syncPlaylistButtons(), this.reflow();
   }
   syncPlayState() {
-    const t = this.player, [e, i] = t.ended ? [t.icons.replay, t.labels.replay] : t.paused ? [t.icons.play, t.labels.play] : [t.icons.pause, t.labels.pause];
-    this.playBtn && E(this.playBtn, e, i), this.centerPlayBtn && E(this.centerPlayBtn, e, i);
+    const t = this.player, [e, s] = t.ended ? [t.icons.replay, t.labels.replay] : t.paused ? [t.icons.play, t.labels.play] : [t.icons.pause, t.labels.pause];
+    this.playBtn && E(this.playBtn, e, s), this.centerPlayBtn && E(this.centerPlayBtn, e, s);
   }
   syncVolume() {
     if (!this.muteBtn) return;
-    const t = this.player, e = t.muted ? 0 : t.volume, i = e === 0 ? t.icons.volumeMute : e < 0.5 ? t.icons.volumeLow : t.icons.volumeHigh;
-    E(this.muteBtn, i, t.muted ? t.labels.unmute : t.labels.mute), this.volumeSlider.value = String(e), this.volumeSlider.style.setProperty("--imp-volume-fill", `${e * 100}%`);
+    const t = this.player, e = t.muted ? 0 : t.volume, s = e === 0 ? t.icons.volumeMute : e < 0.5 ? t.icons.volumeLow : t.icons.volumeHigh;
+    E(this.muteBtn, s, t.muted ? t.labels.unmute : t.labels.mute), this.volumeSlider.value = String(e), this.volumeSlider.style.setProperty("--imp-volume-fill", `${e * 100}%`);
   }
   /** Called by the player when per-source data (chapters/quality/subtitles) changes. */
   syncFeatureButtons() {
@@ -1033,14 +1033,14 @@ _.CENTER_KEYS = /* @__PURE__ */ new Set(["seekBack", "seekFwd", "prev", "next"])
 let F = _;
 class ft {
   constructor(t) {
-    this.root = l("div", "imp-poster"), this.image = l("div", "imp-poster__image");
+    this.root = l("div", "imp-poster"), this.image = l("img", "imp-poster__image", { alt: "", decoding: "async" }), this.image.hidden = !0;
     const e = m("imp-poster__play", t.labels.play, t.icons.bigPlay);
-    e.addEventListener("click", () => void t.play()), this.root.append(this.image, e), this.root.addEventListener("click", (i) => {
-      (i.target === this.root || i.target === this.image) && t.play();
+    e.addEventListener("click", () => void t.play()), this.root.append(this.image, e), this.root.addEventListener("click", (s) => {
+      (s.target === this.root || s.target === this.image) && t.play();
     });
   }
   setSource(t) {
-    this.image.style.backgroundImage = t?.poster ? `url("${t.poster}")` : "";
+    t?.poster ? (this.image.src = t.poster, this.image.fetchPriority = "high", this.image.hidden = !1) : (this.image.removeAttribute("src"), this.image.hidden = !0);
   }
   show() {
     this.root.hidden = !1;
@@ -1055,7 +1055,7 @@ class vt {
       this.channelUrl && window.open(this.channelUrl, "_blank", "noopener");
     });
     const e = l("div", "imp-pause-screen__heading");
-    this.title = l("div", "imp-pause-screen__title"), this.description = l("div", "imp-pause-screen__description"), this.sponsor = l("a", "imp-sponsor", { target: "_blank", rel: "nofollow noopener" }), this.sponsor.hidden = !0, this.sponsorLabel = l("span", "imp-sponsor__label"), this.sponsorText = l("span", "imp-sponsor__text"), this.sponsor.append(this.sponsorLabel, this.sponsorText), this.sponsor.addEventListener("click", (i) => i.stopPropagation()), e.append(this.title, this.description, this.sponsor), this.defaultContent.append(e, this.channel), this.root.append(this.defaultContent);
+    this.title = l("div", "imp-pause-screen__title"), this.description = l("div", "imp-pause-screen__description"), this.sponsor = l("a", "imp-sponsor", { target: "_blank", rel: "nofollow noopener" }), this.sponsor.hidden = !0, this.sponsorLabel = l("span", "imp-sponsor__label"), this.sponsorText = l("span", "imp-sponsor__text"), this.sponsor.append(this.sponsorLabel, this.sponsorText), this.sponsor.addEventListener("click", (s) => s.stopPropagation()), e.append(this.title, this.description, this.sponsor), this.defaultContent.append(e, this.channel), this.root.append(this.defaultContent);
   }
   setCustomContent(t) {
     this.custom?.remove(), this.custom = t, t && (t.classList.add("imp-pause-screen__custom"), this.root.append(t)), this.defaultContent.hidden = t !== null, this.root.classList.toggle("imp-pause-screen--custom", t !== null);
@@ -1068,8 +1068,8 @@ class vt {
     this.title.textContent = t?.title ?? "", this.description.textContent = t?.description ?? "";
     const e = t?.sponsor;
     this.sponsor.hidden = !e, e && (this.sponsor.href = e.url, this.sponsorText.textContent = e.text, this.sponsorLabel.textContent = e.label ?? this.labels.sponsored);
-    const i = t?.channel;
-    this.channel.hidden = !i, this.channelUrl = i?.url ?? null, this.channel.classList.toggle("imp-channel--link", !!i?.url), i && (this.channelName.textContent = i.name, this.channelAvatar.className = `imp-channel__avatar imp-channel__avatar--${i.avatarShape ?? "circle"}`, i.avatar ? (this.channelAvatar.textContent = "", this.channelAvatar.style.backgroundImage = `url("${i.avatar}")`) : (this.channelAvatar.style.backgroundImage = "", this.channelAvatar.textContent = (i.name.trim()[0] ?? "?").toUpperCase()));
+    const s = t?.channel;
+    this.channel.hidden = !s, this.channelUrl = s?.url ?? null, this.channel.classList.toggle("imp-channel--link", !!s?.url), s && (this.channelName.textContent = s.name, this.channelAvatar.className = `imp-channel__avatar imp-channel__avatar--${s.avatarShape ?? "circle"}`, s.avatar ? (this.channelAvatar.textContent = "", this.channelAvatar.style.backgroundImage = `url("${s.avatar}")`) : (this.channelAvatar.style.backgroundImage = "", this.channelAvatar.textContent = (s.name.trim()[0] ?? "?").toUpperCase()));
   }
   show() {
     this.root.hidden = !1;
@@ -1080,28 +1080,43 @@ class vt {
 }
 class gt {
   constructor(t) {
-    this.player = t, this.root = l("div", "imp-related"), this.root.hidden = !0, this.heading = l("div", "imp-related__title"), this.grid = l("div", "imp-related__grid");
+    this.player = t, this.clickBehavior = "player", this.root = l("div", "imp-related"), this.root.hidden = !0, this.heading = l("div", "imp-related__title"), this.grid = l("div", "imp-related__grid");
     const e = m("imp-related__close", "Close", t.icons.close);
     e.addEventListener("click", () => this.hide()), this.root.append(e, this.heading, this.grid);
   }
   setOptions(t) {
     if (this.grid.textContent = "", !!t) {
-      this.heading.textContent = t.title ?? this.player.labels.related;
+      this.clickBehavior = t.clickBehavior ?? "player", this.heading.textContent = t.title ?? this.player.labels.related;
       for (const e of t.items)
         this.grid.append(this.buildCard(e));
     }
   }
   buildCard(t) {
-    const e = l("button", "imp-related__card", { type: "button" }), i = l("div", "imp-related__thumb");
-    if (t.poster && (i.style.backgroundImage = `url("${t.poster}")`), t.duration) {
+    const e = l("button", "imp-related__card", { type: "button" }), s = l("div", "imp-related__thumb");
+    if (t.poster && (s.style.backgroundImage = `url("${t.poster}")`), t.duration) {
       const n = l("span", "imp-related__duration");
-      n.textContent = t.duration, i.append(n);
+      n.textContent = t.duration, s.append(n);
     }
-    const s = l("div", "imp-related__card-title");
-    return s.textContent = t.title, e.append(i, s), e.addEventListener("click", () => {
-      this.player.emit("relatedclick", { item: t }), this.hide(), t.source ? (this.player.load(t.source), this.player.play()) : t.url && window.open(t.url, "_blank", "noopener");
+    const i = l("div", "imp-related__card-title");
+    return i.textContent = t.title, e.append(s, i), e.addEventListener("click", () => {
+      this.player.emit("relatedclick", { item: t }), this.hide(), this.activate(t);
     }), e;
   }
+  /** Apply the configured click behavior. */
+  activate(t) {
+    const e = t.url ?? t.source?.src;
+    switch (this.clickBehavior) {
+      case "newWindow":
+        e && window.open(e, "_blank", "noopener");
+        break;
+      case "currentTab":
+        e && (window.location.href = e);
+        break;
+      case "player":
+      default:
+        t.source ? (this.player.load(t.source), this.player.play()) : t.url && window.open(t.url, "_blank", "noopener");
+    }
+  }
   get visible() {
     return !this.root.hidden;
   }
@@ -1113,14 +1128,14 @@ class gt {
   }
 }
 class yt {
-  constructor(t, e = "sidebar", i) {
+  constructor(t, e = "sidebar", s) {
     this.player = t, this.root = l("div", `imp-playlist imp-playlist--${e}`), this.root.hidden = !0;
-    const s = l("div", "imp-playlist__header"), n = l("div", "imp-playlist__heading");
-    if (i) {
-      const h = l("div", "imp-playlist__kicker");
-      h.textContent = t.labels.playlist;
-      const c = l("div", "imp-playlist__name");
-      c.textContent = i, n.append(h, c);
+    const i = l("div", "imp-playlist__header"), n = l("div", "imp-playlist__heading");
+    if (s) {
+      const c = l("div", "imp-playlist__kicker");
+      c.textContent = t.labels.playlist;
+      const h = l("div", "imp-playlist__name");
+      h.textContent = s, n.append(c, h);
     } else
       n.textContent = t.labels.playlist;
     const o = l("div", "imp-playlist__tools");
@@ -1130,25 +1145,25 @@ class yt {
       t.setRepeat(!t.repeat), this.syncModes();
     });
     const a = m("imp-playlist__close", "Close", t.icons.close);
-    a.addEventListener("click", () => this.hide()), o.append(this.shuffleBtn, this.repeatBtn, a), s.append(n, o), this.list = l("div", "imp-playlist__list"), this.root.append(s, this.list), this.rebuild(), this.syncModes();
+    a.addEventListener("click", () => this.hide()), o.append(this.shuffleBtn, this.repeatBtn, a), i.append(n, o), this.list = l("div", "imp-playlist__list"), this.root.append(i, this.list), this.rebuild(), this.syncModes();
   }
   syncModes() {
     this.shuffleBtn.classList.toggle("imp-btn--active", this.player.shuffle), this.repeatBtn.classList.toggle("imp-btn--active", this.player.repeat);
   }
   rebuild() {
     this.list.textContent = "", this.player.playlist.forEach((t, e) => {
-      const i = l("button", "imp-playlist__item", { type: "button" });
-      e === this.player.index && i.classList.add("imp-playlist__item--active");
-      const s = l("div", "imp-playlist__thumb");
-      t.poster && (s.style.backgroundImage = `url("${t.poster}")`);
+      const s = l("button", "imp-playlist__item", { type: "button" });
+      e === this.player.index && s.classList.add("imp-playlist__item--active");
+      const i = l("div", "imp-playlist__thumb");
+      t.poster && (i.style.backgroundImage = `url("${t.poster}")`);
       const n = l("div", "imp-playlist__meta"), o = l("div", "imp-playlist__title");
       if (o.textContent = t.title ?? `#${e + 1}`, n.append(o), t.duration) {
         const a = l("div", "imp-playlist__duration");
         a.textContent = w(t.duration), n.append(a);
       }
-      i.append(s, n), i.addEventListener("click", () => {
+      s.append(i, n), s.addEventListener("click", () => {
         this.player.playItem(e);
-      }), this.list.append(i);
+      }), this.list.append(s);
     });
   }
   get visible() {
@@ -1167,34 +1182,34 @@ class yt {
 class bt {
   constructor(t, e = "bottom") {
     this.player = t, this.items = [], this.root = l("div", `imp-playlist imp-scenes imp-playlist--${e}`), this.root.hidden = !0;
-    const i = l("div", "imp-playlist__header"), s = l("span");
-    s.textContent = t.labels.scenes;
+    const s = l("div", "imp-playlist__header"), i = l("span");
+    i.textContent = t.labels.scenes;
     const n = m("imp-playlist__close", "Close", t.icons.close);
-    n.addEventListener("click", () => this.hide()), i.append(s, n), this.list = l("div", "imp-playlist__list"), this.root.append(i, this.list), t.on("chapterchange", () => this.syncActive());
+    n.addEventListener("click", () => this.hide()), s.append(i, n), this.list = l("div", "imp-playlist__list"), this.root.append(s, this.list), t.on("chapterchange", () => this.syncActive());
   }
   /** Re-render from the player's current chapters + thumbnail track. */
   rebuild() {
     this.list.textContent = "", this.items = [];
     const t = this.player.thumbnails;
     for (const e of this.player.chapterList) {
-      const i = l("button", "imp-playlist__item", { type: "button" }), s = l("div", "imp-playlist__thumb"), n = t?.cueAt(e.start + 0.01) ?? null;
+      const s = l("button", "imp-playlist__item", { type: "button" }), i = l("div", "imp-playlist__thumb"), n = t?.cueAt(e.start + 0.01) ?? null;
       if (n?.xywh) {
-        const c = l("div", "imp-scenes__sprite");
-        c.style.width = `${n.xywh.w}px`, c.style.height = `${n.xywh.h}px`, c.style.backgroundImage = `url("${n.src}")`, c.style.backgroundPosition = `-${n.xywh.x}px -${n.xywh.y}px`, c.style.setProperty("--imp-sprite-w", String(n.xywh.w)), s.append(c);
-      } else n && (s.style.backgroundImage = `url("${n.src}")`);
+        const h = l("div", "imp-scenes__sprite");
+        h.style.width = `${n.xywh.w}px`, h.style.height = `${n.xywh.h}px`, h.style.backgroundImage = `url("${n.src}")`, h.style.backgroundPosition = `-${n.xywh.x}px -${n.xywh.y}px`, h.style.setProperty("--imp-sprite-w", String(n.xywh.w)), i.append(h);
+      } else n && (i.style.backgroundImage = `url("${n.src}")`);
       const o = l("div", "imp-playlist__meta"), a = l("div", "imp-playlist__title");
       a.textContent = e.title || w(e.start);
-      const h = l("div", "imp-playlist__duration");
-      h.textContent = w(e.start), o.append(a, h), i.append(s, o), i.addEventListener("click", () => {
+      const c = l("div", "imp-playlist__duration");
+      c.textContent = w(e.start), o.append(a, c), s.append(i, o), s.addEventListener("click", () => {
         this.player.seek(e.start), this.player.play();
-      }), this.list.append(i), this.items.push(i);
+      }), this.list.append(s), this.items.push(s);
     }
     this.syncActive();
   }
   syncActive() {
     const t = this.player.chapter, e = this.player.chapterList;
-    this.items.forEach((i, s) => {
-      i.classList.toggle("imp-playlist__item--active", t !== null && e[s] === t);
+    this.items.forEach((s, i) => {
+      s.classList.toggle("imp-playlist__item--active", t !== null && e[i] === t);
     });
   }
   get visible() {
@@ -1231,20 +1246,26 @@ const kt = {
 };
 class _t {
   constructor(t, e = {}) {
-    this.scrubbing = !1, this.emitter = new Y(), this.abort = new AbortController(), this.sources = [], this.currentIndex = -1, this.sourceController = null, this.loadToken = 0, this.chapters = [], this.currentChapter = null, this.progressiveQuality = -1, this.thumbTrack = null, this.shuffleMode = !1, this.adManager = null, this.playedOnce = !1, this.idleTimer = null, this.destroyed = !1;
-    const i = typeof t == "string" ? document.querySelector(t) : t;
-    if (!i) throw new Error(`[itube-player] mount target not found: ${String(t)}`);
-    this.mount = i, this.options = e, this.labels = { ...I, ...tt(e.language), ...e.labels }, this.icons = { ...J, ...e.icons }, this.controlsOptions = { ...kt, ...e.controls }, this.actionsOptions = e.actions ?? {}, this.playbackRates = e.playbackRates ?? [0.5, 0.75, 1, 1.25, 1.5, 2], this.seekStep = e.seekStep ?? 10, this.playlistOptions = { title: "", autoAdvance: !0, loop: !1, shuffle: !1, startIndex: 0, layout: "sidebar", ...e.playlist }, this.shuffleMode = this.playlistOptions.shuffle, this.sources = e.source ? Array.isArray(e.source) ? [...e.source] : [e.source] : [], this.container = l("div", "imp-player", { tabindex: "0" }), e.className && this.container.classList.add(e.className), e.styling?.themeColor && this.container.style.setProperty("--imp-accent", e.styling.themeColor), e.styling?.likeColor && this.container.style.setProperty("--imp-like", e.styling.likeColor), e.styling?.dislikeColor && this.container.style.setProperty("--imp-dislike", e.styling.dislikeColor), this.video = l("video", "imp-video"), e.playsInline !== !1 && this.video.setAttribute("playsinline", ""), e.crossOrigin !== void 0 && (this.video.crossOrigin = e.crossOrigin), this.video.preload = "metadata", e.loop && (this.video.loop = !0), e.muted && (this.video.muted = !0), this.video.volume = y(e.volume ?? 1, 0, 1);
-    const s = l("div", "imp-layer");
+    this.scrubbing = !1, this.emitter = new Y(), this.abort = new AbortController(), this.sources = [], this.currentIndex = -1, this.sourceController = null, this.loadToken = 0, this.chapters = [], this.currentChapter = null, this.progressiveQuality = -1, this.thumbTrack = null, this.shuffleMode = !1, this.decodeRecoveries = 0, this.adManager = null, this.playedOnce = !1, this.idleTimer = null, this.destroyed = !1;
+    const s = typeof t == "string" ? document.querySelector(t) : t;
+    if (!s) throw new Error(`[itube-player] mount target not found: ${String(t)}`);
+    this.mount = s, this.options = e, this.labels = { ...I, ...tt(e.language), ...e.labels }, this.icons = { ...J, ...e.icons }, this.controlsOptions = { ...kt, ...e.controls }, this.actionsOptions = e.actions ?? {}, this.playbackRates = e.playbackRates ?? [0.5, 0.75, 1, 1.25, 1.5, 2], this.seekStep = e.seekStep ?? 10, this.playlistOptions = { title: "", autoAdvance: !0, loop: !1, shuffle: !1, startIndex: 0, layout: "sidebar", ...e.playlist }, this.shuffleMode = this.playlistOptions.shuffle, this.sources = e.source ? Array.isArray(e.source) ? [...e.source] : [e.source] : [], this.container = l("div", "imp-player", { tabindex: "0" }), e.className && this.container.classList.add(e.className);
+    const i = e.styling;
+    if (i?.themeColor && this.container.style.setProperty("--imp-accent", i.themeColor), i?.likeColor && this.container.style.setProperty("--imp-like", i.likeColor), i?.dislikeColor && this.container.style.setProperty("--imp-dislike", i.dislikeColor), i?.borderRadius !== void 0) {
+      const h = typeof i.borderRadius == "number" ? `${i.borderRadius}px` : i.borderRadius;
+      this.container.style.setProperty("--imp-radius", h);
+    }
+    i?.playButtonStyle === "inverted" && this.container.classList.add("imp-player--play-inverted"), this.video = l("video", "imp-video"), e.playsInline !== !1 && this.video.setAttribute("playsinline", ""), e.crossOrigin !== void 0 && (this.video.crossOrigin = e.crossOrigin), this.video.preload = "metadata", e.loop && (this.video.loop = !0), e.muted && (this.video.muted = !0), this.video.volume = y(e.volume ?? 1, 0, 1);
+    const n = l("div", "imp-layer");
     this.spinner = l("div", "imp-spinner"), this.spinner.hidden = !0, this.errorBox = l("div", "imp-error"), this.errorBox.hidden = !0, this.pauseScreen = new vt(this.labels), this.poster = new ft(this), this.related = new gt(this), this.related.setOptions(e.related), this.controls = new F(this), this.playlistPanel = new yt(this, this.playlistOptions.layout, this.playlistOptions.title || void 0), this.scenesPanel = new bt(this, e.scenes?.layout ?? "bottom");
-    const n = l("div", "imp-layer__middle");
-    n.append(this.spinner, this.errorBox, this.controls.center);
-    const o = l("div", "imp-layer__bottom");
-    o.append(this.controls.root), s.append(this.pauseScreen.root, this.related.root, n, o), this.container.append(this.video, s, this.poster.root, this.playlistPanel.root, this.scenesPanel.root), this.mount.append(this.container), e.pauseScreen instanceof HTMLElement ? this.pauseScreen.setCustomContent(e.pauseScreen) : typeof e.pauseScreen == "function" && this.pauseScreen.setCustomContent(e.pauseScreen(this));
-    const a = e.adConfig ?? e.ads;
-    a && a.adList.length > 0 && (this.adManager = new lt(
+    const o = l("div", "imp-layer__middle");
+    o.append(this.spinner, this.errorBox, this.controls.center);
+    const a = l("div", "imp-layer__bottom");
+    a.append(this.controls.root), n.append(this.pauseScreen.root, this.related.root, o, a), this.container.append(this.video, n, this.poster.root, this.playlistPanel.root, this.scenesPanel.root), this.mount.append(this.container), e.pauseScreen instanceof HTMLElement ? this.pauseScreen.setCustomContent(e.pauseScreen) : typeof e.pauseScreen == "function" && this.pauseScreen.setCustomContent(e.pauseScreen(this));
+    const c = e.adConfig ?? e.ads;
+    c && c.adList.length > 0 && (this.adManager = new lt(
       { container: this.container, contentVideo: this.video, emitter: this.emitter, labels: this.labels, closeIcon: this.icons.close },
-      a
+      c
     )), this.emitter.on("error", ({ message: h }) => {
       this.errorBox.textContent = h, this.errorBox.hidden = !1, this.spinner.hidden = !0, this.poster.hide();
     }), this.bindVideoEvents(), this.bindIdleHide(), e.keyboard !== !1 && this.bindKeyboard(), this.video.addEventListener("click", () => {
@@ -1332,7 +1353,7 @@ class _t {
   get qualityLevels() {
     if (this.sourceController?.kind === "hls") return this.sourceController.levels;
     const t = this.source?.qualities;
-    return t ? t.map((e, i) => ({ index: i, label: e.label ?? String(e.quality ?? i) })) : [];
+    return t ? t.map((e, s) => ({ index: s, label: e.label ?? String(e.quality ?? s) })) : [];
   }
   get qualityAutoAvailable() {
     return this.sourceController?.kind === "hls";
@@ -1349,8 +1370,8 @@ class _t {
     }
     const e = this.source?.qualities;
     if (!e || !e[t] || t === this.progressiveQuality) return;
-    const i = this.video.currentTime, s = !this.video.paused && !this.video.ended;
-    this.progressiveQuality = t, this.video.src = e[t].src, this.video.currentTime = i, s && this.video.play().catch(() => {
+    const s = this.video.currentTime, i = !this.video.paused && !this.video.ended;
+    this.progressiveQuality = t, this.video.src = e[t].src, this.video.currentTime = s, i && this.video.play().catch(() => {
     }), this.emitter.emit("qualitychange", { label: e[t].label ?? String(e[t].quality ?? t) });
   }
   // === subtitles ========================================================
@@ -1365,8 +1386,8 @@ class _t {
   }
   setSubtitle(t) {
     const e = this.video.textTracks;
-    for (let i = 0; i < e.length; i++)
-      e[i].mode = i === t ? "showing" : "disabled";
+    for (let s = 0; s < e.length; s++)
+      e[s].mode = s === t ? "showing" : "disabled";
     this.emitter.emit("subtitlechange", { track: this.subtitleTracks[t] ?? null });
   }
   // === playlist =========================================================
@@ -1496,56 +1517,56 @@ class _t {
   }
   // === internals ========================================================
   async loadItem(t, e) {
-    const i = ++this.loadToken, s = this.sources[t];
-    if (!s) return;
+    const s = ++this.loadToken, i = this.sources[t];
+    if (!i) return;
     this.currentIndex = t, this.sourceController?.destroy(), this.sourceController = null, this.chapters = [], this.currentChapter = null, this.progressiveQuality = -1, this.playedOnce = !1;
-    for (const h of [...this.video.querySelectorAll("track")]) h.remove();
-    this.adManager?.resetForNewSource(), this.related.hide(), this.pauseScreen.hide(), this.scenesPanel.hide(), this.thumbTrack = null, this.errorBox.hidden = !0, this.video.poster = s.poster ?? "", this.poster.setSource(s), this.pauseScreen.setSource(s), this.controls.progress.setChapters([]), this.controls.progress.setThumbnails(null), this.controls.progress.setHeatmap([]), e ? this.poster.hide() : this.poster.show(), this.playlistPanel.rebuild();
-    for (const h of Q(s.subtitles)) {
-      const c = l("track", "", {
+    for (const c of [...this.video.querySelectorAll("track")]) c.remove();
+    this.adManager?.resetForNewSource(), this.related.hide(), this.pauseScreen.hide(), this.scenesPanel.hide(), this.thumbTrack = null, this.errorBox.hidden = !0, this.decodeRecoveries = 0, this.video.poster = i.poster ?? "", this.poster.setSource(i), this.pauseScreen.setSource(i), this.controls.progress.setChapters([]), this.controls.progress.setThumbnails(null), this.controls.progress.setHeatmap([]), e ? this.poster.hide() : this.poster.show(), this.playlistPanel.rebuild();
+    for (const c of Q(i.subtitles)) {
+      const h = l("track", "", {
         kind: "subtitles",
-        src: h.src,
-        label: h.label,
-        ...h.srclang ? { srclang: h.srclang } : {}
+        src: c.src,
+        label: c.label,
+        ...c.srclang ? { srclang: c.srclang } : {}
       });
-      h.default && c.setAttribute("default", ""), this.video.append(c);
+      c.default && h.setAttribute("default", ""), this.video.append(h);
     }
-    let n = s.src, o = s.type;
-    if (s.qualities && s.qualities.length > 0) {
-      const h = Math.max(0, s.qualities.findIndex((c) => c.src === s.src));
-      this.progressiveQuality = h, n = s.qualities[h].src, o = s.qualities[h].type ?? o;
+    let n = i.src, o = i.type;
+    if (i.qualities && i.qualities.length > 0) {
+      const c = Math.max(0, i.qualities.findIndex((h) => h.src === i.src));
+      this.progressiveQuality = c, n = i.qualities[c].src, o = i.qualities[c].type ?? o;
     }
     this.video.preload = this.adManager?.hasPendingPreRoll ? "auto" : "metadata";
     const a = await ut(this.video, n, o, {
       onLevels: () => {
-        i === this.loadToken && this.controls.syncFeatureButtons();
+        s === this.loadToken && this.controls.syncFeatureButtons();
       },
-      onLevelSwitch: (h) => this.emitter.emit("qualitychange", { label: h }),
-      onError: (h, c) => this.emitter.emit("error", { message: h, cause: c })
+      onLevelSwitch: (c) => this.emitter.emit("qualitychange", { label: c }),
+      onError: (c, h) => this.emitter.emit("error", { message: c, cause: h })
     });
-    if (i !== this.loadToken) {
+    if (s !== this.loadToken) {
       a.destroy();
       return;
     }
-    if (this.sourceController = a, this.emitter.emit("sourcechange", { source: s, index: t }), s.thumbnails && q.load(s.thumbnails).then((h) => {
-      i === this.loadToken && (this.thumbTrack = h, this.controls.progress.setThumbnails(h), this.scenesPanel.visible && this.scenesPanel.rebuild());
-    }).catch((h) => this.emitter.emit("error", { message: "Failed to load thumbnails track", cause: h })), s.chapters) {
-      const h = (c) => {
+    if (this.sourceController = a, this.emitter.emit("sourcechange", { source: i, index: t }), i.thumbnails && q.load(i.thumbnails).then((c) => {
+      s === this.loadToken && (this.thumbTrack = c, this.controls.progress.setThumbnails(c), this.scenesPanel.visible && this.scenesPanel.rebuild());
+    }).catch((c) => this.emitter.emit("error", { message: "Failed to load thumbnails track", cause: c })), i.chapters) {
+      const c = (h) => {
         const u = () => {
-          i === this.loadToken && (this.chapters = at(c, this.video.duration), this.controls.progress.setChapters(this.chapters), this.controls.syncFeatureButtons(), this.scenesPanel.visible && this.scenesPanel.rebuild());
+          s === this.loadToken && (this.chapters = at(h, this.video.duration), this.controls.progress.setChapters(this.chapters), this.controls.syncFeatureButtons(), this.scenesPanel.visible && this.scenesPanel.rebuild());
         };
         Number.isFinite(this.video.duration) && this.video.duration > 0 ? u() : this.video.addEventListener("loadedmetadata", u, { once: !0, signal: this.abort.signal });
       };
-      typeof s.chapters == "string" ? ht(s.chapters).then((c) => h(c)).catch((c) => this.emitter.emit("error", { message: "Failed to load chapters track", cause: c })) : h(s.chapters);
+      typeof i.chapters == "string" ? ht(i.chapters).then((h) => c(h)).catch((h) => this.emitter.emit("error", { message: "Failed to load chapters track", cause: h })) : c(i.chapters);
     }
-    if (s.heatmap && s.heatmap.length > 0 && this.controlsOptions.heatmap) {
-      const h = s.heatmap, c = () => {
-        i === this.loadToken && this.controls.progress.setHeatmap(et(h, this.video.duration));
+    if (i.heatmap && i.heatmap.length > 0 && this.controlsOptions.heatmap) {
+      const c = i.heatmap, h = () => {
+        s === this.loadToken && this.controls.progress.setHeatmap(et(c, this.video.duration));
       };
-      Number.isFinite(this.video.duration) && this.video.duration > 0 ? c() : this.video.addEventListener("loadedmetadata", c, { once: !0, signal: this.abort.signal });
+      Number.isFinite(this.video.duration) && this.video.duration > 0 ? h() : this.video.addEventListener("loadedmetadata", h, { once: !0, signal: this.abort.signal });
     }
     e && this.play().catch(() => {
-      i === this.loadToken && this.poster.show();
+      s === this.loadToken && this.poster.show();
     });
   }
   bindVideoEvents() {
@@ -1558,8 +1579,8 @@ class _t {
       this.handleEnded();
     }, { signal: t }), e.addEventListener("timeupdate", () => {
       this.emitter.emit("timeupdate", { currentTime: e.currentTime, duration: e.duration || 0 }), this.adManager?.checkMidRolls(e.currentTime);
-      const i = K(this.chapters, e.currentTime);
-      i !== this.currentChapter && (this.currentChapter = i, this.emitter.emit("chapterchange", { chapter: i }));
+      const s = K(this.chapters, e.currentTime);
+      s !== this.currentChapter && (this.currentChapter = s, this.emitter.emit("chapterchange", { chapter: s }));
     }, { signal: t }), e.addEventListener("progress", () => {
       this.emitter.emit("progress", { buffered: this.bufferedEnd });
     }, { signal: t }), e.addEventListener("volumechange", () => {
@@ -1567,13 +1588,29 @@ class _t {
     }, { signal: t }), e.addEventListener("seeking", () => this.emitter.emit("seeking", { currentTime: e.currentTime }), { signal: t }), e.addEventListener("seeked", () => this.emitter.emit("seeked", { currentTime: e.currentTime }), { signal: t }), e.addEventListener("waiting", () => {
       this.spinner.hidden = !1;
     }, { signal: t });
-    for (const i of ["playing", "canplay", "seeked"])
-      e.addEventListener(i, () => {
-        this.spinner.hidden = !0;
+    for (const s of ["playing", "canplay", "seeked"])
+      e.addEventListener(s, () => {
+        this.spinner.hidden = !0, this.errorBox.hidden = !0, this.decodeRecoveries = 0;
       }, { signal: t });
     e.addEventListener("error", () => {
-      const i = e.error;
-      i && this.sourceController?.kind !== "hls" && (e.getAttribute("src") !== null || e.currentSrc) && this.emitter.emit("error", { message: i.message || `Media error (code ${i.code})`, cause: i });
+      const s = e.error;
+      if (!s || this.sourceController?.kind === "hls" || e.getAttribute("src") === null && !e.currentSrc) return;
+      if ((s.code === MediaError.MEDIA_ERR_DECODE || /DEMUXER|PARSE|DECODE/i.test(s.message || "")) && this.decodeRecoveries < 2 && Number.isFinite(e.duration)) {
+        this.decodeRecoveries++;
+        const n = e.currentTime, o = !e.paused;
+        e.load();
+        const a = () => {
+          try {
+            e.currentTime = n;
+          } catch {
+          }
+          o && e.play().catch(() => {
+          });
+        };
+        e.readyState >= 1 ? a() : e.addEventListener("loadedmetadata", a, { once: !0, signal: this.abort.signal });
+        return;
+      }
+      this.emitter.emit("error", { message: s.message || `Media error (code ${s.code})`, cause: s });
     }, { signal: t }), e.addEventListener("enterpictureinpicture", () => this.emitter.emit("pipchange", { active: !0 }), { signal: t }), e.addEventListener("leavepictureinpicture", () => this.emitter.emit("pipchange", { active: !1 }), { signal: t }), document.addEventListener("fullscreenchange", () => {
       this.emitter.emit("fullscreenchange", { active: this.isFullscreen }), this.container.classList.toggle("imp-player--fullscreen", this.isFullscreen);
     }, { signal: t });
@@ -1609,11 +1646,11 @@ class _t {
     this.container.addEventListener("keydown", (t) => {
       const e = t.target;
       if (e.closest("input, select, textarea, [contenteditable]")) return;
-      const s = e.closest("button") !== null;
+      const i = e.closest("button") !== null;
       switch (t.key) {
         case " ":
         case "k":
-          if (t.key === " " && s) return;
+          if (t.key === " " && i) return;
           t.preventDefault(), this.togglePlay();
           break;
         case "ArrowLeft":