pokertools-arena 0.4.5 → 0.4.9

package/README.md

@@ -17,7 +17,7 @@
 | **Package** | `npx pokertools-arena` |
 | **Runtime** | Node.js ≥ 24 for tooling; any modern browser for the app |
 
-> **Current release: 0.4.5.** A maintenance release on top of the 0.4.0 methodology work: modal tooltips float above overflow, the launcher starts exactly once when its default port is busy, real-API diagnostics skip cleanly when repository secrets are absent, the Decision sanity suite attributes results to the correct model, seat editors show the model-derived name, close buttons use centered SVG icons, decision logs no longer repeat the typed-decision caption, and Stop immediately freezes the clock and table effects.
+> **Current release: 0.4.9.** A maintenance release on top of the 0.4.0 methodology work: modal tooltips float above overflow, the launcher starts exactly once when its default port is busy, real-API diagnostics skip cleanly when repository secrets are absent, the Decision sanity suite attributes results to the correct model, seat editors show the model-derived name, close buttons use centered SVG icons, decision logs no longer repeat the typed-decision caption, Stop immediately freezes the clock and table effects, seat cards clear their last action at the start of each hand, pots fly back to winners at showdown, the header/table chrome and small-screen board cards are more compact, and the inspector is an accessible tablist with corrected poker statistics.
 
 ---
 

package/dist/app.js

