@sensiblestats/widget-react 0.50.1 → 0.51.0

package/dist/index.cjs

@@ -138,6 +138,13 @@ var STRINGS = {
     leaderboardOffBoard: "Outside top 50",
     leaderboardThisWeek: "This week",
     leaderboardAllTime: "All time",
+    leaderboardEmptyFreshTitle: "New week, blank slate",
+    leaderboardEmptyFreshBody: "No scores yet. The first fan to play a game takes #1.",
+    leaderboardEmptyColdTitle: "Be the first up",
+    leaderboardEmptyColdBody: "Nobody's on the board yet. Play a game and you're #1.",
+    leaderboardEmptyCta: "Play today's games",
+    leaderboardLastWeekLabel: "Last week",
+    leaderboardAllTimeEmpty: "The all-time board fills as fans play \u2014 nothing here yet.",
     gamePlay: "Play",
     gameResume: "Resume",
     gameLocked: "Locked",
@@ -228,6 +235,13 @@ var STRINGS = {
     leaderboardOffBoard: "\u0130lk 50 d\u0131\u015F\u0131nda",
     leaderboardThisWeek: "Bu hafta",
     leaderboardAllTime: "T\xFCm zamanlar",
+    leaderboardEmptyFreshTitle: "Yeni hafta, temiz sayfa",
+    leaderboardEmptyFreshBody: "Hen\xFCz skor yok. Oynayan ilk taraftar 1. s\u0131raya ge\xE7er.",
+    leaderboardEmptyColdTitle: "\u0130lk sen ol",
+    leaderboardEmptyColdBody: "Panoda hen\xFCz kimse yok. Bir oyun oyna, 1. s\u0131ra senin.",
+    leaderboardEmptyCta: "Bug\xFCn\xFCn oyunlar\u0131n\u0131 oyna",
+    leaderboardLastWeekLabel: "Ge\xE7en hafta",
+    leaderboardAllTimeEmpty: "T\xFCm zamanlar panosu taraftarlar oynad\u0131k\xE7a dolar \u2014 hen\xFCz bir \u015Fey yok.",
     gamePlay: "Oyna",
     gameResume: "Devam et",
     gameLocked: "Kilitli",
@@ -337,6 +351,13 @@ function normalizeUi(cfg) {
     leaderboardOffBoard: strings.leaderboardOffBoard,
     leaderboardThisWeek: strings.leaderboardThisWeek,
     leaderboardAllTime: strings.leaderboardAllTime,
+    leaderboardEmptyFreshTitle: strings.leaderboardEmptyFreshTitle,
+    leaderboardEmptyFreshBody: strings.leaderboardEmptyFreshBody,
+    leaderboardEmptyColdTitle: strings.leaderboardEmptyColdTitle,
+    leaderboardEmptyColdBody: strings.leaderboardEmptyColdBody,
+    leaderboardEmptyCta: strings.leaderboardEmptyCta,
+    leaderboardLastWeekLabel: strings.leaderboardLastWeekLabel,
+    leaderboardAllTimeEmpty: strings.leaderboardAllTimeEmpty,
     gamePlay: strings.gamePlay,
     gameResume: strings.gameResume,
     gameLocked: strings.gameLocked,
@@ -4209,6 +4230,13 @@ var ATTR_KEYS = [
   "shirtNumber",
   "apps"
 ];
+function verdictGlyph(v) {
+  if (v.verdict === "exact") return "\u2713";
+  if (v.verdict === "miss") return "\u2717";
+  if (v.direction === "up") return "\u2191";
+  if (v.direction === "down") return "\u2193";
+  return "\u2248";
+}
 function MysteryTigerGame({
   config,
   result,
@@ -4218,16 +4246,15 @@ function MysteryTigerGame({
   const [query, setQuery] = (0, import_react29.useState)("");
   const inputId = (0, import_react29.useId)();
   const clientState = parseClientState(result?.clientStateJson);
-  const alreadyGuessedIds = new Set(
-    clientState?.guessResults.map((g) => g.playerId) ?? []
-  );
+  const guessResults = clientState?.guessResults ?? [];
+  const alreadyGuessedIds = new Set(guessResults.map((g) => g.playerId));
   const isOver = result?.alreadyPlayed === true || clientState?.solved === true || clientState?.failed === true;
   const filtered = config && !isOver ? config.squadPlayers.filter(
     (p) => !alreadyGuessedIds.has(p.id) && p.name.toLowerCase().includes(query.toLowerCase())
   ) : [];
   function handleSelect(playerId) {
     if (!config || isOver || submitting) return;
-    const prevGuesses = clientState?.guessResults.map((g) => g.playerId) ?? [];
+    const prevGuesses = guessResults.map((g) => g.playerId);
     const newGuesses = [...prevGuesses, playerId];
     setQuery("");
     onSubmit(JSON.stringify({ guesses: newGuesses }));
@@ -4235,9 +4262,46 @@ function MysteryTigerGame({
   return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gt", "data-testid": "game-screen-mystery-tiger", children: [
     !config && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
     config && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
-      isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: `ss-w-gt-banner ss-w-gt-banner--${clientState.solved ? "solved" : "failed"}`, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-banner-label", children: clientState.solved ? "\u{1F42F} You found them!" : "\u{1F614} Better luck tomorrow" }),
-        clientState.revealedPlayerName && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-banner-name", children: clientState.revealedPlayerName })
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gt-head", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-title", children: "Mystery Tiger" }),
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-sub", children: "Guess today's squad player" })
+        ] }),
+        clientState && !isOver && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "ss-w-gt-left", children: [
+          clientState.guessesRemaining,
+          " left"
+        ] })
+      ] }),
+      guessResults.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gtrows", children: guessResults.map((gr, i) => {
+        const player = config.squadPlayers.find((p) => p.id === gr.playerId);
+        return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gtguess", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gtguess-nm", children: [
+            i + 1,
+            " \xB7 ",
+            player?.name ?? `#${gr.playerId}`
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gtrow", children: ATTR_KEYS.map((key) => {
+            const v = gr[key];
+            return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+              "div",
+              {
+                className: `ss-w-gtile ss-w-gtile--${v.verdict}`,
+                "data-testid": `verdict-${key}-${i}`,
+                "data-verdict": v.verdict,
+                "aria-label": `${ATTR_LABELS[key]}: ${v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "ss-w-gtile-lab", children: ATTR_LABELS[key] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "ss-w-gtile-v", "aria-hidden": "true", children: verdictGlyph(v) })
+                ]
+              },
+              key
+            );
+          }) })
+        ] }, gr.playerId);
+      }) }),
+      clientState?.hintLine && !isOver && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gt-hint", children: [
+        "\u{1F4A1} ",
+        clientState.hintLine
       ] }),
       !isOver && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gtta", children: [
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
@@ -4272,38 +4336,15 @@ function MysteryTigerGame({
           p.id
         )) })
       ] }),
-      clientState && clientState.guessResults.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gthdr", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gthdr-c ss-w-gthdr-c--name", children: "Player" }),
-          ATTR_KEYS.map((key) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gthdr-c", children: ATTR_LABELS[key] }, key))
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gtrows", children: clientState.guessResults.map((gr, i) => {
-          const player = config.squadPlayers.find((p) => p.id === gr.playerId);
-          return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gtrow", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gtrow-nm", children: player?.name ?? `#${gr.playerId}` }),
-            ATTR_KEYS.map((key) => {
-              const v = gr[key];
-              return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-                "div",
-                {
-                  className: `ss-w-gtile ss-w-gtile--${v.verdict}`,
-                  "data-testid": `verdict-${key}-${i}`,
-                  "data-verdict": v.verdict,
-                  "aria-label": `${ATTR_LABELS[key]}: ${v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
-                  children: v.direction && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "ss-w-gtile-dir", "aria-hidden": "true", children: v.direction === "up" ? "\u2191" : "\u2193" })
-                },
-                key
-              );
-            })
-          ] }, gr.playerId);
-        }) })
-      ] }),
-      clientState?.hintLine && !isOver && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-hint", children: clientState.hintLine }),
-      !isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gt-hint", children: [
-        clientState.guessesRemaining,
-        " guess",
-        clientState.guessesRemaining !== 1 ? "es" : "",
-        " remaining"
+      isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: `ss-w-gt-banner ss-w-gt-banner--${clientState.solved ? "solved" : "failed"}`, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-banner-label", children: clientState.solved ? "\u{1F42F} You found them!" : "\u{1F614} Out of guesses" }),
+        clientState.revealedPlayerName && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gt-banner-name", children: clientState.revealedPlayerName }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "ss-w-gt-banner-sub", children: [
+          clientState.guessesUsed,
+          " guess",
+          clientState.guessesUsed === 1 ? "" : "es",
+          " \xB7 come back tomorrow"
+        ] })
       ] })
     ] })
   ] });
@@ -4319,22 +4360,6 @@ function parseClientState2(json) {
     return null;
   }
 }
-function AnsweredRow({
-  answered,
-  pair
-}) {
-  const cls = `ss-w-hlrrow ss-w-hlrrow--${answered.wasCorrect ? "correct" : "wrong"}`;
-  const icon = answered.wasCorrect ? "\u2713" : "\u2717";
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: cls, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { className: "ss-w-hlrrow-names", children: [
-      pair?.playerAName ?? "?",
-      " vs ",
-      pair?.playerBName ?? "?"
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hlrrow-pick", children: answered.pick }),
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hlrrow-icon", children: icon })
-  ] });
-}
 function HigherOrLowerGame({
   config,
   result,
@@ -4342,74 +4367,114 @@ function HigherOrLowerGame({
   onSubmit
 }) {
   const clientState = parseClientState2(result?.clientStateJson);
-  const answeredCount = clientState?.answeredPairs.length ?? 0;
-  const runEndedWrong = clientState?.answeredPairs.some((p) => !p.wasCorrect) ?? false;
+  const answeredPairs = clientState?.answeredPairs ?? [];
+  const answeredCount = answeredPairs.length;
+  const runEndedWrong = answeredPairs.some((p) => !p.wasCorrect);
   const allPairsAnswered = config != null && answeredCount >= config.pairs.length;
   const isOver = result?.alreadyPlayed === true || runEndedWrong || allPairsAnswered;
   const currentPair = config && !isOver ? config.pairs[answeredCount] ?? null : null;
+  const correctCount = answeredPairs.filter((p) => p.wasCorrect).length;
+  const score = clientState?.score ?? correctCount;
+  const runLength = clientState?.runLength ?? 0;
   function handlePick(pick) {
     if (!config || isOver || submitting || !currentPair) return;
-    const prevAnswers = clientState?.answeredPairs.map((p) => ({ pairIndex: p.pairIndex, pick: p.pick })) ?? [];
+    const prevAnswers = answeredPairs.map((p) => ({ pairIndex: p.pairIndex, pick: p.pick }));
     const newAnswers = [...prevAnswers, { pairIndex: currentPair.pairIndex, pick }];
     onSubmit(JSON.stringify({ answers: newAnswers }));
   }
   return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hl", "data-testid": "game-screen-higher-or-lower", children: [
     !config && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
     config && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlctx", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hlctx-fam", children: config.statLabel }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hlctx-szn", children: config.seasonLabel })
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hl-head", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hl-title", children: "Higher or Lower" }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hl-sub", children: [
+            config.statLabel,
+            " \xB7 ",
+            config.seasonLabel
+          ] })
+        ] }),
+        runLength > 0 && !isOver && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { className: "ss-w-hl-streak", children: [
+          "\u{1F525} ",
+          runLength
+        ] })
       ] }),
-      currentPair && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpair", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpc", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-name", children: currentPair.playerAName }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-val", children: currentPair.playerAValue })
+      currentPair && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hl-q", children: [
+          "Who has more ",
+          config.statLabel.toLowerCase(),
+          "?"
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpc ss-w-hlpc--b", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-name", children: currentPair.playerBName }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-val ss-w-hlpc-val--hidden", children: "?" })
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpair", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpc", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-av", "aria-hidden": "true", children: "\u26BD" }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-name", children: currentPair.playerAName }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-stat", children: config.statLabel }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-val", children: currentPair.playerAValue })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlbtns", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+              "button",
+              {
+                type: "button",
+                className: "ss-w-hlbtn ss-w-hlbtn--up",
+                disabled: submitting,
+                onClick: () => handlePick("higher"),
+                children: "Higher \u25B2"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hl-or", children: "or" }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+              "button",
+              {
+                type: "button",
+                className: "ss-w-hlbtn ss-w-hlbtn--dn",
+                disabled: submitting,
+                onClick: () => handlePick("lower"),
+                children: "Lower \u25BC"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpc ss-w-hlpc--b", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-av", "aria-hidden": "true", children: "\u26BD" }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-name", children: currentPair.playerBName }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-stat", children: config.statLabel }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-val ss-w-hlpc-val--hidden", children: "?" })
+          ] })
         ] })
       ] }),
-      !isOver && currentPair && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlbtns", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
-          "button",
-          {
-            type: "button",
-            className: "ss-w-hlbtn",
-            disabled: submitting,
-            onClick: () => handlePick("higher"),
-            children: "Higher"
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
-          "button",
-          {
-            type: "button",
-            className: "ss-w-hlbtn",
-            disabled: submitting,
-            onClick: () => handlePick("lower"),
-            children: "Lower"
-          }
-        )
+      isOver && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hl-over", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hl-over-title", children: runEndedWrong ? "Run over" : "Nice run!" }),
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hl-over-score", children: score }),
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hl-over-sub", children: [
+          correctCount,
+          " correct",
+          correctCount === 1 ? "" : "",
+          " \xB7 come back tomorrow for a new run"
+        ] })
       ] }),
-      clientState && clientState.answeredPairs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlresults", children: clientState.answeredPairs.map((answered) => {
+      answeredPairs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlresults", children: answeredPairs.map((answered) => {
         const pair = config.pairs.find((p) => p.pairIndex === answered.pairIndex);
-        const vCls = `ss-w-hlpc-val ss-w-hlpc-val--${answered.wasCorrect ? "correct" : "wrong"}`;
-        const badgeCls = `ss-w-hlpc-badge ss-w-hlpc-badge--${answered.wasCorrect ? "correct" : "wrong"}`;
-        return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlrrow", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpair", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpc", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-name", children: pair?.playerAName ?? "?" }),
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-val", children: pair?.playerAValue })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ss-w-hlpc ss-w-hlpc--b", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "ss-w-hlpc-name", children: pair?.playerBName ?? "?" }),
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: vCls, children: answered.playerBValue }),
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: badgeCls, children: answered.wasCorrect ? "\u2713" : "\u2717" })
-            ] })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(AnsweredRow, { answered, pair })
-        ] }, answered.pairIndex);
+        return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+          "div",
+          {
+            className: `ss-w-hlrrow ss-w-hlrrow--${answered.wasCorrect ? "correct" : "wrong"}`,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { className: "ss-w-hlrrow-names", children: [
+                pair?.playerAName ?? "?",
+                " ",
+                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("b", { className: "ss-w-hlrrow-val", children: pair?.playerAValue }),
+                " vs ",
+                pair?.playerBName ?? "?",
+                " ",
+                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("b", { className: "ss-w-hlrrow-val", children: answered.playerBValue })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hlrrow-pick", children: answered.pick }),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-w-hlrrow-icon", children: answered.wasCorrect ? "\u2713" : "\u2717" })
+            ]
+          },
+          answered.pairIndex
+        );
       }) })
     ] })
   ] });
@@ -4426,29 +4491,19 @@ function parseClientState3(json) {
     return null;
   }
 }
-function SpellYear({ spell }) {
+function spellYears(spell) {
   const parts = [];
   if (spell.startYear) parts.push(String(spell.startYear));
   if (spell.endYear) parts.push(String(spell.endYear));
-  if (parts.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-spell-yr", children: parts.join(" \u2013 ") });
+  return parts.join("\u2013");
 }
 function ClubSpellCard({ spell }) {
+  const years = spellYears(spell);
   return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: `ss-w-cpath-club${spell.isLoan ? " ss-w-cpath-club--loan" : ""}`, children: [
-    spell.crestUrl ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
-      "img",
-      {
-        src: spell.crestUrl,
-        alt: spell.clubName,
-        className: "ss-w-cpath-crest",
-        loading: "lazy"
-      }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-crest ss-w-cpath-crest--fallback", "aria-hidden": "true" }),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-club-info", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-club-name", children: spell.clubName }),
-      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(SpellYear, { spell }),
-      spell.isLoan && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-loan-badge", children: "Loan" })
-    ] })
+    spell.crestUrl ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("img", { src: spell.crestUrl, alt: "", className: "ss-w-cpath-crest", loading: "lazy" }) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-crest ss-w-cpath-crest--fallback", "aria-hidden": "true", children: spell.clubName.slice(0, 3).toUpperCase() }),
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-club-name", children: spell.clubName }),
+    years && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-spell-yr", children: years }),
+    spell.isLoan && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-loan-badge", children: "Loan" })
   ] });
 }
 function CareerPathGame({
@@ -4460,11 +4515,11 @@ function CareerPathGame({
   const [query, setQuery] = (0, import_react30.useState)("");
   const inputId = (0, import_react30.useId)();
   const clientState = parseClientState3(result?.clientStateJson);
-  const alreadyGuessedIds = new Set(
-    clientState?.guessResults.map((g) => g.playerId) ?? []
-  );
+  const alreadyGuessedIds = new Set(clientState?.guessResults.map((g) => g.playerId) ?? []);
   const isOver = result?.alreadyPlayed === true || clientState?.solved === true || clientState?.failed === true;
   const visiblePath = clientState?.visiblePath ?? config?.initialPath ?? [];
+  const totalClubs = clientState?.totalClubs ?? config?.totalClubs ?? visiblePath.length;
+  const hiddenCount = Math.max(0, totalClubs - visiblePath.length);
   const filtered = config && !isOver ? config.typeaheadPool.filter(
     (p) => !alreadyGuessedIds.has(p.id) && p.name.toLowerCase().includes(query.toLowerCase())
   ) : [];
@@ -4478,24 +4533,33 @@ function CareerPathGame({
   return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath", "data-testid": "game-screen-career-path", children: [
     !config && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
     config && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-ctx", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-ctx-label", children: "Career clubs" }),
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("span", { className: "ss-w-cpath-ctx-count", children: [
-          config.totalClubs,
-          " clubs total"
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-head", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-title", children: "Career Path" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-sub", children: "Which player had this career?" })
+        ] }),
+        clientState && !isOver && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("span", { className: "ss-w-cpath-left", children: [
+          clientState.guessesRemaining,
+          " left"
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-path", children: [
-        visiblePath.map((spell, i) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ClubSpellCard, { spell }, `${spell.clubName}-${i}`)),
-        (clientState?.totalClubs ?? config.totalClubs) > visiblePath.length && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-hidden", children: [
-          "+",
-          (clientState?.totalClubs ?? config.totalClubs) - visiblePath.length,
-          " more clubs hidden"
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-seq", children: [
+        visiblePath.map((spell, i) => /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_react30.Fragment, { children: [
+          i > 0 && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-arrow", "aria-hidden": "true", children: "\u2192" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ClubSpellCard, { spell })
+        ] }, `${spell.clubName}-${i}`)),
+        hiddenCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "ss-w-cpath-arrow", "aria-hidden": "true", children: "\u2192" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-hidden", children: [
+            "+",
+            hiddenCount,
+            " more"
+          ] })
         ] })
       ] }),
-      isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: `ss-w-cpath-banner ss-w-cpath-banner--${clientState.solved ? "solved" : "failed"}`, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-banner-label", children: clientState.solved ? "Career traced!" : "Better luck tomorrow" }),
-        clientState.revealedPlayerName && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-banner-name", children: clientState.revealedPlayerName })
+      clientState?.hintLine && !isOver && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-hint", children: [
+        "\u{1F4A1} ",
+        clientState.hintLine
       ] }),
       !isOver && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-gtta", children: [
         /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
@@ -4505,7 +4569,7 @@ function CareerPathGame({
             type: "text",
             role: "textbox",
             className: "ss-w-gtta-i",
-            placeholder: "Search players\u2026",
+            placeholder: "Name the player\u2026",
             value: query,
             disabled: submitting || isOver,
             onChange: (e) => setQuery(e.target.value),
@@ -4530,12 +4594,15 @@ function CareerPathGame({
           p.id
         )) })
       ] }),
-      clientState?.hintLine && !isOver && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-hint", children: clientState.hintLine }),
-      !isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-hint", children: [
-        clientState.guessesRemaining,
-        " guess",
-        clientState.guessesRemaining !== 1 ? "es" : "",
-        " remaining"
+      isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: `ss-w-cpath-banner ss-w-cpath-banner--${clientState.solved ? "solved" : "failed"}`, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-banner-label", children: clientState.solved ? "\u2705 Career traced!" : "\u{1F614} Out of guesses" }),
+        clientState.revealedPlayerName && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "ss-w-cpath-banner-name", children: clientState.revealedPlayerName }),
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ss-w-cpath-banner-sub", children: [
+          clientState.guessesUsed,
+          " guess",
+          clientState.guessesUsed === 1 ? "" : "es",
+          " \xB7 come back tomorrow"
+        ] })
       ] })
     ] })
   ] });
@@ -4589,7 +4656,7 @@ function SearchSheet({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-gtta", children: [
+    playerPool.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "ss-w-btg-sheet-empty", children: "No players available to search yet." }) : /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-gtta", children: [
       /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
         "input",
         {
@@ -4654,18 +4721,23 @@ function BeatTheGridGame({
   const rows = config.rows;
   const cols = config.cols;
   return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-btg", "data-testid": "game-screen-beat-the-grid", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-btg-ctx", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { className: "ss-w-btg-ctx-score", children: [
-        "Score: ",
-        clientState?.totalScore ?? 0
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-btg-head", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "ss-w-btg-title", children: "Beat the Grid" }),
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "ss-w-btg-sub", children: "Fill each cell with a player who fits" })
       ] }),
-      !isLocked2 && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { className: "ss-w-btg-ctx-left", children: [
-        config.maxGuesses - filledCells.length,
-        " cell",
-        config.maxGuesses - filledCells.length !== 1 ? "s" : "",
-        " left"
-      ] }),
-      isLocked2 && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "ss-w-btg-ctx-done", children: "Complete" })
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-btg-ctx", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { className: "ss-w-btg-ctx-score", children: [
+          clientState?.totalScore ?? 0,
+          " pts"
+        ] }),
+        !isLocked2 && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { className: "ss-w-btg-ctx-left", children: [
+          config.maxGuesses - filledCells.length,
+          " cell",
+          config.maxGuesses - filledCells.length !== 1 ? "s" : "",
+          " left"
+        ] })
+      ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
       "div",
@@ -4706,6 +4778,16 @@ function BeatTheGridGame({
         ]
       }
     ),
+    isLocked2 && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-btg-done", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "ss-w-btg-done-label", children: "\u{1F532} Grid complete" }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "ss-w-btg-done-score", children: clientState?.totalScore ?? 0 }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "ss-w-btg-done-sub", children: [
+        filledCells.filter((c) => c.isCorrect).length,
+        "/",
+        filledCells.length,
+        " correct \xB7 come back tomorrow"
+      ] })
+    ] }),
     activeCell !== null && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       SearchSheet,
       {
@@ -4746,6 +4828,7 @@ function GuessTheXiGame({
 }) {
   const clientState = parseClientState5(result?.clientStateJson);
   const isOver = result?.alreadyPlayed === true || clientState?.status === "solved" || clientState?.status === "failed";
+  const solved = clientState?.status === "solved";
   function handlePick(teamId) {
     if (!config || isOver || submitting) return;
     const prevGuesses = clientState?.guessHistory.map((g) => ({ teamId: g.teamId })) ?? [];
@@ -4755,14 +4838,23 @@ function GuessTheXiGame({
   return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "ss-w-gxi", "data-testid": "game-screen-guess-the-xi", children: [
     !config && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
     config && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_jsx_runtime59.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-ctx", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "ss-w-gxi-ctx-label", children: config.poolLabel }) }),
-      config.positions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-pitch", children: config.positions.map((pos) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "ss-w-gxi-pslot", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "ss-w-gxi-head", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-title", children: "Guess the XI" }),
+          /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-sub", children: config.poolLabel })
+        ] }),
+        clientState && !isOver && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("span", { className: "ss-w-gxi-left", children: [
+          "Guess ",
+          clientState.guessesUsed + 1,
+          "/6"
+        ] })
+      ] }),
+      config.positions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-pitch", children: config.positions.map((pos, i) => /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "ss-w-gxi-pslot", children: [
         /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "ss-w-gxi-pslot-pos", children: pos.slot }),
         /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "ss-w-gxi-pslot-nat", children: pos.nationality })
-      ] }, pos.slot)) }),
+      ] }, `${pos.slot}-${i}`)) }),
       clientState && clientState.earnedReveals.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-reveals", children: clientState.earnedReveals.map((r, i) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(RevealCard, { reveal: r }, i)) }),
-      isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: `ss-w-gxi-banner ss-w-gxi-banner--${clientState.status}`, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "ss-w-gxi-banner-label", children: clientState.status === "solved" ? `Solved! ${clientState.score} pts` : "Better luck tomorrow" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-pool", children: config.teamPool.map((team) => {
+      !isOver ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-pool", children: config.teamPool.map((team) => {
         const guessRecord = clientState?.guessHistory.find((g) => g.teamId === team.teamId);
         return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
           "button",
@@ -4772,17 +4864,21 @@ function GuessTheXiGame({
               "ss-w-gxi-team-btn",
               guessRecord ? guessRecord.wasCorrect ? "ss-w-gxi-team-btn--correct" : "ss-w-gxi-team-btn--wrong" : ""
             ].filter(Boolean).join(" "),
-            disabled: isOver || submitting,
+            disabled: submitting,
             onClick: () => handlePick(team.teamId),
             children: team.teamName
           },
           team.teamId
         );
-      }) }),
-      !isOver && clientState && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "ss-w-gxi-hint", children: [
-        "Guess ",
-        clientState.guessesUsed + 1,
-        " of 6"
+      }) }) : clientState && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: `ss-w-gxi-banner ss-w-gxi-banner--${solved ? "solved" : "failed"}`, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-banner-label", children: solved ? "\u2705 Solved!" : "\u{1F614} Out of guesses" }),
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "ss-w-gxi-banner-score", children: clientState.score }),
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "ss-w-gxi-banner-sub", children: [
+          clientState.guessesUsed,
+          " guess",
+          clientState.guessesUsed === 1 ? "" : "es",
+          " \xB7 come back tomorrow"
+        ] })
       ] })
     ] })
   ] });
@@ -5538,18 +5634,58 @@ function LeaderboardAllTimeRow({
   ] });
 }
 
-// src/components/Leaderboard.tsx
+// src/components/LeaderboardEmpty.tsx
 var import_jsx_runtime68 = require("react/jsx-runtime");
+function LeaderboardEmpty({
+  segment,
+  lastWeek,
+  weeklyPrize,
+  onPlay,
+  ui
+}) {
+  if (segment === "alltime") {
+    return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-lb-empty ss-w-lb-empty--alltime", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-lb-empty-icon", "aria-hidden": "true", children: "\u{1F4CA}" }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: "ss-w-lb-empty-body", children: ui.leaderboardAllTimeEmpty })
+    ] });
+  }
+  const fresh = lastWeek != null;
+  const title = fresh ? ui.leaderboardEmptyFreshTitle : ui.leaderboardEmptyColdTitle;
+  const body = fresh ? ui.leaderboardEmptyFreshBody : ui.leaderboardEmptyColdBody;
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-lb-empty", children: [
+    weeklyPrize && /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-prize", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-prize-icon", "aria-hidden": "true", children: "\u{1F3C6}" }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-prize-body", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-prize-text", children: weeklyPrize }) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-lb-empty-hero", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-lb-empty-icon", "aria-hidden": "true", children: fresh ? "\u{1F3C6}" : "\u{1F3AE}" }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("h4", { className: "ss-w-lb-empty-title", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("p", { className: "ss-w-lb-empty-body", children: body }),
+      onPlay && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("button", { type: "button", className: "ss-w-lb-empty-cta", onClick: onPlay, children: ui.leaderboardEmptyCta })
+    ] }),
+    fresh && lastWeek && /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-lb-last", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-lb-last-label", children: ui.leaderboardLastWeekLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-lb-last-champ", "aria-hidden": "true", children: "\u{1F947}" }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-lb-last-handle", children: lastWeek.handle }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-lb-last-points", children: formatPoints(lastWeek.points) })
+    ] })
+  ] });
+}
+
+// src/components/Leaderboard.tsx
+var import_jsx_runtime69 = require("react/jsx-runtime");
 function Leaderboard({
   data,
-  ui
+  ui,
+  onPlay
 }) {
   const [segment, setSegment] = (0, import_react37.useState)("weekly");
   const myRow = segment === "weekly" ? data.myWeeklyRow : data.myAllTimeRow;
   const offBoard = myRow !== null && myRow !== void 0 && myRow.rank === -1;
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-lb2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-seg", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  const isEmpty = segment === "weekly" ? data.weeklyTop.length === 0 : data.allTimeTop.length === 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "ss-w-lb2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "ss-w-seg", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
         "button",
         {
           type: "button",
@@ -5559,7 +5695,7 @@ function Leaderboard({
           children: ui.leaderboardThisWeek
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
         "button",
         {
           type: "button",
@@ -5570,40 +5706,60 @@ function Leaderboard({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-lb2-rows", children: segment === "weekly" ? data.weeklyTop.map((row) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-      LeaderboardWeeklyRow,
-      {
-        row,
-        isMe: row.operatorUserId === data.myWeeklyRow?.operatorUserId
-      },
-      row.operatorUserId
-    )) : data.allTimeTop.map((row) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-      LeaderboardAllTimeRow,
+    isEmpty ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+      LeaderboardEmpty,
       {
-        row,
-        isMe: row.operatorUserId === data.myAllTimeRow?.operatorUserId
-      },
-      row.operatorUserId
-    )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-kitline", children: "\u{1F3BD}" }),
-    myRow != null && (offBoard ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-lbgap", children: ui.leaderboardOffBoard }) : /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "ss-w-lb2-rows", children: [
-      segment === "weekly" && data.myWeeklyRow && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(LeaderboardWeeklyRow, { row: data.myWeeklyRow, isMe: true }),
-      segment === "alltime" && data.myAllTimeRow && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(LeaderboardAllTimeRow, { row: data.myAllTimeRow, isMe: true })
-    ] })),
-    segment === "alltime" && data.myAllTimeRow && !offBoard && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-lb2-rows", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "ss-w-lb2-row", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "ss-w-lb2-handle", children: formatPoints(data.allTimeTop.reduce((s, r) => s + r.allTimePoints, 0)) }) }) })
+        segment,
+        lastWeek: data.lastWeek,
+        weeklyPrize: data.weeklyPrize,
+        onPlay,
+        ui
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-lb2-rows", children: segment === "weekly" ? data.weeklyTop.map((row) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+        LeaderboardWeeklyRow,
+        {
+          row,
+          isMe: row.operatorUserId === data.myWeeklyRow?.operatorUserId
+        },
+        row.operatorUserId
+      )) : data.allTimeTop.map((row) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+        LeaderboardAllTimeRow,
+        {
+          row,
+          isMe: row.operatorUserId === data.myAllTimeRow?.operatorUserId
+        },
+        row.operatorUserId
+      )) }),
+      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-kitline", children: "\u{1F3BD}" }),
+      myRow != null && (offBoard ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-lbgap", children: ui.leaderboardOffBoard }) : /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "ss-w-lb2-rows", children: [
+        segment === "weekly" && data.myWeeklyRow && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(LeaderboardWeeklyRow, { row: data.myWeeklyRow, isMe: true }),
+        segment === "alltime" && data.myAllTimeRow && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(LeaderboardAllTimeRow, { row: data.myAllTimeRow, isMe: true })
+      ] })),
+      segment === "alltime" && data.myAllTimeRow && !offBoard && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-lb2-rows", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-lb2-row", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "ss-w-lb2-handle", children: formatPoints(data.allTimeTop.reduce((s, r) => s + r.allTimePoints, 0)) }) }) })
+    ] })
   ] });
 }
 
 // src/components/LeaderboardPanel.tsx
-var import_jsx_runtime69 = require("react/jsx-runtime");
-function LeaderboardPanel({ loggedIn, data, ui }) {
-  if (!loggedIn) return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(GamesLoginWall, { ui });
-  if (data === null) return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-mon-list" });
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Leaderboard, { data, ui }) });
+var import_jsx_runtime70 = require("react/jsx-runtime");
+var EMPTY_PAYLOAD = {
+  week: "",
+  weeklyTop: [],
+  myWeeklyRow: null,
+  allTimeTop: [],
+  myAllTimeRow: null,
+  weeklyPrize: null,
+  lastWeek: null
+};
+function LeaderboardPanel({ loggedIn, data, loading, onPlay, ui }) {
+  if (!loggedIn) return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(GamesLoginWall, { ui });
+  if (data === null && loading) return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "ss-w-mon-list" });
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Leaderboard, { data: data ?? EMPTY_PAYLOAD, ui, onPlay }) });
 }
 
 // src/components/ChatPanel.tsx
-var import_jsx_runtime70 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 var FULLSCREEN_QUERY = "(max-width: 639px)";
 function useIsModal() {
   const [modal, setModal] = (0, import_react38.useState)(false);
@@ -5634,8 +5790,8 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
   (0, import_react38.useEffect)(() => {
     if (monitor && monitor.activeTab !== "chat" && state.isStreaming) monitor.markChatActivity();
   }, [monitor, state.isStreaming, state.messages.length]);
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
       ChatHeader,
       {
         onClose: close,
@@ -5648,7 +5804,7 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
         moreOptionsLabel: ui.moreOptions
       }
     ),
-    monitor && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+    monitor && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
       TabBar,
       {
         monitor,
@@ -5660,19 +5816,28 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
         gamesEnabled: gamesResult?.enabled ?? false
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
       "div",
       {
         style: !monitor || monitor.activeTab === "chat" ? { display: "contents" } : { position: "absolute", inset: 0, visibility: "hidden", display: "flex", flexDirection: "column" },
-        children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(MessageList, { controller, ui, slip, onDashboardTap, monitor })
+        children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(MessageList, { controller, ui, slip, onDashboardTap, monitor })
       }
     ),
-    monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(TodayPanel, { discovery, ui, monitor }),
-    monitor && monitor.activeTab === "following" && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(MatchesPanel, { monitor, ui, slip }),
-    monitor && monitor.activeTab === "odds" && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(OddsPanel, { monitor, ui, slip }),
-    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(GamesPanel, { loggedIn: !!loggedIn, games: gamesResult.games, ui, conversation }),
-    monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(LeaderboardPanel, { loggedIn: !!loggedIn, data: leaderboardResult.data, ui }),
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ChatInput, { placeholder: ui.placeholder, streaming: state.isStreaming, onSend: handleSend, onStop: stop, stopLabel: ui.stopResponse, sendLabel: ui.sendMessage })
+    monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(TodayPanel, { discovery, ui, monitor }),
+    monitor && monitor.activeTab === "following" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(MatchesPanel, { monitor, ui, slip }),
+    monitor && monitor.activeTab === "odds" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(OddsPanel, { monitor, ui, slip }),
+    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(GamesPanel, { loggedIn: !!loggedIn, games: gamesResult.games, ui, conversation }),
+    monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+      LeaderboardPanel,
+      {
+        loggedIn: !!loggedIn,
+        data: leaderboardResult.data,
+        loading: leaderboardResult.loading,
+        onPlay: () => monitor.setActiveTab("games"),
+        ui
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ChatInput, { placeholder: ui.placeholder, streaming: state.isStreaming, onSend: handleSend, onStop: stop, stopLabel: ui.stopResponse, sendLabel: ui.sendMessage })
   ] });
 }
 
@@ -6626,6 +6791,20 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 /* Off-board treatment: dashed pill indicating rank is outside top N */
 .ss-w-lbgap { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 12px; font-size: 11.5px; color: var(--ss-w-faint); border: 1px dashed var(--ss-w-line); border-radius: 10px; }
 
+/* ---- Leaderboard empty / weekly-reset default state ---- */
+.ss-w-lb-empty { display: flex; flex-direction: column; gap: 12px; flex: 1; }
+.ss-w-lb-empty-hero { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; padding: 20px 16px; border: 1px dashed color-mix(in srgb, var(--ss-w-cta) 30%, var(--ss-w-line)); border-radius: 14px; background: color-mix(in srgb, var(--ss-w-cta) 6%, var(--ss-w-panel)); }
+.ss-w-lb-empty--alltime { align-items: center; justify-content: center; text-align: center; padding: 24px 16px; }
+.ss-w-lb-empty-icon { font-size: 30px; line-height: 1; }
+.ss-w-lb-empty-title { margin: 2px 0 0; font-size: 16px; font-weight: 800; color: var(--ss-w-ink); }
+.ss-w-lb-empty-body { margin: 0; max-width: 30ch; font-size: 12.5px; line-height: 1.4; color: var(--ss-w-faint); }
+.ss-w-lb-empty-cta { margin-top: 6px; border: none; border-radius: 10px; padding: 9px 18px; font: inherit; font-size: 13px; font-weight: 700; color: var(--ss-w-cta-ink); background: var(--ss-w-cta); cursor: pointer; }
+.ss-w-lb-empty-cta:hover { filter: brightness(1.04); }
+.ss-w-lb-last { display: flex; align-items: center; gap: 7px; padding-top: 10px; border-top: 1px solid var(--ss-w-line); font-size: 11px; }
+.ss-w-lb-last-label { text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ss-w-faint); }
+.ss-w-lb-last-handle { flex: 1; min-width: 0; font-weight: 600; color: var(--ss-w-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ss-w-lb-last-points { flex: none; font-weight: 750; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
+
 /* ---- Mystery Tiger game screen (D3) ---- */
 .ss-w-gt { display: flex; flex-direction: column; gap: 10px; }
 /* Typeahead wrapper: relative so the dropdown can position under it */
@@ -6637,101 +6816,121 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-w-gtta-opt { padding: 9px 12px; font-size: 13px; cursor: pointer; color: var(--ss-w-ink); border-bottom: 1px solid var(--ss-w-line); }
 .ss-w-gtta-opt:last-child { border-bottom: none; }
 .ss-w-gtta-opt:hover { background: var(--ss-w-bubble); }
-/* Column header labels: one cell per attribute */
-.ss-w-gthdr { display: grid; grid-template-columns: 1fr repeat(5, 36px); gap: 4px; padding: 0 2px; }
-.ss-w-gthdr-c { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ss-w-faint); text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.ss-w-gthdr-c--name { text-align: left; }
-/* Guess rows */
-.ss-w-gtrows { display: flex; flex-direction: column; gap: 4px; }
-.ss-w-gtrow { display: grid; grid-template-columns: 1fr repeat(5, 36px); gap: 4px; align-items: center; }
-.ss-w-gtrow-nm { font-size: 12px; font-weight: 600; color: var(--ss-w-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 4px; }
-/* Verdict tiles */
-.ss-w-gtile { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 36px; border-radius: 8px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; gap: 1px; transition: transform .1s; }
-.ss-w-gtile--exact { background: var(--ss-w-correct); color: #fff; }
-.ss-w-gtile--near { background: var(--ss-w-cta); color: var(--ss-w-cta-ink, #fff); }
+/* Header: title + sub + remaining chip */
+.ss-w-gt-head { display: flex; align-items: flex-start; gap: 8px; }
+.ss-w-gt-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
+.ss-w-gt-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
+.ss-w-gt-left { margin-left: auto; flex: none; font-size: 11px; font-weight: 700; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 11%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 22%, var(--ss-w-line)); border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
+/* Guess rows \u2014 one labelled block per guess */
+.ss-w-gtrows { display: flex; flex-direction: column; gap: 8px; }
+.ss-w-gtguess { display: flex; flex-direction: column; gap: 4px; }
+.ss-w-gtguess-nm { font-size: 11px; font-weight: 600; color: var(--ss-w-faint); }
+.ss-w-gtrow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
+/* Verdict tiles: label on top, verdict glyph below */
+.ss-w-gtile { display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1; border-radius: 8px; gap: 2px; min-width: 0; }
+.ss-w-gtile-lab { font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; opacity: .75; }
+.ss-w-gtile-v { font-size: 15px; font-weight: 800; line-height: 1; }
+.ss-w-gtile--exact { background: var(--ss-w-correct); color: #062611; }
+.ss-w-gtile--near { background: var(--ss-w-accent); color: #241700; }
 .ss-w-gtile--miss { background: var(--ss-w-bubble); color: var(--ss-w-faint); border: 1px solid var(--ss-w-line); }
-.ss-w-gtile-dir { font-size: 11px; line-height: 1; }
 /* Hint line */
-.ss-w-gt-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; padding: 2px 0; font-style: italic; }
-/* Outcome banner: shown when solved or failed */
-.ss-w-gt-banner { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 12px; border-radius: 12px; text-align: center; }
+.ss-w-gt-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; padding: 6px 10px; border-radius: 10px; background: color-mix(in srgb, var(--ss-w-accent) 8%, var(--ss-w-panel)); border: 1px dashed color-mix(in srgb, var(--ss-w-accent) 30%, var(--ss-w-line)); }
+/* Terminal outcome banner */
+.ss-w-gt-banner { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; }
 .ss-w-gt-banner--solved { background: color-mix(in srgb, var(--ss-w-correct) 12%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-correct) 28%, var(--ss-w-line)); }
-.ss-w-gt-banner--failed { background: color-mix(in srgb, var(--ss-w-wrong) 8%, var(--ss-w-panel)); border: 1px solid var(--ss-w-line); }
-.ss-w-gt-banner-name { font-size: 16px; font-weight: 750; color: var(--ss-w-ink); }
-.ss-w-gt-banner-label { font-size: 12px; color: var(--ss-w-faint); }
+.ss-w-gt-banner--failed { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
+.ss-w-gt-banner-name { font-size: 20px; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; color: var(--ss-w-accent); }
+.ss-w-gt-banner-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
+.ss-w-gt-banner-sub { font-size: 11px; color: var(--ss-w-faint); }
 
-/* ---- Higher or Lower game screen (D3) ---- */
+/* ---- Higher or Lower game screen (D3) \u2014 artifact hl-pair/pcard/hlb layout ---- */
 .ss-w-hl { display: flex; flex-direction: column; gap: 12px; }
-/* Stat context header: family name + season */
-.ss-w-hlctx { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
-.ss-w-hlctx-fam { font-size: 14px; font-weight: 750; color: var(--ss-w-ink); }
-.ss-w-hlctx-szn { font-size: 11.5px; color: var(--ss-w-faint); font-weight: 500; }
-/* Score chip */
-.ss-w-hl-score { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 11%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 22%, var(--ss-w-line)); border-radius: 999px; padding: 3px 10px; }
-/* Pair card: two player cards + divider */
-.ss-w-hlpair { display: flex; align-items: stretch; gap: 0; border-radius: 14px; border: 1.5px solid var(--ss-w-line); overflow: hidden; background: var(--ss-w-panel); }
-/* Player card */
-.ss-w-hlpc { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 10px; text-align: center; }
-.ss-w-hlpc--b { border-left: 1px solid var(--ss-w-line); }
-.ss-w-hlpc-name { font-size: 12.5px; font-weight: 650; color: var(--ss-w-ink); line-height: 1.25; word-break: break-word; min-width: 0; }
-.ss-w-hlpc-val { font-size: 22px; font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; line-height: 1; }
-.ss-w-hlpc-val--hidden { color: var(--ss-w-faint); font-size: 26px; }
-.ss-w-hlpc-val--correct { color: var(--ss-w-correct); }
-.ss-w-hlpc-val--wrong { color: var(--ss-w-cta); }
-.ss-w-hlpc-badge { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; border-radius: 999px; padding: 2px 8px; }
-.ss-w-hlpc-badge--correct { color: #fff; background: var(--ss-w-correct); }
-.ss-w-hlpc-badge--wrong { color: var(--ss-w-cta-ink, #fff); background: var(--ss-w-cta); }
-/* Higher / Lower buttons */
-.ss-w-hlbtns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
-.ss-w-hlbtn { padding: 11px; border-radius: 10px; border: 1.5px solid var(--ss-w-line); background: var(--ss-w-panel); color: var(--ss-w-ink); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: background .1s, border-color .1s, color .1s; }
-.ss-w-hlbtn:hover:not(:disabled) { background: var(--ss-w-bubble); border-color: var(--ss-w-accent); color: var(--ss-w-accent); }
+/* Header: title + sub + streak chip */
+.ss-w-hl-head { display: flex; align-items: flex-start; gap: 8px; }
+.ss-w-hl-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
+.ss-w-hl-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
+.ss-w-hl-streak { margin-left: auto; flex: none; font-size: 12px; font-weight: 700; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 11%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 22%, var(--ss-w-line)); border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
+/* Question line */
+.ss-w-hl-q { text-align: center; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-faint); }
+/* Pair: player A | Higher/Lower | player B */
+.ss-w-hlpair { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: stretch; }
+.ss-w-hlpc { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 14px 6px; text-align: center; min-width: 0; }
+.ss-w-hlpc-av { width: 42px; height: 42px; border-radius: 50%; background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); display: grid; place-items: center; font-size: 20px; flex: none; }
+.ss-w-hlpc-name { font-size: 12.5px; font-weight: 700; color: var(--ss-w-ink); line-height: 1.15; }
+.ss-w-hlpc-stat { font-size: 8.5px; color: var(--ss-w-faint); text-transform: uppercase; letter-spacing: .04em; }
+.ss-w-hlpc-val { font-size: 30px; font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; line-height: 1; }
+.ss-w-hlpc-val--hidden { color: var(--ss-w-faint); }
+/* Higher / Lower \u2014 middle column */
+.ss-w-hlbtns { display: flex; flex-direction: column; gap: 6px; justify-content: center; }
+.ss-w-hl-or { text-align: center; font-size: 11px; font-weight: 700; color: var(--ss-w-faint); }
+.ss-w-hlbtn { font: inherit; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; border-radius: 9px; padding: 10px 12px; cursor: pointer; border: 1px solid var(--ss-w-line); white-space: nowrap; transition: border-color .1s, background .1s; }
+.ss-w-hlbtn--up { background: color-mix(in srgb, var(--ss-w-accent) 12%, var(--ss-w-panel)); color: var(--ss-w-accent); border-color: color-mix(in srgb, var(--ss-w-accent) 40%, var(--ss-w-line)); }
+.ss-w-hlbtn--dn { background: var(--ss-w-panel); color: var(--ss-w-ink); }
+.ss-w-hlbtn:hover:not(:disabled) { border-color: var(--ss-w-accent); }
 .ss-w-hlbtn:disabled { opacity: .5; cursor: not-allowed; }
-/* Answered pair result rows */
-.ss-w-hlresults { display: flex; flex-direction: column; gap: 4px; }
-.ss-w-hlrrow { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 8px; font-size: 12px; background: var(--ss-w-bubble); }
-.ss-w-hlrrow--correct { background: color-mix(in srgb, var(--ss-w-correct) 8%, var(--ss-w-panel)); }
+/* Run-over terminal panel */
+.ss-w-hl-over { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 14px; padding: 16px; text-align: center; display: flex; flex-direction: column; gap: 5px; }
+.ss-w-hl-over-title { font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); }
+.ss-w-hl-over-score { font-size: 34px; font-weight: 800; color: var(--ss-w-accent); line-height: 1; font-variant-numeric: tabular-nums; }
+.ss-w-hl-over-sub { font-size: 11px; color: var(--ss-w-faint); }
+/* Answered history \u2014 clean single-line rows with the revealed value */
+.ss-w-hlresults { display: flex; flex-direction: column; gap: 5px; }
+.ss-w-hlrrow { display: flex; align-items: center; gap: 8px; padding: 8px 11px; border-radius: 10px; font-size: 12px; background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); }
+.ss-w-hlrrow--correct { background: color-mix(in srgb, var(--ss-w-correct) 10%, var(--ss-w-panel)); border-color: color-mix(in srgb, var(--ss-w-correct) 30%, var(--ss-w-line)); }
 .ss-w-hlrrow--wrong { background: color-mix(in srgb, var(--ss-w-cta) 8%, var(--ss-w-panel)); }
 .ss-w-hlrrow-names { flex: 1; min-width: 0; font-weight: 600; color: var(--ss-w-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.ss-w-hlrrow-pick { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--ss-w-faint); }
+.ss-w-hlrrow-val { font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; }
+.ss-w-hlrrow-pick { font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--ss-w-faint); flex: none; }
 .ss-w-hlrrow-icon { font-size: 14px; flex: none; }
+.ss-w-hlrrow--correct .ss-w-hlrrow-icon { color: var(--ss-w-correct); }
+.ss-w-hlrrow--wrong .ss-w-hlrrow-icon { color: var(--ss-w-cta); }
 
-/* ---- Career Path game screen (D3) ---- */
+/* ---- Career Path game screen (D3) \u2014 artifact cpath/club/cto layout ---- */
 .ss-w-cpath { display: flex; flex-direction: column; gap: 12px; }
-/* Context header */
-.ss-w-cpath-ctx { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px; }
-.ss-w-cpath-ctx-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ss-w-faint); }
-.ss-w-cpath-ctx-count { font-size: 12px; font-weight: 600; color: var(--ss-w-accent); }
-/* Career path: vertical timeline of club spells */
-.ss-w-cpath-path { display: flex; flex-direction: column; gap: 4px; }
-/* Single club card */
-.ss-w-cpath-club { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
-.ss-w-cpath-club--loan { border-style: dashed; }
-/* Crest image / fallback */
-.ss-w-cpath-crest { width: 30px; height: 30px; object-fit: contain; flex: none; border-radius: 4px; }
-.ss-w-cpath-crest--fallback { background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); border-radius: 4px; }
-/* Club info: name + years */
-.ss-w-cpath-club-info { display: flex; flex: 1; min-width: 0; align-items: center; gap: 6px; flex-wrap: wrap; }
-.ss-w-cpath-club-name { font-size: 13px; font-weight: 650; color: var(--ss-w-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.ss-w-cpath-spell-yr { font-size: 11px; color: var(--ss-w-faint); font-weight: 500; white-space: nowrap; }
-.ss-w-cpath-loan-badge { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 1px 7px; border-radius: 999px; background: color-mix(in srgb, var(--ss-w-cta) 15%, var(--ss-w-panel)); color: var(--ss-w-cta-ink, #1b1300); border: 1px solid color-mix(in srgb, var(--ss-w-cta) 30%, var(--ss-w-line)); flex: none; }
-/* Hidden clubs indicator */
-.ss-w-cpath-hidden { font-size: 11.5px; color: var(--ss-w-faint); font-style: italic; text-align: center; padding: 6px 0 2px; }
+/* Header */
+.ss-w-cpath-head { display: flex; align-items: flex-start; gap: 8px; }
+.ss-w-cpath-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
+.ss-w-cpath-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
+.ss-w-cpath-left { margin-left: auto; flex: none; font-size: 11px; font-weight: 700; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 11%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 22%, var(--ss-w-line)); border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
+/* Career sequence \u2014 horizontal crests with arrows */
+.ss-w-cpath-seq { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 14px; padding: 13px 11px; }
+.ss-w-cpath-arrow { align-self: center; color: var(--ss-w-faint); font-size: 13px; padding-top: 10px; }
+/* Single club \u2014 small vertical card */
+.ss-w-cpath-club { display: flex; flex-direction: column; align-items: center; gap: 3px; width: 58px; }
+.ss-w-cpath-crest { width: 34px; height: 34px; object-fit: contain; flex: none; border-radius: 8px; }
+.ss-w-cpath-crest--fallback { background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); display: grid; place-items: center; font-size: 9px; font-weight: 800; letter-spacing: .02em; color: var(--ss-w-faint); }
+.ss-w-cpath-club-name { font-size: 9px; font-weight: 600; color: var(--ss-w-ink); text-align: center; line-height: 1.1; overflow-wrap: anywhere; }
+.ss-w-cpath-spell-yr { font-size: 8px; color: var(--ss-w-faint); font-weight: 500; white-space: nowrap; }
+.ss-w-cpath-loan-badge { font-size: 7.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 0 5px; border-radius: 999px; background: color-mix(in srgb, var(--ss-w-accent) 15%, var(--ss-w-panel)); color: var(--ss-w-accent); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 30%, var(--ss-w-line)); }
+.ss-w-cpath-club--loan .ss-w-cpath-crest { border: 1px dashed color-mix(in srgb, var(--ss-w-accent) 40%, var(--ss-w-line)); }
+/* Hidden clubs chip */
+.ss-w-cpath-hidden { align-self: center; font-size: 9px; font-weight: 700; color: var(--ss-w-faint); background: var(--ss-w-bubble); border: 1px dashed var(--ss-w-line); border-radius: 8px; padding: 6px 8px; }
 /* Hint line */
-.ss-w-cpath-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; padding: 2px 0; font-style: italic; }
-/* Outcome banner */
-.ss-w-cpath-banner { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 12px; border-radius: 12px; text-align: center; }
+.ss-w-cpath-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; padding: 6px 10px; border-radius: 10px; background: color-mix(in srgb, var(--ss-w-accent) 8%, var(--ss-w-panel)); border: 1px dashed color-mix(in srgb, var(--ss-w-accent) 30%, var(--ss-w-line)); }
+/* Terminal outcome */
+.ss-w-cpath-banner { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; }
 .ss-w-cpath-banner--solved { background: color-mix(in srgb, var(--ss-w-correct) 12%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-correct) 28%, var(--ss-w-line)); }
-.ss-w-cpath-banner--failed { background: color-mix(in srgb, var(--ss-w-wrong) 8%, var(--ss-w-panel)); border: 1px solid var(--ss-w-line); }
-.ss-w-cpath-banner-name { font-size: 16px; font-weight: 750; color: var(--ss-w-ink); }
-.ss-w-cpath-banner-label { font-size: 12px; color: var(--ss-w-faint); }
+.ss-w-cpath-banner--failed { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
+.ss-w-cpath-banner-name { font-size: 20px; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; color: var(--ss-w-accent); }
+.ss-w-cpath-banner-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
+.ss-w-cpath-banner-sub { font-size: 11px; color: var(--ss-w-faint); }
 
-/* ---- Beat the Grid game screen (D3) ---- */
+/* ---- Beat the Grid game screen (D3) \u2014 artifact grid/gc layout ---- */
 .ss-w-btg { display: flex; flex-direction: column; gap: 10px; }
-/* Score/context row */
-.ss-w-btg-ctx { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
-.ss-w-btg-ctx-score { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
-.ss-w-btg-ctx-left { font-size: 12px; color: var(--ss-w-faint); font-weight: 500; }
-.ss-w-btg-ctx-done { font-size: 12px; font-weight: 700; color: var(--ss-w-correct); }
+/* Header */
+.ss-w-btg-head { display: flex; align-items: flex-start; gap: 8px; }
+.ss-w-btg-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
+.ss-w-btg-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
+.ss-w-btg-ctx { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
+.ss-w-btg-ctx-score { font-size: 13px; font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; }
+.ss-w-btg-ctx-left { font-size: 11px; color: var(--ss-w-faint); font-weight: 500; white-space: nowrap; }
+/* Terminal summary */
+.ss-w-btg-done { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
+.ss-w-btg-done-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
+.ss-w-btg-done-score { font-size: 34px; font-weight: 800; color: var(--ss-w-accent); line-height: 1; font-variant-numeric: tabular-nums; }
+.ss-w-btg-done-sub { font-size: 11px; color: var(--ss-w-faint); }
+/* Empty search pool note */
+.ss-w-btg-sheet-empty { font-size: 12px; color: var(--ss-w-faint); text-align: center; padding: 14px 8px; }
 /* Grid layout \u2014 col count driven inline via style */
 .ss-w-btg-grid { display: grid; gap: 4px; width: 100%; }
 /* Generic grid cell */
@@ -6764,9 +6963,11 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 
 /* ---- Guess the XI game screen (D3) ---- */
 .ss-w-gxi { display: flex; flex-direction: column; gap: 12px; }
-/* Context label (pool label) */
-.ss-w-gxi-ctx { display: flex; align-items: center; }
-.ss-w-gxi-ctx-label { font-size: 12px; font-weight: 700; color: var(--ss-w-faint); text-transform: uppercase; letter-spacing: .05em; }
+/* Header */
+.ss-w-gxi-head { display: flex; align-items: flex-start; gap: 8px; }
+.ss-w-gxi-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
+.ss-w-gxi-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
+.ss-w-gxi-left { margin-left: auto; flex: none; font-size: 11px; font-weight: 700; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 11%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 22%, var(--ss-w-line)); border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
 /* Positions pitch: compact slot grid */
 .ss-w-gxi-pitch { display: flex; flex-wrap: wrap; gap: 5px; }
 .ss-w-gxi-pslot { display: flex; flex-direction: column; align-items: center; gap: 2px; background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); border-radius: 8px; padding: 6px 10px; min-width: 52px; }
@@ -6784,11 +6985,13 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-w-gxi-team-btn:disabled { opacity: .5; cursor: not-allowed; }
 .ss-w-gxi-team-btn--correct { background: color-mix(in srgb, var(--ss-w-correct) 14%, var(--ss-w-panel)); border-color: color-mix(in srgb, var(--ss-w-correct) 35%, var(--ss-w-line)); color: var(--ss-w-correct); }
 .ss-w-gxi-team-btn--wrong { background: color-mix(in srgb, var(--ss-w-wrong) 8%, var(--ss-w-panel)); text-decoration: line-through; opacity: .65; }
-/* Outcome banner */
-.ss-w-gxi-banner { display: flex; align-items: center; justify-content: center; padding: 10px 12px; border-radius: 10px; }
+/* Terminal outcome banner */
+.ss-w-gxi-banner { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; }
 .ss-w-gxi-banner--solved { background: color-mix(in srgb, var(--ss-w-correct) 12%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-correct) 28%, var(--ss-w-line)); }
-.ss-w-gxi-banner--failed { background: color-mix(in srgb, var(--ss-w-wrong) 8%, var(--ss-w-panel)); border: 1px solid var(--ss-w-line); }
+.ss-w-gxi-banner--failed { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
 .ss-w-gxi-banner-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
+.ss-w-gxi-banner-score { font-size: 34px; font-weight: 800; color: var(--ss-w-accent); line-height: 1; font-variant-numeric: tabular-nums; }
+.ss-w-gxi-banner-sub { font-size: 11px; color: var(--ss-w-faint); }
 /* Hint line */
 .ss-w-gxi-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; font-style: italic; }
 
@@ -6933,7 +7136,7 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 `;
 
 // src/StatsWidget.tsx
-var import_jsx_runtime71 = require("react/jsx-runtime");
+var import_jsx_runtime72 = require("react/jsx-runtime");
 function buildClient(props) {
   try {
     if ("client" in props && props.client) {
@@ -7072,7 +7275,7 @@ function StatsWidget(props) {
   }, [built, ui.injectStyles]);
   if (!built) return null;
   const attrs = themeAttrs(ui);
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { ref: rootRef, className: "ss-w-root", "data-ss-w-theme": attrs["data-ss-w-theme"], "data-ss-w-pos": attrs["data-ss-w-pos"], style: attrs.style, children: controller.state.isOpen ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { ref: rootRef, className: "ss-w-root", "data-ss-w-theme": attrs["data-ss-w-theme"], "data-ss-w-pos": attrs["data-ss-w-pos"], style: attrs.style, children: controller.state.isOpen ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     ChatPanel,
     {
       controller,
@@ -7086,7 +7289,7 @@ function StatsWidget(props) {
       loggedIn: !!operatorUserId,
       conversation: built?.conversation ?? null
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  ) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     ChatFab,
     {
       label: ui.launcherLabel,