Stop the button's chip sitting on top of the name underneath it

A phone screenshot, mid-hand, eight-handed: the seat with the button reads
"Christop" and then a white D. The name is centred across the whole puck and the
chip sits in its top-right corner on a layer above, so a long name runs
underneath and stops — measured, "Christopher" lost 20px of its 64px box.

The bad part is the silence. The text believed it had the room it was being
painted out of, so no ellipsis appeared: nothing on screen said the name went on.
On the one seat at the table a dealer looks at most.

The name now keeps out of the chip's corner on the seat that has the button, so a
long one ends in an ellipsis before it gets there. Only that seat — every other
puck has its full width, because the chip on those is invisible.

And the audit has a check for it now. Nothing it had would have caught this: the
occlusion check is about controls a thumb has to reach, and this is a label a
dealer has to read. The new one measures every seat's name against its own chip
and badges, and the fix was undone by hand to confirm it fires — "20px under
button.dealerChip.active".

182 audits across 13 viewports, both input kinds, plain and straddled tables,
every overlay: clean.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb

JoshHeaps.Net/wwwroot/css/casino/holdem.css

@@ -318,6 +318,20 @@ button,
     margin-top: 1rem;
 }
 
+/* `hidden` means hidden.
+   
+   The attribute only carries `display: none` from the browser's own stylesheet, which
+   is the weakest rule there is: any class that sets a display — and every button here
+   sets `inline-flex` — beats it. That is not a hypothetical. Seven overlays in this
+   file already carry their own `[hidden] { display: none }` because each one was found
+   the hard way, and the eighth was a button that shipped as a 21x44 empty box under the
+   bank check on every table that didn't need it.
+   
+   One rule, for everything, so there is no ninth. */
+[hidden] {
+    display: none !important;
+}
+
 /* ---------- Poker table ---------- */
 
 #pokerTableWrap {
@@ -608,6 +622,14 @@ button,
     margin-top: 0.6rem;
 }
 
