@sensiblestats/widget-react 0.50.1 → 0.51.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -101,6 +101,13 @@ var STRINGS = {
101
101
  leaderboardOffBoard: "Outside top 50",
102
102
  leaderboardThisWeek: "This week",
103
103
  leaderboardAllTime: "All time",
104
+ leaderboardEmptyFreshTitle: "New week, blank slate",
105
+ leaderboardEmptyFreshBody: "No scores yet. The first fan to play a game takes #1.",
106
+ leaderboardEmptyColdTitle: "Be the first up",
107
+ leaderboardEmptyColdBody: "Nobody's on the board yet. Play a game and you're #1.",
108
+ leaderboardEmptyCta: "Play today's games",
109
+ leaderboardLastWeekLabel: "Last week",
110
+ leaderboardAllTimeEmpty: "The all-time board fills as fans play \u2014 nothing here yet.",
104
111
  gamePlay: "Play",
105
112
  gameResume: "Resume",
106
113
  gameLocked: "Locked",
@@ -191,6 +198,13 @@ var STRINGS = {
191
198
  leaderboardOffBoard: "\u0130lk 50 d\u0131\u015F\u0131nda",
192
199
  leaderboardThisWeek: "Bu hafta",
193
200
  leaderboardAllTime: "T\xFCm zamanlar",
201
+ leaderboardEmptyFreshTitle: "Yeni hafta, temiz sayfa",
202
+ leaderboardEmptyFreshBody: "Hen\xFCz skor yok. Oynayan ilk taraftar 1. s\u0131raya ge\xE7er.",
203
+ leaderboardEmptyColdTitle: "\u0130lk sen ol",
204
+ leaderboardEmptyColdBody: "Panoda hen\xFCz kimse yok. Bir oyun oyna, 1. s\u0131ra senin.",
205
+ leaderboardEmptyCta: "Bug\xFCn\xFCn oyunlar\u0131n\u0131 oyna",
206
+ leaderboardLastWeekLabel: "Ge\xE7en hafta",
207
+ leaderboardAllTimeEmpty: "T\xFCm zamanlar panosu taraftarlar oynad\u0131k\xE7a dolar \u2014 hen\xFCz bir \u015Fey yok.",
194
208
  gamePlay: "Oyna",
195
209
  gameResume: "Devam et",
196
210
  gameLocked: "Kilitli",
@@ -300,6 +314,13 @@ function normalizeUi(cfg) {
300
314
  leaderboardOffBoard: strings.leaderboardOffBoard,
301
315
  leaderboardThisWeek: strings.leaderboardThisWeek,
302
316
  leaderboardAllTime: strings.leaderboardAllTime,
317
+ leaderboardEmptyFreshTitle: strings.leaderboardEmptyFreshTitle,
318
+ leaderboardEmptyFreshBody: strings.leaderboardEmptyFreshBody,
319
+ leaderboardEmptyColdTitle: strings.leaderboardEmptyColdTitle,
320
+ leaderboardEmptyColdBody: strings.leaderboardEmptyColdBody,
321
+ leaderboardEmptyCta: strings.leaderboardEmptyCta,
322
+ leaderboardLastWeekLabel: strings.leaderboardLastWeekLabel,
323
+ leaderboardAllTimeEmpty: strings.leaderboardAllTimeEmpty,
303
324
  gamePlay: strings.gamePlay,
304
325
  gameResume: strings.gameResume,
305
326
  gameLocked: strings.gameLocked,
@@ -4172,6 +4193,13 @@ var ATTR_KEYS = [
4172
4193
  "shirtNumber",
4173
4194
  "apps"
4174
4195
  ];
4196
+ function verdictGlyph(v) {
4197
+ if (v.verdict === "exact") return "\u2713";
4198
+ if (v.verdict === "miss") return "\u2717";
4199
+ if (v.direction === "up") return "\u2191";
4200
+ if (v.direction === "down") return "\u2193";
4201
+ return "\u2248";
4202
+ }
4175
4203
  function MysteryTigerGame({
4176
4204
  config,
4177
4205
  result,
@@ -4181,16 +4209,15 @@ function MysteryTigerGame({
4181
4209
  const [query, setQuery] = useState23("");
4182
4210
  const inputId = useId2();
4183
4211
  const clientState = parseClientState(result?.clientStateJson);
4184
- const alreadyGuessedIds = new Set(
4185
- clientState?.guessResults.map((g) => g.playerId) ?? []
4186
- );
4212
+ const guessResults = clientState?.guessResults ?? [];
4213
+ const alreadyGuessedIds = new Set(guessResults.map((g) => g.playerId));
4187
4214
  const isOver = result?.alreadyPlayed === true || clientState?.solved === true || clientState?.failed === true;
4188
4215
  const filtered = config && !isOver ? config.squadPlayers.filter(
4189
4216
  (p) => !alreadyGuessedIds.has(p.id) && p.name.toLowerCase().includes(query.toLowerCase())
4190
4217
  ) : [];
4191
4218
  function handleSelect(playerId) {
4192
4219
  if (!config || isOver || submitting) return;
4193
- const prevGuesses = clientState?.guessResults.map((g) => g.playerId) ?? [];
4220
+ const prevGuesses = guessResults.map((g) => g.playerId);
4194
4221
  const newGuesses = [...prevGuesses, playerId];
4195
4222
  setQuery("");
4196
4223
  onSubmit(JSON.stringify({ guesses: newGuesses }));
@@ -4198,9 +4225,46 @@ function MysteryTigerGame({
4198
4225
  return /* @__PURE__ */ jsxs49("div", { className: "ss-w-gt", "data-testid": "game-screen-mystery-tiger", children: [
4199
4226
  !config && /* @__PURE__ */ jsx55("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
4200
4227
  config && /* @__PURE__ */ jsxs49(Fragment9, { children: [
4201
- isOver && clientState && /* @__PURE__ */ jsxs49("div", { className: `ss-w-gt-banner ss-w-gt-banner--${clientState.solved ? "solved" : "failed"}`, children: [
4202
- /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-banner-label", children: clientState.solved ? "\u{1F42F} You found them!" : "\u{1F614} Better luck tomorrow" }),
4203
- clientState.revealedPlayerName && /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-banner-name", children: clientState.revealedPlayerName })
4228
+ /* @__PURE__ */ jsxs49("div", { className: "ss-w-gt-head", children: [
4229
+ /* @__PURE__ */ jsxs49("div", { children: [
4230
+ /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-title", children: "Mystery Tiger" }),
4231
+ /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-sub", children: "Guess today's squad player" })
4232
+ ] }),
4233
+ clientState && !isOver && /* @__PURE__ */ jsxs49("span", { className: "ss-w-gt-left", children: [
4234
+ clientState.guessesRemaining,
4235
+ " left"
4236
+ ] })
4237
+ ] }),
4238
+ guessResults.length > 0 && /* @__PURE__ */ jsx55("div", { className: "ss-w-gtrows", children: guessResults.map((gr, i) => {
4239
+ const player = config.squadPlayers.find((p) => p.id === gr.playerId);
4240
+ return /* @__PURE__ */ jsxs49("div", { className: "ss-w-gtguess", children: [
4241
+ /* @__PURE__ */ jsxs49("div", { className: "ss-w-gtguess-nm", children: [
4242
+ i + 1,
4243
+ " \xB7 ",
4244
+ player?.name ?? `#${gr.playerId}`
4245
+ ] }),
4246
+ /* @__PURE__ */ jsx55("div", { className: "ss-w-gtrow", children: ATTR_KEYS.map((key) => {
4247
+ const v = gr[key];
4248
+ return /* @__PURE__ */ jsxs49(
4249
+ "div",
4250
+ {
4251
+ className: `ss-w-gtile ss-w-gtile--${v.verdict}`,
4252
+ "data-testid": `verdict-${key}-${i}`,
4253
+ "data-verdict": v.verdict,
4254
+ "aria-label": `${ATTR_LABELS[key]}: ${v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
4255
+ children: [
4256
+ /* @__PURE__ */ jsx55("span", { className: "ss-w-gtile-lab", children: ATTR_LABELS[key] }),
4257
+ /* @__PURE__ */ jsx55("span", { className: "ss-w-gtile-v", "aria-hidden": "true", children: verdictGlyph(v) })
4258
+ ]
4259
+ },
4260
+ key
4261
+ );
4262
+ }) })
4263
+ ] }, gr.playerId);
4264
+ }) }),
4265
+ clientState?.hintLine && !isOver && /* @__PURE__ */ jsxs49("div", { className: "ss-w-gt-hint", children: [
4266
+ "\u{1F4A1} ",
4267
+ clientState.hintLine
4204
4268
  ] }),
4205
4269
  !isOver && /* @__PURE__ */ jsxs49("div", { className: "ss-w-gtta", children: [
4206
4270
  /* @__PURE__ */ jsx55(
@@ -4235,38 +4299,15 @@ function MysteryTigerGame({
4235
4299
  p.id
4236
4300
  )) })
4237
4301
  ] }),
4238
- clientState && clientState.guessResults.length > 0 && /* @__PURE__ */ jsxs49("div", { children: [
4239
- /* @__PURE__ */ jsxs49("div", { className: "ss-w-gthdr", children: [
4240
- /* @__PURE__ */ jsx55("div", { className: "ss-w-gthdr-c ss-w-gthdr-c--name", children: "Player" }),
4241
- ATTR_KEYS.map((key) => /* @__PURE__ */ jsx55("div", { className: "ss-w-gthdr-c", children: ATTR_LABELS[key] }, key))
4242
- ] }),
4243
- /* @__PURE__ */ jsx55("div", { className: "ss-w-gtrows", children: clientState.guessResults.map((gr, i) => {
4244
- const player = config.squadPlayers.find((p) => p.id === gr.playerId);
4245
- return /* @__PURE__ */ jsxs49("div", { className: "ss-w-gtrow", children: [
4246
- /* @__PURE__ */ jsx55("div", { className: "ss-w-gtrow-nm", children: player?.name ?? `#${gr.playerId}` }),
4247
- ATTR_KEYS.map((key) => {
4248
- const v = gr[key];
4249
- return /* @__PURE__ */ jsx55(
4250
- "div",
4251
- {
4252
- className: `ss-w-gtile ss-w-gtile--${v.verdict}`,
4253
- "data-testid": `verdict-${key}-${i}`,
4254
- "data-verdict": v.verdict,
4255
- "aria-label": `${ATTR_LABELS[key]}: ${v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
4256
- children: v.direction && /* @__PURE__ */ jsx55("span", { className: "ss-w-gtile-dir", "aria-hidden": "true", children: v.direction === "up" ? "\u2191" : "\u2193" })
4257
- },
4258
- key
4259
- );
4260
- })
4261
- ] }, gr.playerId);
4262
- }) })
4263
- ] }),
4264
- clientState?.hintLine && !isOver && /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-hint", children: clientState.hintLine }),
4265
- !isOver && clientState && /* @__PURE__ */ jsxs49("div", { className: "ss-w-gt-hint", children: [
4266
- clientState.guessesRemaining,
4267
- " guess",
4268
- clientState.guessesRemaining !== 1 ? "es" : "",
4269
- " remaining"
4302
+ isOver && clientState && /* @__PURE__ */ jsxs49("div", { className: `ss-w-gt-banner ss-w-gt-banner--${clientState.solved ? "solved" : "failed"}`, children: [
4303
+ /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-banner-label", children: clientState.solved ? "\u{1F42F} You found them!" : "\u{1F614} Out of guesses" }),
4304
+ clientState.revealedPlayerName && /* @__PURE__ */ jsx55("div", { className: "ss-w-gt-banner-name", children: clientState.revealedPlayerName }),
4305
+ /* @__PURE__ */ jsxs49("div", { className: "ss-w-gt-banner-sub", children: [
4306
+ clientState.guessesUsed,
4307
+ " guess",
4308
+ clientState.guessesUsed === 1 ? "" : "es",
4309
+ " \xB7 come back tomorrow"
4310
+ ] })
4270
4311
  ] })
4271
4312
  ] })
4272
4313
  ] });
@@ -4282,22 +4323,6 @@ function parseClientState2(json) {
4282
4323
  return null;
4283
4324
  }
4284
4325
  }
4285
- function AnsweredRow({
4286
- answered,
4287
- pair
4288
- }) {
4289
- const cls = `ss-w-hlrrow ss-w-hlrrow--${answered.wasCorrect ? "correct" : "wrong"}`;
4290
- const icon = answered.wasCorrect ? "\u2713" : "\u2717";
4291
- return /* @__PURE__ */ jsxs50("div", { className: cls, children: [
4292
- /* @__PURE__ */ jsxs50("span", { className: "ss-w-hlrrow-names", children: [
4293
- pair?.playerAName ?? "?",
4294
- " vs ",
4295
- pair?.playerBName ?? "?"
4296
- ] }),
4297
- /* @__PURE__ */ jsx56("span", { className: "ss-w-hlrrow-pick", children: answered.pick }),
4298
- /* @__PURE__ */ jsx56("span", { className: "ss-w-hlrrow-icon", children: icon })
4299
- ] });
4300
- }
4301
4326
  function HigherOrLowerGame({
4302
4327
  config,
4303
4328
  result,
@@ -4305,82 +4330,122 @@ function HigherOrLowerGame({
4305
4330
  onSubmit
4306
4331
  }) {
4307
4332
  const clientState = parseClientState2(result?.clientStateJson);
4308
- const answeredCount = clientState?.answeredPairs.length ?? 0;
4309
- const runEndedWrong = clientState?.answeredPairs.some((p) => !p.wasCorrect) ?? false;
4333
+ const answeredPairs = clientState?.answeredPairs ?? [];
4334
+ const answeredCount = answeredPairs.length;
4335
+ const runEndedWrong = answeredPairs.some((p) => !p.wasCorrect);
4310
4336
  const allPairsAnswered = config != null && answeredCount >= config.pairs.length;
4311
4337
  const isOver = result?.alreadyPlayed === true || runEndedWrong || allPairsAnswered;
4312
4338
  const currentPair = config && !isOver ? config.pairs[answeredCount] ?? null : null;
4339
+ const correctCount = answeredPairs.filter((p) => p.wasCorrect).length;
4340
+ const score = clientState?.score ?? correctCount;
4341
+ const runLength = clientState?.runLength ?? 0;
4313
4342
  function handlePick(pick) {
4314
4343
  if (!config || isOver || submitting || !currentPair) return;
4315
- const prevAnswers = clientState?.answeredPairs.map((p) => ({ pairIndex: p.pairIndex, pick: p.pick })) ?? [];
4344
+ const prevAnswers = answeredPairs.map((p) => ({ pairIndex: p.pairIndex, pick: p.pick }));
4316
4345
  const newAnswers = [...prevAnswers, { pairIndex: currentPair.pairIndex, pick }];
4317
4346
  onSubmit(JSON.stringify({ answers: newAnswers }));
4318
4347
  }
4319
4348
  return /* @__PURE__ */ jsxs50("div", { className: "ss-w-hl", "data-testid": "game-screen-higher-or-lower", children: [
4320
4349
  !config && /* @__PURE__ */ jsx56("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
4321
4350
  config && /* @__PURE__ */ jsxs50(Fragment10, { children: [
4322
- /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlctx", children: [
4323
- /* @__PURE__ */ jsx56("span", { className: "ss-w-hlctx-fam", children: config.statLabel }),
4324
- /* @__PURE__ */ jsx56("span", { className: "ss-w-hlctx-szn", children: config.seasonLabel })
4351
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hl-head", children: [
4352
+ /* @__PURE__ */ jsxs50("div", { children: [
4353
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hl-title", children: "Higher or Lower" }),
4354
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hl-sub", children: [
4355
+ config.statLabel,
4356
+ " \xB7 ",
4357
+ config.seasonLabel
4358
+ ] })
4359
+ ] }),
4360
+ runLength > 0 && !isOver && /* @__PURE__ */ jsxs50("span", { className: "ss-w-hl-streak", children: [
4361
+ "\u{1F525} ",
4362
+ runLength
4363
+ ] })
4325
4364
  ] }),
4326
- currentPair && /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpair", children: [
4327
- /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpc", children: [
4328
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-name", children: currentPair.playerAName }),
4329
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-val", children: currentPair.playerAValue })
4365
+ currentPair && /* @__PURE__ */ jsxs50(Fragment10, { children: [
4366
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hl-q", children: [
4367
+ "Who has more ",
4368
+ config.statLabel.toLowerCase(),
4369
+ "?"
4330
4370
  ] }),
4331
- /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpc ss-w-hlpc--b", children: [
4332
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-name", children: currentPair.playerBName }),
4333
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-val ss-w-hlpc-val--hidden", children: "?" })
4371
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpair", children: [
4372
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpc", children: [
4373
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-av", "aria-hidden": "true", children: "\u26BD" }),
4374
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-name", children: currentPair.playerAName }),
4375
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-stat", children: config.statLabel }),
4376
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-val", children: currentPair.playerAValue })
4377
+ ] }),
4378
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlbtns", children: [
4379
+ /* @__PURE__ */ jsx56(
4380
+ "button",
4381
+ {
4382
+ type: "button",
4383
+ className: "ss-w-hlbtn ss-w-hlbtn--up",
4384
+ disabled: submitting,
4385
+ onClick: () => handlePick("higher"),
4386
+ children: "Higher \u25B2"
4387
+ }
4388
+ ),
4389
+ /* @__PURE__ */ jsx56("span", { className: "ss-w-hl-or", children: "or" }),
4390
+ /* @__PURE__ */ jsx56(
4391
+ "button",
4392
+ {
4393
+ type: "button",
4394
+ className: "ss-w-hlbtn ss-w-hlbtn--dn",
4395
+ disabled: submitting,
4396
+ onClick: () => handlePick("lower"),
4397
+ children: "Lower \u25BC"
4398
+ }
4399
+ )
4400
+ ] }),
4401
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpc ss-w-hlpc--b", children: [
4402
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-av", "aria-hidden": "true", children: "\u26BD" }),
4403
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-name", children: currentPair.playerBName }),
4404
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-stat", children: config.statLabel }),
4405
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-val ss-w-hlpc-val--hidden", children: "?" })
4406
+ ] })
4334
4407
  ] })
4335
4408
  ] }),
4336
- !isOver && currentPair && /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlbtns", children: [
4337
- /* @__PURE__ */ jsx56(
4338
- "button",
4339
- {
4340
- type: "button",
4341
- className: "ss-w-hlbtn",
4342
- disabled: submitting,
4343
- onClick: () => handlePick("higher"),
4344
- children: "Higher"
4345
- }
4346
- ),
4347
- /* @__PURE__ */ jsx56(
4348
- "button",
4349
- {
4350
- type: "button",
4351
- className: "ss-w-hlbtn",
4352
- disabled: submitting,
4353
- onClick: () => handlePick("lower"),
4354
- children: "Lower"
4355
- }
4356
- )
4409
+ isOver && /* @__PURE__ */ jsxs50("div", { className: "ss-w-hl-over", children: [
4410
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hl-over-title", children: runEndedWrong ? "Run over" : "Nice run!" }),
4411
+ /* @__PURE__ */ jsx56("div", { className: "ss-w-hl-over-score", children: score }),
4412
+ /* @__PURE__ */ jsxs50("div", { className: "ss-w-hl-over-sub", children: [
4413
+ correctCount,
4414
+ " correct",
4415
+ correctCount === 1 ? "" : "",
4416
+ " \xB7 come back tomorrow for a new run"
4417
+ ] })
4357
4418
  ] }),
4358
- clientState && clientState.answeredPairs.length > 0 && /* @__PURE__ */ jsx56("div", { className: "ss-w-hlresults", children: clientState.answeredPairs.map((answered) => {
4419
+ answeredPairs.length > 0 && /* @__PURE__ */ jsx56("div", { className: "ss-w-hlresults", children: answeredPairs.map((answered) => {
4359
4420
  const pair = config.pairs.find((p) => p.pairIndex === answered.pairIndex);
4360
- const vCls = `ss-w-hlpc-val ss-w-hlpc-val--${answered.wasCorrect ? "correct" : "wrong"}`;
4361
- const badgeCls = `ss-w-hlpc-badge ss-w-hlpc-badge--${answered.wasCorrect ? "correct" : "wrong"}`;
4362
- return /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlrrow", children: [
4363
- /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpair", children: [
4364
- /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpc", children: [
4365
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-name", children: pair?.playerAName ?? "?" }),
4366
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-val", children: pair?.playerAValue })
4367
- ] }),
4368
- /* @__PURE__ */ jsxs50("div", { className: "ss-w-hlpc ss-w-hlpc--b", children: [
4369
- /* @__PURE__ */ jsx56("div", { className: "ss-w-hlpc-name", children: pair?.playerBName ?? "?" }),
4370
- /* @__PURE__ */ jsx56("div", { className: vCls, children: answered.playerBValue }),
4371
- /* @__PURE__ */ jsx56("div", { className: badgeCls, children: answered.wasCorrect ? "\u2713" : "\u2717" })
4372
- ] })
4373
- ] }),
4374
- /* @__PURE__ */ jsx56(AnsweredRow, { answered, pair })
4375
- ] }, answered.pairIndex);
4421
+ return /* @__PURE__ */ jsxs50(
4422
+ "div",
4423
+ {
4424
+ className: `ss-w-hlrrow ss-w-hlrrow--${answered.wasCorrect ? "correct" : "wrong"}`,
4425
+ children: [
4426
+ /* @__PURE__ */ jsxs50("span", { className: "ss-w-hlrrow-names", children: [
4427
+ pair?.playerAName ?? "?",
4428
+ " ",
4429
+ /* @__PURE__ */ jsx56("b", { className: "ss-w-hlrrow-val", children: pair?.playerAValue }),
4430
+ " vs ",
4431
+ pair?.playerBName ?? "?",
4432
+ " ",
4433
+ /* @__PURE__ */ jsx56("b", { className: "ss-w-hlrrow-val", children: answered.playerBValue })
4434
+ ] }),
4435
+ /* @__PURE__ */ jsx56("span", { className: "ss-w-hlrrow-pick", children: answered.pick }),
4436
+ /* @__PURE__ */ jsx56("span", { className: "ss-w-hlrrow-icon", children: answered.wasCorrect ? "\u2713" : "\u2717" })
4437
+ ]
4438
+ },
4439
+ answered.pairIndex
4440
+ );
4376
4441
  }) })
4377
4442
  ] })
4378
4443
  ] });
4379
4444
  }
4380
4445
 
4381
4446
  // src/components/games/CareerPathGame.tsx
4382
- import { useState as useState24, useId as useId3 } from "react";
4383
- import { Fragment as Fragment11, jsx as jsx57, jsxs as jsxs51 } from "react/jsx-runtime";
4447
+ import { useState as useState24, useId as useId3, Fragment as Fragment11 } from "react";
4448
+ import { Fragment as Fragment12, jsx as jsx57, jsxs as jsxs51 } from "react/jsx-runtime";
4384
4449
  function parseClientState3(json) {
4385
4450
  if (!json) return null;
4386
4451
  try {
@@ -4389,29 +4454,19 @@ function parseClientState3(json) {
4389
4454
  return null;
4390
4455
  }
4391
4456
  }
4392
- function SpellYear({ spell }) {
4457
+ function spellYears(spell) {
4393
4458
  const parts = [];
4394
4459
  if (spell.startYear) parts.push(String(spell.startYear));
4395
4460
  if (spell.endYear) parts.push(String(spell.endYear));
4396
- if (parts.length === 0) return null;
4397
- return /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-spell-yr", children: parts.join(" \u2013 ") });
4461
+ return parts.join("\u2013");
4398
4462
  }
4399
4463
  function ClubSpellCard({ spell }) {
4464
+ const years = spellYears(spell);
4400
4465
  return /* @__PURE__ */ jsxs51("div", { className: `ss-w-cpath-club${spell.isLoan ? " ss-w-cpath-club--loan" : ""}`, children: [
4401
- spell.crestUrl ? /* @__PURE__ */ jsx57(
4402
- "img",
4403
- {
4404
- src: spell.crestUrl,
4405
- alt: spell.clubName,
4406
- className: "ss-w-cpath-crest",
4407
- loading: "lazy"
4408
- }
4409
- ) : /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-crest ss-w-cpath-crest--fallback", "aria-hidden": "true" }),
4410
- /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-club-info", children: [
4411
- /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-club-name", children: spell.clubName }),
4412
- /* @__PURE__ */ jsx57(SpellYear, { spell }),
4413
- spell.isLoan && /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-loan-badge", children: "Loan" })
4414
- ] })
4466
+ spell.crestUrl ? /* @__PURE__ */ jsx57("img", { src: spell.crestUrl, alt: "", className: "ss-w-cpath-crest", loading: "lazy" }) : /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-crest ss-w-cpath-crest--fallback", "aria-hidden": "true", children: spell.clubName.slice(0, 3).toUpperCase() }),
4467
+ /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-club-name", children: spell.clubName }),
4468
+ years && /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-spell-yr", children: years }),
4469
+ spell.isLoan && /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-loan-badge", children: "Loan" })
4415
4470
  ] });
4416
4471
  }
4417
4472
  function CareerPathGame({
@@ -4423,11 +4478,11 @@ function CareerPathGame({
4423
4478
  const [query, setQuery] = useState24("");
4424
4479
  const inputId = useId3();
4425
4480
  const clientState = parseClientState3(result?.clientStateJson);
4426
- const alreadyGuessedIds = new Set(
4427
- clientState?.guessResults.map((g) => g.playerId) ?? []
4428
- );
4481
+ const alreadyGuessedIds = new Set(clientState?.guessResults.map((g) => g.playerId) ?? []);
4429
4482
  const isOver = result?.alreadyPlayed === true || clientState?.solved === true || clientState?.failed === true;
4430
4483
  const visiblePath = clientState?.visiblePath ?? config?.initialPath ?? [];
4484
+ const totalClubs = clientState?.totalClubs ?? config?.totalClubs ?? visiblePath.length;
4485
+ const hiddenCount = Math.max(0, totalClubs - visiblePath.length);
4431
4486
  const filtered = config && !isOver ? config.typeaheadPool.filter(
4432
4487
  (p) => !alreadyGuessedIds.has(p.id) && p.name.toLowerCase().includes(query.toLowerCase())
4433
4488
  ) : [];
@@ -4440,25 +4495,34 @@ function CareerPathGame({
4440
4495
  }
4441
4496
  return /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath", "data-testid": "game-screen-career-path", children: [
4442
4497
  !config && /* @__PURE__ */ jsx57("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
4443
- config && /* @__PURE__ */ jsxs51(Fragment11, { children: [
4444
- /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-ctx", children: [
4445
- /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-ctx-label", children: "Career clubs" }),
4446
- /* @__PURE__ */ jsxs51("span", { className: "ss-w-cpath-ctx-count", children: [
4447
- config.totalClubs,
4448
- " clubs total"
4498
+ config && /* @__PURE__ */ jsxs51(Fragment12, { children: [
4499
+ /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-head", children: [
4500
+ /* @__PURE__ */ jsxs51("div", { children: [
4501
+ /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-title", children: "Career Path" }),
4502
+ /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-sub", children: "Which player had this career?" })
4503
+ ] }),
4504
+ clientState && !isOver && /* @__PURE__ */ jsxs51("span", { className: "ss-w-cpath-left", children: [
4505
+ clientState.guessesRemaining,
4506
+ " left"
4449
4507
  ] })
4450
4508
  ] }),
4451
- /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-path", children: [
4452
- visiblePath.map((spell, i) => /* @__PURE__ */ jsx57(ClubSpellCard, { spell }, `${spell.clubName}-${i}`)),
4453
- (clientState?.totalClubs ?? config.totalClubs) > visiblePath.length && /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-hidden", children: [
4454
- "+",
4455
- (clientState?.totalClubs ?? config.totalClubs) - visiblePath.length,
4456
- " more clubs hidden"
4509
+ /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-seq", children: [
4510
+ visiblePath.map((spell, i) => /* @__PURE__ */ jsxs51(Fragment11, { children: [
4511
+ i > 0 && /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-arrow", "aria-hidden": "true", children: "\u2192" }),
4512
+ /* @__PURE__ */ jsx57(ClubSpellCard, { spell })
4513
+ ] }, `${spell.clubName}-${i}`)),
4514
+ hiddenCount > 0 && /* @__PURE__ */ jsxs51(Fragment12, { children: [
4515
+ /* @__PURE__ */ jsx57("span", { className: "ss-w-cpath-arrow", "aria-hidden": "true", children: "\u2192" }),
4516
+ /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-hidden", children: [
4517
+ "+",
4518
+ hiddenCount,
4519
+ " more"
4520
+ ] })
4457
4521
  ] })
4458
4522
  ] }),
4459
- isOver && clientState && /* @__PURE__ */ jsxs51("div", { className: `ss-w-cpath-banner ss-w-cpath-banner--${clientState.solved ? "solved" : "failed"}`, children: [
4460
- /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-banner-label", children: clientState.solved ? "Career traced!" : "Better luck tomorrow" }),
4461
- clientState.revealedPlayerName && /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-banner-name", children: clientState.revealedPlayerName })
4523
+ clientState?.hintLine && !isOver && /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-hint", children: [
4524
+ "\u{1F4A1} ",
4525
+ clientState.hintLine
4462
4526
  ] }),
4463
4527
  !isOver && /* @__PURE__ */ jsxs51("div", { className: "ss-w-gtta", children: [
4464
4528
  /* @__PURE__ */ jsx57(
@@ -4468,7 +4532,7 @@ function CareerPathGame({
4468
4532
  type: "text",
4469
4533
  role: "textbox",
4470
4534
  className: "ss-w-gtta-i",
4471
- placeholder: "Search players\u2026",
4535
+ placeholder: "Name the player\u2026",
4472
4536
  value: query,
4473
4537
  disabled: submitting || isOver,
4474
4538
  onChange: (e) => setQuery(e.target.value),
@@ -4493,12 +4557,15 @@ function CareerPathGame({
4493
4557
  p.id
4494
4558
  )) })
4495
4559
  ] }),
4496
- clientState?.hintLine && !isOver && /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-hint", children: clientState.hintLine }),
4497
- !isOver && clientState && /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-hint", children: [
4498
- clientState.guessesRemaining,
4499
- " guess",
4500
- clientState.guessesRemaining !== 1 ? "es" : "",
4501
- " remaining"
4560
+ isOver && clientState && /* @__PURE__ */ jsxs51("div", { className: `ss-w-cpath-banner ss-w-cpath-banner--${clientState.solved ? "solved" : "failed"}`, children: [
4561
+ /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-banner-label", children: clientState.solved ? "\u2705 Career traced!" : "\u{1F614} Out of guesses" }),
4562
+ clientState.revealedPlayerName && /* @__PURE__ */ jsx57("div", { className: "ss-w-cpath-banner-name", children: clientState.revealedPlayerName }),
4563
+ /* @__PURE__ */ jsxs51("div", { className: "ss-w-cpath-banner-sub", children: [
4564
+ clientState.guessesUsed,
4565
+ " guess",
4566
+ clientState.guessesUsed === 1 ? "" : "es",
4567
+ " \xB7 come back tomorrow"
4568
+ ] })
4502
4569
  ] })
4503
4570
  ] })
4504
4571
  ] });
@@ -4506,7 +4573,7 @@ function CareerPathGame({
4506
4573
 
4507
4574
  // src/components/games/BeatTheGridGame.tsx
4508
4575
  import React, { useState as useState25, useId as useId4 } from "react";
4509
- import { Fragment as Fragment12, jsx as jsx58, jsxs as jsxs52 } from "react/jsx-runtime";
4576
+ import { Fragment as Fragment13, jsx as jsx58, jsxs as jsxs52 } from "react/jsx-runtime";
4510
4577
  function parseClientState4(json) {
4511
4578
  if (!json) return null;
4512
4579
  try {
@@ -4552,7 +4619,7 @@ function SearchSheet({
4552
4619
  }
4553
4620
  )
4554
4621
  ] }),
4555
- /* @__PURE__ */ jsxs52("div", { className: "ss-w-gtta", children: [
4622
+ playerPool.length === 0 ? /* @__PURE__ */ jsx58("div", { className: "ss-w-btg-sheet-empty", children: "No players available to search yet." }) : /* @__PURE__ */ jsxs52("div", { className: "ss-w-gtta", children: [
4556
4623
  /* @__PURE__ */ jsx58(
4557
4624
  "input",
4558
4625
  {
@@ -4617,18 +4684,23 @@ function BeatTheGridGame({
4617
4684
  const rows = config.rows;
4618
4685
  const cols = config.cols;
4619
4686
  return /* @__PURE__ */ jsxs52("div", { className: "ss-w-btg", "data-testid": "game-screen-beat-the-grid", children: [
4620
- /* @__PURE__ */ jsxs52("div", { className: "ss-w-btg-ctx", children: [
4621
- /* @__PURE__ */ jsxs52("span", { className: "ss-w-btg-ctx-score", children: [
4622
- "Score: ",
4623
- clientState?.totalScore ?? 0
4687
+ /* @__PURE__ */ jsxs52("div", { className: "ss-w-btg-head", children: [
4688
+ /* @__PURE__ */ jsxs52("div", { children: [
4689
+ /* @__PURE__ */ jsx58("div", { className: "ss-w-btg-title", children: "Beat the Grid" }),
4690
+ /* @__PURE__ */ jsx58("div", { className: "ss-w-btg-sub", children: "Fill each cell with a player who fits" })
4624
4691
  ] }),
4625
- !isLocked2 && /* @__PURE__ */ jsxs52("span", { className: "ss-w-btg-ctx-left", children: [
4626
- config.maxGuesses - filledCells.length,
4627
- " cell",
4628
- config.maxGuesses - filledCells.length !== 1 ? "s" : "",
4629
- " left"
4630
- ] }),
4631
- isLocked2 && /* @__PURE__ */ jsx58("span", { className: "ss-w-btg-ctx-done", children: "Complete" })
4692
+ /* @__PURE__ */ jsxs52("div", { className: "ss-w-btg-ctx", children: [
4693
+ /* @__PURE__ */ jsxs52("span", { className: "ss-w-btg-ctx-score", children: [
4694
+ clientState?.totalScore ?? 0,
4695
+ " pts"
4696
+ ] }),
4697
+ !isLocked2 && /* @__PURE__ */ jsxs52("span", { className: "ss-w-btg-ctx-left", children: [
4698
+ config.maxGuesses - filledCells.length,
4699
+ " cell",
4700
+ config.maxGuesses - filledCells.length !== 1 ? "s" : "",
4701
+ " left"
4702
+ ] })
4703
+ ] })
4632
4704
  ] }),
4633
4705
  /* @__PURE__ */ jsxs52(
4634
4706
  "div",
@@ -4657,7 +4729,7 @@ function BeatTheGridGame({
4657
4729
  ].filter(Boolean).join(" "),
4658
4730
  disabled: isLocked2 || submitting,
4659
4731
  onClick: () => handleCellClick(rowIdx, colIdx),
4660
- children: filled ? /* @__PURE__ */ jsxs52(Fragment12, { children: [
4732
+ children: filled ? /* @__PURE__ */ jsxs52(Fragment13, { children: [
4661
4733
  /* @__PURE__ */ jsx58("span", { className: "ss-w-btg-cell-score", children: filled.rarityScore }),
4662
4734
  filled.isCorrect && /* @__PURE__ */ jsx58("span", { className: "ss-w-btg-cell-check", "aria-hidden": "true", children: "\u2713" })
4663
4735
  ] }) : /* @__PURE__ */ jsx58("span", { className: "ss-w-btg-cell-empty", "aria-hidden": "true", children: "+" })
@@ -4669,6 +4741,16 @@ function BeatTheGridGame({
4669
4741
  ]
4670
4742
  }
4671
4743
  ),
4744
+ isLocked2 && /* @__PURE__ */ jsxs52("div", { className: "ss-w-btg-done", children: [
4745
+ /* @__PURE__ */ jsx58("div", { className: "ss-w-btg-done-label", children: "\u{1F532} Grid complete" }),
4746
+ /* @__PURE__ */ jsx58("div", { className: "ss-w-btg-done-score", children: clientState?.totalScore ?? 0 }),
4747
+ /* @__PURE__ */ jsxs52("div", { className: "ss-w-btg-done-sub", children: [
4748
+ filledCells.filter((c) => c.isCorrect).length,
4749
+ "/",
4750
+ filledCells.length,
4751
+ " correct \xB7 come back tomorrow"
4752
+ ] })
4753
+ ] }),
4672
4754
  activeCell !== null && /* @__PURE__ */ jsx58(
4673
4755
  SearchSheet,
4674
4756
  {
@@ -4686,7 +4768,7 @@ function BeatTheGridGame({
4686
4768
  }
4687
4769
 
4688
4770
  // src/components/games/GuessTheXiGame.tsx
4689
- import { Fragment as Fragment13, jsx as jsx59, jsxs as jsxs53 } from "react/jsx-runtime";
4771
+ import { Fragment as Fragment14, jsx as jsx59, jsxs as jsxs53 } from "react/jsx-runtime";
4690
4772
  function parseClientState5(json) {
4691
4773
  if (!json) return null;
4692
4774
  try {
@@ -4709,6 +4791,7 @@ function GuessTheXiGame({
4709
4791
  }) {
4710
4792
  const clientState = parseClientState5(result?.clientStateJson);
4711
4793
  const isOver = result?.alreadyPlayed === true || clientState?.status === "solved" || clientState?.status === "failed";
4794
+ const solved = clientState?.status === "solved";
4712
4795
  function handlePick(teamId) {
4713
4796
  if (!config || isOver || submitting) return;
4714
4797
  const prevGuesses = clientState?.guessHistory.map((g) => ({ teamId: g.teamId })) ?? [];
@@ -4717,15 +4800,24 @@ function GuessTheXiGame({
4717
4800
  }
4718
4801
  return /* @__PURE__ */ jsxs53("div", { className: "ss-w-gxi", "data-testid": "game-screen-guess-the-xi", children: [
4719
4802
  !config && /* @__PURE__ */ jsx59("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
4720
- config && /* @__PURE__ */ jsxs53(Fragment13, { children: [
4721
- /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-ctx", children: /* @__PURE__ */ jsx59("span", { className: "ss-w-gxi-ctx-label", children: config.poolLabel }) }),
4722
- config.positions.length > 0 && /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-pitch", children: config.positions.map((pos) => /* @__PURE__ */ jsxs53("div", { className: "ss-w-gxi-pslot", children: [
4803
+ config && /* @__PURE__ */ jsxs53(Fragment14, { children: [
4804
+ /* @__PURE__ */ jsxs53("div", { className: "ss-w-gxi-head", children: [
4805
+ /* @__PURE__ */ jsxs53("div", { children: [
4806
+ /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-title", children: "Guess the XI" }),
4807
+ /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-sub", children: config.poolLabel })
4808
+ ] }),
4809
+ clientState && !isOver && /* @__PURE__ */ jsxs53("span", { className: "ss-w-gxi-left", children: [
4810
+ "Guess ",
4811
+ clientState.guessesUsed + 1,
4812
+ "/6"
4813
+ ] })
4814
+ ] }),
4815
+ config.positions.length > 0 && /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-pitch", children: config.positions.map((pos, i) => /* @__PURE__ */ jsxs53("div", { className: "ss-w-gxi-pslot", children: [
4723
4816
  /* @__PURE__ */ jsx59("span", { className: "ss-w-gxi-pslot-pos", children: pos.slot }),
4724
4817
  /* @__PURE__ */ jsx59("span", { className: "ss-w-gxi-pslot-nat", children: pos.nationality })
4725
- ] }, pos.slot)) }),
4818
+ ] }, `${pos.slot}-${i}`)) }),
4726
4819
  clientState && clientState.earnedReveals.length > 0 && /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-reveals", children: clientState.earnedReveals.map((r, i) => /* @__PURE__ */ jsx59(RevealCard, { reveal: r }, i)) }),
4727
- isOver && clientState && /* @__PURE__ */ jsx59("div", { className: `ss-w-gxi-banner ss-w-gxi-banner--${clientState.status}`, children: /* @__PURE__ */ jsx59("span", { className: "ss-w-gxi-banner-label", children: clientState.status === "solved" ? `Solved! ${clientState.score} pts` : "Better luck tomorrow" }) }),
4728
- /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-pool", children: config.teamPool.map((team) => {
4820
+ !isOver ? /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-pool", children: config.teamPool.map((team) => {
4729
4821
  const guessRecord = clientState?.guessHistory.find((g) => g.teamId === team.teamId);
4730
4822
  return /* @__PURE__ */ jsx59(
4731
4823
  "button",
@@ -4735,17 +4827,21 @@ function GuessTheXiGame({
4735
4827
  "ss-w-gxi-team-btn",
4736
4828
  guessRecord ? guessRecord.wasCorrect ? "ss-w-gxi-team-btn--correct" : "ss-w-gxi-team-btn--wrong" : ""
4737
4829
  ].filter(Boolean).join(" "),
4738
- disabled: isOver || submitting,
4830
+ disabled: submitting,
4739
4831
  onClick: () => handlePick(team.teamId),
4740
4832
  children: team.teamName
4741
4833
  },
4742
4834
  team.teamId
4743
4835
  );
4744
- }) }),
4745
- !isOver && clientState && /* @__PURE__ */ jsxs53("div", { className: "ss-w-gxi-hint", children: [
4746
- "Guess ",
4747
- clientState.guessesUsed + 1,
4748
- " of 6"
4836
+ }) }) : clientState && /* @__PURE__ */ jsxs53("div", { className: `ss-w-gxi-banner ss-w-gxi-banner--${solved ? "solved" : "failed"}`, children: [
4837
+ /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-banner-label", children: solved ? "\u2705 Solved!" : "\u{1F614} Out of guesses" }),
4838
+ /* @__PURE__ */ jsx59("div", { className: "ss-w-gxi-banner-score", children: clientState.score }),
4839
+ /* @__PURE__ */ jsxs53("div", { className: "ss-w-gxi-banner-sub", children: [
4840
+ clientState.guessesUsed,
4841
+ " guess",
4842
+ clientState.guessesUsed === 1 ? "" : "es",
4843
+ " \xB7 come back tomorrow"
4844
+ ] })
4749
4845
  ] })
4750
4846
  ] })
4751
4847
  ] });
@@ -4753,7 +4849,7 @@ function GuessTheXiGame({
4753
4849
 
4754
4850
  // src/components/games/DailyQuizGame.tsx
4755
4851
  import { useState as useState26 } from "react";
4756
- import { Fragment as Fragment14, jsx as jsx60, jsxs as jsxs54 } from "react/jsx-runtime";
4852
+ import { Fragment as Fragment15, jsx as jsx60, jsxs as jsxs54 } from "react/jsx-runtime";
4757
4853
  function parseClientState6(json) {
4758
4854
  if (!json) return null;
4759
4855
  try {
@@ -4789,7 +4885,7 @@ function DailyQuizGame({
4789
4885
  }
4790
4886
  return /* @__PURE__ */ jsxs54("div", { className: "ss-w-dq", "data-testid": "game-screen-daily-quiz", children: [
4791
4887
  !config && /* @__PURE__ */ jsx60("div", { className: "ss-w-gscreen-body", children: "Loading\u2026" }),
4792
- config && /* @__PURE__ */ jsxs54(Fragment14, { children: [
4888
+ config && /* @__PURE__ */ jsxs54(Fragment15, { children: [
4793
4889
  isRevealed && result?.score != null && /* @__PURE__ */ jsxs54("div", { className: "ss-w-dq-score", children: [
4794
4890
  /* @__PURE__ */ jsx60("span", { className: "ss-w-dq-score-val", children: result.score }),
4795
4891
  /* @__PURE__ */ jsx60("span", { className: "ss-w-dq-score-label", children: "pts" })
@@ -5501,18 +5597,58 @@ function LeaderboardAllTimeRow({
5501
5597
  ] });
5502
5598
  }
5503
5599
 
5504
- // src/components/Leaderboard.tsx
5600
+ // src/components/LeaderboardEmpty.tsx
5505
5601
  import { jsx as jsx68, jsxs as jsxs61 } from "react/jsx-runtime";
5602
+ function LeaderboardEmpty({
5603
+ segment,
5604
+ lastWeek,
5605
+ weeklyPrize,
5606
+ onPlay,
5607
+ ui
5608
+ }) {
5609
+ if (segment === "alltime") {
5610
+ return /* @__PURE__ */ jsxs61("div", { className: "ss-w-lb-empty ss-w-lb-empty--alltime", children: [
5611
+ /* @__PURE__ */ jsx68("div", { className: "ss-w-lb-empty-icon", "aria-hidden": "true", children: "\u{1F4CA}" }),
5612
+ /* @__PURE__ */ jsx68("p", { className: "ss-w-lb-empty-body", children: ui.leaderboardAllTimeEmpty })
5613
+ ] });
5614
+ }
5615
+ const fresh = lastWeek != null;
5616
+ const title = fresh ? ui.leaderboardEmptyFreshTitle : ui.leaderboardEmptyColdTitle;
5617
+ const body = fresh ? ui.leaderboardEmptyFreshBody : ui.leaderboardEmptyColdBody;
5618
+ return /* @__PURE__ */ jsxs61("div", { className: "ss-w-lb-empty", children: [
5619
+ weeklyPrize && /* @__PURE__ */ jsxs61("div", { className: "ss-w-prize", children: [
5620
+ /* @__PURE__ */ jsx68("span", { className: "ss-w-prize-icon", "aria-hidden": "true", children: "\u{1F3C6}" }),
5621
+ /* @__PURE__ */ jsx68("div", { className: "ss-w-prize-body", children: /* @__PURE__ */ jsx68("span", { className: "ss-w-prize-text", children: weeklyPrize }) })
5622
+ ] }),
5623
+ /* @__PURE__ */ jsxs61("div", { className: "ss-w-lb-empty-hero", children: [
5624
+ /* @__PURE__ */ jsx68("div", { className: "ss-w-lb-empty-icon", "aria-hidden": "true", children: fresh ? "\u{1F3C6}" : "\u{1F3AE}" }),
5625
+ /* @__PURE__ */ jsx68("h4", { className: "ss-w-lb-empty-title", children: title }),
5626
+ /* @__PURE__ */ jsx68("p", { className: "ss-w-lb-empty-body", children: body }),
5627
+ onPlay && /* @__PURE__ */ jsx68("button", { type: "button", className: "ss-w-lb-empty-cta", onClick: onPlay, children: ui.leaderboardEmptyCta })
5628
+ ] }),
5629
+ fresh && lastWeek && /* @__PURE__ */ jsxs61("div", { className: "ss-w-lb-last", children: [
5630
+ /* @__PURE__ */ jsx68("span", { className: "ss-w-lb-last-label", children: ui.leaderboardLastWeekLabel }),
5631
+ /* @__PURE__ */ jsx68("span", { className: "ss-w-lb-last-champ", "aria-hidden": "true", children: "\u{1F947}" }),
5632
+ /* @__PURE__ */ jsx68("span", { className: "ss-w-lb-last-handle", children: lastWeek.handle }),
5633
+ /* @__PURE__ */ jsx68("span", { className: "ss-w-lb-last-points", children: formatPoints(lastWeek.points) })
5634
+ ] })
5635
+ ] });
5636
+ }
5637
+
5638
+ // src/components/Leaderboard.tsx
5639
+ import { Fragment as Fragment16, jsx as jsx69, jsxs as jsxs62 } from "react/jsx-runtime";
5506
5640
  function Leaderboard({
5507
5641
  data,
5508
- ui
5642
+ ui,
5643
+ onPlay
5509
5644
  }) {
5510
5645
  const [segment, setSegment] = useState31("weekly");
5511
5646
  const myRow = segment === "weekly" ? data.myWeeklyRow : data.myAllTimeRow;
5512
5647
  const offBoard = myRow !== null && myRow !== void 0 && myRow.rank === -1;
5513
- return /* @__PURE__ */ jsxs61("div", { className: "ss-w-lb2", children: [
5514
- /* @__PURE__ */ jsxs61("div", { className: "ss-w-seg", children: [
5515
- /* @__PURE__ */ jsx68(
5648
+ const isEmpty = segment === "weekly" ? data.weeklyTop.length === 0 : data.allTimeTop.length === 0;
5649
+ return /* @__PURE__ */ jsxs62("div", { className: "ss-w-lb2", children: [
5650
+ /* @__PURE__ */ jsxs62("div", { className: "ss-w-seg", children: [
5651
+ /* @__PURE__ */ jsx69(
5516
5652
  "button",
5517
5653
  {
5518
5654
  type: "button",
@@ -5522,7 +5658,7 @@ function Leaderboard({
5522
5658
  children: ui.leaderboardThisWeek
5523
5659
  }
5524
5660
  ),
5525
- /* @__PURE__ */ jsx68(
5661
+ /* @__PURE__ */ jsx69(
5526
5662
  "button",
5527
5663
  {
5528
5664
  type: "button",
@@ -5533,40 +5669,60 @@ function Leaderboard({
5533
5669
  }
5534
5670
  )
5535
5671
  ] }),
5536
- /* @__PURE__ */ jsx68("div", { className: "ss-w-lb2-rows", children: segment === "weekly" ? data.weeklyTop.map((row) => /* @__PURE__ */ jsx68(
5537
- LeaderboardWeeklyRow,
5538
- {
5539
- row,
5540
- isMe: row.operatorUserId === data.myWeeklyRow?.operatorUserId
5541
- },
5542
- row.operatorUserId
5543
- )) : data.allTimeTop.map((row) => /* @__PURE__ */ jsx68(
5544
- LeaderboardAllTimeRow,
5672
+ isEmpty ? /* @__PURE__ */ jsx69(
5673
+ LeaderboardEmpty,
5545
5674
  {
5546
- row,
5547
- isMe: row.operatorUserId === data.myAllTimeRow?.operatorUserId
5548
- },
5549
- row.operatorUserId
5550
- )) }),
5551
- /* @__PURE__ */ jsx68("div", { className: "ss-w-kitline", children: "\u{1F3BD}" }),
5552
- myRow != null && (offBoard ? /* @__PURE__ */ jsx68("div", { className: "ss-w-lbgap", children: ui.leaderboardOffBoard }) : /* @__PURE__ */ jsxs61("div", { className: "ss-w-lb2-rows", children: [
5553
- segment === "weekly" && data.myWeeklyRow && /* @__PURE__ */ jsx68(LeaderboardWeeklyRow, { row: data.myWeeklyRow, isMe: true }),
5554
- segment === "alltime" && data.myAllTimeRow && /* @__PURE__ */ jsx68(LeaderboardAllTimeRow, { row: data.myAllTimeRow, isMe: true })
5555
- ] })),
5556
- segment === "alltime" && data.myAllTimeRow && !offBoard && /* @__PURE__ */ jsx68("div", { className: "ss-w-lb2-rows", children: /* @__PURE__ */ jsx68("div", { className: "ss-w-lb2-row", children: /* @__PURE__ */ jsx68("span", { className: "ss-w-lb2-handle", children: formatPoints(data.allTimeTop.reduce((s, r) => s + r.allTimePoints, 0)) }) }) })
5675
+ segment,
5676
+ lastWeek: data.lastWeek,
5677
+ weeklyPrize: data.weeklyPrize,
5678
+ onPlay,
5679
+ ui
5680
+ }
5681
+ ) : /* @__PURE__ */ jsxs62(Fragment16, { children: [
5682
+ /* @__PURE__ */ jsx69("div", { className: "ss-w-lb2-rows", children: segment === "weekly" ? data.weeklyTop.map((row) => /* @__PURE__ */ jsx69(
5683
+ LeaderboardWeeklyRow,
5684
+ {
5685
+ row,
5686
+ isMe: row.operatorUserId === data.myWeeklyRow?.operatorUserId
5687
+ },
5688
+ row.operatorUserId
5689
+ )) : data.allTimeTop.map((row) => /* @__PURE__ */ jsx69(
5690
+ LeaderboardAllTimeRow,
5691
+ {
5692
+ row,
5693
+ isMe: row.operatorUserId === data.myAllTimeRow?.operatorUserId
5694
+ },
5695
+ row.operatorUserId
5696
+ )) }),
5697
+ /* @__PURE__ */ jsx69("div", { className: "ss-w-kitline", children: "\u{1F3BD}" }),
5698
+ myRow != null && (offBoard ? /* @__PURE__ */ jsx69("div", { className: "ss-w-lbgap", children: ui.leaderboardOffBoard }) : /* @__PURE__ */ jsxs62("div", { className: "ss-w-lb2-rows", children: [
5699
+ segment === "weekly" && data.myWeeklyRow && /* @__PURE__ */ jsx69(LeaderboardWeeklyRow, { row: data.myWeeklyRow, isMe: true }),
5700
+ segment === "alltime" && data.myAllTimeRow && /* @__PURE__ */ jsx69(LeaderboardAllTimeRow, { row: data.myAllTimeRow, isMe: true })
5701
+ ] })),
5702
+ segment === "alltime" && data.myAllTimeRow && !offBoard && /* @__PURE__ */ jsx69("div", { className: "ss-w-lb2-rows", children: /* @__PURE__ */ jsx69("div", { className: "ss-w-lb2-row", children: /* @__PURE__ */ jsx69("span", { className: "ss-w-lb2-handle", children: formatPoints(data.allTimeTop.reduce((s, r) => s + r.allTimePoints, 0)) }) }) })
5703
+ ] })
5557
5704
  ] });
5558
5705
  }
5559
5706
 
5560
5707
  // src/components/LeaderboardPanel.tsx
5561
- import { jsx as jsx69 } from "react/jsx-runtime";
5562
- function LeaderboardPanel({ loggedIn, data, ui }) {
5563
- if (!loggedIn) return /* @__PURE__ */ jsx69(GamesLoginWall, { ui });
5564
- if (data === null) return /* @__PURE__ */ jsx69("div", { className: "ss-w-mon-list" });
5565
- return /* @__PURE__ */ jsx69("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ jsx69(Leaderboard, { data, ui }) });
5708
+ import { jsx as jsx70 } from "react/jsx-runtime";
5709
+ var EMPTY_PAYLOAD = {
5710
+ week: "",
5711
+ weeklyTop: [],
5712
+ myWeeklyRow: null,
5713
+ allTimeTop: [],
5714
+ myAllTimeRow: null,
5715
+ weeklyPrize: null,
5716
+ lastWeek: null
5717
+ };
5718
+ function LeaderboardPanel({ loggedIn, data, loading, onPlay, ui }) {
5719
+ if (!loggedIn) return /* @__PURE__ */ jsx70(GamesLoginWall, { ui });
5720
+ if (data === null && loading) return /* @__PURE__ */ jsx70("div", { className: "ss-w-mon-list" });
5721
+ return /* @__PURE__ */ jsx70("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ jsx70(Leaderboard, { data: data ?? EMPTY_PAYLOAD, ui, onPlay }) });
5566
5722
  }
5567
5723
 
5568
5724
  // src/components/ChatPanel.tsx
5569
- import { jsx as jsx70, jsxs as jsxs62 } from "react/jsx-runtime";
5725
+ import { jsx as jsx71, jsxs as jsxs63 } from "react/jsx-runtime";
5570
5726
  var FULLSCREEN_QUERY = "(max-width: 639px)";
5571
5727
  function useIsModal() {
5572
5728
  const [modal, setModal] = useState32(false);
@@ -5597,8 +5753,8 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
5597
5753
  useEffect14(() => {
5598
5754
  if (monitor && monitor.activeTab !== "chat" && state.isStreaming) monitor.markChatActivity();
5599
5755
  }, [monitor, state.isStreaming, state.messages.length]);
5600
- return /* @__PURE__ */ jsxs62("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
5601
- /* @__PURE__ */ jsx70(
5756
+ return /* @__PURE__ */ jsxs63("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
5757
+ /* @__PURE__ */ jsx71(
5602
5758
  ChatHeader,
5603
5759
  {
5604
5760
  onClose: close,
@@ -5611,7 +5767,7 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
5611
5767
  moreOptionsLabel: ui.moreOptions
5612
5768
  }
5613
5769
  ),
5614
- monitor && /* @__PURE__ */ jsx70(
5770
+ monitor && /* @__PURE__ */ jsx71(
5615
5771
  TabBar,
5616
5772
  {
5617
5773
  monitor,
@@ -5623,19 +5779,28 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
5623
5779
  gamesEnabled: gamesResult?.enabled ?? false
5624
5780
  }
5625
5781
  ),
5626
- /* @__PURE__ */ jsx70(
5782
+ /* @__PURE__ */ jsx71(
5627
5783
  "div",
5628
5784
  {
5629
5785
  style: !monitor || monitor.activeTab === "chat" ? { display: "contents" } : { position: "absolute", inset: 0, visibility: "hidden", display: "flex", flexDirection: "column" },
5630
- children: /* @__PURE__ */ jsx70(MessageList, { controller, ui, slip, onDashboardTap, monitor })
5786
+ children: /* @__PURE__ */ jsx71(MessageList, { controller, ui, slip, onDashboardTap, monitor })
5631
5787
  }
5632
5788
  ),
5633
- monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ jsx70(TodayPanel, { discovery, ui, monitor }),
5634
- monitor && monitor.activeTab === "following" && /* @__PURE__ */ jsx70(MatchesPanel, { monitor, ui, slip }),
5635
- monitor && monitor.activeTab === "odds" && /* @__PURE__ */ jsx70(OddsPanel, { monitor, ui, slip }),
5636
- monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx70(GamesPanel, { loggedIn: !!loggedIn, games: gamesResult.games, ui, conversation }),
5637
- monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ jsx70(LeaderboardPanel, { loggedIn: !!loggedIn, data: leaderboardResult.data, ui }),
5638
- /* @__PURE__ */ jsx70(ChatInput, { placeholder: ui.placeholder, streaming: state.isStreaming, onSend: handleSend, onStop: stop, stopLabel: ui.stopResponse, sendLabel: ui.sendMessage })
5789
+ monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ jsx71(TodayPanel, { discovery, ui, monitor }),
5790
+ monitor && monitor.activeTab === "following" && /* @__PURE__ */ jsx71(MatchesPanel, { monitor, ui, slip }),
5791
+ monitor && monitor.activeTab === "odds" && /* @__PURE__ */ jsx71(OddsPanel, { monitor, ui, slip }),
5792
+ monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx71(GamesPanel, { loggedIn: !!loggedIn, games: gamesResult.games, ui, conversation }),
5793
+ monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ jsx71(
5794
+ LeaderboardPanel,
5795
+ {
5796
+ loggedIn: !!loggedIn,
5797
+ data: leaderboardResult.data,
5798
+ loading: leaderboardResult.loading,
5799
+ onPlay: () => monitor.setActiveTab("games"),
5800
+ ui
5801
+ }
5802
+ ),
5803
+ /* @__PURE__ */ jsx71(ChatInput, { placeholder: ui.placeholder, streaming: state.isStreaming, onSend: handleSend, onStop: stop, stopLabel: ui.stopResponse, sendLabel: ui.sendMessage })
5639
5804
  ] });
5640
5805
  }
5641
5806
 
@@ -6589,6 +6754,20 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
6589
6754
  /* Off-board treatment: dashed pill indicating rank is outside top N */
6590
6755
  .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; }
6591
6756
 
6757
+ /* ---- Leaderboard empty / weekly-reset default state ---- */
6758
+ .ss-w-lb-empty { display: flex; flex-direction: column; gap: 12px; flex: 1; }
6759
+ .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)); }
6760
+ .ss-w-lb-empty--alltime { align-items: center; justify-content: center; text-align: center; padding: 24px 16px; }
6761
+ .ss-w-lb-empty-icon { font-size: 30px; line-height: 1; }
6762
+ .ss-w-lb-empty-title { margin: 2px 0 0; font-size: 16px; font-weight: 800; color: var(--ss-w-ink); }
6763
+ .ss-w-lb-empty-body { margin: 0; max-width: 30ch; font-size: 12.5px; line-height: 1.4; color: var(--ss-w-faint); }
6764
+ .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; }
6765
+ .ss-w-lb-empty-cta:hover { filter: brightness(1.04); }
6766
+ .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; }
6767
+ .ss-w-lb-last-label { text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--ss-w-faint); }
6768
+ .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; }
6769
+ .ss-w-lb-last-points { flex: none; font-weight: 750; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
6770
+
6592
6771
  /* ---- Mystery Tiger game screen (D3) ---- */
6593
6772
  .ss-w-gt { display: flex; flex-direction: column; gap: 10px; }
6594
6773
  /* Typeahead wrapper: relative so the dropdown can position under it */
@@ -6600,101 +6779,121 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
6600
6779
  .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); }
6601
6780
  .ss-w-gtta-opt:last-child { border-bottom: none; }
6602
6781
  .ss-w-gtta-opt:hover { background: var(--ss-w-bubble); }
6603
- /* Column header labels: one cell per attribute */
6604
- .ss-w-gthdr { display: grid; grid-template-columns: 1fr repeat(5, 36px); gap: 4px; padding: 0 2px; }
6605
- .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; }
6606
- .ss-w-gthdr-c--name { text-align: left; }
6607
- /* Guess rows */
6608
- .ss-w-gtrows { display: flex; flex-direction: column; gap: 4px; }
6609
- .ss-w-gtrow { display: grid; grid-template-columns: 1fr repeat(5, 36px); gap: 4px; align-items: center; }
6610
- .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; }
6611
- /* Verdict tiles */
6612
- .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; }
6613
- .ss-w-gtile--exact { background: var(--ss-w-correct); color: #fff; }
6614
- .ss-w-gtile--near { background: var(--ss-w-cta); color: var(--ss-w-cta-ink, #fff); }
6782
+ /* Header: title + sub + remaining chip */
6783
+ .ss-w-gt-head { display: flex; align-items: flex-start; gap: 8px; }
6784
+ .ss-w-gt-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
6785
+ .ss-w-gt-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
6786
+ .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; }
6787
+ /* Guess rows \u2014 one labelled block per guess */
6788
+ .ss-w-gtrows { display: flex; flex-direction: column; gap: 8px; }
6789
+ .ss-w-gtguess { display: flex; flex-direction: column; gap: 4px; }
6790
+ .ss-w-gtguess-nm { font-size: 11px; font-weight: 600; color: var(--ss-w-faint); }
6791
+ .ss-w-gtrow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
6792
+ /* Verdict tiles: label on top, verdict glyph below */
6793
+ .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; }
6794
+ .ss-w-gtile-lab { font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; opacity: .75; }
6795
+ .ss-w-gtile-v { font-size: 15px; font-weight: 800; line-height: 1; }
6796
+ .ss-w-gtile--exact { background: var(--ss-w-correct); color: #062611; }
6797
+ .ss-w-gtile--near { background: var(--ss-w-accent); color: #241700; }
6615
6798
  .ss-w-gtile--miss { background: var(--ss-w-bubble); color: var(--ss-w-faint); border: 1px solid var(--ss-w-line); }
6616
- .ss-w-gtile-dir { font-size: 11px; line-height: 1; }
6617
6799
  /* Hint line */
6618
- .ss-w-gt-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; padding: 2px 0; font-style: italic; }
6619
- /* Outcome banner: shown when solved or failed */
6620
- .ss-w-gt-banner { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 12px; border-radius: 12px; text-align: center; }
6800
+ .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)); }
6801
+ /* Terminal outcome banner */
6802
+ .ss-w-gt-banner { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; }
6621
6803
  .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)); }
6622
- .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); }
6623
- .ss-w-gt-banner-name { font-size: 16px; font-weight: 750; color: var(--ss-w-ink); }
6624
- .ss-w-gt-banner-label { font-size: 12px; color: var(--ss-w-faint); }
6804
+ .ss-w-gt-banner--failed { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
6805
+ .ss-w-gt-banner-name { font-size: 20px; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; color: var(--ss-w-accent); }
6806
+ .ss-w-gt-banner-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
6807
+ .ss-w-gt-banner-sub { font-size: 11px; color: var(--ss-w-faint); }
6625
6808
 
6626
- /* ---- Higher or Lower game screen (D3) ---- */
6809
+ /* ---- Higher or Lower game screen (D3) \u2014 artifact hl-pair/pcard/hlb layout ---- */
6627
6810
  .ss-w-hl { display: flex; flex-direction: column; gap: 12px; }
6628
- /* Stat context header: family name + season */
6629
- .ss-w-hlctx { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
6630
- .ss-w-hlctx-fam { font-size: 14px; font-weight: 750; color: var(--ss-w-ink); }
6631
- .ss-w-hlctx-szn { font-size: 11.5px; color: var(--ss-w-faint); font-weight: 500; }
6632
- /* Score chip */
6633
- .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; }
6634
- /* Pair card: two player cards + divider */
6635
- .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); }
6636
- /* Player card */
6637
- .ss-w-hlpc { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 10px; text-align: center; }
6638
- .ss-w-hlpc--b { border-left: 1px solid var(--ss-w-line); }
6639
- .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; }
6640
- .ss-w-hlpc-val { font-size: 22px; font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; line-height: 1; }
6641
- .ss-w-hlpc-val--hidden { color: var(--ss-w-faint); font-size: 26px; }
6642
- .ss-w-hlpc-val--correct { color: var(--ss-w-correct); }
6643
- .ss-w-hlpc-val--wrong { color: var(--ss-w-cta); }
6644
- .ss-w-hlpc-badge { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; border-radius: 999px; padding: 2px 8px; }
6645
- .ss-w-hlpc-badge--correct { color: #fff; background: var(--ss-w-correct); }
6646
- .ss-w-hlpc-badge--wrong { color: var(--ss-w-cta-ink, #fff); background: var(--ss-w-cta); }
6647
- /* Higher / Lower buttons */
6648
- .ss-w-hlbtns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
6649
- .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; }
6650
- .ss-w-hlbtn:hover:not(:disabled) { background: var(--ss-w-bubble); border-color: var(--ss-w-accent); color: var(--ss-w-accent); }
6811
+ /* Header: title + sub + streak chip */
6812
+ .ss-w-hl-head { display: flex; align-items: flex-start; gap: 8px; }
6813
+ .ss-w-hl-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
6814
+ .ss-w-hl-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
6815
+ .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; }
6816
+ /* Question line */
6817
+ .ss-w-hl-q { text-align: center; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-faint); }
6818
+ /* Pair: player A | Higher/Lower | player B */
6819
+ .ss-w-hlpair { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: stretch; }
6820
+ .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; }
6821
+ .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; }
6822
+ .ss-w-hlpc-name { font-size: 12.5px; font-weight: 700; color: var(--ss-w-ink); line-height: 1.15; }
6823
+ .ss-w-hlpc-stat { font-size: 8.5px; color: var(--ss-w-faint); text-transform: uppercase; letter-spacing: .04em; }
6824
+ .ss-w-hlpc-val { font-size: 30px; font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; line-height: 1; }
6825
+ .ss-w-hlpc-val--hidden { color: var(--ss-w-faint); }
6826
+ /* Higher / Lower \u2014 middle column */
6827
+ .ss-w-hlbtns { display: flex; flex-direction: column; gap: 6px; justify-content: center; }
6828
+ .ss-w-hl-or { text-align: center; font-size: 11px; font-weight: 700; color: var(--ss-w-faint); }
6829
+ .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; }
6830
+ .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)); }
6831
+ .ss-w-hlbtn--dn { background: var(--ss-w-panel); color: var(--ss-w-ink); }
6832
+ .ss-w-hlbtn:hover:not(:disabled) { border-color: var(--ss-w-accent); }
6651
6833
  .ss-w-hlbtn:disabled { opacity: .5; cursor: not-allowed; }
6652
- /* Answered pair result rows */
6653
- .ss-w-hlresults { display: flex; flex-direction: column; gap: 4px; }
6654
- .ss-w-hlrrow { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 8px; font-size: 12px; background: var(--ss-w-bubble); }
6655
- .ss-w-hlrrow--correct { background: color-mix(in srgb, var(--ss-w-correct) 8%, var(--ss-w-panel)); }
6834
+ /* Run-over terminal panel */
6835
+ .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; }
6836
+ .ss-w-hl-over-title { font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); }
6837
+ .ss-w-hl-over-score { font-size: 34px; font-weight: 800; color: var(--ss-w-accent); line-height: 1; font-variant-numeric: tabular-nums; }
6838
+ .ss-w-hl-over-sub { font-size: 11px; color: var(--ss-w-faint); }
6839
+ /* Answered history \u2014 clean single-line rows with the revealed value */
6840
+ .ss-w-hlresults { display: flex; flex-direction: column; gap: 5px; }
6841
+ .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); }
6842
+ .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)); }
6656
6843
  .ss-w-hlrrow--wrong { background: color-mix(in srgb, var(--ss-w-cta) 8%, var(--ss-w-panel)); }
6657
6844
  .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; }
6658
- .ss-w-hlrrow-pick { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--ss-w-faint); }
6845
+ .ss-w-hlrrow-val { font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; }
6846
+ .ss-w-hlrrow-pick { font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--ss-w-faint); flex: none; }
6659
6847
  .ss-w-hlrrow-icon { font-size: 14px; flex: none; }
6848
+ .ss-w-hlrrow--correct .ss-w-hlrrow-icon { color: var(--ss-w-correct); }
6849
+ .ss-w-hlrrow--wrong .ss-w-hlrrow-icon { color: var(--ss-w-cta); }
6660
6850
 
6661
- /* ---- Career Path game screen (D3) ---- */
6851
+ /* ---- Career Path game screen (D3) \u2014 artifact cpath/club/cto layout ---- */
6662
6852
  .ss-w-cpath { display: flex; flex-direction: column; gap: 12px; }
6663
- /* Context header */
6664
- .ss-w-cpath-ctx { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px; }
6665
- .ss-w-cpath-ctx-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ss-w-faint); }
6666
- .ss-w-cpath-ctx-count { font-size: 12px; font-weight: 600; color: var(--ss-w-accent); }
6667
- /* Career path: vertical timeline of club spells */
6668
- .ss-w-cpath-path { display: flex; flex-direction: column; gap: 4px; }
6669
- /* Single club card */
6670
- .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); }
6671
- .ss-w-cpath-club--loan { border-style: dashed; }
6672
- /* Crest image / fallback */
6673
- .ss-w-cpath-crest { width: 30px; height: 30px; object-fit: contain; flex: none; border-radius: 4px; }
6674
- .ss-w-cpath-crest--fallback { background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); border-radius: 4px; }
6675
- /* Club info: name + years */
6676
- .ss-w-cpath-club-info { display: flex; flex: 1; min-width: 0; align-items: center; gap: 6px; flex-wrap: wrap; }
6677
- .ss-w-cpath-club-name { font-size: 13px; font-weight: 650; color: var(--ss-w-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
6678
- .ss-w-cpath-spell-yr { font-size: 11px; color: var(--ss-w-faint); font-weight: 500; white-space: nowrap; }
6679
- .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; }
6680
- /* Hidden clubs indicator */
6681
- .ss-w-cpath-hidden { font-size: 11.5px; color: var(--ss-w-faint); font-style: italic; text-align: center; padding: 6px 0 2px; }
6853
+ /* Header */
6854
+ .ss-w-cpath-head { display: flex; align-items: flex-start; gap: 8px; }
6855
+ .ss-w-cpath-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
6856
+ .ss-w-cpath-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
6857
+ .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; }
6858
+ /* Career sequence \u2014 horizontal crests with arrows */
6859
+ .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; }
6860
+ .ss-w-cpath-arrow { align-self: center; color: var(--ss-w-faint); font-size: 13px; padding-top: 10px; }
6861
+ /* Single club \u2014 small vertical card */
6862
+ .ss-w-cpath-club { display: flex; flex-direction: column; align-items: center; gap: 3px; width: 58px; }
6863
+ .ss-w-cpath-crest { width: 34px; height: 34px; object-fit: contain; flex: none; border-radius: 8px; }
6864
+ .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); }
6865
+ .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; }
6866
+ .ss-w-cpath-spell-yr { font-size: 8px; color: var(--ss-w-faint); font-weight: 500; white-space: nowrap; }
6867
+ .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)); }
6868
+ .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)); }
6869
+ /* Hidden clubs chip */
6870
+ .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; }
6682
6871
  /* Hint line */
6683
- .ss-w-cpath-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; padding: 2px 0; font-style: italic; }
6684
- /* Outcome banner */
6685
- .ss-w-cpath-banner { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 12px; border-radius: 12px; text-align: center; }
6872
+ .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)); }
6873
+ /* Terminal outcome */
6874
+ .ss-w-cpath-banner { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; }
6686
6875
  .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)); }
6687
- .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); }
6688
- .ss-w-cpath-banner-name { font-size: 16px; font-weight: 750; color: var(--ss-w-ink); }
6689
- .ss-w-cpath-banner-label { font-size: 12px; color: var(--ss-w-faint); }
6876
+ .ss-w-cpath-banner--failed { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
6877
+ .ss-w-cpath-banner-name { font-size: 20px; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; color: var(--ss-w-accent); }
6878
+ .ss-w-cpath-banner-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
6879
+ .ss-w-cpath-banner-sub { font-size: 11px; color: var(--ss-w-faint); }
6690
6880
 
6691
- /* ---- Beat the Grid game screen (D3) ---- */
6881
+ /* ---- Beat the Grid game screen (D3) \u2014 artifact grid/gc layout ---- */
6692
6882
  .ss-w-btg { display: flex; flex-direction: column; gap: 10px; }
6693
- /* Score/context row */
6694
- .ss-w-btg-ctx { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
6695
- .ss-w-btg-ctx-score { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
6696
- .ss-w-btg-ctx-left { font-size: 12px; color: var(--ss-w-faint); font-weight: 500; }
6697
- .ss-w-btg-ctx-done { font-size: 12px; font-weight: 700; color: var(--ss-w-correct); }
6883
+ /* Header */
6884
+ .ss-w-btg-head { display: flex; align-items: flex-start; gap: 8px; }
6885
+ .ss-w-btg-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
6886
+ .ss-w-btg-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
6887
+ .ss-w-btg-ctx { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
6888
+ .ss-w-btg-ctx-score { font-size: 13px; font-weight: 800; color: var(--ss-w-accent); font-variant-numeric: tabular-nums; }
6889
+ .ss-w-btg-ctx-left { font-size: 11px; color: var(--ss-w-faint); font-weight: 500; white-space: nowrap; }
6890
+ /* Terminal summary */
6891
+ .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); }
6892
+ .ss-w-btg-done-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
6893
+ .ss-w-btg-done-score { font-size: 34px; font-weight: 800; color: var(--ss-w-accent); line-height: 1; font-variant-numeric: tabular-nums; }
6894
+ .ss-w-btg-done-sub { font-size: 11px; color: var(--ss-w-faint); }
6895
+ /* Empty search pool note */
6896
+ .ss-w-btg-sheet-empty { font-size: 12px; color: var(--ss-w-faint); text-align: center; padding: 14px 8px; }
6698
6897
  /* Grid layout \u2014 col count driven inline via style */
6699
6898
  .ss-w-btg-grid { display: grid; gap: 4px; width: 100%; }
6700
6899
  /* Generic grid cell */
@@ -6727,9 +6926,11 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
6727
6926
 
6728
6927
  /* ---- Guess the XI game screen (D3) ---- */
6729
6928
  .ss-w-gxi { display: flex; flex-direction: column; gap: 12px; }
6730
- /* Context label (pool label) */
6731
- .ss-w-gxi-ctx { display: flex; align-items: center; }
6732
- .ss-w-gxi-ctx-label { font-size: 12px; font-weight: 700; color: var(--ss-w-faint); text-transform: uppercase; letter-spacing: .05em; }
6929
+ /* Header */
6930
+ .ss-w-gxi-head { display: flex; align-items: flex-start; gap: 8px; }
6931
+ .ss-w-gxi-title { font-size: 18px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; color: var(--ss-w-ink); line-height: 1; }
6932
+ .ss-w-gxi-sub { font-size: 11px; color: var(--ss-w-faint); margin-top: 4px; }
6933
+ .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; }
6733
6934
  /* Positions pitch: compact slot grid */
6734
6935
  .ss-w-gxi-pitch { display: flex; flex-wrap: wrap; gap: 5px; }
6735
6936
  .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; }
@@ -6747,11 +6948,13 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
6747
6948
  .ss-w-gxi-team-btn:disabled { opacity: .5; cursor: not-allowed; }
6748
6949
  .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); }
6749
6950
  .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; }
6750
- /* Outcome banner */
6751
- .ss-w-gxi-banner { display: flex; align-items: center; justify-content: center; padding: 10px 12px; border-radius: 10px; }
6951
+ /* Terminal outcome banner */
6952
+ .ss-w-gxi-banner { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 12px; border-radius: 14px; text-align: center; }
6752
6953
  .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)); }
6753
- .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); }
6954
+ .ss-w-gxi-banner--failed { background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); }
6754
6955
  .ss-w-gxi-banner-label { font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
6956
+ .ss-w-gxi-banner-score { font-size: 34px; font-weight: 800; color: var(--ss-w-accent); line-height: 1; font-variant-numeric: tabular-nums; }
6957
+ .ss-w-gxi-banner-sub { font-size: 11px; color: var(--ss-w-faint); }
6755
6958
  /* Hint line */
6756
6959
  .ss-w-gxi-hint { font-size: 11.5px; color: var(--ss-w-faint); text-align: center; font-style: italic; }
6757
6960
 
@@ -6896,7 +7099,7 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
6896
7099
  `;
6897
7100
 
6898
7101
  // src/StatsWidget.tsx
6899
- import { jsx as jsx71 } from "react/jsx-runtime";
7102
+ import { jsx as jsx72 } from "react/jsx-runtime";
6900
7103
  function buildClient(props) {
6901
7104
  try {
6902
7105
  if ("client" in props && props.client) {
@@ -7035,7 +7238,7 @@ function StatsWidget(props) {
7035
7238
  }, [built, ui.injectStyles]);
7036
7239
  if (!built) return null;
7037
7240
  const attrs = themeAttrs(ui);
7038
- return /* @__PURE__ */ jsx71(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ jsx71("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__ */ jsx71(
7241
+ return /* @__PURE__ */ jsx72(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ jsx72("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__ */ jsx72(
7039
7242
  ChatPanel,
7040
7243
  {
7041
7244
  controller,
@@ -7049,7 +7252,7 @@ function StatsWidget(props) {
7049
7252
  loggedIn: !!operatorUserId,
7050
7253
  conversation: built?.conversation ?? null
7051
7254
  }
7052
- ) : /* @__PURE__ */ jsx71(
7255
+ ) : /* @__PURE__ */ jsx72(
7053
7256
  ChatFab,
7054
7257
  {
7055
7258
  label: ui.launcherLabel,