@mblinkov/whats-missing 20.0.42 → 20.0.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/whats-missing.cjs.js +28 -44
  2. package/dist/whats-missing.es.js +411 -463
  3. package/package.json +1 -1
  4. package/src/Game.tsx +655 -510
package/dist/whats-missing.es.js CHANGED
@@ -1,10 +1,9 @@
1
- import { jsx as n, jsxs as d, Fragment as ve } from "react/jsx-runtime";
2
- import { useRef as V, useState as a, useLayoutEffect as _, useEffect as F, useMemo as Z } from "react";
3
- import { createPortal as ze } from "react-dom";
4
- const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c.map(([r, i]) => ({
5
- src: `${Ce}${h}/${i.replace(/\s/g, "%20")}.png`,
6
- name: i
7
- })), ke = [
1
+ import { jsx as e, jsxs as h, Fragment as tn } from "react/jsx-runtime";
2
+ import { useRef as Hn, useEffect as D, useState as r, useMemo as Wn } from "react";
3
+ const un = window.origin + "/cloud/speakid/games/whatsmissing/", Y = (o, x) => o.map(([l, w]) => ({
4
+ src: `${un}${x}/${w.replace(/\s/g, "%20")}.png`,
5
+ name: w
6
+ })), fn = [
8
7
  ["apple", "apple"],
9
8
  ["banana", "banana"],
10
9
  ["bread", "bread"],
@@ -30,7 +29,7 @@ const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c
30
29
  ["strawberry", "strawberry"],
31
30
  ["tomato", "tomato"],
32
31
  ["watermelon", "watermelon"]
33
- ], Se = [
32
+ ], yn = [
34
33
  ["bear", "bear"],
35
34
  ["cat", "cat"],
36
35
  ["crocodile", "crocodile"],
@@ -50,7 +49,7 @@ const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c
50
49
  ["tortoise", "tortoise"],
51
50
  ["wolf", "wolf"],
52
51
  ["zebra", "zebra"]
53
- ], Te = [
52
+ ], bn = [
54
53
  ["ball", "ball"],
55
54
  ["balloon", "balloon"],
56
55
  ["blocks", "blocks"],
@@ -70,23 +69,23 @@ const Ce = window.origin + "/cloud/speakid/games/whatsmissing/", U = (c, h) => c
70
69
  ["teddy_bear", "teddy bear"],
71
70
  ["yo-yo", "yo-yo"],
72
71
  ["crayons", "crayons"]
73
- ], ce = {
74
- food: U(ke, "food"),
75
- animals: U(Se, "animals"),
76
- toys: U(Te, "toys")
77
- }, Re = `
72
+ ], on = {
73
+ food: Y(fn, "food"),
74
+ animals: Y(yn, "animals"),
75
+ toys: Y(bn, "toys")
76
+ }, kn = `
78
77
  @keyframes spin {
79
78
  from { transform: rotate(0deg); }
80
79
  to { transform: rotate(360deg); }
81
80
  }
82
81
  `;
83
82
  if (typeof document < "u" && !document.getElementById("spin-keyframes")) {
84
- const c = document.createElement("style");
85
- c.id = "spin-keyframes", c.innerHTML = Re, document.head.appendChild(c);
83
+ const o = document.createElement("style");
84
+ o.id = "spin-keyframes", o.innerHTML = kn, document.head.appendChild(o);
86
85
  }
87
- const Me = {
86
+ const vn = {
88
87
  animation: "spin 1.4s linear infinite"
89
- }, o = {
88
+ }, t = {
90
89
  gmCenterScreen: {
91
90
  position: "relative",
92
91
  zIndex: 1,
@@ -171,27 +170,6 @@ const Me = {
171
170
  gap: "20px",
172
171
  justifyContent: "center"
173
172
  },
174
- gmCard: {
175
- border: "1px solid #e5e7eb",
176
- borderRadius: "16px",
177
- background: "#f9f9f9",
178
- aspectRatio: "1 / 1",
179
- display: "flex",
180
- alignItems: "center",
181
- justifyContent: "center",
182
- overflow: "hidden",
183
- transition: "transform .2s ease, box-shadow .2s ease, border-color .2s ease"
184
- },
185
- gmCorrect: {
186
- border: "2px solid #10b981",
187
- boxShadow: "0 0 18px rgba(16,185,129,.45)",
188
- background: "#ecfdf5"
189
- },
190
- gmWrong: {
191
- border: "2px solid #ec4c44",
192
- boxShadow: "0 0 18px rgba(236,76,68,.35)",
193
- background: "#fef2f2"
194
- },
195
173
  gmInput: {
196
174
  padding: "6px 10px",
197
175
  borderRadius: "6px",
@@ -240,454 +218,424 @@ const Me = {
240
218
  },
241
219
  gmHourglass: {
242
220
  fontSize: "42px",
243
- ...Me
221
+ ...vn
244
222
  }
245
- }, He = (c, h) => {
246
- const r = Array.from({ length: c.length + 1 }, () => Array(h.length + 1).fill(0));
247
- for (let i = 0; i <= c.length; i++) r[i][0] = i;
248
- for (let i = 0; i <= h.length; i++) r[0][i] = i;
249
- for (let i = 1; i <= c.length; i++)
250
- for (let f = 1; f <= h.length; f++)
251
- 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;
252
- return r[c.length][h.length];
223
+ }, Sn = () => {
224
+ const o = document.createElement("style");
225
+ o.textContent = `
226
+ #whats-missing-root, #whats-missing-root * {
227
+ box-sizing: border-box;
228
+ font-family: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
229
+ }
230
+ #whats-missing-root img {
231
+ max-width: 100%;
232
+ height: auto;
233
+ display: block;
234
+ user-select: none;
235
+ }
236
+ html, body {
237
+ margin: 0 !important;
238
+ padding: 0 !important;
239
+ width: 100% !important;
240
+ height: 100% !important;
241
+ overflow: hidden !important;
242
+ zoom: 1 !important; /* ✅ защита от подзума */
243
+ }
244
+ #root {
245
+ margin: 0 !important;
246
+ padding: 0 !important;
247
+ width: 100% !important;
248
+ height: 100% !important;
249
+ overflow: hidden !important;
250
+ }
251
+ `, document.head.appendChild(o);
252
+ }, zn = (o, x) => {
253
+ const l = Array.from({ length: o.length + 1 }, () => Array(x.length + 1).fill(0));
254
+ for (let w = 0; w <= o.length; w++) l[w][0] = w;
255
+ for (let w = 0; w <= x.length; w++) l[0][w] = w;
256
+ for (let w = 1; w <= o.length; w++)
257
+ for (let s = 1; s <= x.length; s++)
258
+ 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;
259
+ return l[o.length][x.length];
253
260
  };
254
- function Ie(c, h = { minDesktopWidth: 1200, forceResize: !1 }) {
255
- const r = V(null), i = h.minDesktopWidth ?? 1200, f = !!h.forceResize;
256
- _(() => {
257
- if (typeof window > "u" || !c || !c.current) return;
258
- const m = c.current, M = () => {
259
- try {
260
- const s = document.body, w = getComputedStyle(s), x = parseFloat(s.style && s.style.zoom || "");
261
- if (x && !isNaN(x) && x > 0) return x;
262
- const S = parseFloat(w.zoom || "");
263
- if (S && !isNaN(S) && S > 0) return S;
264
- const u = document.createElement("div");
265
- 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);
266
- const T = u.getBoundingClientRect();
267
- if (document.documentElement.removeChild(u), T && T.width > 0) {
268
- const z = T.width / 100;
269
- if (!isNaN(z) && z > 0) return z;
270
- }
271
- } catch {
272
- }
273
- return 1;
274
- }, A = () => {
275
- if (i && window.innerWidth < i) {
276
- H();
277
- return;
278
- }
279
- const s = M();
280
- if (!s || s === 1) {
281
- H();
282
- return;
283
- }
284
- r.current || (r.current = {
285
- transform: m.style.transform || null,
286
- transformOrigin: m.style.transformOrigin || null,
287
- width: m.style.width || null,
288
- height: m.style.height || null,
289
- willChange: m.style.willChange || null
290
- });
291
- const w = 1 / s;
292
- 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";
293
- }, H = () => {
294
- if (!r.current) return;
295
- const s = r.current;
296
- 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;
297
- };
298
- let k = 0;
299
- const y = () => {
300
- cancelAnimationFrame(k), k = requestAnimationFrame(A);
301
- }, I = new MutationObserver((s) => {
302
- for (const w of s)
303
- if (w.type === "attributes" && (w.attributeName === "style" || w.attributeName === "class")) {
304
- y();
305
- break;
306
- }
307
- });
308
- return I.observe(document.body, { attributes: !0, attributeFilter: ["style", "class"] }), window.addEventListener("resize", y), y(), () => {
309
- cancelAnimationFrame(k), I.disconnect(), window.removeEventListener("resize", y), H();
310
- };
311
- }, [c, i, f]);
312
- }
313
- function Ee({
314
- gameCubeSize: c,
315
- screenHeight: h,
316
- screenWidth: r
261
+ function Mn({
262
+ gameCubeSize: o,
263
+ screenHeight: x,
264
+ screenWidth: l
317
265
  }) {
318
- const i = V(null), f = V(null), [m, M] = a(null), [A, H] = a(null);
319
- Ie(i, { minDesktopWidth: 1024, forceResize: !1 }), _(() => {
320
- const e = i.current;
321
- if (!e) return;
322
- let t = e.shadowRoot;
323
- t || (t = e.attachShadow({ mode: "open" })), t.innerHTML = "";
324
- const l = document.createElement("style");
325
- l.textContent = `
326
- :host {
327
- position: fixed;
328
- inset: 0;
329
- width: 100vw;
330
- height: 100vh;
331
- display: flex;
332
- justify-content: center;
333
- align-items: center;
334
- background: linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%);
335
- z-index: 100;
336
- overflow: hidden;
337
- margin: 0;
338
- padding: 0;
339
- transform: none;
340
- zoom: 1;
341
- scale: 1;
342
- }
343
-
344
- #whats-missing-root, #whats-missing-root * {
345
- box-sizing: border-box;
346
- }
347
-
348
- #whats-missing-root img {
349
- max-width: 100%;
350
- height: auto;
351
- display: block;
352
- user-select: none;
353
- }
354
-
355
- #whats-missing-root {
356
- position: relative;
357
- width: 100%;
358
- height: 100%;
359
- max-width: 1200px;
360
- display: flex;
361
- justify-content: center;
362
- align-items: center;
363
- transform: none;
364
- zoom: 1;
365
- scale: 1;
366
- }
367
- `, t.appendChild(l), H(t);
368
- }, []), F(() => {
369
- const e = document.body, t = document.documentElement, l = e.style.zoom, g = e.style.transform, v = t.style.zoom, L = t.style.transform;
370
- return e.style.zoom = "1", e.style.transform = "none", t.style.zoom = "1", t.style.transform = "none", () => {
371
- e.style.zoom = l, e.style.transform = g, t.style.zoom = v, t.style.transform = L;
372
- };
373
- }, []);
374
- const k = Z(() => {
375
- const e = c ?? Math.min(r ?? 1e3, h ?? 1e3), t = r ?? (typeof window < "u" ? window.innerWidth : 1e3);
376
- return e < 600 && t > 768 ? 600 : t <= 768 ? Math.min(e, t - 20) : e;
377
- }, [c, r, h]);
378
- F(() => () => {
266
+ const w = Hn(null);
267
+ D(() => (Sn(), () => {
379
268
  document.body.style.overflow = "";
380
- }, []);
381
- 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);
382
- F(() => {
383
- if (typeof window > "u") return;
384
- const e = () => {
385
- const t = r ?? window.innerWidth, l = window.matchMedia && window.matchMedia("(pointer: coarse)").matches;
386
- fe(t <= 768 || l);
387
- };
388
- return e(), window.addEventListener("resize", e), window.addEventListener("orientationchange", e), () => {
389
- window.removeEventListener("resize", e), window.removeEventListener("orientationchange", e);
269
+ }), []);
270
+ 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);
271
+ D(() => {
272
+ const i = () => {
273
+ const d = l ?? window.innerWidth, p = x ?? window.innerHeight, g = d < 768, W = p < 700, b = d >= 1200 && p >= 600 && !g;
274
+ if (pn(b), gn(g), g)
275
+ G(o && o >= 320 ? o : null), E(1);
276
+ else if (W)
277
+ G(o && o >= 400 ? o : null), E(1);
278
+ else {
279
+ const mn = o ? Math.max(400, Math.min(1200, o)) : Math.min(1e3, Math.min(d, p) * 0.9);
280
+ G(mn), E(1);
281
+ }
390
282
  };
391
- }, [r]), _(() => {
392
- const e = f.current;
393
- if (!e || typeof window > "u") return;
394
- let t = null;
395
- try {
396
- t = new ResizeObserver((l) => {
397
- for (const g of l) {
398
- const v = g.contentRect;
399
- M(Math.round(Math.min(v.width, v.height)));
400
- }
401
- }), t.observe(e), M(Math.round(Math.min(e.clientWidth, e.clientHeight)));
402
- } catch {
403
- M(Math.round(Math.min(e.clientWidth, e.clientHeight)));
404
- }
405
- return () => t?.disconnect();
406
- }, [p]);
407
- const ie = (e) => [...e].sort(() => Math.random() - 0.5).slice(0, 6), re = () => {
408
- if (!y) return;
409
- const e = ie(ce[y]);
410
- w(e), T(!0), O(!1), K(1), D(0), P([]), oe([]), se(e, [], !0);
411
- }, se = (e = s, t = ge, l = !1) => {
412
- const g = ie(e.length ? e : ce[y]);
413
- let v = Math.floor(Math.random() * g.length), L = g[v].name, de = 0;
414
- for (; t.includes(L) && de < 20; )
415
- v = Math.floor(Math.random() * g.length), L = g[v].name, de++;
416
- 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));
283
+ return i(), window.addEventListener("resize", i), () => window.removeEventListener("resize", i);
284
+ }, [l, x, o]);
285
+ const X = (i) => [...i].sort(() => Math.random() - 0.5).slice(0, 6), nn = () => {
286
+ if (!s) return;
287
+ const i = X(on[s]);
288
+ N(i), P(!0), A(!1), V(1), M(0), j([]), J([]), en(i, [], !0);
289
+ }, en = (i = u, d = sn, p = !1) => {
290
+ const g = X(i.length ? i : on[s]);
291
+ let W = Math.floor(Math.random() * g.length), b = g[W].name, F = 0;
292
+ for (; d.includes(b) && F < 20; )
293
+ W = Math.floor(Math.random() * g.length), b = g[W].name, F++;
294
+ N(g), wn(W), J([...d, b]), B(!1), K(""), q(20), y(null), p ? (S("ready"), $(3), I(10)) : (S("memorize"), I(10));
417
295
  };
418
- F(() => {
419
- if (!(!u || W || R)) {
420
- if (b === "ready")
421
- if (J <= 0) E("memorize");
296
+ D(() => {
297
+ if (!(!f || z || H)) {
298
+ if (c === "ready")
299
+ if (_ <= 0) S("memorize");
422
300
  else {
423
- const e = setTimeout(() => Q((t) => t - 1), 1e3);
424
- return () => clearTimeout(e);
301
+ const i = setTimeout(() => $((d) => d - 1), 1e3);
302
+ return () => clearTimeout(i);
425
303
  }
426
- if (b === "memorize")
427
- if (G <= 0) E("guess");
304
+ if (c === "memorize")
305
+ if (C <= 0) S("guess");
428
306
  else {
429
- const e = setTimeout(() => N((t) => t - 1), 1e3);
430
- return () => clearTimeout(e);
307
+ const i = setTimeout(() => I((d) => d - 1), 1e3);
308
+ return () => clearTimeout(i);
431
309
  }
432
- if (b === "guess") {
433
- if ($ <= 0) {
434
- q(!0), B("wrong");
435
- const t = s[C].name;
436
- P((l) => [
437
- ...l,
438
- { round: z, answer: j, correct: t, result: "wrong" }
310
+ if (c === "guess") {
311
+ if (R <= 0) {
312
+ B(!0), y("wrong");
313
+ const d = u[m].name;
314
+ j((p) => [
315
+ ...p,
316
+ { round: v, answer: T, correct: d, result: "wrong" }
439
317
  ]);
440
318
  return;
441
319
  }
442
- const e = setTimeout(() => X((t) => t - 1), 1e3);
443
- return () => clearTimeout(e);
320
+ const i = setTimeout(() => q((d) => d - 1), 1e3);
321
+ return () => clearTimeout(i);
444
322
  }
445
323
  }
446
- }, [b, J, G, $, u, W, R, s, C, z, j]);
447
- const pe = () => {
448
- if (C === null || Y) return;
449
- const e = s[C].name, t = j.toLowerCase().trim();
450
- let l = "wrong";
451
- 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(() => {
452
- te(!1), q(!0);
324
+ }, [c, _, C, R, f, z, H, u, m, v, T]);
325
+ const ln = () => {
326
+ if (m === null || L) return;
327
+ const i = u[m].name, d = T.toLowerCase().trim();
328
+ let p = "wrong";
329
+ 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(() => {
330
+ O(!1), B(!0);
453
331
  }, 600);
454
- }, ye = () => z < x ? (K((e) => e + 1), se()) : O(!0), we = () => {
455
- T(!1), O(!1), I(null);
456
- }, be = Z(
457
- () => /* @__PURE__ */ n("div", { style: { ...o.gmLogoFixed, position: "absolute", top: 16, left: 16, zIndex: 30 }, children: /* @__PURE__ */ d("picture", { children: [
458
- /* @__PURE__ */ n(
459
- "source",
460
- {
461
- srcSet: window.origin + "/cloud/speakid/games/whatsmissing/logo.svg",
462
- type: "image/svg+xml"
463
- }
464
- ),
465
- /* @__PURE__ */ n(
466
- "img",
467
- {
468
- src: window.origin + "/cloud/speakid/games/whatsmissing/logo.png",
469
- alt: "SPEAKID Logo",
470
- style: o.gmLogoImg,
471
- loading: "lazy"
472
- }
473
- )
474
- ] }) }),
475
- []
476
- ), le = 1200, ae = 700, xe = Z(() => {
477
- const e = r ?? (typeof window < "u" ? window.innerWidth : le), t = h ?? (typeof window < "u" ? window.innerHeight : ae), l = Math.min(e / le, t / ae);
478
- return Math.min(1.35, Math.max(1, l));
479
- }, [r, h, p]);
480
- return /* @__PURE__ */ n("div", { ref: i, style: { width: "100%", height: "100%" }, children: A && ze(
481
- /* @__PURE__ */ n(
482
- "div",
483
- {
484
- id: "whats-missing-root",
485
- style: { all: "unset" },
486
- children: /* @__PURE__ */ n(
487
- "div",
332
+ }, an = () => v < k ? (V((i) => i + 1), en()) : A(!0), xn = () => {
333
+ P(!1), A(!1), U(null);
334
+ }, cn = Wn(
335
+ () => n && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? null : (
336
+ // ensure logo is positioned inside the square container
337
+ /* @__PURE__ */ e("div", { style: { ...t.gmLogoFixed, position: "absolute", top: 16, left: 16, zIndex: 30 }, children: /* @__PURE__ */ h("picture", { children: [
338
+ /* @__PURE__ */ e(
339
+ "source",
488
340
  {
489
- ref: f,
490
- style: {
491
- width: p ? "100%" : `${k}px`,
492
- height: p ? "100%" : `${k}px`,
493
- borderRadius: p ? 0 : "20px",
494
- background: "linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%)",
495
- position: "relative",
496
- overflow: "hidden",
497
- boxShadow: p ? "none" : "0 0 40px rgba(0,0,0,0.08)",
498
- display: "flex",
499
- justifyContent: "center",
500
- alignItems: "center"
501
- },
502
- children: /* @__PURE__ */ d(
503
- "div",
504
- {
505
- style: {
506
- transform: `scale(${xe})`,
507
- transformOrigin: "center center",
508
- transition: "transform 0.2s ease-out",
509
- width: "100%",
510
- height: "100%",
511
- display: "flex",
512
- flexDirection: "column",
513
- justifyContent: "center",
514
- alignItems: "center"
515
- },
516
- children: [
517
- !p && be,
518
- !y && !u && /* @__PURE__ */ d("div", { style: o.gmCenterScreen, children: [
519
- /* @__PURE__ */ n("h1", { style: o.gmHeadline1, children: "WHAT'S MISSING?" }),
520
- /* @__PURE__ */ n("p", { style: o.gmBodyM, children: "Select a theme:" }),
521
- /* @__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)) }),
522
- /* @__PURE__ */ d("div", { style: { marginTop: 24 }, children: [
523
- /* @__PURE__ */ n("p", { style: o.gmBodyS, children: "Choose number of rounds:" }),
524
- /* @__PURE__ */ n("div", { style: { display: "flex", gap: 12, marginTop: 8 }, children: [3, 4, 5].map((e) => /* @__PURE__ */ n(
525
- "button",
526
- {
527
- style: {
528
- ...o.gmButton,
529
- ...x === e ? o.gmButtonActive : {}
530
- },
531
- onClick: () => S(e),
532
- children: e
341
+ srcSet: window.origin + "/cloud/speakid/games/whatsmissing/logo.svg",
342
+ type: "image/svg+xml"
343
+ }
344
+ ),
345
+ /* @__PURE__ */ e(
346
+ "img",
347
+ {
348
+ src: window.origin + "/cloud/speakid/games/whatsmissing/logo.png",
349
+ alt: "SPEAKID Logo",
350
+ style: t.gmLogoImg,
351
+ loading: "lazy"
352
+ }
353
+ )
354
+ ] }) })
355
+ ),
356
+ [n]
357
+ );
358
+ return /* @__PURE__ */ e(
359
+ "div",
360
+ {
361
+ ref: w,
362
+ style: {
363
+ width: "100%",
364
+ height: "100%",
365
+ display: "flex",
366
+ justifyContent: "center",
367
+ alignItems: "center",
368
+ background: "linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%)",
369
+ transition: "background 0.3s ease",
370
+ overflow: "hidden",
371
+ position: "absolute",
372
+ top: 0,
373
+ left: 0,
374
+ right: 0,
375
+ bottom: 0
376
+ },
377
+ children: /* @__PURE__ */ e(
378
+ "div",
379
+ {
380
+ style: {
381
+ width: n ? "100%" : Q || o || 1e3,
382
+ height: n ? "100%" : Q || o || 1e3,
383
+ display: "flex",
384
+ justifyContent: "center",
385
+ alignItems: "center",
386
+ overflow: "hidden",
387
+ borderRadius: n ? 0 : "20px",
388
+ background: "linear-gradient(to bottom, #fff8f8 0%, #f9fafb 100%)",
389
+ boxShadow: n ? "none" : "0 0 40px rgba(0,0,0,0.1)",
390
+ margin: n ? "0 auto" : "unset",
391
+ position: "relative"
392
+ // needed so absolute logo is inside the square
393
+ },
394
+ children: /* @__PURE__ */ e(
395
+ "div",
396
+ {
397
+ style: {
398
+ transform: "none",
399
+ width: "100%",
400
+ height: "100%",
401
+ display: "flex",
402
+ justifyContent: "center",
403
+ alignItems: "center"
404
+ },
405
+ children: /* @__PURE__ */ h("div", { id: "whats-missing-root", children: [
406
+ !n && cn,
407
+ !s && !f && /* @__PURE__ */ h("div", { style: t.gmCenterScreen, children: [
408
+ /* @__PURE__ */ e("h1", { style: t.gmHeadline1, children: "WHAT'S MISSING?" }),
409
+ /* @__PURE__ */ e("p", { style: t.gmBodyM, children: "Select a theme:" }),
410
+ /* @__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: {
411
+ ...t.gmButton,
412
+ padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px 12px" : "12px 24px",
413
+ fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
414
+ minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "70px" : "auto"
415
+ }, onClick: () => U(i), children: i === "animals" ? "🐶 Animals" : i === "food" ? "🍎 Food" : "🧸 Toys" }, i)) }),
416
+ /* @__PURE__ */ h("div", { style: { marginTop: 24 }, children: [
417
+ /* @__PURE__ */ e("p", { style: t.gmBodyS, children: "Choose number of rounds:" }),
418
+ /* @__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(
419
+ "button",
420
+ {
421
+ style: {
422
+ ...t.gmButton,
423
+ ...k === i ? t.gmButtonActive : {},
424
+ padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px 10px" : "12px 24px",
425
+ fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
426
+ minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "40px" : "auto"
533
427
  },
534
- e
535
- )) })
536
- ] })
428
+ onClick: () => dn(i),
429
+ children: i
430
+ },
431
+ i
432
+ )) })
433
+ ] })
434
+ ] }),
435
+ s && !f && /* @__PURE__ */ h("div", { style: t.gmCenterScreen, children: [
436
+ /* @__PURE__ */ h("h1", { style: t.gmHeadline1, children: [
437
+ "Theme selected: ",
438
+ s
537
439
  ] }),
538
- y && !u && /* @__PURE__ */ d("div", { style: o.gmCenterScreen, children: [
539
- /* @__PURE__ */ d("h1", { style: o.gmHeadline1, children: [
540
- "Theme selected: ",
541
- y
542
- ] }),
543
- /* @__PURE__ */ d("p", { style: o.gmBodyM, children: [
544
- "Rounds: ",
545
- x
546
- ] }),
547
- /* @__PURE__ */ n("button", { style: o.gmButton, onClick: re, children: "▶ Start game" })
440
+ /* @__PURE__ */ h("p", { style: t.gmBodyM, children: [
441
+ "Rounds: ",
442
+ k
548
443
  ] }),
549
- W && /* @__PURE__ */ d("div", { style: o.gmCenterScreen, children: [
550
- /* @__PURE__ */ n("h1", { style: o.gmHeadline1, children: "Results" }),
551
- /* @__PURE__ */ d("h2", { style: o.gmHeadline3, children: [
552
- "Your score: ",
553
- he,
554
- " / ",
555
- x
556
- ] }),
557
- /* @__PURE__ */ n("p", { style: { ...o.gmBodyM, color: "#10b981", marginTop: 12 }, children: "Yahoo! You did it! 🍬✨" }),
558
- /* @__PURE__ */ d("table", { style: o.gmTable, children: [
559
- /* @__PURE__ */ n("thead", { children: /* @__PURE__ */ d("tr", { children: [
560
- /* @__PURE__ */ n("th", { children: "Round" }),
561
- /* @__PURE__ */ n("th", { children: "Your Answer" }),
562
- /* @__PURE__ */ n("th", { children: "Correct" }),
563
- /* @__PURE__ */ n("th", { children: "Result" })
564
- ] }) }),
565
- /* @__PURE__ */ n("tbody", { children: ue.map((e, t) => /* @__PURE__ */ d("tr", { children: [
566
- /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.round }),
567
- /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.answer || "—" }),
568
- /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.correct }),
569
- /* @__PURE__ */ n("td", { style: o.gmTableCell, children: e.result === "correct" ? "✔ Correct" : e.result === "almost" ? "◐ Almost (0.5)" : "✘ Wrong" })
570
- ] }, t)) })
571
- ] }),
572
- /* @__PURE__ */ d("div", { style: { display: "flex", gap: 12, marginTop: 24 }, children: [
573
- /* @__PURE__ */ n("button", { style: o.gmButton, onClick: re, children: "🔁 Play again" }),
574
- /* @__PURE__ */ n("button", { style: o.gmButton, onClick: we, children: "⬅️ Choose theme" })
575
- ] })
444
+ /* @__PURE__ */ e("button", { style: {
445
+ ...t.gmButton,
446
+ padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px 16px" : "12px 24px",
447
+ fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "14px" : "16px",
448
+ minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "120px" : "auto"
449
+ }, onClick: nn, children: "▶ Start game" })
450
+ ] }),
451
+ z && /* @__PURE__ */ h("div", { style: t.gmCenterScreen, children: [
452
+ /* @__PURE__ */ e("h1", { style: t.gmHeadline1, children: "Results" }),
453
+ /* @__PURE__ */ h("h2", { style: t.gmHeadline3, children: [
454
+ "Your score: ",
455
+ rn,
456
+ " / ",
457
+ k
576
458
  ] }),
577
- u && !W && /* @__PURE__ */ d("div", { style: o.gmGameLayout, children: [
578
- /* @__PURE__ */ d(
579
- "div",
580
- {
581
- style: {
582
- minHeight: 160,
583
- display: "flex",
584
- flexDirection: "column",
585
- justifyContent: "center",
586
- alignItems: "center"
587
- },
588
- children: [
589
- b === "ready" && /* @__PURE__ */ d(ve, { children: [
590
- /* @__PURE__ */ n("h1", { style: { ...o.gmHeadline1, color: "#ec4c44" }, children: "GET READY" }),
591
- /* @__PURE__ */ n("div", { style: o.gmHourglass, children: "⏳" })
592
- ] }),
593
- b === "memorize" && /* @__PURE__ */ d("p", { style: { ...o.gmBodyM, color: "#10b981" }, children: [
594
- "MEMORIZE (",
595
- G,
596
- ")"
597
- ] }),
598
- b === "guess" && !R && /* @__PURE__ */ d("p", { style: o.gmBodyM, children: [
599
- "⏳ Time left: ",
600
- $,
601
- "s"
602
- ] })
603
- ]
604
- }
605
- ),
606
- b !== "ready" && /* @__PURE__ */ n(
607
- "div",
608
- {
609
- style: {
610
- ...o.gmGrid,
611
- display: "grid",
612
- gridTemplateColumns: `repeat(${p ? 2 : 3}, 1fr)`,
613
- gridTemplateRows: `repeat(${p ? 3 : 2}, 1fr)`,
614
- gap: p ? 12 : 20,
615
- justifyContent: "center",
616
- alignContent: "center",
617
- padding: p ? 8 : 16,
618
- width: "100%",
619
- height: "100%",
620
- maxWidth: p ? "100%" : 600,
621
- maxHeight: p ? "100%" : 400,
622
- boxSizing: "border-box"
623
- },
624
- children: s.map((e, t) => {
625
- const l = C === t && b === "guess" && !R;
626
- return /* @__PURE__ */ n(
627
- "div",
628
- {
629
- style: {
630
- ...o.gmCard,
631
- width: "100%",
632
- height: "100%",
633
- ...ne === "correct" && C === t ? o.gmCorrect : {},
634
- ...ne === "wrong" && C === t ? o.gmWrong : {}
635
- },
636
- children: !l && /* @__PURE__ */ n(
637
- "img",
638
- {
639
- src: e.src,
640
- alt: e.name,
641
- style: {
642
- width: "100%",
643
- height: "100%",
644
- objectFit: "cover",
645
- display: "block"
646
- }
647
- }
648
- )
649
- },
650
- t
651
- );
652
- })
653
- }
654
- ),
655
- /* @__PURE__ */ d("div", { style: { marginTop: 16, height: 80 }, children: [
656
- b === "guess" && !R && /* @__PURE__ */ d("div", { children: [
657
- /* @__PURE__ */ n(
658
- "input",
659
- {
660
- type: "text",
661
- placeholder: "Type the missing word",
662
- value: j,
663
- onChange: (e) => ee(e.target.value),
664
- style: o.gmInput
665
- }
666
- ),
667
- /* @__PURE__ */ n(
668
- "button",
459
+ /* @__PURE__ */ e("p", { style: { ...t.gmBodyM, color: "#10b981", marginTop: 12 }, children: "Yahoo! You did it! 🍬✨" }),
460
+ /* @__PURE__ */ h("table", { style: t.gmTable, children: [
461
+ /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ h("tr", { children: [
462
+ /* @__PURE__ */ e("th", { children: "Round" }),
463
+ /* @__PURE__ */ e("th", { children: "Your Answer" }),
464
+ /* @__PURE__ */ e("th", { children: "Correct" }),
465
+ /* @__PURE__ */ e("th", { children: "Result" })
466
+ ] }) }),
467
+ /* @__PURE__ */ e("tbody", { children: hn.map((i, d) => /* @__PURE__ */ h("tr", { children: [
468
+ /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.round }),
469
+ /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.answer || "—" }),
470
+ /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.correct }),
471
+ /* @__PURE__ */ e("td", { style: t.gmTableCell, children: i.result === "correct" ? "✔ Correct" : i.result === "almost" ? "◐ Almost (0.5)" : "✘ Wrong" })
472
+ ] }, d)) })
473
+ ] }),
474
+ /* @__PURE__ */ h("div", { style: {
475
+ display: "flex",
476
+ gap: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px" : "12px",
477
+ 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"
478
+ }, children: [
479
+ /* @__PURE__ */ e("button", { style: {
480
+ ...t.gmButton,
481
+ padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px 10px" : "12px 24px",
482
+ fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
483
+ minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "80px" : "auto"
484
+ }, onClick: nn, children: "🔁 Play again" }),
485
+ /* @__PURE__ */ e("button", { style: {
486
+ ...t.gmButton,
487
+ padding: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px 10px" : "12px 24px",
488
+ fontSize: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : "16px",
489
+ minWidth: n && window.innerWidth > window.innerHeight || n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "80px" : "auto"
490
+ }, onClick: xn, children: "⬅️ Choose theme" })
491
+ ] })
492
+ ] }),
493
+ f && !z && /* @__PURE__ */ h("div", { style: t.gmGameLayout, children: [
494
+ /* @__PURE__ */ h(
495
+ "div",
496
+ {
497
+ style: {
498
+ 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",
499
+ display: "flex",
500
+ flexDirection: "column",
501
+ justifyContent: "center",
502
+ alignItems: "center",
503
+ 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"
504
+ },
505
+ children: [
506
+ c === "ready" && /* @__PURE__ */ h(tn, { children: [
507
+ /* @__PURE__ */ e("h1", { style: { ...t.gmHeadline1, color: "#ec4c44" }, children: "GET READY" }),
508
+ /* @__PURE__ */ e("div", { style: t.gmHourglass, children: "⏳" })
509
+ ] }),
510
+ c === "memorize" && /* @__PURE__ */ h("p", { style: { ...t.gmBodyM, color: "#10b981" }, children: [
511
+ "MEMORIZE (",
512
+ C,
513
+ ")"
514
+ ] }),
515
+ c === "guess" && !H && /* @__PURE__ */ h("p", { style: t.gmBodyM, children: [
516
+ "⏳ Time left: ",
517
+ R,
518
+ "s"
519
+ ] })
520
+ ]
521
+ }
522
+ ),
523
+ c !== "ready" && /* @__PURE__ */ e(
524
+ "div",
525
+ {
526
+ style: {
527
+ ...t.gmGrid,
528
+ 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)",
529
+ // desktop: 3 колонки фиксированного размера
530
+ gridAutoRows: n && window.innerWidth > window.innerHeight ? "120px" : n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "100px" : n ? "150px" : window.innerHeight < 700 ? "140px" : "210px",
531
+ // desktop: стандартная высота
532
+ gap: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "12px" : n || window.innerHeight < 700 ? "8px" : "20px",
533
+ justifyItems: "center",
534
+ maxWidth: n && window.innerWidth > window.innerHeight ? "90%" : n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "95%" : "100%",
535
+ padding: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "8px" : "16px"
536
+ },
537
+ children: u.map((i, d) => {
538
+ const p = m === d && c === "guess" && !H;
539
+ return /* @__PURE__ */ e(
540
+ "div",
669
541
  {
670
- style: { ...o.gmButton, marginLeft: 8 },
671
- onClick: pe,
672
- disabled: Y,
673
- children: Y ? "..." : "Check"
542
+ style: {
543
+ width: "100%",
544
+ height: "100%",
545
+ borderRadius: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "6px" : "12px",
546
+ overflow: "hidden",
547
+ 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)",
548
+ transition: "all 0.3s ease",
549
+ cursor: "pointer",
550
+ ...Z === "correct" && m === d ? {
551
+ boxShadow: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "0 0 15px #10b981" : "0 0 20px #10b981",
552
+ transform: "scale(1.03)"
553
+ } : {},
554
+ ...Z === "wrong" && m === d ? {
555
+ boxShadow: n && window.innerWidth <= 375 && window.innerHeight <= 667 ? "0 0 15px #ef4444" : "0 0 20px #ef4444",
556
+ transform: "scale(1.03)"
557
+ } : {}
558
+ },
559
+ children: !p && /* @__PURE__ */ e(
560
+ "img",
561
+ {
562
+ src: i.src,
563
+ alt: i.name,
564
+ style: {
565
+ width: "100%",
566
+ height: "100%",
567
+ objectFit: "cover"
568
+ }
569
+ }
570
+ )
571
+ },
572
+ d
573
+ );
574
+ })
575
+ }
576
+ ),
577
+ /* @__PURE__ */ h("div", { style: {
578
+ 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",
579
+ 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"
580
+ }, children: [
581
+ c === "guess" && !H && /* @__PURE__ */ e("div", { style: {
582
+ display: "flex",
583
+ 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",
584
+ 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",
585
+ alignItems: "center",
586
+ justifyContent: "center",
587
+ width: "100%",
588
+ 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"
589
+ }, children: /* @__PURE__ */ h(tn, { children: [
590
+ /* @__PURE__ */ e(
591
+ "input",
592
+ {
593
+ type: "text",
594
+ placeholder: "Type the missing word",
595
+ value: T,
596
+ onChange: (i) => K(i.target.value),
597
+ style: {
598
+ ...t.gmInput,
599
+ 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",
600
+ 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",
601
+ 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",
602
+ 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"
674
603
  }
675
- )
676
- ] }),
677
- R && /* @__PURE__ */ n("button", { type: "button", style: o.gmButton, onClick: ye, children: "Next round" })
678
- ] })
604
+ }
605
+ ),
606
+ /* @__PURE__ */ e(
607
+ "button",
608
+ {
609
+ style: {
610
+ ...t.gmButton,
611
+ 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",
612
+ 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",
613
+ 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",
614
+ 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",
615
+ flexShrink: 0
616
+ },
617
+ onClick: ln,
618
+ disabled: L,
619
+ children: L ? "..." : "Check"
620
+ }
621
+ )
622
+ ] }) }),
623
+ H && /* @__PURE__ */ e("button", { style: {
624
+ ...t.gmButton,
625
+ 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",
626
+ 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"
627
+ }, onClick: an, children: "Next round" })
679
628
  ] })
680
- ]
681
- }
682
- )
683
- }
684
- )
685
- }
686
- ),
687
- A
688
- ) });
629
+ ] })
630
+ ] })
631
+ }
632
+ )
633
+ }
634
+ )
635
+ }
636
+ );
689
637
  }
690
638
  export {
691
- Ee as Game,
692
- ce as themes
639
+ Mn as Game,
640
+ on as themes
693
641
  };