speakid-hangman 1.0.0

package/dist/speakid-hangman.es.js

@@ -0,0 +1,1040 @@
+import { jsx as e, jsxs as p } from "react/jsx-runtime";
+import { useState as $, useCallback as it, useEffect as at, useMemo as xt } from "react";
+const a = {
+  gmCenterScreen: {
+    position: "relative",
+    zIndex: 1,
+    minHeight: "100%",
+    width: "100%",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    textAlign: "center",
+    color: "#1f2937",
+    // colorTextPrimary
+    padding: "24px 16px",
+    boxSizing: "border-box",
+    fontFamily: '"Onest", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif',
+    background: "transparent"
+    // Прозрачный по умолчанию, переопределяется в компоненте
+  },
+  // Desktop: Headline 1 - Onest SemiBold 32px, line-height 110%
+  gmHeadline1: {
+    fontWeight: 600,
+    // SemiBold
+    fontSize: "clamp(30px, 4vw, 32px)",
+    // Mobile 30px, Desktop 32px
+    lineHeight: "110%",
+    marginBottom: "24px",
+    color: "#1f2937",
+    // colorTextPrimary
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  // Desktop: Headline 3 - Onest Medium 24px, line-height 110%
+  // Mobile: Headline 3 - Onest Medium 16px, line-height 110%
+  gmHeadline3: {
+    fontWeight: 500,
+    // Medium
+    fontSize: "clamp(16px, 2vw, 24px)",
+    // Mobile 16px, Desktop 24px
+    lineHeight: "110%",
+    marginBottom: "12px",
+    color: "#1f2937",
+    // colorTextPrimary
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  // Desktop: Body L - Onest Regular 18px, line-height 120%
+  gmBodyL: {
+    fontWeight: 400,
+    // Regular
+    fontSize: "18px",
+    lineHeight: "120%",
+    marginBottom: "12px",
+    color: "#1f2937",
+    // colorTextPrimary
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  // Desktop: Body M - Onest Regular 16px, line-height 120%
+  // Mobile: Body M - Onest Regular 14px, line-height 120%
+  gmBodyM: {
+    fontWeight: 400,
+    // Regular
+    fontSize: "clamp(14px, 1.5vw, 16px)",
+    // Mobile 14px, Desktop 16px
+    lineHeight: "120%",
+    marginBottom: "8px",
+    color: "#1f2937",
+    // colorTextPrimary
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  // Desktop: Body S - Onest Regular 14px, line-height 120%
+  // Mobile: Body S - Onest Regular 12px, line-height 120%
+  gmBodyS: {
+    fontWeight: 400,
+    // Regular
+    fontSize: "clamp(12px, 1.5vw, 14px)",
+    // Mobile 12px, Desktop 14px
+    lineHeight: "120%",
+    color: "#6b7280",
+    // colorTextSecondary
+    marginBottom: "8px",
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  // Button: Onest Regular 16px, line-height 100%
+  gmButton: {
+    fontFamily: '"Onest", system-ui, sans-serif',
+    fontWeight: 400,
+    // Regular
+    fontSize: "16px",
+    lineHeight: "100%",
+    padding: "10px 16px",
+    borderRadius: "8px",
+    // Более мягкие углы для минималистичного стиля
+    border: "1px solid #e5e7eb",
+    // colorSeparator
+    background: "#ec4c44",
+    // colorAccent (Default)
+    color: "#ffffff",
+    // colorTextContrast
+    cursor: "pointer",
+    boxShadow: "none",
+    // Плоский стиль без теней
+    transition: "background-color 0.2s ease, opacity 0.2s ease, transform 0.1s ease",
+    margin: "4px"
+  },
+  gmButtonSecondary: {
+    background: "#f9f9f9",
+    // colorBackgroundAccent
+    color: "#1f2937",
+    // colorTextPrimary
+    border: "1px solid #e5e7eb",
+    // colorSeparator
+    boxShadow: "none"
+    // Плоский стиль
+  },
+  gmButtonGroup: {
+    display: "flex",
+    flexWrap: "wrap",
+    gap: "8px",
+    justifyContent: "center",
+    marginBottom: "24px"
+  },
+  gmWordDisplay: {
+    fontSize: "clamp(20px, 5vw, 28px)",
+    fontWeight: 500,
+    // Medium
+    letterSpacing: "6px",
+    margin: "32px 0",
+    color: "#1f2937",
+    // colorTextPrimary
+    fontFamily: '"Onest", system-ui, sans-serif',
+    lineHeight: "120%"
+  },
+  gmGuessedLetters: {
+    fontSize: "clamp(12px, 1.5vw, 16px)",
+    // Body S / Body M
+    color: "#6b7280",
+    // colorTextSecondary
+    marginTop: "16px",
+    minHeight: "24px",
+    fontFamily: '"Onest", system-ui, sans-serif',
+    lineHeight: "120%"
+  },
+  gmStatusWin: {
+    color: "#10b981",
+    // colorTextPositive / colorIconPositive
+    fontWeight: 500,
+    // Medium
+    fontSize: "clamp(14px, 1.5vw, 18px)",
+    // Body M / Body L
+    lineHeight: "120%",
+    margin: "16px 0",
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  gmStatusLose: {
+    color: "#ec4c44",
+    // colorTextNegative / colorIconNegative
+    fontWeight: 500,
+    // Medium
+    fontSize: "clamp(14px, 1.5vw, 18px)",
+    // Body M / Body L
+    lineHeight: "120%",
+    margin: "16px 0",
+    fontFamily: '"Onest", system-ui, sans-serif'
+  },
+  gmInfoBox: {
+    background: "#f9f9f9",
+    // colorBackgroundAccent
+    border: "1px solid #e5e7eb",
+    // colorSeparator
+    borderRadius: "8px",
+    // Мягкие углы
+    padding: "16px",
+    marginBottom: "24px",
+    maxWidth: "500px",
+    width: "100%",
+    boxShadow: "none"
+    // Плоский стиль
+  },
+  // ✅ Обновлено только для качества логотипа (размер как в magic-sentence)
+  gmLogoFixed: {
+    position: "absolute",
+    top: "16px",
+    left: "16px",
+    width: "auto",
+    zIndex: 10,
+    pointerEvents: "none",
+    background: "transparent",
+    transform: "none",
+    willChange: "auto"
+  },
+  gmLogoImg: {
+    height: "28px",
+    width: "auto",
+    background: "transparent",
+    objectFit: "contain",
+    imageRendering: "auto",
+    transform: "translateZ(0)",
+    backfaceVisibility: "hidden",
+    WebkitFontSmoothing: "antialiased",
+    display: "block"
+  }
+};
+function bt({
+  mistakes: r,
+  maxMistakes: f,
+  size: x = 200
+}) {
+  const l = x, c = x * 1.25, b = Math.max(2, x / 100), W = 10 * (l / 200), w = 240 * (c / 250), m = 150 * (l / 200), y = 80 * (l / 200), K = 20 * (c / 250), _ = 240 * (c / 250), S = 80 * (l / 200), V = 20 * (c / 250), L = 150 * (l / 200), H = 150 * (l / 200), F = 20 * (c / 250), R = 50 * (c / 250), T = 150 * (l / 200), I = 70 * (c / 250), P = 20 * (l / 200), B = 150 * (l / 200), q = 90 * (c / 250), O = 150 * (c / 250), u = 150 * (l / 200), z = 110 * (c / 250), h = 130 * (l / 200), E = 130 * (c / 250), st = 150 * (l / 200), C = 110 * (c / 250), J = 170 * (l / 200), U = 130 * (c / 250), s = 150 * (l / 200), v = 150 * (c / 250), g = 130 * (l / 200), i = 190 * (c / 250), j = 150 * (l / 200), n = 150 * (c / 250), k = 170 * (l / 200), tt = 190 * (c / 250), M = r === 0 || r <= f * 0.5 ? "#1f2937" : r <= f * 0.75 ? "#f59e0b" : "#ec4c44";
+  return /* @__PURE__ */ p(
+    "svg",
+    {
+      width: l,
+      height: c,
+      style: {
+        display: "block",
+        margin: "0 auto"
+      },
+      children: [
+        r > 0 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: W,
+            y1: w,
+            x2: m,
+            y2: w,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 1 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: y,
+            y1: K,
+            x2: y,
+            y2: _,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 2 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: S,
+            y1: V,
+            x2: L,
+            y2: V,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 3 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: H,
+            y1: F,
+            x2: H,
+            y2: R,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 4 && /* @__PURE__ */ e(
+          "circle",
+          {
+            cx: T,
+            cy: I,
+            r: P,
+            stroke: M,
+            fill: "none",
+            strokeWidth: b
+          }
+        ),
+        r > 5 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: B,
+            y1: q,
+            x2: B,
+            y2: O,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 6 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: u,
+            y1: z,
+            x2: h,
+            y2: E,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 7 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: st,
+            y1: C,
+            x2: J,
+            y2: U,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 8 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: s,
+            y1: v,
+            x2: g,
+            y2: i,
+            stroke: M,
+            strokeWidth: b
+          }
+        ),
+        r > 9 && /* @__PURE__ */ e(
+          "line",
+          {
+            x1: j,
+            y1: n,
+            x2: k,
+            y2: tt,
+            stroke: M,
+            strokeWidth: b
+          }
+        )
+      ]
+    }
+  );
+}
+function Mt({
+  gameCubeSize: r = 400,
+  screenHeight: f = 800,
+  screenWidth: x = 800,
+  logoUrl: l,
+  showLogo: c = !0,
+  baseURL: b
+} = {}) {
+  const W = {
+    Professions: ["teacher", "doctor", "nurse", "driver", "police", "firefighter", "cook", "waiter", "farmer", "builder", "singer", "actor", "dentist", "pilot", "vet", "artist", "cleaner", "student", "baker", "mechanic"],
+    Family: ["mother", "father", "sister", "brother", "grandmother", "grandfather", "aunt", "uncle", "cousin", "baby", "parents", "children", "wife", "husband", "son", "daughter", "family", "twins", "relatives"],
+    "Farm animals": ["cow", "pig", "horse", "sheep", "goat", "duck", "chicken", "rooster", "turkey", "goose", "rabbit", "mouse", "donkey", "bee", "hen", "lamb", "bull", "pony"],
+    Food: ["apple", "banana", "bread", "cheese", "milk", "egg", "rice", "soup", "fish", "meat", "potato", "carrot", "tomato", "cucumber", "butter", "cake", "salad", "pasta", "pizza", "juice"],
+    Hobbies: ["reading", "drawing", "painting", "dancing", "singing", "cooking", "swimming", "fishing", "running", "cycling", "skating", "writing", "camping", "photography", "hiking", "games"],
+    Christmas: ["tree", "present", "gift", "santa", "snow", "snowman", "bell", "star", "lights", "card", "cookies", "elf", "sleigh", "reindeer", "candle", "stocking"],
+    Halloween: ["pumpkin", "costume", "candy", "ghost", "witch", "spider", "bat", "skeleton", "mask", "monster", "mummy", "cat", "broom", "zombie", "trick", "treat", "candle", "night", "party"],
+    Sport: ["football", "basketball", "tennis", "swimming", "running", "baseball", "skiing", "skating", "volleyball", "hockey", "golf", "boxing", "cycling", "rugby", "karate", "yoga", "surfing", "climbing", "dancing", "gym", "chess"],
+    "Body parts": ["head", "hair", "eyes", "ears", "nose", "mouth", "teeth", "tongue", "neck", "shoulder", "arm", "hand", "finger", "leg", "knee", "foot", "toe", "back", "stomach", "heart", "legs", "nails", "chin", "beard"],
+    "School subjects": ["math", "english", "history", "geography", "art", "music", "science", "biology", "chemistry", "physics", "pe", "literature", "drama", "design", "economics"],
+    Animals: ["cat", "dog", "rabbit", "elephant", "lion", "tiger", "monkey", "bear", "fox", "wolf", "giraffe", "zebra", "crocodile", "dolphin", "whale", "shark", "frog", "parrot", "mouse", "penguin", "deer", "lizard", "turtle", "snake"],
+    Countries: ["russia", "canada", "china", "japan", "france", "germany", "italy", "spain", "brazil", "india", "australia", "america", "england", "korea", "mexico", "egypt", "turkey", "vietnam", "norway", "finland", "thailand", "georgia", "kazakhstan"],
+    Clothes: ["shirt", "dress", "skirt", "trousers", "jeans", "coat", "jacket", "sweater", "socks", "shoes", "boots", "hat", "scarf", "gloves", "shorts", "cap", "belt", "tie", "uniform", "pants", "underwear"],
+    Traveling: ["ticket", "luggage", "suitcase", "airport", "flight", "passport", "visa", "map", "guide", "hotel", "reservation", "bus", "train", "taxi", "tourist", "sightseeing", "backpack", "journey", "adventure", "beach", "tour", "souvenir"],
+    Environment: ["tree", "forest", "air", "water", "pollution", "recycle", "nature", "clean", "waste", "plastic", "energy", "animal", "climate", "earth", "ocean", "river", "planet", "save", "green", "environment", "litter", "organic"],
+    Space: ["planet", "star", "sun", "moon", "astronaut", "rocket", "space", "galaxy", "universe", "telescope", "comet", "asteroid", "orbit", "gravity", "alien", "spaceship", "mars", "satellite", "sky", "eclipse"],
+    Devices: ["computer", "laptop", "phone", "tablet", "tv", "keyboard", "mouse", "printer", "camera", "headphones", "charger", "screen", "watch", "microphone", "speaker", "console", "router", "battery", "cable", "remote"]
+  }, [w, m] = $("lobby"), [y, K] = $(""), [_] = $("Normal"), [S, V] = $(0), [L, H] = $(1), [F, R] = $(""), [T, I] = $([]), [P, B] = $(0), [q, O] = $(0), [u, z] = $(null), [h, E] = $(null), [st, C] = $([]), J = _ === "Easy" ? 8 : _ === "Normal" ? 6 : 4, U = b || (typeof window < "u" && window.origin ? `${window.origin}/cloud/speakid/games/hangman` : "/cloud/speakid/games/hangman"), s = (x ?? (typeof window < "u" ? window.innerWidth : 800)) < 768 || (x ?? (typeof window < "u" ? window.innerWidth : 800)) === 926 && (f ?? (typeof window < "u" ? window.innerHeight : 800)) === 428 || (x ?? (typeof window < "u" ? window.innerWidth : 800)) === 932 && (f ?? (typeof window < "u" ? window.innerHeight : 800)) === 430 || r < 600, v = (x ?? (typeof window < "u" ? window.innerWidth : 800)) === 1024 && (f ?? (typeof window < "u" ? window.innerHeight : 800)) === 600, g = r / 400, i = {
+    headline1: s ? Math.max(24, Math.min(30, 30 * g)) : Math.max(28, Math.min(32, 32 * g)),
+    // Desktop: 24px
+    headline3: s ? Math.max(14, Math.min(18, 16 * g)) : Math.max(20, Math.min(26, 24 * g)),
+    // Desktop: 24px
+    bodyL: Math.max(14, Math.min(20, 18 * g)),
+    // Desktop: 18px
+    bodyM: s ? Math.max(12, Math.min(16, 14 * g)) : Math.max(14, Math.min(18, 16 * g)),
+    // Desktop: 16px
+    bodyS: s ? Math.max(10, Math.min(14, 12 * g)) : Math.max(12, Math.min(16, 14 * g)),
+    // Desktop: 14px
+    wordDisplay: Math.max(18, Math.min(32, 26 * g)),
+    // Адаптивный размер
+    button: Math.max(12, Math.min(18, 16 * g))
+    // Desktop: 16px
+  }, j = v ? Math.max(8, Math.min(12, 10 * g)) : Math.max(12, Math.min(24, 16 * g)), n = v ? Math.max(3, Math.min(6, 5 * g)) : Math.max(4, Math.min(12, 8 * g)), k = Math.max(6, Math.min(10, 8 * g)), tt = (t, o) => t.split("").every((d) => o.includes(d)), lt = (t, o) => t.split("").map((d) => o.includes(d) ? d : "_").join(" "), M = (t) => "abcdefghijklmnopqrstuvwxyz".split("").filter((d) => !t.includes(d)), Z = (t, o = []) => {
+    var pt;
+    if (!t || !W[t]) {
+      const A = Object.keys(W)[0];
+      return ((pt = W[A]) == null ? void 0 : pt[0]) || "";
+    }
+    const d = W[t];
+    if (!d || d.length === 0)
+      return "";
+    const Y = d.filter((A) => !o.includes(A)), G = Y.length > 0 ? Y : d;
+    if (G.length === 0)
+      return "";
+    let N;
+    if (typeof crypto < "u" && crypto.getRandomValues) {
+      const A = new Uint32Array(1);
+      crypto.getRandomValues(A);
+      const yt = A[0] / 4294967295;
+      N = Math.floor(yt * G.length);
+    } else
+      N = Math.floor(Math.random() * G.length);
+    return G[N];
+  }, ut = () => {
+    if (!y) return;
+    C([]);
+    const t = Z(y, []);
+    if (!t) {
+      m("category");
+      return;
+    }
+    R(t), C([t]), I([]), B(0), H(1), O(0), z(null), m("game");
+  }, et = it((t) => {
+    if (w !== "game" || u !== null) return;
+    const o = t.toLowerCase();
+    /^[a-z]$/.test(o) && (I((d) => d.includes(o) ? d : [...d, o]), R((d) => (d && !d.includes(o) && B((Y) => Y + 1), d)));
+  }, [w, u]), nt = it((t) => {
+    et(t.key);
+  }, [et]);
+  at(() => {
+    if (w === "game")
+      return window.addEventListener("keydown", nt), () => window.removeEventListener("keydown", nt);
+  }, [w, nt]);
+  const mt = F ? lt(F, T) : "", dt = F ? tt(F, T) : !1, ct = P >= 10, ht = M(T), ot = it(() => {
+    if (!y || L >= S) {
+      m("result");
+      return;
+    }
+    H((t) => t + 1), C((t) => {
+      const o = Z(y, t);
+      return o ? (R(o), [...t, o]) : t;
+    }), I([]), B(0), z(null);
+  }, [y, L, S]);
+  at(() => {
+    if (dt && u === null) {
+      z("win"), O((o) => o + 1);
+      const t = setTimeout(() => {
+        ot();
+      }, 2e3);
+      return () => clearTimeout(t);
+    }
+    if (ct && u === null) {
+      z("lose");
+      const t = setTimeout(() => {
+        ot();
+      }, 2e3);
+      return () => clearTimeout(t);
+    }
+  }, [dt, ct, u, ot]);
+  const ft = () => {
+    if (!y || L >= S) {
+      m("result");
+      return;
+    }
+    H((t) => t + 1), C((t) => {
+      const o = Z(y, t);
+      return o ? (R(o), [...t, o]) : t;
+    }), I([]), B(0), z(null);
+  };
+  at(() => {
+    const t = x ?? window.innerWidth, o = f ?? window.innerHeight, d = o < 700;
+    if (s)
+      E(r && r >= 320 ? r : null);
+    else if (v) {
+      const Y = r ? Math.max(400, Math.min(950, r)) : Math.min(950, Math.min(t * 0.92, o * 0.92));
+      E(Y);
+    } else if (d)
+      E(r && r >= 400 ? r : null);
+    else {
+      const N = r ? Math.max(400, Math.min(1200, r)) : Math.min(1e3, Math.min(t, o) * 0.9);
+      E(N);
+    }
+  }, [x, f, r, s, v]);
+  const X = {
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    background: "transparent",
+    overflow: "hidden",
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0
+  }, rt = `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" style="position: absolute; top: 0; left: 0; pointer-events: none; opacity: 0.2;">
+      <!-- Каракули мелками и фломастерами -->
+      
+      <!-- Сердечко -->
+      <path d="M 85% 15% Q 85% 10%, 90% 10% Q 95% 10%, 95% 15% Q 95% 20%, 90% 25% Q 85% 30%, 85% 15%" 
+            fill="none" stroke="#FF69B4" stroke-width="3" stroke-linecap="round"/>
+      
+      <!-- Звезда -->
+      <path d="M 10% 85% L 12% 80% L 14% 85% L 18% 85% L 13% 88% L 15% 92% L 10% 89% L 5% 92% L 7% 88% L 2% 85% Z" 
+            fill="#FFA500" stroke="#FF8C00" stroke-width="1.5"/>
+      
+      <!-- Волнистые линии (мелки) -->
+      <path d="M 20% 25% Q 22% 23%, 24% 25% T 28% 25% T 32% 25%" 
+            fill="none" stroke="#FF6B6B" stroke-width="3.5" stroke-linecap="round"/>
+      <path d="M 60% 30% Q 62% 28%, 64% 30% T 68% 30% T 72% 30%" 
+            fill="none" stroke="#4ECDC4" stroke-width="3.5" stroke-linecap="round"/>
+      
+      <!-- Спираль -->
+      <path d="M 5% 45% Q 8% 42%, 10% 45% Q 12% 48%, 10% 50% Q 8% 52%, 5% 50% Q 3% 48%, 5% 45%" 
+            fill="none" stroke="#9B59B6" stroke-width="3" stroke-linecap="round"/>
+      
+      <!-- Зигзаг -->
+      <path d="M 88% 55% L 92% 50% L 94% 55% L 96% 50% L 98% 55%" 
+            fill="none" stroke="#E74C3C" stroke-width="3.5" stroke-linecap="round" stroke-linejoin="round"/>
+      
+      <!-- Ромашка -->
+      <circle cx="25%" cy="70%" r="15" fill="none" stroke="#FFD700" stroke-width="2.5"/>
+      <circle cx="25%" cy="70%" r="8" fill="#FFD700"/>
+      <line x1="25%" y1="70%" x2="22%" y2="65%" stroke="#FFFFFF" stroke-width="2.5"/>
+      <line x1="25%" y1="70%" x2="28%" y2="65%" stroke="#FFFFFF" stroke-width="2.5"/>
+      <line x1="25%" y1="70%" x2="22%" y2="75%" stroke="#FFFFFF" stroke-width="2.5"/>
+      <line x1="25%" y1="70%" x2="28%" y2="75%" stroke="#FFFFFF" stroke-width="2.5"/>
+      
+      <!-- Каляки-маляки (случайные линии) -->
+      <path d="M 40% 20% Q 42% 22%, 40% 24% T 40% 28%" 
+            fill="none" stroke="#32CD32" stroke-width="3" stroke-linecap="round"/>
+      <path d="M 50% 60% L 53% 57% L 55% 60% L 57% 57%" 
+            fill="none" stroke="#FF1493" stroke-width="3" stroke-linecap="round"/>
+      
+      <!-- Еще волнистые линии -->
+      <path d="M 35% 85% Q 37% 83%, 39% 85% T 43% 85% T 47% 85%" 
+            fill="none" stroke="#FF4500" stroke-width="3.5" stroke-linecap="round"/>
+    </svg>
+  `, D = {
+    ...a.gmCenterScreen,
+    width: s ? "100%" : v ? h || r || 950 : h || r || 1e3,
+    height: s ? "100%" : v ? "auto" : h || r || 1e3,
+    minHeight: s ? "100%" : v ? "auto" : h || r || 1e3,
+    maxHeight: s ? "100%" : v ? "92vh" : h || r || 1e3,
+    padding: `${j}px`,
+    overflow: "auto",
+    borderRadius: s ? 0 : "20px",
+    position: "relative",
+    boxSizing: "border-box",
+    background: "#ffffff",
+    // Белый фон как на скриншоте
+    boxShadow: s ? "none" : "0 0 40px rgba(0,0,0,0.1)",
+    // Легкая тень для десктопа
+    margin: s ? "0 auto" : "unset"
+  }, gt = !s && c, Q = xt(
+    () => {
+      if (s && (x ?? window.innerWidth) > (f ?? window.innerHeight) || (f ?? window.innerHeight) < 700 || !gt)
+        return null;
+      const t = l || (typeof window < "u" && window.origin ? `${window.origin}/cloud/speakid/games/hangman/logo` : "/cloud/speakid/games/hangman/logo");
+      return /* @__PURE__ */ e("div", { style: { ...a.gmLogoFixed, position: "absolute", top: 16, left: 16, zIndex: 30 }, children: /* @__PURE__ */ p("picture", { children: [
+        /* @__PURE__ */ e(
+          "source",
+          {
+            srcSet: `${t}.svg`,
+            type: "image/svg+xml"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "img",
+          {
+            src: `${t}.png`,
+            alt: "SPEAKID Logo",
+            style: a.gmLogoImg,
+            loading: "lazy"
+          }
+        )
+      ] }) });
+    },
+    [s, gt, l, x, f]
+  );
+  return w === "lobby" ? /* @__PURE__ */ e("div", { style: X, children: /* @__PURE__ */ p("div", { style: D, children: [
+    Q,
+    /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: rt } }),
+    /* @__PURE__ */ e("h1", { style: {
+      ...a.gmHeadline1,
+      fontSize: `${i.headline1}px`,
+      marginBottom: `${n * 3}px`,
+      position: "relative",
+      zIndex: 1
+    }, children: "HANGMAN" }),
+    /* @__PURE__ */ p(
+      "button",
+      {
+        onClick: () => m("category"),
+        style: {
+          fontFamily: '"Onest", system-ui, sans-serif',
+          fontWeight: 500,
+          // Medium для более заметности
+          fontSize: `${i.button}px`,
+          padding: `${n * 1.2}px ${n * 3}px`,
+          borderRadius: `${k * 1.5}px`,
+          position: "relative",
+          zIndex: 1,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          background: "#ec4c44",
+          color: "#ffffff",
+          border: "none",
+          cursor: "pointer",
+          transition: "background 0.2s ease, transform 0.1s ease",
+          boxShadow: "0 2px 8px rgba(236, 76, 68, 0.2)",
+          minWidth: "120px"
+        },
+        onMouseEnter: (t) => {
+          t.currentTarget.style.background = "#d43a32", t.currentTarget.style.transform = "translateY(-2px)", t.currentTarget.style.boxShadow = "0 4px 12px rgba(236, 76, 68, 0.3)";
+        },
+        onMouseLeave: (t) => {
+          t.currentTarget.style.background = "#ec4c44", t.currentTarget.style.transform = "translateY(0)", t.currentTarget.style.boxShadow = "0 2px 8px rgba(236, 76, 68, 0.2)";
+        },
+        onMouseDown: (t) => {
+          t.currentTarget.style.transform = "translateY(0)";
+        },
+        children: [
+          /* @__PURE__ */ e(
+            "svg",
+            {
+              width: `${i.button * 1.3}px`,
+              height: `${i.button * 1.3}px`,
+              viewBox: "0 0 24 24",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              style: { display: "block", marginRight: `${n}px` },
+              children: /* @__PURE__ */ e(
+                "path",
+                {
+                  d: "M8 5V19L19 12L8 5Z",
+                  fill: "#ffffff",
+                  stroke: "none"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ e("span", { style: { fontWeight: 500 }, children: "PLAY" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ p("div", { style: {
+      position: "absolute",
+      top: "50%",
+      left: "50%",
+      transform: "translate(-50%, -50%)",
+      width: "100%",
+      height: "100%",
+      pointerEvents: "none",
+      zIndex: 0
+    }, children: [
+      /* @__PURE__ */ e(
+        "img",
+        {
+          src: `${U}/sun.png`,
+          alt: "Sun",
+          style: {
+            position: "absolute",
+            left: s ? "-10%" : "5%",
+            top: "20%",
+            width: "auto",
+            height: s ? `${Math.min(f * 0.33, 200)}px` : `${Math.min((h || r) * 0.33, 300)}px`,
+            maxHeight: "33vh",
+            objectFit: "contain",
+            opacity: 0.6
+          }
+        }
+      ),
+      /* @__PURE__ */ e(
+        "img",
+        {
+          src: `${U}/character.png`,
+          alt: "Hangman character",
+          style: {
+            position: "absolute",
+            right: s ? "5%" : "10%",
+            bottom: "10%",
+            width: "auto",
+            height: s ? `${Math.min(f * 0.33, 200)}px` : `${Math.min((h || r) * 0.33, 300)}px`,
+            maxHeight: "33vh",
+            objectFit: "contain",
+            opacity: 0.6
+          }
+        }
+      )
+    ] })
+  ] }) }) : w === "category" ? /* @__PURE__ */ e("div", { style: X, children: /* @__PURE__ */ p("div", { style: D, children: [
+    Q,
+    /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: rt } }),
+    /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => m("lobby"),
+        onMouseEnter: (t) => {
+          t.currentTarget.style.backgroundColor = "#e5e7eb";
+        },
+        onMouseLeave: (t) => {
+          t.currentTarget.style.backgroundColor = "#f9f9f9";
+        },
+        style: {
+          ...a.gmButton,
+          ...a.gmButtonSecondary,
+          fontSize: `${i.button}px`,
+          padding: `${n}px ${n * 1.5}px`,
+          borderRadius: `${k}px`,
+          position: "absolute",
+          top: `${j}px`,
+          left: `${j}px`,
+          zIndex: 10
+        },
+        children: "←"
+      }
+    ),
+    /* @__PURE__ */ e("div", { style: { ...a.gmButtonGroup, gap: `${n}px`, marginBottom: `${n * 3}px`, marginTop: `${n * 4}px`, position: "relative", zIndex: 1 }, children: Object.keys(W).map((t) => /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => {
+          K(t), m("rounds");
+        },
+        onMouseEnter: (o) => {
+          o.currentTarget.style.backgroundColor = "#f0f0f0", o.currentTarget.style.borderColor = "#1f2937", o.currentTarget.style.transform = "scale(1.05)";
+        },
+        onMouseLeave: (o) => {
+          o.currentTarget.style.backgroundColor = "transparent", o.currentTarget.style.borderColor = "#e5e7eb", o.currentTarget.style.transform = "scale(1)";
+        },
+        style: {
+          fontFamily: '"Onest", system-ui, sans-serif',
+          fontWeight: 500,
+          fontSize: `${i.button}px`,
+          padding: `${n * 1.2}px ${n * 2}px`,
+          borderRadius: `${k * 2}px`,
+          // Более округлые для облачков
+          margin: `${n / 2}px`,
+          background: "transparent",
+          border: "2px solid #e5e7eb",
+          color: "#1f2937",
+          cursor: "pointer",
+          transition: "background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease",
+          boxShadow: "none"
+        },
+        children: t
+      },
+      t
+    )) })
+  ] }) }) : w === "rounds" ? /* @__PURE__ */ e("div", { style: X, children: /* @__PURE__ */ p("div", { style: D, children: [
+    Q,
+    /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: rt } }),
+    /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => m("category"),
+        onMouseEnter: (t) => {
+          t.currentTarget.style.backgroundColor = "#e5e7eb";
+        },
+        onMouseLeave: (t) => {
+          t.currentTarget.style.backgroundColor = "#f9f9f9";
+        },
+        style: {
+          ...a.gmButton,
+          ...a.gmButtonSecondary,
+          fontSize: `${i.button}px`,
+          padding: `${n}px ${n * 1.5}px`,
+          borderRadius: `${k}px`,
+          position: "absolute",
+          top: `${j}px`,
+          left: `${j}px`,
+          zIndex: 10
+        },
+        children: "←"
+      }
+    ),
+    /* @__PURE__ */ e("h1", { style: { ...a.gmHeadline1, fontSize: `${i.headline1}px`, marginBottom: `${n * 2}px`, position: "relative", zIndex: 1 }, children: "Choose rounds" }),
+    /* @__PURE__ */ e("div", { style: { ...a.gmButtonGroup, gap: `${n}px`, marginBottom: `${n * 3}px`, position: "relative", zIndex: 1 }, children: [1, 3, 5].map((t) => /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => {
+          V(t), ut();
+        },
+        onMouseEnter: (o) => {
+          o.currentTarget.style.backgroundColor = "#f0f0f0", o.currentTarget.style.borderColor = "#1f2937", o.currentTarget.style.transform = "scale(1.05)";
+        },
+        onMouseLeave: (o) => {
+          o.currentTarget.style.backgroundColor = "transparent", o.currentTarget.style.borderColor = "#e5e7eb", o.currentTarget.style.transform = "scale(1)";
+        },
+        style: {
+          fontFamily: '"Onest", system-ui, sans-serif',
+          fontWeight: 500,
+          fontSize: `${i.button}px`,
+          padding: `${n * 1.2}px ${n * 2}px`,
+          borderRadius: `${k * 2}px`,
+          // Более округлые для облачков
+          margin: `${n / 2}px`,
+          background: "transparent",
+          border: "2px solid #e5e7eb",
+          color: "#1f2937",
+          cursor: "pointer",
+          transition: "background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease",
+          boxShadow: "none"
+        },
+        children: t
+      },
+      t
+    )) })
+  ] }) }) : w === "game" ? /* @__PURE__ */ e("div", { style: X, children: /* @__PURE__ */ p("div", { style: D, children: [
+    Q,
+    /* @__PURE__ */ p("div", { style: {
+      ...a.gmInfoBox,
+      padding: `${n * 0.8}px`,
+      marginBottom: `${n * 0.5}px`,
+      maxWidth: `${(h || r) * 0.9}px`
+    }, children: [
+      /* @__PURE__ */ p("h3", { style: { ...a.gmHeadline3, fontSize: `${i.headline3}px`, marginBottom: `${n * 0.5}px` }, children: [
+        "Category: ",
+        y
+      ] }),
+      /* @__PURE__ */ p("p", { style: { ...a.gmBodyM, fontSize: `${i.bodyM}px`, marginBottom: "0px" }, children: [
+        "Round ",
+        L,
+        " of ",
+        S
+      ] })
+    ] }),
+    F && /* @__PURE__ */ p("p", { style: {
+      ...a.gmBodyS,
+      fontSize: `${i.bodyS}px`,
+      marginTop: `${n * 0.5}px`,
+      marginBottom: `${n}px`
+    }, children: [
+      "I am thinking of a word that is ",
+      /* @__PURE__ */ e("strong", { children: F.length }),
+      " letters long"
+    ] }),
+    /* @__PURE__ */ e("div", { style: {
+      margin: `${n}px 0`,
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center"
+    }, children: /* @__PURE__ */ e(
+      bt,
+      {
+        mistakes: P,
+        maxMistakes: J,
+        size: v ? Math.max(80, Math.min(110, (h || r) * 0.16)) : Math.max(100, Math.min(150, (h || r) * 0.2))
+      }
+    ) }),
+    /* @__PURE__ */ e("div", { style: {
+      ...a.gmWordDisplay,
+      fontSize: `${Math.max(16, Math.min(24, i.wordDisplay * 0.9))}px`,
+      margin: `${n}px 0`,
+      letterSpacing: `${n * 0.8}px`,
+      minHeight: `${Math.max(16, Math.min(24, i.wordDisplay * 0.9)) * 1.2}px`
+    }, children: mt || "Loading..." }),
+    /* @__PURE__ */ p("div", { style: {
+      ...a.gmInfoBox,
+      padding: `${n}px`,
+      marginTop: `${n}px`,
+      marginBottom: `${n}px`,
+      maxWidth: `${(h || r) * 0.95}px`
+    }, children: [
+      /* @__PURE__ */ e("p", { style: {
+        ...a.gmBodyS,
+        fontSize: `${i.bodyS}px`,
+        marginBottom: `${n}px`,
+        fontWeight: 500
+        // Medium
+      }, children: "Available letters:" }),
+      /* @__PURE__ */ e("div", { style: {
+        display: "flex",
+        flexWrap: "wrap",
+        gap: `${n / 3}px`,
+        justifyContent: "center",
+        fontSize: `${Math.max(9, Math.min(12, i.bodyS * 0.75))}px`,
+        fontFamily: '"Onest", system-ui, sans-serif'
+      }, children: ht.map((t) => /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: () => et(t),
+          disabled: u !== null,
+          onMouseEnter: (o) => {
+            u === null && (o.currentTarget.style.backgroundColor = "#e5e7eb", o.currentTarget.style.cursor = "pointer");
+          },
+          onMouseLeave: (o) => {
+            u === null && (o.currentTarget.style.backgroundColor = "#f9f9f9", o.currentTarget.style.cursor = "pointer");
+          },
+          style: {
+            padding: `${n / 4}px ${n / 3}px`,
+            borderRadius: `${k * 0.5}px`,
+            background: "#f9f9f9",
+            color: "#1f2937",
+            border: "1px solid #e5e7eb",
+            minWidth: `${Math.max(n * 1.5, (h || r) * 0.04)}px`,
+            textAlign: "center",
+            display: "inline-block",
+            cursor: u === null ? "pointer" : "default",
+            fontFamily: '"Onest", system-ui, sans-serif',
+            fontSize: `${Math.max(9, Math.min(12, i.bodyS * 0.75))}px`,
+            transition: "background-color 0.2s ease"
+          },
+          children: t
+        },
+        t
+      )) })
+    ] }),
+    T.length > 0 && /* @__PURE__ */ e("div", { style: {
+      ...a.gmGuessedLetters,
+      fontSize: `${Math.max(10, Math.min(12, i.bodyS * 0.85))}px`,
+      marginTop: `${n * 0.5}px`,
+      marginBottom: "2px"
+    }, children: /* @__PURE__ */ p("span", { style: { color: "#6b7280" }, children: [
+      "Guessed letters: ",
+      /* @__PURE__ */ e("strong", { children: T.join(", ") })
+    ] }) }),
+    u === "win" && /* @__PURE__ */ e("div", { style: {
+      ...a.gmStatusWin,
+      fontSize: `${i.bodyL}px`,
+      margin: "2px 0"
+    }, children: "🎉 You won this round!" }),
+    u === "lose" && /* @__PURE__ */ p("div", { style: {
+      ...a.gmStatusLose,
+      fontSize: `${i.bodyL}px`,
+      margin: "2px 0"
+    }, children: [
+      "The hangman is complete! The word was: ",
+      /* @__PURE__ */ e("strong", { children: F })
+    ] }),
+    u !== null && L < S && /* @__PURE__ */ e("div", { style: { marginTop: "2px", marginBottom: `${n}px` }, children: /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: ft,
+        onMouseEnter: (t) => {
+          t.currentTarget.style.backgroundColor = "#d43a32";
+        },
+        onMouseLeave: (t) => {
+          t.currentTarget.style.backgroundColor = "#ec4c44";
+        },
+        style: {
+          ...a.gmButton,
+          fontSize: `${Math.max(11, Math.min(14, i.button * 0.85))}px`,
+          padding: `${n * 0.6}px ${n * 1.2}px`,
+          borderRadius: `${k}px`
+        },
+        children: "NEXT"
+      }
+    ) }),
+    u !== null && L >= S && /* @__PURE__ */ e("div", { style: { marginTop: "2px", marginBottom: `${n}px` }, children: /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => m("result"),
+        onMouseEnter: (t) => {
+          t.currentTarget.style.backgroundColor = "#d43a32";
+        },
+        onMouseLeave: (t) => {
+          t.currentTarget.style.backgroundColor = "#ec4c44";
+        },
+        style: {
+          ...a.gmButton,
+          fontSize: `${i.button}px`,
+          padding: `${n}px ${n * 1.5}px`,
+          borderRadius: `${k}px`
+        },
+        children: "View Results →"
+      }
+    ) }),
+    u === null && T.length === 0 && /* @__PURE__ */ e("p", { style: {
+      ...a.gmBodyS,
+      fontSize: `${i.bodyS}px`,
+      marginTop: `${n}px`,
+      marginBottom: `${n}px`
+    }, children: "Type a letter on your keyboard" })
+  ] }) }) : w === "result" ? /* @__PURE__ */ e("div", { style: X, children: /* @__PURE__ */ p("div", { style: D, children: [
+    Q,
+    /* @__PURE__ */ e("h1", { style: {
+      ...a.gmHeadline1,
+      fontSize: `${i.headline1}px`,
+      marginBottom: `${n * 2}px`
+    }, children: "🎊 Game Finished!" }),
+    /* @__PURE__ */ p("p", { style: {
+      ...a.gmBodyL,
+      fontSize: `${i.bodyL}px`,
+      marginBottom: `${n * 2}px`
+    }, children: [
+      "You guessed ",
+      /* @__PURE__ */ e("strong", { children: q }),
+      " out of ",
+      /* @__PURE__ */ e("strong", { children: S }),
+      " words correctly."
+    ] }),
+    /* @__PURE__ */ p("div", { style: {
+      display: "flex",
+      flexDirection: "column",
+      gap: `${n}px`,
+      alignItems: "center"
+    }, children: [
+      /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: () => {
+            if (!y || S === 0) {
+              m("lobby");
+              return;
+            }
+            C([]);
+            const t = Z(y, []);
+            t && (R(t), C([t]), I([]), B(0), H(1), O(0), z(null), m("game"));
+          },
+          onMouseEnter: (t) => {
+            t.currentTarget.style.backgroundColor = "#d43a32";
+          },
+          onMouseLeave: (t) => {
+            t.currentTarget.style.backgroundColor = "#ec4c44";
+          },
+          style: {
+            ...a.gmButton,
+            fontSize: `${i.button}px`,
+            padding: `${n}px ${n * 1.5}px`,
+            borderRadius: `${k}px`,
+            minWidth: "200px"
+          },
+          children: "Play again"
+        }
+      ),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: () => m("lobby"),
+          onMouseEnter: (t) => {
+            t.currentTarget.style.backgroundColor = "#e5e7eb";
+          },
+          onMouseLeave: (t) => {
+            t.currentTarget.style.backgroundColor = "#f9f9f9";
+          },
+          style: {
+            ...a.gmButton,
+            ...a.gmButtonSecondary,
+            fontSize: `${i.button}px`,
+            padding: `${n}px ${n * 1.5}px`,
+            borderRadius: `${k}px`,
+            minWidth: "200px"
+          },
+          children: "Exit"
+        }
+      )
+    ] })
+  ] }) }) : null;
+}
+export {
+  Mt as HangmanLobbyGame,
+  Mt as default
+};
+//# sourceMappingURL=speakid-hangman.es.js.map