Shorten the rulings index to the words a dealer would say

Last change added an index to the rulings sheet and I wrote down what it cost: 342px
at the top of a 390px-wide sheet, so a dealer reading straight through scrolls past
the whole thing first. That was an honest trade at the time. It is also fixable.

The index was labelled with the section headings, which are sentences -- "A short
all-in doesn't reopen the betting" -- so nine of them stacked one per row. A dealer
hunting for that ruling is looking for the words "short all-in", not the sentence.

  Misdeal          Board card early    Out of turn
  Short all-in     Uncalled bet        Oversized chip
  Minimum raise    Odd chip            String bet

  phone       342px -> 143px   9 rows -> 3
  desktop      ~200 -> 70px            -> 2
  landscape          -> 94px           -> 2

The first ruling now starts 309px into the sheet on a phone rather than 440.

Each short label lives on its own section as data-short, next to the heading it
shortens, and the index falls back to the heading when there is not one -- so a ruling
added later still appears, still without anyone having to write it twice. The full
sentence stays as the button's aria-label, so the short label never costs a screen
reader the heading.

Checked at four sizes across touch and pointer contexts: nine labels, nine aria-labels,
every chip 44px on touch, jumping still lands and focuses the right heading, contrast
clean, no console errors. 244 tests still passing.

Also looked at, and left alone: the card picker refuses a card already dealt --
disabled, titled "Already dealt to Ann" -- and every one of its 52 buttons clears 44px.
A messy nine-seat table with 25/50 blinds, two folded players, a busted seat, accented
and hyphenated names, a $125,000 stack and a filled notes field audits clean at every
size but the landscape phone already known from #63.

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

JoshHeaps.Net/Pages/Casino/TexasHoldem.cshtml

@@ -296,7 +296,7 @@
 
         <nav id="rulingsIndex" class="rulingsIndex" aria-label="Jump to a ruling"></nav>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Misdeal">
             <h3>Redeal it — misdeal</h3>
             <ul>
                 <li>The first card goes to the wrong seat.</li>
@@ -306,7 +306,7 @@
             </ul>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Board card early">
             <h3>A board card turned too early</h3>
             <p>
                 If the fourth board card gets turned before the betting round is finished,
@@ -315,7 +315,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Out of turn">
             <h3>Acting out of turn</h3>
             <p>
                 A one-off is usually just backed up if no one has acted behind them.
@@ -323,7 +323,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Short all-in">
             <h3>A short all-in doesn't reopen the betting</h3>
             <p>
                 Somebody shoving in less than a full raise — say $3 more when the last
@@ -338,7 +338,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Uncalled bet">
             <h3>Chips nobody called come back</h3>
             <p>
                 Bet more than anyone was able to call and the excess is returned to you
@@ -348,7 +348,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Oversized chip">
             <h3>One big chip, nothing said</h3>
             <p>
                 The most common argument at a home table. A player facing a bet who
@@ -364,7 +364,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Minimum raise">
             <h3>A raise has to be a full raise</h3>
             <p>
                 At least as much again as the last raise, or the big blind if there
@@ -375,7 +375,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="Odd chip">
             <h3>The odd chip in a split pot</h3>
             <p>
                 When a chopped pot won't divide evenly, the odd chip goes to the first
@@ -385,7 +385,7 @@
             </p>
         </section>
 
-        <section class="ruling">
+        <section class="ruling" data-short="String bet">
             <h3>Betting in one motion — the string bet</h3>
             <p>
                 A bet is whatever goes in on the first trip to the stack, unless the

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

@@ -478,7 +478,15 @@ document.addEventListener("DOMContentLoaded", () => {
             const jump = document.createElement("button");
             jump.type = "button";
             jump.className = "rulingsIndexBtn";
-            jump.textContent = heading.textContent;
+            // A short label where the ruling gives one. The headings are sentences —
+            // "A short all-in doesn't reopen the betting" — and nine of those stacked
+            // one per row made the index 342px tall on a phone, which is most of the
+            // sheet before the first ruling. "Short all-in" says the same thing to
+            // somebody who is looking for it, and three fit on a line.
+            jump.textContent = section.dataset.short || heading.textContent;
+            // The full heading is still what it announces, so the short label never
+            // costs a screen reader the sentence.
+            if (section.dataset.short) jump.setAttribute("aria-label", heading.textContent);
             jump.addEventListener("click", () => {
                 section.scrollIntoView({ block: "start", behavior: "smooth" });
                 // The heading is what the dealer is now reading, so that is where the