@@ -115737,6 +115737,7 @@ function animateBoardCards(previousCount, currentCount) {
 }
 function processVisualEffects(s) {
   const events = s?.events || [];
+  const previous = lastVisualState;
   if (["STOPPED", "ERROR"].includes(s?.status)) {
     if (events.length) lastProcessedEventId = events.at(-1).id;
     lastVisualState = s;
@@ -115748,7 +115749,6 @@ function processVisualEffects(s) {
     lastVisualState = s;
     return;
   }
-  const previous = lastVisualState;
   if (s?.table && (!previous?.table || s.table.handNumber !== previous.table.handNumber)) animateNewHand(s);
   const prevBoard = previous?.table?.board?.length || 0, nextBoard = s?.table?.board?.length || 0;
   if (s?.table?.handNumber === previous?.table?.handNumber) animateBoardCards(prevBoard, nextBoard);
@@ -115774,12 +115774,14 @@ function processVisualEffects(s) {
       }
       showActionToast(`${displayModelName(e.configuredModel || e.resolvedModel || e.playerName)} \xB7 ${e.action?.description || type}`, type);
     }
-    if (e.type === "HAND_END" && previous?.table) {
-      const before = new Map((previous.table.players || []).filter(Boolean).map((p) => [p.id, Number(p.stack || 0)]));
-      const winners = (s?.table?.players || []).filter((p) => p && Number(p.stack || 0) > (before.get(p.id) ?? Number(p.stack || 0)));
+    if (e.type === "HAND_END") {
+      const before = new Map((previous?.table?.players || []).filter(Boolean).map((p) => [p.id, Number(p.stack || 0)]));
+      const payloadIds = (e.winners || []).map((w) => w?.playerId ?? w?.id ?? w).filter(Boolean);
+      const fromStacks = (s?.table?.players || []).filter((p) => p && Number(p.stack || 0) > (before.get(p.id) ?? Number(p.stack || 0))).map((p) => p.id);
+      const winnerIds = [.../* @__PURE__ */ new Set([...payloadIds, ...fromStacks])];
       const pot = $(".hud-pot", document);
-      winners.forEach((p, i) => setTimeout(() => flyChips(pot, seatEl(p.id), 5, true), i * 130));
-      if (winners.length) playTableSound("winner");
+      winnerIds.forEach((playerId, i) => setTimeout(() => flyChips(pot, seatEl(playerId), 5, true), i * 130));
+      if (winnerIds.length) playTableSound("winner");
     }
     if (e.type === "TOURNAMENT_END") playTableSound("winner");
   }
@@ -115978,18 +115980,21 @@ function buildPublicPlayerStats(events, players, currentHand) {
   const completedHandNumbers = new Set((events ?? []).filter((e) => e.type === "HAND_END" && Number(e.handNumber) < Number(currentHand)).map((e) => Number(e.handNumber)));
   const decisions = (events ?? []).filter((e) => e.type === "DECISION" && completedHandNumbers.has(Number(e.handNumber)));
   const handEnds = (events ?? []).filter((e) => e.type === "HAND_END" && completedHandNumbers.has(Number(e.handNumber)));
+  const handStarts = (events ?? []).filter((e) => e.type === "HAND_START" && completedHandNumbers.has(Number(e.handNumber)));
   return (players ?? []).map((player) => {
     const rows = decisions.filter((e) => e.playerId === player.id);
     const preflop = rows.filter((e) => e.street === "PREFLOP");
-    const preflopHands = new Set(preflop.map((e) => e.handNumber));
+    const dealtHands = new Set(handStarts.filter((e) => Array.isArray(e.playerIds) && e.playerIds.includes(player.id)).map((e) => Number(e.handNumber)));
+    if (!dealtHands.size) for (const e of rows) dealtHands.add(Number(e.handNumber));
     const vpipHands = new Set(preflop.filter((e) => ["CALL", "BET", "RAISE"].includes(e.action?.type)).map((e) => e.handNumber));
     const pfrHands = new Set(preflop.filter((e) => ["BET", "RAISE"].includes(e.action?.type)).map((e) => e.handNumber));
     const aggressive = rows.filter((e) => ["BET", "RAISE"].includes(e.action?.type)).length;
     const calls = rows.filter((e) => e.action?.type === "CALL").length;
     const checks = rows.filter((e) => e.action?.type === "CHECK").length;
     const folds = rows.filter((e) => e.action?.type === "FOLD").length;
+    const foldOpportunities = rows.filter((e) => (e.legalActions ?? []).some((action2) => action2.type === "FOLD")).length;
     let wins = 0;
-    const observedHands = new Set(rows.map((e) => Number(e.handNumber)));
+    const observedHands = new Set(dealtHands);
     for (const end of handEnds) {
       if ((end.winners ?? []).some((w) => (w.playerId ?? w.id ?? w) === player.id)) {
         wins++;
@@ -116001,12 +116006,13 @@ function buildPublicPlayerStats(events, players, currentHand) {
       playerId: player.id,
       playerName: player.name,
       sampleHands: observedHands.size,
-      preflopSamples: preflopHands.size,
+      preflopSamples: dealtHands.size,
       decisions: rows.length,
-      vpipPct: pct(vpipHands.size, preflopHands.size),
-      pfrPct: pct(pfrHands.size, preflopHands.size),
-      aggressionPct: pct(aggressive, aggressive + calls + checks),
-      foldPct: pct(folds, strategicActions),
+      vpipPct: pct(vpipHands.size, dealtHands.size),
+      pfrPct: pct(pfrHands.size, dealtHands.size),
+      // Standard aggression frequency (AFq), not the aggression-factor ratio.
+      aggressionPct: pct(aggressive, aggressive + calls + folds),
+      foldPct: pct(folds, foldOpportunities),
       callPct: pct(calls, strategicActions),
       checkPct: pct(checks, strategicActions),
       wins
@@ -116080,12 +116086,15 @@ function normalizeConfig(input = {}) {
     parseHeaders(c.headers);
     return { ...c, baseUrl: normalizeBaseUrl(c.baseUrl) };
   });
+  const smallBlind = Math.max(1, Math.round(Number(input.smallBlind) || 25));
+  const bigBlind = Math.max(2, Math.round(Number(input.bigBlind) || 50));
+  if (bigBlind < smallBlind * 2) throw new Error("Big blind must be at least twice the small blind");
   return {
     id: id("tournament"),
     name: "pokertools-arena",
     startingStack: Math.max(100, Math.round(Number(input.startingStack) || 1e4)),
-    smallBlind: Math.max(1, Math.round(Number(input.smallBlind) || 25)),
-    bigBlind: Math.max(2, Math.round(Number(input.bigBlind) || 50)),
+    smallBlind,
+    bigBlind,
     ante: Math.max(0, Math.round(Number(input.ante) || 0)),
     handsPerLevel: Math.max(1, Math.round(Number(input.handsPerLevel) || 8)),
     blindMultiplier: clamp(Number(input.blindMultiplier) || 1.5, 1.1, 3),
@@ -116104,8 +116113,9 @@ function normalizeConfig(input = {}) {
     players: players.map((raw, index) => {
       const lobbySeat = clamp(Math.round(Number(raw.lobbySeat ?? index)), 0, MAX_LOBBY_SEATS - 1);
       const name = String(raw.name || `Player ${lobbySeat + 1}`).trim().slice(0, 40);
-      if (names.has(name)) throw new Error(`Duplicate player name: ${name}`);
-      names.add(name);
+      const nameKey = name.toLocaleLowerCase();
+      if (names.has(nameKey)) throw new Error(`Duplicate player name: ${name}`);
+      names.add(nameKey);
       if (!connIds.has(raw.connectionId)) throw new Error(`Connection missing for ${name}`);
       const model = String(raw.model || "").trim();
       if (!model) throw new Error(`Model missing for ${name}`);
@@ -116337,6 +116347,7 @@ var TournamentDirector = class {
     await this.waitIfPaused();
     this.pruneBustedSeats();
     this.handNumber++;
+    for (const stat of Object.values(this.stats)) stat.lastAction = null;
     this.handStartStacks = Object.fromEntries((this.engine?.state?.players ?? []).filter(Boolean).map((p) => [p.id, playerStack(p)]));
     try {
       this.engine.deal();
@@ -116349,7 +116360,14 @@ var TournamentDirector = class {
       }
       this.engine.deal();
     }
-    this.logEvent("HAND_START", { handNumber: this.handNumber, buttonSeat: this.engine.state.buttonSeat, smallBlind: this.engine.state.smallBlind, bigBlind: this.engine.state.bigBlind, ante: this.engine.state.ante });
+    this.logEvent("HAND_START", {
+      handNumber: this.handNumber,
+      buttonSeat: this.engine.state.buttonSeat,
+      smallBlind: this.engine.state.smallBlind,
+      bigBlind: this.engine.state.bigBlind,
+      ante: this.engine.state.ante,
+      playerIds: (this.engine.state.players ?? []).filter((p) => p && playerStack(p) > 0).map((p) => p.id)
+    });
     this.broadcast();
   }
   handComplete() {
@@ -116476,17 +116494,13 @@ var TournamentDirector = class {
       stats.retries += Number(result?.meta?.retryCount || 0);
       if (result?.meta?.protocolFallbackTriggered) stats.protocolFallbacks++;
       if (this.currentDecision?.id !== decisionId) throw new Error("Decision became stale");
-      const elapsedActive = Math.max(0, Date.now() - startedAt - pausedTotal());
-      if (elapsedActive > baseMs) this.timeBanks[agent.id] = Math.max(0, bankBefore - (elapsedActive - baseMs));
     } catch (err) {
       elapsed = Math.max(0, Date.now() - startedAt - pausedTotal());
       error = err;
       for (const incident of err?.incidents || []) recordIncident(incident);
       errorCategory = elapsed >= totalMs - 30 || err?.name === "AbortError" ? "timeout" : decisionErrorCategory(err);
-      if (errorCategory === "timeout") {
-        stats.timeouts++;
-        this.timeBanks[agent.id] = 0;
-      } else if (errorCategory === "rate_limit") stats.rateLimits++;
+      if (errorCategory === "timeout") stats.timeouts++;
+      else if (errorCategory === "rate_limit") stats.rateLimits++;
       else if (errorCategory === "provider") stats.providerErrors++;
       else {
         stats.modelErrors++;
@@ -116495,6 +116509,8 @@ var TournamentDirector = class {
     }
     if (this.status === "STOPPED") throw new Error("Tournament stopped");
     await this.waitIfPaused();
+    const elapsedActive = Math.max(0, Date.now() - startedAt - pausedTotal());
+    this.timeBanks[agent.id] = Math.max(0, bankBefore - Math.max(0, elapsedActive - baseMs));
     let chosen = result?.action ?? null, forced = false;
     if (chosen && architecture === "hierarchical") {
       const engineAction = isAggressiveType(chosen.type) ? { type: chosen.type, playerId: agent.id, amount: Math.max(1, Math.round(asNumber(chosen.amount))) } : { type: chosen.type, playerId: agent.id };
@@ -117176,7 +117192,7 @@ function renderStatus(s) {
   els.pauseBtn.classList.toggle("hidden", !running);
   els.stopBtn.classList.toggle("hidden", !running);
   els.startTopBtn.classList.toggle("hidden", running);
-  els.seatsBtn.classList.toggle("hidden", running);
+  els.seatsBtn.classList.toggle("hidden", running || !["STOPPED", "FINISHED", "ERROR"].includes(status));
   els.setupBtn.disabled = running;
   els.testsBtn.disabled = running;
   const pauseLabel = $(".action-label", els.pauseBtn);
@@ -117509,7 +117525,7 @@ function renderStats(s) {
     const st = s.stats?.[p.id] || {}, poker = publicById.get(p.id) || {}, tableP = s.table?.players?.find?.((x) => x?.id === p.id), avg = st.decisions ? Math.round(st.totalLatencyMs / st.decisions) : 0;
     const pc = (value) => `${Math.round(Number(value || 0) * 100)}%`;
     return `<div class="stat-card"><div class="stat-top"><div><div class="stat-name">${escapeHtml(visiblePlayerName(p.name, p.model))}</div><div class="stat-model mono">${escapeHtml(p.model)} \xB7 ${escapeHtml(effectiveProtocol(p, s.config.connections.find((c) => c.id === p.connectionId)))}</div></div><strong>${fmt(tableP?.stack || 0)}</strong></div>
-      <div class="poker-profile"><div><b>${pc(poker.vpipPct)}</b><span>VPIP</span></div><div><b>${pc(poker.pfrPct)}</b><span>PFR</span></div><div><b>${pc(poker.aggressionPct)}</b><span>AGG</span></div><div><b>${pc(poker.foldPct)}</b><span>FOLD</span></div><div><b>${poker.sampleHands || 0}</b><span>SAMPLE</span></div></div>
+      <div class="poker-profile"><div title="Voluntarily put chips in pot"><b>${pc(poker.vpipPct)}</b><span>VPIP</span></div><div title="Preflop raise"><b>${pc(poker.pfrPct)}</b><span>PFR</span></div><div title="Aggression frequency"><b>${pc(poker.aggressionPct)}</b><span>AFq</span></div><div title="Fold when folding was legal"><b>${pc(poker.foldPct)}</b><span>FOLD</span></div><div><b>${poker.sampleHands || 0}</b><span>HANDS</span></div></div>
       <div class="stat-values"><div class="metric"><b>${st.decisions || 0}</b><span>moves</span></div><div class="metric"><b>${avg}ms</b><span>avg</span></div><div class="metric"><b>${st.autoFallbacks || 0}</b><span>auto</span></div></div><div class="stat-reliability"><span><b>${st.modelErrors || 0}</b> model</span><span><b>${st.providerErrors || 0}</b> provider</span><span><b>${st.rateLimits || 0}</b> rate</span><span><b>${st.timeouts || 0}</b> timeout</span><span><b>${st.protocolFallbacks || 0}</b> protocol</span><span><b>${st.retries || 0}</b> retry</span></div></div>`;
   }).join("");
 }
@@ -117545,7 +117561,7 @@ function decisionRenderSignature(s) {
   return JSON.stringify([d ? [d.id, d.playerId, d.model, d.protocol, d.provider, d.startedAt, d.baseMs, d.timeBankMs, d.pausedMs || 0, Boolean(d.pausedAt), d.architecture || null, d.stage || null, d.legalActions] : null, last?.id || null, s?.status || "IDLE", seatAssignments.filter(Boolean).length]);
 }
 function feedRenderSignature(s) {
-  return (s?.events || []).filter((e) => e.type === "DECISION").slice(-12).map((e) => e.id).join("|");
+  return (s?.events || []).filter((e) => e.type === "DECISION" || e.type === "SPECTATOR_EXPLANATION").slice(-24).map((e) => `${e.type}:${e.id}`).join("|");
 }
 function eventsRenderSignature(s) {
   const ev = s?.events || [];
@@ -117786,6 +117802,7 @@ function setRecordButton(active, label = null) {
   if (icon) icon.textContent = active ? "\u25A0" : "\u25CF";
   if (text) text.textContent = label || (active ? "Stop rec" : "Record");
   els.recordBtn.title = active ? "Stop table recording and save video" : "Record only the poker table";
+  els.recordBtn.setAttribute("aria-label", els.recordBtn.title);
 }
 function saveRecordingBlob(blob) {
   const stamp = (/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-");
@@ -118261,6 +118278,8 @@ els.soundBtn.addEventListener("click", async () => {
   if (label) label.textContent = soundEnabled ? "Sound on" : "Sound";
   els.soundBtn.setAttribute("aria-pressed", String(soundEnabled));
   els.soundBtn.classList.toggle("active", soundEnabled);
+  els.soundBtn.title = soundEnabled ? "Disable table sounds" : "Enable table sounds";
+  els.soundBtn.setAttribute("aria-label", els.soundBtn.title);
   if (soundEnabled) {
     try {
       await getAudioContext()?.resume();
@@ -118301,8 +118320,7 @@ els.exportBtn.addEventListener("click", () => {
 });
 els.seatsBtn.addEventListener("click", () => {
   if (director && ["RUNNING", "PAUSED"].includes(director.status)) return;
-  lobbyVisible = true;
-  render(currentState || { status: "IDLE", events: [] });
+  void startConfiguredTournament();
 });
 els.seatsLayer.addEventListener("click", (event) => {
   const seat = event.target.closest("[data-lobby-seat]");
@@ -118363,6 +118381,7 @@ els.setupForm.addEventListener("submit", (event) => {
   try {
     const raw = collectSetupRaw(true);
     for (const connection of raw.connections) parseHeaders(connection.headers);
+    normalizeConfig(raw);
     saveSetupWithoutSecrets(raw);
     els.setupDialog.close();
     render(currentState || { status: "IDLE", events: [] });
@@ -118403,10 +118422,20 @@ async function startConfiguredTournament() {
   }
 }
 els.startTopBtn.addEventListener("click", startConfiguredTournament);
-$$(".tab").forEach((tab) => tab.addEventListener("click", () => {
+function activateInspectorTab(tab, { focus = false } = {}) {
   activeInspectorTab = tab.dataset.tab || "live";
-  $$(".tab").forEach((t) => t.classList.toggle("active", t === tab));
-  $$(".tab-panel").forEach((p) => p.classList.toggle("active", p.id === `tab-${tab.dataset.tab}`));
+  $$(".tab").forEach((t) => {
+    const active = t === tab;
+    t.classList.toggle("active", active);
+    t.setAttribute("aria-selected", String(active));
+    t.tabIndex = active ? 0 : -1;
+  });
+  $$(".tab-panel").forEach((p) => {
+    const active = p.id === `tab-${tab.dataset.tab}`;
+    p.classList.toggle("active", active);
+    p.hidden = !active;
+  });
+  if (focus) tab.focus();
   if (!currentState) return;
   if (activeInspectorTab === "live") {
     renderMemo.feed = feedRenderSignature(currentState);
@@ -118418,7 +118447,18 @@ $$(".tab").forEach((tab) => tab.addEventListener("click", () => {
     renderMemo.stats = statsRenderSignature(currentState);
     renderStats(currentState);
   }
-}));
+}
+$$(".tab").forEach((tab) => {
+  tab.addEventListener("click", () => activateInspectorTab(tab));
+  tab.addEventListener("keydown", (event) => {
+    if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(event.key)) return;
+    event.preventDefault();
+    const tabs = $$(".tab");
+    const current = tabs.indexOf(tab);
+    const next = event.key === "Home" ? 0 : event.key === "End" ? tabs.length - 1 : (current + (event.key === "ArrowRight" ? 1 : -1) + tabs.length) % tabs.length;
+    activateInspectorTab(tabs[next], { focus: true });
+  });
+});
 window.addEventListener("beforeunload", (event) => {
   if (tableRecording) tableRecording.stream?.getTracks?.().forEach((t) => t.stop());
   if (director && ["RUNNING", "PAUSED"].includes(director.status)) {

package/dist/index.html

@@ -64,17 +64,14 @@
           <div class="brand-title">pokertools-arena</div>
         </div>
       </div>
+      <a id="repoLink" class="repo-link" href="https://github.com/pokertools-arena/pokertools-arena.github.io" target="_blank" rel="noopener noreferrer" title="View source on GitHub" aria-label="View source on GitHub"><svg class="repo-icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path fill="currentColor" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8Z"/></svg></a>
       <div class="topbar-actions">
         <button id="startTopBtn" class="button primary top-action" type="button" title="Start tournament"><span class="action-icon">▶</span><span class="action-label">Start</span></button>
-        <button id="seatsBtn" class="button ghost top-action" type="button" title="Edit seats"><span class="action-icon">♟</span><span class="action-label">Seats</span></button>
-        <button id="setupBtn" class="button ghost top-action" type="button" title="Connections and tournament settings"><span class="action-icon">⚙</span><span class="action-label">Settings</span></button>
-        <button id="testsBtn" class="button ghost top-action" type="button" title="Run the 10-spot decision sanity suite"><span class="action-icon">◇</span><span class="action-label">Tests</span></button>
-        <button id="soundBtn" class="button ghost top-action sound-button" type="button" aria-pressed="false" title="Enable table sounds"><span class="action-icon">♪</span><span class="action-label">Sound</span></button>
-        <button id="recordBtn" class="button ghost top-action record-button" type="button" aria-pressed="false" title="Record only the poker table"><span class="action-icon">●</span><span class="action-label">Record</span></button>
-        <button id="exportBtn" class="button ghost top-action" type="button" disabled title="Export tournament log"><span class="action-icon">↓</span><span class="action-label">Log</span></button>
+        <button id="seatsBtn" class="button ghost top-action hidden" type="button" title="Restart with a new tournament"><span class="action-icon">↻</span><span class="action-label">Restart</span></button>
         <button id="pauseBtn" class="button ghost top-action hidden" type="button"><span class="action-icon">Ⅱ</span><span class="action-label">Pause</span></button>
         <button id="stopBtn" class="button danger top-action hidden" type="button"><span class="action-icon">■</span><span class="action-label">Stop</span></button>
-        <a id="repoLink" class="button ghost top-action repo-action" href="https://github.com/pokertools-arena/pokertools-arena.github.io" target="_blank" rel="noopener noreferrer" title="View source on GitHub" aria-label="View source on GitHub"><svg class="action-icon repo-icon" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path fill="currentColor" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8Z"/></svg><span class="action-label">GitHub</span></a>
+        <button id="testsBtn" class="button ghost top-action" type="button" title="Run the 10-spot decision sanity suite"><span class="action-icon">◇</span><span class="action-label">Tests</span></button>
+        <button id="setupBtn" class="button ghost top-action icon-only-action" type="button" title="Connections and tournament settings" aria-label="Settings"><span class="action-icon">⚙</span><span class="action-label">Settings</span></button>
       </div>
     </header>
 
@@ -83,6 +80,10 @@
         <div class="arena-head">
           <div class="arena-status"><span id="statusDot" class="status-dot"></span><span id="statusLabel">IDLE</span></div>
           <div id="tournamentMeta" class="mono muted">Seat 2–10 models, then press Start</div>
+          <div class="arena-head-actions">
+            <button id="soundBtn" class="arena-icon-button sound-button" type="button" aria-pressed="false" title="Enable table sounds" aria-label="Enable table sounds"><span class="action-icon">♪</span></button>
+            <button id="recordBtn" class="arena-icon-button record-button" type="button" aria-pressed="false" title="Record only the poker table" aria-label="Record only the poker table"><span class="action-icon">●</span></button>
+          </div>
         </div>
 
         <div id="winnerBanner" class="winner-banner hidden" role="status" aria-live="polite"></div>
@@ -109,13 +110,13 @@
       </section>
 
       <aside class="inspector">
-        <div class="tabs">
-          <button class="tab active" data-tab="live">Live</button>
-          <button class="tab" data-tab="log">Log</button>
-          <button class="tab" data-tab="stats">Stats</button>
+        <div class="tabs" role="tablist" aria-label="Tournament inspector">
+          <button id="tabButton-live" class="tab active" data-tab="live" type="button" role="tab" aria-selected="true" aria-controls="tab-live">Live</button>
+          <button id="tabButton-log" class="tab" data-tab="log" type="button" role="tab" aria-selected="false" aria-controls="tab-log" tabindex="-1">Log</button>
+          <button id="tabButton-stats" class="tab" data-tab="stats" type="button" role="tab" aria-selected="false" aria-controls="tab-stats" tabindex="-1">Stats</button>
         </div>
 
-        <div id="tab-live" class="tab-panel active">
+        <div id="tab-live" class="tab-panel active" role="tabpanel" aria-labelledby="tabButton-live">
           <section class="panel-block decision-panel">
             <div id="decisionPanelTitle" class="panel-title">Current decision</div>
             <div id="decisionEmpty" class="empty-state">Configure seats on the table. During play, the active model, clock, and legal actions appear here.</div>
@@ -137,8 +138,13 @@
           <section class="panel-block"><div class="panel-title">Recent decisions</div><div id="decisionFeed" class="decision-feed"></div></section>
         </div>
 
-        <div id="tab-log" class="tab-panel"><section class="panel-block grow"><div class="panel-title">Tournament events</div><div id="eventLog" class="event-log mono"></div></section></div>
-        <div id="tab-stats" class="tab-panel"><section class="panel-block grow"><div class="panel-title">Models</div><div id="statsGrid" class="stats-grid"></div></section></div>
+        <div id="tab-log" class="tab-panel" role="tabpanel" aria-labelledby="tabButton-log" hidden>
+          <section class="panel-block grow">
+            <div class="panel-title-row"><div class="panel-title">Tournament events</div><button id="exportBtn" class="button ghost small-button" type="button" disabled title="Download the tournament log as JSONL"><span class="action-icon">↓</span><span class="action-label">Download</span></button></div>
+            <div id="eventLog" class="event-log mono" aria-label="Tournament event log"></div>
+          </section>
+        </div>
+        <div id="tab-stats" class="tab-panel" role="tabpanel" aria-labelledby="tabButton-stats" hidden><section class="panel-block grow"><div class="panel-title">Models</div><div id="statsGrid" class="stats-grid"></div></section></div>
       </aside>
     </main>