@sensiblestats/widget-react 0.69.0 → 0.70.1

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/StatsWidget.tsx
-import { useCallback as useCallback12, useEffect as useEffect22, useMemo as useMemo4, useRef as useRef17, useState as useState41 } from "react";
+import { useCallback as useCallback14, useEffect as useEffect26, useMemo as useMemo5, useRef as useRef22, useState as useState44 } from "react";
 import { StatsWidgetClient } from "@sensiblestats/widget-sdk";
 
 // src/kickoff.ts
@@ -123,6 +123,30 @@ var STRINGS = {
     gamePlay: "Play",
     gameLocked: "Locked",
     gameVoided: "Voided",
+    presets: {
+      lang: "en",
+      setNumbers: "Set the numbers",
+      buildCombo: "Build a combo",
+      dialName: "Set the numbers and Build a combo",
+      maxPriceRow: "{count} picks, max {price}",
+      minPriceRow: "Picks from {price} up",
+      comboRow: "A combo of {legs} matches priced at about {total}",
+      maxPriceDisplay: (count, price) => `${count} picks, max ${price.toFixed(2)}`,
+      maxPriceMessage: (count, price) => `Show me ${count} picks priced at ${price.toFixed(2)} or less.`,
+      minPriceDisplay: (count, price) => `${count} picks from ${price.toFixed(2)} up`,
+      minPriceMessage: (count, price) => `Show me ${count} picks priced at ${price.toFixed(2)} or more.`,
+      comboDisplay: (legs, total) => `A combo of ${legs} priced at about ${total.toFixed(1)}`,
+      comboMessage: (legs, total) => `Build me a combo of ${legs} priced at about ${total.toFixed(1)}.`,
+      unavailable: "Not available today.",
+      send: "Send",
+      close: "Close",
+      totalLabel: "Total",
+      matchesLabel: "Matches",
+      fewerMatches: "Fewer matches",
+      moreMatches: "More matches",
+      changeNumber: (value) => `${value}, tap to change`,
+      changeCombo: "Change total or matches"
+    },
     games: {
       lang: "en",
       dailyChallenge: "Daily challenge",
@@ -429,6 +453,30 @@ var STRINGS = {
     gamePlay: "Oyna",
     gameLocked: "Kilitli",
     gameVoided: "\u0130ptal edildi",
+    presets: {
+      lang: "tr",
+      setNumbers: "Say\u0131lar\u0131 belirle",
+      buildCombo: "Kombin olu\u015Ftur",
+      dialName: "Say\u0131lar\u0131 belirle ve Kombin olu\u015Ftur",
+      maxPriceRow: "{count} se\xE7im, en fazla {price}",
+      minPriceRow: "{price} ve \xFCzeri se\xE7imler",
+      comboRow: "Yakla\u015F\u0131k {total} oranl\u0131 {legs} ma\xE7l\u0131k kombin",
+      maxPriceDisplay: (count, price) => `${count} se\xE7im, en fazla ${price.toFixed(2)}`,
+      maxPriceMessage: (count, price) => `${price.toFixed(2)} veya alt\u0131 oranl\u0131 ${count} se\xE7im g\xF6ster.`,
+      minPriceDisplay: (count, price) => `${count} se\xE7im, ${price.toFixed(2)} ve \xFCzeri`,
+      minPriceMessage: (count, price) => `${price.toFixed(2)} veya \xFCzeri oranl\u0131 ${count} se\xE7im g\xF6ster.`,
+      comboDisplay: (legs, total) => `${legs} ma\xE7l\u0131k kombin, yakla\u015F\u0131k ${total.toFixed(1)}`,
+      comboMessage: (legs, total) => `Yakla\u015F\u0131k ${total.toFixed(1)} oranl\u0131 ${legs} ma\xE7l\u0131k bir kombin haz\u0131rla.`,
+      unavailable: "Bug\xFCn mevcut de\u011Fil.",
+      send: "G\xF6nder",
+      close: "Kapat",
+      totalLabel: "Toplam",
+      matchesLabel: "Ma\xE7 say\u0131s\u0131",
+      fewerMatches: "Daha az ma\xE7",
+      moreMatches: "Daha fazla ma\xE7",
+      changeNumber: (value) => `${value}, de\u011Fi\u015Ftirmek i\xE7in dokun`,
+      changeCombo: "Toplam\u0131 veya ma\xE7lar\u0131 de\u011Fi\u015Ftir"
+    },
     games: {
       lang: "tr",
       dailyChallenge: "G\xFCn\xFCn meydan okumas\u0131",
@@ -755,6 +803,7 @@ function normalizeUi(cfg) {
     gameLocked: strings.gameLocked,
     gameVoided: strings.gameVoided,
     games: strings.games,
+    presets: strings.presets,
     liveCard: strings.liveCard
   };
 }
@@ -1093,7 +1142,9 @@ function toComboCardVM(card) {
     legs,
     multiplication,
     replacedNote: str(card.replacedNote),
-    addToSlipEnabled: card.addToSlipEnabled === true
+    addToSlipEnabled: card.addToSlipEnabled === true,
+    target: finite(card.target),
+    legCount: finite(card.legCount)
   };
 }
 function comboLegToSlipSelection(leg, conversationId) {
@@ -1167,10 +1218,10 @@ function resultToToast(result, shownOdds, ui) {
 }
 
 // src/useHostEvents.ts
-import { useCallback as useCallback5, useEffect as useEffect13, useMemo, useRef as useRef8, useState as useState34 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect16, useMemo as useMemo2, useRef as useRef12, useState as useState36 } from "react";
 
 // src/components/ChatPanel.tsx
-import { useEffect as useEffect12, useState as useState33 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect15, useMemo, useRef as useRef11, useState as useState35 } from "react";
 
 // src/components/ChatHeader.tsx
 import { useEffect, useRef, useState as useState2 } from "react";
@@ -1199,6 +1250,20 @@ function KebabIcon() {
     /* @__PURE__ */ jsx("circle", { cx: "12", cy: "19", r: "1.6" })
   ] }) });
 }
