@sensiblestats/widget-react 0.60.5 → 0.61.0

package/dist/index.js

@@ -199,7 +199,8 @@ var STRINGS = {
         optionsLabel: "Clubs",
         solved: "Solved!",
         failed: "Out of guesses",
-        detail: (n) => `${n} ${n === 1 ? "guess" : "guesses"} \xB7 back tomorrow`
+        detail: (n) => `${n} ${n === 1 ? "guess" : "guesses"} \xB7 back tomorrow`,
+        theAnswer: "The answer"
       },
       dailyQuiz: {
         questionOf: (i, n) => `Question ${i} of ${n}`,
@@ -494,7 +495,8 @@ var STRINGS = {
         optionsLabel: "Kul\xFCpler",
         solved: "Bildin!",
         failed: "Tahmin hakk\u0131n bitti",
-        detail: (n) => `${n} tahmin \xB7 yar\u0131n yine gel`
+        detail: (n) => `${n} tahmin \xB7 yar\u0131n yine gel`,
+        theAnswer: "Do\u011Fru cevap"
       },
       dailyQuiz: {
         questionOf: (i, n) => `Soru ${i} / ${n}`,
@@ -4732,6 +4734,7 @@ import { useState as useState25, useId as useId2 } from "react";
 
 // src/components/games/nationFlags.ts
 var FLAGS = {
+  // UK home nations (subdivision flags)
   england: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0065}\u{E006E}\u{E0067}\u{E007F}",
   scotland: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0073}\u{E0063}\u{E0074}\u{E007F}",
   wales: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0077}\u{E006C}\u{E0073}\u{E007F}",
