@banou/media-player 0.5.1 → 0.6.0

package/build/index.js

@@ -1,15 +1,15 @@
 import * as ce from "react";
-import mr, { forwardRef as pr, useContext as Se, createContext as hr, useState as Q, useEffect as z, useCallback as ot, useRef as Ie, useMemo as pe } from "react";
+import pr, { forwardRef as hr, useContext as Te, createContext as vr, useState as J, useEffect as j, useCallback as ot, useRef as xe, useMemo as pe } from "react";
 import { css as K } from "@emotion/react";
-import { createActorContext as vr } from "@xstate/react";
-import { fromCallback as Xt, setup as Er, enqueueActions as gr, assign as Y, sendTo as H } from "xstate";
+import { createActorContext as Er } from "@xstate/react";
+import { fromCallback as Ht, setup as gr, enqueueActions as br, assign as z, sendTo as G } from "xstate";
 import qt from "p-queue";
-import { makeRemuxer as Ht } from "libav-wasm";
-import br from "jassub";
-import { parse as Le, stringify as _t } from "ass-compiler";
-import { Settings as yr, ChevronRight as Ke, VolumeX as xr, Volume1 as Sr, 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: {} }, Oe = {};
+import { makeRemuxer as Kt } from "libav-wasm";
+import yr from "jassub";
+import { parse as Le, stringify as Pt } from "ass-compiler";
+import { Settings as xr, ChevronRight as pt, ChevronLeft as Ke, VolumeX as Sr, Volume1 as Tr, Volume2 as wr, RotateCcw as Rr, Play as Ar, Pause as _r, Minimize as Cr, Maximize as Pr } from "react-feather";
+import { Tooltip as Nr } from "react-tooltip";
+var Je = { exports: {} }, Me = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -19,10 +19,10 @@ var Je = { exports: {} }, Oe = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Ct;
-function Or() {
-  if (Ct) return Oe;
-  Ct = 1;
+var Nt;
+function Mr() {
+  if (Nt) return Me;
+  Nt = 1;
   var e = Symbol.for("react.transitional.element"), t = Symbol.for("react.fragment");
   function r(n, o, a) {
     var s = null;
@@ -39,9 +39,9 @@ function Or() {
       props: a
     };
   }
-  return Oe.Fragment = t, Oe.jsx = r, Oe.jsxs = r, Oe;
+  return Me.Fragment = t, Me.jsx = r, Me.jsxs = r, Me;
 }
-var Ne = {};
+var Oe = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -51,16 +51,16 @@ var Ne = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Pt;
-function Nr() {
-  return Pt || (Pt = 1, process.env.NODE_ENV !== "production" && function() {
+var Mt;
+function Or() {
+  return Mt || (Mt = 1, process.env.NODE_ENV !== "production" && function() {
     function e(i) {
       if (i == null) return null;
       if (typeof i == "function")
         return i.$$typeof === ze ? null : i.displayName || i.name || null;
       if (typeof i == "string") return i;
       switch (i) {
-        case _:
+        case w:
           return "Fragment";
         case f:
           return "Portal";
@@ -70,7 +70,7 @@ function Nr() {
           return "StrictMode";
         case ee:
           return "Suspense";
-        case ue:
+        case le:
           return "SuspenseList";
       }
       if (typeof i == "object")
@@ -82,14 +82,14 @@ function Nr() {
           case U:
             return (i._context.displayName || "Context") + ".Consumer";
           case V:
-            var T = i.render;
-            return i = i.displayName, i || (i = T.displayName || T.name || "", i = i !== "" ? "ForwardRef(" + i + ")" : "ForwardRef"), i;
-          case Re:
-            return T = i.displayName || null, T !== null ? T : e(i.type) || "Memo";
+            var R = i.render;
+            return i = i.displayName, i || (i = R.displayName || R.name || "", i = i !== "" ? "ForwardRef(" + i + ")" : "ForwardRef"), i;
           case Ae:
-            T = i._payload, i = i._init;
+            return R = i.displayName || null, R !== null ? R : e(i.type) || "Memo";
+          case _e:
+            R = i._payload, i = i._init;
             try {
-              return e(i(T));
+              return e(i(R));
             } catch {
             }
         }
@@ -101,17 +101,17 @@ function Nr() {
     function r(i) {
       try {
         t(i);
-        var T = !1;
+        var R = !1;
       } catch {
-        T = !0;
+        R = !0;
       }
-      if (T) {
-        T = console;
-        var w = T.error, N = typeof Symbol == "function" && Symbol.toStringTag && i[Symbol.toStringTag] || i.constructor.name || "Object";
-        return w.call(
-          T,
+      if (R) {
+        R = console;
+        var A = R.error, M = typeof Symbol == "function" && Symbol.toStringTag && i[Symbol.toStringTag] || i.constructor.name || "Object";
+        return A.call(
+          R,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          N
+          M
         ), t(i);
       }
     }
@@ -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, Xe = console.groupCollapsed, qe = console.groupEnd;
+        Fe = console.log, Ve = console.info, We = console.warn, Be = console.error, Xe = console.group, Ge = console.groupCollapsed, He = console.groupEnd;
         var i = {
           configurable: !0,
           enumerable: !0,
@@ -146,9 +146,9 @@ function Nr() {
           info: ie({}, i, { value: Ve }),
           warn: ie({}, i, { value: We }),
           error: ie({}, i, { value: Be }),
-          group: ie({}, i, { value: Ge }),
-          groupCollapsed: ie({}, i, { value: Xe }),
-          groupEnd: ie({}, i, { value: qe })
+          group: ie({}, i, { value: Xe }),
+          groupCollapsed: ie({}, i, { value: Ge }),
+          groupEnd: ie({}, i, { value: He })
         });
       }
       0 > fe && console.error(
@@ -156,29 +156,29 @@ function Nr() {
       );
     }
     function s(i) {
-      if (R === void 0)
+      if (_ === void 0)
         try {
           throw Error();
-        } catch (w) {
-          var T = w.stack.trim().match(/\n( *(at )?)/);
-          R = T && T[1] || "", ve = -1 < w.stack.indexOf(`
-    at`) ? " (<anonymous>)" : -1 < w.stack.indexOf("@") ? "@unknown:0:0" : "";
+        } catch (A) {
+          var R = A.stack.trim().match(/\n( *(at )?)/);
+          _ = R && R[1] || "", ve = -1 < A.stack.indexOf(`
+    at`) ? " (<anonymous>)" : -1 < A.stack.indexOf("@") ? "@unknown:0:0" : "";
         }
       return `
-` + R + i + ve;
-    }
-    function c(i, T) {
-      if (!i || le) return "";
-      var w = Ee.get(i);
-      if (w !== void 0) return w;
-      le = !0, w = Error.prepareStackTrace, Error.prepareStackTrace = void 0;
-      var N = null;
-      N = oe.H, oe.H = null, o();
+` + _ + i + ve;
+    }
+    function c(i, R) {
+      if (!i || ue) return "";
+      var A = Ee.get(i);
+      if (A !== void 0) return A;
+      ue = !0, A = Error.prepareStackTrace, Error.prepareStackTrace = void 0;
+      var M = null;
+      M = oe.H, oe.H = null, o();
       try {
-        var G = {
+        var X = {
           DetermineComponentFrameRoot: function() {
             try {
-              if (T) {
+              if (R) {
                 var de = function() {
                   throw Error();
                 };
@@ -190,14 +190,14 @@ function Nr() {
                   try {
                     Reflect.construct(de, []);
                   } catch (se) {
-                    var He = se;
+                    var qe = se;
                   }
                   Reflect.construct(i, [], de);
                 } else {
                   try {
                     de.call();
                   } catch (se) {
-                    He = se;
+                    qe = se;
                   }
                   i.call(de.prototype);
                 }
@@ -205,29 +205,29 @@ function Nr() {
                 try {
                   throw Error();
                 } catch (se) {
-                  He = se;
+                  qe = se;
                 }
                 (de = i()) && typeof de.catch == "function" && de.catch(function() {
                 });
               }
             } catch (se) {
-              if (se && He && typeof se.stack == "string")
-                return [se.stack, He.stack];
+              if (se && qe && typeof se.stack == "string")
+                return [se.stack, qe.stack];
             }
             return [null, null];
           }
         };
-        G.DetermineComponentFrameRoot.displayName = "DetermineComponentFrameRoot";
+        X.DetermineComponentFrameRoot.displayName = "DetermineComponentFrameRoot";
         var D = Object.getOwnPropertyDescriptor(
-          G.DetermineComponentFrameRoot,
+          X.DetermineComponentFrameRoot,
           "name"
         );
         D && D.configurable && Object.defineProperty(
-          G.DetermineComponentFrameRoot,
+          X.DetermineComponentFrameRoot,
           "name",
           { value: "DetermineComponentFrameRoot" }
         );
-        var P = G.DetermineComponentFrameRoot(), ae = P[0], ge = P[1];
+        var P = X.DetermineComponentFrameRoot(), ae = P[0], ge = P[1];
         if (ae && ge) {
           var q = ae.split(`
 `), me = ge.split(`
@@ -248,90 +248,90 @@ function Nr() {
               if (D !== 1 || P !== 1)
                 do
                   if (D--, P--, 0 > P || q[D] !== me[P]) {
-                    var Pe = `
+                    var Ne = `
 ` + q[D].replace(
                       " at new ",
                       " at "
                     );
-                    return i.displayName && Pe.includes("<anonymous>") && (Pe = Pe.replace("<anonymous>", i.displayName)), typeof i == "function" && Ee.set(i, Pe), Pe;
+                    return i.displayName && Ne.includes("<anonymous>") && (Ne = Ne.replace("<anonymous>", i.displayName)), typeof i == "function" && Ee.set(i, Ne), Ne;
                   }
                 while (1 <= D && 0 <= P);
               break;
             }
         }
       } finally {
-        le = !1, oe.H = N, a(), Error.prepareStackTrace = w;
+        ue = !1, oe.H = M, a(), Error.prepareStackTrace = A;
       }
       return q = (q = i ? i.displayName || i.name : "") ? s(q) : "", typeof i == "function" && Ee.set(i, q), q;
     }
-    function d(i) {
+    function u(i) {
       if (i == null) return "";
       if (typeof i == "function") {
-        var T = i.prototype;
+        var R = i.prototype;
         return c(
           i,
-          !(!T || !T.isReactComponent)
+          !(!R || !R.isReactComponent)
         );
       }
       if (typeof i == "string") return s(i);
       switch (i) {
         case ee:
           return s("Suspense");
-        case ue:
+        case le:
           return s("SuspenseList");
       }
       if (typeof i == "object")
         switch (i.$$typeof) {
           case V:
             return i = c(i.render, !1), i;
-          case Re:
-            return d(i.type);
           case Ae:
-            T = i._payload, i = i._init;
+            return u(i.type);
+          case _e:
+            R = i._payload, i = i._init;
             try {
-              return d(i(T));
+              return u(i(R));
             } catch {
             }
         }
       return "";
     }
-    function p() {
+    function h() {
       var i = oe.A;
       return i === null ? null : i.getOwner();
     }
-    function m(i) {
-      if (_e.call(i, "key")) {
-        var T = Object.getOwnPropertyDescriptor(i, "key").get;
-        if (T && T.isReactWarning) return !1;
+    function p(i) {
+      if (Ce.call(i, "key")) {
+        var R = Object.getOwnPropertyDescriptor(i, "key").get;
+        if (R && R.isReactWarning) return !1;
       }
       return i.key !== void 0;
     }
-    function g(i, T) {
-      function w() {
-        Tt || (Tt = !0, console.error(
+    function g(i, R) {
+      function A() {
+        Rt || (Rt = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
-          T
+          R
         ));
       }
-      w.isReactWarning = !0, Object.defineProperty(i, "key", {
-        get: w,
+      A.isReactWarning = !0, Object.defineProperty(i, "key", {
+        get: A,
         configurable: !0
       });
     }
     function b() {
       var i = e(this.type);
-      return wt[i] || (wt[i] = !0, console.error(
+      return At[i] || (At[i] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), i = this.props.ref, i !== void 0 ? i : null;
     }
-    function x(i, T, w, N, G, D) {
-      return w = D.ref, i = {
-        $$typeof: A,
+    function T(i, R, A, M, X, D) {
+      return A = D.ref, i = {
+        $$typeof: S,
         type: i,
-        key: T,
+        key: R,
         props: D,
-        _owner: G
-      }, (w !== void 0 ? w : null) !== null ? Object.defineProperty(i, "ref", {
+        _owner: X
+      }, (A !== void 0 ? A : null) !== null ? Object.defineProperty(i, "ref", {
         enumerable: !1,
         get: b
       }) : Object.defineProperty(i, "ref", { enumerable: !1, value: null }), i._store = {}, Object.defineProperty(i._store, "validated", {
@@ -346,14 +346,14 @@ function Nr() {
         value: null
       }), Object.freeze && (Object.freeze(i.props), Object.freeze(i)), i;
     }
-    function h(i, T, w, N, G, D) {
-      if (typeof i == "string" || typeof i == "function" || i === _ || i === F || i === C || i === ee || i === ue || i === dt || typeof i == "object" && i !== null && (i.$$typeof === Ae || i.$$typeof === Re || i.$$typeof === B || i.$$typeof === U || i.$$typeof === V || i.$$typeof === ft || i.getModuleId !== void 0)) {
-        var P = T.children;
+    function x(i, R, A, M, X, D) {
+      if (typeof i == "string" || typeof i == "function" || i === w || i === F || i === C || i === ee || i === le || i === ft || typeof i == "object" && i !== null && (i.$$typeof === _e || i.$$typeof === Ae || i.$$typeof === B || i.$$typeof === U || i.$$typeof === V || i.$$typeof === mt || i.getModuleId !== void 0)) {
+        var P = R.children;
         if (P !== void 0)
-          if (N)
-            if (Ce(P)) {
-              for (N = 0; N < P.length; N++)
-                y(P[N], i);
+          if (M)
+            if (Pe(P)) {
+              for (M = 0; M < P.length; M++)
+                y(P[M], i);
               Object.freeze && Object.freeze(P);
             } else
               console.error(
@@ -361,107 +361,107 @@ function Nr() {
               );
           else y(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 ? N = "null" : Ce(i) ? N = "array" : i !== void 0 && i.$$typeof === A ? (N = "<" + (e(i.type) || "Unknown") + " />", P = " Did you accidentally export a JSX literal instead of a component?") : N = 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 ? M = "null" : Pe(i) ? M = "array" : i !== void 0 && i.$$typeof === S ? (M = "<" + (e(i.type) || "Unknown") + " />", P = " Did you accidentally export a JSX literal instead of a component?") : M = 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",
-          N,
+          M,
           P
         );
-      if (_e.call(T, "key")) {
+      if (Ce.call(R, "key")) {
         P = e(i);
-        var ae = Object.keys(T).filter(function(q) {
+        var ae = Object.keys(R).filter(function(q) {
           return q !== "key";
         });
-        N = 0 < ae.length ? "{key: someKey, " + ae.join(": ..., ") + ": ...}" : "{key: someKey}", Rt[P + N] || (ae = 0 < ae.length ? "{" + ae.join(": ..., ") + ": ...}" : "{}", console.error(
+        M = 0 < ae.length ? "{key: someKey, " + ae.join(": ..., ") + ": ...}" : "{key: someKey}", _t[P + M] || (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} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          N,
+          M,
           P,
           ae,
           P
-        ), Rt[P + N] = !0);
+        ), _t[P + M] = !0);
       }
-      if (P = null, w !== void 0 && (r(w), P = "" + w), m(T) && (r(T.key), P = "" + T.key), "key" in T) {
-        w = {};
-        for (var ge in T)
-          ge !== "key" && (w[ge] = T[ge]);
-      } else w = T;
+      if (P = null, A !== void 0 && (r(A), P = "" + A), p(R) && (r(R.key), P = "" + R.key), "key" in R) {
+        A = {};
+        for (var ge in R)
+          ge !== "key" && (A[ge] = R[ge]);
+      } else A = R;
       return P && g(
-        w,
+        A,
         typeof i == "function" ? i.displayName || i.name || "Unknown" : i
-      ), x(i, P, D, G, p(), w);
-    }
-    function y(i, T) {
-      if (typeof i == "object" && i && i.$$typeof !== fr) {
-        if (Ce(i))
-          for (var w = 0; w < i.length; w++) {
-            var N = i[w];
-            u(N) && l(N, T);
+      ), T(i, P, D, X, h(), A);
+    }
+    function y(i, R) {
+      if (typeof i == "object" && i && i.$$typeof !== mr) {
+        if (Pe(i))
+          for (var A = 0; A < i.length; A++) {
+            var M = i[A];
+            l(M) && d(M, R);
           }
-        else if (u(i))
+        else if (l(i))
           i._store && (i._store.validated = 1);
-        else if (i === null || typeof i != "object" ? w = null : (w = Ye && i[Ye] || i["@@iterator"], w = typeof w == "function" ? w : null), typeof w == "function" && w !== i.entries && (w = w.call(i), w !== i))
-          for (; !(i = w.next()).done; )
-            u(i.value) && l(i.value, T);
+        else if (i === null || typeof i != "object" ? A = null : (A = Ye && i[Ye] || i["@@iterator"], A = typeof A == "function" ? A : null), typeof A == "function" && A !== i.entries && (A = A.call(i), A !== i))
+          for (; !(i = A.next()).done; )
+            l(i.value) && d(i.value, R);
       }
     }
-    function u(i) {
-      return typeof i == "object" && i !== null && i.$$typeof === A;
-    }
-    function l(i, T) {
-      if (i._store && !i._store.validated && i.key == null && (i._store.validated = 1, T = v(T), !At[T])) {
-        At[T] = !0;
-        var w = "";
-        i && i._owner != null && i._owner !== p() && (w = null, typeof i._owner.tag == "number" ? w = e(i._owner.type) : typeof i._owner.name == "string" && (w = i._owner.name), w = " It was passed a child from " + w + ".");
-        var N = oe.getCurrentStack;
+    function l(i) {
+      return typeof i == "object" && i !== null && i.$$typeof === S;
+    }
+    function d(i, R) {
+      if (i._store && !i._store.validated && i.key == null && (i._store.validated = 1, R = m(R), !Ct[R])) {
+        Ct[R] = !0;
+        var A = "";
+        i && i._owner != null && i._owner !== h() && (A = null, typeof i._owner.tag == "number" ? A = e(i._owner.type) : typeof i._owner.name == "string" && (A = i._owner.name), A = " It was passed a child from " + A + ".");
+        var M = oe.getCurrentStack;
         oe.getCurrentStack = function() {
-          var G = d(i.type);
-          return N && (G += N() || ""), G;
+          var X = u(i.type);
+          return M && (X += M() || ""), X;
         }, console.error(
           'Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.',
-          T,
-          w
-        ), oe.getCurrentStack = N;
+          R,
+          A
+        ), oe.getCurrentStack = M;
       }
     }
-    function v(i) {
-      var T = "", w = p();
-      return w && (w = e(w.type)) && (T = `
+    function m(i) {
+      var R = "", A = h();
+      return A && (A = e(A.type)) && (R = `
 
-Check the render method of \`` + w + "`."), T || (i = e(i)) && (T = `
+Check the render method of \`` + A + "`."), R || (i = e(i)) && (R = `
 
-Check the top-level render call using <` + i + ">."), T;
+Check the top-level render call using <` + i + ">."), R;
     }
-    var S = mr, A = Symbol.for("react.transitional.element"), f = Symbol.for("react.portal"), _ = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), F = Symbol.for("react.profiler"), U = Symbol.for("react.consumer"), B = Symbol.for("react.context"), V = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), ue = Symbol.for("react.suspense_list"), Re = Symbol.for("react.memo"), Ae = Symbol.for("react.lazy"), dt = Symbol.for("react.offscreen"), Ye = Symbol.iterator, ze = Symbol.for("react.client.reference"), oe = S.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, _e = Object.prototype.hasOwnProperty, ie = Object.assign, ft = Symbol.for("react.client.reference"), Ce = Array.isArray, fe = 0, Fe, Ve, We, Be, Ge, Xe, qe;
+    var v = pr, S = Symbol.for("react.transitional.element"), f = Symbol.for("react.portal"), w = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), F = Symbol.for("react.profiler"), U = Symbol.for("react.consumer"), B = Symbol.for("react.context"), V = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), le = Symbol.for("react.suspense_list"), Ae = Symbol.for("react.memo"), _e = Symbol.for("react.lazy"), ft = Symbol.for("react.offscreen"), Ye = Symbol.iterator, ze = Symbol.for("react.client.reference"), oe = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Ce = Object.prototype.hasOwnProperty, ie = Object.assign, mt = Symbol.for("react.client.reference"), Pe = Array.isArray, fe = 0, Fe, Ve, We, Be, Xe, Ge, He;
     n.__reactDisabledLog = !0;
-    var R, ve, le = !1, Ee = new (typeof WeakMap == "function" ? WeakMap : Map)(), fr = Symbol.for("react.client.reference"), Tt, wt = {}, Rt = {}, At = {};
-    Ne.Fragment = _, Ne.jsx = function(i, T, w, N, G) {
-      return h(i, T, w, !1, N, G);
-    }, Ne.jsxs = function(i, T, w, N, G) {
-      return h(i, T, w, !0, N, G);
+    var _, ve, ue = !1, Ee = new (typeof WeakMap == "function" ? WeakMap : Map)(), mr = Symbol.for("react.client.reference"), Rt, At = {}, _t = {}, Ct = {};
+    Oe.Fragment = w, Oe.jsx = function(i, R, A, M, X) {
+      return x(i, R, A, !1, M, X);
+    }, Oe.jsxs = function(i, R, A, M, X) {
+      return x(i, R, A, !0, M, X);
     };
-  }()), Ne;
+  }()), Oe;
 }
 var Ot;
-function Mr() {
-  return Ot || (Ot = 1, process.env.NODE_ENV === "production" ? Je.exports = Or() : Je.exports = Nr()), Je.exports;
+function kr() {
+  return Ot || (Ot = 1, process.env.NODE_ENV === "production" ? Je.exports = Mr() : Je.exports = Or()), Je.exports;
 }
-var ke = Mr();
-function Ir(e) {
+var Ie = kr();
+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 Ir(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;
 }
-var kr = /* @__PURE__ */ function() {
+var $r = /* @__PURE__ */ function() {
   function e(r) {
     var n = this;
     this._insertTag = function(o) {
@@ -473,10 +473,10 @@ var kr = /* @__PURE__ */ function() {
   return t.hydrate = function(n) {
     n.forEach(this._insertTag);
   }, t.insert = function(n) {
-    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(Lr(this));
+    this.ctr % (this.isSpeedy ? 65e3 : 1) === 0 && this._insertTag(Ir(this));
     var o = this.tags[this.tags.length - 1];
     if (this.isSpeedy) {
-      var a = Ir(o);
+      var a = Lr(o);
       try {
         a.insertRule(n, a.cssRules.length);
       } catch {
@@ -490,20 +490,20 @@ var kr = /* @__PURE__ */ function() {
       return (o = n.parentNode) == null ? void 0 : o.removeChild(n);
     }), this.tags = [], this.ctr = 0;
   }, e;
-}(), X = "-ms-", it = "-moz-", M = "-webkit-", Kt = "comm", bt = "rule", yt = "decl", $r = "@import", Jt = "@keyframes", Ur = "@layer", Dr = Math.abs, at = String.fromCharCode, jr = Object.assign;
-function Yr(e, t) {
+}(), H = "-ms-", it = "-moz-", O = "-webkit-", Jt = "comm", xt = "rule", St = "decl", Ur = "@import", Zt = "@keyframes", Dr = "@layer", jr = Math.abs, st = String.fromCharCode, Yr = Object.assign;
+function zr(e, t) {
   return W(e, 0) ^ 45 ? (((t << 2 ^ W(e, 0)) << 2 ^ W(e, 1)) << 2 ^ W(e, 2)) << 2 ^ W(e, 3) : 0;
 }
-function Zt(e) {
+function Qt(e) {
   return e.trim();
 }
-function zr(e, t) {
+function Fr(e, t) {
   return (e = t.exec(e)) ? e[0] : e;
 }
-function I(e, t, r) {
+function k(e, t, r) {
   return e.replace(t, r);
 }
-function ht(e, t) {
+function Et(e, t) {
   return e.indexOf(t);
 }
 function W(e, t) {
@@ -515,39 +515,39 @@ function $e(e, t, r) {
 function te(e) {
   return e.length;
 }
-function xt(e) {
+function Tt(e) {
   return e.length;
 }
 function Ze(e, t) {
   return t.push(e), e;
 }
-function Fr(e, t) {
+function Vr(e, t) {
   return e.map(t).join("");
 }
-var st = 1, xe = 1, Qt = 0, J = 0, j = 0, Te = "";
-function ct(e, t, r, n, o, a, s) {
-  return { value: e, root: t, parent: r, type: n, props: o, children: a, line: st, column: xe, length: s, return: "" };
-}
-function Me(e, t) {
-  return jr(ct("", null, null, "", null, null, 0), e, { length: -e.length }, t);
+var ct = 1, Se = 1, er = 0, Z = 0, Y = 0, we = "";
+function lt(e, t, r, n, o, a, s) {
+  return { value: e, root: t, parent: r, type: n, props: o, children: a, line: ct, column: Se, length: s, return: "" };
 }
-function Vr() {
-  return j;
+function ke(e, t) {
+  return Yr(lt("", null, null, "", null, null, 0), e, { length: -e.length }, t);
 }
 function Wr() {
-  return j = J > 0 ? W(Te, --J) : 0, xe--, j === 10 && (xe = 1, st--), j;
+  return Y;
+}
+function Br() {
+  return Y = Z > 0 ? W(we, --Z) : 0, Se--, Y === 10 && (Se = 1, ct--), Y;
 }
-function Z() {
-  return j = J < Qt ? W(Te, J++) : 0, xe++, j === 10 && (xe = 1, st++), j;
+function Q() {
+  return Y = Z < er ? W(we, Z++) : 0, Se++, Y === 10 && (Se = 1, ct++), Y;
 }
 function ne() {
-  return W(Te, J);
+  return W(we, Z);
 }
 function et() {
-  return J;
+  return Z;
 }
 function je(e, t) {
-  return $e(Te, e, t);
+  return $e(we, e, t);
 }
 function Ue(e) {
   switch (e) {
@@ -587,82 +587,82 @@ function Ue(e) {
   }
   return 0;
 }
-function er(e) {
-  return st = xe = 1, Qt = te(Te = e), J = 0, [];
-}
 function tr(e) {
-  return Te = "", e;
+  return ct = Se = 1, er = te(we = e), Z = 0, [];
+}
+function rr(e) {
+  return we = "", e;
 }
 function tt(e) {
-  return Zt(je(J - 1, vt(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
+  return Qt(je(Z - 1, gt(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
 }
-function Br(e) {
-  for (; (j = ne()) && j < 33; )
-    Z();
-  return Ue(e) > 2 || Ue(j) > 3 ? "" : " ";
+function Xr(e) {
+  for (; (Y = ne()) && Y < 33; )
+    Q();
+  return Ue(e) > 2 || Ue(Y) > 3 ? "" : " ";
 }
 function Gr(e, t) {
-  for (; --t && Z() && !(j < 48 || j > 102 || j > 57 && j < 65 || j > 70 && j < 97); )
+  for (; --t && Q() && !(Y < 48 || Y > 102 || Y > 57 && Y < 65 || Y > 70 && Y < 97); )
     ;
-  return je(e, et() + (t < 6 && ne() == 32 && Z() == 32));
+  return je(e, et() + (t < 6 && ne() == 32 && Q() == 32));
 }
-function vt(e) {
-  for (; Z(); )
-    switch (j) {
+function gt(e) {
+  for (; Q(); )
+    switch (Y) {
       // ] ) " '
       case e:
-        return J;
+        return Z;
       // " '
       case 34:
       case 39:
-        e !== 34 && e !== 39 && vt(j);
+        e !== 34 && e !== 39 && gt(Y);
         break;
       // (
       case 40:
-        e === 41 && vt(e);
+        e === 41 && gt(e);
         break;
       // \
       case 92:
-        Z();
+        Q();
         break;
     }
-  return J;
+  return Z;
 }
-function Xr(e, t) {
-  for (; Z() && e + j !== 57; )
-    if (e + j === 84 && ne() === 47)
+function Hr(e, t) {
+  for (; Q() && e + Y !== 57; )
+    if (e + Y === 84 && ne() === 47)
       break;
-  return "/*" + je(t, J - 1) + "*" + at(e === 47 ? e : Z());
+  return "/*" + je(t, Z - 1) + "*" + st(e === 47 ? e : Q());
 }
 function qr(e) {
   for (; !Ue(ne()); )
-    Z();
-  return je(e, J);
+    Q();
+  return je(e, Z);
 }
-function Hr(e) {
-  return tr(rt("", null, null, null, [""], e = er(e), 0, [0], e));
+function Kr(e) {
+  return rr(rt("", null, null, null, [""], e = tr(e), 0, [0], e));
 }
-function rt(e, t, r, n, o, a, s, c, d) {
-  for (var p = 0, m = 0, g = s, b = 0, x = 0, h = 0, y = 1, u = 1, l = 1, v = 0, S = "", A = o, f = a, _ = n, C = S; u; )
-    switch (h = v, v = Z()) {
+function rt(e, t, r, n, o, a, s, c, u) {
+  for (var h = 0, p = 0, g = s, b = 0, T = 0, x = 0, y = 1, l = 1, d = 1, m = 0, v = "", S = o, f = a, w = n, C = v; l; )
+    switch (x = m, m = Q()) {
       // (
       case 40:
-        if (h != 108 && W(C, g - 1) == 58) {
-          ht(C += I(tt(v), "&", "&\f"), "&\f") != -1 && (l = -1);
+        if (x != 108 && W(C, g - 1) == 58) {
+          Et(C += k(tt(m), "&", "&\f"), "&\f") != -1 && (d = -1);
           break;
         }
       // " ' [
       case 34:
       case 39:
       case 91:
-        C += tt(v);
+        C += tt(m);
         break;
       // \t \n \r \s
       case 9:
       case 10:
       case 13:
       case 32:
-        C += Br(h);
+        C += Xr(x);
         break;
       // \
       case 92:
@@ -673,7 +673,7 @@ function rt(e, t, r, n, o, a, s, c, d) {
         switch (ne()) {
           case 42:
           case 47:
-            Ze(Kr(Xr(Z(), et()), t, r), d);
+            Ze(Jr(Hr(Q(), et()), t, r), u);
             break;
           default:
             C += "/";
@@ -681,28 +681,28 @@ function rt(e, t, r, n, o, a, s, c, d) {
         break;
       // {
       case 123 * y:
-        c[p++] = te(C) * l;
+        c[h++] = te(C) * d;
       // } ; \0
       case 125 * y:
       case 59:
       case 0:
-        switch (v) {
+        switch (m) {
           // \0 }
           case 0:
           case 125:
-            u = 0;
+            l = 0;
           // ;
-          case 59 + m:
-            l == -1 && (C = I(C, /\f/g, "")), x > 0 && te(C) - g && Ze(x > 32 ? Mt(C + ";", n, r, g - 1) : Mt(I(C, " ", "") + ";", n, r, g - 2), d);
+          case 59 + p:
+            d == -1 && (C = k(C, /\f/g, "")), T > 0 && te(C) - g && Ze(T > 32 ? Lt(C + ";", n, r, g - 1) : Lt(k(C, " ", "") + ";", n, r, g - 2), u);
             break;
           // @ ;
           case 59:
             C += ";";
           // { rule/at-rule
           default:
-            if (Ze(_ = Nt(C, t, r, p, m, o, c, S, A = [], f = [], g), a), v === 123)
-              if (m === 0)
-                rt(C, t, _, _, A, a, g, c, f);
+            if (Ze(w = kt(C, t, r, h, p, o, c, v, S = [], f = [], g), a), m === 123)
+              if (p === 0)
+                rt(C, t, w, w, S, a, g, c, f);
               else
                 switch (b === 99 && W(C, 3) === 110 ? 100 : b) {
                   // d l m s
@@ -710,106 +710,106 @@ function rt(e, t, r, n, o, a, s, c, d) {
                   case 108:
                   case 109:
                   case 115:
-                    rt(e, _, _, n && Ze(Nt(e, _, _, 0, 0, o, c, S, o, A = [], g), f), o, f, g, c, n ? A : f);
+                    rt(e, w, w, n && Ze(kt(e, w, w, 0, 0, o, c, v, o, S = [], g), f), o, f, g, c, n ? S : f);
                     break;
                   default:
-                    rt(C, _, _, _, [""], f, 0, c, f);
+                    rt(C, w, w, w, [""], f, 0, c, f);
                 }
         }
-        p = m = x = 0, y = l = 1, S = C = "", g = s;
+        h = p = T = 0, y = d = 1, v = C = "", g = s;
         break;
       // :
       case 58:
-        g = 1 + te(C), x = h;
+        g = 1 + te(C), T = x;
       default:
         if (y < 1) {
-          if (v == 123)
+          if (m == 123)
             --y;
-          else if (v == 125 && y++ == 0 && Wr() == 125)
+          else if (m == 125 && y++ == 0 && Br() == 125)
             continue;
         }
-        switch (C += at(v), v * y) {
+        switch (C += st(m), m * y) {
           // &
           case 38:
-            l = m > 0 ? 1 : (C += "\f", -1);
+            d = p > 0 ? 1 : (C += "\f", -1);
             break;
           // ,
           case 44:
-            c[p++] = (te(C) - 1) * l, l = 1;
+            c[h++] = (te(C) - 1) * d, d = 1;
             break;
           // @
           case 64:
-            ne() === 45 && (C += tt(Z())), b = ne(), m = g = te(S = C += qr(et())), v++;
+            ne() === 45 && (C += tt(Q())), b = ne(), p = g = te(v = C += qr(et())), m++;
             break;
           // -
           case 45:
-            h === 45 && te(C) == 2 && (y = 0);
+            x === 45 && te(C) == 2 && (y = 0);
         }
     }
   return a;
 }
-function Nt(e, t, r, n, o, a, s, c, d, p, m) {
-  for (var g = o - 1, b = o === 0 ? a : [""], x = xt(b), h = 0, y = 0, u = 0; h < n; ++h)
-    for (var l = 0, v = $e(e, g + 1, g = Dr(y = s[h])), S = e; l < x; ++l)
-      (S = Zt(y > 0 ? b[l] + " " + v : I(v, /&\f/g, b[l]))) && (d[u++] = S);
-  return ct(e, t, r, o === 0 ? bt : c, d, p, m);
+function kt(e, t, r, n, o, a, s, c, u, h, p) {
+  for (var g = o - 1, b = o === 0 ? a : [""], T = Tt(b), x = 0, y = 0, l = 0; x < n; ++x)
+    for (var d = 0, m = $e(e, g + 1, g = jr(y = s[x])), v = e; d < T; ++d)
+      (v = Qt(y > 0 ? b[d] + " " + m : k(m, /&\f/g, b[d]))) && (u[l++] = v);
+  return lt(e, t, r, o === 0 ? xt : c, u, h, p);
 }
-function Kr(e, t, r) {
-  return ct(e, t, r, Kt, at(Vr()), $e(e, 2, -2), 0);
+function Jr(e, t, r) {
+  return lt(e, t, r, Jt, st(Wr()), $e(e, 2, -2), 0);
 }
-function Mt(e, t, r, n) {
-  return ct(e, t, r, yt, $e(e, 0, n), $e(e, n + 1, -1), n);
+function Lt(e, t, r, n) {
+  return lt(e, t, r, St, $e(e, 0, n), $e(e, n + 1, -1), n);
 }
 function be(e, t) {
-  for (var r = "", n = xt(e), o = 0; o < n; o++)
+  for (var r = "", n = Tt(e), o = 0; o < n; o++)
     r += t(e[o], o, e, t) || "";
   return r;
 }
-function Jr(e, t, r, n) {
+function Zr(e, t, r, n) {
   switch (e.type) {
-    case Ur:
+    case Dr:
       if (e.children.length) break;
-    case $r:
-    case yt:
+    case Ur:
+    case St:
       return e.return = e.return || e.value;
-    case Kt:
-      return "";
     case Jt:
+      return "";
+    case Zt:
       return e.return = e.value + "{" + be(e.children, n) + "}";
-    case bt:
+    case xt:
       e.value = e.props.join(",");
   }
   return te(r = be(e.children, n)) ? e.return = e.value + "{" + r + "}" : "";
 }
-function Zr(e) {
-  var t = xt(e);
+function Qr(e) {
+  var t = Tt(e);
   return function(r, n, o, a) {
     for (var s = "", c = 0; c < t; c++)
       s += e[c](r, n, o, a) || "";
     return s;
   };
 }
-function Qr(e) {
+function en(e) {
   return function(t) {
     t.root || (t = t.return) && e(t);
   };
 }
-function en(e) {
+function tn(e) {
   var t = /* @__PURE__ */ Object.create(null);
   return function(r) {
     return t[r] === void 0 && (t[r] = e(r)), t[r];
   };
 }
-var tn = function(t, r, n) {
+var rn = function(t, r, n) {
   for (var o = 0, a = 0; o = a, a = ne(), o === 38 && a === 12 && (r[n] = 1), !Ue(a); )
-    Z();
-  return je(t, J);
-}, rn = function(t, r) {
+    Q();
+  return je(t, Z);
+}, nn = function(t, r) {
   var n = -1, o = 44;
   do
     switch (Ue(o)) {
       case 0:
-        o === 38 && ne() === 12 && (r[n] = 1), t[n] += tn(J - 1, r, n);
+        o === 38 && ne() === 12 && (r[n] = 1), t[n] += rn(Z - 1, r, n);
         break;
       case 2:
         t[n] += tt(o);
@@ -821,13 +821,13 @@ var tn = function(t, r, n) {
         }
       // fallthrough
       default:
-        t[n] += at(o);
+        t[n] += st(o);
     }
-  while (o = Z());
+  while (o = Q());
   return t;
-}, nn = function(t, r) {
-  return tr(rn(er(t), r));
-}, It = /* @__PURE__ */ new WeakMap(), on = function(t) {
+}, on = function(t, r) {
+  return rr(nn(tr(t), r));
+}, It = /* @__PURE__ */ new WeakMap(), an = 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)) {
@@ -835,12 +835,12 @@ var tn = function(t, r, n) {
       if (n = n.parent, !n) return;
     if (!(t.props.length === 1 && r.charCodeAt(0) !== 58 && !It.get(n)) && !o) {
       It.set(t, !0);
-      for (var a = [], s = nn(r, a), c = n.props, d = 0, p = 0; d < s.length; d++)
-        for (var m = 0; m < c.length; m++, p++)
-          t.props[p] = a[d] ? s[d].replace(/&\f/g, c[m]) : c[m] + " " + s[d];
+      for (var a = [], s = on(r, a), c = n.props, u = 0, h = 0; u < s.length; u++)
+        for (var p = 0; p < c.length; p++, h++)
+          t.props[h] = a[u] ? s[u].replace(/&\f/g, c[p]) : c[p] + " " + s[u];
     }
   }
-}, an = function(t) {
+}, sn = function(t) {
   if (t.type === "decl") {
     var r = t.value;
     // charcode for l
@@ -848,11 +848,11 @@ var tn = function(t, r, n) {
     r.charCodeAt(2) === 98 && (t.return = "", t.value = "");
   }
 };
-function rr(e, t) {
-  switch (Yr(e, t)) {
+function nr(e, t) {
+  switch (zr(e, t)) {
     // color-adjust
     case 5103:
-      return M + "print-" + e + e;
+      return O + "print-" + e + e;
     // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
     case 5737:
     case 4201:
@@ -882,58 +882,58 @@ function rr(e, t) {
     case 5365:
     case 5621:
     case 3829:
-      return M + e + e;
+      return O + e + e;
     // appearance, user-select, transform, hyphens, text-size-adjust
     case 5349:
     case 4246:
     case 4810:
     case 6968:
     case 2756:
-      return M + e + it + e + X + e + e;
+      return O + e + it + e + H + e + e;
     // flex, flex-direction
     case 6828:
     case 4268:
-      return M + e + X + e + e;
+      return O + e + H + e + e;
     // order
     case 6165:
-      return M + e + X + "flex-" + e + e;
+      return O + e + H + "flex-" + e + e;
     // align-items
     case 5187:
-      return M + e + I(e, /(\w+).+(:[^]+)/, M + "box-$1$2" + X + "flex-$1$2") + e;
+      return O + e + k(e, /(\w+).+(:[^]+)/, O + "box-$1$2" + H + "flex-$1$2") + e;
     // align-self
     case 5443:
-      return M + e + X + "flex-item-" + I(e, /flex-|-self/, "") + e;
+      return O + e + H + "flex-item-" + k(e, /flex-|-self/, "") + e;
     // align-content
     case 4675:
-      return M + e + X + "flex-line-pack" + I(e, /align-content|flex-|-self/, "") + e;
+      return O + e + H + "flex-line-pack" + k(e, /align-content|flex-|-self/, "") + e;
     // flex-shrink
     case 5548:
-      return M + e + X + I(e, "shrink", "negative") + e;
+      return O + e + H + k(e, "shrink", "negative") + e;
     // flex-basis
     case 5292:
-      return M + e + X + I(e, "basis", "preferred-size") + e;
+      return O + e + H + k(e, "basis", "preferred-size") + e;
     // flex-grow
     case 6060:
-      return M + "box-" + I(e, "-grow", "") + M + e + X + I(e, "grow", "positive") + e;
+      return O + "box-" + k(e, "-grow", "") + O + e + H + k(e, "grow", "positive") + e;
     // transition
     case 4554:
-      return M + I(e, /([^-])(transform)/g, "$1" + M + "$2") + e;
+      return O + k(e, /([^-])(transform)/g, "$1" + O + "$2") + e;
     // cursor
     case 6187:
-      return I(I(I(e, /(zoom-|grab)/, M + "$1"), /(image-set)/, M + "$1"), e, "") + e;
+      return k(k(k(e, /(zoom-|grab)/, O + "$1"), /(image-set)/, O + "$1"), e, "") + e;
     // background, background-image
     case 5495:
     case 3959:
-      return I(e, /(image-set\([^]*)/, M + "$1$`$1");
+      return k(e, /(image-set\([^]*)/, O + "$1$`$1");
     // justify-content
     case 4968:
-      return I(I(e, /(.+:)(flex-)?(.*)/, M + "box-pack:$3" + X + "flex-pack:$3"), /s.+-b[^;]+/, "justify") + M + e + e;
+      return k(k(e, /(.+:)(flex-)?(.*)/, O + "box-pack:$3" + H + "flex-pack:$3"), /s.+-b[^;]+/, "justify") + O + e + e;
     // (margin|padding)-inline-(start|end)
     case 4095:
     case 3583:
     case 4068:
     case 2532:
-      return I(e, /(.+)-inline(.+)/, M + "$1$2") + e;
+      return k(e, /(.+)-inline(.+)/, O + "$1$2") + e;
     // (min|max)?(width|height|inline-size|block-size)
     case 8116:
     case 7059:
@@ -953,10 +953,10 @@ function rr(e, t) {
           if (W(e, t + 4) !== 45) break;
         // (f)ill-available, (f)it-content
         case 102:
-          return I(e, /(.+:)(.+)-([^]+)/, "$1" + M + "$2-$3$1" + it + (W(e, t + 3) == 108 ? "$3" : "$2-$3")) + e;
+          return k(e, /(.+:)(.+)-([^]+)/, "$1" + O + "$2-$3$1" + it + (W(e, t + 3) == 108 ? "$3" : "$2-$3")) + e;
         // (s)tretch
         case 115:
-          return ~ht(e, "stretch") ? rr(I(e, "stretch", "fill-available"), t) + e : e;
+          return ~Et(e, "stretch") ? nr(k(e, "stretch", "fill-available"), t) + e : e;
       }
       break;
     // position: sticky
@@ -964,13 +964,13 @@ function rr(e, t) {
       if (W(e, t + 1) !== 115) break;
     // display: (flex|inline-flex)
     case 6444:
-      switch (W(e, te(e) - 3 - (~ht(e, "!important") && 10))) {
+      switch (W(e, te(e) - 3 - (~Et(e, "!important") && 10))) {
         // stic(k)y
         case 107:
-          return I(e, ":", ":" + M) + e;
+          return k(e, ":", ":" + O) + e;
         // (inline-)?fl(e)x
         case 101:
-          return I(e, /(.+:)([^;!]+)(;|!.+)?/, "$1" + M + (W(e, 14) === 45 ? "inline-" : "") + "box$3$1" + M + "$2$3$1" + X + "$2box$3") + e;
+          return k(e, /(.+:)([^;!]+)(;|!.+)?/, "$1" + O + (W(e, 14) === 45 ? "inline-" : "") + "box$3$1" + O + "$2$3$1" + H + "$2box$3") + e;
       }
       break;
     // writing-mode
@@ -978,83 +978,83 @@ function rr(e, t) {
       switch (W(e, t + 11)) {
         // vertical-l(r)
         case 114:
-          return M + e + X + I(e, /[svh]\w+-[tblr]{2}/, "tb") + e;
+          return O + e + H + k(e, /[svh]\w+-[tblr]{2}/, "tb") + e;
         // vertical-r(l)
         case 108:
-          return M + e + X + I(e, /[svh]\w+-[tblr]{2}/, "tb-rl") + e;
+          return O + e + H + k(e, /[svh]\w+-[tblr]{2}/, "tb-rl") + e;
         // horizontal(-)tb
         case 45:
-          return M + e + X + I(e, /[svh]\w+-[tblr]{2}/, "lr") + e;
+          return O + e + H + k(e, /[svh]\w+-[tblr]{2}/, "lr") + e;
       }
-      return M + e + X + e + e;
+      return O + e + H + e + e;
   }
   return e;
 }
-var sn = function(t, r, n, o) {
+var cn = function(t, r, n, o) {
   if (t.length > -1 && !t.return) switch (t.type) {
-    case yt:
-      t.return = rr(t.value, t.length);
+    case St:
+      t.return = nr(t.value, t.length);
       break;
-    case Jt:
-      return be([Me(t, {
-        value: I(t.value, "@", "@" + M)
+    case Zt:
+      return be([ke(t, {
+        value: k(t.value, "@", "@" + O)
       })], o);
-    case bt:
-      if (t.length) return Fr(t.props, function(a) {
-        switch (zr(a, /(::plac\w+|:read-\w+)/)) {
+    case xt:
+      if (t.length) return Vr(t.props, function(a) {
+        switch (Fr(a, /(::plac\w+|:read-\w+)/)) {
           // :read-(only|write)
           case ":read-only":
           case ":read-write":
-            return be([Me(t, {
-              props: [I(a, /:(read-\w+)/, ":" + it + "$1")]
+            return be([ke(t, {
+              props: [k(a, /:(read-\w+)/, ":" + it + "$1")]
             })], o);
           // :placeholder
           case "::placeholder":
-            return be([Me(t, {
-              props: [I(a, /:(plac\w+)/, ":" + M + "input-$1")]
-            }), Me(t, {
-              props: [I(a, /:(plac\w+)/, ":" + it + "$1")]
-            }), Me(t, {
-              props: [I(a, /:(plac\w+)/, X + "input-$1")]
+            return be([ke(t, {
+              props: [k(a, /:(plac\w+)/, ":" + O + "input-$1")]
+            }), ke(t, {
+              props: [k(a, /:(plac\w+)/, ":" + it + "$1")]
+            }), ke(t, {
+              props: [k(a, /:(plac\w+)/, H + "input-$1")]
             })], o);
         }
         return "";
       });
   }
-}, cn = [sn], un = function(t) {
+}, ln = [cn], un = function(t) {
   var r = t.key;
   if (r === "css") {
     var n = document.querySelectorAll("style[data-emotion]:not([data-s])");
     Array.prototype.forEach.call(n, function(y) {
-      var u = y.getAttribute("data-emotion");
-      u.indexOf(" ") !== -1 && (document.head.appendChild(y), y.setAttribute("data-s", ""));
+      var l = y.getAttribute("data-emotion");
+      l.indexOf(" ") !== -1 && (document.head.appendChild(y), y.setAttribute("data-s", ""));
     });
   }
-  var o = t.stylisPlugins || cn, a = {}, s, c = [];
+  var o = t.stylisPlugins || ln, a = {}, s, c = [];
   s = t.container || document.head, Array.prototype.forEach.call(
     // 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^="' + r + ' "]'),
     function(y) {
-      for (var u = y.getAttribute("data-emotion").split(" "), l = 1; l < u.length; l++)
-        a[u[l]] = !0;
+      for (var l = y.getAttribute("data-emotion").split(" "), d = 1; d < l.length; d++)
+        a[l[d]] = !0;
       c.push(y);
     }
   );
-  var d, p = [on, an];
+  var u, h = [an, sn];
   {
-    var m, g = [Jr, Qr(function(y) {
-      m.insert(y);
-    })], b = Zr(p.concat(o, g)), x = function(u) {
-      return be(Hr(u), b);
+    var p, g = [Zr, en(function(y) {
+      p.insert(y);
+    })], b = Qr(h.concat(o, g)), T = function(l) {
+      return be(Kr(l), b);
     };
-    d = function(u, l, v, S) {
-      m = v, x(u ? u + "{" + l.styles + "}" : l.styles), S && (h.inserted[l.name] = !0);
+    u = function(l, d, m, v) {
+      p = m, T(l ? l + "{" + d.styles + "}" : d.styles), v && (x.inserted[d.name] = !0);
     };
   }
-  var h = {
+  var x = {
     key: r,
-    sheet: new kr({
+    sheet: new $r({
       key: r,
       container: s,
       nonce: t.nonce,
@@ -1065,9 +1065,9 @@ var sn = function(t, r, n, o) {
     nonce: t.nonce,
     inserted: a,
     registered: {},
-    insert: d
+    insert: u
   };
-  return h.sheet.hydrate(c), h;
+  return x.sheet.hydrate(c), x;
 }, Qe = { exports: {} }, L = {};
 /** @license React v16.13.1
  * react-is.production.min.js
@@ -1077,19 +1077,19 @@ var sn = function(t, r, n, 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;
-function ln() {
-  if (Lt) return L;
-  Lt = 1;
-  var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, r = e ? Symbol.for("react.portal") : 60106, n = 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, c = e ? Symbol.for("react.context") : 60110, d = e ? Symbol.for("react.async_mode") : 60111, p = e ? Symbol.for("react.concurrent_mode") : 60111, m = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, b = e ? Symbol.for("react.suspense_list") : 60120, x = e ? Symbol.for("react.memo") : 60115, h = e ? Symbol.for("react.lazy") : 60116, y = e ? Symbol.for("react.block") : 60121, u = e ? Symbol.for("react.fundamental") : 60117, l = e ? Symbol.for("react.responder") : 60118, v = e ? Symbol.for("react.scope") : 60119;
-  function S(f) {
+var $t;
+function dn() {
+  if ($t) return L;
+  $t = 1;
+  var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, r = e ? Symbol.for("react.portal") : 60106, n = 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, c = e ? Symbol.for("react.context") : 60110, u = e ? Symbol.for("react.async_mode") : 60111, h = e ? Symbol.for("react.concurrent_mode") : 60111, p = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, b = e ? Symbol.for("react.suspense_list") : 60120, T = e ? Symbol.for("react.memo") : 60115, x = e ? Symbol.for("react.lazy") : 60116, y = e ? Symbol.for("react.block") : 60121, l = e ? Symbol.for("react.fundamental") : 60117, d = e ? Symbol.for("react.responder") : 60118, m = e ? Symbol.for("react.scope") : 60119;
+  function v(f) {
     if (typeof f == "object" && f !== null) {
-      var _ = f.$$typeof;
-      switch (_) {
+      var w = f.$$typeof;
+      switch (w) {
         case t:
           switch (f = f.type, f) {
-            case d:
-            case p:
+            case u:
+            case h:
             case n:
             case a:
             case o:
@@ -1098,52 +1098,52 @@ function ln() {
             default:
               switch (f = f && f.$$typeof, f) {
                 case c:
-                case m:
-                case h:
+                case p:
                 case x:
+                case T:
                 case s:
                   return f;
                 default:
-                  return _;
+                  return w;
               }
           }
         case r:
-          return _;
+          return w;
       }
     }
   }
-  function A(f) {
-    return S(f) === p;
+  function S(f) {
+    return v(f) === h;
   }
-  return L.AsyncMode = d, L.ConcurrentMode = p, L.ContextConsumer = c, L.ContextProvider = s, L.Element = t, L.ForwardRef = m, L.Fragment = n, L.Lazy = h, L.Memo = x, L.Portal = r, L.Profiler = a, L.StrictMode = o, L.Suspense = g, L.isAsyncMode = function(f) {
-    return A(f) || S(f) === d;
-  }, L.isConcurrentMode = A, L.isContextConsumer = function(f) {
-    return S(f) === c;
+  return L.AsyncMode = u, L.ConcurrentMode = h, L.ContextConsumer = c, L.ContextProvider = s, L.Element = t, L.ForwardRef = p, L.Fragment = n, L.Lazy = x, L.Memo = T, L.Portal = r, L.Profiler = a, L.StrictMode = o, L.Suspense = g, L.isAsyncMode = function(f) {
+    return S(f) || v(f) === u;
+  }, L.isConcurrentMode = S, L.isContextConsumer = function(f) {
+    return v(f) === c;
   }, L.isContextProvider = function(f) {
-    return S(f) === s;
+    return v(f) === s;
   }, L.isElement = function(f) {
     return typeof f == "object" && f !== null && f.$$typeof === t;
   }, L.isForwardRef = function(f) {
-    return S(f) === m;
+    return v(f) === p;
   }, L.isFragment = function(f) {
-    return S(f) === n;
+    return v(f) === n;
   }, L.isLazy = function(f) {
-    return S(f) === h;
+    return v(f) === x;
   }, L.isMemo = function(f) {
-    return S(f) === x;
+    return v(f) === T;
   }, L.isPortal = function(f) {
-    return S(f) === r;
+    return v(f) === r;
   }, L.isProfiler = function(f) {
-    return S(f) === a;
+    return v(f) === a;
   }, L.isStrictMode = function(f) {
-    return S(f) === o;
+    return v(f) === o;
   }, L.isSuspense = function(f) {
-    return S(f) === g;
+    return v(f) === g;
   }, L.isValidElementType = function(f) {
-    return typeof f == "string" || typeof f == "function" || f === n || f === p || f === a || f === o || f === g || f === b || typeof f == "object" && f !== null && (f.$$typeof === h || f.$$typeof === x || f.$$typeof === s || f.$$typeof === c || f.$$typeof === m || f.$$typeof === u || f.$$typeof === l || f.$$typeof === v || f.$$typeof === y);
-  }, L.typeOf = S, L;
+    return typeof f == "string" || typeof f == "function" || f === n || f === h || f === a || f === o || f === g || f === b || typeof f == "object" && f !== null && (f.$$typeof === x || f.$$typeof === T || f.$$typeof === s || f.$$typeof === c || f.$$typeof === p || f.$$typeof === l || f.$$typeof === d || f.$$typeof === m || f.$$typeof === y);
+  }, L.typeOf = v, L;
 }
-var k = {};
+var I = {};
 /** @license React v16.13.1
  * react-is.development.js
  *
@@ -1152,35 +1152,35 @@ var k = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var kt;
-function dn() {
-  return kt || (kt = 1, process.env.NODE_ENV !== "production" && function() {
-    var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, r = e ? Symbol.for("react.portal") : 60106, n = 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, c = e ? Symbol.for("react.context") : 60110, d = e ? Symbol.for("react.async_mode") : 60111, p = e ? Symbol.for("react.concurrent_mode") : 60111, m = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, b = e ? Symbol.for("react.suspense_list") : 60120, x = e ? Symbol.for("react.memo") : 60115, h = e ? Symbol.for("react.lazy") : 60116, y = e ? Symbol.for("react.block") : 60121, u = e ? Symbol.for("react.fundamental") : 60117, l = e ? Symbol.for("react.responder") : 60118, v = e ? Symbol.for("react.scope") : 60119;
-    function S(R) {
-      return typeof R == "string" || typeof R == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
-      R === n || R === p || R === a || R === o || R === g || R === b || typeof R == "object" && R !== null && (R.$$typeof === h || R.$$typeof === x || R.$$typeof === s || R.$$typeof === c || R.$$typeof === m || R.$$typeof === u || R.$$typeof === l || R.$$typeof === v || R.$$typeof === y);
-    }
-    function A(R) {
-      if (typeof R == "object" && R !== null) {
-        var ve = R.$$typeof;
+var Ut;
+function fn() {
+  return Ut || (Ut = 1, process.env.NODE_ENV !== "production" && function() {
+    var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, r = e ? Symbol.for("react.portal") : 60106, n = 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, c = e ? Symbol.for("react.context") : 60110, u = e ? Symbol.for("react.async_mode") : 60111, h = e ? Symbol.for("react.concurrent_mode") : 60111, p = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, b = e ? Symbol.for("react.suspense_list") : 60120, T = e ? Symbol.for("react.memo") : 60115, x = e ? Symbol.for("react.lazy") : 60116, y = e ? Symbol.for("react.block") : 60121, l = e ? Symbol.for("react.fundamental") : 60117, d = e ? Symbol.for("react.responder") : 60118, m = e ? Symbol.for("react.scope") : 60119;
+    function v(_) {
+      return typeof _ == "string" || typeof _ == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+      _ === n || _ === h || _ === a || _ === o || _ === g || _ === b || typeof _ == "object" && _ !== null && (_.$$typeof === x || _.$$typeof === T || _.$$typeof === s || _.$$typeof === c || _.$$typeof === p || _.$$typeof === l || _.$$typeof === d || _.$$typeof === m || _.$$typeof === y);
+    }
+    function S(_) {
+      if (typeof _ == "object" && _ !== null) {
+        var ve = _.$$typeof;
         switch (ve) {
           case t:
-            var le = R.type;
-            switch (le) {
-              case d:
-              case p:
+            var ue = _.type;
+            switch (ue) {
+              case u:
+              case h:
               case n:
               case a:
               case o:
               case g:
-                return le;
+                return ue;
               default:
-                var Ee = le && le.$$typeof;
+                var Ee = ue && ue.$$typeof;
                 switch (Ee) {
                   case c:
-                  case m:
-                  case h:
+                  case p:
                   case x:
+                  case T:
                   case s:
                     return Ee;
                   default:
@@ -1192,58 +1192,58 @@ function dn() {
         }
       }
     }
-    var f = d, _ = p, C = c, F = s, U = t, B = m, V = n, ee = h, ue = x, Re = r, Ae = 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.")), _e(R) || A(R) === d;
+    var f = u, w = h, C = c, F = s, U = t, B = p, V = n, ee = x, le = T, Ae = r, _e = a, ft = o, Ye = g, ze = !1;
+    function oe(_) {
+      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.")), Ce(_) || S(_) === u;
     }
-    function _e(R) {
-      return A(R) === p;
+    function Ce(_) {
+      return S(_) === h;
     }
-    function ie(R) {
-      return A(R) === c;
+    function ie(_) {
+      return S(_) === c;
     }
-    function ft(R) {
-      return A(R) === s;
+    function mt(_) {
+      return S(_) === s;
     }
-    function Ce(R) {
-      return typeof R == "object" && R !== null && R.$$typeof === t;
+    function Pe(_) {
+      return typeof _ == "object" && _ !== null && _.$$typeof === t;
     }
-    function fe(R) {
-      return A(R) === m;
+    function fe(_) {
+      return S(_) === p;
     }
-    function Fe(R) {
-      return A(R) === n;
+    function Fe(_) {
+      return S(_) === n;
     }
-    function Ve(R) {
-      return A(R) === h;
+    function Ve(_) {
+      return S(_) === x;
     }
-    function We(R) {
-      return A(R) === x;
+    function We(_) {
+      return S(_) === T;
     }
-    function Be(R) {
-      return A(R) === r;
+    function Be(_) {
+      return S(_) === r;
     }
-    function Ge(R) {
-      return A(R) === a;
+    function Xe(_) {
+      return S(_) === a;
     }
-    function Xe(R) {
-      return A(R) === o;
+    function Ge(_) {
+      return S(_) === o;
     }
-    function qe(R) {
-      return A(R) === g;
+    function He(_) {
+      return S(_) === g;
     }
-    k.AsyncMode = f, k.ConcurrentMode = _, k.ContextConsumer = C, k.ContextProvider = F, k.Element = U, k.ForwardRef = B, k.Fragment = V, k.Lazy = ee, k.Memo = ue, k.Portal = Re, k.Profiler = Ae, k.StrictMode = dt, k.Suspense = Ye, k.isAsyncMode = oe, k.isConcurrentMode = _e, k.isContextConsumer = ie, k.isContextProvider = ft, k.isElement = Ce, 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 = S, k.typeOf = A;
-  }()), k;
+    I.AsyncMode = f, I.ConcurrentMode = w, I.ContextConsumer = C, I.ContextProvider = F, I.Element = U, I.ForwardRef = B, I.Fragment = V, I.Lazy = ee, I.Memo = le, I.Portal = Ae, I.Profiler = _e, I.StrictMode = ft, I.Suspense = Ye, I.isAsyncMode = oe, I.isConcurrentMode = Ce, I.isContextConsumer = ie, I.isContextProvider = mt, I.isElement = Pe, I.isForwardRef = fe, I.isFragment = Fe, I.isLazy = Ve, I.isMemo = We, I.isPortal = Be, I.isProfiler = Xe, I.isStrictMode = Ge, I.isSuspense = He, I.isValidElementType = v, I.typeOf = S;
+  }()), I;
 }
-var $t;
-function fn() {
-  return $t || ($t = 1, process.env.NODE_ENV === "production" ? Qe.exports = ln() : Qe.exports = dn()), Qe.exports;
-}
-var mt, Ut;
+var Dt;
 function mn() {
-  if (Ut) return mt;
-  Ut = 1;
-  var e = fn(), t = {
+  return Dt || (Dt = 1, process.env.NODE_ENV === "production" ? Qe.exports = dn() : Qe.exports = fn()), Qe.exports;
+}
+var ht, jt;
+function pn() {
+  if (jt) return ht;
+  jt = 1;
+  var e = mn(), t = {
     childContextTypes: !0,
     contextType: !0,
     contextTypes: !0,
@@ -1278,42 +1278,42 @@ function mn() {
     type: !0
   }, a = {};
   a[e.ForwardRef] = n, a[e.Memo] = o;
-  function s(h) {
-    return e.isMemo(h) ? o : a[h.$$typeof] || t;
+  function s(x) {
+    return e.isMemo(x) ? o : a[x.$$typeof] || t;
   }
-  var c = Object.defineProperty, d = Object.getOwnPropertyNames, p = Object.getOwnPropertySymbols, m = Object.getOwnPropertyDescriptor, g = Object.getPrototypeOf, b = Object.prototype;
-  function x(h, y, u) {
+  var c = Object.defineProperty, u = Object.getOwnPropertyNames, h = Object.getOwnPropertySymbols, p = Object.getOwnPropertyDescriptor, g = Object.getPrototypeOf, b = Object.prototype;
+  function T(x, y, l) {
     if (typeof y != "string") {
       if (b) {
-        var l = g(y);
-        l && l !== b && x(h, l, u);
+        var d = g(y);
+        d && d !== b && T(x, d, l);
       }
-      var v = d(y);
-      p && (v = v.concat(p(y)));
-      for (var S = s(h), A = s(y), f = 0; f < v.length; ++f) {
-        var _ = v[f];
-        if (!r[_] && !(u && u[_]) && !(A && A[_]) && !(S && S[_])) {
-          var C = m(y, _);
+      var m = u(y);
+      h && (m = m.concat(h(y)));
+      for (var v = s(x), S = s(y), f = 0; f < m.length; ++f) {
+        var w = m[f];
+        if (!r[w] && !(l && l[w]) && !(S && S[w]) && !(v && v[w])) {
+          var C = p(y, w);
           try {
-            c(h, _, C);
+            c(x, w, C);
           } catch {
           }
         }
       }
     }
-    return h;
+    return x;
   }
-  return mt = x, mt;
+  return ht = T, ht;
 }
-mn();
-var pn = !0;
-function hn(e, t, r) {
+pn();
+var hn = !0;
+function vn(e, t, r) {
   var n = "";
   return r.split(" ").forEach(function(o) {
     e[o] !== void 0 ? t.push(e[o] + ";") : o && (n += o + " ");
   }), n;
 }
-var nr = function(t, r, n) {
+var or = function(t, r, n) {
   var o = t.key + "-" + r.name;
   // we only need to add the styles to the registered cache if the
   // class name could be used further down
@@ -1324,9 +1324,9 @@ var nr = function(t, r, n) {
   // in node since emotion-server relies on whether a style is in
   // the registered cache to know whether a style is global or not
   // also, note that this check will be dead code eliminated in the browser
-  pn === !1) && t.registered[o] === void 0 && (t.registered[o] = r.styles);
-}, vn = function(t, r, n) {
-  nr(t, r, n);
+  hn === !1) && t.registered[o] === void 0 && (t.registered[o] = r.styles);
+}, En = function(t, r, n) {
+  or(t, r, n);
   var o = t.key + "-" + r.name;
   if (t.inserted[r.name] === void 0) {
     var a = r;
@@ -1335,7 +1335,7 @@ var nr = function(t, r, n) {
     while (a !== void 0);
   }
 };
-function En(e) {
+function gn(e) {
   for (var t = 0, r, n = 0, o = e.length; o >= 4; ++n, o -= 4)
     r = e.charCodeAt(n) & 255 | (e.charCodeAt(++n) & 255) << 8 | (e.charCodeAt(++n) & 255) << 16 | (e.charCodeAt(++n) & 255) << 24, r = /* Math.imul(k, m): */
     (r & 65535) * 1540483477 + ((r >>> 16) * 59797 << 16), r ^= /* k >>> r: */
@@ -1354,7 +1354,7 @@ function En(e) {
   return t ^= t >>> 13, t = /* Math.imul(h, m): */
   (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16), ((t ^ t >>> 15) >>> 0).toString(36);
 }
-var gn = {
+var bn = {
   animationIterationCount: 1,
   aspectRatio: 1,
   borderImageOutset: 1,
@@ -1403,18 +1403,18 @@ var gn = {
   strokeMiterlimit: 1,
   strokeOpacity: 1,
   strokeWidth: 1
-}, bn = /[A-Z]|^ms/g, yn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, or = function(t) {
+}, yn = /[A-Z]|^ms/g, xn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, ir = function(t) {
   return t.charCodeAt(1) === 45;
-}, Dt = function(t) {
+}, Yt = function(t) {
   return t != null && typeof t != "boolean";
-}, pt = /* @__PURE__ */ en(function(e) {
-  return or(e) ? e : e.replace(bn, "-$&").toLowerCase();
-}), jt = function(t, r) {
+}, vt = /* @__PURE__ */ tn(function(e) {
+  return ir(e) ? e : e.replace(yn, "-$&").toLowerCase();
+}), zt = function(t, r) {
   switch (t) {
     case "animation":
     case "animationName":
       if (typeof r == "string")
-        return r.replace(yn, function(n, o, a) {
+        return r.replace(xn, function(n, o, a) {
           return re = {
             name: o,
             styles: a,
@@ -1422,7 +1422,7 @@ var gn = {
           }, o;
         });
   }
-  return gn[t] !== 1 && !or(t) && typeof r == "number" && r !== 0 ? r + "px" : r;
+  return bn[t] !== 1 && !ir(t) && typeof r == "number" && r !== 0 ? r + "px" : r;
 };
 function De(e, t, r) {
   if (r == null)
@@ -1454,20 +1454,20 @@ function De(e, t, r) {
         var c = a.styles + ";";
         return c;
       }
-      return xn(e, t, r);
+      return Sn(e, t, r);
     }
     case "function": {
       if (e !== void 0) {
-        var d = re, p = r(e);
-        return re = d, De(e, t, p);
+        var u = re, h = r(e);
+        return re = u, De(e, t, h);
       }
       break;
     }
   }
-  var m = r;
-  return m;
+  var p = r;
+  return p;
 }
-function xn(e, t, r) {
+function Sn(e, t, r) {
   var n = "";
   if (Array.isArray(r))
     for (var o = 0; o < r.length; o++)
@@ -1477,27 +1477,27 @@ function xn(e, t, r) {
       var s = r[a];
       if (typeof s != "object") {
         var c = s;
-        Dt(c) && (n += pt(a) + ":" + jt(a, c) + ";");
+        Yt(c) && (n += vt(a) + ":" + zt(a, c) + ";");
       } else if (Array.isArray(s) && typeof s[0] == "string" && t == null)
-        for (var d = 0; d < s.length; d++)
-          Dt(s[d]) && (n += pt(a) + ":" + jt(a, s[d]) + ";");
+        for (var u = 0; u < s.length; u++)
+          Yt(s[u]) && (n += vt(a) + ":" + zt(a, s[u]) + ";");
       else {
-        var p = De(e, t, s);
+        var h = De(e, t, s);
         switch (a) {
           case "animation":
           case "animationName": {
-            n += pt(a) + ":" + p + ";";
+            n += vt(a) + ":" + h + ";";
             break;
           }
           default:
-            n += a + "{" + p + "}";
+            n += a + "{" + h + "}";
         }
       }
     }
   return n;
 }
-var Yt = /label:\s*([^\s;{]+)\s*(;|$)/g, re;
-function Sn(e, t, r) {
+var Ft = /label:\s*([^\s;{]+)\s*(;|$)/g, re;
+function Tn(e, t, r) {
   if (e.length === 1 && typeof e[0] == "object" && e[0] !== null && e[0].styles !== void 0)
     return e[0];
   var n = !0, o = "";
@@ -1511,22 +1511,22 @@ function Sn(e, t, r) {
   }
   for (var c = 1; c < e.length; c++)
     if (o += De(r, t, e[c]), n) {
-      var d = a;
-      o += d[c];
+      var u = a;
+      o += u[c];
     }
-  Yt.lastIndex = 0;
-  for (var p = "", m; (m = Yt.exec(o)) !== null; )
-    p += "-" + m[1];
-  var g = En(o) + p;
+  Ft.lastIndex = 0;
+  for (var h = "", p; (p = Ft.exec(o)) !== null; )
+    h += "-" + p[1];
+  var g = gn(o) + h;
   return {
     name: g,
     styles: o,
     next: re
   };
 }
-var Tn = function(t) {
+var wn = function(t) {
   return t();
-}, wn = ce.useInsertionEffect ? ce.useInsertionEffect : !1, Rn = wn || Tn, ir = /* @__PURE__ */ ce.createContext(
+}, Rn = ce.useInsertionEffect ? ce.useInsertionEffect : !1, An = Rn || wn, ar = /* @__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
@@ -1537,63 +1537,63 @@ var Tn = function(t) {
     key: "css"
   }) : null
 );
-ir.Provider;
-var An = function(t) {
-  return /* @__PURE__ */ pr(function(r, n) {
-    var o = Se(ir);
+ar.Provider;
+var _n = function(t) {
+  return /* @__PURE__ */ hr(function(r, n) {
+    var o = Te(ar);
     return t(r, o, n);
   });
-}, _n = /* @__PURE__ */ ce.createContext({}), ut = {}.hasOwnProperty, Et = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", ar = function(t, r) {
+}, Cn = /* @__PURE__ */ ce.createContext({}), ut = {}.hasOwnProperty, bt = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", sr = function(t, r) {
   var n = {};
   for (var o in r)
     ut.call(r, o) && (n[o] = r[o]);
-  return n[Et] = t, n;
-}, Cn = function(t) {
+  return n[bt] = t, n;
+}, Pn = function(t) {
   var r = t.cache, n = t.serialized, o = t.isStringTag;
-  return nr(r, n, o), Rn(function() {
-    return vn(r, n, o);
+  return or(r, n, o), An(function() {
+    return En(r, n, o);
   }), null;
-}, Pn = /* @__PURE__ */ An(function(e, t, r) {
+}, Nn = /* @__PURE__ */ _n(function(e, t, r) {
   var n = e.css;
   typeof n == "string" && t.registered[n] !== void 0 && (n = t.registered[n]);
-  var o = e[Et], a = [n], s = "";
-  typeof e.className == "string" ? s = hn(t.registered, a, e.className) : e.className != null && (s = e.className + " ");
-  var c = Sn(a, void 0, ce.useContext(_n));
+  var o = e[bt], a = [n], s = "";
+  typeof e.className == "string" ? s = vn(t.registered, a, e.className) : e.className != null && (s = e.className + " ");
+  var c = Tn(a, void 0, ce.useContext(Cn));
   s += t.key + "-" + c.name;
-  var d = {};
-  for (var p in e)
-    ut.call(e, p) && p !== "css" && p !== Et && (d[p] = e[p]);
-  return d.className = s, r && (d.ref = r), /* @__PURE__ */ ce.createElement(ce.Fragment, null, /* @__PURE__ */ ce.createElement(Cn, {
+  var u = {};
+  for (var h in e)
+    ut.call(e, h) && h !== "css" && h !== bt && (u[h] = e[h]);
+  return u.className = s, r && (u.ref = r), /* @__PURE__ */ ce.createElement(ce.Fragment, null, /* @__PURE__ */ ce.createElement(Pn, {
     cache: t,
     serialized: c,
     isStringTag: typeof o == "string"
-  }), /* @__PURE__ */ ce.createElement(o, d));
-}), sr = Pn, cr = ke.Fragment, E = function(t, r, n) {
-  return ut.call(r, "css") ? ke.jsx(sr, ar(t, r), n) : ke.jsx(t, r, n);
+  }), /* @__PURE__ */ ce.createElement(o, u));
+}), cr = Nn, lr = Ie.Fragment, E = function(t, r, n) {
+  return ut.call(r, "css") ? Ie.jsx(cr, sr(t, r), n) : Ie.jsx(t, r, n);
 }, $ = function(t, r, n) {
-  return ut.call(r, "css") ? ke.jsxs(sr, ar(t, r), n) : ke.jsxs(t, r, n);
+  return ut.call(r, "css") ? Ie.jsxs(cr, sr(t, r), n) : Ie.jsxs(t, r, n);
 };
-const On = Xt(({ sendBack: e, receive: t, input: r }) => {
+const Mn = Ht(({ sendBack: e, receive: t, input: r }) => {
   const { videoElement: n } = r;
   t((b) => {
-    b.type === "PLAY" && n.play().then(() => o()).catch((x) => {
-      console.error(x);
-    }), b.type === "PAUSE" && (n.pause(), a()), b.type === "SET_TIME" && (n.currentTime = b.value, c()), b.type === "SET_VOLUME" && (n.volume = b.volume, n.muted = b.muted, d()), b.type === "SET_PLAYBACK_RATE" && (n.playbackRate = b.playbackRate, p());
+    b.type === "PLAY" && n.play().then(() => o()).catch((T) => {
+      console.error(T);
+    }), b.type === "PAUSE" && (n.pause(), a()), b.type === "SET_TIME" && (n.currentTime = b.value, c()), b.type === "SET_VOLUME" && (n.volume = b.volume, n.muted = b.muted, u()), b.type === "SET_PLAYBACK_RATE" && (n.playbackRate = b.playbackRate, h());
   });
-  const o = () => e({ type: "PLAYING" }), a = () => e({ type: "PAUSED" }), s = () => e({ type: "ENDED" }), c = () => e({ type: "TIME_UPDATE", currentTime: n.currentTime }), d = () => e({ type: "VOLUME_UPDATE", muted: n.muted, volume: n.volume }), p = () => e({ type: "PLAYBACK_RATE_UPDATE", playbackRate: n.playbackRate }), m = () => e({ type: "SEEKING", currentTime: n.currentTime }), g = () => e({ type: "DURATION_UPDATE", duration: n.duration });
-  return n.addEventListener("play", o), n.addEventListener("pause", a), n.addEventListener("ended", s), n.addEventListener("timeupdate", c), n.addEventListener("volumechange", d), n.addEventListener("ratechange", p), n.addEventListener("seeking", m), n.addEventListener("durationchange", g), () => {
-    n.removeEventListener("play", o), n.removeEventListener("pause", a), n.removeEventListener("ended", s), n.removeEventListener("timeupdate", c), n.removeEventListener("volumechange", d), n.removeEventListener("ratechange", p), n.removeEventListener("seeking", m), n.removeEventListener("durationchange", g);
+  const o = () => e({ type: "PLAYING" }), a = () => e({ type: "PAUSED" }), s = () => e({ type: "ENDED" }), c = () => e({ type: "TIME_UPDATE", currentTime: n.currentTime }), u = () => e({ type: "VOLUME_UPDATE", muted: n.muted, volume: n.volume }), h = () => e({ type: "PLAYBACK_RATE_UPDATE", playbackRate: n.playbackRate }), p = () => e({ type: "SEEKING", currentTime: n.currentTime }), g = () => e({ type: "DURATION_UPDATE", duration: n.duration });
+  return n.addEventListener("play", o), n.addEventListener("pause", a), n.addEventListener("ended", s), n.addEventListener("timeupdate", c), n.addEventListener("volumechange", u), n.addEventListener("ratechange", h), n.addEventListener("seeking", p), n.addEventListener("durationchange", g), () => {
+    n.removeEventListener("play", o), n.removeEventListener("pause", a), n.removeEventListener("ended", s), n.removeEventListener("timeupdate", c), n.removeEventListener("volumechange", u), n.removeEventListener("ratechange", h), n.removeEventListener("seeking", p), n.removeEventListener("durationchange", g);
   };
-}), lt = (e) => Xt((...t) => {
+}), dt = (e) => Ht((...t) => {
   const r = e(...t);
   return () => {
     r.then((n) => n?.());
   };
-}), zt = (e) => Array(e.buffered.length).fill(void 0).map((t, r) => ({
+}), Vt = (e) => Array(e.buffered.length).fill(void 0).map((t, r) => ({
   index: r,
   start: e.buffered.start(r),
   end: e.buffered.end(r)
-})), Ft = (e, t, r) => {
+})), Wt = (e, t, r) => {
   const n = (c) => {
     t(c), s();
   }, o = (c) => {
@@ -1604,39 +1604,39 @@ const On = Xt(({ sendBack: e, receive: t, input: r }) => {
     e.removeEventListener("updateend", n), e.removeEventListener("abort", o), e.removeEventListener("error", a);
   };
   e.addEventListener("updateend", n, { once: !0 }), e.addEventListener("abort", o, { once: !0 }), e.addEventListener("error", a, { once: !0 });
-}, Nn = (e) => {
+}, On = (e) => {
   const t = new qt({ concurrency: 1 });
   return {
     appendBuffer: (a) => t.add(
       () => new Promise((s, c) => {
-        Ft(e, s, c), e.appendBuffer(a);
+        Wt(e, s, c), e.appendBuffer(a);
       })
     ),
     unbufferRange: async (a, s) => t.add(
-      () => new Promise((c, d) => {
-        Ft(e, c, d), e.remove(a, s);
+      () => new Promise((c, u) => {
+        Wt(e, c, u), e.remove(a, s);
       })
     ),
     updateTimestampOffset: (a) => t.add(() => {
       e.timestampOffset = a;
     })
   };
-}, Mn = -20, In = 60, Ln = 30, kn = lt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
-  const { videoElement: a, preEvictionTime: s, postEvictionTime: c, bufferTargetTime: d } = r, p = () => console.error(a.error);
-  a.addEventListener("error", p);
-  const m = new MediaSource(), g = URL.createObjectURL(m);
+}, kn = -20, Ln = 60, In = 30, $n = dt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
+  const { videoElement: a, preEvictionTime: s, postEvictionTime: c, bufferTargetTime: u } = r, h = () => console.error(a.error);
+  a.addEventListener("error", h);
+  const p = new MediaSource(), g = URL.createObjectURL(p);
   a.src = g;
-  const b = () => a.currentTime + (s ?? Mn), x = () => a.currentTime + (c ?? In), h = () => a.currentTime + (d ?? Ln);
+  const b = () => a.currentTime + (s ?? kn), T = () => a.currentTime + (c ?? Ln), x = () => a.currentTime + (u ?? In);
   let y;
-  const u = await new Promise(
-    (U) => m.addEventListener(
+  const l = await new Promise(
+    (U) => p.addEventListener(
       "sourceopen",
       () => {
         let B = !1;
         t((V) => {
           if (!B && V.type === "METADATA") {
-            const ee = m.addSourceBuffer(`video/mp4; codecs="${V.info.input.videoMimeType},${V.info.input.audioMimeType}"`);
-            ee.mode = "segments", m.duration = V.info.input.duration, y = V.data, B = !0, U(ee);
+            const ee = p.addSourceBuffer(`video/mp4; codecs="${[V.info.output.videoMimeType, V.info.output.audioMimeType].filter(Boolean).join(",")}"`);
+            ee.mode = "segments", p.duration = V.info.input.duration, y = V.data, B = !0, U(ee);
           }
         });
       },
@@ -1644,100 +1644,100 @@ const On = Xt(({ sendBack: e, receive: t, input: r }) => {
     )
   );
   if (!y) throw new Error("No header buffer");
-  const { appendBuffer: l, unbufferRange: v, updateTimestampOffset: S } = Nn(u);
-  l(y), t(async (U) => {
-    U.type === "DATA" ? await l(U.data) : U.type === "TIMESTAMP_OFFSET" && await S(U.timestampOffset);
+  const { appendBuffer: d, unbufferRange: m, updateTimestampOffset: v } = On(l);
+  d(y), t(async (U) => {
+    U.type === "DATA" ? await d(U.data) : U.type === "TIMESTAMP_OFFSET" && await v(U.timestampOffset);
   });
-  const A = async () => {
-    const U = b(), B = x(), V = zt(u);
-    for (const { start: ee, end: ue } of V)
-      ee < U && await v(
+  const S = async () => {
+    const U = b(), B = T(), V = Vt(l);
+    for (const { start: ee, end: le } of V)
+      ee < U && await m(
         ee,
         U
-      ), ue > B && await v(
+      ), le > B && await m(
         B,
-        ue
+        le
       );
   }, f = setInterval(async () => {
-    await A();
-    const U = zt(u);
-    Math.max(...U.map(({ end: V }) => V)) < h() && e({ type: "NEED_DATA" });
-  }, 100), _ = () => e({ type: "SOURCE_OPEN" }), C = () => e({ type: "SOURCE_ENDED" }), F = () => e({ type: "SOURCE_ERROR" });
-  return m.addEventListener("sourceopen", _), m.addEventListener("sourceended", C), m.addEventListener("error", F), () => {
-    URL.revokeObjectURL(g), clearInterval(f), a.removeEventListener("error", p), m.removeEventListener("sourceopen", _), m.removeEventListener("sourceended", C), m.removeEventListener("error", F);
+    await S();
+    const U = Vt(l);
+    Math.max(...U.map(({ end: V }) => V)) < x() && e({ type: "NEED_DATA" });
+  }, 100), w = () => e({ type: "SOURCE_OPEN" }), C = () => e({ type: "SOURCE_ENDED" }), F = () => e({ type: "SOURCE_ERROR" });
+  return p.addEventListener("sourceopen", w), p.addEventListener("sourceended", C), p.addEventListener("error", F), () => {
+    URL.revokeObjectURL(g), clearInterval(f), a.removeEventListener("error", h), p.removeEventListener("sourceopen", w), p.removeEventListener("sourceended", C), p.removeEventListener("error", F);
   };
-}), $n = (e, t) => {
+}), Un = (e, t) => {
   let r, n, o;
-  const a = (s, c, d) => (p) => {
-    const m = performance.now();
+  const a = (s, c, u) => (h) => {
+    const p = performance.now();
     return setTimeout(() => {
       if (!o) {
         r = void 0, n = void 0;
         return;
       }
       const g = (async () => t(...o))();
-      o = void 0, g.then(c).catch((h) => {
-        console.error(h), d(h);
+      o = void 0, g.then(c).catch((x) => {
+        console.error(x), u(x);
       });
-      let b, x;
-      n = new Promise((h, y) => {
-        b = h, x = y;
-      }), r = g.then(a(m, b, x)).catch((h) => (console.error(h), a(s, b, x)(h)));
-    }, e - (m - s)), p;
+      let b, T;
+      n = new Promise((x, y) => {
+        b = x, T = y;
+      }), r = g.then(a(p, b, T)).catch((x) => (console.error(x), a(s, b, T)(x)));
+    }, e - (p - s)), h;
   };
   return (...s) => {
     if (o = s, r)
       return n;
     {
-      const c = performance.now(), d = (async () => t(...s))();
+      const c = performance.now(), u = (async () => t(...s))();
       o = void 0;
-      let p, m;
+      let h, p;
       return n = new Promise((g, b) => {
-        p = g, m = b;
-      }), r = d.then(a(c, p, m)).catch((g) => (console.error(g), a(c, p, m)(g))), d;
+        h = g, p = b;
+      }), r = u.then(a(c, h, p)).catch((g) => (console.error(g), a(c, h, p)(g))), u;
     }
   };
-}, Un = lt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
-  const { remuxerOptions: a } = r, { publicPath: s, workerUrl: c, bufferSize: d, length: p, read: m } = a, g = await Ht({
+}, Dn = dt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
+  const { remuxerOptions: a } = r, { publicPath: s, workerUrl: c, bufferSize: u, length: h, read: p } = a, g = await Kt({
     publicPath: s,
     workerUrl: c,
-    bufferSize: d,
-    length: p,
-    read: m
+    bufferSize: u,
+    length: h,
+    read: p
   }), b = await g.init();
   b.indexes && e({ type: "INDEXES", indexes: b.indexes }), b.attachments?.length && e({ type: "NEW_ATTACHMENTS", attachments: b.attachments }), b.subtitles?.length && e({ type: "NEW_SUBTITLE_FRAGMENTS", subtitles: b.subtitles }), e({ type: "METADATA", ...b });
-  let x = !1, h = [];
-  const y = $n(100, async () => {
-    if (!(h.length || x))
+  let T = !1, x = [];
+  const y = Un(100, async () => {
+    if (!(x.length || T))
       try {
-        const { data: u, subtitles: l, finished: v } = await g.read();
-        v && (x = !0), l.length && e({ type: "NEW_SUBTITLE_FRAGMENTS", subtitles: l }), e({ type: "DATA", data: u });
-      } catch (u) {
-        if (u.message === "Cancelled") return;
-        console.error(u);
+        const { data: l, subtitles: d, finished: m } = await g.read();
+        m && (T = !0), d.length && e({ type: "NEW_SUBTITLE_FRAGMENTS", subtitles: d }), e({ type: "DATA", data: l });
+      } catch (l) {
+        if (l.message === "Cancelled") return;
+        console.error(l);
       }
   });
-  return t(async (u) => {
-    if (u.type === "NEED_DATA")
+  return t(async (l) => {
+    if (l.type === "NEED_DATA")
       y();
-    else if (u.type === "SEEKING") {
-      x = !1;
-      const { currentTime: l } = u, v = { currentTime: l };
-      h = [...h, v];
+    else if (l.type === "SEEKING") {
+      T = !1;
+      const { currentTime: d } = l, m = { currentTime: d };
+      x = [...x, m];
       try {
-        const { data: S, pts: A } = await g.seek(l).finally(() => {
-          h = h.filter((f) => f !== v);
+        const { data: v, pts: S } = await g.seek(d).finally(() => {
+          x = x.filter((f) => f !== m);
         });
-        e({ type: "TIMESTAMP_OFFSET", timestampOffset: A }), e({ type: "DATA", data: S });
-      } catch (S) {
-        if (S.message === "Cancelled") return;
-        console.error(S);
+        e({ type: "TIMESTAMP_OFFSET", timestampOffset: S }), e({ type: "DATA", data: v });
+      } catch (v) {
+        if (v.message === "Cancelled") return;
+        console.error(v);
       }
     }
   }), () => {
     g.destroy();
   };
-}), Vt = (e) => new Date(e).toISOString().slice(11, 22), Wt = (e, t) => {
+}), Bt = (e) => new Date(e).toISOString().slice(11, 22), Xt = (e, t) => {
   e.createStyle({
     ...t,
     SecondaryColour: Number(t.SecondaryColour),
@@ -1766,7 +1766,7 @@ const On = Xt(({ sendBack: e, receive: t, input: r }) => {
     MarginV: Number(t.MarginV),
     Encoding: Number(t.Encoding)
   });
-}, Dn = (e) => {
+}, jn = (e) => {
   const t = e.content.match(/\r\n\[Events\]\r\nFormat: (.*)/)?.[0], r = t?.trim().split(`
 `)[1];
   if (!t || !r)
@@ -1779,173 +1779,178 @@ const On = Xt(({ sendBack: e, receive: t, input: r }) => {
     dialogueFormatContent: r,
     parsed: Le(e.content)
   };
-}, jn = (e, t) => {
-  const [r, n] = t.content.split(","), o = Number(r), a = Vt(t.start), s = Vt(t.end), c = t.content.replace(`${o},${n},`, ""), d = `Dialogue: ${n},${a},${s},${c}`, m = Le(`${e.eventsContent}\r
-${d}`).events.dialogue[0];
-  if (!m)
+}, Yn = (e, t) => {
+  const [r, n] = t.content.split(","), o = Number(r), a = Bt(t.start), s = Bt(t.end), c = t.content.replace(`${o},${n},`, ""), u = `Dialogue: ${n},${a},${s},${c}`, p = Le(`${e.eventsContent}\r
+${u}`).events.dialogue[0];
+  if (!p)
     throw new Error("dialogueEvent is undefined");
   return {
     type: "dialogue",
     streamIndex: t.streamIndex,
     index: o,
-    content: d,
+    content: u,
     parsed: Le(`${e.eventsContent}\r
-${d}`),
+${u}`),
     assEvent: {
-      ...m,
-      Effect: m.Effect ?? "",
-      Text: m.Text.raw,
-      Duration: (m.End - m.Start) * 1e3,
-      Start: m.Start * 1e3,
-      End: m.End * 1e3,
+      ...p,
+      Effect: p.Effect ?? "",
+      Text: p.Text.raw,
+      Duration: (p.End - p.Start) * 1e3,
+      Start: p.Start * 1e3,
+      End: p.End * 1e3,
       ReadOrder: o,
       _index: o
     }
   };
-}, Yn = lt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
-  const { publicPath: a, subtitlesRendererOptions: s, videoElement: c, canvasElement: d } = r;
-  let p = [], m;
+}, zn = dt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
+  const { publicPath: a, subtitlesRendererOptions: s, videoElement: c, canvasElement: u } = r;
+  let h = [], p;
   const g = /* @__PURE__ */ new Map();
-  let b = [], x;
-  return t((h) => {
-    if (h.type === "SELECT_SUBTITLE_STREAM") {
-      if (x = h.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: h.streamIndex }), !m) return;
-      m.freeTrack(), b = [];
-      const y = g.get(x);
-      if (!y)
+  let b = [], T;
+  const x = setInterval(() => {
+    p && p.setCurrentTime(c.paused, c.currentTime, c.playbackRate);
+  }, 100);
+  return t((y) => {
+    if (y.type === "TIME_UPDATE" && p && p.setCurrentTime(c.paused, y.currentTime, c.playbackRate), y.type === "SELECT_SUBTITLE_STREAM") {
+      if (T = y.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: y.streamIndex }), !p || (p.freeTrack(), p.setCurrentTime(c.paused, c.currentTime, c.playbackRate), T === void 0))
+        return;
+      b = [];
+      const l = g.get(T);
+      if (!l)
         throw new Error("newSubtitleStreams is undefined");
-      const u = Le(y.header.content), l = {
-        ...u,
+      const d = Le(l.header.content), m = {
+        ...d,
         info: {
-          ...u.info,
+          ...d.info,
           ScaledBorderAndShadow: "no",
           LayoutResX: "",
           LayoutResY: ""
         }
-      }, v = _t(l);
-      m.setTrack(v), m.setCurrentTime(c.paused, c.currentTime, c.playbackRate);
-      for (const S in y.header.parsed.styles) {
-        const A = y.header.parsed.styles.style[Number(S)];
-        A && Wt(m, A);
+      }, v = Pt(m);
+      p.setTrack(v), p.setCurrentTime(c.paused, c.currentTime, c.playbackRate);
+      for (const S in l.header.parsed.styles) {
+        const f = l.header.parsed.styles.style[Number(S)];
+        f && Xt(p, f);
       }
-      for (const S of y?.dialogues ?? [])
-        b.filter((f) => f.type === "dialogue").find(
-          (f) => f.streamIndex === S.streamIndex && f.index === S.index
-        ) || x !== S.streamIndex || (m?.createEvent(S.assEvent), b.push(S));
-    }
-    if (h.type === "NEW_SUBTITLE_FRAGMENTS") {
-      const y = h.subtitles.map((u) => {
-        if (u.type === "header") {
-          const l = Dn(u);
-          return g.set(u.streamIndex, { header: l, dialogues: [] }), x === void 0 && (x = u.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: u.streamIndex })), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), l;
+      for (const S of l?.dialogues ?? [])
+        b.filter((w) => w.type === "dialogue").find(
+          (w) => w.streamIndex === S.streamIndex && w.index === S.index
+        ) || T !== S.streamIndex || (p?.createEvent(S.assEvent), b.push(S));
+    }
+    if (y.type === "NEW_SUBTITLE_FRAGMENTS") {
+      const l = y.subtitles.map((d) => {
+        if (d.type === "header") {
+          const m = jn(d);
+          return g.set(d.streamIndex, { header: m, dialogues: [] }), T === void 0 && (T = d.streamIndex, e({ type: "SELECTED_SUBTITLE_STREAM_UPDATED", streamIndex: d.streamIndex })), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), m;
         } else {
-          const l = g.get(u.streamIndex)?.header;
-          if (!l)
+          const m = g.get(d.streamIndex)?.header;
+          if (!m)
             throw new Error("SubtitleStream or its header is undefined");
-          const v = jn(l, u);
-          return g.get(u.streamIndex)?.dialogues.push(v), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), v;
+          const v = Yn(m, d);
+          return g.get(d.streamIndex)?.dialogues.push(v), e({ type: "SUBTITLE_STREAMS_UPDATED", subtitlesStreams: [...g.values()] }), v;
         }
       });
-      for (const u of y)
-        if (u.type === "dialogue") {
+      for (const d of l)
+        if (d.type === "dialogue") {
           if (b.filter((v) => v.type === "dialogue").find(
-            (v) => v.streamIndex === u.streamIndex && v.index === u.index
-          ) || x !== u.streamIndex)
+            (v) => v.streamIndex === d.streamIndex && v.index === d.index
+          ) || T !== d.streamIndex)
             continue;
-          m?.createEvent(u.assEvent), b.push(u);
-        } else if (u.type === "header") {
-          if (!m) {
-            const l = Le(u.content), v = {
-              ...l,
+          p?.createEvent(d.assEvent), b.push(d);
+        } else if (d.type === "header") {
+          if (!p) {
+            const m = Le(d.content), v = {
+              ...m,
               info: {
-                ...l.info,
+                ...m.info,
                 ScaledBorderAndShadow: "no",
                 LayoutResX: "",
                 LayoutResY: ""
               }
-            }, S = _t(v);
-            m = new br({
+            }, S = Pt(v);
+            p = new yr({
+              onDemandRender: !1,
               video: c,
-              canvas: d,
+              canvas: u,
               subContent: S,
               workerUrl: s.workerUrl,
               modernWasmUrl: s.wasmUrl,
-              fonts: p.filter(Boolean).map(([A, f]) => f),
-              availableFonts: { ...Object.fromEntries(p), "liberation sans": `${a}default.woff2` }
+              fonts: h.filter(Boolean).map(([f, w]) => w),
+              availableFonts: { ...Object.fromEntries(h), "liberation sans": `${a}default.woff2` }
               // fallbackFont: 'liberation sans',
             });
           }
-          for (const l in u.parsed.styles) {
-            const v = u.parsed.styles.style[Number(l)];
-            v && Wt(m, v);
+          for (const m in d.parsed.styles) {
+            const v = d.parsed.styles.style[Number(m)];
+            v && Xt(p, v);
           }
         } else
           throw new Error("Unknown subtitlePart type");
     }
-    h.type === "NEW_ATTACHMENTS" && (p = h.attachments.map((y) => [
-      y.filename,
-      new Uint8Array(y.data)
+    y.type === "NEW_ATTACHMENTS" && (h = y.attachments.map((l) => [
+      l.filename,
+      new Uint8Array(l.data)
     ]));
   }), () => {
-    m?.destroy();
+    clearInterval(x), p?.destroy();
   };
-}), zn = lt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
-  const { remuxerOptions: a } = r, { publicPath: s, workerUrl: c, bufferSize: d, length: p, read: m } = a;
+}), Fn = dt(async ({ sendBack: e, receive: t, input: r, self: n, emit: o }) => {
+  const { remuxerOptions: a } = r, { publicPath: s, workerUrl: c, bufferSize: u, length: h, read: p } = a;
   let g;
-  const b = new Promise((v) => {
-    g = v;
+  const b = new Promise((m) => {
+    g = m;
   });
-  t(async (v) => {
-    await b, v.type === "DOWNLOADED_RANGES_UPDATED" && h.indexes.reduce((f, _) => {
+  t(async (m) => {
+    await b, m.type === "DOWNLOADED_RANGES_UPDATED" && x.indexes.reduce((f, w) => {
       const C = f.at(-1);
-      if (C && _.timestamp - C.timestamp < 5)
+      if (C && w.timestamp - C.timestamp < 5)
         return f;
       {
-        const F = h.indexes.slice(_.index + 1).find((U) => U.timestamp > _.timestamp + 5);
-        return F ? [...f, { ..._, duration: F.timestamp - _.timestamp }] : [...f, _];
+        const F = x.indexes.slice(w.index + 1).find((U) => U.timestamp > w.timestamp + 5);
+        return F ? [...f, { ...w, duration: F.timestamp - w.timestamp }] : [...f, w];
       }
     }, []).filter((f) => {
-      const _ = h.indexes.at(f.index + 1), C = _ ? _.pos : a.length, F = f.pos;
-      return v.downloadedRanges.some(
+      const w = x.indexes.at(f.index + 1), C = w ? w.pos : a.length, F = f.pos;
+      return m.downloadedRanges.some(
         ({ startByteOffset: B, endByteOffset: V }) => B <= F && C <= V
       );
-    }).sort((f, _) => f.timestamp - _.timestamp).forEach((f) => l(f));
+    }).sort((f, w) => f.timestamp - w.timestamp).forEach((f) => d(f));
   });
-  const x = await Ht({
+  const T = await Kt({
     publicPath: s,
     workerUrl: c,
-    bufferSize: d,
-    length: p,
-    read: m
-  }), h = await x.init(), y = new qt({ concurrency: 1 });
-  let u = [];
-  const l = (v) => y.add(async () => {
-    if (u.find((U) => U.index.index === v.index)) return;
-    const S = await x.readKeyframe(v.timestamp), A = new Blob([S], { type: "image/png" }), f = URL.createObjectURL(A), _ = h.indexes.at(v.index + 1), C = _ ? _.timestamp - v.timestamp : h.info.input.duration - v.timestamp, F = {
-      blob: A,
+    bufferSize: u,
+    length: h,
+    read: p
+  }), x = await T.init(), y = new qt({ concurrency: 1 });
+  let l = [];
+  const d = (m) => y.add(async () => {
+    if (l.find((U) => U.index.index === m.index)) return;
+    const v = await T.readKeyframe(m.timestamp), S = new Blob([v], { type: "image/png" }), f = URL.createObjectURL(S), w = x.indexes.at(m.index + 1), C = w ? w.timestamp - m.timestamp : x.info.input.duration - m.timestamp, F = {
+      blob: S,
       url: f,
-      timestamp: v.timestamp,
-      duration: v.duration ?? C,
-      index: v
+      timestamp: m.timestamp,
+      duration: m.duration ?? C,
+      index: m
     };
-    u.push(F), e({ type: "NEW_THUMBNAIL", thumbnail: F });
+    l.push(F), e({ type: "NEW_THUMBNAIL", thumbnail: F });
   });
   return g(), () => {
-    x.destroy();
+    T.destroy();
   };
-}), Fn = Er({
+}), Vn = gr({
   types: {},
   actions: {
-    isReady: gr(({ context: e, enqueue: t }) => {
+    isReady: br(({ context: e, enqueue: t }) => {
       e.videoElement && e.canvasElement && e.remuxerOptions && e.subtitlesRendererOptions && e.mediaSourceOptions && t.raise({ type: "IS_READY" });
     })
   },
   actors: {
-    mediaLogic: On,
-    mediaSourceLogic: kn,
-    dataSourceLogic: Un,
-    thumbnailsLogic: zn,
-    subtitlesLogic: Yn
+    mediaLogic: Mn,
+    mediaSourceLogic: $n,
+    dataSourceLogic: Dn,
+    thumbnailsLogic: Fn,
+    subtitlesLogic: zn
   }
 }).createMachine({
   context: {
@@ -1974,7 +1979,7 @@ ${d}`),
   on: {
     SET_VIDEO_ELEMENT: {
       actions: [
-        Y({
+        z({
           videoElement: ({ event: e }) => e.videoElement
         }),
         { type: "isReady" }
@@ -1982,7 +1987,7 @@ ${d}`),
     },
     SET_CANVAS_ELEMENT: {
       actions: [
-        Y({
+        z({
           canvasElement: ({ event: e }) => e.canvasElement
         }),
         { type: "isReady" }
@@ -1990,7 +1995,7 @@ ${d}`),
     },
     IS_READY: {
       target: ".OK",
-      actions: Y({ isReady: () => !0 })
+      actions: z({ isReady: () => !0 })
     }
   },
   states: {
@@ -1998,7 +2003,7 @@ ${d}`),
       on: {
         MEDIA_SOURCE_OPTIONS: {
           actions: [
-            Y({
+            z({
               mediaSourceOptions: ({ event: e }) => e.mediaSourceOptions
             }),
             { type: "isReady" }
@@ -2006,7 +2011,7 @@ ${d}`),
         },
         REMUXER_OPTIONS: {
           actions: [
-            Y({
+            z({
               remuxerOptions: ({ event: e }) => e.remuxerOptions
             }),
             { type: "isReady" }
@@ -2014,7 +2019,7 @@ ${d}`),
         },
         SUBTITLES_RENDERER_OPTIONS: {
           actions: [
-            Y({
+            z({
               subtitlesRendererOptions: ({ event: e }) => e.subtitlesRendererOptions
             }),
             { type: "isReady" }
@@ -2057,57 +2062,60 @@ ${d}`),
         }
       ],
       on: {
-        PLAY: { actions: H("media", ({ event: e }) => e) },
-        PAUSE: { actions: H("media", ({ event: e }) => e) },
-        SET_TIME: { actions: H("media", ({ event: e }) => e) },
-        SET_PLAYBACK_RATE: { actions: H("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: H("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: H("dataSource", ({ event: e }) => e) },
-        METADATA: { actions: H("mediaSource", ({ event: e }) => e) },
-        SEEKING: { actions: H("dataSource", ({ event: e }) => e) },
-        DATA: { actions: H("mediaSource", ({ event: e }) => e) },
-        TIMESTAMP_OFFSET: { actions: H("mediaSource", ({ event: e }) => e) },
-        NEW_THUMBNAIL: { actions: [Y({ thumbnails: ({ context: e, event: t }) => [...e.thumbnails, t.thumbnail] })] },
-        DOWNLOADED_RANGES_UPDATED: { actions: H("thumbnails", ({ event: e }) => e) },
+        PLAY: { actions: G("media", ({ event: e }) => e) },
+        PAUSE: { actions: G("media", ({ event: e }) => e) },
+        SET_TIME: { actions: G("media", ({ event: e }) => e) },
+        SET_PLAYBACK_RATE: { actions: G("media", ({ event: e }) => e) },
+        PLAYING: { actions: z({ media: ({ context: e }) => ({ ...e.media, paused: !1 }) }) },
+        PAUSED: { actions: z({ media: ({ context: e }) => ({ ...e.media, paused: !0 }) }) },
+        ENDED: { actions: z({ media: ({ context: e }) => ({ ...e.media, paused: !0 }) }) },
+        TIME_UPDATE: { actions: [
+          z({ media: ({ context: e, event: t }) => ({ ...e.media, currentTime: t.currentTime }) }),
+          G("subtitles", ({ event: e }) => e)
+        ] },
+        VOLUME_UPDATE: { actions: z({ media: ({ context: e, event: t }) => ({ ...e.media, muted: t.muted, volume: t.volume }) }) },
+        SET_VOLUME: { actions: G("media", ({ event: e }) => e) },
+        PLAYBACK_RATE_UPDATE: { actions: z({ media: ({ context: e, event: t }) => ({ ...e.media, playbackRate: t.playbackRate }) }) },
+        DURATION_UPDATE: { actions: z({ media: ({ context: e, event: t }) => ({ ...e.media, duration: t.duration }) }) },
+        NEED_DATA: { actions: G("dataSource", ({ event: e }) => e) },
+        METADATA: { actions: G("mediaSource", ({ event: e }) => e) },
+        SEEKING: { actions: G("dataSource", ({ event: e }) => e) },
+        DATA: { actions: G("mediaSource", ({ event: e }) => e) },
+        TIMESTAMP_OFFSET: { actions: G("mediaSource", ({ event: e }) => e) },
+        NEW_THUMBNAIL: { actions: [z({ thumbnails: ({ context: e, event: t }) => [...e.thumbnails, t.thumbnail] })] },
+        DOWNLOADED_RANGES_UPDATED: { actions: G("thumbnails", ({ event: e }) => e) },
         INDEXES: {
           actions: [
-            Y({ indexes: ({ event: e }) => e.indexes })
+            z({ indexes: ({ event: e }) => e.indexes })
           ]
         },
         NEW_ATTACHMENTS: {
           actions: [
-            Y({ attachments: ({ context: e, event: t }) => [...e.attachments, ...t.attachments] }),
-            H("subtitles", ({ event: e }) => e)
+            z({ attachments: ({ context: e, event: t }) => [...e.attachments, ...t.attachments] }),
+            G("subtitles", ({ event: e }) => e)
           ]
         },
         NEW_SUBTITLE_FRAGMENTS: {
           actions: [
-            Y({ subtitleFragments: ({ context: e, event: t }) => [...e.subtitleFragments, ...t.subtitles] }),
-            H("subtitles", ({ event: e }) => e)
+            z({ subtitleFragments: ({ context: e, event: t }) => [...e.subtitleFragments, ...t.subtitles] }),
+            G("subtitles", ({ event: e }) => e)
             // emit(({ event }) => ({ type: 'NEW_SUBTITLE_FRAGMENTS', subtitles: event.subtitles }))
           ]
         },
         SUBTITLE_STREAMS_UPDATED: {
           actions: [
-            Y({ subtitleStreams: ({ event: e }) => e.subtitlesStreams }),
-            H("subtitles", ({ event: e }) => e)
+            z({ subtitleStreams: ({ event: e }) => e.subtitlesStreams }),
+            G("subtitles", ({ event: e }) => e)
           ]
         },
         SELECT_SUBTITLE_STREAM: {
           actions: [
-            H("subtitles", ({ event: e }) => e)
+            G("subtitles", ({ event: e }) => e)
           ]
         },
         SELECTED_SUBTITLE_STREAM_UPDATED: {
           actions: [
-            Y({ selectedSubtitleStreamIndex: ({ event: e }) => e.streamIndex })
+            z({ selectedSubtitleStreamIndex: ({ event: e }) => e.streamIndex })
           ]
         },
         DESTROY: { target: "WAITING" }
@@ -2115,11 +2123,11 @@ ${d}`),
     },
     DESTROYED: {}
   }
-}), O = vr(Fn), we = hr({}), Bt = (e, t) => {
-  const [r, n] = Q(() => localStorage.getItem(e) ?? t), o = (a) => {
+}), N = Er(Vn), Re = vr({}), at = (e, t) => {
+  const [r, n] = J(() => localStorage.getItem(e) ?? t), o = (a) => {
     localStorage.setItem(e, a), n(a), window.dispatchEvent(new Event("storage"));
   };
-  return z(() => {
+  return j(() => {
     const a = () => {
       const s = localStorage.getItem(e);
       n(s ?? t);
@@ -2179,14 +2187,14 @@ ${d}`),
       }
     `
   }
-}, Vn = K`
+}, Wn = K`
   top: unset !important;
   left: unset !important;
   width: 100%;
   height: 100%;
   margin: auto;
   pointer-events: none;
-`, Wn = K`
+`, Bn = K`
   position: absolute;
   top: 0;
   left: 0;
@@ -2200,7 +2208,7 @@ ${d}`),
 
   background: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.3) 30%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.1) 80%, transparent 100%);
   transition: opacity 0.1s cubic-bezier(.4,0,1,1);
-`, Bn = K`
+`, Xn = K`
   position: absolute;
   top: 0;
   left: 0;
@@ -2215,33 +2223,33 @@ ${d}`),
   align-items: center;
   pointer-events: none;
 `, Gn = ({ loadingInformation: e }) => {
-  const t = O.useActorRef(), r = O.useSelector((c) => c.context.media.duration), n = Se(we), [o, a] = Q(), s = ot((c) => {
+  const t = N.useActorRef(), r = N.useSelector((c) => c.context.media.duration), n = Te(Re), [o, a] = J(), s = ot((c) => {
     a(c);
   }, []);
-  return z(() => {
+  return j(() => {
     o && t.send({
       type: "SET_CANVAS_ELEMENT",
       canvasElement: o
     });
-  }, [o]), /* @__PURE__ */ $(cr, { children: [
+  }, [o]), /* @__PURE__ */ $(lr, { children: [
     n.title ? /* @__PURE__ */ E(
       "div",
       {
-        css: Wn,
+        css: Bn,
         style: { ...n.hideUI ? { opacity: "0", pointerEvents: "none" } : {} },
         children: n.title
       }
     ) : void 0,
-    r === void 0 && e ? /* @__PURE__ */ E("div", { css: Bn, children: e }) : void 0,
-    /* @__PURE__ */ E("canvas", { ref: s, css: Vn })
+    r === void 0 && e ? /* @__PURE__ */ E("div", { css: Xn, children: e }) : void 0,
+    /* @__PURE__ */ E("canvas", { ref: s, css: Wn })
   ] });
-}, ur = 1e-4, gt = 1, lr = 2, dr = (e) => {
-  const t = Math.max(ur, Math.min(gt, e));
-  return Math.pow(t, lr);
-}, St = (e) => {
-  const t = Math.max(ur, Math.min(gt, e));
-  return Math.pow(t, gt / lr);
-}, Xn = (e) => K`
+}, ur = 1e-4, yt = 1, dr = 2, fr = (e) => {
+  const t = Math.max(ur, Math.min(yt, e));
+  return Math.pow(t, dr);
+}, wt = (e) => {
+  const t = Math.max(ur, Math.min(yt, e));
+  return Math.pow(t, yt / dr);
+}, Hn = (e) => K`
   display: flex;
   justify-content: flex-end;
 
@@ -2251,7 +2259,7 @@ ${d}`),
   z-index: 3;
 
   * {
-    ${he.bSmall.regular}
+    ${he.bMedium.regular}
   }
 
   ${e === "sm" && K`
@@ -2272,9 +2280,9 @@ ${d}`),
   offset: a = 20,
   tooltipPlace: s = "top",
   disabled: c = !1,
-  size: d = "md"
+  size: u = "md"
   /* md */
-}) => /* @__PURE__ */ $(cr, { children: [
+}) => /* @__PURE__ */ $(lr, { children: [
   /* @__PURE__ */ E(
     "div",
     {
@@ -2288,29 +2296,29 @@ ${d}`),
     }
   ),
   !c && /* @__PURE__ */ E(
-    Pr,
+    Nr,
     {
-      css: Xn(d),
+      css: Hn(u),
       id: e,
       noArrow: !0,
       children: t
     }
   )
 ] }), qn = ({ ref: e, defaultValue: t }) => {
-  const [r, n] = Q(t), [o, a] = Q(!1), s = (c) => {
+  const [r, n] = J(t), [o, a] = J(!1), s = (c) => {
     if (a(!0), !e.current) return;
-    const { clientX: d } = c, { left: p, right: m } = e.current.getBoundingClientRect();
-    n(Math.min(Math.max((d - p) / (m - p), 0), 1));
+    const { clientX: u } = c, { left: h, right: p } = e.current.getBoundingClientRect();
+    n(Math.min(Math.max((u - h) / (p - h), 0), 1));
   };
-  return z(() => {
+  return j(() => {
     if (!o) return;
-    const c = () => a(!1), d = (p) => {
+    const c = () => a(!1), u = (h) => {
       if (!e.current) return;
-      const { clientX: m } = p, { left: g, right: b } = e.current.getBoundingClientRect();
-      n(Math.min(Math.max((m - g) / (b - g), 0), 1));
+      const { clientX: p } = h, { left: g, right: b } = e.current.getBoundingClientRect();
+      n(Math.min(Math.max((p - g) / (b - g), 0), 1));
     };
-    return document.addEventListener("mousemove", d), document.addEventListener("mouseup", c), () => {
-      document.removeEventListener("mousemove", d), document.removeEventListener("mouseup", c);
+    return document.addEventListener("mousemove", u), document.addEventListener("mouseup", c), () => {
+      document.removeEventListener("mousemove", u), document.removeEventListener("mouseup", c);
     };
   }, [o]), {
     value: r,
@@ -2318,7 +2326,7 @@ ${d}`),
     scrub: s,
     setValue: n
   };
-}, Hn = K`
+}, Kn = K`
   position: relative;
   height: .4rem;
 
@@ -2429,57 +2437,57 @@ ${d}`),
       object-fit: cover;
     }
   }
-`, Kn = () => {
-  const e = O.useActorRef(), t = O.useSelector((l) => l.context.media.currentTime), r = O.useSelector((l) => l.context.media.duration), n = O.useSelector((l) => l.context.indexes), o = O.useSelector((l) => l.context.thumbnails), a = Se(we), s = Ie(null), { scrub: c, value: d } = qn({ ref: s }), [p, m] = Q(void 0), g = (l) => {
-    const S = l.nativeEvent.offsetX / l.currentTarget.offsetWidth * (r ?? 0);
-    m(S);
+`, Jn = () => {
+  const e = N.useActorRef(), t = N.useSelector((d) => d.context.media.currentTime), r = N.useSelector((d) => d.context.media.duration), n = N.useSelector((d) => d.context.indexes), o = N.useSelector((d) => d.context.thumbnails), a = Te(Re), s = xe(null), { scrub: c, value: u } = qn({ ref: s }), [h, p] = J(void 0), g = (d) => {
+    const v = d.nativeEvent.offsetX / d.currentTarget.offsetWidth * (r ?? 0);
+    p(v);
   }, b = () => {
-    s.current && m(void 0);
-  }, x = pe(
-    () => a.downloadedRanges?.map((l, v) => {
+    s.current && p(void 0);
+  }, T = pe(
+    () => a.downloadedRanges?.map((d, m) => {
       if (!a.size || !r) return null;
-      const S = n.filter((B) => l.startByteOffset <= B.pos && B.pos <= l.endByteOffset), A = S.at(0), f = S.at(-1);
-      if (!A || !f) return null;
-      const _ = A.timestamp / r, C = f.timestamp / r, F = Number((C - _).toFixed(2)), U = _ * 100;
-      return /* @__PURE__ */ E("div", { className: "loaded-part", style: { transform: `scaleX(${F})`, marginLeft: `${U}%` } }, v);
+      const v = n.filter((B) => d.startByteOffset <= B.pos && B.pos <= d.endByteOffset), S = v.at(0), f = v.at(-1);
+      if (!S || !f) return null;
+      const w = S.timestamp / r, C = f.timestamp / r, F = Number((C - w).toFixed(2)), U = w * 100;
+      return /* @__PURE__ */ E("div", { className: "loaded-part", style: { transform: `scaleX(${F})`, marginLeft: `${U}%` } }, m);
     }) ?? [],
-    [r, n.length, a.downloadedRanges?.map(({ startByteOffset: l, endByteOffset: v }) => `${l}/${v}`).join(",")]
-  ), h = pe(() => {
-    if (!p || p < 0) return;
-    const l = Math.floor(p / 3600), v = Math.floor((p - l * 3600) / 60), S = Math.floor(p - l * 3600 - v * 60);
-    return `${l > 0 ? `${l}:` : ""}${v < 10 ? "0" : ""}${v}:${S < 10 ? "0" : ""}${S}`;
-  }, [p]);
-  z(() => {
-    if (!e || d === void 0 || !r) return;
-    const l = d * r;
-    e.send({ type: "SET_TIME", value: l });
-  }, [e, d, r]);
-  const y = pe(() => typeof r != "number" || typeof t != "number" ? 0 : 1 / ((r ?? 0) / (t ?? 0)), [r, t]), u = pe(() => {
-    if (!(!o.length || !p))
+    [r, n.length, a.downloadedRanges?.map(({ startByteOffset: d, endByteOffset: m }) => `${d}/${m}`).join(",")]
+  ), x = pe(() => {
+    if (!h || h < 0) return;
+    const d = Math.floor(h / 3600), m = Math.floor((h - d * 3600) / 60), v = Math.floor(h - d * 3600 - m * 60);
+    return `${d > 0 ? `${d}:` : ""}${m < 10 ? "0" : ""}${m}:${v < 10 ? "0" : ""}${v}`;
+  }, [h]);
+  j(() => {
+    if (!e || u === void 0 || !r) return;
+    const d = u * r;
+    e.send({ type: "SET_TIME", value: d });
+  }, [e, u, r]);
+  const y = pe(() => typeof r != "number" || typeof t != "number" ? 0 : 1 / ((r ?? 0) / (t ?? 0)), [r, t]), l = pe(() => {
+    if (!(!o.length || !h))
       return o.find(
-        ({ timestamp: l, duration: v }) => l <= p && p <= l + v
+        ({ timestamp: d, duration: m }) => d <= h && h <= d + m
       );
-  }, [o.length, p]);
+  }, [o.length, h]);
   return /* @__PURE__ */ $(
     "div",
     {
-      css: Hn,
+      css: Kn,
       ref: s,
       className: "progress-bar",
       onMouseMove: g,
       onMouseOut: b,
       children: [
         /* @__PURE__ */ E("div", { className: "background-bar" }),
-        p ? /* @__PURE__ */ E(
+        h ? /* @__PURE__ */ E(
           "div",
           {
             className: "cursor-time",
-            style: { left: `clamp(1.8rem, ${1 / ((r ?? 0) / (p ?? 1)) * 100}%, calc(100% - 1.8rem))` },
-            children: h
+            style: { left: `clamp(1.8rem, ${1 / ((r ?? 0) / (h ?? 1)) * 100}%, calc(100% - 1.8rem))` },
+            children: x
           }
         ) : void 0,
         /* @__PURE__ */ E("div", { className: "progress" }),
-        /* @__PURE__ */ E("div", { className: "loaded", children: x }),
+        /* @__PURE__ */ E("div", { className: "loaded", children: T }),
         /* @__PURE__ */ E("div", { className: "hover" }),
         /* @__PURE__ */ E("div", { className: "play-container", children: /* @__PURE__ */ E("div", { className: "play", style: { transform: `scaleX(${y})` } }) }),
         /* @__PURE__ */ E("div", { className: "chapters" }),
@@ -2489,8 +2497,8 @@ ${d}`),
           "div",
           {
             className: "thumbnail",
-            style: { left: `clamp(12.5rem, ${1 / ((r ?? 0) / (p ?? 1)) * 100}%, calc(100% - 12.5rem))` },
-            children: u ? /* @__PURE__ */ E("img", { src: u.url }) : void 0
+            style: { left: `clamp(12.5rem, ${1 / ((r ?? 0) / (h ?? 1)) * 100}%, calc(100% - 12.5rem))` },
+            children: l ? /* @__PURE__ */ E("img", { src: l.url }) : void 0
           }
         )
       ]
@@ -2500,7 +2508,119 @@ ${d}`),
   if (e === void 0) return "0:00";
   const t = Math.floor(e / 3600), r = Math.floor(e % 3600 / 60), n = Math.floor(e % 60);
   return t > 0 ? `${t}:${r < 10 ? "0" : ""}${r}:${n < 10 ? "0" : ""}${n}` : `${r}:${n < 10 ? "0" : ""}${n}`;
-}, Jn = (e, t) => `${Gt(e)} / ${Gt(t)}`, Zn = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23fff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20class='icon%20icon-tabler%20icons-tabler-outline%20icon-tabler-picture-in-picture'%3e%3cpath%20stroke='none'%20d='M0%200h24v24H0z'%20fill='none'%20/%3e%3cpath%20d='M11%2019h-6a2%202%200%200%201%20-2%20-2v-10a2%202%200%200%201%202%20-2h14a2%202%200%200%201%202%202v4'%20/%3e%3cpath%20d='M14%2014m0%201a1%201%200%200%201%201%20-1h5a1%201%200%200%201%201%201v3a1%201%200%200%201%20-1%201h-5a1%201%200%200%201%20-1%20-1z'%20/%3e%3c/svg%3e", Qn = K`
+}, Zn = (e, t) => `${Gt(e)} / ${Gt(t)}`, Qn = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23fff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20class='icon%20icon-tabler%20icons-tabler-outline%20icon-tabler-picture-in-picture'%3e%3cpath%20stroke='none'%20d='M0%200h24v24H0z'%20fill='none'%20/%3e%3cpath%20d='M11%2019h-6a2%202%200%200%201%20-2%20-2v-10a2%202%200%200%201%202%20-2h14a2%202%200%200%201%202%202v4'%20/%3e%3cpath%20d='M14%2014m0%201a1%201%200%200%201%201%20-1h5a1%201%200%200%201%201%201v3a1%201%200%200%201%20-1%201h-5a1%201%200%200%201%20-1%20-1z'%20/%3e%3c/svg%3e", eo = K`
+display: flex;
+align-items: center;
+justify-content: center;
+flex-direction: column;
+width: 100%;
+
+.playback-slider {
+  display: flex;
+  align-items: center;
+
+  padding: 8px 4px;
+  margin: 0 2px;
+
+  cursor: pointer;
+
+  > div {
+    position: relative;
+
+    background: #ccc;
+    border-radius: 4px;
+
+    width: 120px;
+    height: 3px;
+    @media (min-width: 768px) {
+      height: 4px;
+    }
+  }
+
+  .playback-handle {
+    position: absolute;
+
+
+    background: #ffffff;
+    border-radius: 50%;
+    transform: translateX(-50%);
+    pointer-events: none; 
+
+    width: 10px;
+    height: 10px;
+    top: -3.5px;
+    @media (min-width: 768px) {
+      width: 12px;
+      height: 12px;
+      top: -4px;
+    }
+  }
+}
+`, to = () => {
+  const e = N.useSelector((v) => v.context.media.playbackRate), t = N.useActorRef(), r = xe(null), [n, o] = J(!1), a = 0.25, s = 3, c = s - a, u = (v, S = 0.05) => Math.round(v / S) * S, h = u(e || 1), p = (v) => (v - a) / c * 100, g = (v) => {
+    if (!r.current) return h;
+    const S = r.current.getBoundingClientRect(), f = v - S.left, w = Math.max(0, Math.min(f, S.width)) / S.width, C = a + w * c;
+    return u(C);
+  }, b = (v) => {
+    o(!0);
+    const S = g(v.clientX);
+    t.send({ type: "SET_PLAYBACK_RATE", playbackRate: S });
+  }, T = (v) => {
+    if (!n) return;
+    const S = g(v.clientX);
+    t.send({ type: "SET_PLAYBACK_RATE", playbackRate: S });
+  }, x = () => {
+    o(!1);
+  }, y = (v) => {
+    v.preventDefault();
+    const S = 0.05;
+    let f = h;
+    v.deltaY < 0 ? f = Math.min(s, f + S) : f = Math.max(a, f - S), t.send({ type: "SET_PLAYBACK_RATE", playbackRate: f });
+  };
+  j(() => (window.addEventListener("mousemove", T), window.addEventListener("mouseup", x), () => {
+    window.removeEventListener("mousemove", T), window.removeEventListener("mouseup", x);
+  }), [n]), j(() => {
+    const v = r.current;
+    return v && v.addEventListener("wheel", y, { passive: !1 }), () => {
+      v && v.removeEventListener("wheel", y);
+    };
+  }, [e]);
+  const l = p(h);
+  return /* @__PURE__ */ $("div", { css: eo, children: [
+    /* @__PURE__ */ $("div", { children: [
+      h.toFixed(2),
+      "x"
+    ] }),
+    /* @__PURE__ */ E(
+      "div",
+      {
+        className: "playback-slider",
+        ref: r,
+        onMouseDown: b,
+        children: /* @__PURE__ */ E(
+          "div",
+          {
+            style: {
+              background: `linear-gradient(to right, 
+              #fff 0% ${l}%, 
+              #3A3A3A ${l}% 100%
+            )`
+            },
+            children: /* @__PURE__ */ E(
+              "div",
+              {
+                className: "playback-handle",
+                style: {
+                  left: `${l}%`
+                }
+              }
+            )
+          }
+        )
+      }
+    )
+  ] });
+}, ro = K`
 position: relative;
 
 .popover {
@@ -2508,6 +2628,7 @@ position: relative;
   right: 50%;
   transform: translateX(50%);
 
+  overflow-y: auto;
   width: 180px;
   height: 160px;
   top: -180px;
@@ -2536,8 +2657,6 @@ position: relative;
     padding: 8px 6px 8px 12px;
 
     width: 100%;
-    height: 100%;
-    cursor: pointer;
 
     :first-of-type {
       border-radius: 8px 8px 0 0;
@@ -2545,7 +2664,10 @@ position: relative;
     :last-of-type {
       border-radius: 0 0 8px 8px;
     }
-    :hover {
+    :not(&.no-hover) {
+      cursor: pointer;
+    }
+    :not(&.no-hover):hover {
       background-color: rgba(255,255,255,.1);
     }
 
@@ -2560,171 +2682,196 @@ position: relative;
       }
     }
   }
+
+  .back {
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    border-bottom: 1px solid #4D4D4E;
+
+    svg {
+      transform: translateX(-4px);
+      transition: transform 0.2s ease-in-out;
+    }
+
+    :hover {
+      svg {
+        transform: translateX(-8px);
+      }
+    }
+  }
 }
-`, eo = () => {
-  const e = O.useActorRef(), t = O.useSelector((h) => h.context.media.playbackRate), r = O.useSelector((h) => h.context.subtitleStreams), n = O.useSelector((h) => h.context.selectedSubtitleStreamIndex), [o, a] = Q(!1), [s, c] = Q(
+
+.playback-rate {
+  .slider {
+    width: 100%;
+  }
+  .options {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 1fr;
+    align-items: center;
+    
+    padding: 8px 12px;
+
+    > div {
+      display: flex;
+      align-items: center;
+      border-radius: 4px;
+
+      padding: 8px 6px;
+      height: 100%;
+
+      cursor: pointer;
+      :hover {
+        background-color: rgba(255,255,255,.1);
+      }
+    }
+  }
+}
+
+.subtitle {
+  .description {
+    word-break: break-word;
+  }
+}
+`, no = () => {
+  const e = N.useActorRef(), t = N.useSelector((l) => l.context.media.playbackRate), r = N.useSelector((l) => l.context.subtitleStreams), n = N.useSelector((l) => l.context.selectedSubtitleStreamIndex), [o, a] = at("hideMediaStats", "false"), [s, c] = J(!1), [u, h] = J(
     0
     /* Default */
-  ), d = Ie(null), p = () => {
-    a(!o), c(
+  ), p = xe(null), g = () => {
+    c(!s), h(
       0
       /* Default */
     );
-  }, m = (h) => {
-    e.send({ type: "SET_PLAYBACK_RATE", playbackRate: h }), c(
+  }, b = (l) => {
+    e.send({ type: "SET_PLAYBACK_RATE", playbackRate: l }), h(
       0
       /* Default */
     );
   };
-  z(() => {
-    const h = (y) => {
-      o && d.current && !d.current.contains(y.target) && p();
+  j(() => {
+    const l = (d) => {
+      s && p.current && !p.current.contains(d.target) && g();
     };
-    return document.addEventListener("mousedown", h), () => document.removeEventListener("mousedown", h);
-  }, [o]);
-  const g = pe(
-    () => r.map(({ header: h }) => ({ streamIndex: h.streamIndex, language: h.parsed.info.Title })),
+    return document.addEventListener("mousedown", l), () => document.removeEventListener("mousedown", l);
+  }, [s]);
+  const T = pe(
+    () => r.map(({ header: l }) => ({ streamIndex: l.streamIndex, language: l.parsed.info.Title })),
     [r.length]
-  ), b = (h) => () => {
-    e.send({ type: "SELECT_SUBTITLE_STREAM", streamIndex: h.streamIndex }), p();
-  }, x = (h) => () => {
-    c(h);
+  ), x = (l) => () => {
+    e.send({ type: "SELECT_SUBTITLE_STREAM", streamIndex: l.streamIndex }), g();
+  }, y = (l) => () => {
+    h(l);
   };
-  return /* @__PURE__ */ $("div", { css: Qn, ref: d, children: [
+  return /* @__PURE__ */ $("div", { css: ro, ref: p, children: [
     /* @__PURE__ */ E(
       ye,
       {
         id: "settings",
-        disabled: o,
+        disabled: s,
         text: /* @__PURE__ */ E(
           "button",
           {
             className: "settings",
             type: "button",
-            onClick: p,
-            children: /* @__PURE__ */ E(yr, {})
+            onClick: g,
+            children: /* @__PURE__ */ E(xr, {})
           }
         ),
         toolTipText: /* @__PURE__ */ E("span", { children: "Settings" })
       }
     ),
-    o && s === 0 && /* @__PURE__ */ $("div", { className: "popover", children: [
-      /* @__PURE__ */ $("div", { onClick: x(
+    s && u === 0 && /* @__PURE__ */ $("div", { className: "popover menu", children: [
+      /* @__PURE__ */ $("div", { onClick: y(
         2
         /* Advanced */
       ), children: [
         /* @__PURE__ */ E("span", { children: "Advanced" }),
-        /* @__PURE__ */ E("div", { children: /* @__PURE__ */ E(Ke, {}) })
+        /* @__PURE__ */ E("div", { children: /* @__PURE__ */ E(pt, {}) })
       ] }),
-      /* @__PURE__ */ $("div", { onClick: x(
-        3
-        /* SelectNewSources */
-      ), children: [
-        /* @__PURE__ */ E("div", { children: "Select new sources" }),
-        /* @__PURE__ */ E("div", { children: /* @__PURE__ */ E(Ke, {}) })
-      ] }),
-      /* @__PURE__ */ $("div", { onClick: x(
+      /* @__PURE__ */ $("div", { onClick: y(
         4
         /* Subtitles */
       ), children: [
         /* @__PURE__ */ E("div", { children: "Subtitles" }),
-        /* @__PURE__ */ E("div", { children: /* @__PURE__ */ E(Ke, {}) })
+        /* @__PURE__ */ E("div", { children: /* @__PURE__ */ E(pt, {}) })
       ] }),
-      /* @__PURE__ */ $("div", { onClick: x(
+      /* @__PURE__ */ $("div", { onClick: y(
         1
         /* PlaybackRate */
       ), children: [
         /* @__PURE__ */ E("div", { children: "Playback speed" }),
         /* @__PURE__ */ $("div", { children: [
           /* @__PURE__ */ E("span", { className: "secondary", children: t === 1 ? "(Default)" : t.toFixed(2) }),
-          /* @__PURE__ */ E(Ke, {})
+          /* @__PURE__ */ E(pt, {})
         ] })
       ] })
     ] }),
-    o && s === 1 && /* @__PURE__ */ $("div", { className: "popover", children: [
-      /* @__PURE__ */ $("div", { onClick: x(
+    s && u === 1 && /* @__PURE__ */ $("div", { className: "popover playback-rate", children: [
+      /* @__PURE__ */ $("div", { className: "back", onClick: y(
         0
         /* Default */
       ), children: [
-        /* @__PURE__ */ E("div", { children: "Back" }),
-        /* @__PURE__ */ E("div", {})
+        /* @__PURE__ */ E(Ke, {}),
+        /* @__PURE__ */ E("span", { children: "Plackback speed" })
       ] }),
-      /* @__PURE__ */ $("div", { children: [
-        /* @__PURE__ */ E("div", { children: "Playback speed" }),
-        /* @__PURE__ */ $("div", { children: [
-          /* @__PURE__ */ E(
-            "button",
-            {
-              type: "button",
-              onClick: () => m(0.5),
-              children: "0.5x"
-            }
-          ),
-          /* @__PURE__ */ E(
-            "button",
-            {
-              type: "button",
-              onClick: () => m(1),
-              children: "1x"
-            }
-          ),
-          /* @__PURE__ */ E(
-            "button",
-            {
-              type: "button",
-              onClick: () => m(1.5),
-              children: "1.5x"
-            }
-          ),
-          /* @__PURE__ */ E(
-            "button",
-            {
-              type: "button",
-              onClick: () => m(2),
-              children: "2x"
-            }
-          )
-        ] })
+      /* @__PURE__ */ E("div", { className: "slider no-hover", children: /* @__PURE__ */ E(to, {}) }),
+      /* @__PURE__ */ $("div", { className: "options no-hover", children: [
+        /* @__PURE__ */ E("div", { onClick: () => b(0.5), children: "0.5x" }),
+        /* @__PURE__ */ E("div", { onClick: () => b(1), children: "1x" }),
+        /* @__PURE__ */ E("div", { onClick: () => b(1.5), children: "1.5x" }),
+        /* @__PURE__ */ E("div", { onClick: () => b(2), children: "2x" })
       ] })
     ] }),
-    o && s === 2 && /* @__PURE__ */ E("div", { className: "popover", children: /* @__PURE__ */ $("div", { onClick: x(
-      0
-      /* Default */
-    ), children: [
-      /* @__PURE__ */ E("div", { children: "Back" }),
-      /* @__PURE__ */ E("div", {})
-    ] }) }),
-    o && s === 3 && /* @__PURE__ */ E("div", { className: "popover", children: /* @__PURE__ */ $("div", { onClick: x(
+    s && u === 2 && /* @__PURE__ */ $("div", { className: "popover advanced", children: [
+      /* @__PURE__ */ $("div", { className: "back", onClick: y(
+        0
+        /* Default */
+      ), children: [
+        /* @__PURE__ */ E(Ke, {}),
+        /* @__PURE__ */ E("span", { children: "Advanced" })
+      ] }),
+      /* @__PURE__ */ $("div", { onClick: () => a(o === "true" ? "false" : "true"), children: [
+        /* @__PURE__ */ E("span", { children: "Hide stats" }),
+        /* @__PURE__ */ E("span", { children: o === "true" ? "✓" : "" })
+      ] })
+    ] }),
+    s && u === 3 && /* @__PURE__ */ E("div", { className: "popover sources", children: /* @__PURE__ */ $("div", { className: "back", onClick: y(
       0
       /* Default */
     ), children: [
-      /* @__PURE__ */ E("div", { children: "Back" }),
-      /* @__PURE__ */ E("div", {})
+      /* @__PURE__ */ E(Ke, {}),
+      /* @__PURE__ */ E("span", { children: "Select new sources" })
     ] }) }),
-    o && s === 4 && /* @__PURE__ */ $("div", { className: "popover", children: [
-      g.map((h) => /* @__PURE__ */ $(
+    s && u === 4 && /* @__PURE__ */ $("div", { className: "popover subtitle", children: [
+      /* @__PURE__ */ $("div", { className: "back", onClick: y(
+        0
+        /* Default */
+      ), children: [
+        /* @__PURE__ */ E(Ke, {}),
+        /* @__PURE__ */ E("span", { children: "Subtitles" })
+      ] }),
+      /* @__PURE__ */ $("div", { onClick: x({ streamIndex: void 0 }), children: [
+        /* @__PURE__ */ E("span", { children: "Disable" }),
+        /* @__PURE__ */ E("span", { children: n === void 0 ? "✓" : "" })
+      ] }),
+      T.map((l) => /* @__PURE__ */ $(
         "div",
         {
-          onClick: b(h),
+          onClick: x(l),
+          className: "description",
           children: [
-            /* @__PURE__ */ E("div", { children: h.language }),
-            /* @__PURE__ */ E("div", { children: n === h.streamIndex ? "✓" : "" })
+            /* @__PURE__ */ E("span", { children: l.language }),
+            /* @__PURE__ */ E("span", { children: n === l.streamIndex ? "✓" : "" })
           ]
         },
-        h.streamIndex
-      )),
-      /* @__PURE__ */ $("div", { onClick: x(
-        0
-        /* Default */
-      ), children: [
-        /* @__PURE__ */ E("div", { children: "Back" }),
-        /* @__PURE__ */ E("div", {})
-      ] })
+        l.streamIndex
+      ))
     ] })
   ] });
-}, to = {
+}, oo = {
   hover: "rgba(255, 255, 255, 0.13)"
-}, ro = K`
+}, io = K`
   display: flex;
   align-items: center;
 
@@ -2755,37 +2902,37 @@ position: relative;
     width: 10px;
     height: 10px;
   }
-`, no = ({ value: e, onChange: t }) => {
-  const r = O.useSelector((u) => u.context.media.volume), n = O.useSelector((u) => u.context.media.muted), o = Ie(null), [a, s] = Q(!1), c = (u) => {
+`, ao = ({ value: e, onChange: t }) => {
+  const r = N.useSelector((l) => l.context.media.volume), n = N.useSelector((l) => l.context.media.muted), o = xe(null), [a, s] = J(!1), c = (l) => {
     if (!o.current) return e;
-    const l = o.current.getBoundingClientRect(), v = u - l.left;
-    return Math.max(0, Math.min(v, l.width)) / l.width;
-  }, d = (u) => {
+    const d = o.current.getBoundingClientRect(), m = l - d.left;
+    return Math.max(0, Math.min(m, d.width)) / d.width;
+  }, u = (l) => {
     s(!0);
-    const l = c(u.clientX);
-    t(l);
-  }, p = (u) => {
+    const d = c(l.clientX);
+    t(d);
+  }, h = (l) => {
     if (!a) return;
-    const l = c(u.clientX);
-    t(l);
-  }, m = () => {
+    const d = c(l.clientX);
+    t(d);
+  }, p = () => {
     s(!1);
-  }, g = (u) => {
-    u.preventDefault();
-    const l = 0.05;
-    let v = e;
-    u.deltaY < 0 ? v = Math.min(1, v + l) : v = Math.max(0, v - l), t(v);
+  }, g = (l) => {
+    l.preventDefault();
+    const d = 0.05;
+    let m = e;
+    l.deltaY < 0 ? m = Math.min(1, m + d) : m = Math.max(0, m - d), t(m);
   };
-  z(() => (window.addEventListener("mousemove", p), window.addEventListener("mouseup", m), () => {
-    window.removeEventListener("mousemove", p), window.removeEventListener("mouseup", m);
-  }), [a]), z(() => {
-    const u = o.current;
-    return u && u.addEventListener("wheel", g, { passive: !1 }), () => {
-      u && u.removeEventListener("wheel", g);
+  j(() => (window.addEventListener("mousemove", h), window.addEventListener("mouseup", p), () => {
+    window.removeEventListener("mousemove", h), window.removeEventListener("mouseup", p);
+  }), [a]), j(() => {
+    const l = o.current;
+    return l && l.addEventListener("wheel", g, { passive: !1 }), () => {
+      l && l.removeEventListener("wheel", g);
     };
   }, [e]);
-  const b = e * 100, x = "#fff", h = "#3A3A3A", y = pe(
-    () => Math.round(n ? 0 : St(r) * 100),
+  const b = e * 100, T = "#fff", x = "#3A3A3A", y = pe(
+    () => Math.round(n ? 0 : wt(r) * 100),
     [r]
   );
   return /* @__PURE__ */ E(
@@ -2796,15 +2943,15 @@ position: relative;
         "div",
         {
           ref: o,
-          css: ro,
-          onMouseDown: d,
+          css: io,
+          onMouseDown: u,
           children: /* @__PURE__ */ E(
             "div",
             {
               style: {
                 background: `linear-gradient(to right, 
-                ${x} 0% ${b}%, 
-                ${h} ${b}% 100%
+                ${T} 0% ${b}%, 
+                ${x} ${b}% 100%
               )`
               },
               children: /* @__PURE__ */ E(
@@ -2826,7 +2973,7 @@ position: relative;
       ] })
     }
   );
-}, oo = K`
+}, so = K`
   position: relative;
   display: flex;
   align-items: center;
@@ -2865,13 +3012,13 @@ position: relative;
 
     pointer-events: auto;
   }
-`, io = ({ ref: e }) => {
-  const t = O.useActorRef(), r = O.useSelector((s) => s.context.media.volume), n = O.useSelector((s) => s.context.media.muted), o = pe(() => St(r), [r]), a = (s, c) => t.send({
+`, co = ({ ref: e }) => {
+  const t = N.useActorRef(), r = N.useSelector((s) => s.context.media.volume), n = N.useSelector((s) => s.context.media.muted), o = pe(() => wt(r), [r]), a = (s, c) => t.send({
     type: "SET_VOLUME",
     muted: c,
-    volume: dr(s)
+    volume: fr(s)
   });
-  return /* @__PURE__ */ $("div", { css: oo, children: [
+  return /* @__PURE__ */ $("div", { css: so, children: [
     /* @__PURE__ */ E(
       ye,
       {
@@ -2883,21 +3030,21 @@ position: relative;
             type: "button",
             onClick: () => a(o, !n),
             ref: e,
-            children: n || r === 0 ? /* @__PURE__ */ E(xr, { size: 18, color: "#fff" }) : r <= 0.5 ? /* @__PURE__ */ E(Sr, { size: 18, color: "#fff" }) : /* @__PURE__ */ E(Tr, { size: 18, color: "#fff" })
+            children: n || r === 0 ? /* @__PURE__ */ E(Sr, { size: 18, color: "#fff" }) : r <= 0.5 ? /* @__PURE__ */ E(Tr, { size: 18, color: "#fff" }) : /* @__PURE__ */ E(wr, { size: 18, color: "#fff" })
           }
         ),
         toolTipText: /* @__PURE__ */ E("span", { children: n ? "Unmute (m)" : "Mute (m)" })
       }
     ),
     /* @__PURE__ */ E("div", { className: "volume-slider-container", children: /* @__PURE__ */ E("div", { className: "volume-slider-background", children: /* @__PURE__ */ E(
-      no,
+      ao,
       {
         value: n ? 0 : o,
         onChange: (s) => a(s, !1)
       }
     ) }) })
   ] });
-}, ao = K`
+}, lo = K`
   position: absolute;
   bottom: 0;
   width: 100%;
@@ -2981,7 +3128,7 @@ position: relative;
         cursor: pointer;
 
         :hover {
-          background-color: ${to.hover};
+          background-color: ${oo.hover};
         }
       }
     }
@@ -2989,10 +3136,10 @@ position: relative;
     .left {
       .time {
         ${he.bMedium.regular}
+        text-shadow: 0 0 4px rgba(0, 0, 0, 1);
       }
     }
     .right {
-
       .picture-in-picture {
         img {
           width: 22px;
@@ -3009,55 +3156,55 @@ position: relative;
       }
     }
   }
-`, so = ({ mediaInformation: e, containerRef: t }) => {
-  const r = O.useActorRef(), n = Se(we), o = O.useSelector((u) => u.context.media.paused), a = O.useSelector((u) => u.context.media.volume), s = O.useSelector((u) => u.context.media.muted), c = O.useSelector((u) => u.context.media.currentTime), d = O.useSelector((u) => u.context.media.duration), [p, m] = Q(), [g, b] = Q(!1);
-  z(() => {
-    const u = () => {
-      b(!!document.fullscreenElement);
+`, uo = ({ mediaInformation: e, containerRef: t }) => {
+  const r = N.useActorRef(), n = Te(Re), o = N.useSelector((m) => m.context.media.paused), a = N.useSelector((m) => m.context.media.volume), s = N.useSelector((m) => m.context.media.muted), c = N.useSelector((m) => m.context.media.currentTime), u = N.useSelector((m) => m.context.media.duration), [h, p] = J(), [g, b] = at("hideMediaStats", "false"), [T, x] = J(!1);
+  j(() => {
+    const m = () => {
+      x(!!document.fullscreenElement);
     };
-    return document.addEventListener("fullscreenchange", u), () => {
-      document.removeEventListener("fullscreenchange", u);
+    return document.addEventListener("fullscreenchange", m), () => {
+      document.removeEventListener("fullscreenchange", m);
     };
   }, []);
-  const x = () => {
+  const y = () => {
     document.fullscreenElement ? document.exitFullscreen() : t.current && t.current.requestFullscreen();
-  }, h = ot(({ direction: u, stepSize: l }) => {
+  }, l = ot(({ direction: m, stepSize: v }) => {
     if (!r) return;
-    const v = St(a), S = u === "up" ? l : -l, A = Math.max(0, Math.min(1, v + S)), f = dr(A);
+    const S = wt(a), f = m === "up" ? v : -v, w = Math.max(0, Math.min(1, S + f)), C = fr(w);
     r.send({
       type: "SET_VOLUME",
       muted: s,
-      volume: f
+      volume: C
     });
   }, [r.id, s, a]);
-  z(() => {
-    const u = (l) => {
-      let v = !0;
-      if (l.key === "f") x();
-      else if (l.key === "k") nt(r, o, d, c);
-      else if (l.key === " ") nt(r, o, d, c);
-      else if (l.key === "m")
+  j(() => {
+    const m = (v) => {
+      let S = !0;
+      if (v.key === "f") y();
+      else if (v.key === "k") nt(r, o, u, c);
+      else if (v.key === " ") nt(r, o, u, c);
+      else if (v.key === "m")
         r.send({ type: "SET_VOLUME", muted: !s, volume: a });
-      else if (l.key === "ArrowUp")
-        h({ direction: "up", stepSize: 0.05 });
-      else if (l.key === "ArrowDown")
-        h({ direction: "down", stepSize: 0.05 });
-      else if (l.key === "ArrowRight") {
-        if (!d) return;
-        c + 5 >= d ? r.send({ type: "SET_TIME", value: d }) : r.send({ type: "SET_TIME", value: c + 5 });
-      } else l.key === "ArrowLeft" ? c - 5 < 0 ? r.send({ type: "SET_TIME", value: 0 }) : r.send({ type: "SET_TIME", value: c - 5 }) : v = !1;
-      v && l.preventDefault();
+      else if (v.key === "ArrowUp")
+        l({ direction: "up", stepSize: 0.05 });
+      else if (v.key === "ArrowDown")
+        l({ direction: "down", stepSize: 0.05 });
+      else if (v.key === "ArrowRight") {
+        if (!u) return;
+        c + 5 >= u ? r.send({ type: "SET_TIME", value: u }) : r.send({ type: "SET_TIME", value: c + 5 });
+      } else v.key === "ArrowLeft" ? c - 5 < 0 ? r.send({ type: "SET_TIME", value: 0 }) : r.send({ type: "SET_TIME", value: c - 5 }) : S = !1;
+      S && v.preventDefault();
     };
-    return window.addEventListener("keydown", u), () => window.removeEventListener("keydown", u);
-  }, [r, a, s, o, c, d]);
-  const y = ot((u) => {
-    u.preventDefault(), u.deltaY < 0 ? h({ direction: "up", stepSize: 0.05 }) : h({ direction: "down", stepSize: 0.05 });
-  }, [h]);
-  return z(() => {
-    if (p)
-      return p.addEventListener("wheel", y, { passive: !1 }), () => p.removeEventListener("wheel", y);
-  }, [p, h]), /* @__PURE__ */ $("div", { css: ao, style: { ...n.hideUI ? { opacity: "0", pointerEvents: "none" } : {} }, children: [
-    /* @__PURE__ */ E(Kn, {}),
+    return window.addEventListener("keydown", m), () => window.removeEventListener("keydown", m);
+  }, [r, a, s, o, c, u]);
+  const d = ot((m) => {
+    m.preventDefault(), m.deltaY < 0 ? l({ direction: "up", stepSize: 0.05 }) : l({ direction: "down", stepSize: 0.05 });
+  }, [l]);
+  return j(() => {
+    if (h)
+      return h.addEventListener("wheel", d, { passive: !1 }), () => h.removeEventListener("wheel", d);
+  }, [h, l]), /* @__PURE__ */ $("div", { css: lo, style: { ...n.hideUI ? { opacity: "0", pointerEvents: "none" } : {} }, children: [
+    /* @__PURE__ */ E(Jn, {}),
     /* @__PURE__ */ $("div", { className: "actions", children: [
       /* @__PURE__ */ $("div", { className: "left", children: [
         /* @__PURE__ */ E(
@@ -3070,19 +3217,19 @@ position: relative;
               {
                 className: "play",
                 type: "button",
-                onClick: () => nt(r, o, d, c),
-                children: d === c ? /* @__PURE__ */ E(wr, {}) : o ? /* @__PURE__ */ E(Rr, {}) : /* @__PURE__ */ E(Ar, {})
+                onClick: () => nt(r, o, u, c),
+                children: u === c ? /* @__PURE__ */ E(Rr, {}) : o ? /* @__PURE__ */ E(Ar, {}) : /* @__PURE__ */ E(_r, {})
               }
             ),
-            toolTipText: /* @__PURE__ */ E("span", { children: d === c ? "Replay (k)" : o ? "Play (k)" : "Pause (k)" })
+            toolTipText: /* @__PURE__ */ E("span", { children: u === c ? "Replay (k)" : o ? "Play (k)" : "Pause (k)" })
           }
         ),
-        /* @__PURE__ */ E(io, { ref: m }),
-        /* @__PURE__ */ E("div", { className: "time", children: Jn(c, d) })
+        /* @__PURE__ */ E(co, { ref: p }),
+        /* @__PURE__ */ E("div", { className: "time", children: Zn(c, u) })
       ] }),
       /* @__PURE__ */ $("div", { className: "right", children: [
-        e,
-        /* @__PURE__ */ E(eo, {}),
+        g !== "true" ? e : null,
+        /* @__PURE__ */ E(no, {}),
         /* @__PURE__ */ E(
           ye,
           {
@@ -3092,7 +3239,7 @@ position: relative;
               {
                 className: "picture-in-picture",
                 type: "button",
-                children: /* @__PURE__ */ E("img", { src: Zn })
+                children: /* @__PURE__ */ E("img", { src: Qn })
               }
             ),
             toolTipText: /* @__PURE__ */ E("span", { children: "Picture in picture" })
@@ -3108,17 +3255,17 @@ position: relative;
               {
                 className: "full-screen",
                 type: "button",
-                onClick: x,
-                children: g ? /* @__PURE__ */ E(_r, {}) : /* @__PURE__ */ E(Cr, {})
+                onClick: y,
+                children: T ? /* @__PURE__ */ E(Cr, {}) : /* @__PURE__ */ E(Pr, {})
               }
             ),
-            toolTipText: /* @__PURE__ */ E("span", { children: g ? "Exit full screen (f)" : "Full screen (f)" })
+            toolTipText: /* @__PURE__ */ E("span", { children: T ? "Exit full screen (f)" : "Full screen (f)" })
           }
         )
       ] })
     ] })
   ] });
-}, co = K`
+}, fo = K`
   position: relative;
   background-color: black;
   display: flex;
@@ -3150,19 +3297,19 @@ position: relative;
   &.hide {
     cursor: none;
   }
-`, uo = ({ children: e, mediaInformation: t, loadingInformation: r }) => {
-  const n = O.useActorRef(), o = Se(we), a = O.useSelector((b) => b.context.media.paused), s = O.useSelector((b) => b.context.media.currentTime), c = O.useSelector((b) => b.context.media.duration), d = Ie(), p = Ie(null);
+`, mo = ({ children: e, mediaInformation: t, loadingInformation: r }) => {
+  const n = N.useActorRef(), o = Te(Re), a = N.useSelector((b) => b.context.media.paused), s = N.useSelector((b) => b.context.media.currentTime), c = N.useSelector((b) => b.context.media.duration), u = xe(), h = xe(null);
   return /* @__PURE__ */ $(
     "div",
     {
-      css: co,
-      ref: p,
+      css: fo,
+      ref: h,
       onMouseMove: (b) => {
-        o.update({ ...o, hideUI: !1 }), d.current && clearInterval(d.current);
-        const x = setTimeout(() => {
+        o.update({ ...o, hideUI: !1 }), u.current && clearInterval(u.current);
+        const T = setTimeout(() => {
           o.update({ ...o, hideUI: !0 });
         }, 3e3);
-        d.current = x;
+        u.current = T;
       },
       onMouseOut: (b) => {
         b.currentTarget.parentElement !== b.relatedTarget && b.relatedTarget !== null || o.update({ ...o, hideUI: !0 });
@@ -3170,7 +3317,7 @@ position: relative;
       className: o.hideUI ? "hide" : "",
       children: [
         /* @__PURE__ */ E(Gn, { loadingInformation: r }),
-        /* @__PURE__ */ E(so, { mediaInformation: t, containerRef: p }),
+        /* @__PURE__ */ E(uo, { mediaInformation: t, containerRef: h }),
         /* @__PURE__ */ E(
           "div",
           {
@@ -3182,88 +3329,88 @@ position: relative;
       ]
     }
   );
-}, lo = 25e5, fo = K`
+}, po = 25e5, ho = K`
   display: flex;
   justify-content: center;
   background-color: #111;
   height: 100%;
   width: 100%;
   overflow: hidden;
-`, mo = ({ options: e, videoElement: t, children: r }) => {
-  const n = Se(we), o = O.useActorRef(), a = O.useSelector((u) => u.value), s = O.useSelector((u) => u.context.media.volume), c = O.useSelector((u) => u.context.media.muted), d = O.useSelector((u) => u.context.isReady), p = O.useSelector((u) => u.context.media.duration), [m, g] = Bt("mediaVolume", "1"), [b, x] = Bt("mediaMute", "false"), [h, y] = Q(!0);
-  return z(() => {
+`, vo = ({ options: e, videoElement: t, children: r }) => {
+  const n = Te(Re), o = N.useActorRef(), a = N.useSelector((l) => l.value), s = N.useSelector((l) => l.context.media.volume), c = N.useSelector((l) => l.context.media.muted), u = N.useSelector((l) => l.context.isReady), h = N.useSelector((l) => l.context.media.duration), [p, g] = at("mediaVolume", "1"), [b, T] = at("mediaMute", "false"), [x, y] = J(!0);
+  return j(() => {
     o.send({
       type: "MEDIA_SOURCE_OPTIONS",
       mediaSourceOptions: {}
     });
-  }, []), z(() => {
-    !e.autoplay || p === void 0 || o.send({ type: "PLAY" });
-  }, [p, e.autoplay]), z(
+  }, []), j(() => {
+    !e.autoplay || h === void 0 || o.send({ type: "PLAY" });
+  }, [h, e.autoplay]), j(
     () => {
-      !o || !d || !n.downloadedRanges || o.send({
+      !o || !u || !n.downloadedRanges || o.send({
         type: "DOWNLOADED_RANGES_UPDATED",
         downloadedRanges: n.downloadedRanges
       });
     },
     [
       o,
-      d,
-      (n.downloadedRanges?.map((u) => `${u.startByteOffset}-${u.endByteOffset}`) ?? []).join(",")
+      u,
+      (n.downloadedRanges?.map((l) => `${l.startByteOffset}-${l.endByteOffset}`) ?? []).join(",")
     ]
-  ), z(() => {
-    const { size: u, read: l, publicPath: v, libavWorkerUrl: S, jassubWasmUrl: A } = e;
-    !l || !u || !v || !S || !A || o.send({
+  ), j(() => {
+    const { size: l, read: d, publicPath: m, libavWorkerUrl: v, jassubWasmUrl: S } = e;
+    !d || !l || !m || !v || !S || o.send({
       type: "REMUXER_OPTIONS",
       remuxerOptions: {
-        publicPath: v,
-        workerUrl: S,
-        bufferSize: e.bufferSize ?? lo,
-        length: u,
-        read: l
+        publicPath: m,
+        workerUrl: v,
+        bufferSize: e.bufferSize ?? po,
+        length: l,
+        read: d
       }
     });
-  }, [e.read, e.size, e.publicPath, e.libavWorkerUrl, e.bufferSize]), z(() => {
-    const { jassubWorkerUrl: u, jassubWasmUrl: l, jassubModernWasmUrl: v } = e;
-    !u || !l || !v || o.send({
+  }, [e.read, e.size, e.publicPath, e.libavWorkerUrl, e.bufferSize]), j(() => {
+    const { jassubWorkerUrl: l, jassubWasmUrl: d, jassubModernWasmUrl: m } = e;
+    !l || !d || !m || o.send({
       type: "SUBTITLES_RENDERER_OPTIONS",
       subtitlesRendererOptions: {
-        workerUrl: u,
-        wasmUrl: l,
-        modernWasmUrl: v
+        workerUrl: l,
+        wasmUrl: d,
+        modernWasmUrl: m
       }
     });
-  }, [e.publicPath, e.jassubWorkerUrl, e.jassubWasmUrl]), z(() => {
+  }, [e.publicPath, e.jassubWorkerUrl, e.jassubWasmUrl]), j(() => {
     t && o.send({
       type: "SET_VIDEO_ELEMENT",
       videoElement: t
     });
-  }, [t]), z(() => {
-    d && (h ? (o.send({
+  }, [t]), j(() => {
+    u && (x ? (o.send({
       type: "SET_VOLUME",
       muted: b === "true",
-      volume: isNaN(Number(m)) ? 1 : Number(m)
-    }), y(!1)) : (g(s.toString()), x(c ? "true" : "false")));
-  }, [d, s, c, h]), z(() => {
+      volume: isNaN(Number(p)) ? 1 : Number(p)
+    }), y(!1)) : (g(s.toString()), T(c ? "true" : "false")));
+  }, [u, s, c, x]), j(() => {
     if (a === "OK")
       return () => {
         o.send({ type: "DESTROY" });
       };
-  }, [a]), /* @__PURE__ */ E("div", { css: fo, children: /* @__PURE__ */ E(uo, { mediaInformation: e.mediaInformation, loadingInformation: e.loadingInformation, children: r }) });
-}, wo = ({ ref: e, ...t }) => {
-  const r = (d) => o({ ...d, update: r }), [n, o] = Q({ update: r }), [a, s] = Q(), c = ot((d) => {
-    typeof e == "function" ? e(d) : e && "current" in e && (e.current = d), s(d ?? void 0);
+  }, [a]), /* @__PURE__ */ E("div", { css: ho, children: /* @__PURE__ */ E(mo, { mediaInformation: e.mediaInformation, loadingInformation: e.loadingInformation, children: r }) });
+}, _o = ({ ref: e, ...t }) => {
+  const r = (u) => o({ ...u, update: r }), [n, o] = J({ update: r }), [a, s] = J(), c = ot((u) => {
+    typeof e == "function" ? e(u) : e && "current" in e && (e.current = u), s(u ?? void 0);
   }, []);
-  return z(() => {
-    o((d) => ({
-      ...d,
+  return j(() => {
+    o((u) => ({
+      ...u,
       videoElement: a,
       title: t?.title,
       size: t?.size,
       downloadedRanges: t?.downloadedRanges
     }));
-  }, [a, t?.title, t?.size, t?.downloadedRanges]), /* @__PURE__ */ E(we.Provider, { value: n, children: /* @__PURE__ */ E(O.Provider, { children: /* @__PURE__ */ E(mo, { options: t, videoElement: a, children: /* @__PURE__ */ E("video", { ref: c, controls: !1 }) }) }) });
+  }, [a, t?.title, t?.size, t?.downloadedRanges]), /* @__PURE__ */ E(Re.Provider, { value: n, children: /* @__PURE__ */ E(N.Provider, { children: /* @__PURE__ */ E(vo, { options: t, videoElement: a, children: /* @__PURE__ */ E("video", { ref: c, controls: !1 }) }) }) });
 };
 export {
-  mo as FKNVideoRoot,
-  wo as default
+  vo as FKNVideoRoot,
+  _o as default
 };