@banou/media-player 0.4.5 → 0.4.7

package/build/index.js

@@ -2,12 +2,12 @@ import * as ce from "react";
 import mr, { forwardRef as pr, useContext as Ue, createContext as hr, useState as Z, useEffect as z, useCallback as ot, useRef as Ne, useMemo as pe } from "react";
 import { css as Q } from "@emotion/react";
 import { createActorContext as vr } from "@xstate/react";
-import { fromCallback as qt, setup as Er, enqueueActions as br, assign as Y, sendTo as X } from "xstate";
-import Xt from "p-queue";
+import { fromCallback as Xt, setup as Er, enqueueActions as br, assign as Y, sendTo as q } from "xstate";
+import qt from "p-queue";
 import { makeRemuxer as Ht } from "libav-wasm";
 import gr from "jassub";
 import { parse as Me, stringify as _t } from "ass-compiler";
-import { Settings as yr, ChevronRight as Ke, VolumeX as Sr, Volume1 as xr, Volume2 as Tr, RotateCcw as wr, Play as Ar, Pause as Rr, Minimize as _r, Maximize as Cr } from "react-feather";
+import { Settings as yr, ChevronRight as Ke, VolumeX as Sr, Volume1 as xr, Volume2 as Tr, RotateCcw as wr, Play as Rr, Pause as Ar, Minimize as _r, Maximize as Cr } from "react-feather";
 import { Tooltip as Pr } from "react-tooltip";
 var Je = { exports: {} }, Ce = {};
 /**
@@ -62,7 +62,7 @@ function Nr() {
       switch (i) {
         case _:
           return "Fragment";
-        case m:
+        case f:
           return "Portal";
         case W:
           return "Profiler";
@@ -119,7 +119,7 @@ function Nr() {
     }
     function o() {
       if (fe === 0) {
-        Fe = console.log, Ve = console.info, We = console.warn, Be = console.error, Ge = console.group, qe = console.groupCollapsed, Xe = console.groupEnd;
+        Fe = console.log, Ve = console.info, We = console.warn, Be = console.error, Ge = console.group, Xe = console.groupCollapsed, qe = console.groupEnd;
         var i = {
           configurable: !0,
           enumerable: !0,
@@ -147,8 +147,8 @@ function Nr() {
           warn: ie({}, i, { value: We }),
           error: ie({}, i, { value: Be }),
           group: ie({}, i, { value: Ge }),
-          groupCollapsed: ie({}, i, { value: qe }),
-          groupEnd: ie({}, i, { value: Xe })
+          groupCollapsed: ie({}, i, { value: Xe }),
+          groupEnd: ie({}, i, { value: qe })
         });
       }
       0 > fe && console.error(
@@ -156,16 +156,16 @@ function Nr() {
       );
     }
     function s(i) {
-      if (w === void 0)
+      if (R === void 0)
         try {
           throw Error();
         } catch (T) {
           var x = T.stack.trim().match(/\n( *(at )?)/);
-          w = x && x[1] || "", he = -1 < T.stack.indexOf(`
+          R = x && x[1] || "", he = -1 < T.stack.indexOf(`
     at`) ? " (<anonymous>)" : -1 < T.stack.indexOf("@") ? "@unknown:0:0" : "";
         }
       return `
-` + w + i + he;
+` + R + i + he;
     }
     function u(i, x) {
       if (!i || le) return "";
@@ -229,10 +229,10 @@ function Nr() {
         );
         var P = B.DetermineComponentFrameRoot(), ae = P[0], Ee = P[1];
         if (ae && Ee) {
-          var q = ae.split(`
+          var X = ae.split(`
 `), me = Ee.split(`
 `);
-          for (P = U = 0; U < q.length && !q[U].includes(
+          for (P = U = 0; U < X.length && !X[U].includes(
             "DetermineComponentFrameRoot"
           ); )
             U++;
@@ -240,16 +240,16 @@ function Nr() {
             "DetermineComponentFrameRoot"
           ); )
             P++;
-          if (U === q.length || P === me.length)
-            for (U = q.length - 1, P = me.length - 1; 1 <= U && 0 <= P && q[U] !== me[P]; )
+          if (U === X.length || P === me.length)
+            for (U = X.length - 1, P = me.length - 1; 1 <= U && 0 <= P && X[U] !== me[P]; )
               P--;
           for (; 1 <= U && 0 <= P; U--, P--)
-            if (q[U] !== me[P]) {
+            if (X[U] !== me[P]) {
               if (U !== 1 || P !== 1)
                 do
-                  if (U--, P--, 0 > P || q[U] !== me[P]) {
+                  if (U--, P--, 0 > P || X[U] !== me[P]) {
                     var _e = `
-` + q[U].replace(
+` + X[U].replace(
                       " at new ",
                       " at "
                     );
@@ -262,7 +262,7 @@ function Nr() {
       } finally {
         le = !1, oe.H = O, a(), Error.prepareStackTrace = T;
       }
-      return q = (q = i ? i.displayName || i.name : "") ? s(q) : "", typeof i == "function" && ve.set(i, q), q;
+      return X = (X = i ? i.displayName || i.name : "") ? s(X) : "", typeof i == "function" && ve.set(i, X), X;
     }
     function l(i) {
       if (i == null) return "";
@@ -295,12 +295,12 @@ function Nr() {
         }
       return "";
     }
-    function b() {
+    function E() {
       var i = oe.A;
       return i === null ? null : i.getOwner();
     }
     function d(i) {
-      if (Ae.call(i, "key")) {
+      if (Re.call(i, "key")) {
         var x = Object.getOwnPropertyDescriptor(i, "key").get;
         if (x && x.isReactWarning) return !1;
       }
@@ -326,7 +326,7 @@ function Nr() {
     }
     function y(i, x, T, O, B, U) {
       return T = U.ref, i = {
-        $$typeof: R,
+        $$typeof: A,
         type: i,
         key: x,
         props: U,
@@ -351,27 +351,27 @@ function Nr() {
         var P = x.children;
         if (P !== void 0)
           if (O)
-            if (Re(P)) {
+            if (Ae(P)) {
               for (O = 0; O < P.length; O++)
-                f(P[O], i);
+                m(P[O], i);
               Object.freeze && Object.freeze(P);
             } else
               console.error(
                 "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
               );
-          else f(P, i);
+          else m(P, i);
       } else
-        P = "", (i === void 0 || typeof i == "object" && i !== null && Object.keys(i).length === 0) && (P += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."), i === null ? O = "null" : Re(i) ? O = "array" : i !== void 0 && i.$$typeof === R ? (O = "<" + (e(i.type) || "Unknown") + " />", P = " Did you accidentally export a JSX literal instead of a component?") : O = typeof i, console.error(
+        P = "", (i === void 0 || typeof i == "object" && i !== null && Object.keys(i).length === 0) && (P += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."), i === null ? O = "null" : Ae(i) ? O = "array" : i !== void 0 && i.$$typeof === A ? (O = "<" + (e(i.type) || "Unknown") + " />", P = " Did you accidentally export a JSX literal instead of a component?") : O = typeof i, console.error(
           "React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",
           O,
           P
         );
-      if (Ae.call(x, "key")) {
+      if (Re.call(x, "key")) {
         P = e(i);
-        var ae = Object.keys(x).filter(function(q) {
-          return q !== "key";
+        var ae = Object.keys(x).filter(function(X) {
+          return X !== "key";
         });
-        O = 0 < ae.length ? "{key: someKey, " + ae.join(": ..., ") + ": ...}" : "{key: someKey}", At[P + O] || (ae = 0 < ae.length ? "{" + ae.join(": ..., ") + ": ...}" : "{}", console.error(
+        O = 0 < ae.length ? "{key: someKey, " + ae.join(": ..., ") + ": ...}" : "{key: someKey}", Rt[P + O] || (ae = 0 < ae.length ? "{" + ae.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
@@ -382,7 +382,7 @@ React keys must be passed directly to JSX without using spread:
           P,
           ae,
           P
-        ), At[P + O] = !0);
+        ), Rt[P + O] = !0);
       }
       if (P = null, T !== void 0 && (n(T), P = "" + T), d(x) && (n(x.key), P = "" + x.key), "key" in x) {
         T = {};
@@ -392,30 +392,30 @@ React keys must be passed directly to JSX without using spread:
       return P && g(
         T,
         typeof i == "function" ? i.displayName || i.name || "Unknown" : i
-      ), y(i, P, U, B, b(), T);
+      ), y(i, P, U, B, E(), T);
     }
-    function f(i, x) {
+    function m(i, x) {
       if (typeof i == "object" && i && i.$$typeof !== fr) {
-        if (Re(i))
+        if (Ae(i))
           for (var T = 0; T < i.length; T++) {
             var O = i[T];
-            c(O) && E(O, x);
+            c(O) && v(O, x);
           }
         else if (c(i))
           i._store && (i._store.validated = 1);
         else if (i === null || typeof i != "object" ? T = null : (T = Ye && i[Ye] || i["@@iterator"], T = typeof T == "function" ? T : null), typeof T == "function" && T !== i.entries && (T = T.call(i), T !== i))
           for (; !(i = T.next()).done; )
-            c(i.value) && E(i.value, x);
+            c(i.value) && v(i.value, x);
       }
     }
     function c(i) {
-      return typeof i == "object" && i !== null && i.$$typeof === R;
+      return typeof i == "object" && i !== null && i.$$typeof === A;
     }
-    function E(i, x) {
-      if (i._store && !i._store.validated && i.key == null && (i._store.validated = 1, x = h(x), !Rt[x])) {
-        Rt[x] = !0;
+    function v(i, x) {
+      if (i._store && !i._store.validated && i.key == null && (i._store.validated = 1, x = b(x), !At[x])) {
+        At[x] = !0;
         var T = "";
-        i && i._owner != null && i._owner !== b() && (T = null, typeof i._owner.tag == "number" ? T = e(i._owner.type) : typeof i._owner.name == "string" && (T = i._owner.name), T = " It was passed a child from " + T + ".");
+        i && i._owner != null && i._owner !== E() && (T = null, typeof i._owner.tag == "number" ? T = e(i._owner.type) : typeof i._owner.name == "string" && (T = i._owner.name), T = " It was passed a child from " + T + ".");
         var O = oe.getCurrentStack;
         oe.getCurrentStack = function() {
           var B = l(i.type);
@@ -427,17 +427,17 @@ React keys must be passed directly to JSX without using spread:
         ), oe.getCurrentStack = O;
       }
     }
-    function h(i) {
-      var x = "", T = b();
+    function b(i) {
+      var x = "", T = E();
       return T && (T = e(T.type)) && (x = `
 
 Check the render method of \`` + T + "`."), x || (i = e(i)) && (x = `
 
 Check the top-level render call using <` + i + ">."), x;
     }
-    var A = mr, R = Symbol.for("react.transitional.element"), m = Symbol.for("react.portal"), _ = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), W = Symbol.for("react.profiler"), D = Symbol.for("react.consumer"), K = Symbol.for("react.context"), F = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), ue = Symbol.for("react.suspense_list"), Te = Symbol.for("react.memo"), we = Symbol.for("react.lazy"), dt = Symbol.for("react.offscreen"), Ye = Symbol.iterator, ze = Symbol.for("react.client.reference"), oe = A.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Ae = Object.prototype.hasOwnProperty, ie = Object.assign, ft = Symbol.for("react.client.reference"), Re = Array.isArray, fe = 0, Fe, Ve, We, Be, Ge, qe, Xe;
+    var w = mr, A = Symbol.for("react.transitional.element"), f = Symbol.for("react.portal"), _ = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), W = Symbol.for("react.profiler"), D = Symbol.for("react.consumer"), K = Symbol.for("react.context"), F = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), ue = Symbol.for("react.suspense_list"), Te = Symbol.for("react.memo"), we = Symbol.for("react.lazy"), dt = Symbol.for("react.offscreen"), Ye = Symbol.iterator, ze = Symbol.for("react.client.reference"), oe = w.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Re = Object.prototype.hasOwnProperty, ie = Object.assign, ft = Symbol.for("react.client.reference"), Ae = Array.isArray, fe = 0, Fe, Ve, We, Be, Ge, Xe, qe;
     r.__reactDisabledLog = !0;
-    var w, he, le = !1, ve = new (typeof WeakMap == "function" ? WeakMap : Map)(), fr = Symbol.for("react.client.reference"), Tt, wt = {}, At = {}, Rt = {};
+    var R, he, le = !1, ve = new (typeof WeakMap == "function" ? WeakMap : Map)(), fr = Symbol.for("react.client.reference"), Tt, wt = {}, Rt = {}, At = {};
     Pe.Fragment = _, Pe.jsx = function(i, x, T, O, B) {
       return p(i, x, T, !1, O, B);
     }, Pe.jsxs = function(i, x, T, O, B) {
@@ -449,15 +449,15 @@ var Ot;
 function Mr() {
   return Ot || (Ot = 1, process.env.NODE_ENV === "production" ? Je.exports = Or() : Je.exports = Nr()), Je.exports;
 }
-var ke = Mr();
-function kr(e) {
+var Le = Mr();
+function Lr(e) {
   if (e.sheet)
     return e.sheet;
   for (var t = 0; t < document.styleSheets.length; t++)
     if (document.styleSheets[t].ownerNode === e)
       return document.styleSheets[t];
 }
-function Lr(e) {
+function kr(e) {
   var t = document.createElement("style");
   return t.setAttribute("data-emotion", e.key), e.nonce !== void 0 && t.setAttribute("nonce", e.nonce), t.appendChild(document.createTextNode("")), t.setAttribute("data-s", ""), t;
 }
@@ -473,10 +473,10 @@ var $r = /* @__PURE__ */ function() {
   return t.hydrate = function(r) {
     r.forEach(this._insertTag);
   }, t.insert = function(r) {
-    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(Lr(this));
+    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(kr(this));
     var o = this.tags[this.tags.length - 1];
     if (this.isSpeedy) {
-      var a = kr(o);
+      var a = Lr(o);
       try {
         a.insertRule(r, a.cssRules.length);
       } catch {
@@ -509,7 +509,7 @@ function ht(e, t) {
 function V(e, t) {
   return e.charCodeAt(t) | 0;
 }
-function Le(e, t, n) {
+function ke(e, t, n) {
   return e.slice(t, n);
 }
 function te(e) {
@@ -547,7 +547,7 @@ function et() {
   return H;
 }
 function De(e, t) {
-  return Le(xe, e, t);
+  return ke(xe, e, t);
 }
 function $e(e) {
   switch (e) {
@@ -628,13 +628,13 @@ function vt(e) {
     }
   return H;
 }
-function qr(e, t) {
+function Xr(e, t) {
   for (; J() && e + j !== 57; )
     if (e + j === 84 && ne() === 47)
       break;
   return "/*" + De(t, H - 1) + "*" + at(e === 47 ? e : J());
 }
-function Xr(e) {
+function qr(e) {
   for (; !$e(ne()); )
     J();
   return De(e, H);
@@ -643,19 +643,19 @@ function Hr(e) {
   return tr(rt("", null, null, null, [""], e = er(e), 0, [0], e));
 }
 function rt(e, t, n, r, o, a, s, u, l) {
-  for (var b = 0, d = 0, g = s, S = 0, y = 0, p = 0, f = 1, c = 1, E = 1, h = 0, A = "", R = o, m = a, _ = r, C = A; c; )
-    switch (p = h, h = J()) {
+  for (var E = 0, d = 0, g = s, S = 0, y = 0, p = 0, m = 1, c = 1, v = 1, b = 0, w = "", A = o, f = a, _ = r, C = w; c; )
+    switch (p = b, b = J()) {
       // (
       case 40:
         if (p != 108 && V(C, g - 1) == 58) {
-          ht(C += M(tt(h), "&", "&\f"), "&\f") != -1 && (E = -1);
+          ht(C += M(tt(b), "&", "&\f"), "&\f") != -1 && (v = -1);
           break;
         }
       // " ' [
       case 34:
       case 39:
       case 91:
-        C += tt(h);
+        C += tt(b);
         break;
       // \t \n \r \s
       case 9:
@@ -673,36 +673,36 @@ function rt(e, t, n, r, o, a, s, u, l) {
         switch (ne()) {
           case 42:
           case 47:
-            Ze(Kr(qr(J(), et()), t, n), l);
+            Ze(Kr(Xr(J(), et()), t, n), l);
             break;
           default:
             C += "/";
         }
         break;
       // {
-      case 123 * f:
-        u[b++] = te(C) * E;
+      case 123 * m:
+        u[E++] = te(C) * v;
       // } ; \0
-      case 125 * f:
+      case 125 * m:
       case 59:
       case 0:
-        switch (h) {
+        switch (b) {
           // \0 }
           case 0:
           case 125:
             c = 0;
           // ;
           case 59 + d:
-            E == -1 && (C = M(C, /\f/g, "")), y > 0 && te(C) - g && Ze(y > 32 ? Mt(C + ";", r, n, g - 1) : Mt(M(C, " ", "") + ";", r, n, g - 2), l);
+            v == -1 && (C = M(C, /\f/g, "")), y > 0 && te(C) - g && Ze(y > 32 ? Mt(C + ";", r, n, g - 1) : Mt(M(C, " ", "") + ";", r, n, g - 2), l);
             break;
           // @ ;
           case 59:
             C += ";";
           // { rule/at-rule
           default:
-            if (Ze(_ = Nt(C, t, n, b, d, o, u, A, R = [], m = [], g), a), h === 123)
+            if (Ze(_ = Nt(C, t, n, E, d, o, u, w, A = [], f = [], g), a), b === 123)
               if (d === 0)
-                rt(C, t, _, _, R, a, g, u, m);
+                rt(C, t, _, _, A, a, g, u, f);
               else
                 switch (S === 99 && V(C, 3) === 110 ? 100 : S) {
                   // d l m s
@@ -710,55 +710,55 @@ function rt(e, t, n, r, o, a, s, u, l) {
                   case 108:
                   case 109:
                   case 115:
-                    rt(e, _, _, r && Ze(Nt(e, _, _, 0, 0, o, u, A, o, R = [], g), m), o, m, g, u, r ? R : m);
+                    rt(e, _, _, r && Ze(Nt(e, _, _, 0, 0, o, u, w, o, A = [], g), f), o, f, g, u, r ? A : f);
                     break;
                   default:
-                    rt(C, _, _, _, [""], m, 0, u, m);
+                    rt(C, _, _, _, [""], f, 0, u, f);
                 }
         }
-        b = d = y = 0, f = E = 1, A = C = "", g = s;
+        E = d = y = 0, m = v = 1, w = C = "", g = s;
         break;
       // :
       case 58:
         g = 1 + te(C), y = p;
       default:
-        if (f < 1) {
-          if (h == 123)
-            --f;
-          else if (h == 125 && f++ == 0 && Wr() == 125)
+        if (m < 1) {
+          if (b == 123)
+            --m;
+          else if (b == 125 && m++ == 0 && Wr() == 125)
             continue;
         }
-        switch (C += at(h), h * f) {
+        switch (C += at(b), b * m) {
           // &
           case 38:
-            E = d > 0 ? 1 : (C += "\f", -1);
+            v = d > 0 ? 1 : (C += "\f", -1);
             break;
           // ,
           case 44:
-            u[b++] = (te(C) - 1) * E, E = 1;
+            u[E++] = (te(C) - 1) * v, v = 1;
             break;
           // @
           case 64:
-            ne() === 45 && (C += tt(J())), S = ne(), d = g = te(A = C += Xr(et())), h++;
+            ne() === 45 && (C += tt(J())), S = ne(), d = g = te(w = C += qr(et())), b++;
             break;
           // -
           case 45:
-            p === 45 && te(C) == 2 && (f = 0);
+            p === 45 && te(C) == 2 && (m = 0);
         }
     }
   return a;
 }
-function Nt(e, t, n, r, o, a, s, u, l, b, d) {
-  for (var g = o - 1, S = o === 0 ? a : [""], y = St(S), p = 0, f = 0, c = 0; p < r; ++p)
-    for (var E = 0, h = Le(e, g + 1, g = Dr(f = s[p])), A = e; E < y; ++E)
-      (A = Zt(f > 0 ? S[E] + " " + h : M(h, /&\f/g, S[E]))) && (l[c++] = A);
-  return ct(e, t, n, o === 0 ? gt : u, l, b, d);
+function Nt(e, t, n, r, o, a, s, u, l, E, d) {
+  for (var g = o - 1, S = o === 0 ? a : [""], y = St(S), p = 0, m = 0, c = 0; p < r; ++p)
+    for (var v = 0, b = ke(e, g + 1, g = Dr(m = s[p])), w = e; v < y; ++v)
+      (w = Zt(m > 0 ? S[v] + " " + b : M(b, /&\f/g, S[v]))) && (l[c++] = w);
+  return ct(e, t, n, o === 0 ? gt : u, l, E, d);
 }
 function Kr(e, t, n) {
-  return ct(e, t, n, Kt, at(Vr()), Le(e, 2, -2), 0);
+  return ct(e, t, n, Kt, at(Vr()), ke(e, 2, -2), 0);
 }
 function Mt(e, t, n, r) {
-  return ct(e, t, n, yt, Le(e, 0, r), Le(e, r + 1, -1), r);
+  return ct(e, t, n, yt, ke(e, 0, r), ke(e, r + 1, -1), r);
 }
 function be(e, t) {
   for (var n = "", r = St(e), o = 0; o < r; o++)
@@ -827,17 +827,17 @@ var tn = function(t, n, r) {
   return t;
 }, nn = function(t, n) {
   return tr(rn(er(t), n));
-}, kt = /* @__PURE__ */ new WeakMap(), on = function(t) {
+}, Lt = /* @__PURE__ */ new WeakMap(), on = function(t) {
   if (!(t.type !== "rule" || !t.parent || // positive .length indicates that this rule contains pseudo
   // negative .length indicates that this rule has been already prefixed
   t.length < 1)) {
     for (var n = t.value, r = t.parent, o = t.column === r.column && t.line === r.line; r.type !== "rule"; )
       if (r = r.parent, !r) return;
-    if (!(t.props.length === 1 && n.charCodeAt(0) !== 58 && !kt.get(r)) && !o) {
-      kt.set(t, !0);
-      for (var a = [], s = nn(n, a), u = r.props, l = 0, b = 0; l < s.length; l++)
-        for (var d = 0; d < u.length; d++, b++)
-          t.props[b] = a[l] ? s[l].replace(/&\f/g, u[d]) : u[d] + " " + s[l];
+    if (!(t.props.length === 1 && n.charCodeAt(0) !== 58 && !Lt.get(r)) && !o) {
+      Lt.set(t, !0);
+      for (var a = [], s = nn(n, a), u = r.props, l = 0, E = 0; l < s.length; l++)
+        for (var d = 0; d < u.length; d++, E++)
+          t.props[E] = a[l] ? s[l].replace(/&\f/g, u[d]) : u[d] + " " + s[l];
     }
   }
 }, an = function(t) {
@@ -1025,9 +1025,9 @@ var sn = function(t, n, r, o) {
   var n = t.key;
   if (n === "css") {
     var r = document.querySelectorAll("style[data-emotion]:not([data-s])");
-    Array.prototype.forEach.call(r, function(f) {
-      var c = f.getAttribute("data-emotion");
-      c.indexOf(" ") !== -1 && (document.head.appendChild(f), f.setAttribute("data-s", ""));
+    Array.prototype.forEach.call(r, function(m) {
+      var c = m.getAttribute("data-emotion");
+      c.indexOf(" ") !== -1 && (document.head.appendChild(m), m.setAttribute("data-s", ""));
     });
   }
   var o = t.stylisPlugins || cn, a = {}, s, u = [];
@@ -1035,21 +1035,21 @@ var sn = function(t, n, r, o) {
     // this means we will ignore elements which don't have a space in them which
     // means that the style elements we're looking at are only Emotion 11 server-rendered style elements
     document.querySelectorAll('style[data-emotion^="' + n + ' "]'),
-    function(f) {
-      for (var c = f.getAttribute("data-emotion").split(" "), E = 1; E < c.length; E++)
-        a[c[E]] = !0;
-      u.push(f);
+    function(m) {
+      for (var c = m.getAttribute("data-emotion").split(" "), v = 1; v < c.length; v++)
+        a[c[v]] = !0;
+      u.push(m);
     }
   );
-  var l, b = [on, an];
+  var l, E = [on, an];
   {
-    var d, g = [Jr, Qr(function(f) {
-      d.insert(f);
-    })], S = Zr(b.concat(o, g)), y = function(c) {
+    var d, g = [Jr, Qr(function(m) {
+      d.insert(m);
+    })], S = Zr(E.concat(o, g)), y = function(c) {
       return be(Hr(c), S);
     };
-    l = function(c, E, h, A) {
-      d = h, y(c ? c + "{" + E.styles + "}" : E.styles), A && (p.inserted[E.name] = !0);
+    l = function(c, v, b, w) {
+      d = b, y(c ? c + "{" + v.styles + "}" : v.styles), w && (p.inserted[v.name] = !0);
     };
   }
   var p = {
@@ -1068,7 +1068,7 @@ var sn = function(t, n, r, o) {
     insert: l
   };
   return p.sheet.hydrate(u), p;
-}, Qe = { exports: {} }, k = {};
+}, Qe = { exports: {} }, L = {};
 /** @license React v16.13.1
  * react-is.production.min.js
  *
@@ -1077,32 +1077,32 @@ var sn = function(t, n, r, o) {
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Lt;
+var kt;
 function ln() {
-  if (Lt) return k;
-  Lt = 1;
-  var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, r = e ? Symbol.for("react.fragment") : 60107, o = e ? Symbol.for("react.strict_mode") : 60108, a = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, u = e ? Symbol.for("react.context") : 60110, l = e ? Symbol.for("react.async_mode") : 60111, b = e ? Symbol.for("react.concurrent_mode") : 60111, d = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, S = e ? Symbol.for("react.suspense_list") : 60120, y = e ? Symbol.for("react.memo") : 60115, p = e ? Symbol.for("react.lazy") : 60116, f = e ? Symbol.for("react.block") : 60121, c = e ? Symbol.for("react.fundamental") : 60117, E = e ? Symbol.for("react.responder") : 60118, h = e ? Symbol.for("react.scope") : 60119;
-  function A(m) {
-    if (typeof m == "object" && m !== null) {
-      var _ = m.$$typeof;
+  if (kt) return L;
+  kt = 1;
+  var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, r = e ? Symbol.for("react.fragment") : 60107, o = e ? Symbol.for("react.strict_mode") : 60108, a = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, u = e ? Symbol.for("react.context") : 60110, l = e ? Symbol.for("react.async_mode") : 60111, E = e ? Symbol.for("react.concurrent_mode") : 60111, d = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, S = e ? Symbol.for("react.suspense_list") : 60120, y = e ? Symbol.for("react.memo") : 60115, p = e ? Symbol.for("react.lazy") : 60116, m = e ? Symbol.for("react.block") : 60121, c = e ? Symbol.for("react.fundamental") : 60117, v = e ? Symbol.for("react.responder") : 60118, b = e ? Symbol.for("react.scope") : 60119;
+  function w(f) {
+    if (typeof f == "object" && f !== null) {
+      var _ = f.$$typeof;
       switch (_) {
         case t:
-          switch (m = m.type, m) {
+          switch (f = f.type, f) {
             case l:
-            case b:
+            case E:
             case r:
             case a:
             case o:
             case g:
-              return m;
+              return f;
             default:
-              switch (m = m && m.$$typeof, m) {
+              switch (f = f && f.$$typeof, f) {
                 case u:
                 case d:
                 case p:
                 case y:
                 case s:
-                  return m;
+                  return f;
                 default:
                   return _;
               }
@@ -1112,38 +1112,38 @@ function ln() {
       }
     }
   }
-  function R(m) {
-    return A(m) === b;
+  function A(f) {
+    return w(f) === E;
   }
-  return k.AsyncMode = l, k.ConcurrentMode = b, k.ContextConsumer = u, k.ContextProvider = s, k.Element = t, k.ForwardRef = d, k.Fragment = r, k.Lazy = p, k.Memo = y, k.Portal = n, k.Profiler = a, k.StrictMode = o, k.Suspense = g, k.isAsyncMode = function(m) {
-    return R(m) || A(m) === l;
-  }, k.isConcurrentMode = R, k.isContextConsumer = function(m) {
-    return A(m) === u;
-  }, k.isContextProvider = function(m) {
-    return A(m) === s;
-  }, k.isElement = function(m) {
-    return typeof m == "object" && m !== null && m.$$typeof === t;
-  }, k.isForwardRef = function(m) {
-    return A(m) === d;
-  }, k.isFragment = function(m) {
-    return A(m) === r;
-  }, k.isLazy = function(m) {
-    return A(m) === p;
-  }, k.isMemo = function(m) {
-    return A(m) === y;
-  }, k.isPortal = function(m) {
-    return A(m) === n;
-  }, k.isProfiler = function(m) {
-    return A(m) === a;
-  }, k.isStrictMode = function(m) {
-    return A(m) === o;
-  }, k.isSuspense = function(m) {
-    return A(m) === g;
-  }, k.isValidElementType = function(m) {
-    return typeof m == "string" || typeof m == "function" || m === r || m === b || m === a || m === o || m === g || m === S || typeof m == "object" && m !== null && (m.$$typeof === p || m.$$typeof === y || m.$$typeof === s || m.$$typeof === u || m.$$typeof === d || m.$$typeof === c || m.$$typeof === E || m.$$typeof === h || m.$$typeof === f);
-  }, k.typeOf = A, k;
+  return L.AsyncMode = l, L.ConcurrentMode = E, L.ContextConsumer = u, L.ContextProvider = s, L.Element = t, L.ForwardRef = d, L.Fragment = r, L.Lazy = p, L.Memo = y, L.Portal = n, L.Profiler = a, L.StrictMode = o, L.Suspense = g, L.isAsyncMode = function(f) {
+    return A(f) || w(f) === l;
+  }, L.isConcurrentMode = A, L.isContextConsumer = function(f) {
+    return w(f) === u;
+  }, L.isContextProvider = function(f) {
+    return w(f) === s;
+  }, L.isElement = function(f) {
+    return typeof f == "object" && f !== null && f.$$typeof === t;
+  }, L.isForwardRef = function(f) {
+    return w(f) === d;
+  }, L.isFragment = function(f) {
+    return w(f) === r;
+  }, L.isLazy = function(f) {
+    return w(f) === p;
+  }, L.isMemo = function(f) {
+    return w(f) === y;
+  }, L.isPortal = function(f) {
+    return w(f) === n;
+  }, L.isProfiler = function(f) {
+    return w(f) === a;
+  }, L.isStrictMode = function(f) {
+    return w(f) === o;
+  }, L.isSuspense = function(f) {
+    return w(f) === g;
+  }, L.isValidElementType = function(f) {
+    return typeof f == "string" || typeof f == "function" || f === r || f === E || f === a || f === o || f === g || f === S || typeof f == "object" && f !== null && (f.$$typeof === p || f.$$typeof === y || f.$$typeof === s || f.$$typeof === u || f.$$typeof === d || f.$$typeof === c || f.$$typeof === v || f.$$typeof === b || f.$$typeof === m);
+  }, L.typeOf = w, L;
 }
-var L = {};
+var k = {};
 /** @license React v16.13.1
  * react-is.development.js
  *
@@ -1155,20 +1155,20 @@ var L = {};
 var $t;
 function dn() {
   return $t || ($t = 1, process.env.NODE_ENV !== "production" && function() {
-    var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, r = e ? Symbol.for("react.fragment") : 60107, o = e ? Symbol.for("react.strict_mode") : 60108, a = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, u = e ? Symbol.for("react.context") : 60110, l = e ? Symbol.for("react.async_mode") : 60111, b = e ? Symbol.for("react.concurrent_mode") : 60111, d = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, S = e ? Symbol.for("react.suspense_list") : 60120, y = e ? Symbol.for("react.memo") : 60115, p = e ? Symbol.for("react.lazy") : 60116, f = e ? Symbol.for("react.block") : 60121, c = e ? Symbol.for("react.fundamental") : 60117, E = e ? Symbol.for("react.responder") : 60118, h = e ? Symbol.for("react.scope") : 60119;
-    function A(w) {
-      return typeof w == "string" || typeof w == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
-      w === r || w === b || w === a || w === o || w === g || w === S || typeof w == "object" && w !== null && (w.$$typeof === p || w.$$typeof === y || w.$$typeof === s || w.$$typeof === u || w.$$typeof === d || w.$$typeof === c || w.$$typeof === E || w.$$typeof === h || w.$$typeof === f);
-    }
-    function R(w) {
-      if (typeof w == "object" && w !== null) {
-        var he = w.$$typeof;
+    var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, r = e ? Symbol.for("react.fragment") : 60107, o = e ? Symbol.for("react.strict_mode") : 60108, a = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, u = e ? Symbol.for("react.context") : 60110, l = e ? Symbol.for("react.async_mode") : 60111, E = e ? Symbol.for("react.concurrent_mode") : 60111, d = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, S = e ? Symbol.for("react.suspense_list") : 60120, y = e ? Symbol.for("react.memo") : 60115, p = e ? Symbol.for("react.lazy") : 60116, m = e ? Symbol.for("react.block") : 60121, c = e ? Symbol.for("react.fundamental") : 60117, v = e ? Symbol.for("react.responder") : 60118, b = e ? Symbol.for("react.scope") : 60119;
+    function w(R) {
+      return typeof R == "string" || typeof R == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+      R === r || R === E || R === a || R === o || R === g || R === S || typeof R == "object" && R !== null && (R.$$typeof === p || R.$$typeof === y || R.$$typeof === s || R.$$typeof === u || R.$$typeof === d || R.$$typeof === c || R.$$typeof === v || R.$$typeof === b || R.$$typeof === m);
+    }
+    function A(R) {
+      if (typeof R == "object" && R !== null) {
+        var he = R.$$typeof;
         switch (he) {
           case t:
-            var le = w.type;
+            var le = R.type;
             switch (le) {
               case l:
-              case b:
+              case E:
               case r:
               case a:
               case o:
@@ -1192,48 +1192,48 @@ function dn() {
         }
       }
     }
-    var m = l, _ = b, C = u, W = s, D = t, K = d, F = r, ee = p, ue = y, Te = n, we = a, dt = o, Ye = g, ze = !1;
-    function oe(w) {
-      return ze || (ze = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), Ae(w) || R(w) === l;
+    var f = l, _ = E, C = u, W = s, D = t, K = d, F = r, ee = p, ue = y, Te = n, we = a, dt = o, Ye = g, ze = !1;
+    function oe(R) {
+      return ze || (ze = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), Re(R) || A(R) === l;
     }
-    function Ae(w) {
-      return R(w) === b;
+    function Re(R) {
+      return A(R) === E;
     }
-    function ie(w) {
-      return R(w) === u;
+    function ie(R) {
+      return A(R) === u;
     }
-    function ft(w) {
-      return R(w) === s;
+    function ft(R) {
+      return A(R) === s;
     }
-    function Re(w) {
-      return typeof w == "object" && w !== null && w.$$typeof === t;
+    function Ae(R) {
+      return typeof R == "object" && R !== null && R.$$typeof === t;
     }
-    function fe(w) {
-      return R(w) === d;
+    function fe(R) {
+      return A(R) === d;
     }
-    function Fe(w) {
-      return R(w) === r;
+    function Fe(R) {
+      return A(R) === r;
     }
-    function Ve(w) {
-      return R(w) === p;
+    function Ve(R) {
+      return A(R) === p;
     }
-    function We(w) {
-      return R(w) === y;
+    function We(R) {
+      return A(R) === y;
     }
-    function Be(w) {
-      return R(w) === n;
+    function Be(R) {
+      return A(R) === n;
     }
-    function Ge(w) {
-      return R(w) === a;
+    function Ge(R) {
+      return A(R) === a;
     }
-    function qe(w) {
-      return R(w) === o;
+    function Xe(R) {
+      return A(R) === o;
     }
-    function Xe(w) {
-      return R(w) === g;
+    function qe(R) {
+      return A(R) === g;
     }
-    L.AsyncMode = m, L.ConcurrentMode = _, L.ContextConsumer = C, L.ContextProvider = W, L.Element = D, L.ForwardRef = K, L.Fragment = F, L.Lazy = ee, L.Memo = ue, L.Portal = Te, L.Profiler = we, L.StrictMode = dt, L.Suspense = Ye, L.isAsyncMode = oe, L.isConcurrentMode = Ae, L.isContextConsumer = ie, L.isContextProvider = ft, L.isElement = Re, L.isForwardRef = fe, L.isFragment = Fe, L.isLazy = Ve, L.isMemo = We, L.isPortal = Be, L.isProfiler = Ge, L.isStrictMode = qe, L.isSuspense = Xe, L.isValidElementType = A, L.typeOf = R;
-  }()), L;
+    k.AsyncMode = f, k.ConcurrentMode = _, k.ContextConsumer = C, k.ContextProvider = W, k.Element = D, k.ForwardRef = K, k.Fragment = F, k.Lazy = ee, k.Memo = ue, k.Portal = Te, k.Profiler = we, k.StrictMode = dt, k.Suspense = Ye, k.isAsyncMode = oe, k.isConcurrentMode = Re, k.isContextConsumer = ie, k.isContextProvider = ft, k.isElement = Ae, k.isForwardRef = fe, k.isFragment = Fe, k.isLazy = Ve, k.isMemo = We, k.isPortal = Be, k.isProfiler = Ge, k.isStrictMode = Xe, k.isSuspense = qe, k.isValidElementType = w, k.typeOf = A;
+  }()), k;
 }
 var It;
 function fn() {
@@ -1281,19 +1281,19 @@ function mn() {
   function s(p) {
     return e.isMemo(p) ? o : a[p.$$typeof] || t;
   }
-  var u = Object.defineProperty, l = Object.getOwnPropertyNames, b = Object.getOwnPropertySymbols, d = Object.getOwnPropertyDescriptor, g = Object.getPrototypeOf, S = Object.prototype;
-  function y(p, f, c) {
-    if (typeof f != "string") {
+  var u = Object.defineProperty, l = Object.getOwnPropertyNames, E = Object.getOwnPropertySymbols, d = Object.getOwnPropertyDescriptor, g = Object.getPrototypeOf, S = Object.prototype;
+  function y(p, m, c) {
+    if (typeof m != "string") {
       if (S) {
-        var E = g(f);
-        E && E !== S && y(p, E, c);
+        var v = g(m);
+        v && v !== S && y(p, v, c);
       }
-      var h = l(f);
-      b && (h = h.concat(b(f)));
-      for (var A = s(p), R = s(f), m = 0; m < h.length; ++m) {
-        var _ = h[m];
-        if (!n[_] && !(c && c[_]) && !(R && R[_]) && !(A && A[_])) {
-          var C = d(f, _);
+      var b = l(m);
+      E && (b = b.concat(E(m)));
+      for (var w = s(p), A = s(m), f = 0; f < b.length; ++f) {
+        var _ = b[f];
+        if (!n[_] && !(c && c[_]) && !(A && A[_]) && !(w && w[_])) {
+          var C = d(m, _);
           try {
             u(p, _, C);
           } catch {
@@ -1458,8 +1458,8 @@ function Ie(e, t, n) {
     }
     case "function": {
       if (e !== void 0) {
-        var l = re, b = n(e);
-        return re = l, Ie(e, t, b);
+        var l = re, E = n(e);
+        return re = l, Ie(e, t, E);
       }
       break;
     }
@@ -1482,15 +1482,15 @@ function Sn(e, t, n) {
         for (var l = 0; l < s.length; l++)
           Dt(s[l]) && (r += pt(a) + ":" + jt(a, s[l]) + ";");
       else {
-        var b = Ie(e, t, s);
+        var E = Ie(e, t, s);
         switch (a) {
           case "animation":
           case "animationName": {
-            r += pt(a) + ":" + b + ";";
+            r += pt(a) + ":" + E + ";";
             break;
           }
           default:
-            r += a + "{" + b + "}";
+            r += a + "{" + E + "}";
         }
       }
     }
@@ -1515,9 +1515,9 @@ function xn(e, t, n) {
       o += l[u];
     }
   Yt.lastIndex = 0;
-  for (var b = "", d; (d = Yt.exec(o)) !== null; )
-    b += "-" + d[1];
-  var g = En(o) + b;
+  for (var E = "", d; (d = Yt.exec(o)) !== null; )
+    E += "-" + d[1];
+  var g = En(o) + E;
   return {
     name: g,
     styles: o,
@@ -1526,7 +1526,7 @@ function xn(e, t, n) {
 }
 var Tn = function(t) {
   return t();
-}, wn = ce.useInsertionEffect ? ce.useInsertionEffect : !1, An = wn || Tn, ir = /* @__PURE__ */ ce.createContext(
+}, wn = ce.useInsertionEffect ? ce.useInsertionEffect : !1, Rn = wn || Tn, ir = /* @__PURE__ */ ce.createContext(
   // we're doing this to avoid preconstruct's dead code elimination in this one case
   // because this module is primarily intended for the browser and node
   // but it's also required in react native and similar environments sometimes
@@ -1538,7 +1538,7 @@ var Tn = function(t) {
   }) : null
 );
 ir.Provider;
-var Rn = function(t) {
+var An = function(t) {
   return /* @__PURE__ */ pr(function(n, r) {
     var o = Ue(ir);
     return t(n, o, r);
@@ -1550,10 +1550,10 @@ var Rn = function(t) {
   return r[Et] = t, r;
 }, Cn = function(t) {
   var n = t.cache, r = t.serialized, o = t.isStringTag;
-  return nr(n, r, o), An(function() {
+  return nr(n, r, o), Rn(function() {
     return vn(n, r, o);
   }), null;
-}, Pn = /* @__PURE__ */ Rn(function(e, t, n) {
+}, Pn = /* @__PURE__ */ An(function(e, t, n) {
   var r = e.css;
   typeof r == "string" && t.registered[r] !== void 0 && (r = t.registered[r]);
   var o = e[Et], a = [r], s = "";
@@ -1561,28 +1561,28 @@ var Rn = function(t) {
   var u = xn(a, void 0, ce.useContext(_n));
   s += t.key + "-" + u.name;
   var l = {};
-  for (var b in e)
-    ut.call(e, b) && b !== "css" && b !== Et && (l[b] = e[b]);
+  for (var E in e)
+    ut.call(e, E) && E !== "css" && E !== Et && (l[E] = e[E]);
   return l.className = s, n && (l.ref = n), /* @__PURE__ */ ce.createElement(ce.Fragment, null, /* @__PURE__ */ ce.createElement(Cn, {
     cache: t,
     serialized: u,
     isStringTag: typeof o == "string"
   }), /* @__PURE__ */ ce.createElement(o, l));
-}), sr = Pn, cr = ke.Fragment, v = function(t, n, r) {
-  return ut.call(n, "css") ? ke.jsx(sr, ar(t, n), r) : ke.jsx(t, n, r);
+}), sr = Pn, cr = Le.Fragment, h = function(t, n, r) {
+  return ut.call(n, "css") ? Le.jsx(sr, ar(t, n), r) : Le.jsx(t, n, r);
 }, I = function(t, n, r) {
-  return ut.call(n, "css") ? ke.jsxs(sr, ar(t, n), r) : ke.jsxs(t, n, r);
+  return ut.call(n, "css") ? Le.jsxs(sr, ar(t, n), r) : Le.jsxs(t, n, r);
 };
-const On = qt(({ sendBack: e, receive: t, input: n }) => {
+const On = Xt(({ sendBack: e, receive: t, input: n }) => {
   const { videoElement: r } = n;
   t((S) => {
-    S.type === "PLAY" && (r.play(), o()), S.type === "PAUSE" && (r.pause(), o()), S.type === "SET_TIME" && (r.currentTime = S.value, u()), S.type === "SET_VOLUME" && (r.volume = S.volume, r.muted = S.muted, l()), S.type === "SET_PLAYBACK_RATE" && (r.playbackRate = S.playbackRate, b());
+    S.type === "PLAY" && (r.play(), o()), S.type === "PAUSE" && (r.pause(), o()), S.type === "SET_TIME" && (r.currentTime = S.value, u()), S.type === "SET_VOLUME" && (r.volume = S.volume, r.muted = S.muted, l()), S.type === "SET_PLAYBACK_RATE" && (r.playbackRate = S.playbackRate, E());
   });
-  const o = () => e({ type: "PLAYING" }), a = () => e({ type: "PAUSED" }), s = () => e({ type: "ENDED" }), u = () => e({ type: "TIME_UPDATE", currentTime: r.currentTime }), l = () => e({ type: "VOLUME_UPDATE", muted: r.muted, volume: r.volume }), b = () => e({ type: "PLAYBACK_RATE_UPDATE", playbackRate: r.playbackRate }), d = () => e({ type: "SEEKING", currentTime: r.currentTime }), g = () => e({ type: "DURATION_UPDATE", duration: r.duration });
-  return r.addEventListener("play", o), r.addEventListener("pause", a), r.addEventListener("ended", s), r.addEventListener("timeupdate", u), r.addEventListener("volumechange", l), r.addEventListener("ratechange", b), r.addEventListener("seeking", d), r.addEventListener("durationchange", g), () => {
-    r.removeEventListener("play", o), r.removeEventListener("pause", a), r.removeEventListener("ended", s), r.removeEventListener("timeupdate", u), r.removeEventListener("volumechange", l), r.removeEventListener("ratechange", b), r.removeEventListener("seeking", d), r.removeEventListener("durationchange", g);
+  const o = () => e({ type: "PLAYING" }), a = () => e({ type: "PAUSED" }), s = () => e({ type: "ENDED" }), u = () => e({ type: "TIME_UPDATE", currentTime: r.currentTime }), l = () => e({ type: "VOLUME_UPDATE", muted: r.muted, volume: r.volume }), E = () => e({ type: "PLAYBACK_RATE_UPDATE", playbackRate: r.playbackRate }), d = () => e({ type: "SEEKING", currentTime: r.currentTime }), g = () => e({ type: "DURATION_UPDATE", duration: r.duration });
+  return r.addEventListener("play", o), r.addEventListener("pause", a), r.addEventListener("ended", s), r.addEventListener("timeupdate", u), r.addEventListener("volumechange", l), r.addEventListener("ratechange", E), r.addEventListener("seeking", d), r.addEventListener("durationchange", g), () => {
+    r.removeEventListener("play", o), r.removeEventListener("pause", a), r.removeEventListener("ended", s), r.removeEventListener("timeupdate", u), r.removeEventListener("volumechange", l), r.removeEventListener("ratechange", E), r.removeEventListener("seeking", d), r.removeEventListener("durationchange", g);
   };
-}), lt = (e) => qt((...t) => {
+}), lt = (e) => Xt((...t) => {
   const n = e(...t);
   return () => {
     n.then((r) => r?.());
@@ -1603,7 +1603,7 @@ const On = qt(({ sendBack: e, receive: t, input: n }) => {
   };
   e.addEventListener("updateend", r, { once: !0 }), e.addEventListener("abort", o, { once: !0 }), e.addEventListener("error", a, { once: !0 });
 }, Nn = (e) => {
-  const t = new Xt({ concurrency: 1 });
+  const t = new qt({ concurrency: 1 });
   return {
     appendBuffer: (a) => t.add(
       () => new Promise((s, u) => {
@@ -1619,13 +1619,13 @@ const On = qt(({ sendBack: e, receive: t, input: n }) => {
       e.timestampOffset = a;
     })
   };
-}, Mn = -20, kn = 60, Ln = 30, $n = lt(async ({ sendBack: e, receive: t, input: n, self: r, emit: o }) => {
-  const { videoElement: a, preEvictionTime: s, postEvictionTime: u, bufferTargetTime: l } = n, b = () => console.error(a.error);
-  a.addEventListener("error", b);
+}, Mn = -20, Ln = 60, kn = 30, $n = lt(async ({ sendBack: e, receive: t, input: n, self: r, emit: o }) => {
+  const { videoElement: a, preEvictionTime: s, postEvictionTime: u, bufferTargetTime: l } = n, E = () => console.error(a.error);
+  a.addEventListener("error", E);
   const d = new MediaSource(), g = URL.createObjectURL(d);
   a.src = g;
-  const S = () => a.currentTime + (s ?? Mn), y = () => a.currentTime + (u ?? kn), p = () => a.currentTime + (l ?? Ln);
-  let f;
+  const S = () => a.currentTime + (s ?? Mn), y = () => a.currentTime + (u ?? Ln), p = () => a.currentTime + (l ?? kn);
+  let m;
   const c = await new Promise(
     (D) => d.addEventListener(
       "sourceopen",
@@ -1634,39 +1634,39 @@ const On = qt(({ sendBack: e, receive: t, input: n }) => {
         t((F) => {
           if (!K && F.type === "METADATA") {
             const ee = d.addSourceBuffer(`video/mp4; codecs="${F.info.input.videoMimeType},${F.info.input.audioMimeType}"`);
-            ee.mode = "segments", d.duration = F.info.input.duration, f = F.data, K = !0, D(ee);
+            ee.mode = "segments", d.duration = F.info.input.duration, m = F.data, K = !0, D(ee);
           }
         });
       },
       { once: !0 }
     )
   );
-  if (!f) throw new Error("No header buffer");
-  const { appendBuffer: E, unbufferRange: h, updateTimestampOffset: A } = Nn(c);
-  E(f), t(async (D) => {
-    D.type === "DATA" ? await E(D.data) : D.type === "TIMESTAMP_OFFSET" && await A(D.timestampOffset);
+  if (!m) throw new Error("No header buffer");
+  const { appendBuffer: v, unbufferRange: b, updateTimestampOffset: w } = Nn(c);
+  v(m), t(async (D) => {
+    D.type === "DATA" ? await v(D.data) : D.type === "TIMESTAMP_OFFSET" && await w(D.timestampOffset);
   });
-  const R = async () => {
+  const A = async () => {
     const D = S(), K = y(), F = zt(c);
     for (const { start: ee, end: ue } of F)
-      ee < D && await h(
+      ee < D && await b(
         ee,
         D
-      ), ue > K && await h(
+      ), ue > K && await b(
         K,
         ue
       );
-  }, m = setInterval(async () => {
-    await R();
+  }, f = setInterval(async () => {
+    await A();
     const D = zt(c);
     Math.max(...D.map(({ end: F }) => F)) < p() && e({ type: "NEED_DATA" });
   }, 100), _ = () => e({ type: "SOURCE_OPEN" }), C = () => e({ type: "SOURCE_ENDED" }), W = () => e({ type: "SOURCE_ERROR" });
   return d.addEventListener("sourceopen", _), d.addEventListener("sourceended", C), d.addEventListener("error", W), () => {
-    URL.revokeObjectURL(g), clearInterval(m), a.removeEventListener("error", b), d.removeEventListener("sourceopen", _), d.removeEventListener("sourceended", C), d.removeEventListener("error", W);
+    URL.revokeObjectURL(g), clearInterval(f), a.removeEventListener("error", E), d.removeEventListener("sourceopen", _), d.removeEventListener("sourceended", C), d.removeEventListener("error", W);
   };
 }), In = (e, t) => {
   let n, r, o;
-  const a = (s, u, l) => (b) => {
+  const a = (s, u, l) => (E) => {
     const d = performance.now();
     return setTimeout(() => {
       if (!o) {
@@ -1678,10 +1678,10 @@ const On = qt(({ sendBack: e, receive: t, input: n }) => {
         console.error(p), l(p);
       });
       let S, y;
-      r = new Promise((p, f) => {
-        S = p, y = f;
+      r = new Promise((p, m) => {
+        S = p, y = m;
       }), n = g.then(a(d, S, y)).catch((p) => (console.error(p), a(s, S, y)(p)));
-    }, e - (d - s)), b;
+    }, e - (d - s)), E;
   };
   return (...s) => {
     if (o = s, n)
@@ -1689,27 +1689,27 @@ const On = qt(({ sendBack: e, receive: t, input: n }) => {
     {
       const u = performance.now(), l = (async () => t(...s))();
       o = void 0;
-      let b, d;
+      let E, d;
       return r = new Promise((g, S) => {
-        b = g, d = S;
-      }), n = l.then(a(u, b, d)).catch((g) => (console.error(g), a(u, b, d)(g))), l;
+        E = g, d = S;
+      }), n = l.then(a(u, E, d)).catch((g) => (console.error(g), a(u, E, d)(g))), l;
     }
   };
 }, Un = lt(async ({ sendBack: e, receive: t, input: n, self: r, emit: o }) => {
-  const { remuxerOptions: a } = n, { publicPath: s, workerUrl: u, bufferSize: l, length: b, read: d } = a, g = await Ht({
+  const { remuxerOptions: a } = n, { publicPath: s, workerUrl: u, bufferSize: l, length: E, read: d } = a, g = await Ht({
     publicPath: s,
     workerUrl: u,
     bufferSize: l,
-    length: b,
+    length: E,
     read: d
   }), S = await g.init();
   S.attachments?.length && e({ type: "NEW_ATTACHMENTS", attachments: S.attachments }), S.subtitles?.length && e({ type: "NEW_SUBTITLE_FRAGMENTS", subtitles: S.subtitles }), e({ type: "METADATA", ...S });
   let y = !1, p = [];
-  const f = In(100, async () => {
+  const m = In(100, async () => {
     if (!(p.length || y))
       try {
-        const { data: c, subtitles: E, finished: h } = await g.read();
-        h && (y = !0), E.length && e({ type: "NEW_SUBTITLE_FRAGMENTS", subtitles: E }), e({ type: "DATA", data: c });
+        const { data: c, subtitles: v, finished: b } = await g.read();
+        b && (y = !0), v.length && e({ type: "NEW_SUBTITLE_FRAGMENTS", subtitles: v }), e({ type: "DATA", data: c });
       } catch (c) {
         if (c.message === "Cancelled") return;
         console.error(c);
@@ -1717,19 +1717,19 @@ const On = qt(({ sendBack: e, receive: t, input: n }) => {
   });
   return t(async (c) => {
     if (c.type === "NEED_DATA")
-      f();
+      m();
     else if (c.type === "SEEKING") {
       y = !1;
-      const { currentTime: E } = c, h = { currentTime: E };
-      p = [...p, h];
+      const { currentTime: v } = c, b = { currentTime: v };
+      p = [...p, b];
       try {
-        const { data: A, pts: R } = await g.seek(E).finally(() => {
-          p = p.filter((m) => m !== h);
+        const { data: w, pts: A } = await g.seek(v).finally(() => {
+          p = p.filter((f) => f !== b);
         });
-        e({ type: "TIMESTAMP_OFFSET", timestampOffset: R }), e({ type: "DATA", data: A });
-      } catch (A) {
-        if (A.message === "Cancelled") return;
-        console.error(A);
+        e({ type: "TIMESTAMP_OFFSET", timestampOffset: A }), e({ type: "DATA", data: w });
+      } catch (w) {
+        if (w.message === "Cancelled") return;
+        console.error(w);
       }
     }
   }), () => {
@@ -1802,113 +1802,129 @@ ${l}`),
   };
 }, Yn = lt(async ({ sendBack: e, receive: t, input: n, self: r, emit: o }) => {
   const { publicPath: a, subtitlesRendererOptions: s, videoElement: u, canvasElement: l } = n;
-  let b = [], d;
+  let E = [], d;
   const g = /* @__PURE__ */ new Map();
   let S = [], y;
   return t((p) => {
     if (p.type === "SELECT_SUBTITLE_STREAM") {
       if (y = p.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: p.streamIndex }), !d) return;
       d.freeTrack(), S = [];
-      const f = g.get(y);
-      if (!f)
+      const m = g.get(y);
+      if (!m)
         throw new Error("newSubtitleStreams is undefined");
-      const c = Me(f.header.content), E = { ...c, info: { ...c.info, ScaledBorderAndShadow: "no" } };
-      d.setTrack(_t(E)), d.setCurrentTime(u.paused, u.currentTime, u.playbackRate);
-      for (const h in f.header.parsed.styles) {
-        const A = f.header.parsed.styles.style[Number(h)];
+      const c = Me(m.header.content), v = {
+        ...c,
+        info: {
+          ...c.info,
+          ScaledBorderAndShadow: "no",
+          LayoutResX: "",
+          LayoutResY: ""
+        }
+      }, b = _t(v);
+      d.setTrack(b), d.setCurrentTime(u.paused, u.currentTime, u.playbackRate);
+      for (const w in m.header.parsed.styles) {
+        const A = m.header.parsed.styles.style[Number(w)];
         A && Wt(d, A);
       }
-      for (const h of f?.dialogues ?? [])
-        S.filter((R) => R.type === "dialogue").find(
-          (R) => R.streamIndex === h.streamIndex && R.index === h.index
-        ) || y !== h.streamIndex || (d?.createEvent(h.assEvent), S.push(h));
+      for (const w of m?.dialogues ?? [])
+        S.filter((f) => f.type === "dialogue").find(
+          (f) => f.streamIndex === w.streamIndex && f.index === w.index
+        ) || y !== w.streamIndex || (d?.createEvent(w.assEvent), S.push(w));
     }
     if (p.type === "NEW_SUBTITLE_FRAGMENTS") {
-      const f = p.subtitles.map((c) => {
+      const m = p.subtitles.map((c) => {
         if (c.type === "header") {
-          const E = Dn(c);
-          return g.set(c.streamIndex, { header: E, dialogues: [] }), y === void 0 && (y = c.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: c.streamIndex })), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), E;
+          const v = Dn(c);
+          return g.set(c.streamIndex, { header: v, dialogues: [] }), y === void 0 && (y = c.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: c.streamIndex })), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), v;
         } else {
-          const E = g.get(c.streamIndex)?.header;
-          if (!E)
+          const v = g.get(c.streamIndex)?.header;
+          if (!v)
             throw new Error("SubtitleStream or its header is undefined");
-          const h = jn(E, c);
-          return g.get(c.streamIndex)?.dialogues.push(h), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), h;
+          const b = jn(v, c);
+          return g.get(c.streamIndex)?.dialogues.push(b), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), b;
         }
       });
-      for (const c of f)
+      for (const c of m)
         if (c.type === "dialogue") {
-          if (S.filter((h) => h.type === "dialogue").find(
-            (h) => h.streamIndex === c.streamIndex && h.index === c.index
+          if (S.filter((b) => b.type === "dialogue").find(
+            (b) => b.streamIndex === c.streamIndex && b.index === c.index
           ) || y !== c.streamIndex)
             continue;
           d?.createEvent(c.assEvent), S.push(c);
         } else if (c.type === "header") {
           if (!d) {
-            const E = Me(c.content), h = { ...E, info: { ...E.info, ScaledBorderAndShadow: "no" } };
+            const v = Me(c.content), b = {
+              ...v,
+              info: {
+                ...v.info,
+                ScaledBorderAndShadow: "no",
+                LayoutResX: "",
+                LayoutResY: ""
+              }
+            }, w = _t(b);
             d = new gr({
               video: u,
               canvas: l,
-              subContent: _t(h),
+              subContent: w,
               workerUrl: s.workerUrl,
               modernWasmUrl: s.wasmUrl,
-              fonts: b.filter(Boolean).map(([A, R]) => R),
-              availableFonts: { ...Object.fromEntries(b), "liberation sans": `${a}default.woff2` }
+              fonts: E.filter(Boolean).map(([A, f]) => f),
+              availableFonts: { ...Object.fromEntries(E), "liberation sans": `${a}default.woff2` }
               // fallbackFont: 'liberation sans',
             });
           }
-          for (const E in c.parsed.styles) {
-            const h = c.parsed.styles.style[Number(E)];
-            h && Wt(d, h);
+          for (const v in c.parsed.styles) {
+            const b = c.parsed.styles.style[Number(v)];
+            b && Wt(d, b);
           }
         } else
           throw new Error("Unknown subtitlePart type");
     }
-    p.type === "NEW_ATTACHMENTS" && (b = p.attachments.map((f) => [
-      f.filename,
-      new Uint8Array(f.data)
+    p.type === "NEW_ATTACHMENTS" && (E = p.attachments.map((m) => [
+      m.filename,
+      new Uint8Array(m.data)
     ]));
   }), () => {
     d?.destroy();
   };
 }), zn = lt(async ({ sendBack: e, receive: t, input: n, self: r, emit: o }) => {
-  const { remuxerOptions: a } = n, { publicPath: s, workerUrl: u, bufferSize: l, length: b, read: d } = a;
+  const { remuxerOptions: a } = n, { publicPath: s, workerUrl: u, bufferSize: l, length: E, read: d } = a;
   let g;
-  const S = new Promise((h) => {
-    g = h;
+  const S = new Promise((b) => {
+    g = b;
   });
-  t(async (h) => {
-    await S, h.type === "DOWNLOADED_RANGES_UPDATED" && p.indexes.reduce((m, _) => {
-      const C = m.at(-1);
+  t(async (b) => {
+    await S, b.type === "DOWNLOADED_RANGES_UPDATED" && p.indexes.reduce((f, _) => {
+      const C = f.at(-1);
       if (C && _.timestamp - C.timestamp < 5)
-        return m;
+        return f;
       {
         const W = p.indexes.slice(_.index + 1).find((D) => D.timestamp > _.timestamp + 5);
-        return W ? [...m, { ..._, duration: W.timestamp - _.timestamp }] : [...m, _];
+        return W ? [...f, { ..._, duration: W.timestamp - _.timestamp }] : [...f, _];
       }
-    }, []).filter((m) => {
-      const _ = p.indexes.at(m.index + 1), C = _ ? _.pos : a.length, W = m.pos;
-      return h.downloadedRanges.some(
+    }, []).filter((f) => {
+      const _ = p.indexes.at(f.index + 1), C = _ ? _.pos : a.length, W = f.pos;
+      return b.downloadedRanges.some(
         ({ startByteOffset: K, endByteOffset: F }) => K <= W && C <= F
       );
-    }).sort((m, _) => m.timestamp - _.timestamp).forEach((m) => E(m));
+    }).sort((f, _) => f.timestamp - _.timestamp).forEach((f) => v(f));
   });
   const y = await Ht({
     publicPath: s,
     workerUrl: u,
     bufferSize: l,
-    length: b,
+    length: E,
     read: d
-  }), p = await y.init(), f = new Xt({ concurrency: 1 });
+  }), p = await y.init(), m = new qt({ concurrency: 1 });
   let c = [];
-  const E = (h) => f.add(async () => {
-    if (c.find((D) => D.index.index === h.index)) return;
-    const A = await y.readKeyframe(h.timestamp), R = new Blob([A], { type: "image/png" }), m = URL.createObjectURL(R), _ = p.indexes.at(h.index + 1), C = _ ? _.timestamp - h.timestamp : p.info.input.duration - h.timestamp, W = {
-      blob: R,
-      url: m,
-      timestamp: h.timestamp,
-      duration: h.duration ?? C,
-      index: h
+  const v = (b) => m.add(async () => {
+    if (c.find((D) => D.index.index === b.index)) return;
+    const w = await y.readKeyframe(b.timestamp), A = new Blob([w], { type: "image/png" }), f = URL.createObjectURL(A), _ = p.indexes.at(b.index + 1), C = _ ? _.timestamp - b.timestamp : p.info.input.duration - b.timestamp, W = {
+      blob: A,
+      url: f,
+      timestamp: b.timestamp,
+      duration: b.duration ?? C,
+      index: b
     };
     c.push(W), e({ type: "NEW_THUMBNAIL", thumbnail: W });
   });
@@ -2038,47 +2054,47 @@ ${l}`),
         }
       ],
       on: {
-        PLAY: { actions: X("media", ({ event: e }) => e) },
-        PAUSE: { actions: X("media", ({ event: e }) => e) },
-        SET_TIME: { actions: X("media", ({ event: e }) => e) },
-        SET_PLAYBACK_RATE: { actions: X("media", ({ event: e }) => e) },
+        PLAY: { actions: q("media", ({ event: e }) => e) },
+        PAUSE: { actions: q("media", ({ event: e }) => e) },
+        SET_TIME: { actions: q("media", ({ event: e }) => e) },
+        SET_PLAYBACK_RATE: { actions: q("media", ({ event: e }) => e) },
         PLAYING: { actions: Y({ media: ({ context: e }) => ({ ...e.media, paused: !1 }) }) },
         PAUSED: { actions: Y({ media: ({ context: e }) => ({ ...e.media, paused: !0 }) }) },
         ENDED: { actions: Y({ media: ({ context: e }) => ({ ...e.media, paused: !0 }) }) },
         TIME_UPDATE: { actions: Y({ media: ({ context: e, event: t }) => ({ ...e.media, currentTime: t.currentTime }) }) },
         VOLUME_UPDATE: { actions: Y({ media: ({ context: e, event: t }) => ({ ...e.media, muted: t.muted, volume: t.volume }) }) },
-        SET_VOLUME: { actions: X("media", ({ event: e }) => e) },
+        SET_VOLUME: { actions: q("media", ({ event: e }) => e) },
         PLAYBACK_RATE_UPDATE: { actions: Y({ media: ({ context: e, event: t }) => ({ ...e.media, playbackRate: t.playbackRate }) }) },
         DURATION_UPDATE: { actions: Y({ media: ({ context: e, event: t }) => ({ ...e.media, duration: t.duration }) }) },
-        NEED_DATA: { actions: X("dataSource", ({ event: e }) => e) },
-        METADATA: { actions: X("mediaSource", ({ event: e }) => e) },
-        SEEKING: { actions: X("dataSource", ({ event: e }) => e) },
-        DATA: { actions: X("mediaSource", ({ event: e }) => e) },
-        TIMESTAMP_OFFSET: { actions: X("mediaSource", ({ event: e }) => e) },
+        NEED_DATA: { actions: q("dataSource", ({ event: e }) => e) },
+        METADATA: { actions: q("mediaSource", ({ event: e }) => e) },
+        SEEKING: { actions: q("dataSource", ({ event: e }) => e) },
+        DATA: { actions: q("mediaSource", ({ event: e }) => e) },
+        TIMESTAMP_OFFSET: { actions: q("mediaSource", ({ event: e }) => e) },
         NEW_THUMBNAIL: { actions: [Y({ thumbnails: ({ context: e, event: t }) => [...e.thumbnails, t.thumbnail] })] },
-        DOWNLOADED_RANGES_UPDATED: { actions: X("thumbnails", ({ event: e }) => e) },
+        DOWNLOADED_RANGES_UPDATED: { actions: q("thumbnails", ({ event: e }) => e) },
         NEW_ATTACHMENTS: {
           actions: [
             Y({ attachments: ({ context: e, event: t }) => [...e.attachments, ...t.attachments] }),
-            X("subtitles", ({ event: e }) => e)
+            q("subtitles", ({ event: e }) => e)
           ]
         },
         NEW_SUBTITLE_FRAGMENTS: {
           actions: [
             Y({ subtitleFragments: ({ context: e, event: t }) => [...e.subtitleFragments, ...t.subtitles] }),
-            X("subtitles", ({ event: e }) => e)
+            q("subtitles", ({ event: e }) => e)
             // emit(({ event }) => ({ type: 'NEW_SUBTITLE_FRAGMENTS', subtitles: event.subtitles }))
           ]
         },
         SUBTITLE_STREAMS_UPDATED: {
           actions: [
             Y({ subtitleStreams: ({ event: e }) => e.subtitlesStreams }),
-            X("subtitles", ({ event: e }) => e)
+            q("subtitles", ({ event: e }) => e)
           ]
         },
         SELECT_SUBTITLE_STREAM: {
           actions: [
-            X("subtitles", ({ event: e }) => e)
+            q("subtitles", ({ event: e }) => e)
           ]
         },
         SELECTED_SUBTITLE_STREAM_UPDATED: {
@@ -2123,7 +2139,7 @@ ${l}`),
       type: "SET_CANVAS_ELEMENT",
       canvasElement: t
     });
-  }, [t]), /* @__PURE__ */ v(cr, { children: /* @__PURE__ */ v("canvas", { ref: r, css: Vn }) });
+  }, [t]), /* @__PURE__ */ h(cr, { children: /* @__PURE__ */ h("canvas", { ref: r, css: Vn }) });
 }, ur = 1e-4, bt = 1, lr = 2, dr = (e) => {
   const t = Math.max(ur, Math.min(bt, e));
   return Math.pow(t, lr);
@@ -2196,7 +2212,7 @@ ${l}`),
   size: l = "md"
   /* md */
 }) => /* @__PURE__ */ I(cr, { children: [
-  /* @__PURE__ */ v(
+  /* @__PURE__ */ h(
     "div",
     {
       "data-tooltip-id": e,
@@ -2208,7 +2224,7 @@ ${l}`),
       children: n
     }
   ),
-  !u && /* @__PURE__ */ v(
+  !u && /* @__PURE__ */ h(
     Pr,
     {
       css: Bn(l),
@@ -2220,14 +2236,14 @@ ${l}`),
 ] }), Gn = ({ ref: e, defaultValue: t }) => {
   const [n, r] = Z(t), [o, a] = Z(!1), s = (u) => {
     if (a(!0), !e.current) return;
-    const { clientX: l } = u, { left: b, right: d } = e.current.getBoundingClientRect();
-    r(Math.min(Math.max((l - b) / (d - b), 0), 1));
+    const { clientX: l } = u, { left: E, right: d } = e.current.getBoundingClientRect();
+    r(Math.min(Math.max((l - E) / (d - E), 0), 1));
   };
   return z(() => {
     if (!o) return;
-    const u = () => a(!1), l = (b) => {
+    const u = () => a(!1), l = (E) => {
       if (!e.current) return;
-      const { clientX: d } = b, { left: g, right: S } = e.current.getBoundingClientRect();
+      const { clientX: d } = E, { left: g, right: S } = e.current.getBoundingClientRect();
       r(Math.min(Math.max((d - g) / (S - g), 0), 1));
     };
     return document.addEventListener("mousemove", l), document.addEventListener("mouseup", u), () => {
@@ -2239,7 +2255,7 @@ ${l}`),
     scrub: s,
     setValue: r
   };
-}, qn = Q`
+}, Xn = Q`
   position: relative;
   height: .4rem;
 
@@ -2350,48 +2366,48 @@ ${l}`),
       object-fit: cover;
     }
   }
-`, Xn = () => {
-  const e = $.useActorRef(), t = $.useSelector((c) => c.context.media.currentTime), n = $.useSelector((c) => c.context.media.duration), r = $.useSelector((c) => c.context.thumbnails), o = Ue(je), a = Ne(null), { scrub: s, value: u } = Gn({ ref: a }), [l, b] = Z(void 0), d = (c) => {
-    const h = c.nativeEvent.offsetX / c.currentTarget.offsetWidth * (n ?? 0);
-    b(h);
+`, qn = () => {
+  const e = $.useActorRef(), t = $.useSelector((c) => c.context.media.currentTime), n = $.useSelector((c) => c.context.media.duration), r = $.useSelector((c) => c.context.thumbnails), o = Ue(je), a = Ne(null), { scrub: s, value: u } = Gn({ ref: a }), [l, E] = Z(void 0), d = (c) => {
+    const b = c.nativeEvent.offsetX / c.currentTarget.offsetWidth * (n ?? 0);
+    E(b);
   }, g = () => {
-    a.current && b(void 0);
+    a.current && E(void 0);
   }, S = pe(
-    () => o.downloadedRanges?.map((c, E) => {
+    () => o.downloadedRanges?.map((c, v) => {
       if ("startByteOffset" in c && "endByteOffset" in c && o.size) {
-        const h = c.startByteOffset / o.size, R = c.endByteOffset / o.size - h, m = h * 100;
-        return /* @__PURE__ */ v("div", { className: "loaded-part", style: { transform: `scaleX(${R})`, marginLeft: `${m}%` } }, E);
+        const b = c.startByteOffset / o.size, A = c.endByteOffset / o.size - b, f = b * 100;
+        return /* @__PURE__ */ h("div", { className: "loaded-part", style: { transform: `scaleX(${A})`, marginLeft: `${f}%` } }, v);
       } else
         return null;
     }) ?? [],
-    [o.downloadedRanges?.map(({ startByteOffset: c, endByteOffset: E }) => `${c}/${E}`).join(",")]
+    [o.downloadedRanges?.map(({ startByteOffset: c, endByteOffset: v }) => `${c}/${v}`).join(",")]
   ), y = pe(() => {
     if (!l || l < 0) return;
-    const c = Math.floor(l / 3600), E = Math.floor((l - c * 3600) / 60), h = Math.floor(l - c * 3600 - E * 60);
-    return `${c > 0 ? `${c}:` : ""}${E < 10 ? "0" : ""}${E}:${h < 10 ? "0" : ""}${h}`;
+    const c = Math.floor(l / 3600), v = Math.floor((l - c * 3600) / 60), b = Math.floor(l - c * 3600 - v * 60);
+    return `${c > 0 ? `${c}:` : ""}${v < 10 ? "0" : ""}${v}:${b < 10 ? "0" : ""}${b}`;
   }, [l]);
   z(() => {
     if (!e || u === void 0 || !n) return;
     const c = u * n;
     e.send({ type: "SET_TIME", value: c });
   }, [e, u, n]);
-  const p = pe(() => typeof n != "number" || typeof t != "number" ? 0 : 1 / ((n ?? 0) / (t ?? 0)), [n, t]), f = pe(() => {
+  const p = pe(() => typeof n != "number" || typeof t != "number" ? 0 : 1 / ((n ?? 0) / (t ?? 0)), [n, t]), m = pe(() => {
     if (!(!r.length || !l))
       return r.find(
-        ({ timestamp: c, duration: E }) => c <= l && l <= c + E
+        ({ timestamp: c, duration: v }) => c <= l && l <= c + v
       );
   }, [r.length, l]);
   return /* @__PURE__ */ I(
     "div",
     {
-      css: qn,
+      css: Xn,
       ref: a,
       className: "progress-bar",
       onMouseMove: d,
       onMouseOut: g,
       children: [
-        /* @__PURE__ */ v("div", { className: "background-bar" }),
-        l ? /* @__PURE__ */ v(
+        /* @__PURE__ */ h("div", { className: "background-bar" }),
+        l ? /* @__PURE__ */ h(
           "div",
           {
             className: "cursor-time",
@@ -2399,19 +2415,19 @@ ${l}`),
             children: y
           }
         ) : void 0,
-        /* @__PURE__ */ v("div", { className: "progress" }),
-        /* @__PURE__ */ v("div", { className: "loaded", children: S }),
-        /* @__PURE__ */ v("div", { className: "hover" }),
-        /* @__PURE__ */ v("div", { className: "play-container", children: /* @__PURE__ */ v("div", { className: "play", style: { transform: `scaleX(${p})` } }) }),
-        /* @__PURE__ */ v("div", { className: "chapters" }),
-        /* @__PURE__ */ v("div", { className: "scrubber" }),
-        /* @__PURE__ */ v("div", { className: "padding", onMouseDown: s }),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ h("div", { className: "progress" }),
+        /* @__PURE__ */ h("div", { className: "loaded", children: S }),
+        /* @__PURE__ */ h("div", { className: "hover" }),
+        /* @__PURE__ */ h("div", { className: "play-container", children: /* @__PURE__ */ h("div", { className: "play", style: { transform: `scaleX(${p})` } }) }),
+        /* @__PURE__ */ h("div", { className: "chapters" }),
+        /* @__PURE__ */ h("div", { className: "scrubber" }),
+        /* @__PURE__ */ h("div", { className: "padding", onMouseDown: s }),
+        /* @__PURE__ */ h(
           "div",
           {
             className: "thumbnail",
             style: { left: `clamp(12.5rem, ${1 / ((n ?? 0) / (l ?? 1)) * 100}%, calc(100% - 12.5rem))` },
-            children: f ? /* @__PURE__ */ v("img", { src: f.url }) : void 0
+            children: m ? /* @__PURE__ */ h("img", { src: m.url }) : void 0
           }
         )
       ]
@@ -2486,7 +2502,7 @@ position: relative;
   const e = $.useActorRef(), t = $.useSelector((p) => p.context.media.playbackRate), n = $.useSelector((p) => p.context.subtitleStreams), r = $.useSelector((p) => p.context.selectedSubtitleStreamIndex), [o, a] = Z(!1), [s, u] = Z(
     0
     /* Default */
-  ), l = Ne(null), b = () => {
+  ), l = Ne(null), E = () => {
     a(!o), u(
       0
       /* Default */
@@ -2498,8 +2514,8 @@ position: relative;
     );
   };
   z(() => {
-    const p = (f) => {
-      o && l.current && !l.current.contains(f.target) && b();
+    const p = (m) => {
+      o && l.current && !l.current.contains(m.target) && E();
     };
     return document.addEventListener("mousedown", p), () => document.removeEventListener("mousedown", p);
   }, [o]);
@@ -2507,26 +2523,26 @@ position: relative;
     () => n.map(({ header: p }) => ({ streamIndex: p.streamIndex, language: p.parsed.info.Title })),
     [n.length]
   ), S = (p) => () => {
-    e.send({ type: "SELECT_SUBTITLE_STREAM", streamIndex: p.streamIndex }), b();
+    e.send({ type: "SELECT_SUBTITLE_STREAM", streamIndex: p.streamIndex }), E();
   }, y = (p) => () => {
     u(p);
   };
   return /* @__PURE__ */ I("div", { css: Jn, ref: l, children: [
-    /* @__PURE__ */ v(
+    /* @__PURE__ */ h(
       ge,
       {
         id: "settings",
         disabled: o,
-        text: /* @__PURE__ */ v(
+        text: /* @__PURE__ */ h(
           "button",
           {
             className: "settings",
             type: "button",
-            onClick: b,
-            children: /* @__PURE__ */ v(yr, {})
+            onClick: E,
+            children: /* @__PURE__ */ h(yr, {})
           }
         ),
-        toolTipText: /* @__PURE__ */ v("span", { children: "Settings" })
+        toolTipText: /* @__PURE__ */ h("span", { children: "Settings" })
       }
     ),
     o && s === 0 && /* @__PURE__ */ I("div", { className: "popover", children: [
@@ -2534,31 +2550,31 @@ position: relative;
         2
         /* Advanced */
       ), children: [
-        /* @__PURE__ */ v("span", { children: "Advanced" }),
-        /* @__PURE__ */ v("div", { children: /* @__PURE__ */ v(Ke, {}) })
+        /* @__PURE__ */ h("span", { children: "Advanced" }),
+        /* @__PURE__ */ h("div", { children: /* @__PURE__ */ h(Ke, {}) })
       ] }),
       /* @__PURE__ */ I("div", { onClick: y(
         3
         /* SelectNewSources */
       ), children: [
-        /* @__PURE__ */ v("div", { children: "Select new sources" }),
-        /* @__PURE__ */ v("div", { children: /* @__PURE__ */ v(Ke, {}) })
+        /* @__PURE__ */ h("div", { children: "Select new sources" }),
+        /* @__PURE__ */ h("div", { children: /* @__PURE__ */ h(Ke, {}) })
       ] }),
       /* @__PURE__ */ I("div", { onClick: y(
         4
         /* Subtitles */
       ), children: [
-        /* @__PURE__ */ v("div", { children: "Subtitles" }),
-        /* @__PURE__ */ v("div", { children: /* @__PURE__ */ v(Ke, {}) })
+        /* @__PURE__ */ h("div", { children: "Subtitles" }),
+        /* @__PURE__ */ h("div", { children: /* @__PURE__ */ h(Ke, {}) })
       ] }),
       /* @__PURE__ */ I("div", { onClick: y(
         1
         /* PlaybackRate */
       ), children: [
-        /* @__PURE__ */ v("div", { children: "Playback speed" }),
+        /* @__PURE__ */ h("div", { children: "Playback speed" }),
         /* @__PURE__ */ I("div", { children: [
-          /* @__PURE__ */ v("span", { className: "secondary", children: t === 1 ? "(Default)" : t.toFixed(2) }),
-          /* @__PURE__ */ v(Ke, {})
+          /* @__PURE__ */ h("span", { className: "secondary", children: t === 1 ? "(Default)" : t.toFixed(2) }),
+          /* @__PURE__ */ h(Ke, {})
         ] })
       ] })
     ] }),
@@ -2567,13 +2583,13 @@ position: relative;
         0
         /* Default */
       ), children: [
-        /* @__PURE__ */ v("div", { children: "Back" }),
-        /* @__PURE__ */ v("div", {})
+        /* @__PURE__ */ h("div", { children: "Back" }),
+        /* @__PURE__ */ h("div", {})
       ] }),
       /* @__PURE__ */ I("div", { children: [
-        /* @__PURE__ */ v("div", { children: "Playback speed" }),
+        /* @__PURE__ */ h("div", { children: "Playback speed" }),
         /* @__PURE__ */ I("div", { children: [
-          /* @__PURE__ */ v(
+          /* @__PURE__ */ h(
             "button",
             {
               type: "button",
@@ -2581,7 +2597,7 @@ position: relative;
               children: "0.5x"
             }
           ),
-          /* @__PURE__ */ v(
+          /* @__PURE__ */ h(
             "button",
             {
               type: "button",
@@ -2589,7 +2605,7 @@ position: relative;
               children: "1x"
             }
           ),
-          /* @__PURE__ */ v(
+          /* @__PURE__ */ h(
             "button",
             {
               type: "button",
@@ -2597,7 +2613,7 @@ position: relative;
               children: "1.5x"
             }
           ),
-          /* @__PURE__ */ v(
+          /* @__PURE__ */ h(
             "button",
             {
               type: "button",
@@ -2608,19 +2624,19 @@ position: relative;
         ] })
       ] })
     ] }),
-    o && s === 2 && /* @__PURE__ */ v("div", { className: "popover", children: /* @__PURE__ */ I("div", { onClick: y(
+    o && s === 2 && /* @__PURE__ */ h("div", { className: "popover", children: /* @__PURE__ */ I("div", { onClick: y(
       0
       /* Default */
     ), children: [
-      /* @__PURE__ */ v("div", { children: "Back" }),
-      /* @__PURE__ */ v("div", {})
+      /* @__PURE__ */ h("div", { children: "Back" }),
+      /* @__PURE__ */ h("div", {})
     ] }) }),
-    o && s === 3 && /* @__PURE__ */ v("div", { className: "popover", children: /* @__PURE__ */ I("div", { onClick: y(
+    o && s === 3 && /* @__PURE__ */ h("div", { className: "popover", children: /* @__PURE__ */ I("div", { onClick: y(
       0
       /* Default */
     ), children: [
-      /* @__PURE__ */ v("div", { children: "Back" }),
-      /* @__PURE__ */ v("div", {})
+      /* @__PURE__ */ h("div", { children: "Back" }),
+      /* @__PURE__ */ h("div", {})
     ] }) }),
     o && s === 4 && /* @__PURE__ */ I("div", { className: "popover", children: [
       g.map((p) => /* @__PURE__ */ I(
@@ -2628,8 +2644,8 @@ position: relative;
         {
           onClick: S(p),
           children: [
-            /* @__PURE__ */ v("div", { children: p.language }),
-            /* @__PURE__ */ v("div", { children: r === p.streamIndex ? "✓" : "" })
+            /* @__PURE__ */ h("div", { children: p.language }),
+            /* @__PURE__ */ h("div", { children: r === p.streamIndex ? "✓" : "" })
           ]
         },
         p.streamIndex
@@ -2638,8 +2654,8 @@ position: relative;
         0
         /* Default */
       ), children: [
-        /* @__PURE__ */ v("div", { children: "Back" }),
-        /* @__PURE__ */ v("div", {})
+        /* @__PURE__ */ h("div", { children: "Back" }),
+        /* @__PURE__ */ h("div", {})
       ] })
     ] })
   ] });
@@ -2679,47 +2695,47 @@ position: relative;
 `, to = ({ value: e, onChange: t }) => {
   const n = $.useSelector((c) => c.context.media.volume), r = $.useSelector((c) => c.context.media.muted), o = Ne(null), [a, s] = Z(!1), u = (c) => {
     if (!o.current) return e;
-    const E = o.current.getBoundingClientRect(), h = c - E.left;
-    return Math.max(0, Math.min(h, E.width)) / E.width;
+    const v = o.current.getBoundingClientRect(), b = c - v.left;
+    return Math.max(0, Math.min(b, v.width)) / v.width;
   }, l = (c) => {
     s(!0);
-    const E = u(c.clientX);
-    t(E);
-  }, b = (c) => {
+    const v = u(c.clientX);
+    t(v);
+  }, E = (c) => {
     if (!a) return;
-    const E = u(c.clientX);
-    t(E);
+    const v = u(c.clientX);
+    t(v);
   }, d = () => {
     s(!1);
   }, g = (c) => {
     c.preventDefault();
-    const E = 0.05;
-    let h = e;
-    c.deltaY < 0 ? h = Math.min(1, h + E) : h = Math.max(0, h - E), t(h);
+    const v = 0.05;
+    let b = e;
+    c.deltaY < 0 ? b = Math.min(1, b + v) : b = Math.max(0, b - v), t(b);
   };
-  z(() => (window.addEventListener("mousemove", b), window.addEventListener("mouseup", d), () => {
-    window.removeEventListener("mousemove", b), window.removeEventListener("mouseup", d);
+  z(() => (window.addEventListener("mousemove", E), window.addEventListener("mouseup", d), () => {
+    window.removeEventListener("mousemove", E), window.removeEventListener("mouseup", d);
   }), [a]), z(() => {
     const c = o.current;
     return c && c.addEventListener("wheel", g, { passive: !1 }), () => {
       c && c.removeEventListener("wheel", g);
     };
   }, [e]);
-  const S = e * 100, y = "#fff", p = "#3A3A3A", f = pe(
+  const S = e * 100, y = "#fff", p = "#3A3A3A", m = pe(
     () => Math.round(r ? 0 : xt(n) * 100),
     [n]
   );
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ h(
     ge,
     {
       id: "volume-slider",
-      text: /* @__PURE__ */ v(
+      text: /* @__PURE__ */ h(
         "div",
         {
           ref: o,
           css: eo,
           onMouseDown: l,
-          children: /* @__PURE__ */ v(
+          children: /* @__PURE__ */ h(
             "div",
             {
               style: {
@@ -2728,7 +2744,7 @@ position: relative;
                 ${p} ${S}% 100%
               )`
               },
-              children: /* @__PURE__ */ v(
+              children: /* @__PURE__ */ h(
                 "div",
                 {
                   className: "volume-handle",
@@ -2742,7 +2758,7 @@ position: relative;
         }
       ),
       toolTipText: /* @__PURE__ */ I("div", { className: "volume-value", children: [
-        f,
+        m,
         "%"
       ] })
     }
@@ -2793,24 +2809,24 @@ position: relative;
     volume: dr(s)
   });
   return /* @__PURE__ */ I("div", { css: ro, children: [
-    /* @__PURE__ */ v(
+    /* @__PURE__ */ h(
       ge,
       {
         id: "sound",
-        text: /* @__PURE__ */ v(
+        text: /* @__PURE__ */ h(
           "button",
           {
             className: "sound",
             type: "button",
             onClick: () => a(o, !r),
             ref: e,
-            children: r || n === 0 ? /* @__PURE__ */ v(Sr, { size: 18, color: "#fff" }) : n <= 0.5 ? /* @__PURE__ */ v(xr, { size: 18, color: "#fff" }) : /* @__PURE__ */ v(Tr, { size: 18, color: "#fff" })
+            children: r || n === 0 ? /* @__PURE__ */ h(Sr, { size: 18, color: "#fff" }) : n <= 0.5 ? /* @__PURE__ */ h(xr, { size: 18, color: "#fff" }) : /* @__PURE__ */ h(Tr, { size: 18, color: "#fff" })
           }
         ),
-        toolTipText: /* @__PURE__ */ v("span", { children: r ? "Unmute (m)" : "Mute (m)" })
+        toolTipText: /* @__PURE__ */ h("span", { children: r ? "Unmute (m)" : "Mute (m)" })
       }
     ),
-    /* @__PURE__ */ v("div", { className: "volume-slider-container", children: /* @__PURE__ */ v("div", { className: "volume-slider-background", children: /* @__PURE__ */ v(
+    /* @__PURE__ */ h("div", { className: "volume-slider-container", children: /* @__PURE__ */ h("div", { className: "volume-slider-background", children: /* @__PURE__ */ h(
       to,
       {
         value: r ? 0 : o,
@@ -2933,29 +2949,29 @@ position: relative;
 `, io = ({
   containerRef: e
 }) => {
-  const t = $.useActorRef(), n = Ue(je), r = $.useSelector((f) => f.context.media.paused), o = $.useSelector((f) => f.context.media.volume), a = $.useSelector((f) => f.context.media.muted), s = $.useSelector((f) => f.context.media.currentTime), u = $.useSelector((f) => f.context.media.duration), [l, b] = Z(), [d, g] = Z(!1);
+  const t = $.useActorRef(), n = Ue(je), r = $.useSelector((m) => m.context.media.paused), o = $.useSelector((m) => m.context.media.volume), a = $.useSelector((m) => m.context.media.muted), s = $.useSelector((m) => m.context.media.currentTime), u = $.useSelector((m) => m.context.media.duration), [l, E] = Z(), [d, g] = Z(!1);
   z(() => {
-    const f = () => {
+    const m = () => {
       g(!!document.fullscreenElement);
     };
-    return document.addEventListener("fullscreenchange", f), () => {
-      document.removeEventListener("fullscreenchange", f);
+    return document.addEventListener("fullscreenchange", m), () => {
+      document.removeEventListener("fullscreenchange", m);
     };
   }, []);
   const S = () => {
     document.fullscreenElement ? document.exitFullscreen() : e.current && e.current.requestFullscreen();
-  }, y = ot(({ direction: f, stepSize: c }) => {
+  }, y = ot(({ direction: m, stepSize: c }) => {
     if (!t) return;
-    const E = xt(o), h = f === "up" ? c : -c, A = Math.max(0, Math.min(1, E + h)), R = dr(A);
+    const v = xt(o), b = m === "up" ? c : -c, w = Math.max(0, Math.min(1, v + b)), A = dr(w);
     t.send({
       type: "SET_VOLUME",
       muted: a,
-      volume: R
+      volume: A
     });
   }, [t.id, a, o]);
   z(() => {
-    const f = (c) => {
-      let E = !0;
+    const m = (c) => {
+      let v = !0;
       if (c.key === "f") S();
       else if (c.key === "k") nt(t, r, u, s);
       else if (c.key === " ") nt(t, r, u, s);
@@ -2968,73 +2984,73 @@ position: relative;
       else if (c.key === "ArrowRight") {
         if (!u) return;
         s + 5 >= u ? t.send({ type: "SET_TIME", value: u }) : t.send({ type: "SET_TIME", value: s + 5 });
-      } else c.key === "ArrowLeft" ? s - 5 < 0 ? t.send({ type: "SET_TIME", value: 0 }) : t.send({ type: "SET_TIME", value: s - 5 }) : E = !1;
-      E && c.preventDefault();
+      } else c.key === "ArrowLeft" ? s - 5 < 0 ? t.send({ type: "SET_TIME", value: 0 }) : t.send({ type: "SET_TIME", value: s - 5 }) : v = !1;
+      v && c.preventDefault();
     };
-    return window.addEventListener("keydown", f), () => window.removeEventListener("keydown", f);
+    return window.addEventListener("keydown", m), () => window.removeEventListener("keydown", m);
   }, [t, o, a, r, s, u]);
-  const p = ot((f) => {
-    f.preventDefault(), f.deltaY < 0 ? y({ direction: "up", stepSize: 0.05 }) : y({ direction: "down", stepSize: 0.05 });
+  const p = ot((m) => {
+    m.preventDefault(), m.deltaY < 0 ? y({ direction: "up", stepSize: 0.05 }) : y({ direction: "down", stepSize: 0.05 });
   }, [y]);
   return z(() => {
     if (l)
       return l.addEventListener("wheel", p, { passive: !1 }), () => l.removeEventListener("wheel", p);
   }, [l, y]), /* @__PURE__ */ I("div", { css: oo, style: { ...n.hideUI ? { opacity: "0", pointerEvents: "none" } : {} }, children: [
-    /* @__PURE__ */ v(Xn, {}),
+    /* @__PURE__ */ h(qn, {}),
     /* @__PURE__ */ I("div", { className: "actions", children: [
       /* @__PURE__ */ I("div", { className: "left", children: [
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ h(
           ge,
           {
             id: "play",
             tooltipPlace: "top-start",
-            text: /* @__PURE__ */ v(
+            text: /* @__PURE__ */ h(
               "button",
               {
                 className: "play",
                 type: "button",
                 onClick: () => nt(t, r, u, s),
-                children: u === s ? /* @__PURE__ */ v(wr, {}) : r ? /* @__PURE__ */ v(Ar, {}) : /* @__PURE__ */ v(Rr, {})
+                children: u === s ? /* @__PURE__ */ h(wr, {}) : r ? /* @__PURE__ */ h(Rr, {}) : /* @__PURE__ */ h(Ar, {})
               }
             ),
-            toolTipText: /* @__PURE__ */ v("span", { children: u === s ? "Replay (k)" : r ? "Play (k)" : "Pause (k)" })
+            toolTipText: /* @__PURE__ */ h("span", { children: u === s ? "Replay (k)" : r ? "Play (k)" : "Pause (k)" })
           }
         ),
-        /* @__PURE__ */ v(no, { ref: b }),
-        /* @__PURE__ */ v("div", { className: "time", children: Hn(s, u) })
+        /* @__PURE__ */ h(no, { ref: E }),
+        /* @__PURE__ */ h("div", { className: "time", children: Hn(s, u) })
       ] }),
       /* @__PURE__ */ I("div", { className: "right", children: [
-        /* @__PURE__ */ v(Zn, {}),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ h(Zn, {}),
+        /* @__PURE__ */ h(
           ge,
           {
             id: "picture-in-picture",
-            text: /* @__PURE__ */ v(
+            text: /* @__PURE__ */ h(
               "button",
               {
                 className: "picture-in-picture",
                 type: "button",
-                children: /* @__PURE__ */ v("img", { src: Kn })
+                children: /* @__PURE__ */ h("img", { src: Kn })
               }
             ),
-            toolTipText: /* @__PURE__ */ v("span", { children: "Picture in picture" })
+            toolTipText: /* @__PURE__ */ h("span", { children: "Picture in picture" })
           }
         ),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ h(
           ge,
           {
             id: "full-screen",
             tooltipPlace: "top-end",
-            text: /* @__PURE__ */ v(
+            text: /* @__PURE__ */ h(
               "button",
               {
                 className: "full-screen",
                 type: "button",
                 onClick: S,
-                children: d ? /* @__PURE__ */ v(_r, {}) : /* @__PURE__ */ v(Cr, {})
+                children: d ? /* @__PURE__ */ h(_r, {}) : /* @__PURE__ */ h(Cr, {})
               }
             ),
-            toolTipText: /* @__PURE__ */ v("span", { children: d ? "Exit full screen (f)" : "Full screen (f)" })
+            toolTipText: /* @__PURE__ */ h("span", { children: d ? "Exit full screen (f)" : "Full screen (f)" })
           }
         )
       ] })
@@ -3046,6 +3062,8 @@ position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
+  height: 100%;
+  width: 100%;
 
   & > div:not(:last-of-type) {
     position: absolute;
@@ -3064,6 +3082,7 @@ position: relative;
     height: 100%;
     width: 100%;
     background-color: black;
+    object-fit: contain;
   }
 
   &.hide {
@@ -3088,9 +3107,9 @@ position: relative;
       },
       className: n.hideUI ? "hide" : "",
       children: [
-        /* @__PURE__ */ v(Wn, {}),
-        /* @__PURE__ */ v(io, { containerRef: u }),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ h(Wn, {}),
+        /* @__PURE__ */ h(io, { containerRef: u }),
+        /* @__PURE__ */ h(
           "div",
           {
             className: "video",
@@ -3106,9 +3125,10 @@ position: relative;
   justify-content: center;
   background-color: #111;
   height: 100%;
+  width: 100%;
   overflow: hidden;
 `, lo = ({ options: e, videoElement: t, children: n }) => {
-  const r = Ue(je), o = $.useActorRef(), a = $.useSelector((f) => f.value), s = $.useSelector((f) => f.context.media.volume), u = $.useSelector((f) => f.context.media.muted), l = $.useSelector((f) => f.context.isReady), [b, d] = Bt("mediaVolume", "1"), [g, S] = Bt("mediaMute", "false"), [y, p] = Z(!0);
+  const r = Ue(je), o = $.useActorRef(), a = $.useSelector((m) => m.value), s = $.useSelector((m) => m.context.media.volume), u = $.useSelector((m) => m.context.media.muted), l = $.useSelector((m) => m.context.isReady), [E, d] = Bt("mediaVolume", "1"), [g, S] = Bt("mediaMute", "false"), [y, p] = Z(!0);
   return z(
     () => o.send({
       type: "MEDIA_SOURCE_OPTIONS",
@@ -3125,28 +3145,28 @@ position: relative;
     [
       o,
       l,
-      (r.downloadedRanges?.map((f) => `${f.startByteOffset}-${f.endByteOffset}`) ?? []).join(",")
+      (r.downloadedRanges?.map((m) => `${m.startByteOffset}-${m.endByteOffset}`) ?? []).join(",")
     ]
   ), z(() => {
-    const { size: f, read: c, publicPath: E, libavWorkerUrl: h, jassubWasmUrl: A } = e;
-    !c || !f || !E || !h || !A || o.send({
+    const { size: m, read: c, publicPath: v, libavWorkerUrl: b, jassubWasmUrl: w } = e;
+    !c || !m || !v || !b || !w || o.send({
       type: "REMUXER_OPTIONS",
       remuxerOptions: {
-        publicPath: E,
-        workerUrl: h,
+        publicPath: v,
+        workerUrl: b,
         bufferSize: e.bufferSize ?? co,
-        length: f,
+        length: m,
         read: c
       }
     });
   }, [e.read, e.size, e.publicPath, e.libavWorkerUrl, e.bufferSize]), z(() => {
-    const { jassubWorkerUrl: f, jassubWasmUrl: c, jassubModernWasmUrl: E } = e;
-    !f || !c || !E || o.send({
+    const { jassubWorkerUrl: m, jassubWasmUrl: c, jassubModernWasmUrl: v } = e;
+    !m || !c || !v || o.send({
       type: "SUBTITLES_RENDERER_OPTIONS",
       subtitlesRendererOptions: {
-        workerUrl: f,
+        workerUrl: m,
         wasmUrl: c,
-        modernWasmUrl: E
+        modernWasmUrl: v
       }
     });
   }, [e.publicPath, e.jassubWorkerUrl, e.jassubWasmUrl]), z(() => {
@@ -3158,14 +3178,14 @@ position: relative;
     l && (y ? (o.send({
       type: "SET_VOLUME",
       muted: g === "true",
-      volume: isNaN(Number(b)) ? 1 : Number(b)
+      volume: isNaN(Number(E)) ? 1 : Number(E)
     }), p(!1)) : (d(s.toString()), S(u ? "true" : "false")));
   }, [l, s, u, y]), z(() => {
     if (a === "OK")
       return () => {
         o.send({ type: "DESTROY" });
       };
-  }, [a]), /* @__PURE__ */ v("div", { css: uo, children: /* @__PURE__ */ v(so, { children: n }) });
+  }, [a]), /* @__PURE__ */ h("div", { css: uo, children: /* @__PURE__ */ h(so, { children: n }) });
 }, xo = ({ ref: e, ...t }) => {
   const n = (l) => o({ ...l, update: n }), [r, o] = Z({ update: n }), [a, s] = Z(), u = ot((l) => {
     typeof e == "function" ? e(l) : e && "current" in e && (e.current = l), s(l ?? void 0);
@@ -3178,7 +3198,7 @@ position: relative;
       size: t?.size,
       downloadedRanges: t?.downloadedRanges
     }));
-  }, [a, t?.title, t?.size, t?.downloadedRanges]), /* @__PURE__ */ v(je.Provider, { value: r, children: /* @__PURE__ */ v($.Provider, { children: /* @__PURE__ */ v(lo, { options: t, videoElement: a, children: /* @__PURE__ */ v("video", { ref: u, controls: !1 }) }) }) });
+  }, [a, t?.title, t?.size, t?.downloadedRanges]), /* @__PURE__ */ h(je.Provider, { value: r, children: /* @__PURE__ */ h($.Provider, { children: /* @__PURE__ */ h(lo, { options: t, videoElement: a, children: /* @__PURE__ */ h("video", { ref: u, controls: !1 }) }) }) });
 };
 export {
   lo as FKNVideoRoot,