@@ -4739,6 +4742,7 @@ var FLAGS = {
   "republic of ireland": "\u{1F1EE}\u{1F1EA}",
   ireland: "\u{1F1EE}\u{1F1EA}",
   "united kingdom": "\u{1F1EC}\u{1F1E7}",
+  // Western & Southern Europe
   france: "\u{1F1EB}\u{1F1F7}",
   spain: "\u{1F1EA}\u{1F1F8}",
   portugal: "\u{1F1F5}\u{1F1F9}",
@@ -4748,17 +4752,27 @@ var FLAGS = {
   belgium: "\u{1F1E7}\u{1F1EA}",
   switzerland: "\u{1F1E8}\u{1F1ED}",
   austria: "\u{1F1E6}\u{1F1F9}",
+  luxembourg: "\u{1F1F1}\u{1F1FA}",
+  malta: "\u{1F1F2}\u{1F1F9}",
+  cyprus: "\u{1F1E8}\u{1F1FE}",
+  andorra: "\u{1F1E6}\u{1F1E9}",
+  liechtenstein: "\u{1F1F1}\u{1F1EE}",
+  "san marino": "\u{1F1F8}\u{1F1F2}",
+  monaco: "\u{1F1F2}\u{1F1E8}",
+  // Northern Europe
   denmark: "\u{1F1E9}\u{1F1F0}",
   sweden: "\u{1F1F8}\u{1F1EA}",
   norway: "\u{1F1F3}\u{1F1F4}",
   finland: "\u{1F1EB}\u{1F1EE}",
   iceland: "\u{1F1EE}\u{1F1F8}",
+  // Central & Eastern Europe
   poland: "\u{1F1F5}\u{1F1F1}",
   czechia: "\u{1F1E8}\u{1F1FF}",
   "czech republic": "\u{1F1E8}\u{1F1FF}",
   croatia: "\u{1F1ED}\u{1F1F7}",
   serbia: "\u{1F1F7}\u{1F1F8}",
   "bosnia and herzegovina": "\u{1F1E7}\u{1F1E6}",
+  bosnia: "\u{1F1E7}\u{1F1E6}",
   greece: "\u{1F1EC}\u{1F1F7}",
   romania: "\u{1F1F7}\u{1F1F4}",
   ukraine: "\u{1F1FA}\u{1F1E6}",
@@ -4766,10 +4780,29 @@ var FLAGS = {
   hungary: "\u{1F1ED}\u{1F1FA}",
   slovakia: "\u{1F1F8}\u{1F1F0}",
   slovenia: "\u{1F1F8}\u{1F1EE}",
+  bulgaria: "\u{1F1E7}\u{1F1EC}",
+  lithuania: "\u{1F1F1}\u{1F1F9}",
+  latvia: "\u{1F1F1}\u{1F1FB}",
+  estonia: "\u{1F1EA}\u{1F1EA}",
+  moldova: "\u{1F1F2}\u{1F1E9}",
+  belarus: "\u{1F1E7}\u{1F1FE}",
+  // South-East Europe / Balkans
   turkey: "\u{1F1F9}\u{1F1F7}",
   t\u00FCrkiye: "\u{1F1F9}\u{1F1F7}",
   albania: "\u{1F1E6}\u{1F1F1}",
   "north macedonia": "\u{1F1F2}\u{1F1F0}",
+  kosovo: "\u{1F1FD}\u{1F1F0}",
+  montenegro: "\u{1F1F2}\u{1F1EA}",
+  // Caucasus & Central Asia
+  armenia: "\u{1F1E6}\u{1F1F2}",
+  georgia: "\u{1F1EC}\u{1F1EA}",
+  azerbaijan: "\u{1F1E6}\u{1F1FF}",
+  kazakhstan: "\u{1F1F0}\u{1F1FF}",
+  uzbekistan: "\u{1F1FA}\u{1F1FF}",
+  kyrgyzstan: "\u{1F1F0}\u{1F1EC}",
+  tajikistan: "\u{1F1F9}\u{1F1EF}",
+  turkmenistan: "\u{1F1F9}\u{1F1F2}",
+  // South America
   brazil: "\u{1F1E7}\u{1F1F7}",
   argentina: "\u{1F1E6}\u{1F1F7}",
   uruguay: "\u{1F1FA}\u{1F1FE}",
@@ -4778,38 +4811,134 @@ var FLAGS = {
   peru: "\u{1F1F5}\u{1F1EA}",
   ecuador: "\u{1F1EA}\u{1F1E8}",
   paraguay: "\u{1F1F5}\u{1F1FE}",
+  venezuela: "\u{1F1FB}\u{1F1EA}",
+  bolivia: "\u{1F1E7}\u{1F1F4}",
+  guyana: "\u{1F1EC}\u{1F1FE}",
+  suriname: "\u{1F1F8}\u{1F1F7}",
+  // North & Central America
   mexico: "\u{1F1F2}\u{1F1FD}",
   "united states": "\u{1F1FA}\u{1F1F8}",
   usa: "\u{1F1FA}\u{1F1F8}",
   canada: "\u{1F1E8}\u{1F1E6}",
+  "costa rica": "\u{1F1E8}\u{1F1F7}",
+  panama: "\u{1F1F5}\u{1F1E6}",
+  honduras: "\u{1F1ED}\u{1F1F3}",
+  "el salvador": "\u{1F1F8}\u{1F1FB}",
+  guatemala: "\u{1F1EC}\u{1F1F9}",
+  nicaragua: "\u{1F1F3}\u{1F1EE}",
+  // Caribbean
   jamaica: "\u{1F1EF}\u{1F1F2}",
+  cuba: "\u{1F1E8}\u{1F1FA}",
+  haiti: "\u{1F1ED}\u{1F1F9}",
+  "dominican republic": "\u{1F1E9}\u{1F1F4}",
+  "trinidad and tobago": "\u{1F1F9}\u{1F1F9}",
+  trinidad: "\u{1F1F9}\u{1F1F9}",
+  "cura\xE7ao": "\u{1F1E8}\u{1F1FC}",
+  curacao: "\u{1F1E8}\u{1F1FC}",
+  barbados: "\u{1F1E7}\u{1F1E7}",
+  // West Africa
   nigeria: "\u{1F1F3}\u{1F1EC}",
   ghana: "\u{1F1EC}\u{1F1ED}",
   senegal: "\u{1F1F8}\u{1F1F3}",
   ivorycoast: "\u{1F1E8}\u{1F1EE}",
   "cote d'ivoire": "\u{1F1E8}\u{1F1EE}",
+  "c\xF4te d'ivoire": "\u{1F1E8}\u{1F1EE}",
   "ivory coast": "\u{1F1E8}\u{1F1EE}",
   cameroon: "\u{1F1E8}\u{1F1F2}",
+  mali: "\u{1F1F2}\u{1F1F1}",
+  guinea: "\u{1F1EC}\u{1F1F3}",
+  "guinea-bissau": "\u{1F1EC}\u{1F1FC}",
+  "sierra leone": "\u{1F1F8}\u{1F1F1}",
+  liberia: "\u{1F1F1}\u{1F1F7}",
+  "cape verde": "\u{1F1E8}\u{1F1FB}",
+  "gambia": "\u{1F1EC}\u{1F1F2}",
+  mauritania: "\u{1F1F2}\u{1F1F7}",
+  togo: "\u{1F1F9}\u{1F1EC}",
+  benin: "\u{1F1E7}\u{1F1EF}",
+  "burkina faso": "\u{1F1E7}\u{1F1EB}",
+  niger: "\u{1F1F3}\u{1F1EA}",
+  // Central & East Africa
+  "dr congo": "\u{1F1E8}\u{1F1E9}",
+  "democratic republic of the congo": "\u{1F1E8}\u{1F1E9}",
+  "congo dr": "\u{1F1E8}\u{1F1E9}",
+  "republic of the congo": "\u{1F1E8}\u{1F1EC}",
+  congo: "\u{1F1E8}\u{1F1EC}",
+  "congo republic": "\u{1F1E8}\u{1F1EC}",
+  "congo-brazzaville": "\u{1F1E8}\u{1F1EC}",
+  "central african republic": "\u{1F1E8}\u{1F1EB}",
+  gabon: "\u{1F1EC}\u{1F1E6}",
+  "equatorial guinea": "\u{1F1EC}\u{1F1F6}",
+  "south africa": "\u{1F1FF}\u{1F1E6}",
+  angola: "\u{1F1E6}\u{1F1F4}",
+  namibia: "\u{1F1F3}\u{1F1E6}",
+  botswana: "\u{1F1E7}\u{1F1FC}",
+  zimbabwe: "\u{1F1FF}\u{1F1FC}",
+  zambia: "\u{1F1FF}\u{1F1F2}",
+  malawi: "\u{1F1F2}\u{1F1FC}",
+  mozambique: "\u{1F1F2}\u{1F1FF}",
+  tanzania: "\u{1F1F9}\u{1F1FF}",
+  kenya: "\u{1F1F0}\u{1F1EA}",
+  uganda: "\u{1F1FA}\u{1F1EC}",
+  rwanda: "\u{1F1F7}\u{1F1FC}",
+  ethiopia: "\u{1F1EA}\u{1F1F9}",
+  eritrea: "\u{1F1EA}\u{1F1F7}",
+  djibouti: "\u{1F1E9}\u{1F1EF}",
+  somalia: "\u{1F1F8}\u{1F1F4}",
+  sudan: "\u{1F1F8}\u{1F1E9}",
+  "south sudan": "\u{1F1F8}\u{1F1F8}",
+  chad: "\u{1F1F9}\u{1F1E9}",
+  lesotho: "\u{1F1F1}\u{1F1F8}",
+  eswatini: "\u{1F1F8}\u{1F1FF}",
+  swaziland: "\u{1F1F8}\u{1F1FF}",
+  madagascar: "\u{1F1F2}\u{1F1EC}",
+  mauritius: "\u{1F1F2}\u{1F1FA}",
+  comoros: "\u{1F1F0}\u{1F1F2}",
+  seychelles: "\u{1F1F8}\u{1F1E8}",
+  // North Africa
   egypt: "\u{1F1EA}\u{1F1EC}",
   morocco: "\u{1F1F2}\u{1F1E6}",
   algeria: "\u{1F1E9}\u{1F1FF}",
   tunisia: "\u{1F1F9}\u{1F1F3}",
-  mali: "\u{1F1F2}\u{1F1F1}",
-  "south africa": "\u{1F1FF}\u{1F1E6}",
-  "dr congo": "\u{1F1E8}\u{1F1E9}",
+  // Middle East
+  "saudi arabia": "\u{1F1F8}\u{1F1E6}",
+  iran: "\u{1F1EE}\u{1F1F7}",
+  iraq: "\u{1F1EE}\u{1F1F6}",
+  lebanon: "\u{1F1F1}\u{1F1E7}",
+  syria: "\u{1F1F8}\u{1F1FE}",
+  jordan: "\u{1F1EF}\u{1F1F4}",
+  qatar: "\u{1F1F6}\u{1F1E6}",
+  "united arab emirates": "\u{1F1E6}\u{1F1EA}",
+  uae: "\u{1F1E6}\u{1F1EA}",
+  kuwait: "\u{1F1F0}\u{1F1FC}",
+  bahrain: "\u{1F1E7}\u{1F1ED}",
+  oman: "\u{1F1F4}\u{1F1F2}",
+  yemen: "\u{1F1FE}\u{1F1EA}",
+  israel: "\u{1F1EE}\u{1F1F1}",
+  palestine: "\u{1F1F5}\u{1F1F8}",
+  // East & South-East Asia
   japan: "\u{1F1EF}\u{1F1F5}",
   "south korea": "\u{1F1F0}\u{1F1F7}",
   korea: "\u{1F1F0}\u{1F1F7}",
+  china: "\u{1F1E8}\u{1F1F3}",
+  india: "\u{1F1EE}\u{1F1F3}",
+  thailand: "\u{1F1F9}\u{1F1ED}",
+  indonesia: "\u{1F1EE}\u{1F1E9}",
+  malaysia: "\u{1F1F2}\u{1F1FE}",
+  philippines: "\u{1F1F5}\u{1F1ED}",
+  vietnam: "\u{1F1FB}\u{1F1F3}",
+  // Oceania
   australia: "\u{1F1E6}\u{1F1FA}",
-  "saudi arabia": "\u{1F1F8}\u{1F1E6}",
-  iran: "\u{1F1EE}\u{1F1F7}",
-  "new zealand": "\u{1F1F3}\u{1F1FF}"
+  "new zealand": "\u{1F1F3}\u{1F1FF}",
+  fiji: "\u{1F1EB}\u{1F1EF}"
 };
 function nationalityFlag(nationality) {
   if (!nationality) return "\u{1F3F3}\uFE0F";
   const key = nationality.trim().toLowerCase();
   return FLAGS[key] ?? nationality.slice(0, 3).toUpperCase();
 }
+function isNationCode(flag) {
+  return /^[A-Z]{1,3}$/.test(flag);
+}
 
 // src/components/games/PlayerAvatar.tsx
 import { useState as useState24 } from "react";
@@ -5508,6 +5637,23 @@ function CriterionIcon({ kind }) {
       return /* @__PURE__ */ jsx71(IconFlag, {});
   }
 }
+function HeaderVisual({ label, key: iKey, meta }) {
+  if (!meta) {
+    return /* @__PURE__ */ jsx71(CriterionIcon, { kind: criterionIconKind(label, iKey) });
+  }
+  switch (meta.kind) {
+    case "club":
+      return /* @__PURE__ */ jsx71(CrestShield, { src: meta.imageUrl, name: label, size: 24 });
+    case "coach":
+      return /* @__PURE__ */ jsx71(PlayerAvatar, { name: label, imagePath: meta.imageUrl, className: "ss-g-btg-coach-av" });
+    case "country":
+      return /* @__PURE__ */ jsx71("span", { className: "ss-g-btg-hdr-flag", "aria-hidden": "true", children: nationalityFlag(meta.country ?? label) });
+    case "position":
+      return /* @__PURE__ */ jsx71(Fragment14, {});
+    default:
+      return /* @__PURE__ */ jsx71(CriterionIcon, { kind: criterionIconKind(label, iKey) });
+  }
+}
 function parseClientState4(json) {
   if (!json) return null;
   try {
@@ -5586,7 +5732,7 @@ function SearchSheet({
           options: filtered.map((p) => ({
             key: p.id,
             content: /* @__PURE__ */ jsxs59(Fragment14, { children: [
-              /* @__PURE__ */ jsx71(PlayerAvatar, { name: p.name, className: "ss-g-opt-av" }),
+              /* @__PURE__ */ jsx71(PlayerAvatar, { name: p.name, imagePath: p.imagePath, className: "ss-g-opt-av" }),
               /* @__PURE__ */ jsx71("span", { className: "ss-g-btg-result-name", children: p.name }),
               /* @__PURE__ */ jsx71("span", { className: "ss-g-btg-result-plus", "aria-hidden": "true", children: /* @__PURE__ */ jsx71(IconPlus, { size: 18 }) })
             ] })
@@ -5665,17 +5811,25 @@ function BeatTheGridGame({
           role: "grid",
           children: [
             /* @__PURE__ */ jsx71("div", { className: "ss-g-btg-corner" }),
-            cols.map((col, colIdx) => /* @__PURE__ */ jsxs59("div", { className: "ss-g-btg-colhdr", children: [
-              /* @__PURE__ */ jsx71(CriterionIcon, { kind: criterionIconKind(col, config.colsI18n?.[colIdx]?.key) }),
-              /* @__PURE__ */ jsx71("span", { children: col })
-            ] }, col)),
+            cols.map((col, colIdx) => {
+              const colMeta = config.colsMeta?.[colIdx];
+              return /* @__PURE__ */ jsxs59("div", { className: "ss-g-btg-colhdr", "data-meta": colMeta ? "true" : void 0, children: [
+                /* @__PURE__ */ jsx71(HeaderVisual, { label: col, meta: colMeta }, config.colsI18n?.[colIdx]?.key),
+                /* @__PURE__ */ jsx71("span", { children: col })
+              ] }, col);
+            }),
             rows.map((rowLabel, rowIdx) => {
+              const rowMeta = config.rowsMeta?.[rowIdx];
               const abbr = rowAbbrev(rowLabel, s.rowAbbrev, config.rowsI18n?.[rowIdx]?.key);
+              const rowHeaderContent = rowMeta ? /* @__PURE__ */ jsxs59(Fragment14, { children: [
+                /* @__PURE__ */ jsx71(HeaderVisual, { label: rowLabel, meta: rowMeta }, config.rowsI18n?.[rowIdx]?.key),
+                /* @__PURE__ */ jsx71("span", { children: rowLabel })
+              ] }) : abbr === rowLabel ? /* @__PURE__ */ jsx71("span", { children: rowLabel }) : /* @__PURE__ */ jsxs59(Fragment14, { children: [
+                /* @__PURE__ */ jsx71("span", { "aria-hidden": "true", children: abbr }),
+                /* @__PURE__ */ jsx71("span", { className: "ss-g-sr", children: rowLabel })
+              ] });
               return /* @__PURE__ */ jsxs59(React.Fragment, { children: [
-                /* @__PURE__ */ jsx71("div", { className: "ss-g-btg-rowhdr", children: abbr === rowLabel ? /* @__PURE__ */ jsx71("span", { children: rowLabel }) : /* @__PURE__ */ jsxs59(Fragment14, { children: [
-                  /* @__PURE__ */ jsx71("span", { "aria-hidden": "true", children: abbr }),
-                  /* @__PURE__ */ jsx71("span", { className: "ss-g-sr", children: rowLabel })
-                ] }) }),
+                /* @__PURE__ */ jsx71("div", { className: "ss-g-btg-rowhdr", "data-meta": rowMeta ? "true" : void 0, children: rowHeaderContent }),
                 cols.map((colLabel, colIdx) => {
                   const filled = findCellResult(filledCells, rowIdx, colIdx);
                   const isActive = activeCell?.row === rowIdx && activeCell?.col === colIdx;
@@ -5702,7 +5856,17 @@ function BeatTheGridGame({
                           }
                         ),
                         /* @__PURE__ */ jsx71("span", { className: "ss-g-btg-rarity", children: filled.rarityScore }),
-                        /* @__PURE__ */ jsx71(Silhouette, { size: 40 }),
+                        (() => {
+                          const entry = playerPool.find((p) => p.id === filled.playerId);
+                          return /* @__PURE__ */ jsx71(
+                            PlayerAvatar,
+                            {
+                              name: entry?.name ?? "",
+                              imagePath: entry?.imagePath,
+                              className: "ss-g-btg-av"
+                            }
+                          );
+                        })(),
                         /* @__PURE__ */ jsx71("span", { className: "ss-g-btg-name", children: shortName(playerPool.find((p) => p.id === filled.playerId)?.name) })
                       ] }) : /* @__PURE__ */ jsx71("span", { className: "ss-g-btg-plus", "aria-hidden": "true", children: /* @__PURE__ */ jsx71(IconPlus, { size: 22 }) })
                     },
@@ -5847,6 +6011,10 @@ function GuessTheXiGame({
   (clientState?.earnedReveals ?? []).forEach((r) => {
     if (r.slot && r.type !== "position") nameBySlot.set(r.slot, r.value);
   });
+  const lineupBySlot = /* @__PURE__ */ new Map();
+  (clientState?.lineup ?? []).forEach((e) => {
+    lineupBySlot.set(e.slot, { name: e.name, imagePath: e.imagePath });
+  });
   const filtered = config && !isOver ? config.teamPool.filter(
     (tm) => !guessedTeamIds.has(tm.teamId) && tm.teamName.toLowerCase().includes(query.toLowerCase())
   ) : [];
@@ -5879,15 +6047,31 @@ function GuessTheXiGame({
           /* @__PURE__ */ jsx73("div", { className: "ss-g-gxi-rows", children: rows.map((row, r) => /* @__PURE__ */ jsx73("div", { className: "ss-g-gxi-row", children: row.map((pos, c) => {
             const posLabel = pos.slot ? posBySlot.get(pos.slot) ?? "" : "";
             const name = pos.slot ? nameBySlot.get(pos.slot) : void 0;
+            const lineupEntry = pos.slot ? lineupBySlot.get(pos.slot) : void 0;
+            const flag = nationalityFlag(pos.nationality);
+            if (lineupEntry) {
+              return /* @__PURE__ */ jsxs61("div", { className: "ss-g-gxi-node", "data-revealed": "true", children: [
+                /* @__PURE__ */ jsx73(
+                  PlayerAvatar,
+                  {
+                    name: lineupEntry.name,
+                    imagePath: lineupEntry.imagePath,
+                    className: "ss-g-gxi-disc ss-g-gxi-disc--photo"
+                  }
+                ),
+                /* @__PURE__ */ jsx73("span", { className: "ss-g-gxi-pos ss-g-gxi-pos--name", children: splitName(lineupEntry.name).last })
+              ] }, `${pos.slot}-${c}`);
+            }
             return /* @__PURE__ */ jsxs61("div", { className: "ss-g-gxi-node", "data-revealed": name ? "true" : void 0, children: [
               /* @__PURE__ */ jsx73(
                 "span",
                 {
                   className: "ss-g-gxi-disc",
+                  "data-code": isNationCode(flag) ? "true" : void 0,
                   role: "img",
                   title: pos.nationality,
                   "aria-label": `${posLabel ? posLabel + " \u2014 " : ""}${pos.nationality}${name ? " \u2014 " + name : ""}`,
-                  children: nationalityFlag(pos.nationality)
+                  children: flag
                 }
               ),
               name ? /* @__PURE__ */ jsx73("span", { className: "ss-g-gxi-pos ss-g-gxi-pos--name", children: splitName(name).last }) : posLabel && /* @__PURE__ */ jsx73("span", { className: "ss-g-gxi-pos", children: posLabel })
@@ -5896,22 +6080,32 @@ function GuessTheXiGame({
         ] }),
         !isOver && wrongGuesses.length > 0 && /* @__PURE__ */ jsxs61("div", { className: "ss-g-gxi-wrong", children: [
           /* @__PURE__ */ jsx73("span", { className: "ss-g-gxi-wrong-l", children: t.notThem }),
-          wrongGuesses.map((g) => /* @__PURE__ */ jsxs61("span", { className: "ss-g-gxi-wrong-chip", children: [
-            /* @__PURE__ */ jsx73(CrestShield, { name: teamName(g.teamId), size: 18 }),
-            /* @__PURE__ */ jsx73("s", { children: teamName(g.teamId) })
-          ] }, g.teamId))
+          wrongGuesses.map((g) => {
+            const crestUrl = config?.teamPool.find((tm) => tm.teamId === g.teamId)?.crestUrl;
+            return /* @__PURE__ */ jsxs61("span", { className: "ss-g-gxi-wrong-chip", children: [
+              /* @__PURE__ */ jsx73(CrestShield, { src: crestUrl, name: teamName(g.teamId), size: 18 }),
+              /* @__PURE__ */ jsx73("s", { children: teamName(g.teamId) })
+            ] }, g.teamId);
+          })
         ] }),
-        isOver && /* @__PURE__ */ jsx73(
-          ResultCard,
-          {
-            tone: solved ? "win" : failed ? "lose" : "neutral",
-            title: solved ? t.solved : failed ? t.failed : ui.games.alreadyPlayedTitle,
-            score: clientState?.score ?? result?.score ?? 0,
-            detail: clientState ? t.detail(clientState.guessesUsed) : void 0,
-            onBack,
-            ui
-          }
-        )
+        isOver && /* @__PURE__ */ jsxs61(Fragment16, { children: [
+          /* @__PURE__ */ jsx73(
+            ResultCard,
+            {
+              tone: solved ? "win" : failed ? "lose" : "neutral",
+              title: solved ? t.solved : failed ? t.failed : ui.games.alreadyPlayedTitle,
+              score: clientState?.score ?? result?.score ?? 0,
+              detail: clientState ? t.detail(clientState.guessesUsed) : void 0,
+              onBack,
+              ui
+            }
+          ),
+          (solved || failed) && clientState?.answer && /* @__PURE__ */ jsxs61("div", { className: "ss-g-gxi-answer", "data-testid": "gxi-answer-reveal", children: [
+            /* @__PURE__ */ jsx73("span", { className: "ss-g-gxi-answer-label", children: t.theAnswer }),
+            /* @__PURE__ */ jsx73(CrestShield, { src: clientState.answer.crestUrl, name: clientState.answer.teamName, size: 32 }),
+            /* @__PURE__ */ jsx73("span", { className: "ss-g-gxi-answer-name", children: clientState.answer.teamName })
+          ] })
+        ] })
       ] }),
       !isOver && /* @__PURE__ */ jsxs61(FooterBar, { children: [
         query.length > 0 && filtered.length > 0 && /* @__PURE__ */ jsx73(
@@ -5921,7 +6115,7 @@ function GuessTheXiGame({
             options: filtered.map((tm) => ({
               key: tm.teamId,
               content: /* @__PURE__ */ jsxs61(Fragment16, { children: [
-                /* @__PURE__ */ jsx73(CrestShield, { name: tm.teamName, size: 28 }),
+                /* @__PURE__ */ jsx73(CrestShield, { src: tm.crestUrl, name: tm.teamName, size: 28 }),
                 /* @__PURE__ */ jsx73("span", { children: tm.teamName })
               ] })
             })),
@@ -6069,6 +6263,8 @@ function DailyQuizGame({
       /* @__PURE__ */ jsx74("h3", { className: "ss-g-dq-stem", children: current.stem }),
       /* @__PURE__ */ jsx74("div", { className: "ss-g-dq-opts", children: current.options.map((opt, optIdx) => {
         const selected = optIdx === selectedIdx;
+        const imagePath = current.optionImagePaths?.[optIdx] ?? void 0;
+        const playerName = opt;
         return /* @__PURE__ */ jsxs62(
           "button",
           {
@@ -6078,6 +6274,7 @@ function DailyQuizGame({
             disabled: submitting,
             onClick: () => handleSelect(current.index, optIdx),
             children: [
+              current.optionImagePaths && /* @__PURE__ */ jsx74(PlayerAvatar, { name: playerName, imagePath, className: "ss-g-dq-opt-av" }),
               /* @__PURE__ */ jsx74("span", { className: "ss-g-dq-badge", "aria-hidden": "true", children: selected ? /* @__PURE__ */ jsx74(IconCheck, {}) : String.fromCharCode(65 + optIdx) }),
               /* @__PURE__ */ jsx74(OptionName, { text: opt })
             ]
@@ -8349,6 +8546,16 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 /* Labels stay on one line: Turkish "DAHA FAZLA" wrapped to two in a ~115px button. */
 .ss-g-hl-btns .ss-g-btn { font-weight: 800; font-size: 13px; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
 .ss-g-hl-btns .ss-g-btn svg { flex: none; }
+/* Phone-width cards: the info column is ~230px, too narrow for "DAHA FAZLA" + icon side by side.
+   Drop the icons and tighten the type first; stack the buttons only when even that cannot fit. */
+.ss-g-hl-info { container: hlinfo / inline-size; }
+@container hlinfo (max-width: 280px) {
+  .ss-g-hl-btns .ss-g-btn svg { display: none; }
+  .ss-g-hl-btns .ss-g-btn { font-size: 12px; letter-spacing: 0; padding: 0 4px; }
+}
+@container hlinfo (max-width: 180px) {
+  .ss-g-hl-btns { flex-direction: column; }
+}
 .ss-g-hl-vs { position: relative; z-index: 1; flex: none; align-self: center; width: 44px; height: 44px; margin: -28px 0; border-radius: 50%; display: grid; place-items: center; background: var(--ss-g-ground); border: 2px solid var(--ss-g-line-warm); color: var(--ss-w-accent); font: 800 18px var(--ss-g-font-display); }
 /* Clear the VS badge that straddles the seam between the two cards. */
 .ss-g-hl-pair > .ss-g-hl-card:first-child .ss-g-hl-info { padding-bottom: 24px; }
@@ -8385,11 +8592,20 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-g-gxi-node { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; max-width: 72px; }
 .ss-g-gxi-disc { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--ss-g-pitch-chip); border: 2px solid var(--ss-g-pitch-ink); font-size: 22px; line-height: 1; }
 .ss-g-gxi-node[data-revealed] .ss-g-gxi-disc { border-color: var(--ss-w-accent); }
+.ss-g-gxi-disc[data-code] { font-family: var(--ss-g-font-body); font-size: 11px; font-weight: 800; letter-spacing: .02em; color: var(--ss-g-pitch-ink); }
 .ss-g-gxi-pos { max-width: 100%; padding: 1px 6px; border-radius: 4px; background: var(--ss-g-pitch-chip); color: var(--ss-g-pitch-ink); font-size: 11px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .ss-g-gxi-pos--name { color: var(--ss-w-accent); text-transform: uppercase; }
 .ss-g-gxi-wrong { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
 .ss-g-gxi-wrong-l { font-size: 12px; color: var(--ss-g-muted); }
 .ss-g-gxi-wrong-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px 4px 6px; border-radius: 999px; background: var(--ss-g-surface); border: 1px solid var(--ss-g-line); font-size: 13px; color: var(--ss-g-muted); }
+/* u407: lineup photo \u2014 fills the 44px disc like the flag does */
+.ss-g-gxi-disc--photo { overflow: hidden; border: 2px solid var(--ss-w-accent); }
+.ss-g-gxi-disc--photo img { width: 100%; height: 100%; object-fit: cover; }
+.ss-g-gxi-disc--photo .ss-w-av-initials { font-family: var(--ss-g-font-body); font-size: 11px; font-weight: 800; color: var(--ss-g-pitch-ink); }
+/* u407: answer reveal \u2014 prominent row using theme tokens, works on dark/navy/light surfaces */
+.ss-g-gxi-answer { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 12px 16px; border-radius: 14px; background: var(--ss-g-warm); border: 1.5px solid var(--ss-g-line-warm); }
+.ss-g-gxi-answer-label { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ss-g-muted); flex: none; }
+.ss-g-gxi-answer-name { font-family: var(--ss-g-font-display); font-weight: 800; font-size: 20px; text-transform: uppercase; color: var(--ss-g-ink); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 
 /* ---- Daily Quiz (u393) ---- */
 .ss-g-dq-stem { font-family: var(--ss-g-font-display); font-weight: 700; font-size: 30px; line-height: 1.05; overflow-wrap: anywhere; }
@@ -8414,6 +8630,10 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-g-dq-rq-opt--correct { background: var(--ss-g-correct); color: var(--ss-g-on-correct); }
 .ss-g-dq-rq-opt--wrong { background: var(--ss-g-wrong); color: var(--ss-g-on-correct); }
 .ss-g-dq-why { font-size: 13px; color: var(--ss-g-ink-2); }
+/* u407: player avatar in quiz option \u2014 centered in top half, badge at top-left unaffected */
+.ss-g-dq-opt-av { position: absolute; top: 7px; right: 10px; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: var(--ss-g-raised); display: grid; place-items: center; color: var(--ss-g-muted); font-size: 13px; font-weight: 700; flex: none; }
+.ss-g-dq-opt-av img { width: 100%; height: 100%; object-fit: cover; }
+.ss-g-dq-opt-av .ss-w-av-initials { font-size: 11px; }
 
 /* ---- Career Path (u393) ---- */
 .ss-g-cp-card { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 16px; background: var(--ss-g-warm); border: 1px solid var(--ss-g-line-warm); }
@@ -8490,9 +8710,11 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 /* While the search sheet is pinned below, the grid shrinks its rows to share the body with it
    instead of pushing the bottom row under the sheet. */
 .ss-g-btg-grid--fit { flex: 0 1 auto; min-height: 0; }
-.ss-g-btg-colhdr { min-height: 0; border-radius: 12px; background: var(--ss-g-surface); border: 1px solid var(--ss-g-line); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; padding: 0 4px; font-size: 12px; font-weight: 700; line-height: 1.1; min-width: 0; overflow-wrap: anywhere; }
+.ss-g-btg-colhdr { min-height: 0; border-radius: 12px; background: var(--ss-g-surface); border: 1px solid var(--ss-g-line); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; padding: 0 4px; font-size: 12px; font-weight: 700; line-height: 1.1; min-width: 0; overflow-wrap: anywhere; overflow: hidden; }
+.ss-g-btg-colhdr[data-meta] { overflow-wrap: normal; word-break: normal; hyphens: none; font-size: 11px; letter-spacing: 0; }
 .ss-g-btg-colhdr svg { color: var(--ss-w-accent); flex: none; }
-.ss-g-btg-rowhdr { border-radius: 12px; background: var(--ss-g-surface); border: 1px solid var(--ss-g-line); display: grid; place-items: center; font-family: var(--ss-g-font-display); font-weight: 800; font-size: 18px; letter-spacing: .04em; text-transform: uppercase; overflow-wrap: anywhere; text-align: center; }
+.ss-g-btg-rowhdr { border-radius: 12px; background: var(--ss-g-surface); border: 1px solid var(--ss-g-line); display: grid; place-items: center; font-family: var(--ss-g-font-display); font-weight: 800; font-size: 18px; letter-spacing: .04em; text-transform: uppercase; overflow-wrap: anywhere; text-align: center; overflow: hidden; }
+.ss-g-btg-rowhdr[data-meta] { font-size: 10px; font-family: var(--ss-g-font-body); font-weight: 700; letter-spacing: -0.01em; text-transform: none; word-break: normal; overflow-wrap: normal; hyphens: none; line-height: 1.25; padding: 0 2px; }
 .ss-g-btg-cell { position: relative; min-height: 0; min-width: 0; border-radius: 12px; border: 1.5px dashed var(--ss-g-strong-line); background: transparent; color: var(--ss-g-muted); display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; cursor: pointer; font: inherit; padding: 0; }
 .ss-g-btg-cell:disabled { cursor: default; }
 .ss-g-btg-cell[data-state="active"] { border: 2px solid var(--ss-w-accent); background: var(--ss-g-warm); color: var(--ss-w-accent); }
@@ -8520,6 +8742,17 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-g-btg-sheet .ss-g-opts { max-height: 160px; }
 .ss-g-btg-result-name { flex: 1; min-width: 0; font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .ss-g-btg-result-plus { color: var(--ss-w-accent); display: flex; }
+/* u407: cell avatar replaces Silhouette */
+.ss-g-btg-av { width: 38px; height: 38px; flex: none; border-radius: 50%; overflow: hidden; background: var(--ss-g-raised); display: grid; place-items: center; color: var(--ss-g-muted); font-size: 12px; font-weight: 700; }
+.ss-g-btg-av img { width: 100%; height: 100%; object-fit: cover; }
+.ss-g-btg-av .ss-w-av-initials { font-size: 12px; }
+/* u407: coach photo in row/col header */
+.ss-g-btg-coach-av { width: 28px; height: 28px; flex: none; border-radius: 50%; overflow: hidden; background: var(--ss-g-raised); display: grid; place-items: center; color: var(--ss-g-muted); font-size: 10px; font-weight: 700; }
+.ss-g-btg-coach-av img { width: 100%; height: 100%; object-fit: cover; }
+/* u407: country flag emoji in header \u2014 sized to match other header icons */
+.ss-g-btg-hdr-flag { font-size: 20px; line-height: 1; flex: none; }
+/* u407: club crest in col/row header */
+.ss-g-btg-colhdr .ss-g-crest, .ss-g-btg-rowhdr .ss-g-crest { width: 28px; height: 28px; flex: none; }
 
 /* \u2500\u2500 Starting XI (u393) \u2500\u2500 */
 .ss-g-xi-pitch { position: relative; flex: none; height: 400px; border-radius: 18px; overflow: hidden; background: repeating-linear-gradient(180deg, var(--ss-g-pitch) 0 40px, color-mix(in srgb, var(--ss-g-pitch) 88%, var(--ss-g-pitch-mark)) 40px 80px); border: 1px solid var(--ss-g-pitch-line); }