@mblinkov/whats-missing 20.0.43 → 20.0.44

package/dist/whats-missing.es.js

@@ -1,10 +1,9 @@
-import { jsx as n, jsxs as d, Fragment as ve } from "react/jsx-runtime";
-import { useRef as V, useState as a, useLayoutEffect as _, useEffect as F, useMemo as Z } from "react";
-import { createPortal as ze } from "react-dom";
-const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c.map(([r, i]) => ({
-  src: `${Ce}${h}/${i.replace(/\s/g, "%20")}.png`,
-  name: i
-})), ke = [
+import { jsx as e, jsxs as h, Fragment as tn } from "react/jsx-runtime";
+import { useRef as Hn, useEffect as D, useState as r, useMemo as Wn } from "react";
+const un = window.origin + "/cloud/speakid/games/whatsmissing/", Y = (o, x) => o.map(([l, w]) => ({
+  src: `${un}${x}/${w.replace(/\s/g, "%20")}.png`,
+  name: w
+})), fn = [
   ["apple", "apple"],
   ["banana", "banana"],
   ["bread", "bread"],
@@ -30,7 +29,7 @@ const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c
   ["strawberry", "strawberry"],
   ["tomato", "tomato"],
   ["watermelon", "watermelon"]
-], Se = [
+], yn = [
   ["bear", "bear"],
   ["cat", "cat"],
   ["crocodile", "crocodile"],
@@ -50,7 +49,7 @@ const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c
   ["tortoise", "tortoise"],
   ["wolf", "wolf"],
   ["zebra", "zebra"]
-], Te = [
+], bn = [
   ["ball", "ball"],
   ["balloon", "balloon"],
   ["blocks", "blocks"],
@@ -70,23 +69,23 @@ const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c
   ["teddy_bear", "teddy bear"],
   ["yo-yo", "yo-yo"],
   ["crayons", "crayons"]
-], ce = {
-  food: U(ke, "food"),
-  animals: U(Se, "animals"),
-  toys: U(Te, "toys")
-}, Re = `
+], on = {
+  food: Y(fn, "food"),
+  animals: Y(yn, "animals"),
+  toys: Y(bn, "toys")
+}, kn = `
   @keyframes spin {
     from { transform: rotate(0deg); }
     to { transform: rotate(360deg); }
   }
 `;
 if (typeof document < "u" && !document.getElementById("spin-keyframes")) {
-  const c = document.createElement("style");
-  c.id = "spin-keyframes", c.innerHTML = Re, document.head.appendChild(c);
+  const o = document.createElement("style");
+  o.id = "spin-keyframes", o.innerHTML = kn, document.head.appendChild(o);
 }
-const Me = {
+const vn = {
   animation: "spin 1.4s linear infinite"
-}, o = {
+}, t = {
   gmCenterScreen: {
     position: "relative",
     zIndex: 1,
@@ -171,27 +170,6 @@ const Me = {
     gap: "20px",
     justifyContent: "center"
   },
-  gmCard: {
-    border: "1px solid #e5e7eb",
-    borderRadius: "16px",
-    background: "#f9f9f9",
-    aspectRatio: "1 / 1",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    overflow: "hidden",
-    transition: "transform .2s ease, box-shadow .2s ease, border-color .2s ease"
-  },
-  gmCorrect: {
-    border: "2px solid #10b981",
-    boxShadow: "0 0 18px rgba(16,185,129,.45)",
-    background: "#ecfdf5"
-  },
-  gmWrong: {
-    border: "2px solid #ec4c44",
-    boxShadow: "0 0 18px rgba(236,76,68,.35)",
-    background: "#fef2f2"
-  },
   gmInput: {
     padding: "6px 10px",
     borderRadius: "6px",
@@ -240,440 +218,424 @@ const Me = {
   },
   gmHourglass: {
     fontSize: "42px",
-    ...Me
+    ...vn
   }
-}, He = (c, h) => {
-  const r = Array.from({ length: c.length + 1 }, () => Array(h.length + 1).fill(0));
-  for (let i = 0; i <= c.length; i++) r[i][0] = i;
-  for (let i = 0; i <= h.length; i++) r[0][i] = i;
-  for (let i = 1; i <= c.length; i++)
-    for (let f = 1; f <= h.length; f++)
-      r[i][f] = c[i - 1] === h[f - 1] ? r[i - 1][f - 1] : Math.min(r[i - 1][f - 1], r[i][f - 1], r[i - 1][f]) + 1;
-  return r[c.length][h.length];
+}, Sn = () => {
+  const o = document.createElement("style");
+  o.textContent = `
+    #whats-missing-root, #whats-missing-root * {
+      box-sizing: border-box;
+      font-family: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
+    }
+    #whats-missing-root img {
+      max-width: 100%;
+      height: auto;
+      display: block;
+      user-select: none;
+    }
+    html, body {
+      margin: 0 !important;
+      padding: 0 !important;
+      width: 100% !important;
+      height: 100% !important;
+      overflow: hidden !important;
+      zoom: 1 !important; /* ✅ защита от подзума */
+    }
+    #root {
+      margin: 0 !important;
+      padding: 0 !important;
+      width: 100% !important;
+      height: 100% !important;
+      overflow: hidden !important;
+    }
+  `, document.head.appendChild(o);
+}, zn = (o, x) => {
+  const l = Array.from({ length: o.length + 1 }, () => Array(x.length + 1).fill(0));
+  for (let w = 0; w <= o.length; w++) l[w][0] = w;
+  for (let w = 0; w <= x.length; w++) l[0][w] = w;
+  for (let w = 1; w <= o.length; w++)
+    for (let s = 1; s <= x.length; s++)
+      l[w][s] = o[w - 1] === x[s - 1] ? l[w - 1][s - 1] : Math.min(l[w - 1][s - 1], l[w][s - 1], l[w - 1][s]) + 1;
+  return l[o.length][x.length];
 };
-function Ie(c, h = { minDesktopWidth: 1200, forceResize: !1 }) {
-  const r = V(null), i = h.minDesktopWidth ?? 1200, f = !!h.forceResize;
-  _(() => {
-    if (typeof window > "u" || !c || !c.current) return;
-    const m = c.current, M = () => {
-      try {
-        const s = document.body, w = getComputedStyle(s), x = parseFloat(s.style && s.style.zoom || "");
-        if (x && !isNaN(x) && x > 0) return x;
-        const S = parseFloat(w.zoom || "");
-        if (S && !isNaN(S) && S > 0) return S;
-        const u = document.createElement("div");
-        u.style.position = "absolute", u.style.left = "0", u.style.top = "0", u.style.width = "100px", u.style.height = "1px", u.style.visibility = "hidden", document.documentElement.appendChild(u);
-        const T = u.getBoundingClientRect();
-        if (document.documentElement.removeChild(u), T && T.width > 0) {
-          const z = T.width / 100;
-          if (!isNaN(z) && z > 0) return z;
-        }
-      } catch {
-      }
-      return 1;
-    }, A = () => {
-      if (i && window.innerWidth < i) {
-        H();
-        return;
-      }
-      const s = M();
-      if (!s || s === 1) {
-        H();
-        return;
-      }
-      r.current || (r.current = {
-        transform: m.style.transform || null,
-        transformOrigin: m.style.transformOrigin || null,
-        width: m.style.width || null,
-        height: m.style.height || null,
-        willChange: m.style.willChange || null
-      });
-      const w = 1 / s;
-      f && (m.style.width = `${s * 100}%`, m.style.height = `${s * 100}%`), m.style.transformOrigin = "50% 50%", m.style.transform = `scale(${w})`, m.style.willChange = "transform";
-    }, H = () => {
-      if (!r.current) return;
-      const s = r.current;
-      m.style.transform = s.transform ?? "", m.style.transformOrigin = s.transformOrigin ?? "", m.style.width = s.width ?? "", m.style.height = s.height ?? "", m.style.willChange = s.willChange ?? "", r.current = null;
-    };
-    let k = 0;
-    const y = () => {
-      cancelAnimationFrame(k), k = requestAnimationFrame(A);
-    }, I = new MutationObserver((s) => {
-      for (const w of s)
-        if (w.type === "attributes" && (w.attributeName === "style" || w.attributeName === "class")) {
-          y();
-          break;
-        }
-    });
-    return I.observe(document.body, { attributes: !0, attributeFilter: ["style", "class"] }), window.addEventListener("resize", y), y(), () => {
-      cancelAnimationFrame(k), I.disconnect(), window.removeEventListener("resize", y), H();
-    };
-  }, [c, i, f]);
-}
-function Ee({
-  gameCubeSize: c,
-  screenHeight: h,
-  screenWidth: r
+function Mn({
+  gameCubeSize: o,
+  screenHeight: x,
+  screenWidth: l
 }) {
-  const i = V(null), f = V(null), [m, M] = a(null), [A, H] = a(null);
-  Ie(i, { minDesktopWidth: 1024, forceResize: !1 }), _(() => {
-    const e = i.current;
-    if (!e) return;
-    let t = e.shadowRoot;
-    t || (t = e.attachShadow({ mode: "open" })), e.style.position = "fixed", e.style.top = "0", e.style.left = "0", e.style.width = "100vw", e.style.height = "100vh", e.style.zIndex = "9999", e.style.background = "linear-gradient(to bottom, #fff8f8, #f9fafb)", e.style.margin = "0", e.style.padding = "0", e.style.transform = "none", e.style.zoom = "1", t.innerHTML = "";
-    const l = document.createElement("style");
-    l.textContent = `
-      :host {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        overflow: hidden;
-      }
-      
-      #whats-missing-root, #whats-missing-root * { 
-        box-sizing: border-box; 
-      }
-      
-      #whats-missing-root img { 
-        max-width: 100%; 
-        height: auto; 
-        display: block; 
-        user-select: none; 
-      }
-      
-      #whats-missing-root {
-        position: relative;
-        width: 100%;
-        height: 100%;
-        max-width: 1200px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-      }
-    `, t.appendChild(l), H(t);
-  }, []), F(() => {
-    const e = document.body, t = document.documentElement, l = e.style.zoom, g = e.style.transform, v = t.style.zoom, L = t.style.transform;
-    return e.style.zoom = "1", e.style.transform = "none", t.style.zoom = "1", t.style.transform = "none", () => {
-      e.style.zoom = l, e.style.transform = g, t.style.zoom = v, t.style.transform = L;
-    };
-  }, []);
-  const k = Z(() => {
-    const e = c ?? Math.min(r ?? 1e3, h ?? 1e3), t = r ?? (typeof window < "u" ? window.innerWidth : 1e3);
-    return e < 600 && t > 768 ? 600 : t <= 768 ? Math.min(e, t - 20) : e;
-  }, [c, r, h]);
-  F(() => () => {
+  const w = Hn(null);
+  D(() => (Sn(), () => {
     document.body.style.overflow = "";
-  }, []);
-  const [y, I] = a(null), [s, w] = a([]), [x, S] = a(4), [u, T] = a(!1), [z, K] = a(1), [C, me] = a(null), [b, E] = a("ready"), [J, Q] = a(3), [G, N] = a(10), [$, X] = a(20), [he, D] = a(0), [W, O] = a(!1), [j, ee] = a(""), [R, q] = a(!1), [Y, te] = a(!1), [ne, B] = a(null), [ue, P] = a([]), [ge, oe] = a([]), [p, fe] = a(!1);
-  F(() => {
-    if (typeof window > "u") return;
-    const e = () => {
-      const t = r ?? window.innerWidth, l = window.matchMedia && window.matchMedia("(pointer: coarse)").matches;
-      fe(t <= 768 || l);
-    };
-    return e(), window.addEventListener("resize", e), window.addEventListener("orientationchange", e), () => {
-      window.removeEventListener("resize", e), window.removeEventListener("orientationchange", e);
+  }), []);
+  const [s, U] = r(null), [u, N] = r([]), [k, dn] = r(4), [f, P] = r(!1), [v, V] = r(1), [m, wn] = r(null), [c, S] = r("ready"), [_, $] = r(3), [C, I] = r(10), [R, q] = r(20), [rn, M] = r(0), [z, A] = r(!1), [T, K] = r(""), [H, B] = r(!1), [L, O] = r(!1), [Z, y] = r(null), [hn, j] = r([]), [sn, J] = r([]), [n, gn] = r(!1), [Tn, E] = r(1), [Q, G] = r(null), [a, pn] = r(!1);
+  D(() => {
+    const i = () => {
+      const d = l ?? window.innerWidth, p = x ?? window.innerHeight, g = d < 768, W = p < 700, b = d >= 1200 && p >= 600 && !g;
+      if (pn(b), gn(g), g)
+        G(o && o >= 320 ? o : null), E(1);
+      else if (W)
+        G(o && o >= 400 ? o : null), E(1);
+      else {
+        const mn = o ? Math.max(400, Math.min(1200, o)) : Math.min(1e3, Math.min(d, p) * 0.9);
+        G(mn), E(1);
+      }
     };
-  }, [r]), _(() => {
-    const e = f.current;
-    if (!e || typeof window > "u") return;
-    let t = null;
-    try {
-      t = new ResizeObserver((l) => {
-        for (const g of l) {
-          const v = g.contentRect;
-          M(Math.round(Math.min(v.width, v.height)));
-        }
-      }), t.observe(e), M(Math.round(Math.min(e.clientWidth, e.clientHeight)));
-    } catch {
-      M(Math.round(Math.min(e.clientWidth, e.clientHeight)));
-    }
-    return () => t?.disconnect();
-  }, [p]);
-  const ie = (e) => [...e].sort(() => Math.random() - 0.5).slice(0, 6), re = () => {
-    if (!y) return;
-    const e = ie(ce[y]);
-    w(e), T(!0), O(!1), K(1), D(0), P([]), oe([]), se(e, [], !0);
-  }, se = (e = s, t = ge, l = !1) => {
-    const g = ie(e.length ? e : ce[y]);
-    let v = Math.floor(Math.random() * g.length), L = g[v].name, de = 0;
-    for (; t.includes(L) && de < 20; )
-      v = Math.floor(Math.random() * g.length), L = g[v].name, de++;
-    w(g), me(v), oe([...t, L]), q(!1), ee(""), X(20), B(null), l ? (E("ready"), Q(3), N(10)) : (E("memorize"), N(10));
+    return i(), window.addEventListener("resize", i), () => window.removeEventListener("resize", i);
+  }, [l, x, o]);
+  const X = (i) => [...i].sort(() => Math.random() - 0.5).slice(0, 6), nn = () => {
+    if (!s) return;
+    const i = X(on[s]);
+    N(i), P(!0), A(!1), V(1), M(0), j([]), J([]), en(i, [], !0);
+  }, en = (i = u, d = sn, p = !1) => {
+    const g = X(i.length ? i : on[s]);
+    let W = Math.floor(Math.random() * g.length), b = g[W].name, F = 0;
+    for (; d.includes(b) && F < 20; )
+      W = Math.floor(Math.random() * g.length), b = g[W].name, F++;
+    N(g), wn(W), J([...d, b]), B(!1), K(""), q(20), y(null), p ? (S("ready"), $(3), I(10)) : (S("memorize"), I(10));
   };
-  F(() => {
-    if (!(!u || W || R)) {
-      if (b === "ready")
-        if (J <= 0) E("memorize");
+  D(() => {
+    if (!(!f || z || H)) {
+      if (c === "ready")
+        if (_ <= 0) S("memorize");
         else {
-          const e = setTimeout(() => Q((t) => t - 1), 1e3);
-          return () => clearTimeout(e);
+          const i = setTimeout(() => $((d) => d - 1), 1e3);
+          return () => clearTimeout(i);
         }
-      if (b === "memorize")
-        if (G <= 0) E("guess");
+      if (c === "memorize")
+        if (C <= 0) S("guess");
         else {
-          const e = setTimeout(() => N((t) => t - 1), 1e3);
-          return () => clearTimeout(e);
+          const i = setTimeout(() => I((d) => d - 1), 1e3);
+          return () => clearTimeout(i);
         }
-      if (b === "guess") {
-        if ($ <= 0) {
-          q(!0), B("wrong");
-          const t = s[C].name;
-          P((l) => [
-            ...l,
-            { round: z, answer: j, correct: t, result: "wrong" }
+      if (c === "guess") {
+        if (R <= 0) {
+          B(!0), y("wrong");
+          const d = u[m].name;
+          j((p) => [
+            ...p,
+            { round: v, answer: T, correct: d, result: "wrong" }
           ]);
           return;
         }
-        const e = setTimeout(() => X((t) => t - 1), 1e3);
-        return () => clearTimeout(e);
+        const i = setTimeout(() => q((d) => d - 1), 1e3);
+        return () => clearTimeout(i);
       }
     }
-  }, [b, J, G, $, u, W, R, s, C, z, j]);
-  const pe = () => {
-    if (C === null || Y) return;
-    const e = s[C].name, t = j.toLowerCase().trim();
-    let l = "wrong";
-    t === e ? (D((g) => g + 1), B("correct"), l = "correct") : He(t, e) === 1 ? (D((g) => g + 0.5), B("almost"), l = "almost") : (B("wrong"), l = "wrong"), P((g) => [...g, { round: z, answer: t, correct: e, result: l }]), te(!0), setTimeout(() => {
-      te(!1), q(!0);
+  }, [c, _, C, R, f, z, H, u, m, v, T]);
+  const ln = () => {
+    if (m === null || L) return;
+    const i = u[m].name, d = T.toLowerCase().trim();
+    let p = "wrong";
+    d === i ? (M((g) => g + 1), y("correct"), p = "correct") : zn(d, i) === 1 ? (M((g) => g + 0.5), y("almost"), p = "almost") : (y("wrong"), p = "wrong"), j((g) => [...g, { round: v, answer: d, correct: i, result: p }]), O(!0), setTimeout(() => {
+      O(!1), B(!0);
     }, 600);
-  }, ye = () => z < x ? (K((e) => e + 1), se()) : O(!0), we = () => {
-    T(!1), O(!1), I(null);
-  }, be = Z(
-    () => /* @__PURE__ */ n("div", { style: { ...o.gmLogoFixed, position: "absolute", top: 16, left: 16, zIndex: 30 }, children: /* @__PURE__ */ d("picture", { children: [
-      /* @__PURE__ */ n(
-        "source",
-        {
-          srcSet: window.origin + "/cloud/speakid/games/whatsmissing/logo.svg",
-          type: "image/svg+xml"
-        }
-      ),
-      /* @__PURE__ */ n(
-        "img",
-        {
-          src: window.origin + "/cloud/speakid/games/whatsmissing/logo.png",
-          alt: "SPEAKID Logo",
-          style: o.gmLogoImg,
-          loading: "lazy"
-        }
-      )
-    ] }) }),
-    []
-  ), le = 1200, ae = 700, xe = Z(() => {
-    const e = r ?? (typeof window < "u" ? window.innerWidth : le), t = h ?? (typeof window < "u" ? window.innerHeight : ae), l = Math.min(e / le, t / ae);
-    return Math.min(1.35, Math.max(1, l));
-  }, [r, h, p]);
-  return /* @__PURE__ */ n("div", { ref: i, style: { width: "100%", height: "100%" }, children: A && ze(
-    /* @__PURE__ */ n(
-      "div",
-      {
-        id: "whats-missing-root",
-        style: { all: "unset" },
-        children: /* @__PURE__ */ n(
-          "div",
+  }, an = () => v < k ? (V((i) => i + 1), en()) : A(!0), xn = () => {
+    P(!1), A(!1), U(null);
+  }, cn = Wn(
+    () => n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? null : (
+      // ensure logo is positioned inside the square container
+      /* @__PURE__ */ e("div", { style: { ...t.gmLogoFixed, position: "absolute", top: 16, left: 16, zIndex: 30 }, children: /* @__PURE__ */ h("picture", { children: [
+        /* @__PURE__ */ e(
+          "source",
           {
-            ref: f,
-            style: {
-              width: p ? "100%" : `${k}px`,
-              height: p ? "100%" : `${k}px`,
-              borderRadius: p ? 0 : "20px",
-              background: "linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%)",
-              position: "relative",
-              overflow: "hidden",
-              boxShadow: p ? "none" : "0 0 40px rgba(0,0,0,0.08)",
-              display: "flex",
-              justifyContent: "center",
-              alignItems: "center"
-            },
-            children: /* @__PURE__ */ d(
-              "div",
-              {
-                style: {
-                  transform: `scale(${xe})`,
-                  transformOrigin: "center center",
-                  transition: "transform 0.2s ease-out",
-                  width: "100%",
-                  height: "100%",
-                  display: "flex",
-                  flexDirection: "column",
-                  justifyContent: "center",
-                  alignItems: "center"
-                },
-                children: [
-                  !p && be,
-                  !y && !u && /* @__PURE__ */ d("div", { style: o.gmCenterScreen, children: [
-                    /* @__PURE__ */ n("h1", { style: o.gmHeadline1, children: "WHAT'S MISSING?" }),
-                    /* @__PURE__ */ n("p", { style: o.gmBodyM, children: "Select a theme:" }),
-                    /* @__PURE__ */ n("div", { style: { display: "flex", gap: 16 }, children: ["animals", "food", "toys"].map((e) => /* @__PURE__ */ n("button", { style: o.gmButton, onClick: () => I(e), children: e === "animals" ? "🐶 Animals" : e === "food" ? "🍎 Food" : "🧸 Toys" }, e)) }),
-                    /* @__PURE__ */ d("div", { style: { marginTop: 24 }, children: [
-                      /* @__PURE__ */ n("p", { style: o.gmBodyS, children: "Choose number of rounds:" }),
-                      /* @__PURE__ */ n("div", { style: { display: "flex", gap: 12, marginTop: 8 }, children: [3, 4, 5].map((e) => /* @__PURE__ */ n(
-                        "button",
-                        {
-                          style: {
-                            ...o.gmButton,
-                            ...x === e ? o.gmButtonActive : {}
-                          },
-                          onClick: () => S(e),
-                          children: e
+            srcSet: window.origin + "/cloud/speakid/games/whatsmissing/logo.svg",
+            type: "image/svg+xml"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "img",
+          {
+            src: window.origin + "/cloud/speakid/games/whatsmissing/logo.png",
+            alt: "SPEAKID Logo",
+            style: t.gmLogoImg,
+            loading: "lazy"
+          }
+        )
+      ] }) })
+    ),
+    [n]
+  );
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: w,
+      style: {
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        background: "linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%)",
+        transition: "background 0.3s ease",
+        overflow: "hidden",
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0
+      },
+      children: /* @__PURE__ */ e(
+        "div",
+        {
+          style: {
+            width: n ? "100%" : Q || o || 1e3,
+            height: n ? "100%" : Q || o || 1e3,
+            display: "flex",
+            justifyContent: "center",
+            alignItems: "center",
+            overflow: "hidden",
+            borderRadius: n ? 0 : "20px",
+            background: "linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%)",
+            boxShadow: n ? "none" : "0 0 40px rgba(0,0,0,0.1)",
+            margin: n ? "0 auto" : "unset",
+            position: "relative"
+            // needed so absolute logo is inside the square
+          },
+          children: /* @__PURE__ */ e(
+            "div",
+            {
+              style: {
+                transform: "none",
+                width: "100%",
+                height: "100%",
+                display: "flex",
+                justifyContent: "center",
+                alignItems: "center"
+              },
+              children: /* @__PURE__ */ h("div", { id: "whats-missing-root", children: [
+                !n && cn,
+                !s && !f && /* @__PURE__ */ h("div", { style: t.gmCenterScreen, children: [
+                  /* @__PURE__ */ e("h1", { style: t.gmHeadline1, children: "WHAT'S MISSING?" }),
+                  /* @__PURE__ */ e("p", { style: t.gmBodyM, children: "Select a theme:" }),
+                  /* @__PURE__ */ e("div", { style: { display: "flex", gap: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px" : "16px" }, children: ["animals", "food", "toys"].map((i) => /* @__PURE__ */ e("button", { style: {
+                    ...t.gmButton,
+                    padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px 12px" : "12px 24px",
+                    fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
+                    minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "70px" : "auto"
+                  }, onClick: () => U(i), children: i === "animals" ? "🐶 Animals" : i === "food" ? "🍎 Food" : "🧸 Toys" }, i)) }),
+                  /* @__PURE__ */ h("div", { style: { marginTop: 24 }, children: [
+                    /* @__PURE__ */ e("p", { style: t.gmBodyS, children: "Choose number of rounds:" }),
+                    /* @__PURE__ */ e("div", { style: { display: "flex", gap: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px" : "12px", marginTop: 8 }, children: [3, 4, 5].map((i) => /* @__PURE__ */ e(
+                      "button",
+                      {
+                        style: {
+                          ...t.gmButton,
+                          ...k === i ? t.gmButtonActive : {},
+                          padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px 10px" : "12px 24px",
+                          fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
+                          minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "40px" : "auto"
                         },
-                        e
-                      )) })
-                    ] })
+                        onClick: () => dn(i),
+                        children: i
+                      },
+                      i
+                    )) })
+                  ] })
+                ] }),
+                s && !f && /* @__PURE__ */ h("div", { style: t.gmCenterScreen, children: [
+                  /* @__PURE__ */ h("h1", { style: t.gmHeadline1, children: [
+                    "Theme selected: ",
+                    s
                   ] }),
-                  y && !u && /* @__PURE__ */ d("div", { style: o.gmCenterScreen, children: [
-                    /* @__PURE__ */ d("h1", { style: o.gmHeadline1, children: [
-                      "Theme selected: ",
-                      y
-                    ] }),
-                    /* @__PURE__ */ d("p", { style: o.gmBodyM, children: [
-                      "Rounds: ",
-                      x
-                    ] }),
-                    /* @__PURE__ */ n("button", { style: o.gmButton, onClick: re, children: "▶ Start game" })
+                  /* @__PURE__ */ h("p", { style: t.gmBodyM, children: [
+                    "Rounds: ",
+                    k
                   ] }),
-                  W && /* @__PURE__ */ d("div", { style: o.gmCenterScreen, children: [
-                    /* @__PURE__ */ n("h1", { style: o.gmHeadline1, children: "Results" }),
-                    /* @__PURE__ */ d("h2", { style: o.gmHeadline3, children: [
-                      "Your score: ",
-                      he,
-                      " / ",
-                      x
-                    ] }),
-                    /* @__PURE__ */ n("p", { style: { ...o.gmBodyM, color: "#10b981", marginTop: 12 }, children: "Yahoo! You did it! 🍬✨" }),
-                    /* @__PURE__ */ d("table", { style: o.gmTable, children: [
-                      /* @__PURE__ */ n("thead", { children: /* @__PURE__ */ d("tr", { children: [
-                        /* @__PURE__ */ n("th", { children: "Round" }),
-                        /* @__PURE__ */ n("th", { children: "Your Answer" }),
-                        /* @__PURE__ */ n("th", { children: "Correct" }),
-                        /* @__PURE__ */ n("th", { children: "Result" })
-                      ] }) }),
-                      /* @__PURE__ */ n("tbody", { children: ue.map((e, t) => /* @__PURE__ */ d("tr", { children: [
-                        /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.round }),
-                        /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.answer || "—" }),
-                        /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.correct }),
-                        /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.result === "correct" ? "✔ Correct" : e.result === "almost" ? "◐ Almost (0.5)" : "✘ Wrong" })
-                      ] }, t)) })
-                    ] }),
-                    /* @__PURE__ */ d("div", { style: { display: "flex", gap: 12, marginTop: 24 }, children: [
-                      /* @__PURE__ */ n("button", { style: o.gmButton, onClick: re, children: "🔁 Play again" }),
-                      /* @__PURE__ */ n("button", { style: o.gmButton, onClick: we, children: "⬅️ Choose theme" })
-                    ] })
+                  /* @__PURE__ */ e("button", { style: {
+                    ...t.gmButton,
+                    padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px 16px" : "12px 24px",
+                    fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "14px" : "16px",
+                    minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "120px" : "auto"
+                  }, onClick: nn, children: "▶ Start game" })
+                ] }),
+                z && /* @__PURE__ */ h("div", { style: t.gmCenterScreen, children: [
+                  /* @__PURE__ */ e("h1", { style: t.gmHeadline1, children: "Results" }),
+                  /* @__PURE__ */ h("h2", { style: t.gmHeadline3, children: [
+                    "Your score: ",
+                    rn,
+                    " / ",
+                    k
                   ] }),
-                  u && !W && /* @__PURE__ */ d("div", { style: o.gmGameLayout, children: [
-                    /* @__PURE__ */ d(
-                      "div",
-                      {
-                        style: {
-                          minHeight: 160,
-                          display: "flex",
-                          flexDirection: "column",
-                          justifyContent: "center",
-                          alignItems: "center"
-                        },
-                        children: [
-                          b === "ready" && /* @__PURE__ */ d(ve, { children: [
-                            /* @__PURE__ */ n("h1", { style: { ...o.gmHeadline1, color: "#ec4c44" }, children: "GET READY" }),
-                            /* @__PURE__ */ n("div", { style: o.gmHourglass, children: "⏳" })
-                          ] }),
-                          b === "memorize" && /* @__PURE__ */ d("p", { style: { ...o.gmBodyM, color: "#10b981" }, children: [
-                            "MEMORIZE (",
-                            G,
-                            ")"
-                          ] }),
-                          b === "guess" && !R && /* @__PURE__ */ d("p", { style: o.gmBodyM, children: [
-                            "⏳ Time left: ",
-                            $,
-                            "s"
-                          ] })
-                        ]
-                      }
-                    ),
-                    b !== "ready" && /* @__PURE__ */ n(
-                      "div",
-                      {
-                        style: {
-                          ...o.gmGrid,
-                          display: "grid",
-                          gridTemplateColumns: `repeat(${p ? 2 : 3}, 1fr)`,
-                          gridTemplateRows: `repeat(${p ? 3 : 2}, 1fr)`,
-                          gap: p ? 12 : 20,
-                          justifyContent: "center",
-                          alignContent: "center",
-                          padding: p ? 8 : 16,
-                          width: "100%",
-                          height: "100%",
-                          maxWidth: p ? "100%" : 600,
-                          maxHeight: p ? "100%" : 400,
-                          boxSizing: "border-box"
-                        },
-                        children: s.map((e, t) => {
-                          const l = C === t && b === "guess" && !R;
-                          return /* @__PURE__ */ n(
-                            "div",
-                            {
-                              style: {
-                                ...o.gmCard,
-                                width: "100%",
-                                height: "100%",
-                                ...ne === "correct" && C === t ? o.gmCorrect : {},
-                                ...ne === "wrong" && C === t ? o.gmWrong : {}
-                              },
-                              children: !l && /* @__PURE__ */ n(
-                                "img",
-                                {
-                                  src: e.src,
-                                  alt: e.name,
-                                  style: {
-                                    width: "100%",
-                                    height: "100%",
-                                    objectFit: "cover",
-                                    display: "block"
-                                  }
-                                }
-                              )
-                            },
-                            t
-                          );
-                        })
-                      }
-                    ),
-                    /* @__PURE__ */ d("div", { style: { marginTop: 16, height: 80 }, children: [
-                      b === "guess" && !R && /* @__PURE__ */ d("div", { children: [
-                        /* @__PURE__ */ n(
-                          "input",
-                          {
-                            type: "text",
-                            placeholder: "Type the missing word",
-                            value: j,
-                            onChange: (e) => ee(e.target.value),
-                            style: o.gmInput
-                          }
-                        ),
-                        /* @__PURE__ */ n(
-                          "button",
+                  /* @__PURE__ */ e("p", { style: { ...t.gmBodyM, color: "#10b981", marginTop: 12 }, children: "Yahoo! You did it! 🍬✨" }),
+                  /* @__PURE__ */ h("table", { style: t.gmTable, children: [
+                    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ h("tr", { children: [
+                      /* @__PURE__ */ e("th", { children: "Round" }),
+                      /* @__PURE__ */ e("th", { children: "Your Answer" }),
+                      /* @__PURE__ */ e("th", { children: "Correct" }),
+                      /* @__PURE__ */ e("th", { children: "Result" })
+                    ] }) }),
+                    /* @__PURE__ */ e("tbody", { children: hn.map((i, d) => /* @__PURE__ */ h("tr", { children: [
+                      /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.round }),
+                      /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.answer || "—" }),
+                      /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.correct }),
+                      /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.result === "correct" ? "✔ Correct" : i.result === "almost" ? "◐ Almost (0.5)" : "✘ Wrong" })
+                    ] }, d)) })
+                  ] }),
+                  /* @__PURE__ */ h("div", { style: {
+                    display: "flex",
+                    gap: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px" : "12px",
+                    marginTop: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "2px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a ? "12px" : "24px"
+                  }, children: [
+                    /* @__PURE__ */ e("button", { style: {
+                      ...t.gmButton,
+                      padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px 10px" : "12px 24px",
+                      fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
+                      minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "80px" : "auto"
+                    }, onClick: nn, children: "🔁 Play again" }),
+                    /* @__PURE__ */ e("button", { style: {
+                      ...t.gmButton,
+                      padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px 10px" : "12px 24px",
+                      fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
+                      minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "80px" : "auto"
+                    }, onClick: xn, children: "⬅️ Choose theme" })
+                  ] })
+                ] }),
+                f && !z && /* @__PURE__ */ h("div", { style: t.gmGameLayout, children: [
+                  /* @__PURE__ */ h(
+                    "div",
+                    {
+                      style: {
+                        minHeight: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "45px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "50px" : n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "60px" : "160px",
+                        display: "flex",
+                        flexDirection: "column",
+                        justifyContent: "center",
+                        alignItems: "center",
+                        paddingTop: n && window.innerWidth <= 375 && window.innerHeight <= 667 || n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "8px" : n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "15px" : "40px"
+                      },
+                      children: [
+                        c === "ready" && /* @__PURE__ */ h(tn, { children: [
+                          /* @__PURE__ */ e("h1", { style: { ...t.gmHeadline1, color: "#ec4c44" }, children: "GET READY" }),
+                          /* @__PURE__ */ e("div", { style: t.gmHourglass, children: "⏳" })
+                        ] }),
+                        c === "memorize" && /* @__PURE__ */ h("p", { style: { ...t.gmBodyM, color: "#10b981" }, children: [
+                          "MEMORIZE (",
+                          C,
+                          ")"
+                        ] }),
+                        c === "guess" && !H && /* @__PURE__ */ h("p", { style: t.gmBodyM, children: [
+                          "⏳ Time left: ",
+                          R,
+                          "s"
+                        ] })
+                      ]
+                    }
+                  ),
+                  c !== "ready" && /* @__PURE__ */ e(
+                    "div",
+                    {
+                      style: {
+                        ...t.gmGrid,
+                        gridTemplateColumns: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "repeat(3, 1fr)" : n ? "repeat(2, 1fr)" : window.innerHeight < 700 ? "repeat(3, 1fr)" : "repeat(3, 210px)",
+                        // desktop: 3 колонки фиксированного размера
+                        gridAutoRows: n && window.innerWidth > window.innerHeight ? "120px" : n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "100px" : n ? "150px" : window.innerHeight < 700 ? "140px" : "210px",
+                        // desktop: стандартная высота
+                        gap: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : n || window.innerHeight < 700 ? "8px" : "20px",
+                        justifyItems: "center",
+                        maxWidth: n && window.innerWidth > window.innerHeight ? "90%" : n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "95%" : "100%",
+                        padding: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px" : "16px"
+                      },
+                      children: u.map((i, d) => {
+                        const p = m === d && c === "guess" && !H;
+                        return /* @__PURE__ */ e(
+                          "div",
                           {
-                            style: { ...o.gmButton, marginLeft: 8 },
-                            onClick: pe,
-                            disabled: Y,
-                            children: Y ? "..." : "Check"
+                            style: {
+                              width: "100%",
+                              height: "100%",
+                              borderRadius: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px" : "12px",
+                              overflow: "hidden",
+                              boxShadow: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "0 1px 4px rgba(0,0,0,0.1)" : "0 4px 12px rgba(0,0,0,0.15)",
+                              transition: "all 0.3s ease",
+                              cursor: "pointer",
+                              ...Z === "correct" && m === d ? {
+                                boxShadow: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "0 0 15px #10b981" : "0 0 20px #10b981",
+                                transform: "scale(1.03)"
+                              } : {},
+                              ...Z === "wrong" && m === d ? {
+                                boxShadow: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "0 0 15px #ef4444" : "0 0 20px #ef4444",
+                                transform: "scale(1.03)"
+                              } : {}
+                            },
+                            children: !p && /* @__PURE__ */ e(
+                              "img",
+                              {
+                                src: i.src,
+                                alt: i.name,
+                                style: {
+                                  width: "100%",
+                                  height: "100%",
+                                  objectFit: "cover"
+                                }
+                              }
+                            )
+                          },
+                          d
+                        );
+                      })
+                    }
+                  ),
+                  /* @__PURE__ */ h("div", { style: {
+                    marginTop: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "1px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "2px" : n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "4px" : "16px",
+                    height: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "40px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "45px" : n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "50px" : "80px"
+                  }, children: [
+                    c === "guess" && !H && /* @__PURE__ */ e("div", { style: {
+                      display: "flex",
+                      flexDirection: n && window.innerWidth > window.innerHeight || window.innerHeight < 700 || window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a ? "row" : "column",
+                      gap: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "3px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "4px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a ? "8px" : n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "6px" : "12px",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      width: "100%",
+                      maxWidth: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "270px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "350px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "400px" : "300px"
+                    }, children: /* @__PURE__ */ h(tn, { children: [
+                      /* @__PURE__ */ e(
+                        "input",
+                        {
+                          type: "text",
+                          placeholder: "Type the missing word",
+                          value: T,
+                          onChange: (i) => K(i.target.value),
+                          style: {
+                            ...t.gmInput,
+                            width: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "170px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "220px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "250px" : "auto",
+                            padding: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "5px 6px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "6px 8px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "10px 12px" : "12px 16px",
+                            fontSize: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "10px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "11px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "14px" : "16px",
+                            flex: n && window.innerWidth > window.innerHeight || window.innerHeight < 700 || window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a ? "1" : "none"
                           }
-                        )
-                      ] }),
-                      R && /* @__PURE__ */ n("button", { type: "button", style: o.gmButton, onClick: ye, children: "Next round" })
-                    ] })
+                        }
+                      ),
+                      /* @__PURE__ */ e(
+                        "button",
+                        {
+                          style: {
+                            ...t.gmButton,
+                            marginLeft: n && window.innerWidth > window.innerHeight || window.innerHeight < 700 || window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a ? "8px" : "0",
+                            padding: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "5px 8px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "6px 10px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "10px 16px" : "12px 24px",
+                            fontSize: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "10px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "11px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "14px" : "16px",
+                            minWidth: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "45px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "55px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || window.innerWidth === 1280 && window.innerHeight === 720 || window.innerWidth === 1440 && window.innerHeight === 900 || a || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "80px" : "100px",
+                            flexShrink: 0
+                          },
+                          onClick: ln,
+                          disabled: L,
+                          children: L ? "..." : "Check"
+                        }
+                      )
+                    ] }) }),
+                    H && /* @__PURE__ */ e("button", { style: {
+                      ...t.gmButton,
+                      padding: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "5px 8px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "6px 10px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "10px 16px" : "12px 24px",
+                      fontSize: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "10px" : n && window.innerWidth > window.innerHeight && window.innerHeight <= 428 || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 ? "11px" : window.innerWidth === 1366 && window.innerHeight === 766 || window.innerWidth === 1366 && window.innerHeight === 768 || n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "14px" : "16px"
+                    }, onClick: an, children: "Next round" })
                   ] })
-                ]
-              }
-            )
-          }
-        )
-      }
-    ),
-    A
-  ) });
+                ] })
+              ] })
+            }
+          )
+        }
+      )
+    }
+  );
 }
 export {
-  Ee as Game,
-  ce as themes
+  Mn as Game,
+  on as themes
 };