+function SlidersIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", "aria-hidden": "true", children: /* @__PURE__ */ jsxs("g", { fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
+    /* @__PURE__ */ jsx("path", { d: "M4 6h9M17 6h3M4 12h3M11 12h9M4 18h11M19 18h1" }),
+    /* @__PURE__ */ jsx("circle", { cx: "15", cy: "6", r: "2" }),
+    /* @__PURE__ */ jsx("circle", { cx: "9", cy: "12", r: "2" }),
+    /* @__PURE__ */ jsx("circle", { cx: "17", cy: "18", r: "2" })
+  ] }) });
+}
+function ComboIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", "aria-hidden": "true", children: /* @__PURE__ */ jsxs("g", { fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "3", width: "11", height: "11", rx: "2" }),
+    /* @__PURE__ */ jsx("rect", { x: "10", y: "10", width: "11", height: "11", rx: "2" })
+  ] }) });
+}
 var DASHBOARD_EMOJI = {
   football: "\u26BD",
   "goal-net": "\u{1F945}",
@@ -1971,6 +2036,13 @@ function BettingInsightList({ insights, ui, slip, monitor }) {
   return /* @__PURE__ */ jsx13("div", { className: "ss-w-binsights", children: insights.map((it) => /* @__PURE__ */ jsx13(InsightCard, { it, ui, slip, monitor }, it.id)) });
 }
 
+// src/presetToolsContext.ts
+import { createContext as createContext4, useContext as useContext4 } from "react";
+var PresetToolsContext = createContext4(null);
+function usePresetTools() {
+  return useContext4(PresetToolsContext);
+}
+
 // src/components/ComboCardList.tsx
 import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
 function ComboLegRow({ leg, addToSlipEnabled, ui, slip }) {
@@ -2013,10 +2085,13 @@ function ComboLegRow({ leg, addToSlipEnabled, ui, slip }) {
   ] });
 }
 function ComboCardView({ vm, ui, slip }) {
+  const tools = usePresetTools();
+  const { target, legCount } = vm;
   return /* @__PURE__ */ jsxs9("div", { className: "ss-w-combo", children: [
     /* @__PURE__ */ jsx14("ol", { className: "ss-w-combo-legs", role: "list", children: vm.legs.map((leg) => /* @__PURE__ */ jsx14(ComboLegRow, { leg, addToSlipEnabled: vm.addToSlipEnabled, ui, slip }, leg.key)) }),
     /* @__PURE__ */ jsx14("div", { className: "ss-w-combo-math", children: vm.multiplication }),
-    vm.replacedNote ? /* @__PURE__ */ jsx14("p", { className: "ss-w-combo-note", children: vm.replacedNote }) : null
+    vm.replacedNote ? /* @__PURE__ */ jsx14("p", { className: "ss-w-combo-note", children: vm.replacedNote }) : null,
+    tools && target !== void 0 && legCount !== void 0 ? /* @__PURE__ */ jsx14("button", { type: "button", className: "ss-w-combo-change", onClick: () => tools.openBuilder(target, legCount), children: tools.changeLabel }) : null
   ] });
 }
 function ComboCardList({ cards, ui, slip }) {
@@ -3375,11 +3450,15 @@ function MessageList({ controller, ui, slip, onDashboardTap, monitor }) {
 }
 
 // src/components/ChatInput.tsx
-import { useState as useState16 } from "react";
+import { forwardRef, useEffect as useEffect8, useImperativeHandle, useRef as useRef5, useState as useState16 } from "react";
 import { jsx as jsx46, jsxs as jsxs40 } from "react/jsx-runtime";
-function ChatInput({ placeholder, streaming, onSend, onStop, stopLabel = "Stop response", sendLabel = "Send message" }) {
+var ChatInput = forwardRef(function ChatInput2({ placeholder, streaming, onSend, onStop, stopLabel = "Stop response", sendLabel = "Send message", disabled = false, onType }, ref) {
   const [value, setValue] = useState16("");
+  const textareaRef = useRef5(null);
+  const stopRef = useRef5(null);
+  const textBoxWantsFocusRef = useRef5(false);
   const submit = () => {
+    if (disabled) return;
     const t = value.trim();
     if (!t) return;
     onSend(t);
@@ -3391,11 +3470,48 @@ function ChatInput({ placeholder, streaming, onSend, onStop, stopLabel = "Stop r
       submit();
     }
   };
+  useImperativeHandle(ref, () => ({
+    focus() {
+      const box = textareaRef.current;
+      if (box && !box.disabled) {
+        textBoxWantsFocusRef.current = false;
+        box.focus();
+        return;
+      }
+      textBoxWantsFocusRef.current = true;
+      stopRef.current?.focus();
+    }
+  }), []);
+  useEffect8(() => {
+    if (streaming || disabled || !textBoxWantsFocusRef.current) return;
+    textBoxWantsFocusRef.current = false;
+    const box = textareaRef.current;
+    if (!box) return;
+    const active = box.getRootNode().activeElement;
+    const input = box.closest(".ss-w-input");
+    const isWithinComponent = input?.contains(active);
+    if (!active || active === box.ownerDocument.body || isWithinComponent) box.focus();
+  }, [streaming, disabled]);
   return /* @__PURE__ */ jsxs40("div", { className: "ss-w-input", children: [
-    /* @__PURE__ */ jsx46("textarea", { className: "ss-w-textarea", rows: 1, placeholder, value, disabled: streaming, onChange: (e) => setValue(e.target.value), onKeyDown }),
-    streaming ? /* @__PURE__ */ jsx46("button", { type: "button", className: "ss-w-send ss-w-stop", "aria-label": stopLabel, onClick: onStop, children: /* @__PURE__ */ jsx46("span", { className: "ss-w-stop-glyph" }) }) : /* @__PURE__ */ jsx46("button", { type: "button", className: "ss-w-send", "aria-label": sendLabel, onClick: submit, children: /* @__PURE__ */ jsx46(SendIcon, {}) })
+    /* @__PURE__ */ jsx46(
+      "textarea",
+      {
+        ref: textareaRef,
+        className: "ss-w-textarea",
+        rows: 1,
+        placeholder,
+        value,
+        disabled: streaming || disabled,
+        onChange: (e) => {
+          setValue(e.target.value);
+          onType?.();
+        },
+        onKeyDown
+      }
+    ),
+    streaming ? /* @__PURE__ */ jsx46("button", { ref: stopRef, type: "button", className: "ss-w-send ss-w-stop", "aria-label": stopLabel, disabled, onClick: onStop, children: /* @__PURE__ */ jsx46("span", { className: "ss-w-stop-glyph" }) }) : /* @__PURE__ */ jsx46("button", { type: "button", className: "ss-w-send", "aria-label": sendLabel, disabled, onClick: submit, children: /* @__PURE__ */ jsx46(SendIcon, {}) })
   ] });
-}
+});
 
 // src/components/TabBar.tsx
 import { jsx as jsx47, jsxs as jsxs41 } from "react/jsx-runtime";
@@ -3878,7 +3994,7 @@ function TodayPanel({ discovery, ui, monitor }) {
 }
 
 // src/components/GamesPanel.tsx
-import { useEffect as useEffect11, useState as useState31 } from "react";
+import { useEffect as useEffect12, useState as useState31 } from "react";
 
 // src/components/GamesLoginWall.tsx
 import { jsx as jsx55 } from "react/jsx-runtime";
@@ -3887,7 +4003,7 @@ function GamesLoginWall({ ui }) {
 }
 
 // src/components/GamesHub.tsx
-import { useEffect as useEffect8, useState as useState18 } from "react";
+import { useEffect as useEffect9, useState as useState18 } from "react";
 
 // src/components/games/ui/gameMeta.ts
 function prettifyGameId(gameId) {
@@ -4073,7 +4189,7 @@ function pickHeroGame(games) {
 var tileKey = (g) => `${g.gameId}-${g.gameDay}-${g.fixtureId}`;
 function GamesHub({ games, myWeeklyRow, weeklyPrize, onOpen, ui }) {
   const [, setTick] = useState18(0);
-  useEffect8(() => {
+  useEffect9(() => {
     const id = setInterval(() => setTick((t) => t + 1), 6e4);
     return () => clearInterval(id);
   }, []);
@@ -4133,10 +4249,10 @@ function GamesHub({ games, myWeeklyRow, weeklyPrize, onOpen, ui }) {
 }
 
 // src/components/GameScreenHost.tsx
-import { useEffect as useEffect10, useRef as useRef7, useState as useState30 } from "react";
+import { useEffect as useEffect11, useRef as useRef8, useState as useState30 } from "react";
 
 // src/useGamePlay.ts
-import { useCallback as useCallback4, useRef as useRef5, useState as useState19 } from "react";
+import { useCallback as useCallback4, useRef as useRef6, useState as useState19 } from "react";
 function toSubmitResult(payload) {
   return {
     // 'pending' means the play is recorded but awaiting resolution (fixture games)
@@ -4151,12 +4267,12 @@ function useGamePlay(conversation, { gameId, gameDay, fixtureId, locale, refresh
   const [result, setResult] = useState19(null);
   const [submitting, setSubmitting] = useState19(false);
   const [rawStatus, setRawStatus] = useState19(null);
-  const inFlightRef = useRef5(false);
-  const convRef = useRef5(conversation);
+  const inFlightRef = useRef6(false);
+  const convRef = useRef6(conversation);
   convRef.current = conversation;
-  const optsRef = useRef5({ gameId, gameDay, fixtureId, locale, refresh });
+  const optsRef = useRef6({ gameId, gameDay, fixtureId, locale, refresh });
   optsRef.current = { gameId, gameDay, fixtureId, locale, refresh };
-  const resultRef = useRef5(null);
+  const resultRef = useRef6(null);
   resultRef.current = result;
   const refetch = useCallback4(async () => {
     const conv = convRef.current;
@@ -5086,7 +5202,7 @@ function CareerPathGame({
 }
 
 // src/components/games/BeatTheGridGame.tsx
-import React, { useEffect as useEffect9, useId as useId4, useRef as useRef6, useState as useState24 } from "react";
+import React, { useEffect as useEffect10, useId as useId4, useRef as useRef7, useState as useState24 } from "react";
 import { Fragment as Fragment14, jsx as jsx74, jsxs as jsxs61 } from "react/jsx-runtime";
 function criterionIconKind(label, key) {
   const l = (key ?? label).toLowerCase();
@@ -5169,8 +5285,8 @@ function SearchSheet({
   const s = ui.games.beatTheGrid;
   const [query, setQuery] = useState24("");
   const inputId = useId4();
-  const inputRef = useRef6(null);
-  useEffect9(() => {
+  const inputRef = useRef7(null);
+  useEffect10(() => {
     inputRef.current?.focus();
   }, [row, col]);
   const filtered = playerPool.filter(
@@ -6472,7 +6588,7 @@ function GameScreenHost({
 }) {
   const { gameId, fixtureId, gameDay = "", lockAtUtc = null } = selected;
   const [configJson, setConfigJson] = useState30(null);
-  useEffect10(() => {
+  useEffect11(() => {
     setConfigJson(null);
     if (!conversation) return;
     let cancelled = false;
@@ -6495,12 +6611,12 @@ function GameScreenHost({
     fixtureId: fixtureId || void 0,
     locale: ui.games.lang
   });
-  useEffect10(() => {
+  useEffect11(() => {
     if (conversation) hydrate();
   }, [conversation, gameId]);
-  const hydrateRef = useRef7(hydrate);
+  const hydrateRef = useRef8(hydrate);
   hydrateRef.current = hydrate;
-  useEffect10(() => {
+  useEffect11(() => {
     if (!FIXTURE_GAME_IDS.has(gameId)) return;
     if (rawStatus !== "pending") return;
     const timerId = setInterval(() => {
@@ -6636,7 +6752,7 @@ function GamesPanel({
   refreshHub
 }) {
   const [selected, setSelected] = useState31(null);
-  useEffect11(() => {
+  useEffect12(() => {
     ensureGamesFonts();
   }, []);
   if (!loggedIn) return /* @__PURE__ */ jsx83(GamesLoginWall, { ui });
@@ -6831,12 +6947,440 @@ function LeaderboardPanel({ loggedIn, data, loading, onPlay, ui }) {
   return /* @__PURE__ */ jsx87("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ jsx87(Leaderboard, { data: data ?? EMPTY_PAYLOAD, ui, onPlay }) });
 }
 
-// src/components/ChatPanel.tsx
+// src/components/PresetSpeedDial.tsx
+import { useId as useId9 } from "react";
 import { jsx as jsx88, jsxs as jsxs72 } from "react/jsx-runtime";
+function PresetSpeedDial({ expanded, showDot, strings, onToggle, onOpen, rootRef, buttonRef }) {
+  const pillsId = useId9();
+  const tabIndex = expanded ? 0 : -1;
+  return /* @__PURE__ */ jsxs72("div", { ref: rootRef, className: "ss-w-dial", children: [
+    /* @__PURE__ */ jsxs72(
+      "button",
+      {
+        ref: buttonRef,
+        type: "button",
+        className: "ss-w-dial-btn",
+        "aria-expanded": expanded,
+        "aria-controls": pillsId,
+        "aria-label": strings.dialName,
+        onClick: onToggle,
+        children: [
+          /* @__PURE__ */ jsx88("span", { className: "ss-w-dial-icon ss-w-dial-icon--open", children: /* @__PURE__ */ jsx88(SlidersIcon, {}) }),
+          /* @__PURE__ */ jsx88("span", { className: "ss-w-dial-icon ss-w-dial-icon--close", children: /* @__PURE__ */ jsx88(CloseIcon, {}) }),
+          showDot && !expanded ? /* @__PURE__ */ jsx88("span", { className: "ss-w-dial-dot", "aria-hidden": "true" }) : null
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs72("div", { id: pillsId, className: "ss-w-dial-pills", "data-open": expanded ? "" : void 0, children: [
+      /* @__PURE__ */ jsxs72("button", { type: "button", className: "ss-w-dial-pill", tabIndex, onClick: () => onOpen("numbers"), children: [
+        /* @__PURE__ */ jsx88(SlidersIcon, {}),
+        /* @__PURE__ */ jsx88("span", { className: "ss-w-dial-pill-label", children: strings.setNumbers })
+      ] }),
+      /* @__PURE__ */ jsxs72("button", { type: "button", className: "ss-w-dial-pill", tabIndex, onClick: () => onOpen("combo"), children: [
+        /* @__PURE__ */ jsx88(ComboIcon, {}),
+        /* @__PURE__ */ jsx88("span", { className: "ss-w-dial-pill-label", children: strings.buildCombo })
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/PresetTools.tsx
+import { Fragment as Fragment20, useEffect as useEffect13, useId as useId10, useRef as useRef9, useState as useState33 } from "react";
+
+// src/presetGrid.ts
+var DEFAULT_SINGLES_LIMITS = [1.3, 1.5, 1.7, 2];
+var DEFAULT_SINGLES_FLOORS = [1.5, 2, 2.5, 3];
+var DEFAULT_COMBO_TOTALS = [3, 5, 10, 20, 50];
+var FIXED_SINGLES_COUNT = 3;
+var MIN_COMBO_LEGS = 2;
+var MAX_COMBO_LEGS = 6;
+var START = { maxPrice: 1.5, minPrice: 2, comboTotal: 5, comboLegs: 3 };
+var finite2 = (v) => typeof v === "number" && Number.isFinite(v);
+var cents = (n) => Math.round(n * 100);
+function samePrice(a, b) {
+  return cents(a) === cents(b);
+}
+function isPresetGrid(v) {
+  if (!v || typeof v !== "object") return false;
+  const g = v;
+  return Array.isArray(g.singles) && Array.isArray(g.singlesFrom) && Array.isArray(g.combos) && finite2(g.maxLegs);
+}
+function drawable(p) {
+  return !!p && finite2(p.price) && finite2(p.matchOddsId) && finite2(p.matchId) && typeof p.homeTeamName === "string" && typeof p.awayTeamName === "string";
+}
+function choices(defaults, present) {
+  const out = [];
+  for (const n of [...defaults, ...present]) {
+    if (finite2(n) && n > 0 && !out.some((m) => samePrice(m, n))) out.push(n);
+  }
+  return out.sort((a, b) => a - b);
+}
+function singlesLimits(grid) {
+  return choices(DEFAULT_SINGLES_LIMITS, grid.singles.map((c) => c?.price));
+}
+function singlesFloors(grid) {
+  return choices(DEFAULT_SINGLES_FLOORS, grid.singlesFrom.map((c) => c?.price));
+}
+function comboTotals(grid) {
+  return choices(DEFAULT_COMBO_TOTALS, grid.combos.map((c) => c?.total));
+}
+function comboLegChoices(grid) {
+  const max = Math.min(MAX_COMBO_LEGS, Math.floor(grid.maxLegs));
+  const out = [];
+  for (let n = MIN_COMBO_LEGS; n <= max; n++) out.push(n);
+  return out;
+}
+function cycle(values, current) {
+  if (values.length === 0) return current;
+  const i = values.findIndex((v) => samePrice(v, current));
+  return values[(i + 1) % values.length] ?? current;
+}
+function startValue(values, preferred) {
+  return values.find((v) => samePrice(v, preferred)) ?? values[0] ?? preferred;
+}
+function nearest(values, target) {
+  const first = values[0];
+  if (first === void 0) return target;
+  if (!(target > 0)) return first;
+  const distance = (v) => Math.abs(Math.log(v / target));
+  return values.reduce((best, v) => distance(v) < distance(best) ? v : best, first);
+}
+function clampLegs(values, legs) {
+  const lo = values[0];
+  const hi = values[values.length - 1];
+  if (lo === void 0 || hi === void 0) return legs;
+  return Math.min(Math.max(Math.round(legs), lo), hi);
+}
+function findSingles(cells, price, count) {
+  const cell = cells.find((c) => !!c && finite2(c.price) && samePrice(c.price, price) && c.count === count);
+  return cell && Array.isArray(cell.picks) && cell.picks.length === count && cell.picks.every(drawable) ? cell : null;
+}
+function findCombo(grid, total, legs) {
+  const cell = grid.combos.find((c) => !!c && finite2(c.total) && samePrice(c.total, total) && c.legs === legs);
+  const combo = cell?.combo;
+  const whole = !!combo && typeof combo.multiplication === "string" && combo.multiplication !== "" && Array.isArray(combo.legs) && combo.legs.length === legs && combo.legs.every(drawable);
+  return cell && whole ? cell : null;
+}
+function idsOf(picks) {
+  return { matchOddsIds: picks.map((p) => p.matchOddsId), matchIds: picks.map((p) => p.matchId) };
+}
+function maxPriceAsk(cell, s) {
+  return {
+    message: s.maxPriceMessage(cell.count, cell.price),
+    displayText: s.maxPriceDisplay(cell.count, cell.price),
+    preset: { kind: "max_price", price: cell.price, count: cell.count, ...idsOf(cell.picks) }
+  };
+}
+function minPriceAsk(cell, s) {
+  return {
+    message: s.minPriceMessage(cell.count, cell.price),
+    displayText: s.minPriceDisplay(cell.count, cell.price),
+    preset: { kind: "min_price", price: cell.price, count: cell.count, ...idsOf(cell.picks) }
+  };
+}
+function comboAsk(cell, s) {
+  return {
+    message: s.comboMessage(cell.legs, cell.total),
+    displayText: s.comboDisplay(cell.legs, cell.total),
+    preset: { kind: "combo", total: cell.total, legs: cell.legs, ...idsOf(cell.combo.legs) }
+  };
+}
+
+// src/components/PresetTools.tsx
+import { Fragment as Fragment21, jsx as jsx89, jsxs as jsxs73 } from "react/jsx-runtime";
+var FOCUSABLE = 'button:not([disabled]), [href], input:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
+function PresetToolModal({ title, closeLabel, onClose, children, footer }) {
+  const dialogRef = useRef9(null);
+  const titleId = useId10();
+  useEffect13(() => {
+    dialogRef.current?.focus();
+  }, []);
+  useEffect13(() => {
+    const onKey = (e) => {
+      if (e.key !== "Escape") return;
+      e.stopPropagation();
+      e.preventDefault();
+      onClose();
+    };
+    window.addEventListener("keydown", onKey, true);
+    return () => window.removeEventListener("keydown", onKey, true);
+  }, [onClose]);
+  const trapTab = (e) => {
+    if (e.key !== "Tab") return;
+    const dialog = dialogRef.current;
+    if (!dialog) return;
+    const items = Array.from(dialog.querySelectorAll(FOCUSABLE));
+    const first = items[0];
+    const last = items[items.length - 1];
+    if (!first || !last) {
+      e.preventDefault();
+      return;
+    }
+    const active = dialog.getRootNode().activeElement;
+    if (e.shiftKey && (active === first || active === dialog)) {
+      e.preventDefault();
+      last.focus();
+    } else if (!e.shiftKey && active === last) {
+      e.preventDefault();
+      first.focus();
+    }
+  };
+  return /* @__PURE__ */ jsx89("div", { className: "ss-w-tool-backdrop", children: /* @__PURE__ */ jsxs73("div", { ref: dialogRef, className: "ss-w-tool", role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, tabIndex: -1, onKeyDown: trapTab, children: [
+    /* @__PURE__ */ jsxs73("div", { className: "ss-w-tool-head", children: [
+      /* @__PURE__ */ jsx89("h2", { id: titleId, className: "ss-w-tool-title", children: title }),
+      /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-tool-close", "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ jsx89(CloseIcon, {}) })
+    ] }),
+    /* @__PURE__ */ jsx89("div", { className: "ss-w-tool-body", children }),
+    footer ? /* @__PURE__ */ jsx89("div", { className: "ss-w-tool-foot", children: footer }) : null
+  ] }) });
+}
+function fillTemplate(template, slots) {
+  return template.split(/(\{[a-z]+\})/).filter((part) => part !== "").map((part, i) => {
+    const key = /^\{([a-z]+)\}$/.exec(part)?.[1];
+    return /* @__PURE__ */ jsx89(Fragment20, { children: key !== void 0 && key in slots ? slots[key] : part }, i);
+  });
+}
+function NumberButton({ value, label, onCycle }) {
+  return /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-tool-num", "aria-label": label, onClick: onCycle, children: value });
+}
+function SendButton({ label, display, disabled, onClick }) {
+  return /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-tool-send", "aria-label": `${label}: ${display}`, disabled, onClick, children: label });
+}
+function PickList({ picks, formatKickoff }) {
+  return /* @__PURE__ */ jsx89("ul", { className: "ss-w-tool-picks", role: "list", children: picks.map((p) => /* @__PURE__ */ jsxs73("li", { className: "ss-w-tool-pick", children: [
+    /* @__PURE__ */ jsxs73("span", { className: "ss-w-tool-pick-match", children: [
+      p.homeTeamName,
+      " \u2013 ",
+      p.awayTeamName
+    ] }),
+    /* @__PURE__ */ jsxs73("span", { className: "ss-w-tool-pick-sel", children: [
+      p.marketLabel,
+      ": ",
+      p.selectionLabel,
+      p.line ? ` ${p.line}` : ""
+    ] }),
+    /* @__PURE__ */ jsx89("span", { className: "ss-w-tool-pick-kick", children: formatKickoff(p.kickoffUtc) }),
+    /* @__PURE__ */ jsx89("span", { className: "ss-w-tool-pick-price", children: p.price.toFixed(2) })
+  ] }, p.matchOddsId)) });
+}
+function ComboPreview({ cell, formatKickoff }) {
+  return /* @__PURE__ */ jsxs73(Fragment21, { children: [
+    /* @__PURE__ */ jsx89(PickList, { picks: cell.combo.legs, formatKickoff }),
+    /* @__PURE__ */ jsx89("div", { className: "ss-w-tool-math", children: cell.combo.multiplication })
+  ] });
+}
+function Unavailable({ text }) {
+  return /* @__PURE__ */ jsx89("p", { className: "ss-w-tool-unavailable", children: text });
+}
+function SetNumbersTool({ grid, strings, streaming, formatKickoff, onSend, onClose }) {
+  const limits = singlesLimits(grid);
+  const floors = singlesFloors(grid);
+  const totals = comboTotals(grid);
+  const legChoices = comboLegChoices(grid);
+  const count = FIXED_SINGLES_COUNT;
+  const [maxPrice, setMaxPrice] = useState33(() => startValue(limits, START.maxPrice));
+  const [minPrice, setMinPrice] = useState33(() => startValue(floors, START.minPrice));
+  const [total, setTotal] = useState33(() => startValue(totals, START.comboTotal));
+  const [legs, setLegs] = useState33(() => startValue(legChoices, START.comboLegs));
+  const [announcement, setAnnouncement] = useState33("");
+  const maxCell = findSingles(grid.singles, maxPrice, count);
+  const minCell = findSingles(grid.singlesFrom, minPrice, count);
+  const comboCell = findCombo(grid, total, legs);
+  const announce = (display, available) => setAnnouncement(available ? display : `${display}. ${strings.unavailable}`);
+  const nextMax = () => {
+    const v = cycle(limits, maxPrice);
+    setMaxPrice(v);
+    announce(strings.maxPriceDisplay(count, v), !!findSingles(grid.singles, v, count));
+  };
+  const nextMin = () => {
+    const v = cycle(floors, minPrice);
+    setMinPrice(v);
+    announce(strings.minPriceDisplay(count, v), !!findSingles(grid.singlesFrom, v, count));
+  };
+  const nextLegs = () => {
+    const v = cycle(legChoices, legs);
+    setLegs(v);
+    announce(strings.comboDisplay(v, total), !!findCombo(grid, total, v));
+  };
+  const nextTotal = () => {
+    const v = cycle(totals, total);
+    setTotal(v);
+    announce(strings.comboDisplay(legs, v), !!findCombo(grid, v, legs));
+  };
+  return /* @__PURE__ */ jsxs73(PresetToolModal, { title: strings.setNumbers, closeLabel: strings.close, onClose, children: [
+    /* @__PURE__ */ jsxs73("section", { className: "ss-w-tool-row", children: [
+      /* @__PURE__ */ jsx89("p", { className: "ss-w-tool-ask", children: fillTemplate(strings.maxPriceRow, {
+        count: String(count),
+        price: /* @__PURE__ */ jsx89(NumberButton, { value: maxPrice.toFixed(2), label: strings.changeNumber(maxPrice.toFixed(2)), onCycle: nextMax })
+      }) }),
+      maxCell ? /* @__PURE__ */ jsx89(PickList, { picks: maxCell.picks, formatKickoff }) : /* @__PURE__ */ jsx89(Unavailable, { text: strings.unavailable }),
+      /* @__PURE__ */ jsx89(SendButton, { label: strings.send, display: strings.maxPriceDisplay(count, maxPrice), disabled: !maxCell || streaming, onClick: () => {
+        if (maxCell) onSend(maxPriceAsk(maxCell, strings));
+      } })
+    ] }),
+    /* @__PURE__ */ jsxs73("section", { className: "ss-w-tool-row", children: [
+      /* @__PURE__ */ jsx89("p", { className: "ss-w-tool-ask", children: fillTemplate(strings.minPriceRow, {
+        count: String(count),
+        price: /* @__PURE__ */ jsx89(NumberButton, { value: minPrice.toFixed(2), label: strings.changeNumber(minPrice.toFixed(2)), onCycle: nextMin })
+      }) }),
+      minCell ? /* @__PURE__ */ jsx89(PickList, { picks: minCell.picks, formatKickoff }) : /* @__PURE__ */ jsx89(Unavailable, { text: strings.unavailable }),
+      /* @__PURE__ */ jsx89(SendButton, { label: strings.send, display: strings.minPriceDisplay(count, minPrice), disabled: !minCell || streaming, onClick: () => {
+        if (minCell) onSend(minPriceAsk(minCell, strings));
+      } })
+    ] }),
+    /* @__PURE__ */ jsxs73("section", { className: "ss-w-tool-row", children: [
+      /* @__PURE__ */ jsx89("p", { className: "ss-w-tool-ask", children: fillTemplate(strings.comboRow, {
+        legs: /* @__PURE__ */ jsx89(NumberButton, { value: String(legs), label: strings.changeNumber(String(legs)), onCycle: nextLegs }),
+        total: /* @__PURE__ */ jsx89(NumberButton, { value: total.toFixed(1), label: strings.changeNumber(total.toFixed(1)), onCycle: nextTotal })
+      }) }),
+      comboCell ? /* @__PURE__ */ jsx89(ComboPreview, { cell: comboCell, formatKickoff }) : /* @__PURE__ */ jsx89(Unavailable, { text: strings.unavailable }),
+      /* @__PURE__ */ jsx89(SendButton, { label: strings.send, display: strings.comboDisplay(legs, total), disabled: !comboCell || streaming, onClick: () => {
+        if (comboCell) onSend(comboAsk(comboCell, strings));
+      } })
+    ] }),
+    /* @__PURE__ */ jsx89("p", { className: "ss-w-vh", "aria-live": "polite", children: announcement })
+  ] });
+}
+function BuildComboTool({ grid, strings, streaming, formatKickoff, initialTotal, initialLegs, onSend, onClose }) {
+  const totals = comboTotals(grid);
+  const legChoices = comboLegChoices(grid);
+  const [total, setTotal] = useState33(() => initialTotal !== void 0 ? nearest(totals, initialTotal) : startValue(totals, START.comboTotal));
+  const [legs, setLegs] = useState33(() => initialLegs !== void 0 ? clampLegs(legChoices, initialLegs) : startValue(legChoices, START.comboLegs));
+  const [announcement, setAnnouncement] = useState33("");
+  const cell = findCombo(grid, total, legs);
+  const minLegs = legChoices[0] ?? legs;
+  const maxLegs = legChoices[legChoices.length - 1] ?? legs;
+  const display = strings.comboDisplay(legs, total);
+  const choose = (nextTotal, nextLegs) => {
+    setTotal(nextTotal);
+    setLegs(nextLegs);
+    const d = strings.comboDisplay(nextLegs, nextTotal);
+    setAnnouncement(findCombo(grid, nextTotal, nextLegs) ? d : `${d}. ${strings.unavailable}`);
+  };
+  const footer = /* @__PURE__ */ jsx89(SendButton, { label: strings.send, display, disabled: !cell || streaming, onClick: () => {
+    if (cell) onSend(comboAsk(cell, strings));
+  } });
+  return /* @__PURE__ */ jsxs73(PresetToolModal, { title: strings.buildCombo, closeLabel: strings.close, onClose, footer, children: [
+    /* @__PURE__ */ jsxs73("div", { className: "ss-w-tool-section", role: "group", "aria-label": strings.totalLabel, children: [
+      /* @__PURE__ */ jsx89("span", { className: "ss-w-tool-label", "aria-hidden": "true", children: strings.totalLabel }),
+      /* @__PURE__ */ jsx89("div", { className: "ss-w-tool-chips", children: totals.map((t) => /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-tool-chip", "aria-pressed": samePrice(t, total), onClick: () => choose(t, legs), children: t.toFixed(1) }, t)) })
+    ] }),
+    /* @__PURE__ */ jsxs73("div", { className: "ss-w-tool-section", role: "group", "aria-label": strings.matchesLabel, children: [
+      /* @__PURE__ */ jsx89("span", { className: "ss-w-tool-label", "aria-hidden": "true", children: strings.matchesLabel }),
+      /* @__PURE__ */ jsxs73("div", { className: "ss-w-tool-stepper", children: [
+        /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-tool-step", "aria-label": strings.fewerMatches, disabled: legs <= minLegs, onClick: () => choose(total, legs - 1), children: "\u2212" }),
+        /* @__PURE__ */ jsx89("span", { className: "ss-w-tool-count", children: legs }),
+        /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-tool-step", "aria-label": strings.moreMatches, disabled: legs >= maxLegs, onClick: () => choose(total, legs + 1), children: "+" })
+      ] })
+    ] }),
+    cell ? /* @__PURE__ */ jsx89(ComboPreview, { cell, formatKickoff }) : /* @__PURE__ */ jsx89(Unavailable, { text: strings.unavailable }),
+    /* @__PURE__ */ jsx89("p", { className: "ss-w-vh", "aria-live": "polite", children: announcement })
+  ] });
+}
+
+// src/usePresetDial.ts
+import { useCallback as useCallback5, useEffect as useEffect14, useRef as useRef10, useState as useState34 } from "react";
+function sendInFlight(messages, isStreaming) {
+  const last = messages[messages.length - 1];
+  return isStreaming && !!last && last.role === "assistant" && !last.done && !last.isGreeting;
+}
+function lastUserId(messages) {
+  for (let i = messages.length - 1; i >= 0; i--) {
+    const m = messages[i];
+    if (m && m.role === "user") return m.id;
+  }
+  return null;
+}
+var SCROLL_KEYS = /* @__PURE__ */ new Set(["ArrowUp", "ArrowDown", "PageUp", "PageDown", "Home", "End", " "]);
+function usePresetDial({ layerRef, dialRef, dialButtonRef, messages, isStreaming, activeTab }) {
+  const [expanded, setExpanded] = useState34(() => !sendInFlight(messages, isStreaming));
+  const fold = useCallback5(() => setExpanded(false), []);
+  const toggle = useCallback5(() => setExpanded((e) => !e), []);
+  const currentUserId = lastUserId(messages);
+  const userIdRef = useRef10(currentUserId);
+  useEffect14(() => {
+    if (currentUserId === userIdRef.current) return;
+    userIdRef.current = currentUserId;
+    setExpanded(false);
+  }, [currentUserId]);
+  const tabRef = useRef10(activeTab);
+  useEffect14(() => {
+    if (activeTab === tabRef.current) return;
+    tabRef.current = activeTab;
+    setExpanded(false);
+  }, [activeTab]);
+  const expandedRef = useRef10(expanded);
+  expandedRef.current = expanded;
+  useEffect14(() => {
+    const onEscape = (e) => {
+      const dial = dialRef.current;
+      if (e.key !== "Escape" || !dial || !e.composedPath().includes(dial)) return;
+      e.stopPropagation();
+      e.preventDefault();
+      if (!expandedRef.current) return;
+      setExpanded(false);
+      dialButtonRef.current?.focus();
+    };
+    window.addEventListener("keydown", onEscape, true);
+    return () => window.removeEventListener("keydown", onEscape, true);
+  }, [dialRef, dialButtonRef]);
+  useEffect14(() => {
+    if (!expanded) return;
+    const layer = layerRef.current;
+    const inDial = (e) => {
+      const dial = dialRef.current;
+      return !!dial && e.composedPath().includes(dial);
+    };
+    const inList = (e) => e.composedPath().some((n) => n instanceof Element && n.classList.contains("ss-w-list"));
+    const onPress = (e) => {
+      if (!inDial(e)) setExpanded(false);
+    };
+    const onScrollGesture = (e) => {
+      if (inList(e) && !inDial(e)) setExpanded(false);
+    };
+    const onKey = (e) => {
+      if (SCROLL_KEYS.has(e.key) && inList(e)) setExpanded(false);
+    };
+    const doc = layer?.ownerDocument ?? document;
+    doc.addEventListener("pointerdown", onPress, true);
+    layer?.addEventListener("wheel", onScrollGesture, { passive: true });
+    layer?.addEventListener("touchmove", onScrollGesture, { passive: true });
+    window.addEventListener("keydown", onKey, true);
+    return () => {
+      doc.removeEventListener("pointerdown", onPress, true);
+      layer?.removeEventListener("wheel", onScrollGesture);
+      layer?.removeEventListener("touchmove", onScrollGesture);
+      window.removeEventListener("keydown", onKey, true);
+    };
+  }, [expanded, layerRef, dialRef]);
+  return { expanded, toggle, fold };
+}
+
+// src/presetSeen.ts
+var KEY = "ss-w-presets-tool-opened";
+var openedThisPage = false;
+function readToolSeen() {
+  if (openedThisPage) return true;
+  try {
+    return window.localStorage.getItem(KEY) === "1";
+  } catch {
+    return false;
+  }
+}
+function markToolSeen() {
+  openedThisPage = true;
+  try {
+    window.localStorage.setItem(KEY, "1");
+  } catch {
+  }
+}
+
+// src/components/ChatPanel.tsx
+import { jsx as jsx90, jsxs as jsxs74 } from "react/jsx-runtime";
 var FULLSCREEN_QUERY = "(max-width: 639px)";
 function useIsModal() {
-  const [modal, setModal] = useState33(false);
-  useEffect12(() => {
+  const [modal, setModal] = useState35(false);
+  useEffect15(() => {
     if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
     const mql = window.matchMedia(FULLSCREEN_QUERY);
     const sync = () => setModal(mql.matches);
@@ -6846,10 +7390,11 @@ function useIsModal() {
   }, []);
   return modal;
 }
-function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, gamesResult, leaderboardResult, loggedIn, conversation }) {
+var HIDDEN_LAYER_STYLE = { position: "absolute", inset: 0, visibility: "hidden", display: "flex", flexDirection: "column" };
+function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, gamesResult, leaderboardResult, loggedIn, conversation, presetGrid }) {
   const { state, close, stop, send, reset } = controller;
   const isModal = useIsModal();
-  useEffect12(() => {
+  useEffect15(() => {
     const onKey = (e) => {
       if (e.key === "Escape") close();
     };
@@ -6864,11 +7409,66 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
     monitor?.setActiveTab("chat");
     send(text, { grounding });
   };
-  useEffect12(() => {
+  useEffect15(() => {
     if (monitor && monitor.activeTab !== "chat" && state.isStreaming) monitor.markChatActivity();
   }, [monitor, state.isStreaming, state.messages.length]);
-  return /* @__PURE__ */ jsxs72("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
-    /* @__PURE__ */ jsx88(
+  const onChatTab = !monitor || monitor.activeTab === "chat";
+  const layerRef = useRef11(null);
+  const dialRef = useRef11(null);
+  const dialButtonRef = useRef11(null);
+  const inputRef = useRef11(null);
+  const focusAfterCloseRef = useRef11(null);
+  const [tool, setTool] = useState35(null);
+  const [toolSeen, setToolSeen] = useState35(readToolSeen);
+  const dial = usePresetDial({
+    layerRef,
+    dialRef,
+    dialButtonRef,
+    messages: state.messages,
+    isStreaming: state.isStreaming,
+    activeTab: monitor?.activeTab ?? "chat"
+  });
+  const { fold } = dial;
+  const showDial = !!presetGrid && onChatTab && !tool;
+  const openTool = useCallback6((next) => {
+    fold();
+    markToolSeen();
+    setToolSeen(true);
+    setTool(next);
+  }, [fold]);
+  const onPill = useCallback6((kind) => openTool(kind === "numbers" ? { kind: "numbers" } : { kind: "combo" }), [openTool]);
+  const toolsValue = useMemo(
+    () => presetGrid ? { openBuilder: (total, legs) => openTool({ kind: "combo", total, legs }), changeLabel: ui.presets.changeCombo } : null,
+    [presetGrid, openTool, ui.presets.changeCombo]
+  );
+  const closeTool = useCallback6(() => {
+    focusAfterCloseRef.current = "dial";
+    setTool(null);
+  }, []);
+  const sendAsk = useCallback6((ask) => {
+    focusAfterCloseRef.current = "composer";
+    setTool(null);
+    monitor?.setActiveTab("chat");
+    send(ask.message, { displayText: ask.displayText, preset: ask.preset });
+  }, [monitor, send]);
+  const formatKickoff = useCallback6((kickoffUtc) => {
+    const k = ui.bettingKickoff(kickoffUtc);
+    return `${k.dayLabel} ${k.time}`;
+  }, [ui]);
+  useEffect15(() => {
+    if (tool) return;
+    const target = focusAfterCloseRef.current;
+    focusAfterCloseRef.current = null;
+    if (target === "dial") dialButtonRef.current?.focus();
+    else if (target === "composer") inputRef.current?.focus();
+  }, [tool]);
+  useEffect15(() => {
+    if (!tool || onChatTab && presetGrid) return;
+    focusAfterCloseRef.current = "composer";
+    setTool(null);
+  }, [tool, onChatTab, presetGrid]);
+  return /* @__PURE__ */ jsxs74("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
+    /* @__PURE__ */ jsx90(
       ChatHeader,
       {
         onClose: close,
@@ -6881,7 +7481,7 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
         moreOptionsLabel: ui.moreOptions
       }
     ),
-    monitor && /* @__PURE__ */ jsx88(
+    monitor && /* @__PURE__ */ jsx90(
       TabBar,
       {
         monitor,
@@ -6893,17 +7493,26 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
         gamesEnabled: gamesResult?.enabled ?? false
       }
     ),
-    /* @__PURE__ */ jsx88(
-      "div",
-      {
-        style: !monitor || monitor.activeTab === "chat" ? { display: "contents" } : { position: "absolute", inset: 0, visibility: "hidden", display: "flex", flexDirection: "column" },
-        children: /* @__PURE__ */ jsx88(MessageList, { controller, ui, slip, onDashboardTap, monitor })
-      }
-    ),
-    monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ jsx88(TodayPanel, { discovery, ui, monitor }),
-    monitor && monitor.activeTab === "following" && /* @__PURE__ */ jsx88(MatchesPanel, { monitor, ui, slip, onAsk: handleAsk }),
-    monitor && monitor.activeTab === "odds" && /* @__PURE__ */ jsx88(OddsPanel, { monitor, ui, slip }),
-    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx88(
+    /* @__PURE__ */ jsxs74("div", { ref: layerRef, className: "ss-w-chat-layer", "data-dial": presetGrid ? "" : void 0, style: onChatTab ? void 0 : HIDDEN_LAYER_STYLE, children: [
+      /* @__PURE__ */ jsx90(PresetToolsContext.Provider, { value: toolsValue, children: /* @__PURE__ */ jsx90(MessageList, { controller, ui, slip, onDashboardTap, monitor }) }),
+      showDial ? /* @__PURE__ */ jsx90(
+        PresetSpeedDial,
+        {
+          expanded: dial.expanded,
+          showDot: !toolSeen,
+          strings: ui.presets,
+          onToggle: dial.toggle,
+          onOpen: onPill,
+          rootRef: dialRef,
+          buttonRef: dialButtonRef
+        }
+      ) : null,
+      tool && presetGrid && onChatTab ? tool.kind === "numbers" ? /* @__PURE__ */ jsx90(SetNumbersTool, { grid: presetGrid, strings: ui.presets, streaming: state.isStreaming, formatKickoff, onSend: sendAsk, onClose: closeTool }) : /* @__PURE__ */ jsx90(BuildComboTool, { grid: presetGrid, strings: ui.presets, streaming: state.isStreaming, formatKickoff, initialTotal: tool.total, initialLegs: tool.legs, onSend: sendAsk, onClose: closeTool }) : null
+    ] }),
+    monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ jsx90(TodayPanel, { discovery, ui, monitor }),
+    monitor && monitor.activeTab === "following" && /* @__PURE__ */ jsx90(MatchesPanel, { monitor, ui, slip, onAsk: handleAsk }),
+    monitor && monitor.activeTab === "odds" && /* @__PURE__ */ jsx90(OddsPanel, { monitor, ui, slip }),
+    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx90(
       GamesPanel,
       {
         loggedIn: !!loggedIn,
@@ -6917,7 +7526,7 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
         }
       }
     ),
-    monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ jsx88(
+    monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ jsx90(
       LeaderboardPanel,
       {
         loggedIn: !!loggedIn,
@@ -6927,7 +7536,20 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
         ui
       }
     ),
-    (!monitor || monitor.activeTab !== "games" && monitor.activeTab !== "leaderboard") && /* @__PURE__ */ jsx88(ChatInput, { placeholder: ui.placeholder, streaming: state.isStreaming, onSend: handleSend, onStop: stop, stopLabel: ui.stopResponse, sendLabel: ui.sendMessage })
+    (!monitor || monitor.activeTab !== "games" && monitor.activeTab !== "leaderboard") && /* @__PURE__ */ jsx90(
+      ChatInput,
+      {
+        ref: inputRef,
+        placeholder: ui.placeholder,
+        streaming: state.isStreaming,
+        onSend: handleSend,
+        onStop: stop,
+        stopLabel: ui.stopResponse,
+        sendLabel: ui.sendMessage,
+        disabled: !!tool,
+        onType: fold
+      }
+    )
   ] });
 }
 
@@ -7136,15 +7758,15 @@ function toSlipEvent(name, entry) {
 // src/useHostEvents.ts
 function useHostEvents(opts) {
   const { host, operatorId, currentUser, logger, isOpen, closePanel, onOpenMatch, openMatchLabel } = opts;
-  const [added, setAdded] = useState34({});
-  const [settled, setSettled] = useState34({});
-  const markAdded = useCallback5((matchOddsId) => {
+  const [added, setAdded] = useState36({});
+  const [settled, setSettled] = useState36({});
+  const markAdded = useCallback7((matchOddsId) => {
     setAdded((prev) => prev[matchOddsId] ? prev : { ...prev, [matchOddsId]: true });
   }, []);
-  const settle = useCallback5((matchOddsId) => {
+  const settle = useCallback7((matchOddsId) => {
     setSettled((prev) => prev[matchOddsId] ? prev : { ...prev, [matchOddsId]: true });
   }, []);
-  const clearMarks = useCallback5((ids) => {
+  const clearMarks = useCallback7((ids) => {
     const drop = (prev) => {
       if (!ids.some((id) => prev[id])) return prev;
       const next = { ...prev };
@@ -7155,26 +7777,26 @@ function useHostEvents(opts) {
     setSettled(drop);
   }, []);
   const hasHost = host !== void 0;
-  const ledger = useMemo(
+  const ledger = useMemo2(
     () => hasHost ? createSlipLedger(`ss-w-slip:${operatorId}`) : null,
     [hasHost, operatorId]
   );
-  const currentUserRef = useRef8(currentUser);
+  const currentUserRef = useRef12(currentUser);
   currentUserRef.current = currentUser;
-  const recordAdd = useCallback5((add) => {
+  const recordAdd = useCallback7((add) => {
     ledger?.record({ id: add.selection.matchOddsId, market: add.market, ...add.pick, user: currentUserRef.current });
   }, [ledger]);
-  const slipState = useMemo(
+  const slipState = useMemo2(
     () => ({ added, settled, settle, recordAdd }),
     [added, settled, settle, recordAdd]
   );
   const hasOpenMatch = typeof onOpenMatch === "function";
   const tracksViews = hasHost || hasOpenMatch;
-  const views = useMemo(
+  const views = useMemo2(
     () => tracksViews ? createMatchViews(`ss-w-views:${operatorId}`, { user: currentUser }) : null,
     [tracksViews, operatorId, currentUser]
   );
-  const sinkRef = useRef8(() => {
+  const sinkRef = useRef12(() => {
   });
   sinkRef.current = (command) => {
     if (command.kind === "matchOpened") {
@@ -7195,11 +7817,11 @@ function useHostEvents(opts) {
       logger?.log(toSlipEvent(name, entry));
     }
   };
-  useEffect13(() => {
+  useEffect16(() => {
     if (!host) return;
     return attachHost(host, (command) => sinkRef.current(command));
   }, [host]);
-  useEffect13(() => {
+  useEffect16(() => {
     if (!isOpen || !views) return;
     const held = views.markOpened();
     if (held.length === 0) return;
@@ -7208,7 +7830,7 @@ function useHostEvents(opts) {
     }
     void logger?.flushNow();
   }, [isOpen, views, logger]);
-  const openMatchRef = useRef8(() => {
+  const openMatchRef = useRef12(() => {
   });
   openMatchRef.current = (matchId) => {
     if (views?.view(matchId) === "log") {
@@ -7222,7 +7844,7 @@ function useHostEvents(opts) {
     }
     if (typeof window.matchMedia === "function" && window.matchMedia(FULLSCREEN_QUERY).matches) closePanel();
   };
-  const matchLink = useMemo(
+  const matchLink = useMemo2(
     () => hasOpenMatch ? { open: (matchId) => openMatchRef.current(matchId), label: openMatchLabel } : null,
     [hasOpenMatch, openMatchLabel]
   );
@@ -7290,7 +7912,7 @@ function themeAttrs(ui) {
 }
 
 // src/useChatStream.ts
-import { useCallback as useCallback6, useEffect as useEffect15, useMemo as useMemo2, useReducer as useReducer2, useRef as useRef10 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect18, useMemo as useMemo3, useReducer as useReducer2, useRef as useRef14 } from "react";
 import { WidgetSdkError as WidgetSdkError2 } from "@sensiblestats/widget-sdk";
 
 // src/reducer.ts
@@ -7450,7 +8072,7 @@ function reducer(state, action) {
 }
 
 // src/useLiveDashboardPoll.ts
-import { useEffect as useEffect14, useReducer, useRef as useRef9 } from "react";
+import { useEffect as useEffect17, useReducer, useRef as useRef13 } from "react";
 var POLL_INTERVAL_MS = 6e4;
 var LEAD_MS = 12e4;
 var GIVE_UP_MS = 30 * 6e4;
@@ -7494,11 +8116,11 @@ function findEarliestWakeupMs(messages) {
 function useLiveDashboardPoll({ messages, dispatch, getLiveDashboard }) {
   const [, forceUpdate] = useReducer((x) => x + 1, 0);
   const anchor = findAnchor(messages);
-  const anchorRef = useRef9(anchor);
+  const anchorRef = useRef13(anchor);
   anchorRef.current = anchor;
-  const inFlightRef = useRef9(false);
+  const inFlightRef = useRef13(false);
   const anchorKey = anchor ? `${anchor.messageId}:${anchor.kind}` : null;
-  useEffect14(() => {
+  useEffect17(() => {
     if (!anchorKey || !anchorRef.current) return;
     const tick = async () => {
       if (inFlightRef.current) return;
@@ -7534,7 +8156,7 @@ function useLiveDashboardPoll({ messages, dispatch, getLiveDashboard }) {
     }, POLL_INTERVAL_MS);
     return () => window.clearInterval(id);
   }, [anchorKey, dispatch, getLiveDashboard]);
-  useEffect14(() => {
+  useEffect17(() => {
     if (anchorKey !== null) return;
     const wakeAt = findEarliestWakeupMs(messages);
     if (wakeAt === null) return;
@@ -7599,7 +8221,7 @@ function seedIdCounter(messages) {
   return max + 1;
 }
 function useChatStream(conversation, starterTexts, greetingMessage, storageKey) {
-  const boot = useMemo2(() => {
+  const boot = useMemo3(() => {
     const payload = storageKey ? readConversation(storageKey, Date.now()) : null;
     const restored = payload != null && payload !== "expired" && payload !== "corrupt";
     const base = initialState(starterTexts.map(chipFromText));
@@ -7609,26 +8231,26 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
     return { state: base, restored: false, stale: payload === "expired" || payload === "corrupt" };
   }, []);
   const [state, dispatch] = useReducer2(reducer, boot.state);
-  const idRef = useRef10(seedIdCounter(boot.state.messages));
-  const handleRef = useRef10(null);
-  const fallbackTimerRef = useRef10(null);
-  const stateRef = useRef10(state);
+  const idRef = useRef14(seedIdCounter(boot.state.messages));
+  const handleRef = useRef14(null);
+  const fallbackTimerRef = useRef14(null);
+  const stateRef = useRef14(state);
   stateRef.current = state;
-  const greetedRef = useRef10(boot.restored);
-  const hydratedRef = useRef10(false);
-  const restoreSeededRef = useRef10(false);
+  const greetedRef = useRef14(boot.restored);
+  const hydratedRef = useRef14(false);
+  const restoreSeededRef = useRef14(false);
   if (!restoreSeededRef.current) {
     restoreSeededRef.current = true;
     if (boot.restored && boot.state.conversationId) conversation.conversationId = boot.state.conversationId;
   }
   const nextId = () => `m${idRef.current++}`;
-  const clearFallbackTimer = useCallback6(() => {
+  const clearFallbackTimer = useCallback8(() => {
     if (fallbackTimerRef.current != null) {
       clearTimeout(fallbackTimerRef.current);
       fallbackTimerRef.current = null;
     }
   }, []);
-  const armFallbackTimer = useCallback6((onFire) => {
+  const armFallbackTimer = useCallback8((onFire) => {
     clearFallbackTimer();
     fallbackTimerRef.current = setTimeout(() => {
       fallbackTimerRef.current = null;
@@ -7637,7 +8259,7 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
       onFire();
     }, STREAM_FALLBACK_TIMEOUT_MS);
   }, [clearFallbackTimer]);
-  const consume = useCallback6((handle, onError) => {
+  const consume = useCallback8((handle, onError) => {
     ;
     (async () => {
       try {
@@ -7655,7 +8277,7 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
       }
     })();
   }, [clearFallbackTimer]);
-  const run = useCallback6((input, displayText) => {
+  const run = useCallback8((input, displayText) => {
     handleRef.current?.cancel();
     clearFallbackTimer();
     dispatch({ kind: "USER_SENT", input, userId: nextId(), assistantId: nextId(), displayText });
@@ -7667,7 +8289,7 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
     });
     consume(handle, (err) => dispatch({ kind: "STREAM_ERROR", error: err }));
   }, [conversation, consume, clearFallbackTimer, armFallbackTimer]);
-  const send = useCallback6((text, opts) => {
+  const send = useCallback8((text, opts) => {
     const trimmed = text.trim();
     if (!trimmed) return;
     run({
@@ -7675,14 +8297,15 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
       actionId: opts?.actionId,
       actionRef: opts?.actionRef,
       grounding: opts?.grounding,
-      clientCapabilities: [...CLIENT_CAPABILITIES]
+      clientCapabilities: [...CLIENT_CAPABILITIES],
+      ...opts?.preset ? { preset: opts.preset } : {}
     }, opts?.displayText);
   }, [run]);
-  const retry = useCallback6(() => {
+  const retry = useCallback8(() => {
     const last = stateRef.current.lastUserInput;
     if (last) run(last, stateRef.current.lastDisplayText ?? void 0);
   }, [run]);
-  const fireGreeting = useCallback6(() => {
+  const fireGreeting = useCallback8(() => {
     const message = greetingMessage?.trim();
     if (!message) return;
     try {
@@ -7697,15 +8320,15 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
       dispatch({ kind: "STOP" });
     }
   }, [greetingMessage, conversation, consume, clearFallbackTimer, armFallbackTimer]);
-  useEffect15(() => {
+  useEffect18(() => {
     if (greetedRef.current) return;
     greetedRef.current = true;
     fireGreeting();
   }, [fireGreeting]);
-  useEffect15(() => {
+  useEffect18(() => {
     if (boot.stale && storageKey) clearConversation(storageKey);
   }, []);
-  useEffect15(() => {
+  useEffect18(() => {
     if (!storageKey || state.isStreaming) return;
     if (hydratedRef.current) {
       hydratedRef.current = false;
@@ -7722,7 +8345,7 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
     if (persistable.length === 0) return;
     writeConversation(storageKey, state.conversationId, persistable, Date.now());
   }, [storageKey, state.isStreaming, state.messages, state.conversationId]);
-  useEffect15(() => {
+  useEffect18(() => {
     if (!storageKey) return;
     const onStorage = (e) => {
       if (e.key !== storageKey || e.storageArea !== window.localStorage) return;
@@ -7746,25 +8369,25 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
     window.addEventListener("storage", onStorage);
     return () => window.removeEventListener("storage", onStorage);
   }, [storageKey, conversation, fireGreeting]);
-  const open = useCallback6(() => dispatch({ kind: "OPEN" }), []);
-  const close = useCallback6(() => {
+  const open = useCallback8(() => dispatch({ kind: "OPEN" }), []);
+  const close = useCallback8(() => {
     handleRef.current?.cancel();
     handleRef.current = null;
     clearFallbackTimer();
     dispatch({ kind: "CLOSE" });
   }, [clearFallbackTimer]);
-  const stop = useCallback6(() => {
+  const stop = useCallback8(() => {
     handleRef.current?.cancel();
     handleRef.current = null;
     clearFallbackTimer();
     dispatch({ kind: "STOP" });
   }, [clearFallbackTimer]);
-  const toggle = useCallback6(() => {
+  const toggle = useCallback8(() => {
     if (stateRef.current.isOpen) close();
     else open();
   }, [close, open]);
-  const dismissPopup = useCallback6(() => dispatch({ kind: "DISMISS_POPUP" }), []);
-  const reset = useCallback6(() => {
+  const dismissPopup = useCallback8(() => dispatch({ kind: "DISMISS_POPUP" }), []);
+  const reset = useCallback8(() => {
     handleRef.current?.cancel();
     handleRef.current = null;
     clearFallbackTimer();
@@ -7775,18 +8398,18 @@ function useChatStream(conversation, starterTexts, greetingMessage, storageKey)
     greetedRef.current = true;
     fireGreeting();
   }, [storageKey, conversation, clearFallbackTimer, fireGreeting]);
-  const getLiveDashboard = useCallback6(() => conversation.getLiveDashboard(), [conversation]);
+  const getLiveDashboard = useCallback8(() => conversation.getLiveDashboard(), [conversation]);
   useLiveDashboardPoll({ messages: state.messages, dispatch, getLiveDashboard });
   return { state, open, close, stop, toggle, send, retry, dismissPopup, reset, _dispatch: dispatch };
 }
 
 // src/useLiveMonitor.ts
-import { useCallback as useCallback7, useEffect as useEffect16, useRef as useRef11, useState as useState36 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect19, useRef as useRef15, useState as useState38 } from "react";
 
 // src/useTabs.ts
-import { useState as useState35 } from "react";
+import { useState as useState37 } from "react";
 function useTabs(initial = "chat") {
-  const [activeTab, setActiveTab] = useState35(initial);
+  const [activeTab, setActiveTab] = useState37(initial);
   return { activeTab, setActiveTab };
 }
 
@@ -7811,38 +8434,38 @@ function phaseForPin(snapshot, pin) {
   return snapshot.markets.find((mk) => mk.key === pin.key)?.phase;
 }
 function useLiveMonitor(opts) {
-  const sessionIdRef = useRef11(crypto.randomUUID());
-  const [pins, setPins] = useState36([]);
-  const [store] = useState36(() => createPinStore(opts.storageKey, sessionIdRef.current, setPins));
-  const [enabled, setEnabled] = useState36(true);
-  const [snapshot, setSnapshotState] = useState36(null);
+  const sessionIdRef = useRef15(crypto.randomUUID());
+  const [pins, setPins] = useState38([]);
+  const [store] = useState38(() => createPinStore(opts.storageKey, sessionIdRef.current, setPins));
+  const [enabled, setEnabled] = useState38(true);
+  const [snapshot, setSnapshotState] = useState38(null);
   const { activeTab, setActiveTab: setActiveTabState } = useTabs("chat");
-  const [chatDot, setChatDot] = useState36(false);
-  const [matchesDot, setMatchesDot] = useState36(false);
-  const [oddsDot, setOddsDot] = useState36(false);
-  const [todayDot, setTodayDot] = useState36(false);
-  const [lastViewedPrices, setLastViewedPrices] = useState36({});
-  const [openMarket, setOpenMarket] = useState36({});
-  const [marketOdds, setMarketOdds] = useState36({});
-  const pinsRef = useRef11(pins);
+  const [chatDot, setChatDot] = useState38(false);
+  const [matchesDot, setMatchesDot] = useState38(false);
+  const [oddsDot, setOddsDot] = useState38(false);
+  const [todayDot, setTodayDot] = useState38(false);
+  const [lastViewedPrices, setLastViewedPrices] = useState38({});
+  const [openMarket, setOpenMarket] = useState38({});
+  const [marketOdds, setMarketOdds] = useState38({});
+  const pinsRef = useRef15(pins);
   pinsRef.current = pins;
-  const watchesRef = useRef11(opts.watches ?? []);
+  const watchesRef = useRef15(opts.watches ?? []);
   watchesRef.current = opts.watches ?? [];
-  const activeTabRef = useRef11(activeTab);
+  const activeTabRef = useRef15(activeTab);
   activeTabRef.current = activeTab;
-  const snapshotRef = useRef11(snapshot);
+  const snapshotRef = useRef15(snapshot);
   snapshotRef.current = snapshot;
-  const lastViewedPricesRef = useRef11(lastViewedPrices);
+  const lastViewedPricesRef = useRef15(lastViewedPrices);
   lastViewedPricesRef.current = lastViewedPrices;
-  const openMarketRef = useRef11(openMarket);
+  const openMarketRef = useRef15(openMarket);
   openMarketRef.current = openMarket;
-  const marketOddsRef = useRef11(marketOdds);
+  const marketOddsRef = useRef15(marketOdds);
   marketOddsRef.current = marketOdds;
   const hasToday = opts.hasToday ?? false;
   const marketKey = (matchId, dev) => `${matchId}:${dev}`;
-  const getMarketOddsRef = useRef11(opts.getMarketOdds);
+  const getMarketOddsRef = useRef15(opts.getMarketOdds);
   getMarketOddsRef.current = opts.getMarketOdds;
-  const fetchMarket = useCallback7((matchId, dev) => {
+  const fetchMarket = useCallback9((matchId, dev) => {
     const key = marketKey(matchId, dev);
     const existing = marketOddsRef.current[key];
     if (existing?.loading) return;
@@ -7861,7 +8484,7 @@ function useLiveMonitor(opts) {
       setMarketOdds((prev) => ({ ...prev, [key]: entry }));
     });
   }, []);
-  const toggleMarket = useCallback7((matchId, dev) => {
+  const toggleMarket = useCallback9((matchId, dev) => {
     const key = marketKey(matchId, dev);
     const wasOpen = openMarketRef.current[matchId] === dev;
     const nextValue = wasOpen ? null : dev;
@@ -7872,10 +8495,10 @@ function useLiveMonitor(opts) {
       fetchMarket(matchId, dev);
     }
   }, [fetchMarket]);
-  const retryMarket = useCallback7((matchId, dev) => {
+  const retryMarket = useCallback9((matchId, dev) => {
     fetchMarket(matchId, dev);
   }, [fetchMarket]);
-  const applySnapshot = useCallback7((next) => {
+  const applySnapshot = useCallback9((next) => {
     if (next === null) {
       setEnabled(false);
       return;
@@ -7938,13 +8561,13 @@ function useLiveMonitor(opts) {
     snapshotRef.current = next;
     setSnapshotState(next);
   }, [store]);
-  const inFlightRef = useRef11(false);
-  const timerRef = useRef11(void 0);
-  const disabledRef = useRef11(false);
-  const mountedRef = useRef11(false);
-  const getLiveMonitorRef = useRef11(opts.getLiveMonitor);
+  const inFlightRef = useRef15(false);
+  const timerRef = useRef15(void 0);
+  const disabledRef = useRef15(false);
+  const mountedRef = useRef15(false);
+  const getLiveMonitorRef = useRef15(opts.getLiveMonitor);
   getLiveMonitorRef.current = opts.getLiveMonitor;
-  const tick = useCallback7(async () => {
+  const tick = useCallback9(async () => {
     const allPins = [...pinsRef.current, ...watchesRef.current];
     if (inFlightRef.current || disabledRef.current || allPins.length === 0) return;
     inFlightRef.current = true;
@@ -7968,7 +8591,7 @@ function useLiveMonitor(opts) {
       scheduleRef.current();
     }
   }, [applySnapshot, fetchMarket]);
-  const scheduleRef = useRef11(() => {
+  const scheduleRef = useRef15(() => {
   });
   scheduleRef.current = () => {
     window.clearTimeout(timerRef.current);
@@ -7978,14 +8601,14 @@ function useLiveMonitor(opts) {
     const hinted = snapshotRef.current ? snapshotRef.current.nextPollSeconds * 1e3 : fallbackMs;
     timerRef.current = window.setTimeout(() => void tick(), Math.max(MIN_POLL_MS, hinted));
   };
-  useEffect16(() => {
+  useEffect19(() => {
     mountedRef.current = true;
     return () => {
       mountedRef.current = false;
     };
   }, []);
-  const prevPinsLengthRef = useRef11(0);
-  useEffect16(() => {
+  const prevPinsLengthRef = useRef15(0);
+  useEffect19(() => {
     const wasEmpty = prevPinsLengthRef.current === 0 && watchesRef.current.length === 0;
     prevPinsLengthRef.current = pins.length;
     if (pins.length === 0 && watchesRef.current.length === 0) {
@@ -7994,27 +8617,27 @@ function useLiveMonitor(opts) {
     }
     if (wasEmpty) void tick();
   }, [pins.length, tick]);
-  const prevWatchesLengthRef = useRef11(0);
+  const prevWatchesLengthRef = useRef15(0);
   const watchesLength = opts.watches?.length ?? 0;
-  useEffect16(() => {
+  useEffect19(() => {
     const wasEmpty = prevWatchesLengthRef.current === 0 && pinsRef.current.length === 0;
     prevWatchesLengthRef.current = watchesLength;
     if (wasEmpty && watchesLength > 0) void tick();
   }, [watchesLength, tick]);
-  useEffect16(() => {
+  useEffect19(() => {
     const matchPins = pins.filter((p) => p.kind === "match").length;
     const marketPins = pins.length - matchPins;
     if (activeTab === "following" && matchPins === 0) setActiveTabState(hasToday ? "today" : "chat");
     if (activeTab === "odds" && marketPins === 0) setActiveTabState(hasToday ? "today" : "chat");
     if (activeTab === "today" && !hasToday) setActiveTabState("chat");
   }, [pins, activeTab, hasToday]);
-  const prevIsOpenRef = useRef11(false);
-  useEffect16(() => {
+  const prevIsOpenRef = useRef15(false);
+  useEffect19(() => {
     const wasClosed = !prevIsOpenRef.current;
     prevIsOpenRef.current = opts.isOpen;
     if (wasClosed && opts.isOpen) void tick();
   }, [opts.isOpen, tick]);
-  useEffect16(() => {
+  useEffect19(() => {
     const onVisibility = () => {
       if (document.visibilityState === "hidden") window.clearTimeout(timerRef.current);
       else void tick();
@@ -8025,7 +8648,7 @@ function useLiveMonitor(opts) {
       window.clearTimeout(timerRef.current);
     };
   }, [tick]);
-  const setActiveTab = useCallback7((tab) => {
+  const setActiveTab = useCallback9((tab) => {
     setActiveTabState(tab);
     if (tab === "chat") setChatDot(false);
     if (tab === "today") setTodayDot(false);
@@ -8046,14 +8669,14 @@ function useLiveMonitor(opts) {
       void tick();
     }
   }, [tick]);
-  const togglePin = useCallback7((pin) => {
+  const togglePin = useCallback9((pin) => {
     const result = store.toggle(pin);
     pinsRef.current = store.pins;
     return result;
   }, [store]);
-  const isPinned = useCallback7((key) => pinsRef.current.some((p) => p.key === key), []);
-  const markChatActivity = useCallback7(() => setChatDot(true), []);
-  const markTodayActivity = useCallback7(() => {
+  const isPinned = useCallback9((key) => pinsRef.current.some((p) => p.key === key), []);
+  const markChatActivity = useCallback9(() => setChatDot(true), []);
+  const markTodayActivity = useCallback9(() => {
     if (activeTabRef.current !== "today") setTodayDot(true);
   }, []);
   return {
@@ -8080,7 +8703,7 @@ function useLiveMonitor(opts) {
 }
 
 // src/useMatchDiscovery.ts
-import { useCallback as useCallback8, useEffect as useEffect17, useMemo as useMemo3, useRef as useRef12, useState as useState37 } from "react";
+import { useCallback as useCallback10, useEffect as useEffect20, useMemo as useMemo4, useRef as useRef16, useState as useState39 } from "react";
 
 // src/scheduleCache.ts
 var PREFIX = "ss-w-schedule:";
@@ -8168,27 +8791,27 @@ function localDateOf(now) {
   return `${y}-${m}-${d}`;
 }
 function useMatchDiscovery(opts) {
-  const [groups, setGroups] = useState37([]);
-  const [states, setStates] = useState37({});
-  const [failures, setFailures] = useState37(0);
-  const [expanded, setExpanded] = useState37({});
-  const [touched, setTouched] = useState37({});
-  const groupsRef = useRef12(groups);
+  const [groups, setGroups] = useState39([]);
+  const [states, setStates] = useState39({});
+  const [failures, setFailures] = useState39(0);
+  const [expanded, setExpanded] = useState39({});
+  const [touched, setTouched] = useState39({});
+  const groupsRef = useRef16(groups);
   groupsRef.current = groups;
-  const statesRef = useRef12(states);
+  const statesRef = useRef16(states);
   statesRef.current = states;
-  const getStatesRef = useRef12(opts.getStates);
+  const getStatesRef = useRef16(opts.getStates);
   getStatesRef.current = opts.getStates;
   const pinnedKey = opts.pinnedMatchIds.join(",");
-  const [localDate, setLocalDate] = useState37(() => localDateOf(/* @__PURE__ */ new Date()));
-  useEffect17(() => {
+  const [localDate, setLocalDate] = useState39(() => localDateOf(/* @__PURE__ */ new Date()));
+  useEffect20(() => {
     const id = setInterval(() => {
       const next = localDateOf(/* @__PURE__ */ new Date());
       setLocalDate((prev) => prev === next ? prev : next);
     }, ROLLOVER_CHECK_MS);
     return () => clearInterval(id);
   }, []);
-  useEffect17(() => {
+  useEffect20(() => {
     let cancelled = false;
     const utcOffsetMinutes = -(/* @__PURE__ */ new Date()).getTimezoneOffset();
     const cached = readSchedule(opts.operatorId, localDate, Date.now());
@@ -8213,7 +8836,7 @@ function useMatchDiscovery(opts) {
       cancelled = true;
     };
   }, [opts.operatorId, localDate]);
-  useEffect17(() => {
+  useEffect20(() => {
     setExpanded((prev) => {
       const next = {};
       for (const group of groups) {
@@ -8224,7 +8847,7 @@ function useMatchDiscovery(opts) {
       return next;
     });
   }, [groups, pinnedKey, touched]);
-  const tick = useCallback8(async () => {
+  const tick = useCallback10(async () => {
     const ids = dueMatchIds(groupsRef.current, statesRef.current, Date.now());
     if (ids.length === 0) return;
     try {
@@ -8240,7 +8863,7 @@ function useMatchDiscovery(opts) {
       setFailures((n) => n + 1);
     }
   }, []);
-  useEffect17(() => {
+  useEffect20(() => {
     if (!opts.isOpen) return;
     void tick();
     const id = setInterval(() => {
@@ -8249,11 +8872,11 @@ function useMatchDiscovery(opts) {
     return () => clearInterval(id);
   }, [opts.isOpen, tick, groups]);
   const stale = failures >= STALE_AFTER_FAILURES;
-  const liveCount = useMemo3(
+  const liveCount = useMemo4(
     () => stale ? 0 : Object.values(states).filter((s) => s.phase === "live").length,
     [states, stale]
   );
-  const toggleGroup = useCallback8((competitionId) => {
+  const toggleGroup = useCallback10((competitionId) => {
     setTouched((prev) => ({ ...prev, [competitionId]: true }));
     setExpanded((prev) => ({ ...prev, [competitionId]: !prev[competitionId] }));
   }, []);
@@ -8261,25 +8884,25 @@ function useMatchDiscovery(opts) {
 }
 
 // src/useGames.ts
-import { useCallback as useCallback9, useEffect as useEffect18, useRef as useRef13, useState as useState38 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect21, useRef as useRef17, useState as useState40 } from "react";
 var GAMES_POLL_MS = 6e4;
 var DEFAULT_TZ = "Europe/London";
 function computeGameDay(timezone) {
   return new Intl.DateTimeFormat("en-CA", { timeZone: timezone }).format(/* @__PURE__ */ new Date());
 }
 function useGames(conversation, { activeTab, operatorTimezone }) {
-  const [enabled, setEnabled] = useState38(false);
-  const [games, setGames] = useState38([]);
-  const [loading, setLoading] = useState38(false);
-  const [refreshCount, setRefreshCount] = useState38(0);
-  const inFlightRef = useRef13(false);
-  const hardOffRef = useRef13(false);
-  const conversationRef = useRef13(conversation);
+  const [enabled, setEnabled] = useState40(false);
+  const [games, setGames] = useState40([]);
+  const [loading, setLoading] = useState40(false);
+  const [refreshCount, setRefreshCount] = useState40(0);
+  const inFlightRef = useRef17(false);
+  const hardOffRef = useRef17(false);
+  const conversationRef = useRef17(conversation);
   conversationRef.current = conversation;
-  const tzRef = useRef13(operatorTimezone ?? DEFAULT_TZ);
+  const tzRef = useRef17(operatorTimezone ?? DEFAULT_TZ);
   tzRef.current = operatorTimezone ?? DEFAULT_TZ;
   const ready = conversation != null;
-  useEffect18(() => {
+  useEffect21(() => {
     if (hardOffRef.current) return;
     let active = true;
     const doFetch = async () => {
@@ -8322,22 +8945,22 @@ function useGames(conversation, { activeTab, operatorTimezone }) {
       if (intervalId !== void 0) window.clearInterval(intervalId);
     };
   }, [activeTab, refreshCount, ready]);
-  const refresh = useCallback9(() => {
+  const refresh = useCallback11(() => {
     setRefreshCount((c) => c + 1);
   }, []);
   return { enabled, games, loading, refresh };
 }
 
 // src/useLeaderboard.ts
-import { useCallback as useCallback10, useEffect as useEffect19, useRef as useRef14, useState as useState39 } from "react";
+import { useCallback as useCallback12, useEffect as useEffect22, useRef as useRef18, useState as useState41 } from "react";
 function useLeaderboard(conversation, { activeTab }) {
-  const [data, setData] = useState39(null);
-  const [loading, setLoading] = useState39(false);
-  const [refreshCount, setRefreshCount] = useState39(0);
-  const inFlightRef = useRef14(false);
-  const conversationRef = useRef14(conversation);
+  const [data, setData] = useState41(null);
+  const [loading, setLoading] = useState41(false);
+  const [refreshCount, setRefreshCount] = useState41(0);
+  const inFlightRef = useRef18(false);
+  const conversationRef = useRef18(conversation);
   conversationRef.current = conversation;
-  useEffect19(() => {
+  useEffect22(() => {
     if (activeTab !== "leaderboard" && activeTab !== "games") return;
     let active = true;
     const doFetch = async () => {
@@ -8360,18 +8983,68 @@ function useLeaderboard(conversation, { activeTab }) {
       inFlightRef.current = false;
     };
   }, [activeTab, refreshCount]);
-  const refresh = useCallback10(() => {
+  const refresh = useCallback12(() => {
     setRefreshCount((c) => c + 1);
   }, []);
   return { data, loading, refresh };
 }
 
+// src/usePresetGrid.ts
+import { useEffect as useEffect23, useRef as useRef19, useState as useState42 } from "react";
+var GRID_MAX_AGE_MS = 6e5;
+function usePresetGrid({ getPricePresets, isOpen, locale, now = Date.now }) {
+  const [grid, setGrid] = useState42(null);
+  const keptRef = useRef19(null);
+  const localeRef = useRef19(locale);
+  const inFlightRef = useRef19(false);
+  const mountedRef = useRef19(true);
+  const getRef = useRef19(getPricePresets);
+  getRef.current = getPricePresets;
+  const nowRef = useRef19(now);
+  nowRef.current = now;
+  useEffect23(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  useEffect23(() => {
+    if (localeRef.current !== locale) {
+      localeRef.current = locale;
+      keptRef.current = null;
+      setGrid(null);
+    }
+    if (!isOpen || inFlightRef.current) return;
+    const kept = keptRef.current;
+    const age = kept ? nowRef.current() - Date.parse(kept.builtAtUtc) : Number.NaN;
+    if (age <= GRID_MAX_AGE_MS) return;
+    inFlightRef.current = true;
+    Promise.resolve().then(() => getRef.current(locale)).then((body) => {
+      if (body === null || isPresetGrid(body) && !hasAnyCell(body)) {
+        keptRef.current = null;
+        if (mountedRef.current) setGrid(null);
+        return;
+      }
+      if (!isPresetGrid(body)) return;
+      keptRef.current = body;
+      if (mountedRef.current) setGrid(body);
+    }).catch(() => {
+    }).finally(() => {
+      inFlightRef.current = false;
+    });
+  }, [isOpen, locale]);
+  return grid;
+}
+function hasAnyCell(grid) {
+  return grid.singles.length > 0 || grid.singlesFrom.length > 0 || grid.combos.length > 0;
+}
+
 // src/popupTelemetry.ts
-import { useCallback as useCallback11, useEffect as useEffect20, useRef as useRef15 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect24, useRef as useRef20 } from "react";
 function usePopupTelemetry(log, isOpen, popupText, dismissPopup) {
-  const shownRef = useRef15(/* @__PURE__ */ new Set());
-  const closedTextRef = useRef15(null);
-  useEffect20(() => {
+  const shownRef = useRef20(/* @__PURE__ */ new Set());
+  const closedTextRef = useRef20(null);
+  useEffect24(() => {
     if (isOpen) {
       if (closedTextRef.current) log?.log({ name: "popup_opened" });
       closedTextRef.current = null;
@@ -8383,65 +9056,65 @@ function usePopupTelemetry(log, isOpen, popupText, dismissPopup) {
       log?.log({ name: "popup_shown" });
     }
   }, [log, isOpen, popupText]);
-  return useCallback11(() => {
+  return useCallback13(() => {
     log?.log({ name: "popup_dismissed" });
     dismissPopup();
   }, [log, dismissPopup]);
 }
 
 // src/components/ChatFab.tsx
-import { useEffect as useEffect21, useRef as useRef16, useState as useState40 } from "react";
+import { useEffect as useEffect25, useRef as useRef21, useState as useState43 } from "react";
 
 // src/components/GreetingBubble.tsx
-import { jsx as jsx89, jsxs as jsxs73 } from "react/jsx-runtime";
+import { jsx as jsx91, jsxs as jsxs75 } from "react/jsx-runtime";
 function GreetingBubble({ text, onOpen, onDismiss, dismissLabel = "Dismiss", asks }) {
-  const body = /* @__PURE__ */ jsxs73("button", { type: "button", className: "ss-w-greeting-body", onClick: onOpen, children: [
-    /* @__PURE__ */ jsxs73("span", { className: "ss-w-greeting-dots", "aria-hidden": "true", children: [
-      /* @__PURE__ */ jsx89("i", {}),
-      /* @__PURE__ */ jsx89("i", {}),
-      /* @__PURE__ */ jsx89("i", {})
+  const body = /* @__PURE__ */ jsxs75("button", { type: "button", className: "ss-w-greeting-body", onClick: onOpen, children: [
+    /* @__PURE__ */ jsxs75("span", { className: "ss-w-greeting-dots", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx91("i", {}),
+      /* @__PURE__ */ jsx91("i", {}),
+      /* @__PURE__ */ jsx91("i", {})
     ] }),
-    /* @__PURE__ */ jsx89("span", { className: "ss-w-greeting-text", children: text })
+    /* @__PURE__ */ jsx91("span", { className: "ss-w-greeting-text", children: text })
   ] });
-  const dismiss = onDismiss ? /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-greeting-x", "aria-label": dismissLabel, onClick: onDismiss, children: "\xD7" }) : null;
+  const dismiss = onDismiss ? /* @__PURE__ */ jsx91("button", { type: "button", className: "ss-w-greeting-x", "aria-label": dismissLabel, onClick: onDismiss, children: "\xD7" }) : null;
   if (!asks || asks.length === 0) {
-    return /* @__PURE__ */ jsxs73("div", { className: "ss-w-greeting", role: "note", children: [
+    return /* @__PURE__ */ jsxs75("div", { className: "ss-w-greeting", role: "note", children: [
       body,
       dismiss
     ] });
   }
-  return /* @__PURE__ */ jsxs73("div", { className: "ss-w-greeting ss-w-greeting--asks", role: "note", children: [
-    /* @__PURE__ */ jsxs73("div", { className: "ss-w-greeting-top", children: [
+  return /* @__PURE__ */ jsxs75("div", { className: "ss-w-greeting ss-w-greeting--asks", role: "note", children: [
+    /* @__PURE__ */ jsxs75("div", { className: "ss-w-greeting-top", children: [
       body,
       dismiss
     ] }),
-    /* @__PURE__ */ jsx89("div", { className: "ss-w-greeting-asks", children: asks.map((ask, i) => /* @__PURE__ */ jsx89("button", { type: "button", className: "ss-w-greeting-ask", onClick: ask.onTap, children: ask.label }, `${i}:${ask.label}`)) })
+    /* @__PURE__ */ jsx91("div", { className: "ss-w-greeting-asks", children: asks.map((ask, i) => /* @__PURE__ */ jsx91("button", { type: "button", className: "ss-w-greeting-ask", onClick: ask.onTap, children: ask.label }, `${i}:${ask.label}`)) })
   ] });
 }
 
 // src/components/ChatFab.tsx
-import { jsx as jsx90, jsxs as jsxs74 } from "react/jsx-runtime";
+import { jsx as jsx92, jsxs as jsxs76 } from "react/jsx-runtime";
 function ChatFab({ label, greeting, popupText, logoUrl, onOpen, onDismissPopup, dismissLabel = "Dismiss", introAllowed = false, onIntroStart, asks }) {
   const bubble = popupText ?? greeting;
-  const [intro, setIntro] = useState40(false);
-  const armedRef = useRef16(introAllowed);
-  useEffect21(() => {
+  const [intro, setIntro] = useState43(false);
+  const armedRef = useRef21(introAllowed);
+  useEffect25(() => {
     if (armedRef.current && bubble) {
       armedRef.current = false;
       setIntro(true);
       onIntroStart?.();
     }
   }, [bubble, onIntroStart]);
-  return /* @__PURE__ */ jsxs74("div", { className: intro ? "ss-w-fab-wrap ss-w-intro" : "ss-w-fab-wrap", children: [
-    bubble ? /* @__PURE__ */ jsx90(GreetingBubble, { text: bubble, onOpen, onDismiss: popupText ? onDismissPopup : void 0, dismissLabel, asks: popupText ? asks : void 0 }) : null,
-    /* @__PURE__ */ jsx90("button", { type: "button", className: "ss-w-fab", "aria-label": label, onClick: onOpen, children: /* @__PURE__ */ jsx90(BrandMark, { logoUrl, className: "ss-w-fab-mark" }) })
+  return /* @__PURE__ */ jsxs76("div", { className: intro ? "ss-w-fab-wrap ss-w-intro" : "ss-w-fab-wrap", children: [
+    bubble ? /* @__PURE__ */ jsx92(GreetingBubble, { text: bubble, onOpen, onDismiss: popupText ? onDismissPopup : void 0, dismissLabel, asks: popupText ? asks : void 0 }) : null,
+    /* @__PURE__ */ jsx92("button", { type: "button", className: "ss-w-fab", "aria-label": label, onClick: onOpen, children: /* @__PURE__ */ jsx92(BrandMark, { logoUrl, className: "ss-w-fab-mark" }) })
   ] });
 }
 
 // src/components/HostEventsProvider.tsx
-import { jsx as jsx91 } from "react/jsx-runtime";
+import { jsx as jsx93 } from "react/jsx-runtime";
 function HostEventsProvider({ value, children }) {
-  return /* @__PURE__ */ jsx91(SlipStateContext.Provider, { value: value.slipState, children: /* @__PURE__ */ jsx91(MatchLinkContext.Provider, { value: value.matchLink, children }) });
+  return /* @__PURE__ */ jsx93(SlipStateContext.Provider, { value: value.slipState, children: /* @__PURE__ */ jsx93(MatchLinkContext.Provider, { value: value.matchLink, children }) });
 }
 
 // src/styles/css.generated.ts
@@ -8878,6 +9551,71 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-w-combo-leg-stat { font-size: 12px; line-height: 1.45; color: var(--ss-w-ink); background: var(--ss-w-bubble); border-radius: 8px; padding: 6px 9px; }
 .ss-w-combo-math { font-family: ui-monospace, monospace; font-variant-numeric: tabular-nums; font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--ss-w-ink); text-align: right; background: color-mix(in srgb, var(--ss-w-accent) 9%, var(--ss-w-panel)); border-radius: 8px; padding: 8px 10px; overflow-wrap: anywhere; }
 .ss-w-combo-note { font-size: 11px; line-height: 1.4; color: var(--ss-w-faint); }
+.ss-w-combo-change { align-self: flex-start; min-height: 36px; padding: 6px 12px; font: inherit; font-size: 12px; font-weight: 650; color: var(--ss-w-accent); background: var(--ss-w-panel); border: 1px solid var(--ss-w-accent); border-radius: 16px; cursor: pointer; }
+
+/* onboarding presets stage 2: the two tools (spec Stage 2 Behaviour, boards 1c and 2c). A sheet
+   over the message list, inside .ss-w-chat-layer; the body scrolls and the builder's Send sits in
+   the footer, so it stays visible on a phone. Colours come from the theme tokens. */
+.ss-w-tool-backdrop { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; justify-content: flex-end; background: rgba(0,0,0,.35); }
+.ss-w-tool { display: flex; flex-direction: column; min-height: 0; max-height: 100%; background: var(--ss-w-panel); color: var(--ss-w-ink); border-top: 1px solid var(--ss-w-line); border-radius: 16px 16px 0 0; box-shadow: 0 -8px 24px rgba(0,0,0,.18); outline: none; }
+.ss-w-tool-head { flex: none; display: flex; align-items: center; gap: 8px; padding: 12px 14px 8px; }
+.ss-w-tool-title { flex: 1; font-size: 15px; font-weight: 700; line-height: 1.3; }
+.ss-w-tool-close { flex: none; width: 36px; height: 36px; display: grid; place-items: center; font-size: 16px; color: var(--ss-w-faint); background: var(--ss-w-bubble); border: none; border-radius: 50%; cursor: pointer; }
+.ss-w-tool-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 12px; padding: 4px 14px 14px; }
+.ss-w-tool-body > * { flex: none; }
+.ss-w-tool-foot { flex: none; padding: 10px 14px 12px; border-top: 1px solid var(--ss-w-line); }
+.ss-w-tool-row { display: flex; flex-direction: column; gap: 8px; padding: 10px 11px; border: 1px solid var(--ss-w-line); border-left: 3px solid var(--ss-w-accent); border-radius: 12px; }
+.ss-w-tool-ask { font-size: 14px; font-weight: 650; line-height: 1.7; color: var(--ss-w-ink); overflow-wrap: anywhere; }
+.ss-w-tool-num { display: inline-block; min-width: 44px; min-height: 32px; margin: 0 2px; padding: 3px 8px; font: inherit; font-variant-numeric: tabular-nums; font-weight: 800; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 10%, var(--ss-w-panel)); border: 1px dashed color-mix(in srgb, var(--ss-w-accent) 55%, var(--ss-w-line)); border-radius: 8px; cursor: pointer; }
+.ss-w-tool-picks { list-style: none; display: flex; flex-direction: column; gap: 4px; }
+.ss-w-tool-pick { display: grid; grid-template-columns: 1fr auto; column-gap: 8px; padding: 5px 8px; font-size: 12px; line-height: 1.35; background: var(--ss-w-bubble); border-radius: 8px; }
+.ss-w-tool-pick-match { grid-column: 1; font-weight: 650; color: var(--ss-w-ink); overflow-wrap: anywhere; }
+.ss-w-tool-pick-sel { grid-column: 1; color: var(--ss-w-faint); overflow-wrap: anywhere; }
+.ss-w-tool-pick-kick { grid-column: 1; font-size: 11px; color: var(--ss-w-faint); }
+.ss-w-tool-pick-price { grid-column: 2; grid-row: 1 / span 3; align-self: center; font-family: ui-monospace, monospace; font-variant-numeric: tabular-nums; font-size: 14px; font-weight: 800; color: var(--ss-w-accent); }
+.ss-w-tool-math { padding: 6px 8px; font-family: ui-monospace, monospace; font-variant-numeric: tabular-nums; font-size: 13px; font-weight: 700; text-align: right; color: var(--ss-w-ink); background: color-mix(in srgb, var(--ss-w-accent) 9%, var(--ss-w-panel)); border-radius: 8px; overflow-wrap: anywhere; }
+.ss-w-tool-unavailable { padding: 6px 8px; font-size: 12px; color: var(--ss-w-faint); border: 1px dashed var(--ss-w-line); border-radius: 8px; }
+.ss-w-tool-send { align-self: flex-end; min-height: 40px; padding: 8px 18px; font: inherit; font-size: 13px; font-weight: 700; color: #fff; background: var(--ss-w-accent); border: none; border-radius: 20px; cursor: pointer; }
+.ss-w-tool-send:disabled { color: var(--ss-w-faint); background: var(--ss-w-bubble); cursor: not-allowed; }
+.ss-w-tool-foot .ss-w-tool-send { width: 100%; }
+.ss-w-tool-section { display: flex; flex-direction: column; gap: 6px; }
+.ss-w-tool-label { font-size: 11.5px; font-weight: 650; color: var(--ss-w-faint); }
+.ss-w-tool-chips { display: flex; flex-wrap: wrap; gap: 6px; }
+.ss-w-tool-chip { min-width: 52px; min-height: 36px; padding: 6px 10px; font: inherit; font-variant-numeric: tabular-nums; font-weight: 700; color: var(--ss-w-ink); background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 18px; cursor: pointer; }
+.ss-w-tool-chip[aria-pressed="true"] { color: #fff; background: var(--ss-w-accent); border-color: var(--ss-w-accent); }
+.ss-w-tool-stepper { display: inline-flex; align-items: center; gap: 10px; }
+.ss-w-tool-step { width: 40px; height: 40px; display: grid; place-items: center; font: inherit; font-size: 18px; font-weight: 700; color: var(--ss-w-accent); background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 50%; cursor: pointer; }
+.ss-w-tool-step:disabled { opacity: .5; cursor: not-allowed; }
+.ss-w-tool-count { min-width: 24px; text-align: center; font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
+
+/* onboarding presets stage 2: the chat layer and the speed dial (spec Stage 2 Behaviour). The
+   layer is the message list's positioned box (P6), so the dial sits against the list's bottom
+   right and rises with the composer: right 8px puts the 44px button's centre on Send's (12px
+   padding + 18px), bottom 10px is above the composer's top border. While the button shows the list
+   gets 54px more bottom padding so its last message can scroll clear. */
+.ss-w-chat-layer { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
+.ss-w-chat-layer[data-dial] .ss-w-list { padding-bottom: 68px; }
+.ss-w-dial { position: absolute; left: 12px; right: 8px; bottom: 10px; z-index: 2; display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 8px; pointer-events: none; }
+.ss-w-dial-btn, .ss-w-dial-pill { pointer-events: auto; }
+.ss-w-dial-btn { position: relative; flex: none; width: 44px; height: 44px; display: grid; place-items: center; padding: 0; font-size: 20px; color: var(--ss-w-accent); background: var(--ss-w-panel); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 40%, var(--ss-w-line)); border-radius: 50%; box-shadow: 0 4px 14px rgba(0,0,0,.18); cursor: pointer; }
+.ss-w-dial-btn[aria-expanded="true"] { color: var(--ss-w-panel); background: var(--ss-w-accent); border-color: var(--ss-w-accent); }
+.ss-w-dial-btn:focus-visible, .ss-w-dial-pill:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: 2px; }
+.ss-w-dial-icon { grid-area: 1 / 1; display: grid; place-items: center; transition: transform 200ms ease, opacity 200ms ease; }
+.ss-w-dial-icon--close { opacity: 0; transform: rotate(-90deg); }
+.ss-w-dial-btn[aria-expanded="true"] .ss-w-dial-icon--open { opacity: 0; transform: rotate(90deg); }
+.ss-w-dial-btn[aria-expanded="true"] .ss-w-dial-icon--close { opacity: 1; transform: none; }
+.ss-w-dial-dot { position: absolute; top: 3px; right: 3px; width: 10px; height: 10px; background: var(--ss-w-accent); border: 2px solid var(--ss-w-panel); border-radius: 50%; }
+.ss-w-dial-pills { max-width: 100%; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
+.ss-w-dial-pill { max-width: 100%; min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 16px 6px 12px; font: inherit; font-size: 12.5px; font-weight: 650; line-height: 1.25; text-align: left; white-space: normal; overflow-wrap: anywhere; color: var(--ss-w-ink); background: var(--ss-w-panel); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 35%, var(--ss-w-line)); border-radius: 22px; box-shadow: 0 4px 14px rgba(0,0,0,.16); cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(14px) scale(.5); transform-origin: bottom right; transition: opacity 200ms ease, transform 200ms ease, visibility 0s linear 200ms; }
+.ss-w-dial-pill svg { flex: none; font-size: 18px; color: var(--ss-w-accent); }
+.ss-w-dial-pill-label { min-width: 0; }
+.ss-w-dial-pills[data-open] .ss-w-dial-pill { opacity: 1; visibility: visible; transform: none; transition: opacity 200ms ease, transform 200ms ease, visibility 0s; }
+@media (prefers-reduced-motion: reduce) {
+  .ss-w-dial-pill { transform: none; transition: opacity 200ms ease, visibility 0s linear 200ms; }
+  .ss-w-dial-pills[data-open] .ss-w-dial-pill { transition: opacity 200ms ease, visibility 0s; }
+  .ss-w-dial-icon { transition: opacity 200ms ease; }
+  .ss-w-dial-icon--close, .ss-w-dial-btn[aria-expanded="true"] .ss-w-dial-icon--open { transform: none; }
+}
 
 /* Compact price list (D16): three or more cards of one turn, one row per fixture. Team names wrap
    to a second line and are never cut; the time sits above the match pin, with no column of its own. */
@@ -8964,6 +9702,7 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
   .ss-w-textarea { font-size: 16px; }
 }
 .ss-w-send { width: 36px; height: 36px; flex: none; border: none; border-radius: 50%; background: var(--ss-w-accent); color: #fff; cursor: pointer; display: grid; place-items: center; font-size: 16px; }
+.ss-w-send:disabled { opacity: .45; cursor: not-allowed; }
 .ss-w-stop-glyph { width: 11px; height: 11px; background: currentColor; border-radius: 2px; }
 
 /* add to slip */
@@ -10003,7 +10742,7 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 `;
 
 // src/StatsWidget.tsx
-import { jsx as jsx92 } from "react/jsx-runtime";
+import { jsx as jsx94 } from "react/jsx-runtime";
 function buildClient(props) {
   try {
     if ("client" in props && props.client) {
@@ -10028,24 +10767,24 @@ function injectStyles(root) {
 function StatsWidget(props) {
   const injectedClient = "client" in props ? props.client : void 0;
   const cfg = props.config;
-  const built = useMemo4(() => buildClient(props), [injectedClient, cfg?.operatorId, cfg?.publicKey, cfg?.baseUrl]);
-  const logger = useMemo4(
+  const built = useMemo5(() => buildClient(props), [injectedClient, cfg?.operatorId, cfg?.publicKey, cfg?.baseUrl]);
+  const logger = useMemo5(
     () => built ? built.client.createEventLogger({
       operatorUserId: cfg?.userContext?.operatorUserId,
       anonymousUserId: cfg?.userContext?.anonymousUserId
     }) : null,
     [built?.client]
   );
-  const ui = useMemo4(() => normalizeUi(props.config ?? { operatorId: "", publicKey: "" }), [props.config]);
-  const rootRef = useRef17(null);
-  const introDoneRef = useRef17(false);
-  const markIntroDone = useCallback12(() => {
+  const ui = useMemo5(() => normalizeUi(props.config ?? { operatorId: "", publicKey: "" }), [props.config]);
+  const rootRef = useRef22(null);
+  const introDoneRef = useRef22(false);
+  const markIntroDone = useCallback14(() => {
     introDoneRef.current = true;
   }, []);
   const convStorageKey = `ss-w-conv:${cfg?.operatorId ?? ""}:${cfg?.userContext?.operatorUserId ?? "anon"}`;
   const controller = useChatStream(built?.conversation ?? emptyConversation(), ui.starters, built ? ui.greetingMessage : void 0, convStorageKey);
-  const [hasToday, setHasToday] = useState41(false);
-  const liveCardWatches = useMemo4(() => {
+  const [hasToday, setHasToday] = useState44(false);
+  const liveCardWatches = useMemo5(() => {
     const seen = /* @__PURE__ */ new Set();
     const out = [];
     for (const msg of controller.state.messages) {
@@ -10067,15 +10806,15 @@ function StatsWidget(props) {
     hasToday,
     watches: liveCardWatches
   });
-  const getSchedule = useCallback12(
+  const getSchedule = useCallback14(
     (localDate, utcOffsetMinutes) => built ? built.conversation.getSchedule(localDate, utcOffsetMinutes) : Promise.resolve(null),
     [built]
   );
-  const getStates = useCallback12(
+  const getStates = useCallback14(
     (matchIds) => built ? built.conversation.getStates(matchIds) : Promise.resolve(null),
     [built]
   );
-  const pinnedMatchIds = useMemo4(
+  const pinnedMatchIds = useMemo5(
     () => monitor.pins.filter((p) => p.kind === "match").map((p) => p.matchId),
     [monitor.pins]
   );
@@ -10087,11 +10826,11 @@ function StatsWidget(props) {
     pinnedMatchIds
   });
   const todayHasContent = visibleGroupsOf(discovery.groups, discovery.states).length > 0;
-  useEffect22(() => {
+  useEffect26(() => {
     setHasToday(todayHasContent);
   }, [todayHasContent]);
-  const prevLiveSnapshotRef = useRef17(monitor.snapshot);
-  useEffect22(() => {
+  const prevLiveSnapshotRef = useRef22(monitor.snapshot);
+  useEffect26(() => {
     const snap = monitor.snapshot;
     if (!snap || snap === prevLiveSnapshotRef.current) return;
     prevLiveSnapshotRef.current = snap;
@@ -10127,9 +10866,14 @@ function StatsWidget(props) {
   }, [monitor.snapshot]);
   const gamesResult = useGames(built?.conversation ?? null, { activeTab: monitor.activeTab });
   const leaderboardResult = useLeaderboard(built?.conversation ?? null, { activeTab: monitor.activeTab });
+  const getPricePresets = useCallback14(
+    (locale2) => built ? built.conversation.getPricePresets(locale2) : Promise.resolve(null),
+    [built]
+  );
+  const presetGrid = usePresetGrid({ getPricePresets, isOpen: controller.state.isOpen, locale: ui.presets.lang });
   const markTodayActivity = monitor.markTodayActivity;
-  const prevLiveCountRef = useRef17(0);
-  useEffect22(() => {
+  const prevLiveCountRef = useRef22(0);
+  useEffect26(() => {
     const rose = prevLiveCountRef.current === 0 && discovery.liveCount > 0;
     prevLiveCountRef.current = discovery.liveCount;
     if (rose) markTodayActivity();
@@ -10145,7 +10889,7 @@ function StatsWidget(props) {
     openMatchLabel: ui.openMatch
   });
   const markAdded = hostEvents.markAdded;
-  const slip = useMemo4(
+  const slip = useMemo5(
     () => {
       const handler = props.config?.onAddToSlip;
       return {
@@ -10164,7 +10908,7 @@ function StatsWidget(props) {
     },
     [props.config?.onAddToSlip, controller.state.conversationId, markAdded]
   );
-  const onDashboardTap = useMemo4(
+  const onDashboardTap = useMemo5(
     () => built ? createDashboardTapSignal((input) => built.conversation.sendSignal(input), logger) : void 0,
     [built, logger]
   );
@@ -10182,11 +10926,11 @@ function StatsWidget(props) {
   const operatorUserId = cfg?.userContext?.operatorUserId;
   const anonymousUserId = cfg?.userContext?.anonymousUserId;
   const conversationId = controller.state.conversationId ?? void 0;
-  useEffect22(() => {
+  useEffect26(() => {
     if (!logger) return;
     logger.setIdentity({ operatorUserId, anonymousUserId, conversationId });
   }, [logger, operatorUserId, anonymousUserId, conversationId]);
-  useEffect22(() => {
+  useEffect26(() => {
     if (!logger) return;
     logger.resume();
     const onHide = () => {
@@ -10204,14 +10948,14 @@ function StatsWidget(props) {
       logger.dispose();
     };
   }, [logger]);
-  useEffect22(() => {
+  useEffect26(() => {
     if (!built || !ui.injectStyles) return;
     const node = rootRef.current?.getRootNode();
     if (node) injectStyles(node);
   }, [built, ui.injectStyles]);
   if (!built) return null;
   const attrs = themeAttrs(ui);
-  return /* @__PURE__ */ jsx92(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ jsx92(HostEventsProvider, { value: hostEvents, children: /* @__PURE__ */ jsx92("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__ */ jsx92(
+  return /* @__PURE__ */ jsx94(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ jsx94(HostEventsProvider, { value: hostEvents, children: /* @__PURE__ */ jsx94("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__ */ jsx94(
     ChatPanel,
     {
       controller,
@@ -10223,9 +10967,10 @@ function StatsWidget(props) {
       gamesResult,
       leaderboardResult,
       loggedIn: !!operatorUserId,
-      conversation: built?.conversation ?? null
+      conversation: built?.conversation ?? null,
+      presetGrid
     }
-  ) : /* @__PURE__ */ jsx92(
+  ) : /* @__PURE__ */ jsx94(
     ChatFab,
     {
       label: ui.launcherLabel,