+/* The button's chip sits in this puck's top-right corner, on a layer above the text.
+   Reserving its width means a long name ends in an ellipsis before it reaches the
+   chip, rather than disappearing underneath one — on the one seat at the table a
+   dealer looks at most. */
+.seat.seatHasButton .seatPuckName {
+    padding-right: 22px;
+}
+
 .seatPuckCards {
     font-size: 0.68rem;
     font-weight: 700;
@@ -2338,6 +2360,9 @@ body.hasActionBar #holdemSidebar {
 .waitingAdd .holdemBtn {
     flex: none;
     min-height: 44px;
+    /* "Add" is three letters, which came out 43px wide — one pixel under the rule, and
+       the audit called it. A thumb doesn't know the word is short. */
+    min-width: 56px;
 }
 
 .waitingList {

JoshHeaps.Net/wwwroot/js/casino/holdem/betting.js

@@ -459,6 +459,47 @@ const Betting = {
         return (state.street || "preflop") === "preflop" && state.seats.every(p => !p.hasActed);
     },
 
+    // Chips the pot has been priced with but nobody has actually paid.
+    //
+    // Two ways a contribution gets into this tool. Tapping the action moves chips: the
+    // bet leaves the stack, sits in front of the player, and is swept into their hand
+    // total at the end of the street. The other way is the "without live betting" panel
+    // — a base pot amount, or chips counted out on a seat — where the dealer is
+    // recording a hand they are watching rather than driving, and nothing ever leaves
+    // anybody's stack.
+    //
+    // The pot wizard prices both the same way, and awarding it credits the winner. So
+    // in that second mode the table simply grew: measured at a three-handed table with
+    // a $50 base pot, paying the pot took the chips on the table from $600 to $750 and
+    // left the bank check blaming a rebuy that never happened.
+    //
+    // So before the pot is pushed, whatever was assumed rather than taken comes off the
+    // stacks that assumed it. Chips already committed or swept are left alone; they
+    // have been paid once already, and taking them twice is the same bug the other way
+    // round.
+    collectAssumedContributions(state) {
+        const taken = [];
+        state.seats.forEach((player, index) => {
+            const priced = HoldemState.computeContribution(player, state.chipLegend, state.basePotAmount);
+            const alreadyPaid = this.round(this.committed(player) + (Number(player.amountOverride) || 0));
+            const owed = this.round(priced - alreadyPaid);
+            if (owed <= this.EPSILON_CHIPS) return;
+
+            // Never more than they are holding. A seat priced above its own stack is a
+            // dealer's typo or a player who is short, and inventing the difference is
+            // what this whole function exists to stop.
+            const moved = this.round(Math.min(owed, this.stackOf(state, player)));
+            if (moved <= this.EPSILON_CHIPS) return;
+
+            player.stack = this.round(this.stackOf(state, player) - moved);
+            // Recorded where a swept bet lives, so the money is in exactly the place
+            // the rest of the tool looks for chips that are in the middle this hand.
+            player.amountOverride = this.round((Number(player.amountOverride) || 0) + moved);
+            taken.push({ index, name: HoldemState.displayName(player, index), amount: moved });
+        });
+        return { taken, total: this.round(taken.reduce((sum, row) => sum + row.amount, 0)) };
+    },
+
     // A misdeal: the hand never happened, so every chip goes back where it came from.
     //
     // The rulings sheet in this tool has told dealers to redeal since the day it was

JoshHeaps.Net/wwwroot/js/casino/holdem/main.js

@@ -69,7 +69,7 @@ document.addEventListener("DOMContentLoaded", () => {
                 hooks.rerender();
                 return;
             }
-            const occupied = (seat.name || "").trim() || Number(seat.buyIns) > 0 || Number(seat.stack) > 0;
+            const occupied = HoldemState.seatInPlay(seat);
             if (occupied) {
                 Toast.show(`${HoldemState.displayName(seat, index)} is already in that seat.`, { duration: 3500 });
                 hooks.rerender();
@@ -261,6 +261,11 @@ document.addEventListener("DOMContentLoaded", () => {
                 if (rake > 0) {
                     state.rakeTaken = Money.round((Number(state.rakeTaken) || 0) + rake);
                 }
+                // Anything the pot was priced with but nobody actually paid — the
+                // base pot and counted chips of the no-live-betting flow — comes off
+                // the stacks that owe it before the winner is paid. Otherwise the
+                // table gains the whole pot out of nowhere.
+                Betting.collectAssumedContributions(state);
                 if (payouts.length > 0) {
                     HoldemState.recordHand(state, payouts, rake);
                     // Winnings go straight back in front of the player, so the next
@@ -366,12 +371,11 @@ document.addEventListener("DOMContentLoaded", () => {
     // in progress. Shrinking the table throws these away permanently, and it also
     // orphans them in the session standings, where they keep their winnings but lose
     // the stack and buy-in the settle-up is worked out from.
-    const seatHasSomeoneIn = player =>
-        !!(player.name && player.name.trim()) ||
-        player.inHand ||
-        (Number(player.stack) || 0) > 0 ||
-        (Number(player.buyIns) || 0) > 0 ||
-        (Number(player.amountOverride) || 0) > 0;
+    // One question, asked in one place. This predicate existed here, in the seat menu,
+    // in the action bar and twice in the state module, in four slightly different
+    // spellings — and a chair that counts as occupied for the waiting list but empty
+    // for the seat count is how somebody's chips get thrown away.
+    const seatHasSomeoneIn = player => HoldemState.seatInPlay(player);
 
     document.getElementById("seatCountInput").addEventListener("change", async e => {
         const requested = Math.max(2, Math.min(24, Math.floor(Number(e.target.value)) || state.seatCount));

JoshHeaps.Net/wwwroot/js/casino/holdem/render.js

@@ -408,6 +408,12 @@ const Render = {
             const dealerChip = node.querySelector(".dealerChip");
             const hasButton = index === dealerIndex;
             dealerChip.classList.toggle("active", hasButton);
+            // Marked on the seat as well as the chip, so the puck's own text can keep
+            // out from under it. A name is centred across the whole puck and the chip
+            // sits in the corner on a layer above: measured, "Christopher" on the
+            // button lost 20px of its 64px box to the chip and showed no ellipsis,
+            // because the text believed it had the room it was painted out of.
+            node.classList.toggle("seatHasButton", hasButton);
             dealerChip.classList.toggle("hidden", !!this.state.dedicatedDealer);
             // Every one of these announced itself as "D", so a screen reader heard a row
             // of nine identical buttons and couldn't tell which seat held the real one.
@@ -936,14 +942,20 @@ const Render = {
         const list = document.getElementById("colourUpList");
         if (!host || !list) return;
 
+        // What each player is holding, asked the same way the felt asks it — which
+        // includes the table's starting stack standing in for a seat that has never
+        // been given one. Reading `player.stack` here meant that a table opened the
+        // ordinary way, with "everyone starts with 200", showed an empty colour-up
+        // panel: nobody to count out, at the table where every single stack is a
+        // round number made of the largest chips there are.
         const legend = this.state.chipLegend || [];
         const rows = this.state.seats
-            .map((player, index) => ({ player, index }))
-            .filter(({ player }) => Betting.round(Number(player.stack) || 0) > 0)
-            .map(({ player, index }) => ({
+            .map((player, index) => ({ player, index, held: HoldemState.chipsHeldBy(this.state, player) }))
+            .filter(({ held }) => held > 0)
+            .map(({ player, index, held }) => ({
                 name: HoldemState.displayName(player, index),
-                stack: Betting.round(Number(player.stack) || 0),
-                chips: Money.formatChipBreakdown(Number(player.stack) || 0, legend),
+                stack: held,
+                chips: Money.formatChipBreakdown(held, legend),
             }))
             .filter(row => row.chips);
 

JoshHeaps.Net/wwwroot/js/casino/holdem/seatMenu.js

@@ -52,8 +52,7 @@ const SeatMenu = {
         // the queue is offered, for the same reason the panel only offers them — a list
         // that isn't kept in order is just a pile of names.
         const waiting = (this.state.waitingList || [])[0];
-        const emptyChair = !(player.name || "").trim() &&
-            !(Number(player.buyIns) > 0) && !(Number(player.stack) > 0);
+        const emptyChair = !HoldemState.seatInPlay(player);
         if (waiting && emptyChair) {
             actions.push({
                 label: `Seat ${waiting.name}`,
@@ -65,7 +64,7 @@ const SeatMenu = {
         // Leaving for the night, which is a different thing from sitting out a hand:
         // the chips go back over the rail and the chair opens. Offered only for a seat
         // that has somebody in it, since an empty chair has nobody to pay.
-        if ((player.name || "").trim() || Number(player.buyIns) > 0 || Number(player.stack) > 0) {
+        if (HoldemState.seatInPlay(player)) {
             actions.push({ label: "Cash out…", run: () => this.hooks.cashOut(index) });
         }
 

JoshHeaps.Net/wwwroot/js/casino/holdem/state.js

@@ -917,8 +917,7 @@ const HoldemState = {
     openSeats(state) {
         return state.seats
             .map((player, index) => ({ player, index }))
-            .filter(({ player }) => !(player.name || "").trim() &&
-                !(Number(player.buyIns) > 0) && !(Number(player.stack) > 0))
+            .filter(({ player }) => !this.seatInPlay(player))
             .map(({ index }) => index);
     },
 
@@ -929,7 +928,7 @@ const HoldemState = {
     seatFromWaitingList(state, id, index) {
         const seat = state.seats[index];
         if (!seat) return { ok: false, reason: "There's no such seat." };
-        if ((seat.name || "").trim() || Number(seat.buyIns) > 0 || Number(seat.stack) > 0) {
+        if (this.seatInPlay(seat)) {
             return { ok: false, reason: `${this.displayName(seat, index)} is already in that seat.` };
         }
         const entry = this.removeFromWaitingList(state, id);

tests/holdem/assumedContributions.test.js

@@ -0,0 +1,175 @@
+// Chips the pot was priced with that nobody actually paid.
+//
+// There are two ways a contribution gets into this tool. Tapping the action moves
+// chips: the bet leaves the stack, sits in front of the player, and is swept into their
+// hand total at the end of the street. The other is the "without live betting" panel —
+// a base pot amount, or chips counted out on a seat — where the dealer is recording a
+// hand they are watching rather than driving, and nothing ever leaves a stack.
+//
+// The pot wizard prices both the same way and awarding it credits the winner, so in
+// that second mode the table simply grew.
+const test = require("node:test");
+const { describe } = require("node:test");
+const assert = require("node:assert");
+const { Money, Betting, HoldemState, chipsOnTable } = require("./load");
+
+const basePotTable = (base = 50, stack = 200) => {
+    const state = HoldemState.createDefault();
+    HoldemState.resizeSeats(state, 4);
+    state.basePotAmount = base;
+    ["Ann", "Ben", "Cal"].forEach((name, i) => {
+        state.seats[i].name = name;
+        state.seats[i].inHand = true;
+        state.seats[i].stack = stack;
+        state.seats[i].buyIns = stack;
+    });
+    return state;
+};
+
+const pricedPot = (state) => state.seats.reduce(
+    (sum, p) => sum + HoldemState.computeContribution(p, state.chipLegend, state.basePotAmount), 0);
+
+describe("what nobody paid", () => {
+    test("comes off the stacks that owe it", () => {
+        const state = basePotTable();
+        const collected = Betting.collectAssumedContributions(state);
+        assert.equal(collected.total, 150);
+        assert.deepEqual(collected.taken.map(row => row.name), ["Ann", "Ben", "Cal"]);
+        assert.deepEqual(state.seats.slice(0, 3).map(p => p.stack), [150, 150, 150]);
+    });
+
+    test("and lands where the rest of the tool looks for chips in the middle", () => {
+        const state = basePotTable();
+        Betting.collectAssumedContributions(state);
+        assert.deepEqual(state.seats.slice(0, 3).map(p => p.amountOverride), [50, 50, 50]);
+        assert.equal(HoldemState.unresolvedContributions(state), 150);
+    });
+
+    test("chips counted out on a seat are money too", () => {
+        const state = basePotTable(0);
+        state.seats[0].chipCounts = { red: 4 };    // four $5 chips
+        const collected = Betting.collectAssumedContributions(state);
+        assert.equal(collected.total, 20);
+        assert.equal(state.seats[0].stack, 180);
+    });
+});
+
+describe("what has already been paid", () => {
+    test("a live bet is left exactly alone", () => {
+        const state = basePotTable(0);
+        state.smallBlind = 5;
+        state.bigBlind = 10;
+        Betting.beginHand(state);
+        const before = state.seats.map(p => Betting.stackOf(state, p));
+
+        const collected = Betting.collectAssumedContributions(state);
+        assert.equal(collected.total, 0, "the blinds are already off their stacks");
+        assert.deepEqual(state.seats.map(p => Betting.stackOf(state, p)), before);
+    });
+
+    test("nor is a swept street taken a second time", () => {
+        const state = basePotTable(0);
+        state.smallBlind = 5;
+        state.bigBlind = 10;
+        Betting.beginHand(state);
+        Betting.sweepToHandTotals(state);
+        const before = state.seats.map(p => Betting.stackOf(state, p));
+
+        assert.equal(Betting.collectAssumedContributions(state).total, 0);
+        assert.deepEqual(state.seats.map(p => Betting.stackOf(state, p)), before);
+    });
+
+    test("a base pot on top of a live bet only collects the difference", () => {
+        // The base pot says "assume everyone is in for fifty". Somebody who has already
+        // put twenty in owes thirty of it, not fifty.
+        const state = basePotTable(50);
+        state.seats[0].committed = 20;
+        state.seats[0].stack = 180;
+        const collected = Betting.collectAssumedContributions(state);
+        const ann = collected.taken.find(row => row.name === "Ann");
+        assert.equal(ann.amount, 30);
+        assert.equal(state.seats[0].stack, 150, "fifty in the middle, either way");
+    });
+});
+
+describe("what it will not do", () => {
+    test("take more than a player is holding", () => {
+        const state = basePotTable(50);
+        state.seats[1].stack = 20;
+        Betting.collectAssumedContributions(state);
+        assert.equal(state.seats[1].stack, 0, "all of it, and no further");
+        assert.equal(state.seats[1].amountOverride, 20);
+    });
+
+    test("touch an empty chair", () => {
+        const state = basePotTable();
+        const before = { ...state.seats[3] };
+        Betting.collectAssumedContributions(state);
+        assert.equal(state.seats[3].stack, before.stack);
+        assert.equal(state.seats[3].amountOverride, before.amountOverride);
+    });
+
+    test("or a seat that isn't in the hand", () => {
+        // The base pot stands in for "everyone put the same in", and somebody sitting
+        // out did not.
+        const state = basePotTable();
+        state.seats[2].inHand = false;
+        const collected = Betting.collectAssumedContributions(state);
+        assert.deepEqual(collected.taken.map(row => row.name), ["Ann", "Ben"]);
+        assert.equal(state.seats[2].stack, 200);
+    });
+});
+
+describe("the whole hand", () => {
+    test("conserves the chips on the table, which it did not before", () => {
+        const state = basePotTable();
+        const total = chipsOnTable(state);
+        const pot = pricedPot(state);
+
+        Betting.collectAssumedContributions(state);
+        Betting.creditWinnings(state, [{ id: state.seats[0].id, label: "Ann", amount: pot }]);
+        HoldemState.startNextHand(state);
+
+        assert.equal(chipsOnTable(state), total, "six hundred before, six hundred after");
+        assert.deepEqual(state.seats.slice(0, 3).map(p => p.stack), [300, 150, 150]);
+        assert.equal(HoldemState.bankReconciliation(state).balanced, true);
+    });
+
+    test("and the bank check stays balanced all the way through", () => {
+        const state = basePotTable();
+        assert.equal(HoldemState.bankReconciliation(state).balanced, true);
+        Betting.collectAssumedContributions(state);
+        assert.equal(HoldemState.bankReconciliation(state).balanced, true, "chips are in the middle, not gone");
+        Betting.creditWinnings(state, [{ id: state.seats[0].id, label: "Ann", amount: 150 }]);
+        HoldemState.startNextHand(state);
+        assert.equal(HoldemState.bankReconciliation(state).balanced, true);
+    });
+
+    test("a live-betting hand is unchanged by any of this", () => {
+        const state = basePotTable(0);
+        state.smallBlind = 5;
+        state.bigBlind = 10;
+        const total = chipsOnTable(state);
+        Betting.beginHand(state);
+        [3, 0, 1, 2].forEach(() => { if (state.actingSeatIndex !== null) Betting.call(state, state.actingSeatIndex); });
+        Betting.sweepToHandTotals(state);
+        const pot = HoldemState.unresolvedContributions(state);
+
+        Betting.collectAssumedContributions(state);
+        Betting.creditWinnings(state, [{ id: state.seats[0].id, label: "Ann", amount: pot }]);
+        HoldemState.startNextHand(state);
+
+        assert.equal(chipsOnTable(state), total);
+        assert.equal(HoldemState.bankReconciliation(state).balanced, true);
+    });
+
+    test("collecting twice takes nothing the second time", () => {
+        // The pot wizard can be opened, cancelled and opened again.
+        const state = basePotTable();
+        Betting.collectAssumedContributions(state);
+        const stacks = state.seats.map(p => p.stack);
+        const again = Betting.collectAssumedContributions(state);
+        assert.equal(again.total, 0);
+        assert.deepEqual(state.seats.map(p => p.stack), stacks);
+    });
+});

tests/holdem/oneStackRule.test.js

@@ -0,0 +1,133 @@
+// One question, one answer.
+//
+// The round before this found the bank check and the standings reading `seat.stack`
+// where the felt reads the table's starting stack — two parts of the tool disagreeing
+// about how much money is on the table. This is the sweep that followed: everywhere
+// else the same two questions get asked, asked the same way.
+//
+//   "What is this seat holding?"      -> HoldemState.chipsHeldBy
+//   "Is anybody in this chair?"       -> HoldemState.seatInPlay
+const test = require("node:test");
+const { describe } = require("node:test");
+const assert = require("node:assert");
+const { HoldemState, Betting, SettleUp } = require("./load");
+
+const openedOnTheDefault = (stack = 200) => {
+    const state = HoldemState.createDefault();
+    HoldemState.resizeSeats(state, 6);
+    state.defaultStack = stack;
+    ["Ann", "Ben", "Cal"].forEach((name, i) => {
+        state.seats[i].name = name;
+        state.seats[i].inHand = true;
+        state.seats[i].buyIns = stack;
+    });
+    return state;
+};
+
+describe("what a seat is holding", () => {
+    test("is the same number the felt plays with", () => {
+        const state = openedOnTheDefault();
+        state.seats.forEach((player, i) => {
+            if (i > 2) return;
+            assert.equal(HoldemState.chipsHeldBy(state, player), Betting.stackOf(state, player));
+        });
+    });
+
+    test("and is nothing at all for an empty chair", () => {
+        const state = openedOnTheDefault();
+        // Betting's own answer for an empty chair is the table default, because it is
+        // only ever asked about seats that are in a hand. The money side has to ask
+        // about all ten chairs, so it checks whether anybody is in them first.
+        assert.equal(Betting.stackOf(state, state.seats[5]), 200);
+        assert.equal(HoldemState.chipsHeldBy(state, state.seats[5]), 0);
+    });
+
+    test("counts a stack the dealer typed over the table's default", () => {
+        const state = openedOnTheDefault();
+        state.seats[0].stack = 75;
+        assert.equal(HoldemState.chipsHeldBy(state, state.seats[0]), 75);
+    });
+});
+
+describe("is anybody in this chair", () => {
+    const empty = () => HoldemState.createDefault().seats[0];
+
+    test("an untouched chair is empty", () => {
+        assert.equal(HoldemState.seatInPlay(empty()), false);
+        assert.equal(HoldemState.seatInPlay(null), false);
+    });
+
+    test("a name, chips, cash, a bet or a dealt hand all count", () => {
+        [
+            ["a name", p => { p.name = "Ann"; }],
+            ["chips", p => { p.stack = 50; }],
+            ["cash taken", p => { p.buyIns = 100; }],
+            ["a bet in front of them", p => { p.committed = 5; }],
+            ["money already swept in", p => { p.amountOverride = 20; }],
+            ["a hand dealt to them", p => { p.inHand = true; }],
+        ].forEach(([what, mark]) => {
+            const seat = empty();
+            mark(seat);
+            assert.equal(HoldemState.seatInPlay(seat), true, what);
+        });
+    });
+
+    test("whitespace is not a name", () => {
+        const seat = empty();
+        seat.name = "   ";
+        assert.equal(HoldemState.seatInPlay(seat), false);
+    });
+});
+
+describe("the parts that used to disagree", () => {
+    test("the open seats and the seat count see the same empty chairs", () => {
+        const state = openedOnTheDefault();
+        // Three players, six chairs.
+        assert.deepEqual(HoldemState.openSeats(state), [3, 4, 5]);
+        const occupied = state.seats.filter(p => HoldemState.seatInPlay(p)).length;
+        assert.equal(occupied + HoldemState.openSeats(state).length, state.seats.length);
+    });
+
+    test("a chair holding only a dealt hand is not offered to the waiting list", () => {
+        // The old test looked at name, buy-ins and stack. A seat marked in-hand with
+        // none of those would have been handed to the next person in the queue, on top
+        // of whoever was already playing it.
+        const state = openedOnTheDefault();
+        state.seats[4].inHand = true;
+        assert.deepEqual(HoldemState.openSeats(state), [3, 5]);
+
+        HoldemState.addToWaitingList(state, "Priya");
+        const result = HoldemState.seatFromWaitingList(state, state.waitingList[0].id, 4);
+        assert.equal(result.ok, false);
+    });
+
+    test("the bank, the standings and the settle-up all price the night the same way", () => {
+        const state = openedOnTheDefault();
+        state.seats[0].stack = 320;   // Ann is up
+        state.seats[1].stack = 80;    // Ben is down
+
+        const bank = HoldemState.bankReconciliation(state);
+        const standings = HoldemState.sessionStandings(state);
+        const chipsFromStandings = standings
+            .filter(row => !row.cashedOut)
+            .reduce((sum, row) => sum + row.chipsInFront, 0);
+
+        assert.equal(bank.chipsInPlay, chipsFromStandings, "same chips on the table");
+        assert.equal(bank.balanced, true);
+
+        // And the payments the dealer is told to make add up to the same money.
+        const plan = SettleUp.plan(standings);
+        const owed = standings.reduce((sum, row) => sum + Math.max(0, row.cashPosition), 0);
+        const paid = plan.payments.reduce((sum, row) => sum + row.amount, 0);
+        assert.equal(paid + (plan.shortBy || 0) - (plan.overBy || 0), owed);
+    });
+
+    test("a player still holding the table's starting stack is in all three", () => {
+        const state = openedOnTheDefault();
+        const standings = HoldemState.sessionStandings(state);
+        assert.equal(standings.length, 3);
+        assert.deepEqual(standings.map(row => row.chipsInFront), [200, 200, 200]);
+        assert.equal(HoldemState.bankReconciliation(state).chipsInPlay, 600);
+        assert.deepEqual(SettleUp.plan(standings).payments, [], "everyone is even, so nobody pays anybody");
+    });
+});

tests/holdem/uiAudit.js

@@ -719,6 +719,64 @@ const LayoutAudit = {
         return { name: "the felt shows one dealer button", offenders };
     },
 
+    // Anything that says it is hidden and is drawn anyway.
+    //
+    // `hidden` gets its `display: none` from the browser's own stylesheet, the weakest
+    // rule in the cascade, so any class that sets a display beats it — and in this tool
+    // every button class does. The result is an element the code believes is gone,
+    // sitting on the screen: found as a 21x44 empty box under the bank check, and this
+    // file's own touch check had been calling it "could not be probed" rather than
+    // saying the plainer thing, which is that it should not be there at all.
+    hiddenButPainted() {
+        const offenders = [...document.querySelectorAll("[hidden]")]
+            .filter(el => {
+                const rect = el.getBoundingClientRect();
+                if (rect.width === 0 || rect.height === 0) return false;
+                const style = getComputedStyle(el);
+                return style.display !== "none" && style.visibility !== "hidden";
+            })
+            .map(el => `${this.describe(el)} :: hidden, but drawn ${Math.round(el.getBoundingClientRect().width)}x${Math.round(el.getBoundingClientRect().height)}`);
+        return { name: "hidden means hidden", offenders };
+    },
+
+    // A seat's name, painted under the decoration on its own puck.
+    //
+    // The chip that marks the button sits in the puck's top-right corner on a layer
+    // above the text, and the name is centred across the whole width. A long one
+    // therefore ran underneath it and stopped — measured, "Christopher" on the button
+    // lost 20px of its 64px box and showed no ellipsis, because as far as the text was
+    // concerned it had all the room it needed. Nothing else here would have caught it:
+    // the occlusion check is about controls a thumb has to reach, and this is a label
+    // a dealer has to read.
+    seatLabelsClear() {
+        const offenders = [];
+        document.querySelectorAll(".seat").forEach(seat => {
+            const name = seat.querySelector(".seatPuckName");
+            if (!name || !name.textContent.trim()) return;
+            const box = name.getBoundingClientRect();
+            if (!box.width || !box.height) return;
+            // Padding is room the text has already been kept out of, so it is not
+            // somewhere the text can be covered.
+            const style = getComputedStyle(name);
+            const textLeft = box.left + parseFloat(style.paddingLeft || 0);
+            const textRight = box.right - parseFloat(style.paddingRight || 0);
+
+            seat.querySelectorAll(".dealerChip, .blindBadge").forEach(mark => {
+                const over = mark.getBoundingClientRect();
+                if (!over.width || !over.height) return;
+                const marked = getComputedStyle(mark);
+                if (marked.display === "none" || marked.visibility === "hidden" ||
+                    parseFloat(marked.opacity) < 0.05) return;
+                const covered = Math.min(textRight, over.right) - Math.max(textLeft, over.left);
+                const vertical = Math.min(box.bottom, over.bottom) - Math.max(box.top, over.top);
+                if (covered > 1 && vertical > 1) {
+                    offenders.push(`${this.describe(name)} :: ${Math.round(covered)}px under ${this.describe(mark)}`);
+                }
+            });
+        });
+        return { name: "seat names aren't painted under their own badges", offenders };
+    },
+
     // ---- Runner ----
 
     // Every check this file knows how to make, every time.
@@ -747,6 +805,8 @@ const LayoutAudit = {
             this.fieldFontSize(),
             this.seatOwnership(),
             this.oneDealerButton(),
+            this.hiddenButPainted(),
+            this.seatLabelsClear(),
             this.contrast(options.contrast),
             this.touchTargets(options.minimumTarget, options.touchTargets),
         ];