<!--
TrigammonX v5.1.5 — Bar Re-entry Inner-Table Rule Fix
Source: complete supplied v5.1.4 package + supplied Play-TrigammonX launcher.

RULE FIX ONLY:
- Red Bar entry: Blue inner table points 1–6; die 1→6 ... die 6→1.
- Green Bar entry: Red inner table points 13–18; die 1→18 ... die 6→13.
- Blue Bar entry: Green inner table points 25–30; die 1→30 ... die 6→25.

The shared BAR_ENTRY_POINTS table remains the single source consumed by
human legality, AI planning, hit-on-entry, blocked-entry and max-dice-use.
No movement paths, board geometry, checker anchors, RNG, opening roll,
bearing-off rules, turn order, scoring, save schema or unrelated UI logic
were changed.
-->
<!--
TrigammonX v3.7.2 — Decision Analysis Foundation (Data Capture Only)
(Source: the COMPLETE approved TrigammonX v3.6.2 READY package, used as the
ONLY source for this pass. Nothing was derived from any older package, and
the supplied v3.6.2 source itself was never modified.)

PURE DATA-CAPTURE FOUNDATION ONLY — THIS RELEASE DOES NOT JUDGE MOVES. No
move-quality classification, equity, win-probability, or "best move" logic
of any kind is computed, stored, or shown anywhere in this release. Live
gameplay, Official 2 Dice / Triple Dice rules, the AI, RNG, simulation
engine, Tournament scoring, Tournament Clock, Winner Archive data model,
Career Stats, board library, update-checker, voice/commentary, and every
other existing system are all UNCHANGED and play exactly as v3.6.2.

Adds a lightweight, append-only "decision record" captured once per
completed human or AI turn (and once for the Official 2 Dice opening
roll's own first movement) — a compact snapshot of position-before, dice,
the actual move sequence played, position-after, player/actor type
(human vs AI), Regular/Tournament play mode, and (in Tournament Mode only)
match target/game number/score/clock-reserve CONTEXT, captured with zero
new move-tree search or enumeration. The engine's own existing
getMaxDiceConstrainedMoves() result — already computed at roll time on
every turn, human and AI alike, for the pre-existing must-move/legal-move
logic — is read (never recomputed) to honestly record whether a turn's
first move was forced (zero or one legal option) or had multiple choices;
whenever confirming this would require new exhaustive whole-turn search
(the common 2+-die case), the record honestly stores null rather than
guessing. Decision records persist through the existing unified save/load
pipeline (serializeGameState()/restoreGameState(), 09-saves.js) exactly
like every other additive field this project has ever shipped: an old
v3.6.2 save simply lacks the key and loads with empty analysis data, no
corruption, no schema migration. A capped, oldest-evicted-first storage
safeguard (ADX_MAX_DECISION_RECORDS) prevents uncontrolled localStorage
growth over a long play session. A new Developer/Admin-only (never
player-facing) "Decision Analysis (Data Capture)" panel inside the
existing DEVELOPER / ADMIN shell adds a small diagnostic summary (record
counts by actor type and forced-status, approximate stored size — no
move-quality labels of any kind) and an "Export Analysis Data" JSON
download button, reusing the existing hxDownloadTextFile() helper. No
capture of any kind ever runs during Auto Match/headless/simulation
batches — the same triple guard (autoMatchRunning/headlessSimulationActive/
simulationBatchActive) the existing Game/Match History system
(hxRecordEvent(), 02-state-utils.js) already uses.
-->
<!--
TrigammonX v3.6.2 — Beta Link Correction
(Source: approved TrigammonX v3.6.1 READY package.)
SMALL NAVIGATION HOTFIX ONLY. The game's Beta/feedback entry points now open
https://trigammonx.com/beta/ — the consolidated public Beta information, play
and feedback page. No gameplay, audio, music, rules, AI, RNG, simulation,
Tournament, clocks, statistics, history, saves, certificate, board or voice
logic changed.
-->
<!--
TrigammonX v3.6.1 — Music Path + Header Quick Controls Hotfix
(Source: approved TrigammonX v3.6.0 READY package.)

SMALL MUSIC/UI HOTFIX ONLY. Corrects the five Background Music URLs to the
actual production location /xgame/xmusic/, and adds prominent quick Music
On/Off + Volume controls in the main header. The full Track and Loop controls
remain in the existing Background Music card. Browser autoplay policy is still
respected: TrigammonX attempts playback on page load; if the browser blocks
audible autoplay, the header control changes to “♫ Start Music” and the first
normal click/tap/key interaction can start it. No gameplay, AI, RNG, rules,
Tournament, Tournament Clock, statistics, history, saves, certificate, board,
voice/commentary, or update-checker logic changes.
-->
<!--
TrigammonX v3.6.0 — Background Music System
(Source: the COMPLETE approved TrigammonX v3.5.3 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.5.3 source itself was never modified. The locked, validated
historical Core/Simulation baseline trigammonx-v257-simulation-lab-stable.html
was not opened, referenced, or modified by this pass.)

MODULAR AUDIO / UI FEATURE RELEASE ONLY — no gameplay, Official 2 Dice
opening-roll rule, Triple Dice, AI, RNG, simulation, Tournament logic,
Tournament Clock, Save/Load game-state semantics, Winner Archive data model,
Career Stats calculations, statistics calculations, board library,
update-checker logic, or existing voice/commentary behaviour changes, and no
opportunistic fixes/unrelated refactors. Adds optional, low-volume ambient
BACKGROUND MUSIC: five pre-recorded tracks (Chill/Ambient/Calm/Motivation/
Future) served from /xmusic/ on the production server (not packaged into
this versioned folder — see the change report), played through ONE shared,
reused `Audio` object (never five simultaneous elements), mirroring the
existing single-reusable-`<audio>`-element pattern already used by
commentaryAudioEl/voiceSpeedSampleAudioEl (js/07-commentary.js). A new
compact "Background Music" card (On/Off, Track, Volume, Loop) sits directly
below the existing Table Talk / Voice controls (Play-TrigammonX.html,
`.under-board-music` / `.music-controls` CSS), with its own independent
localStorage preferences (trigammonx_music_enabled/_track/_volume/_loop) —
entirely separate from, and never tied to, the existing UI Sound toggle or
Voice On/Off. First-time defaults: Music On, Chill, Volume 25%, Loop On.
Handles the browser audible-autoplay restriction correctly: attempts
playback once on load, and — if blocked — arms a one-time first-click/tap/
key listener that starts the track and then removes itself, with no retry
loop, no console spam, and no special "Play Music" button. Music is paused
when the tab/page is hidden and resumed on return only if Music is still On
(Page Visibility API, a new sibling listener beside the existing Tournament/
Game clock repaint listener — 10-clocks-themes-ui.js) — gameplay and the
Tournament Clock are completely untouched by this. All Background Music
logic lives in `js/10-clocks-themes-ui.js` (the file that already owns UI
Sound/analytics/update-checker), following this project's established
convention of folding small self-contained presentation features into an
existing file rather than adding a 13th `<script>` tag. See
TrigammonX-v3.6.0-change-report.md for the full write-up, every file/
function touched, and the complete test matrix.

Preserves, unchanged: the Official 2 Dice opening-roll rule, Triple Dice, all
AI/RNG/simulation/Tournament logic, the Tournament Clock, Save/Load and
autosave/recovery, the Winner Archive's storage schema and every one of its
existing functions, Career Stats, the Winner Certificate (standalone trophy,
masthead logo, branding, charts/stats, Dice Numbers Rolled, JPG/PNG export
architecture), the smart update-check mechanism, the current Board Design
library, board preview, Full UI Themes, existing Voice controls and
commentary, UI Sound, social sharing, and the Tony "undefined Available
Moves" hotfix.
-->
<!--
TrigammonX v3.5.3 — Branding + Asset Rendering Cleanup Hotfix
(Source: the COMPLETE approved TrigammonX v3.5.2 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.5.2 source itself was never modified. The locked, validated
historical Core/Simulation baseline trigammonx-v257-simulation-lab-stable.html
was not opened, referenced, or modified by this pass.)

SMALL HOTFIX / UI CLEANUP RELEASE ONLY — no gameplay, opening-roll, Triple
Dice, AI, RNG, simulation, Tournament, Save/Load, Winner Archive data model,
Career Stats calculations, statistics calculations, sharing/export
architecture, board library, or update-checker LOGIC changes, and no new
systems. Five goals: (1) the Winner Archive viewer's opened certificate no
longer shows blank/black trophy and board-design areas — root cause: those
two assets are drawn into ONE flattened canvas image for on-screen display
(the only certificate consumer that does this), so any failed/slow fetch
left a visibly blank region rather than a normal broken-image icon
elsewhere on the page; fixed generically (every board id, not one hardcoded
board/trophy) with a resolve-by-id-against-the-current-library step, one
silent retry, and — for board art — a second attempt at the default/Classic
board before falling back to a redesigned, clearly-intentional gold-tinted
placeholder panel; the trophy's own last-resort fallback is now a small
vector-drawn trophy silhouette (previously a colour-emoji glyph that could
render as nothing at all on systems without a colour-emoji font) — see
_gocLoadBoardImageForCert()/_gocLoadImageWithRetry()/
_gocDrawTrophyFallback() in js/06-stats-history.js. (2) The Pro section's
small Board Design preview swatch (#board-design-preview-img) previously had
no onerror handling at all; it now falls back to the default board's art,
then hides gracefully, instead of showing the browser's native broken-image
icon or raw alt text — see handleBoardPreviewImageError() in
js/01-config-data.js. (3) The Pro section heading is restyled from all-caps
"TRIGAMMONX PRO" to title-case "TrigammonX Pro" (tracking tightened to suit
mixed case), matching the app's broader move toward title-case TrigammonX
branding; the small gold "X" accent above it, the "Free During Beta" pill,
and the "Insights • Commentary • Game Analysis" line are all unchanged. (4)
The main header's gold wordmark image gets a modest ~10% size bump (a clamp
range tune only — same scaling mechanism, no overflow/clipping risk) for
slightly more presence, per the spec's "optional but preferred" polish item.
See TrigammonX-v3.5.3-change-report.md for the full before/after, the exact
root-cause analysis, and every test performed.

Preserves, unchanged: the v3.5.0 Official 2 Dice opening-roll rule, Triple
Dice, all AI/RNG/simulation/Tournament logic, Save/Load and autosave/
recovery, the Winner Archive's storage schema and every one of its existing
functions (auto-archive, list/filter, newest-first ordering, JPG/PNG
download, Share Results, delete), Career Stats (still purely derived from
the same archive data), the v3.5.2 Winner Archive viewer's larger fit-to-
width presentation and Close/Escape behaviour, the Winner Certificate itself
(standalone trophy, masthead logo, title-case branding, charts/stats, Dice
Numbers Rolled, JPG/PNG export architecture — still no html2canvas), the
smart update-check mechanism, the current Board Design library (read-only
here — TRIGAMMONX_BOARD_DESIGNS/_findBoardDesign() are never modified),
board preview elsewhere, Full UI Themes, voice/commentary, social sharing,
and the Tony "undefined Available Moves" hotfix.
-->
<!--
TrigammonX v3.5.2 — Header/Pro Branding + Winner Archive Viewer Polish
(Source: the COMPLETE approved TrigammonX v3.5.1 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.5.1 source itself was never modified. The locked, validated
historical Core/Simulation baseline trigammonx-v257-simulation-lab-stable.html
was not opened, referenced, or modified by this pass.)

FOCUSED UI / BRANDING / USABILITY RELEASE ONLY — no gameplay, opening-roll,
Triple Dice, AI, RNG, simulation, Tournament, Save/Load, Winner Archive data
model, Career Stats calculations, statistics calculations, board library, or
update-checker LOGIC changes. Three goals: (1) the main-page header's large
text-based "TRIGAMMONX" heading is replaced with the approved gold wordmark
image (a new packaged asset, trigammonx-v3.5.3/img/trigammonx-wordmark-gold.
png), sized smaller/more refined than the previous text treatment, with the
version pill and "Backgammon for Three" tagline unchanged in position below
it — falls back to the original text heading if the image ever fails to
load. (2) The TRIGAMMONX PRO section header gains a small, restrained gold
"X" accent (reusing the existing v3.5.1 certificate-logo asset — no new
external asset path) rather than repeating the full wordmark, so it reads as
a light branded echo of the main header without competing with it. (3) The
Winner Archive's certificate viewer (opening an archived certificate) now
renders substantially larger — a fit-to-width presentation reusing the same
capped-viewport/scrollable pattern the live post-game certificate modal
already uses — with an added top-right ✕ Close button (plus the existing
"← Back to Archive" button and, new this pass, Escape-key support), so
archived certificates no longer require browser zoom to read. The archive
LIST/thumbnail view is untouched and stays exactly as compact as before —
only the opened viewer got larger. See TrigammonX-v3.5.2-change-report.md
for the full before/after, the exact CSS/HTML/JS touched, and every test
performed.

Preserves, unchanged: the v3.5.0 Official 2 Dice opening-roll rule, Triple
Dice, all AI/RNG/simulation/Tournament logic, Save/Load and autosave/
recovery, the Winner Archive's storage schema and every one of its existing
functions (auto-archive, list/filter, newest-first ordering, JPG/PNG
download, Share Results, delete), Career Stats (still purely derived from
the same archive data), the v3.5.1 Winner Certificate itself (standalone
trophy, masthead logo, title-case branding, charts/stats, Dice Numbers
Rolled, JPG/PNG export architecture — still no html2canvas), the smart
update-check mechanism, the current Board Design library, board preview,
Full UI Themes, voice/commentary, social sharing, and the Tony "undefined
Available Moves" hotfix.
-->
<!--
TrigammonX v3.5.1 — Winner Certificate Logo Masthead Polish
(Source: the COMPLETE approved TrigammonX v3.5.0 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.5.0 source itself was never modified. The locked, validated
historical Core/Simulation baseline trigammonx-v257-simulation-lab-stable.html
was not opened, referenced, or modified by this pass.)

SMALL VISUAL POLISH RELEASE ONLY — no gameplay, opening-roll, AI, RNG,
simulation, Tournament, Save/Load, Winner Archive, Career Stats, Dice
Numbers Rolled, sharing/export architecture, board library, or
update-checker LOGIC changes. The only change: the Winner Certificate
masthead now displays the user-approved TrigammonX logo image (a new
packaged asset — trigammonx-v3.5.3/img/trigammonx-logo.png), on-screen and
in the direct-canvas JPG/PNG export, above the existing title-case
"TrigammonX™" wordmark introduced in v3.5.0. The wordmark text itself,
"WINNER CERTIFICATE", and everything below it are unchanged; the winner
name remains the certificate's largest, most dominant element. If the logo
image ever fails to load (on-screen: <img onerror>; export: the same
never-throws _gocLoadImageSafe() helper already used for the trophy and
board-design thumbnail), the layout falls back gracefully to the v3.5.0
typographic-only masthead — no broken-image icon, no crash. See
TrigammonX-v3.5.1-change-report.md for the full before/after, the logo
asset's exact placement/sizing at each breakpoint, and every function
touched.

Preserves, unchanged: the v3.5.0 Official 2 Dice opening-roll rule, the
smart update notice + latest-version.json logic, Winner Archive, Career
Stats, Dice Numbers Rolled clarity, Game/Match History, Tournament
Mode/Clock, all Save/Load and autosave/recovery, the current Board Design
library, board preview, Full UI Themes, voice/commentary, social sharing,
and the Tony "undefined Available Moves" hotfix.
-->
<!--
TrigammonX v3.5.0 — Opening-Roll Rule Update + Winner Certificate Masthead
Polish + Smart Update Notice
(Source: the COMPLETE approved TrigammonX v3.4.1 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.4.1 source itself was never modified. The locked, validated
historical Core/Simulation baseline trigammonx-v257-simulation-lab-stable.html
was not opened, referenced, or modified by this pass.)

THREE RELEASE GOALS:

1) OFFICIAL 2 DICE OPENING-ROLL RULE CHANGE (the one authorized gameplay
   rule change this release): each of Blue/Red/Green now rolls one die to
   determine who starts, exactly as before (only players tied for HIGHEST
   reroll). What changes: the starter no longer makes a brand-new roll for
   their first turn. Instead, the two HIGHEST of the three final opening
   die values become the starter's first-turn movement dice directly — no
   extra RNG call, no second roll. The previously-dormant v201e/v235
   "opening turn" machinery (firstTurnUsesOpeningDice/openingTurnInProgress
   flags and everything that already reacted to them) was reactivated
   rather than rebuilt; the already-correct openingRollFirstDice
   calculation was reused rather than duplicated. Roll Dice is not shown
   for the starter's first turn; Available Moves, max-dice-use, doubles,
   the Tournament Clock, dice/history statistics, and Save/Load all treat
   these two dice exactly like a normal roll. Triple Dice's own opening
   behaviour is completely unchanged. See TrigammonX-v3.5.0-change-report.md
   for the full before/after and every function touched.

2) WINNER CERTIFICATE MASTHEAD POLISH: the certificate brand line changed
   from all-caps "TRIGAMMONX™" to a compact, refined title-case
   "TrigammonX™" wordmark (on-screen and in the direct-canvas JPG/PNG
   export), reusing the same serif family as the page's own header
   wordmark rather than inventing a logo image asset (none exists
   anywhere in the supplied package — see the change report for the
   confirmed inspection). The winner name remains the certificate's
   largest, most dominant element. Standalone trophy, board-design panel,
   Winner Archive, Career Stats, all charts, and the export architecture
   (still no html2canvas) are unchanged.

3) SMART "NEW VERSION AVAILABLE" NOTICE: a new small, entirely additive,
   fail-silent update check (latest-version.json, fetched once, after the
   app is already usable, with cache bypass and a numeric — never
   lexical — version comparison) shows a dismissible, non-blocking toast
   only when a genuinely newer version is published. "Later" suppresses
   that same version's notice for the rest of the browser session; nothing
   here auto-refreshes a live game, forces a reload, or touches any saved
   data. "Refresh Now" navigates to a cache-busted URL rather than relying
   on the deprecated location.reload(true).

Preserves, unchanged: Game/Match History, Tournament Mode/Clock, all
Save/Load and autosave/recovery, the current Board Design library, Full UI
Themes, voice/commentary, social sharing, and the Tony "undefined Available
Moves" hotfix. See TrigammonX-v3.5.0-change-report.md for full details.
-->
<!--
TrigammonX v3.4.1 — Dice Numbers Rolled Chart Clarity Hotfix
(Source: the COMPLETE approved TrigammonX v3.4.0 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.4.0 source itself was never modified.)

SCOPE: small, focused, presentation-only hotfix to the Winner Certificate's
third chart. No dice tracking, RNG, roll totals, Dice Fortune calculation,
doubles/triples counting, or any other statistic was recalculated — the
bars represent exactly the same playerStats[p].diceFaces values as v3.4.0.

1) RENAMED the chart from "Dice Face Distribution" to "Dice Numbers
   Rolled" (on-screen and in both the SVG/canvas builders' internal
   naming/comments), with a plain-English subtitle: "How many times each
   player rolled 1, 2, 3, 4, 5 and 6" (was "how often each face was
   rolled").

2) CLEARER X-AXIS LABELS: each of the six groups is now labelled
   "Rolled 1" through "Rolled 6" instead of a bare "1"-"6", in both the
   on-screen SVG (buildGroupedBarChartSVG()) and the exported-image canvas
   drawing (_gocDrawGroupedBarChart()). Both chart areas had ample
   measured width for the longer labels, so the "1-6 + NUMBER ROLLED
   caption" fallback the spec allowed was not needed.

3) EXACT COUNT ABOVE EVERY BAR: each Blue/Red/Green bar now shows its
   precise numeric count directly above it, in that player's own colour
   for at-a-glance readability. Both chart functions' top padding was
   enlarged specifically to reserve guaranteed headroom for this label —
   not scaled off the tallest bar's value — so a label can never collide
   with the plot's top boundary even when a bar reaches the top gridline.

4) EXPLANATORY SENTENCE added beneath the chart's legend: "Each group
   shows how many times Blue, Red and Green rolled that number during the
   game." — reusing the certificate's existing .goc-chart-facts/
   .goc-fact-pill treatment already used by Borne-Off Race/Hit Battle.

5) OPTIONAL PLAIN-ENGLISH SUMMARY: a new pure, deterministic function
   (gocComputeDiceRollsSummary()) derives one short factual sentence
   (e.g. "Green rolled the most 5s and 6s.", "Red's rolls were fairly
   evenly spread.") using ONLY the already-counted six-face totals — no
   new tracking, no luck/skill language, no AI. Returns null (sentence
   omitted) whenever no single clean fact can be derived.

Applied to BOTH the on-screen Winner Certificate and the direct-canvas
JPG/PNG export (same architecture, html2canvas NOT reintroduced). Winner
Certificate Archive, Career Stats, the standalone trophy, Game/Match
History, Tournament Mode/Clock, Save/Load, the Board Design library, the
Tony undefined Available Moves hotfix, sharing, and all gameplay/AI/RNG/
simulation logic are untouched. See TrigammonX-v3.4.1-change-report.md
for full details.
-->
<!--
TrigammonX v3.4.0 — Winner Certificate Archive + Career Stats + Standalone Trophy Redesign
(Source: the COMPLETE approved TrigammonX v3.3.3 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.3.3 source itself was never modified.)

SCOPE — three tightly related goals, all building on the existing v3.3
Game History/Match History foundation rather than a parallel system:

1) WINNER CERTIFICATE HERO REDESIGN: the circular .goc-medallion-ring
   (gold disc + double stroked border, which capped the trophy's visible
   size well below its own box — see the v3.3.3 change report) is
   REMOVED entirely, on-screen and in the direct-canvas JPG/PNG exporter.
   The trophy now sits directly on the certificate's dark background,
   much larger (150px desktop CSS / 190px canvas, up from 94px/94px),
   with a soft two-layer glow/shadow filter standing in for a drawn
   frame. OFFICIAL WINNER/CHAMPION labels are unchanged in position.

2) WINNER CERTIFICATE ARCHIVE: every completed game's certificate is now
   auto-saved (local device only, localStorage key
   trigammonx_winner_archive_v1) the moment the Winner Certificate opens,
   with a subtle in-modal confirmation. A new "Winner Archive" modal
   lists every saved certificate (filterable by All/Regular/Tournament/
   winner colour) with Open/Download JPG/Download PNG/Share Results/
   Delete actions per entry — all reusing the EXISTING certificate
   rendering, download, and share machinery (refactored to accept an
   archived record's stored data instead of only the live game) rather
   than a second, parallel implementation. De-duplicated on
   gameEndTimeMs so re-renders/reopens/reshares can never create a
   duplicate archive entry, and loading a saved game never creates a
   false one either.

3) CUMULATIVE / CAREER STATS: a new "Career Stats" modal aggregates
   totals across every archived certificate — games/wins by colour and
   seat type, win rates, board-turn/duration extremes and averages,
   hits/times-hit/bar-entries/checkers-borne-off totals, average roll
   total, doubles/triples rolled, favourite board design, last played,
   and (where applicable) completed-Tournament-match aggregates. Purely
   derived on demand from the same Winner Archive record set — no
   separate, fragile incrementing-counter system — so deleting an
   archived certificate correctly reduces these totals too. Includes a
   confirmed Reset action that clears both the archive and its derived
   stats together (they are the same underlying data).

Winner Certificate sharing (native/Email/Facebook/X/Instagram/Copy),
JPG/PNG export architecture, Game History/Match History, Save/Load,
Tournament Mode/Clock, the Board Design library, the Tony undefined
Available Moves hotfix, and all gameplay/AI/RNG/simulation logic are
untouched. See TrigammonX-v3.4.0-change-report.md for full details.
-->
<!--
TrigammonX v3.3.3 — Winner Certificate Trophy Scale Fix
(Source: the COMPLETE approved TrigammonX v3.3.2 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.3.2 source itself was never modified.)

SCOPE: small, focused, presentation-only hotfix. The real trophy artwork
was still rendering too small inside the left champion medallion because
its box was capped by a fixed SQUARE width/height (82px on-screen, a
94x94 "contain" box in the canvas exporter) rather than being sized
directly from the medallion's true inner usable circle. Replaced with an
aspect-ratio-driven box on-screen (.goc-medallion-trophy: explicit
height, width:auto, aspect-ratio:1024/1536, matching the real trophy.png
ratio, with object-fit:contain kept as a defensive fallback) at both the
desktop and tablet breakpoints, and a matching height-first destination-
rect calculation in the direct-canvas JPG/PNG exporter
(_gocDrawCertificateContent(), 06-stats-history.js) driven by the real
loaded image's naturalWidth/naturalHeight. The trophy's visible height
now reaches ~90% of the medallion's true inner content circle (up from
~79% on-screen / ~85% in exports in v3.3.2) — a deliberate, documented
step above the letter of the spec's literal 78%-82% figure, needed to
satisfy the spec's own overriding requirement that the change read as
obviously larger, not marginal; see TrigammonX-v3.4.0-change-report.md
for the full geometric analysis. Aspect ratio, centring, the medallion
ring's own size, the winner-colour accent, and every other certificate
section are untouched — only the trophy's rendered scale changed, and it
still leaves clear space inside the ring and below/above the OFFICIAL
WINNER/CHAMPION labels. See TrigammonX-v3.4.0-change-report.md for full
details.
-->
<!--
TrigammonX v3.3.2 — Winner Certificate Trophy Size Hotfix
(Source: the COMPLETE approved TrigammonX v3.3.1 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.3.1 source itself was never modified.)

SCOPE: small, focused, presentation-only hotfix. The real trophy artwork
introduced in v3.3.1 appeared a little small inside the left champion
medallion. Its displayed size is increased by ~20% (within the requested
15%-25% range) in BOTH the on-screen certificate (.goc-medallion-trophy
CSS, css/03-components-features.css, at both the desktop and tablet
breakpoints) and the direct-canvas JPG/PNG exporter
(_gocDrawCertificateContent(), 06-stats-history.js — the maxTrophyW/
maxTrophyH box the image is "contain"-fit into). Aspect ratio, centring,
the medallion ring, the winner-colour accent, and every other certificate
section are untouched — only the trophy's displayed size changed, and it
still leaves clear space inside the ring on every side. See
TrigammonX-v3.4.0-change-report.md for full details.
-->
<!--
TrigammonX v3.3.1 — Winner Certificate Trophy Image Fix
(Source: the COMPLETE approved TrigammonX v3.3.0 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.3.0 source itself was never modified.)

SCOPE: small, focused, presentation-only patch. Replaces the old
"goc-medallion-trophy" emoji/glyph (🏆) in the Winner Certificate's left
champion medallion with the real TrigammonX trophy artwork hosted at
https://trigammonx.com/ximages/trophy.png, in BOTH the on-screen
certificate DOM (Play-TrigammonX.html + .goc-medallion-trophy CSS) and the
direct-canvas JPG/PNG exporter (_gocDrawCertificateContent()/
_gocCaptureCertificateCanvas(), 06-stats-history.js), reusing the existing
never-throws _gocLoadImageSafe() board-image loader rather than a second
competing loader. Both paths preserve aspect ratio (CSS object-fit:
contain on screen; a "contain"-fit drawImage() in the canvas exporter) and
fall back safely — a hidden sibling glyph on screen, the pre-v3.3.1 glyph
in the export — if the asset is temporarily unavailable, so neither path
can ever show a broken-image icon or crash. No certificate section other
than the medallion trophy visual was touched; no gameplay, history,
stats, AI, RNG, simulation, or board-registry logic was touched. See
TrigammonX-v3.3.1-change-report.md for full details.
-->
<!--
TrigammonX v3.3.0 — Game History / Tournament Match History
(Source: the COMPLETE approved TrigammonX v3.2.3 package, used as the ONLY
source for this pass. Nothing was derived from any older package, and the
supplied v3.2.3 source itself was never modified.)

SCOPE: adds a trustworthy, structured, chronological Game History (Regular
Play) / Match History (Tournament Mode) system — the foundation for later
(NOT this pass) Key Turns/Blunders/Decision Quality/Match Certificate work.
One new additive event stream (matchHistoryEvents, 02-state-utils.js) is
populated from a single choke-point recorder (hxRecordEvent()) called from
the EXISTING authoritative call sites already used for gameplay/stats/GA4
(beginPlay(), commitOpeningRollAsLiveTurn(), the two real dice-roll call
sites, executeMove(), recordCompletedTurn(), undoLastMove(),
awardTournamentMatchPoint(), gocNewGame(), confirmResetGame(),
performResetAll(), startNewMatch(), pauseTournamentMatch()/
resumeTournamentMatch()/tcExpireInternal(), and performSaveAs()/
loadGameFromLocalStorage()/loadNamedSave() in 09-saves.js) — never a
second, competing source of truth, and never touching move legality, the
RNG, or the Core/Simulation baseline. A new "GAME HISTORY"/"MATCH HISTORY"
card (index.html markup + .hx-* CSS + renderHistoryPanel()/toggleHistory()/
onHistoryGameFilterChange(), 06-stats-history.js) renders a windowed,
collapsible view of that stream (full data always kept in state — Task
13), with a required TXT export and optional JSON export (Task 11) that
always include the COMPLETE history regardless of any UI window/filter.
History is fully persisted through the EXISTING save architecture
(serializeGameState()/restoreGameState()) — additive fields only, so an
older v3.2.x-and-earlier save with no history fields still loads safely
with empty history and begins recording fresh from the restore point,
never fabricating the missing past. See TrigammonX-v3.3.0-change-report.md
for the complete schema, call-site list, and test results.
-->
<!--
TrigammonX v3.2.3 — Tony Undefined-Moves Hotfix
(Source: approved live v3.1.2 package, used as the ONLY source for this pass.)

SCOPE: post-game statistics/presentation expansion. Adds two new required
Winner Certificate charts — Borne-Off Race (checkers borne off by
completed turn, 0-15) and Hit Battle (cumulative hits delivered by
completed turn) — plus the strongly-desired third chart, Dice Face
Distribution (grouped bars, faces 1-6, kept inside the collapsible Full
Player Stats area). Reuses the existing buildTrendLineChartSVG()/
_gocDrawLineChart() line-chart machinery unmodified for the first two; a
new, parallel grouped-bar builder pair (buildGroupedBarChartSVG()/
_gocDrawGroupedBarChart()) was added for the third, since it is a
genuinely different mark type. The only new per-turn tracking required was
two additional keys on the existing liveGameHistory snapshot
(borneOff/hitsCumulative) — no new call sites in executeMove()/endTurn()
were needed, since borneOffState/playerStats[p].hitsMade were already
correct by snapshot time. Also adds a light, additive match-level
statistics foundation (matchStats) for Tournament Mode, with a compact
collapsible summary inside the existing Tournament Clock card. No game
rules, geometry, AI, RNG, simulation, Tournament Clock math, board
registry, or existing Pip Race/Dice Fortune behaviour changed. See
TrigammonX-v3.2.3-change-report.md for full details.
-->
<!--
TrigammonX v3.1.2 — Board Library + Selected Board Preview
(Source: approved v3.1.0 Tournament Clock package.)

SCOPE: presentation/configuration-only Board Design enhancement. Added Deco
Speedo (`retro-speedo`) and Tesla (`tesla`) to the existing single data-driven
Board Design registry. Added a compact selected-board thumbnail beside the
Board Design dropdown so players can preview the chosen artwork without
scrolling back to the game board. No game rules, geometry, AI, RNG, simulation,
Tournament Clock, match scoring, save format, or theme logic changed.
-->
<!--
TrigammonX v3.1.0 — Tournament Clock
(Source: approved live v3.0.2 package, used as the ONLY source for this pass.)

SCOPE: replaces the "Tournament Clock — Coming Soon" placeholder in the
existing Tournament panel with a real, functional three-player Simple
Delay tournament clock (TrigammonX Tournament Standard: 2 min/point
reserve + 12 sec/turn delay, per player). Three independent match-level
reserve banks (one per colour), drift-resistant elapsed-timestamp timing,
turn-lifecycle-driven clock ownership, Pause Match/Resume Match, clock
state folded into the existing Tournament save architecture, freeze+flag
(not forfeit) time-expiry handling, and match-level clock statistics. The
static Doubling Cube "Coming Soon" card, Regular Play, and all board/AI/
rules/simulation logic are unchanged. See
TrigammonX-v3.1.0-change-report.md for full details.
-->
<!--
TrigammonX v3.0.2 — Board Design Library Expansion
(Source: approved live v3.0.0 package_2.)

SCOPE: configuration-only Board Design expansion using the existing
data-driven dropdown registry. Added Quantum Grid (`quantum-grid`), Moon (`moon`), Spiral Glass (`spiral-glass`) and Techno Ring (`techno-ring`). No board geometry, rules, AI, RNG, simulation, theme
logic, Tournament Mode logic, or dropdown architecture changed.
-->
<!--
TrigammonX v3.0.0 — Tournament Mode Foundation + Reset/Branding UX Foundation
(Source: the complete approved TrigammonX v2.4.4 public package, supplied
directly alongside this pass's spec. v2.4.4 itself was NOT modified —
verified by MD5 before and after.)

WHY A MAJOR VERSION BUMP: this is the first release introducing a second
formal play context (Tournament Mode) and a persistent match layer above
individual games. Regular Play remains the default and retains its exact
v2.4.4 behaviour end to end.

SCOPE — additive foundation work only, ten tasks:
1) Play Mode selector (Regular Play default / Tournament Mode) in Game
   Setup — new #play-mode-bar, mirrors the existing Dice Mode bar.
2) Tournament Match panel (new #txm-panel/.txm-*): match length (3/5/7/9/
   11, default 5), Blue/Red/Green match scores, game number, match-
   complete/Match Winner state, New Match action. Since the Doubling Cube
   is not active, each completed game is worth exactly 1 match point — no
   cube multiplier, no invented gammon/backgammon multiplier.
3) Save/Resume: playMode + matchState added ADDITIVELY to
   serializeGameState()/restoreGameState() (js/09-saves.js) — an older
   save with no such keys loads as Regular Play, unchanged. Same shared
   serializer/restorer used by autosave, named saves, and .tgxsave
   export/import — no second save system.
4) Tournament integrity: Take Back is hidden/disabled in Tournament Mode
   (updateUndoStatus() + a defense-in-depth guard inside undoLastMove()
   itself, js/11-simulation-admin.js). Move legality/End Turn rules are
   completely untouched. Regular Play Take Back is unchanged.
5) Doubling Cube — visible "Coming Soon" placeholder only; no cube state,
   no click action, no scoring effect.
6) Tournament Clock — visible "Coming Soon" placeholder only; no timer
   logic. Named .txm-* (not .clock-*) to avoid colliding with the
   existing, unrelated Game/Turn/Real Time clock feature.
7) New Game vs Reset All clarified: New Game still resets only the
   current game/pieces (Tournament Mode additionally advances the game
   number and preserves match state). Reset All is a NEW, confirmation-
   gated action (confirmResetAll()/performResetAll(), js/03-rules-
   engine.js) that returns Play Mode, Dice Mode, Player Type, UI Sound,
   Voice Speed, Full UI Theme, Board Design and the Tournament match to
   their defaults — it never deletes named saved games.
8) Board Design "Classic" renamed to "Bronze Metal" everywhere shown to
   players — internal id `classic`, asset URL, and save/localStorage
   compatibility are all unchanged.
9) Header tagline ("Backgammon for Three") made modestly more prominent
   (font-size/weight), still clearly subordinate to the TrigammonX title.
10) New, modular tournament/match state (playMode + matchState object —
    js/02-state-utils.js) rather than scattered globals, designed so
    later work (transcript, Match Certificate, Tournament Clock, Doubling
    Cube logic) can extend it without rewriting Regular Play.

PROTECTED / UNTOUCHED: individual-game rules engine, legal move
generation, Bar entry, hitting, bearing off, max-dice-use, opening roll,
turn order, checker movement, RNG, AI strategy/lookahead, simulation,
board geometry, CLICK_POINTS/CHECKER_ANCHORS, statistics calculations —
none of this pass's ten tasks touches any of it. See
TrigammonX-v3.0.0-change-report.md for the full write-up.
-->
<!--
TrigammonX v2.4.4 — Explicit Social Share Buttons
(Source: the complete approved TrigammonX v2.4.3 public package, supplied
directly alongside this pass's spec. v2.4.3 itself was NOT modified —
verified by MD5 before and after.)

SCOPE: this pass EXTENDS the existing v2.4.3 Share Results architecture —
it does not replace it. Added a compact, secondary social-share row
(.goc-social-row, in TrigammonX-v2.4.4.html + css/03-components-features.css)
with five explicit destination buttons: Email (mailto:, text-only body —
mailto: cannot reliably attach a generated file), Facebook (sharer.php
with the TrigammonX URL only — Facebook's endpoint does not reliably
accept prefilled text), X (web intent with the concise result text +
URL), Instagram (native file-share via the SAME
_gocCaptureCertificateCanvas()/_gocTryNativeImageShare() pipeline where
supported; otherwise downloads the JPG and shows truthful "saved —
upload it" guidance, never claiming Instagram itself was opened), and
Copy (the same _gocCopyResultText() clipboard-with-visible-fallback
helper Share Results already used). All five read winner name/board-turn
data through one shared _gocShareTextParts() helper — no button
recalculates that data independently. winner_certificate_shared (GA4)
is reused unchanged, with new share_method values ('email'/'facebook'/
'x'/'instagram'/'copy'). No second certificate renderer, no html2canvas,
no change to the working JPG/PNG download buttons or the v2.2.5-v2.4.3
native Share Results preference chain. See
TrigammonX-v2.4.4-change-report.md for the full write-up.
-->
<!--
TrigammonX v2.4.3 — Social Sharing Audit / Complete / Polish Pass
(Source: the complete approved TrigammonX v2.4.2 public package, supplied
directly alongside this pass's spec. v2.4.2 itself was NOT modified —
verified by MD5 before and after.)

SCOPE: this pass audits, completes and polishes the EXISTING Share Results
feature in js/06-stats-history.js — it does not build a second sharing
system, does not touch the Winner Certificate renderer/layout, and does
not touch JPG/PNG downloads. Changes:
- New _gocBuildShareText() produces concise share text ("<Winner> won
  TrigammonX in <N> board turns. Backgammon for Three.
  https://trigammonx.com/") from already-computed data (getDisplayName(),
  getBoardTurnsCount()) — replacing the previous long game-report text,
  which lacked the TrigammonX URL. buildGameReportText()/Copy Report are
  untouched.
- gocShareResults() now shows visible Preparing/Sharing/success/error
  status in-modal via the existing _gocSetExportStatus() channel, gets a
  busy-state + duplicate-activation guard via new _gocSetShareBusy()/
  _gocShareInFlight (scoped to #goc-share-btn only), and — when the
  clipboard itself is unavailable or writeText() fails — falls back to a
  visible/selectable window.prompt() with the share text pre-filled,
  instead of failing silently.
- The existing preference chain (Web Share with certificate image ->
  Web Share text-only -> clipboard) and AbortError-is-a-cancellation
  handling are preserved exactly; _gocCaptureCertificateCanvas() (the
  v2.4.0/v2.4.1 direct-canvas renderer) is reused unchanged — no second
  renderer, no html2canvas.
- One new Beta Update entry added; all prior entries preserved.
See TrigammonX-v2.4.3-change-report.md for full detail, file-by-file MD5s,
and test results.
-->
<!--
TrigammonX v2.4.2 — Classic Certificate Thumbnail + End Turn Visibility Hotfix
(Source: approved v2.4.1 public package. Presentation/export-only hotfix.)
- Winner Certificate export: same-origin board artwork is now loaded without forcing
  CORS mode, fixing the Classic board thumbnail falling back to a letter placeholder.
- End Turn: READY/enabled state receives a final, late-loaded full-opacity gold primary
  action treatment so it cannot be visually muted by must-move/theme/responsive rules.
- Disabled/not-ready End Turn remains subdued; no End Turn legality/turn-flow changes.
- Direct-canvas JPG/PNG export architecture from v2.4.0/v2.4.1 is preserved.
- No rules, movement, RNG, AI, simulation, board geometry, saves or stats changed.
-->
<!--
TrigammonX v2.4.1 — Winner Certificate Export VISUAL PARITY Pass
(Source: the complete approved TrigammonX v2.4.0 public package, supplied
directly alongside this pass's spec. v2.4.0 itself was NOT modified —
verified by MD5 before and after.)

SCOPE: this is a presentation-only pass over the JPG/PNG export renderer.
The v2.4.0 deterministic direct-canvas two-pass measure/render mechanism
(_gocCaptureCertificateCanvas()'s measure-then-render architecture, the
never-throws _gocLoadImageSafe() board-image loader, and the complete
absence of html2canvas/DOM-cloning) is UNCHANGED — that is the reliable
foundation v2.4.0 established and this pass is required to preserve it
exactly. The v2.4.0 End Turn visibility CSS fix
(body.must-move .btn-end-turn.end-turn-ready:not(:disabled){opacity:1})
is also UNCHANGED — no regression was found, so nothing there was touched.

OWNER FEEDBACK: v2.4.0 made JPG/PNG downloads work reliably (success), but
the exported certificate did not visually resemble the on-screen Game
Over Winner Certificate closely enough. THE ON-SCREEN WINNER CERTIFICATE
IS THE VISUAL DESIGN MASTER for this pass — the on-screen certificate
itself was NOT redesigned; only the export renderer's layout/colour/
typography were reworked to match it more closely.

WHAT CHANGED (06-stats-history.js, _gocDrawCertificateContent() rewritten
in full, plus small additive helpers — see change report for full
before/after trace against the on-screen DOM/CSS):
- Composition switched from v2.4.0's single-column stacked-panel layout
  to a landscape, multi-column layout mirroring the on-screen master's
  actual CSS grids: a 3-column hero row (medallion | masthead | board-
  design card, mirrors .goc-cert-hero-row), a Game Details + Featured
  Stats row (mirrors .goc-cert-row-details), a 4-column mid row (Official
  Result seal + Game Highlights | Pip Race | Dice Fortune | Personal
  Record, mirrors .goc-cert-row-mid), a Player Results row, and a Full
  Player Stats row.
- New champion medallion (gold radial-gradient ring, winner-colour accent
  ring, trophy glyph, OFFICIAL WINNER/CHAMPION labels) — matches
  .goc-medallion-ring's actual CSS gradient/accent treatment; nothing like
  this existed in v2.4.0's export.
- New "cream/gold card" treatment (_gocCreamPanel(), colours taken
  directly from #goc-cert-capture's own CSS override for
  .goc-chart-card/.goc-seal-card) applied to exactly the four panels the
  on-screen master applies it to: Official Result seal, Game Highlights,
  Pip Race, Dice Fortune. Pip Race/Dice Fortune's canvas-drawn grid lines
  and axis labels use a new `light` mode (dark brown ink) instead of the
  white-on-dark tones used elsewhere, since white text on a cream card
  would be unreadable — required by the spec's own "readable labels"
  clause; the plotted data/series/colours are byte-identical either way.
- Corrected Game Details from a 2-column grid (v2.4.0) to the master's
  actual single-column list (.goc-details-grid is grid-template-
  columns:1fr).
- Gold outer double-frame widened to a landscape canvas (1160px -> 1500px
  logical width) with added corner bracket motifs
  (_gocDrawCornerMotifs()) mirroring the master's .goc-cert-corner
  brackets.
- Player Results panel kept as the master's ACTUAL dark-navy/gold-accent
  .goc-ptable-card styling (same treatment as Game Details) rather than
  the "dark brown/gold" wording in the spec's own prose — since the
  on-screen certificate is the named design master, its real CSS was
  followed over the paraphrase; documented explicitly in the change
  report as a deliberate, spec-consistent choice, not an oversight.
- Full Player Stats rendered fully expanded (no collapsible affordance
  exists in a static image) with every existing label/value preserved.
- NO statistic, ranking, or result value is computed differently
  anywhere in this pass — every field still flows, unmodified, from
  _gocGatherCertificateData() (itself unchanged apart from bumping the
  two hardcoded "TrigammonX Version" display strings to v2.4.1).

BETA UPDATE: one new newest-first entry added to the existing
BETA_UPDATE_NOTES array (06-stats-history.js) — "Thanks Bill!" credit,
every prior entry and rendering location preserved unchanged.

PROTECTED SYSTEMS UNCHANGED: rules, legal movement, Bar entry, hitting,
bearing off, max-dice-use, opening-roll winner rule, turn order, RNG, AI
strategy/evaluation/lookahead, simulation, validation, winner
determination, board geometry, CLICK_POINTS, CHECKER_ANCHORS, save
schema, statistics calculations, unrelated commentary logic, M51 Spiral
Galaxy/Classic/Blue Circuits board designs, Voice Speed 0.85x-1.50x, Play
Sample, the v2.3.3/v2.3.4 New Game fix, "Thanks Tony!"/"Thanks Bill!"
history, GA4, Save/Load, named saves, autosave/recovery, Take Back,
Rotate Board, the v2.4.0 End Turn visibility fix, the v2.4.0 direct-canvas
export architecture, and every other feature not named above.
trigammonx-v257-simulation-lab-stable.html was not opened, referenced, or
modified. setEndTurnReady() itself was not modified; no html2canvas
reference was reintroduced anywhere. See
TrigammonX-v2.4.1-change-report.md for the complete file/function diff,
the on-screen-CSS-to-export-code mapping, and full regression test
matrix.
-->
<!--
TrigammonX v2.4.0 — Winner Certificate Export Rebuild + End Turn
Visibility Fix
(Source: the complete approved TrigammonX v2.3.9 public package, supplied
directly alongside this pass's spec. v2.3.9 itself was NOT modified —
verified by MD5 before and after.)

TASK 1 — WINNER CERTIFICATE JPG/PNG EXPORT — REBUILT, NO LONGER USES
html2canvas:

v2.3.5 through v2.3.9 each tried to make html2canvas reliably clone and
paint the LIVE #goc-cert-capture DOM subtree — visible status messages, an
alternate CDN fallback, safer download triggering, excluding the
decorative sparkle canvas, neutralising the page background inside the
html2canvas clone, and (v2.3.9) removing `loading="lazy"` from the
board-badge <img> plus an image-decode wait gate before capture. The
InvalidStateError: createPattern() on a canvas element with width/height 0
crash STILL reproduced on the live server after all of that — so this pass
does not attempt a sixth patch to the same DOM-cloning mechanism. Instead,
_gocCaptureCertificateCanvas() (06-stats-history.js) is completely
rebuilt as a DETERMINISTIC EXPORT-ONLY RENDERER: it draws the certificate
directly onto a fresh <canvas> with the Canvas 2D API and never reads,
clones, or waits on any live DOM element at all. Because there is no DOM
clone, the whole failure class (a display:none ancestor, lazy-loading,
any html2canvas internal) cannot occur here — not "fixed again", but
structurally impossible.

ARCHITECTURE: _gocGatherCertificateData() (new) collects every value the
export needs from the SAME already-existing, unmodified functions the
on-screen certificate itself calls — gocRankPlayers(),
gocComputePipRaceFacts(), gocComputeHighlights(), gocComputeWinnerTitle(),
gocDiceFortuneLabel(), gocGetPersonalRecordForSeat(),
gocFavouriteBoardDesign() — so no statistic or result value is
recalculated or redefined for export, only re-read a second time.
_gocDrawCertificateContent() (new) then draws the full certificate
(TrigammonX branding, champion/winner name + title + summary, board-design
thumbnail + label, Game Details incl. TrigammonX Version, Featured
Highlights tiles, Game Highlights, a canvas-drawn Pip Race trend chart and
Dice Fortune trend chart plotting the exact same liveGameHistory data the
on-screen SVG charts plot, the Blue/Green/Red Player Results table, Full
Player Stats, Personal Record snapshot, an Official Game Result seal, and
an outer certificate frame/border) using plain fillText/fillRect/roundRect/
drawImage calls — no meaningful content dropped versus the previous export
region; only purely-animated sparkles are (correctly) not reproduced in a
still image. _gocCaptureCertificateCanvas() runs that draw function TWICE
— once on a physically tiny throwaway canvas purely to measure the real
content height (drawing beyond a canvas's pixel bounds is silently
clipped, never an error), once on a canvas sized exactly to that measured
height — so the exported image is always exactly as tall as its content,
deterministically, with no blank trailing space and nothing clipped.

BOARD IMAGE HANDLING: the export loads the selected board-design image
itself, via a new, dedicated _gocLoadImageSafe() — a fresh Image(), never
the live on-screen <img> — bounded by a 6s timeout, and NEVER throws: on
any failure/timeout it resolves null and the renderer draws a tasteful
text-only fallback panel (still identifying the board design by name) so
export always completes. Tested for Classic, Blue Circuits, and M51
Spiral Galaxy.

html2canvas ITSELF IS REMOVED from the codebase (was used ONLY by this one
export path — confirmed by a full-codebase search; nothing else loads or
references window.html2canvas). gocShareResults() (Web Share API image
attachment) calls the same _gocCaptureCertificateCanvas() helper it always
did — kept transparently working, not touched as a "new feature": it
shared the exact same crash-prone capture path before, so it gets the
exact same fix.

404 ASSET (trigammon-background-tech.png): unchanged from v2.3.9's
finding — confirmed unrelated to the export path (only referenced by the
page body's decorative background, which the export renderer never reads
at all now, having no DOM dependency whatsoever) and, per the hard
protection rule, still documented only, not altered.

TASK 2 — END TURN VISIBILITY — NEW ROOT CAUSE FOUND AND FIXED (the v2.3.9
:active-only fix, still present below, did not address this):

Owner feedback that a READY End Turn button "is still almost greyed out"
after v2.3.9 shipped its :active fix pointed at the RESTING state, not the
press feedback — re-investigated from scratch rather than assuming the
prior pass's analysis still covered it. Confirmed via a Playwright harness
driving executeMove() through complete real turns (Triple Dice, all-human
seats, no mocking): on EVERY turn tested (8/8), the instant a player's
final die completes the turn — checkTurnCompleteAfterMove() calls
setEndTurnReady(true), correctly enabling the button and adding
`.end-turn-ready` — getComputedStyle(endTurnBtn).opacity read "0.5", not
"1", despite the button being genuinely enabled and ready. ROOT CAUSE:
executeMove() (05-gameplay-interaction.js) only calls renderPieces()/
renderBarPieces() after applying a move, never the full renderAll() that
recomputes the `must-move` body class (04-themes-responsive.css:
`body.must-move .btn-end-turn { opacity: 0.5; }`). So `must-move` stays
STALE — still `true` from the render before that final move — for as long
as nothing else happens to trigger another renderAll(). `body.must-move
.btn-end-turn` and `.btn-end-turn.end-turn-ready` (01-base-layout.css)
have EQUAL CSS specificity (two classes each); 04-themes-responsive.css
loads after 01-base-layout.css, so the stale dimming rule wins the
cascade tie and silently overrides the ready state's gold treatment back
down to 50% opacity — reading as "still greyed out" on the single most
common way a turn ends. FIX (CSS-only, one new rule, 01-base-layout.css):
`body.must-move .btn-end-turn.end-turn-ready:not(:disabled) { opacity: 1;
}` — three-class specificity beats both the two-class must-move rule and
the two-class ready rule, so the ready state's opacity always wins
regardless of must-move's staleness. `:not(:disabled)` is a deliberate
extra safety condition, verified needed: Triple Dice mode can render
`.end-turn-ready` alongside `disabled` for a brief instant before a
turn's first checkTurnCompleteAfterMove() call (confirmed pre-existing,
non-regression behaviour, unrelated to this fix — see the v2.3.9 change
report) — `:not(:disabled)` keeps that one already-accepted edge case at
its original dim appearance instead of incorrectly brightening a button
that is not actually clickable yet. Verified via the same Playwright
harness with the fix applied: opacity reads "1" on every turn's
last-die-completion (previously "0.5"), while the genuine NOT-ready
dimming (must-move alone, no ready class) and the one pre-existing
disabled+ready-class edge case are both unaffected (still their original
opacity). setEndTurnReady(), must-move's own toggle logic, and every
other legality/turn-flow function are completely untouched — this is a
CSS specificity correction only.

BETA UPDATE: one new newest-first entry added to the existing
BETA_UPDATE_NOTES array (06-stats-history.js) — "Thanks Bill!" credit,
every prior entry and rendering location preserved unchanged.

PROTECTED SYSTEMS UNCHANGED: rules, legal movement, Bar entry, hitting,
bearing off, max-dice-use, opening-roll winner rule, turn order, RNG, AI
strategy/evaluation/lookahead, simulation, validation, winner
determination, board geometry, CLICK_POINTS, CHECKER_ANCHORS, save
schema, statistics calculations, unrelated commentary logic, M51 Spiral
Galaxy/Classic/Blue Circuits board designs, Voice Speed 0.85x-1.50x, Play
Sample, the v2.3.3/v2.3.4 New Game fix, "Thanks Tony!"/"Thanks Bill!"
history, GA4, Save/Load, named saves, autosave/recovery, Take Back,
Rotate Board, and every other feature not named above.
trigammonx-v257-simulation-lab-stable.html was not opened, referenced, or
modified. setEndTurnReady() itself was not modified. See
TrigammonX-v2.4.0-change-report.md for the complete file/function diff,
reproduction evidence, and full regression test matrix.
-->
<!--
TrigammonX v2.3.9 — Winner Certificate Export Root-Cause Fix + End Turn
Visibility Polish
(Source: the complete approved TrigammonX v2.3.8 public package, supplied
directly. v2.3.8 itself was NOT modified — verified by MD5 before and
after.)

TASK 1 — WINNER CERTIFICATE JPG/PNG EXPORT — ROOT CAUSE CONFIRMED AND
FIXED (not merely another "hide decorative things" patch):

The reported crash — InvalidStateError: Failed to execute 'createPattern'
on 'CanvasRenderingContext2D': the image argument is a canvas element
with a width or height of 0, inside html2canvas's
renderBackgroundImage/createPattern — was traced to the ONE <img> element
anywhere in the certificate: the board-design badge thumbnail
(06-stats-history.js, showGameOverCelebration(), inside #goc-badge-row,
which sits inside the #goc-cert-capture export region). That <img> had
`loading="lazy"` AND is inserted into the DOM while its ancestor
#goc-backdrop is still `display:none` (`.visible`, which switches it to
`display:flex`, is only added afterward). Browsers never begin a lazy
image's fetch while it sits inside a display:none subtree, so the image's
naturalWidth/naturalHeight stay 0 until AFTER the modal becomes visible
and the (asynchronous) fetch completes — a real, measurable race a player
can win simply by clicking Export promptly. Combined with this image's
existing border-radius + object-fit:cover styling (which makes html2canvas
render it via an offscreen canvas sized to its natural dimensions, then
createPattern() on that canvas), a still-0x0 image at capture time
produces exactly the reported error. CONFIRMED, not guessed: (1) direct
Playwright reproduction shows the badge <img> at
complete:false/naturalWidth:0/naturalHeight:0 at the instant a fast
Export click fires; (2) a minimal, isolated createPattern(0x0-canvas)
call in a real browser throws the EXACT reported error text, proving the
mechanism. This is a genuinely different element than every prior
attempt targeted (decorative sparkle canvas, page background, other
canvases) — none of those are <img> elements and none of them explain a
0-width/height createPattern source; this is why those attempts did not
fix it. FIX (two small, targeted, non-visual changes, both in
06-stats-history.js): (1) removed `loading="lazy"` from the board-badge
<img> — it is meaningful certificate content the spec requires in export,
not decorative, and lazy-loading provided no real benefit while causing
this exact race; removing it lets the fetch begin the instant the badge
markup is inserted, well before the modal is even shown. (2) added
_gocWaitForCaptureImagesReady(), called at the top of
_gocCaptureCertificateCanvas() before html2canvas is ever invoked — waits
(via HTMLImageElement.decode(), bounded by a 5s per-image safety timeout)
for every <img> inside the capture region to finish loading/decoding, so
html2canvas can never be handed a still-0x0 image again regardless of
network timing. The v2.3.8 canvas-exclusion/background-neutralisation
code (ignoreElements, onclone canvas removal, body background
neutralisation) is UNCHANGED and still correct/still needed for its own
purposes — this pass adds the missing piece, it does not replace that
work. The on-screen Winner Certificate is visually identical; existing
export analytics (winner_certificate_exported) are unchanged.

404 ASSET (trigammon-background-tech.png): confirmed UNRELATED to the
export crash — it is referenced only by the page `body`'s decorative
background (css/01-base-layout.css), never appears inside
#goc-cert-capture, and the v2.3.8 onclone handler already neutralises it
in the export clone regardless. The 404 itself is real and pre-existing;
most likely explanation is that the `url('../../trigammon-background-tech.png')`
relative path (corrected once before, in v2.2.0, for a flat deployment
layout) resolves two directory levels up from
trigammonx-v2.3.9/css/01-base-layout.css — landing inside the site's
`xgame/` subdirectory the public entry actually lives in
(https://trigammonx.com/xgame/Play-TrigammonX.html), one level short of
wherever the asset may actually live outside `xgame/`. This cannot be
confirmed without access to the live server's real directory layout, and
the background already degrades gracefully (gradients + solid
--tx-bg-deep fully cover it) with zero visible impact either way — so
per the hard-protection rule this is documented only, not "fixed" on a
guess that could just as easily point the path somewhere newly wrong.

TASK 2 — END TURN VISIBILITY — CONFIRMED SPECIFICITY BUG, FIXED
(visual-only, styling-only):

The ready-state End Turn button (.btn-end-turn.end-turn-ready,
css/01-base-layout.css) already had a strong v2.2.7 gold
gradient/glow/pulse treatment and, by inspection/screenshot, already
reads as the most visually prominent button in the Player Actions row on
both desktop and mobile. What was concretely missing — confirmed via
Chrome DevTools Protocol CSS.forcePseudoState(['active']), the reliable
way to test :active (a simulated mouse down does not reliably engage
:active in Chromium): its own `transform: scale(1.03)` rule
(specificity: two classes) has higher specificity than the shared
`button:active` rule's `transform: translateY(2px)` press effect
(specificity: one type + one pseudo-class), so a ready End Turn button
NEVER visibly compressed on a real press — measured
matrix(1.03,0,0,1.03,0,0) unchanged from its resting state, while Roll
Dice correctly measured matrix(1,0,0,1,0,2) (the expected 2px press).
Every other Player Action button visibly "gives" under a press and this
one alone did not — exactly the "comparable hover/active affordance" gap
the spec named. FIX: added a `.btn-end-turn.end-turn-ready:active` rule
(one CSS block, one media-query companion to suspend the pulse
animation while actually held) layering the same press-compression +
flattened-shadow language the shared button:active rule gives every
other button, on top of (not instead of) the existing gold identity —
verified via the same forced-:active technique to now match Roll Dice's
press behaviour. setEndTurnReady()/its disabled-state logic/legality are
completely untouched; the NOT-ready state is unaffected (screenshot-
confirmed still dim/subdued) since the new rule only ever applies
alongside the existing `.end-turn-ready` class.

BETA UPDATE: one new newest-first entry added to the existing
BETA_UPDATE_NOTES array (06-stats-history.js) — "Thanks Bill!" credit,
every prior entry and rendering location preserved unchanged.

PROTECTED SYSTEMS UNCHANGED: rules, legal movement, Bar entry, hitting,
bearing off, max-dice-use, opening-roll winner rule, turn order, RNG, AI
strategy/evaluation/lookahead, simulation, validation, winner
determination, board geometry, CLICK_POINTS, CHECKER_ANCHORS, save
schema, statistics calculations, unrelated commentary logic, M51 Spiral
Galaxy/Classic/Blue Circuits board designs, Voice Speed 0.85x-1.50x, Play
Sample, the v2.3.3/v2.3.4 New Game fix, "Thanks Tony!"/"Thanks Bill!"
history, GA4, Save/Load, named saves, autosave/recovery, Take Back,
Rotate Board, and every other feature not named above.
trigammonx-v257-simulation-lab-stable.html was not opened, referenced, or
modified. setEndTurnReady() itself was not modified. See
TrigammonX-v2.3.9-change-report.md for the complete file/function diff,
reproduction evidence, and full regression test matrix.
-->
<!--
TrigammonX v2.3.8 — Winner Certificate Export Hardening + Voice/Certificate Polish
(Source: approved v2.3.7 public package.)
- Winner Certificate JPG/PNG export now excludes all canvas presentation layers and neutralises the missing decorative page-background image inside the html2canvas clone only.
- Voice Off now also suppresses transient popup commentary while preserving Table Talk history.
- Winner Certificate Game Details now shows TrigammonX Version: v2.3.8 beneath Board Design.
- Adds newest-first Beta Updates & Fixes entry with Thanks Bill!
- No gameplay, rules, movement, AI, RNG, board geometry, saves, statistics calculations, or locked Core/Simulation logic changed.
-->
<!--
TrigammonX v2.3.4 — M51 Spiral Galaxy Board Design Restore
(Source: approved v2.3.3 public package. Presentation-only hotfix.)
- Restores M51 Spiral Galaxy as a third selectable Board Design.
- Uses existing board-design architecture and hosted image:
  https://trigammonx.com/ximages/TrigammonX-board-M51.png
- Internal board ID: m51. Existing persistence/fallback logic is reused unchanged.
- v2.3.3 Tony New Game fix, Thanks Tony beta update, voice controls, Play Sample,
  gameplay, rules, RNG, AI, simulation, saves, statistics and board geometry are unchanged.
-->
<!--
TrigammonX v2.3.8 — Winner Certificate Export Canvas Fix
(Source: approved v2.3.6 public package.)
Export-only hotfix: html2canvas now ignores the decorative goc-sparkle-canvas
when capturing the Winner Certificate. This prevents the observed zero-size
canvas createPattern InvalidStateError that blocked both JPG and PNG downloads.
No gameplay, rules, AI, RNG, saves, statistics calculations, board geometry,
commentary, themes, or Core/Simulation logic changed.
-->
<!DOCTYPE html>
<!--
TrigammonX v2.3.8 — Beta Updates Continuity / Credits Hotfix
(Source: approved v2.3.5 public package.)
Presentation/history only: restores missing recent Beta Updates & Fixes entries
so the visible history no longer jumps directly from v2.3.4 to v2.2.5, and
adds the requested "Thanks Bill!" credits for owner-requested feature/fix work.
No gameplay, rules, AI, RNG, board geometry, saves, commentary playback,
Winner Certificate calculations/export logic, or Core/Simulation code changed.
-->
<!--
TrigammonX v2.3.8 — Winner Certificate Export Hotfix
(Source: approved v2.3.4 public package.)
Presentation/export-only pass: improves Winner Certificate JPG/PNG export
feedback and fallback handling. No gameplay, rules, AI, RNG, board geometry,
statistics calculations, save schema, commentary, or Core/Simulation logic changed.
-->
<!--
TrigammonX v2.3.4 — Post-Game New Game Flow Fix + "Thanks Tony!" Beta
Update

CORRECTION NOTE: an earlier attempt at this v2.3.4 pass was built from
v2.3.0 because no v2.3.1/v2.3.2 package was available in that session's
environment/history at the time (documented as a "discrepancy" in that
attempt's traceability comment and change report). That attempt was
REJECTED once the actual, approved v2.3.2 package (source of this
build) was supplied directly. This build supersedes it entirely: it is
produced from the real, complete, untouched v2.3.2 PUBLIC modular
package — verified by MD5 before and after — and carries across ONLY
the validated New Game fix + "Thanks Tony!" Beta Update from the
rejected attempt (identical code, re-applied here as a patch onto the
real v2.3.2 05-gameplay-interaction.js/06-stats-history.js, which are
byte-for-byte identical to the v2.3.0 files the rejected attempt used —
confirmed by MD5 comparison before patching). Nothing else from the
rejected attempt was carried over. The 0.85×–1.50× Voice Speed presets,
the ▶ Play Sample button (both added in v2.3.1/v2.3.2, after this
project's v2.3.0 Voice Controls pass), and every other v2.3.2 feature
below are preserved completely unmodified — byte-identical except for
the version-reference bumps this pass makes throughout the file. See
TrigammonX-v2.3.4-change-report.md §1 for the full write-up. The
"M51 Spiral Galaxy" board design still does not exist anywhere in this
codebase (see the v2.3.0 block below) — that remains a genuine, correct
non-existence, not a new discrepancy.

TONY R BETA FEEDBACK — BASIS OF THIS PASS: "When the game ends. Eg Red
wins and I click on 'New Game' in the Current Turn it show Blue with 3
x 6spot dice and 9 six moves. but clicking on a piece doesn't do
anything. The rest of the board has reset and all of the pieces are in
the starting position. All the player actions are greyed out. I just
figured out in 'Game Play' I have to click on 'Start Game'! Wasn't
really obvious."

ROOT CAUSE (confirmed by tracing the completed-game -> Winner/Results
-> New Game -> resetToStart() -> renderDicePanel() flow): Tony was
playing Triple Dice mode. resetToStart() (03-rules-engine.js) sets
diceRaw to a cosmetic idle-tray placeholder ([6,6,6] for Triple Dice)
purely so the dice tray isn't visually empty before any real game
exists — never meant to be read as real, actionable data.
renderDicePanel() (05-gameplay-interaction.js) already had a
"Pending First Player" idle-state guard that correctly cleared this
placeholder and showed a clean waiting state — but its condition,
`openingRollRequired && !openingRollResolved`, only covers Official 2
Dice's pre-roll wait. Triple Dice never sets openingRollRequired, so
that guard never engaged, and the placeholder [6,6,6] flowed straight
through expandDice() into the "Available Moves" row as nine live-
looking 6s (exactly Tony's "9 six moves"), while every real player
action correctly stayed disabled (gameStarted was genuinely false) —
making the game look broken rather than merely not-yet-started.

FIX (three small, targeted changes, all reusing 100% existing
functions/logic — no new start-game system, no rewritten reset logic):
(1) renderDicePanel()'s idle-state guard broadened from
`openingRollRequired && !openingRollResolved` to `!gameStarted` — a
strict superset that still covers the original Official 2 Dice case
identically, and now also covers Triple Dice's pre-start idle moment
(and the brief Official 2 Dice opening-roll result hold). Its idle
label is now mode-aware: "Opening roll required" when a roll is
genuinely still needed, "Click Start Game to begin" otherwise. (2)
gocNewGame() (06-stats-history.js, the Winner Certificate's New Game
button) now calls the existing playGame() right after resetToStart() —
the exact same authoritative Start Game entry point a manual click
already goes through. For Triple Dice this starts the new game
immediately (no confusing second action); for Official 2 Dice,
beginPlay()'s own pre-existing "opening roll required" guard safely
no-ops and focuses the Roll for First Player button, so genuine
required player input is retained exactly as before. (3) A second,
deeper pre-existing defect of the same class was found while verifying
fix (2) end-to-end: beginPlay()'s plain else-branch (reached on every
Triple Dice game's very first turn — the only branch with no
opening-roll involvement) never called beginTurnDicePhase(), unlike
every subsequent turn (endTurn() calls it) or Official 2 Dice's first
turn (commitOpeningRollAsLiveTurn() calls it). Without it, the
resetToStart() placeholder dice were left in place and rendered as if
already rolled one step further into the flow than fix (1) alone could
catch — reachable on ANY fresh Triple Dice start, not only via New
Game, confirmed pre-existing by direct testing against the untouched
v2.3.0 build. Fixed by adding the same beginTurnDicePhase() call every
other turn already gets. Ordinary manual Reset to Start (resetToStart()
called directly, not via New Game) is completely unaffected by changes
(2)/(3) and only benefits from change (1)'s same clean idle-state
presentation.

BETA UPDATE: one new newest-first entry added to the existing
BETA_UPDATE_NOTES array (06-stats-history.js) — "Thanks Tony!" credit,
every prior entry and rendering location preserved unchanged.

PROTECTED SYSTEMS UNCHANGED: rules, movement, Bar/hitting/bearing-off,
turn order, opening-roll winner rule, RNG, AI, simulation, validation,
board geometry, CLICK_POINTS, CHECKER_ANCHORS, winner determination,
statistics calculations, save schema, commentary logic, Voice Speed
(0.85×–1.50×) and Play Sample (both v2.3.1/v2.3.2 features), Did You
Know tips, and every other feature not named above. resetToStart()
itself was NOT modified. trigammonx-v257-simulation-lab-stable.html was
not opened, referenced, or modified. See
TrigammonX-v2.3.4-change-report.md for the complete file/function diff
and full regression test matrix.
-->

<!--
TrigammonX v2.3.2 — Voice Speed Sample Button
Derived from approved v2.3.0. Presentation/audio-playback preference change only.
Preserves the 0.85×–1.50× Voice Speed presets and adds a ▶ Play Sample button. Voice Volume remains removed
because it is not required. Existing Scotty audio, commentary triggers/selection,
sequencing, gameplay, rules, AI, RNG, board geometry, saves, stats and GA4 logic
are otherwise unchanged. Locked v257 Core/Simulation baseline not touched.
-->
<!--
TrigammonX v2.3.0 — Voice Controls: Speed + Volume for prerecorded
Scotty commentary playback
(Source note: the handoff spec named "the complete approved TrigammonX
v2.2.9 public package" as source. No v2.2.9 build exists anywhere in
this environment or delivery history — the latest actual approved
public package is v2.2.8 (delivered this session as the GA4
game_started hotfix, see the block immediately below). This pass was
therefore produced from the complete, untouched v2.2.8 PUBLIC modular
package instead, verified by MD5 before and after. See
TrigammonX-v2.3.0-change-report.md §1 for the full discrepancy note.)

This is a SMALL, MODULAR FEATURE PASS — AUDIO PLAYBACK/UI PREFERENCE
WORK ONLY. No rules, movement, legal moves, board geometry, checker
anchors, click points, Bar/hitting/bearing off, turn order, opening
roll, RNG, AI, simulation, validation, winner determination,
statistics, or save-game schema was changed. Existing commentary
modes/styles/availability, Scotty MP3s/paths, phrase IDs, event IDs,
phrase selection, frequency/rarity/cooldowns, WELCOME/OPENING
sequencing, toast timing, Table Talk, Voice On/Off, commentary event
timing, and every audio asset are all fully preserved and untouched —
no audio file was regenerated, renamed, moved, or edited.

1. VOICE SPEED — new compact preset row (0.85× / 1.0× / 1.10× / 1.20×
   / 1.30×, default 1.0×) applied at the ONE authoritative playback
   point, playCommentaryAudioFile() (07-commentary.js) — the single
   reusable <audio> element every Scotty clip, including WELCOME and
   OPENING, already plays through. Sets el.playbackRate; requests pitch
   preservation via el.preservesPitch + the moz-/webkit- vendor
   equivalents, each in its own try/catch so an unsupported browser
   never breaks playback. Does not alter commentary trigger timing —
   existing sequencing (armCommentarySettleWatch()/the real 'ended'
   event) continues to use actual completion at whatever rate is
   selected. The separate, Developer/Admin-only browser-TTS Narrator
   Voice tuning (voiceRate/voicePitch, SpeechSynthesisUtterance,
   speakUtteranceNow()) is completely untouched.

2. VOICE VOLUME — new compact slider + percentage (0-100%, default
   100%), applied at the same one point via el.volume. Affects ONLY
   Scotty/commentary audio — never UI/dice sounds (uiSoundEnabled,
   10-clocks-themes-ui.js, untouched) or system volume. Voice On/Off
   (voiceEnabled) remains the master switch, unchanged; because volume
   is applied fresh on every real playback call and Voice Off simply
   means that call never happens, turning Voice back on automatically
   plays at the selected volume with no separate "restore" step needed.

3. PERSISTENCE — trigammonx_voice_speed / trigammonx_voice_volume,
   two new standalone localStorage keys (07-commentary.js), separate
   from the existing bundled VOICE_PREFS_KEY. Validated on load;
   invalid/missing values fall back to 1.0×/100%. Never written into
   serializeGameState()/restoreGameState(), named saves, .tgxsave,
   statistics, the Winner Certificate, or any GA4 event — 09-saves.js
   was touched only for the appVersion metadata bump. resetToStart()
   does not reference either variable, so Reset/New Game leaves them
   untouched, exactly like the existing uiSoundEnabled preference.

4. UI — placed compactly with the existing PUBLIC Voice/Commentary
   controls. Note: as of v260 those controls live in the "Table Talk"
   card (.under-board-commentary, id="voice-enabled-select" etc.), not
   inside #tx-section-pro itself (the old TTS Narrator Voice/Style/Test
   Voice/Speed/Pitch block was relocated OUT of the public UI to
   Developer/Admin at that point — see README-ARCHITECTURE.md). The new
   Speed/Volume controls were placed directly below the existing Voice
   On/Off row in that same Table Talk card — functionally exactly where
   the spec's "existing public Voice/Commentary controls" actually live
   today — rather than inside #tx-section-pro, which no longer hosts any
   voice controls. No new large panel; #tx-section-pro itself was not
   touched at all.

Second discrepancy note: the spec also asked to preserve a third board
design, "M51 Spiral Galaxy" (with its internal ID/image path "unchanged
from v2.2.9"). No such design exists anywhere in this codebase's
history — TRIGAMMONX_BOARD_DESIGNS (defined in this file, next to
#board-img) and its 01-config-data.js fallback both list only Classic
and Blue Circuits, and no .board-design-btn markup for a third design
exists either. Same root cause as the v2.2.9 source discrepancy above.
Per the spec's own hard-protection rule ("no opportunistic
fixes/additions... audio playback/UI preference work only"), no M51
board design was invented or added this pass — only the two designs
that actually exist were touched (not modified, just re-verified
working). See TrigammonX-v2.3.0-change-report.md for the full note.

See TrigammonX-v2.3.0-change-report.md for the complete file/function
diff, root-cause-free rationale (this is new-feature work, not a bug
fix), and full test matrix.

PUBLIC DEPLOYMENT: unchanged — exactly ONE public URL,
https://trigammonx.com/xgame/Play-TrigammonX.html, served by this file
(Play-TrigammonX.html) loading trigammonx-v2.3.0/. No separate Tony/
tester build, tester link, or TrigammonX-v2.2.0.html alias.
-->

<!--
TrigammonX v2.2.8 — GA4 Hotfix: game_started missing on the Official
2 Dice opening-roll auto-start path
(Source: complete TrigammonX-v2.2.7.html PUBLIC modular package [the
approved v2.2.7 Human Roll Ownership hotfix release], which was NOT
modified by this pass — verified by MD5 before and after. This is a
SMALL, ANALYTICS-ONLY HOTFIX. No Google Analytics configuration was
changed — only the game-side hook that decides WHEN game_started fires.

REAL GA4 OBSERVATION: theme_selected was received correctly in GA4
Realtime, but game_started never appeared after starting a brand-new
game. Root cause CONFIRMED by reading beginPlay()
(05-gameplay-interaction.js) and commitOpeningRollAsLiveTurn()
(03-rules-engine.js): beginPlay() was the ONLY existing
txTrack('game_started', ...) call site, but commitOpeningRollAsLiveTurn()
— which auto-starts the game directly (v236 Fix 1) the instant the
opening roll resolves — never calls beginPlay(). Since openingRollRequired
is true for Official 2 Dice (the default/most common mode), the normal
way an Official 2 Dice game starts never reached beginPlay() at all, so
game_started silently never fired for it. beginPlay() itself is only
actually reached for games with no opening roll requirement — i.e.
Triple Dice — which is why that path worked fine all along.

FIX: one new, small, analytics-only helper, txTrackGameStartedOnce()
(10-clocks-themes-ui.js), with its own exactly-once guard
(_txGameStartedFiredForThisGame — analytics-only, never read by any
other code, no save-schema/gameplay-state impact). Called from BOTH real
game-start paths — beginPlay() and commitOpeningRollAsLiveTurn() — using
the exact same four existing parameters (dice_mode/ai_level/theme/
opponent_mode) and preserving the exact same Auto Match/headless/
simulation-batch suppression the original v2.2.4 call site had. The
guard is reset in exactly one place, resetToStart() (the single function
behind both manual Reset Game and Winner Certificate New Game), so the
next genuinely new game fires its own game_started — Pause/Resume, Take
Back, and save/load never re-trigger it, since none of them call
resetToStart(), beginPlay(), or commitOpeningRollAsLiveTurn() for an
already-started game.

No rules/movement/AI/RNG/opening-roll behavior/turn handling/save
schema/Winner Certificate/commentary/clocks/UI styling code was changed.
The existing theme_selected, game_completed, and Winner Certificate GA4
events are untouched. See TrigammonX-v2.2.8-change-report.md for the
full audit and test matrix.

PUBLIC DEPLOYMENT: unchanged — exactly ONE public URL,
https://trigammonx.com/xgame/Play-TrigammonX.html, served by this file
(Play-TrigammonX.html) loading trigammonx-v2.2.8/. No separate Tony/
tester build, tester link, or TrigammonX-v2.2.0.html alias.
-->

<!--
TrigammonX v2.2.7 — Public Hotfix: Human Roll Ownership + End Turn
Visibility + Beta Pro Label
(Source: complete TrigammonX-v2.2.6.html PUBLIC modular package [the
approved v2.2.6 Winner Certificate Visual Parity release], which was NOT
modified by this pass — verified by MD5 before and after. This is a
SMALL PUBLIC HOTFIX. The Winner Certificate design itself was not
revisited this pass.

BUG FIX — HUMAN ROLL OWNERSHIP (see TrigammonX-v2.2.7-change-report.md
for the full root-cause trace): a public player reported that their
Human (Blue) roll was already completed for them with no chance to
click Roll Dice. Root cause CONFIRMED: v2.2.6's
shouldBypassVisibleTurnFlow() — used by beginTurnDicePhase() to decide
whether to instantly pre-generate a new turn's dice — included
isSimulationMode() (true whenever the AI Speed selector is set to
"Simulation") by itself, with no check for whether the current player
was actually a human or whether this was a genuine automated/batch run.
So selecting AI Speed = Simulation in an ordinary visible Human vs
Computer game (or restoring a save with aiSpeedMode='simulation') caused
beginTurnDicePhase() to treat the human's own turn as an automated
simulation turn and instantly pre-roll their movement dice — exactly the
reported symptom. AI Speed is meant to control ONLY Computer pacing.

FIX: a new, narrower predicate, isAutomatedTurnFlow() (05-gameplay-
interaction.js), true only for headlessSimulationActive ||
simulationBatchActive || (autoMatchRunning && isSimulationMode()) — i.e.
genuine headless/batch Auto Match runs, never merely "Simulation is the
selected AI Speed." beginTurnDicePhase() now uses this predicate instead
of shouldBypassVisibleTurnFlow() to decide whether to pre-roll a new
turn's dice at all. rollDiceFromTray() (the shared roll-animation
function used by both the human Roll Dice click and the Computer's own
animated roll) was similarly narrowed: it bypasses to an instant roll for
genuine automated flow OR when the roll belongs to a Computer player
under Simulation speed (isComputerPlayer(playerColour)) — so Simulation
speed still legitimately accelerates Computer rolls, but a Human's roll
always keeps its normal visible, click-triggered behavior regardless of
the AI Speed selector. shouldBypassVisibleTurnFlow() itself is UNCHANGED
and still used for its one other, unrelated purpose (silencing UI sound
during Auto Match/headless/Simulation-speed testing) — that behavior was
not part of the reported bug and was left exactly as-is.

SECOND FIX — END TURN VISUAL: setEndTurnReady()/the .end-turn-ready
toggle logic is completely unchanged (no legality/turn-completion
changes) — only the CSS for the READY state was restyled, from a filled-
blue treatment to a bright warm-gold filled button (theme-aware via the
existing --tx-gold/--tx-gold-bright/--tx-gold-dim tokens), dark
high-contrast text, a stronger border, a visible glow, bolder text, and
a subtle pulse gated behind prefers-reduced-motion: no-preference. The
NOT-ready/disabled state is untouched and stays subdued; Take Back keeps
its existing, deliberately less-prominent amber styling.

THIRD ITEM — PRO HEADER: copy/presentation only. The TRIGAMMONX PRO
section header now also shows a smaller "Free During Beta" badge between
the title and its existing subtitle. No entitlement/payment logic —
PRODUCT_TIER and all existing Free/Pro gating are completely untouched.

The locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched. No movement/Bar/hitting/bearing-off/max-dice/
opening-roll-winner-rule/turn-order/RNG/AI-strategy-evaluation-lookahead/
Computer (Pro) move strength/board-geometry/save-schema-or-keys/named-
saves/.tgxsave-format/commentary-behavior/GA4-architecture-or-events/
Winner-Certificate-data-or-stat-calculations/personal-record-data/Match
Score/Tournament Clock/Doubling Cube code was changed. The v2.2.1
responsive Game Setup fix, the v2.2.3 Reset/visible-dice-animation
cancellation fix, v2.2.4 GA4, v2.2.5/v2.2.6 Winner Certificate/export
functionality, the v2.2.6 corrected Avg Roll Total/Dice Fortune labels,
and existing Thanks Bill!/Tony!/AI credits are all preserved and
re-verified. See TrigammonX-v2.2.7-change-report.md for the full audit.

PUBLIC DEPLOYMENT: unchanged — exactly ONE public URL,
https://trigammonx.com/xgame/Play-TrigammonX.html, served by this file
(Play-TrigammonX.html) loading trigammonx-v2.2.7/. No separate Tony/
tester build, tester link, or TrigammonX-v2.2.0.html alias.
-->

<!--
TrigammonX v2.2.6 — Winner Certificate Visual Parity + Results Label Audit
(Source: complete TrigammonX-v2.2.5.html PUBLIC modular package [the
approved v2.2.5 Winner Certificate release], which was NOT modified by
this pass — verified by MD5 before and after. This is a VISUAL PARITY /
PRESENTATION pass only: every v2.2.5 result calculation, GA4 event,
JPG/PNG export path, Share Results implementation, board-design
detection, Personal Record tracking, Pip Race/Dice Fortune data, and the
winner-title heuristic are preserved and reused as-is — only the
Winner Certificate's COMPOSITION and STYLING changed, per an explicit
task spec asking for a premium "collectible certificate" presentation
(ornate gold certificate frame, large champion medallion, dominant
central winner masthead, a large framed board-design panel, a compact
three-column Blue/Green/Red player-results table replacing three tall
per-player cards, an Official Result seal, and a restyled action bar).

RESULT-LABEL AUDIT (see TrigammonX-v2.2.6-change-report.md for the full
trace): v2.2.5's "Dice Average" featured tile and its "X.X avg / die"
sub-text were misleading. The underlying value
(diceRolledTotal/rollsMade) is the average TOTAL of all dice combined
per roll EVENT (~7.0 for Official 2 Dice, ~10.5 for Triple Dice), not a
per-individual-die average — relabeled "Avg Roll Total" with an accurate
sub-text. Separately, the "Dice Fortune" Lucky/Tough/Average bucketing
was comparing that same per-roll-event total against the per-die neutral
expectation of 3.5, which made nearly every 2-dice/3-dice game register
as "Lucky Rolls" regardless of actual luck — it now correctly uses
diceRolledTotal/diceRollCount (the true per-die average, already tracked,
no new stat). No statistical calculation was changed to fit a label —
both figures already existed; only the label text and this one
call-site pairing were corrected.

Also per this pass's explicit spec: "Thanks Bill!" credit was added to
five existing Beta Update entries (v2.2.1, v2.2.0, both v2.1.9 entries,
v2.1.5 Computer (Pro)) that previously had no credit — text/dates
unchanged.

The locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched. No rules/movement/Bar/hitting/bearing-off/
max-dice/doubles-triples/opening-roll/turn-order/winner-determination/
RNG/AI-strategy/board-geometry/save-format/commentary code was changed.
The v2.2.1 responsive Game Setup fix and the v2.2.3 Reset/visible-dice-
animation cancellation fix are both preserved and re-verified. All GA4
events (game_started/game_completed/theme_selected/feedback_clicked/
winner_certificate_exported/_shared/_new_game/_viewed) are preserved
unchanged, Measurement ID G-YVJDNE6L2G. See
TrigammonX-v2.2.6-change-report.md for the full audit.

PUBLIC DEPLOYMENT: unchanged from v2.2.5 — exactly ONE public URL,
https://trigammonx.com/xgame/Play-TrigammonX.html, served by this file
(Play-TrigammonX.html) loading trigammonx-v2.2.6/. No separate Tony/
tester build, tester link, or TrigammonX-v2.2.0.html alias.
-->

<!--
TrigammonX v2.2.5 — Public Beta Winner Certificate + GA4 Analytics
(Source: complete TrigammonX-v2.2.4.html modular package [the approved
v2.2.4 GA4 Beta Analytics release], which was NOT modified by this pass
— verified by MD5 before and after. All v2.2.4 GA4 functionality
(gtag.js loader, txTrack(), initTxAnalytics(), the four existing events
game_started/game_completed/theme_selected/feedback_clicked, and Auto
Match/headless/simulation suppression) is preserved unchanged. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from — no
Core/Simulation dependency was needed for this pass.

WHAT THIS PASS ADDS: the existing "Game Over Celebration" winner/results
dashboard (#goc-backdrop/#goc-card/showGameOverCelebration(),
06-stats-history.js) is substantially upgraded into a premium "Winner
Certificate" — a deterministic winner title + one-line summary, a
board-design badge (real board thumbnail, not text), winner-focused
Featured Match Highlight tiles, an expanded Game Details card (mode,
date, duration, board turns, starting player, roster, board design), a
LOCAL-ONLY Personal Record snapshot (new key
trigammonx_personal_results_v1 — never sent to GA4, never touches
SAVE_KEY/NAMED_SAVES_KEY/.tgxsave), and client-side JPG/PNG export +
image-first Share Results (html2canvas, lazy-loaded only on first
export/share click). "Did You Know?"/"Beta Updates & Fixes" were REMOVED
from inside the certificate only — both remain exactly where they were
on the always-present main-page row (#tx-info-row), fed by the same
unchanged gocRenderDykMounts()/gocRenderBetaMounts() functions. Three new
GA4 events (winner_certificate_exported/_shared/_new_game, plus the
optional winner_certificate_viewed) use the existing txTrack() helper
only — no player names, no personal-record data, and no raw move/dice/
save data are ever sent to GA4. No rules/movement/Bar/hitting/bearing-
off/max-dice/doubles-triples/opening-roll/turn-order/winner-determination/
RNG/AI-strategy/board-geometry/save-format code was changed. The v2.2.1
responsive Game Setup fix and the v2.2.3 Reset/visible-dice-animation
cancellation fix are both preserved and re-verified. See
TrigammonX-v2.2.5-change-report.md for the full audit.

PUBLIC DEPLOYMENT: this release retires the TrigammonX-v2.2.0.html
tester-alias convention. There is now exactly ONE public URL,
https://trigammonx.com/xgame/Play-TrigammonX.html, served by this file
(Play-TrigammonX.html) loading trigammonx-v2.2.5/. No separate Tony/
tester build or link is created for this or future releases unless a
future task explicitly reintroduces one.
-->
<!--
TrigammonX v2.2.4 — GA4 Beta Analytics Integration
(Source: TrigammonX-v2.2.3.html [the approved v2.2.3 modular entry
document], which was NOT modified by this pass — verified by MD5 before
and after: 44de4469c54d3324c195b51c4b254afe. The locked
trigammonx-v257-simulation-lab-stable.html Core/Simulation baseline was
not touched, edited, patched, or derived from — no Core/Simulation
dependency was needed for this pass.)

WHAT THIS PASS ADDS: lightweight, anonymous Google Analytics 4 tracking
(Measurement ID: G-YVJDNE6L2G) — ADDITIVE ONLY, per the task spec. No
game rules, movement, AI, RNG, turn handling, dice logic, simulation
logic, validation, save format, or game outcome was changed in any way.
An analytics failure (ad-blocker, offline, GA unreachable) can never
affect gameplay — every entry point is wrapped in try/catch and fails
silently. No names, emails, exact IPs, accounts, or other persistent
personal identifiers are ever collected.

WHAT WAS ADDED, exactly:
1. Standard GA4 gtag.js loader — this document's <head>, below.
2. txTrack(eventName, data) helper + three small read-only derivation
   helpers (_txAiLevel/_txOpponentMode/_txCurrentTheme, all reading
   EXISTING state — no new game state introduced) + the click-delegated
   theme_selected/feedback_clicked wiring (initTxAnalytics()) — all in
   trigammonx-v2.2.4/js/10-clocks-themes-ui.js, one self-contained block
   at the end of the file (same "fails silently, single entry point"
   contract as the pre-existing UI Sound System in that same file).
3. Four one-line call sites, each firing exactly once at an existing UI/
   lifecycle event (never on every move/roll/simulation tick):
   - game_started  — beginPlay(), 05-gameplay-interaction.js (guarded:
     skipped during Auto Match/headless/simulation batches).
   - game_completed — finishGame(), 06-stats-history.js, reusing that
     function's own pre-existing "real human-visible games only" guard.
   - theme_selected — click delegation in initTxAnalytics() (covers both
     the Full UI Theme swatches and the Board Design buttons — the
     spec's single "board/theme" event).
   - feedback_clicked — openBetaFeedback(), 01-config-data.js (the "Give
     Beta Feedback" button), plus the same click delegation for the
     separate footer feedback link.
See TrigammonX-v2.2.4-change-report.md for the full audit, exact hook
points, and GA4 Realtime verification results.
-->
<!--
TrigammonX v2.2.3 — Complete Reset/Dice-Animation Cancellation Fix
(Source: TrigammonX-v2.2.2.html [the approved v2.2.2 modular entry
document], which was NOT modified by this pass — verified by MD5 before
and after: 463c71ae609fdb3e17933254da8e081b. The locked
trigammonx-v257-simulation-lab-stable.html Core/Simulation baseline was
not touched, edited, patched, or derived from.)

WHY v2.2.2 WAS INCOMPLETE: v2.2.2 correctly added a caller-level
staleness guard (humanRollToken) so an abandoned human roll's .then()
could no longer WRITE stale game state after Reset — but it never
cancelled the ANIMATION itself. rollDiceFromTray() (05-gameplay-
interaction.js) is a long chain of awaited delays/timers (tray-to-row
travel, per-die stagger, arrival bounce, optional settle hold, a 480ms
settle timer per die, plus a 6s failsafe) that ran to completion
regardless of Reset. That meant an abandoned roll could still create
travelling dice after Reset, still reach its own
`await renderRolledDice(values, playerColour, false)` call, and still
repaint stale dice onto the freshly-reset page — entirely independent of
whether rollDice().then() ever ran its now-guarded state-write.

FIX — the animation now owns a single generation counter,
`visibleRollGeneration` (replacing v2.2.2's humanRollToken — same role,
unified into the animation's own counter). rollDiceFromTray() captures
this generation once at the start and re-checks it
(isVisibleRollGenerationValid()) at every meaningful await/timer
boundary inside itself — 9 boundaries in total, audited one-by-one in
TrigammonX-v2.2.3-change-report.md. Once stale, a boundary stops doing
further visual/DOM work (no new travellers, no repaint, no touching a
newer roll's tray/row state) but ALWAYS still resolves its Promise —
cancelled rolls terminate cleanly, never hang, never throw. The 6s
failsafe (forceFinishRoll()) is now generation-guarded too. Zero rule/
AI-strategy/RNG/board/save changes; the AI's own separate
aiRunToken/isAiRunStillValid() state-write guard is untouched.
-->
<!--
TrigammonX v2.2.2 — Reset Game Lockup / Stale Dice Lifecycle Fix
(Source: TrigammonX-v2.2.1.html [the approved v2.2.1 modular entry
document], which was NOT modified by this pass — verified by MD5 before
and after: 8fdb71d7d3c8d6bff249458f5dc7ac7e. The locked
trigammonx-v257-simulation-lab-stable.html Core/Simulation baseline was
not touched, edited, patched, or derived from.)

PUBLIC TESTER REPORT (Tony, iPad, public v2.2 build): "Ran into an issue
with Reset Game. Locks up and just shows blue with a bunch of 6's."

ROOT CAUSE — a pre-existing latent race condition, present unchanged
since at least v2.1.9 (NOT introduced by v2.2.0's modularisation; see
TrigammonX-v2.2.2-change-report.md §6 for the byte-level comparison).
The human Roll Dice path (rollDice(), 05-gameplay-interaction.js) had no
staleness/generation guard on its rollDiceFromTray() .then() completion
— unlike the AI's equivalent roll path, which already re-validates
itself against aiRunToken/isAiRunStillValid(). If Reset Game is clicked
while a human roll's ~2-3s tray animation (or its 6s failsafe) is still
in flight, the abandoned roll's completion always fired anyway and
unconditionally wrote diceRaw/diceExpanded/turnDiceRolled and re-painted
dice into the just-reset game — and because resetToStart() never reset
the shared `isRolling` flag or cleared the tray-animation failsafe timer
either, the abandoned roll could also leave Roll Dice (and any future AI
roll) permanently blocked, and could repaint stale dice — a double/
doubles roll expands to 4 visible dice — well after Reset, exactly
matching "locks up ... a bunch of 6's."

FIX — SMALL, LIFECYCLE-SCOPED ONLY. Zero rule/AI/RNG/board/save changes.
Added a dedicated `humanRollToken` generation counter and a single
cancelInFlightVisibleRoll() cleanup function (05-gameplay-interaction.js)
that resetToStart() now calls alongside its existing bumpAiRunToken
('reset') call. It bumps the token (so rollDice()'s stale .then() safely
no-ops instead of writing state), clears the dice-animation failsafe
timer, removes any live travelling-die elements, and resets `isRolling`
— all using only existing state, no new timers/polling. See the change
report for the full reproduction matrix (27 scenarios) and results.
-->
<!--
TrigammonX v2.2.1 — Responsive Game-Setup Parity Fix
(Source: TrigammonX-v2.2.0.html [the modular v2.2.0 entry document], which
was NOT modified by this pass — verified by MD5 before and after:
ccb8141c59f327b11a93d6f224d10618. The locked
trigammonx-v257-simulation-lab-stable.html Core/Simulation baseline was
not touched, edited, patched, or derived from.)

SMALL RESPONSIVE CSS FIX ONLY — zero DOM change, zero gameplay change, zero
architecture change. Root cause: at the existing @media (max-width: 980px)
breakpoint, `.page-layout` collapses from two columns to one, but DOM
source order (`.board-column` before `.right-panel`) meant the Game Setup
panel — Player Types, Player Names, Dice Mode — rendered far below the
entire board + Player Actions + Game Flow stack on tablet/narrow layouts.
Player Name inputs (#pn-blue/#pn-green/#pn-red) and Player Type selects
were NEVER missing from the DOM in v2.2.0; this was a responsive
placement issue only, not a regression from modularisation. Fix: two
`order` declarations added inside the existing 980px media query in
trigammonx-v2.2.1/css/01-base-layout.css (`.right-panel { order: 1; }`,
`.board-column { order: 2; }`), using the existing CSS Grid container —
no new elements, no duplicated markup, no duplicated IDs, no JS changes
to gameplay/rules/AI/saves/commentary. Desktop/wide layout (>980px) is
byte-identical in behavior to v2.2.0. See
TrigammonX-v2.2.1-change-report.md for the full test matrix and audit.

PUBLIC-STABLE ALIAS: the permanent tester URL
https://trigammonx.com/xgame/TrigammonX-v2.2.0.html is preserved via a
separate deployment copy (top-level TrigammonX-v2.2.0.html) that contains
this same corrected v2.2.1 markup but loads its CSS/JS from
trigammonx-v2.2.1/. See README-ARCHITECTURE.md "PUBLIC DEPLOYMENT ENTRY".
-->
<!--
TrigammonX v2.2.0 — Architecture / Modularisation Pass
(Source: TrigammonX-v2.1.9.html, which was NOT modified by this pass —
verified by MD5 before and after: e4afc54565c1f75a5106ee5cb8417af5. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.)

STRUCTURAL ONLY — zero feature/behavior change. The ~14,155-line embedded
<style>/<script> content of v2.1.9 was split into external, versioned,
classic (non-module) files under trigammonx-v2.2.0/css/ and
trigammonx-v2.2.0/js/, loaded from this now-thin entry document in the
exact effective order documented in trigammonx-v2.2.0/README-ARCHITECTURE.md.
Every top-level declaration/statement was moved via an exact-line-range
extraction verified byte-for-byte against the v2.1.9 source (see the
change report); nothing was rewritten, renamed, reformatted, or
reordered relative to its own file's internal execution order. The one
exception, made deliberately and narrowly: the five separate places in
v2.1.9 where `renderAll` is progressively monkey-patched
(`renderAll = function(){ _renderAll_vNN(); ... }`) were kept together,
in their original relative order, inside a single file
(05-gameplay-interaction.js) specifically because splitting that chain
across files would depend on inter-file load order to reproduce
correctly — see README-ARCHITECTURE.md "Shared state ownership" and the
change report's audit section for the full reasoning. All existing
global names, inline onclick/onchange handler targets, localStorage
keys, and asset URLs are unchanged. See TrigammonX-v2.2.0-change-report.md
for the full audit, extraction verification, and regression results.
-->
<!--
TrigammonX v2.1.9 — Named Saved Games, Portable Export/Import, Board Designs
(Source: TrigammonX-v2.1.8.html, which was NOT modified by this pass —
verified by MD5 before and after: 394fefde5d34eed84e35c0ab74a44064. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.)

Owner-requested storage/presentation pass — no gameplay, rules, RNG, AI,
stats, commentary, or board-geometry changes. Summary:
1) Named Saved Games — Manual Save is now "Save Game As… (Pro)": the
   player names only a Game Name; Players/Saved date-time/Mode/App
   Version are recorded automatically using the existing display-name
   helpers. Records live in a new NAMED_SAVES_KEY =
   'trigammonx_named_saves_v1' library (array of {id, gameName, savedAt,
   players, diceMode, appVersion, state}), reusing the existing,
   unmodified serializeGameState()/restoreGameState() exactly once per
   load path. No application-created expiry — a named save is only ever
   removed by explicit user Delete.
2) Autosave/Recovery stays fully separate — SAVE_KEY remains exactly
   'trigammonx_v172_saved_game', untouched in name and behavior; the new
   Load Saved Game… library shows any existing SAVE_KEY payload in its
   own "Autosave / Recovery" section (via the existing, unmodified
   loadGameFromLocalStorage()) so it can be loaded and, if desired,
   promoted into the named library with Save Game As… — the two stores
   never read or write each other.
3) Portable .tgxsave files — Save & Export and a per-save Export action
   wrap the existing serializeGameState() payload in a small JSON
   envelope ({format, formatVersion, gameName, savedAt, players,
   diceMode, appVersion, state}) and offer it via Web Share (iPad/iOS,
   feature-detected) or a Blob-URL download fallback. Import validates
   format/formatVersion/shape defensively (no eval, no innerHTML of
   untrusted strings) before offering it into the named library.
4) Board Design library — one source of truth,
   window.TRIGAMMONX_BOARD_DESIGNS ('classic' and 'blue-circuits'),
   defined next to #board-img so the first paint already honors the
   saved choice; a public selector in the existing Pro Themes area
   switches only #board-img.src via the new applyBoardDesign(), and a
   failed image load falls back to Classic exactly once with a small
   non-blocking notice. The choice persists as a presentation-only
   preference (trigammonx_board_design) that named saves, autosave, and
   Reset/New Game never override. CLICK_POINTS/CHECKER_ANCHORS/Rotate
   Board math/board geometry are untouched.
5) Two new Did You Know tips and two newest-first Beta Updates entries
   describe Save Game As and Board Design; all prior tips/updates are
   preserved.
Version bump only elsewhere: v2.1.8 → v2.1.9 (title, badge, page heading,
footer, this comment). See TrigammonX-v2.1.9-change-report.md for the
full audit, validation results, and protected-region confirmation.
-->
<!--
TrigammonX v2.1.8 — Computer (Pro) Strength Pass
(Source: TrigammonX-v2.1.7.html, which was NOT modified by this pass —
verified by MD5 before and after: 7102ea719455c60cd18b7c248099c200. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.)

Motivated by public beta tester Tony beating Computer (Pro) 3 games out
of 3 — explicitly NOT statistical proof, but a strong enough real-player
signal to justify another AI strategy pass. All changes are confined to
the AI engine section; legal move generation, movement/bar-entry/bearing-
off/hit rules, RNG, turn order, winner determination, End Turn/Pause-
Resume/Save-Load/Take-Back/commentary/Table Talk/stats/dashboard/Did You
Know/Beta Updates/themes/clocks logic are all untouched (see the change
report for the full protected-region confirmation). Summary:
1) Phase 2 — immediate win/loss threat firewall: an unconditional
   "win now" short-circuit if any legal sequence borns off the AI's 15th
   checker, plus a large-but-finite score penalty when either opponent
   is estimated to win on their very next turn.
2) Phase 3 — genuinely SEQUENTIAL three-player lookahead
   (aiEvaluateSequentialRound): the third player's modeled reply is
   chained against the board the next player's own best reply actually
   left behind, not the original candidate board, replacing v2.1.7's
   independent (non-chained) two-opponent estimate.
3) Phase 5 — stronger position evaluation: asymmetric next-vs-third
   opponent blot risk, a dynamic risk multiplier that scales with
   leading/close/trailing, a home-board bear-off distribution term, and a
   bounded future-mobility tie-break applied only to the top two
   sequential-lookahead candidates.
4) Phase 6 — genuine iterative deepening: a two-stage search (cheap
   non-doubles fast pass over every top-K candidate, then a full-sample
   refine pass on only the closest one or two) added after measured
   profiling showed a single-stage full-sample pass was consistently
   using the entire time budget; the time budget itself was raised
   400ms → 1200ms as a hard ceiling for this planner-controlled work.
5) Phase 7 — Triple Dice: profiled directly; kept to the existing static
   evaluator + Phase 2 firewall (no chained sequential search), and the
   small independent opponent-win-chance sample was corrected to exclude
   all-three-same rolls after measurement showed those can cost seconds
   per call on the existing, unmodified, protected legal-move engine —
   full measured numbers and reasoning are in the change report.
6) Phase 9 — a test-harness-only (never publicly exposed) exact
   reproduction of the v2.1.7 planner, gated behind a harness-only
   AI_BASELINE_SEATS flag, added solely to benchmark v2.1.8 against
   v2.1.7-style opponents; the public game is unaffected by its mere
   presence.
Version bump only elsewhere: v2.1.7 → v2.1.8 (title, badge, page heading,
footer, this comment). See TrigammonX-v2.1.8-change-report.md for the
full audit, benchmark, tactical test matrix, and regression results.
-->
<!--
TrigammonX v2.1.7 — Quick UI / Copy Polish Pass
(Source: TrigammonX-v2.1.6.html, which was NOT modified by this pass —
verified by MD5 before and after: dd70a52dc9799f1e8ea6297b1e9e5a10. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.)

Small, fast owner-requested copy/layout pass — no AI, rules, RNG, stats
definitions, charts, board geometry, save/load, commentary engine, or
Core/Simulation logic touched. Four changes:
1) DID_YOU_KNOW_TIPS: removed the Auto Match tip (Auto Match is
   Developer/Admin-only, never public — the tip was inaccurate for
   public players) and replaced it with a genuine public feature
   (Commentary Frequency); corrected the red-× tip so it describes a
   blocked/unplayable die only, never an already-used die.
2) BETA_UPDATE_NOTES: corrected wording/credits so the list describes
   the actual documented fixes — the v2.1.3 and v2.1.2 entries now read
   "End Turn could remain disabled" (a blocked-Bar-turn case and a
   separate Pause/Resume resync case, respectively) instead of the
   previous, inaccurate "6+5 bearing-off matrix"/"legal move" wording;
   the bearing-off/legal-move engine itself was always correct. Two
   further genuinely-documented entries (v2.1.1 stall protection, v2.1
   Device Preview leakage) were added. Newest-first order and the
   single shared BETA_UPDATE_NOTES source (main page + dashboard) are
   unchanged.
3) The main-page #tx-info-row (Did You Know? + Beta Updates & Fixes)
   moved from directly below Table Talk to after the public Game
   Trends charts and before the Developer/Admin shell — a position-only
   move (same element, same id, same data, same render functions); the
   Winner/Results dashboard's own reused copy in its lower row is
   unchanged.
4) Version bump only: v2.1.6 → v2.1.7 (title, badge, page heading,
   footer, this comment). No feature, redesign, or logic change.

Every v2.1.5 AI improvement and every v2.1.6 Winner/Results dashboard
behavior (ranking, Pip Race/Dice Fortune charts and facts, Game
Highlights, Full Game Stats, Share Results, New Game, Close) is
preserved exactly.
-->
<!--
TrigammonX v2.1.6 — Winner/Results UX (Game Over Celebration expansion)
(Source: TrigammonX-v2.1.5.html, which was NOT modified by this pass —
verified by MD5 before and after: 2938df97cebe014ddfe448bb51409e01. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.)

Requested via an uploaded Winner/Results UX spec + design mockup:
expand the EXISTING v195 Game Over Celebration system (#goc-backdrop/
#goc-card/showGameOverCelebration()/gocNewGame()/gocCopyReport()/
closeGameOverCelebration()) into a dramatically improved, responsive
winner/results dashboard — not a second, competing modal.

Summary (full detail, data-source mapping, and the 25-item test/
validation checklist are in TrigammonX-v2.1.6-change-report.md):
- #goc-card widened (max-width 1180px) and made internally scrollable
  (max-height 94vh) with a new sticky top bar (Mode/Duration/Board
  Turns/optional Date + Share Results/New Game/Close), so Close and New
  Game stay reachable at every scroll position and viewport width.
- Three ranked player result cards — the real winner plus a
  presentation-only 2nd/3rd ranking (borneOff desc, then pips asc,
  ties sharing a rank) via the new gocRankPlayers(); the real
  `winner`/`gameOver` values set once by finishGame() are never touched
  by this ranking.
- Pip Race and Dice Fortune charts reuse the EXISTING
  buildTrendLineChartSVG()/liveGameHistory/GT_COLORS/GT_LEGEND_HTML
  verbatim (no new charting library, no redefinition of either chart's
  semantics) — plus new tie-safe derived facts (leader-for-most-turns,
  lead changes, biggest lead + turn) computed by the new
  gocComputePipRaceFacts().
- A Game Highlights panel (gocComputeHighlights()) and a collapsible,
  UNGATED Full Game Stats panel report only real/derived playerStats
  values — the same values buildGameReportText() already reports —
  with a non-blocking Pro-discovery line; no invented achievement,
  score formula, or luck percentage was added, per spec.
- Share Results (gocShareResults()) is new: navigator.share preferred,
  falling back to the existing navigator.clipboard.writeText()/setInfo()
  pattern already used by copyGameReport()/copyMatchSummary()/
  copyMatchLog(). No server call, no analytics.
- A "Did You Know?" box and a "Beta Updates & Fixes" box (newest-first,
  crediting Tony only where the v2.1.5 change report documents it, and
  explicitly NOT mislabeling the v2.1.5 Blue-1+4 investigation as a
  "fix" since it confirmed correct existing rule enforcement) are now
  always-visible on the main page directly below Table Talk, and reused
  verbatim (same data, same render functions) inside the dashboard's
  lower row.
- One small CSS-only completion of already-planned v2.1.6 markup: the
  Full Game Stats panel's collapse/expand behavior (display:none/block
  on .goc-open) was added, since the toggle button existed but nothing
  yet hid the body by default.

Also, per the spec: Table Talk is completely untouched (verified
byte-identical against v2.1.5), and no AI/rules/RNG/geometry/turn-order
function was modified — this pass is presentation/UI only, reading
already-existing data through already-existing accessor functions.
-->
<!--
TrigammonX v2.1.5 — Computer (Pro) AI Hardening / Strategy Engine
(Source: TrigammonX-v2.1.4.html, which was NOT modified by this pass —
verified by MD5 before and after: 06378d8daf7b4a405bf9288395378997. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.)

Motivation: public beta tester Tony played and won 2 of 2 human-vs-
computer games against Computer (Pro) (the second game took roughly
1h08m) and reported the AI felt easy to beat. Two games are NOT
statistical proof of a weak AI, but the existing architecture — a
greedy, single-move-at-a-time heuristic with no whole-turn planning, no
position evaluation, and no opponent modeling — supports the concern, so
this pass replaces it with a genuine turn-level, three-player-aware
strategy engine while leaving every rule/legality/RNG/turn-order/board
function completely untouched.

Summary of the new Computer (Pro) engine (full detail, audit findings,
tactical test matrix, and A/B benchmark results are in
TrigammonX-v2.1.5-change-report.md):
- Phase 1 (state-simulation safety): a small, explicitly-documented
  withScopedAiGlobals() swap-and-restore wrapper lets AI search reuse
  the existing, UNCHANGED getMaxDiceConstrainedMoves()/applyMove()
  exactly as the live game already validated them, against a
  hypothetical player/bar-state, without ever mutating the live board,
  currentPlayer, stats, history, or triggering any rendering/commentary/
  autosave/Take-Back snapshot while the AI is "thinking." No independent
  AI rules engine exists — legality is 100% authoritative and unchanged.
- Phase 2 (complete-turn planner): aiEnumerateCompleteTurns() performs a
  memoized DFS over every distinct legal complete turn sequence allowed
  by the actual dice/position (respecting mandatory Bar entry, max-dice
  use, doubles/Triple Dice expansion, bearing off, and all existing
  constraints, because every step reuses the same authoritative engine),
  replacing the old one-die-at-a-time greedy choice.
- Phase 3 (position evaluator): aiEvaluatePosition() scores the FINAL
  board of each candidate sequence — race/pip progress for all three
  players, bar pressure, a real shot-counting blot-exposure estimate,
  made-points/blocking/Bar-closure value, stack quality, and leader-
  aware weighting — instead of a single-move heuristic.
- Phase 4 (bounded three-player lookahead): for Official 2 Dice, the top
  candidate sequences are additionally scored by a probability-weighted
  estimate of both opponents' own best replies (each maximizing their
  own position, not a shared adversarial score), bounded by a time
  budget; Triple Dice relies on the mandatory Phase 2+3 upgrade alone
  (documented, measured-performance-driven scope reduction — see change
  report).
- Phase 5 (performance): a hard per-decision time budget with a
  deadline-aware fallback guarantees the mandatory complete-turn
  planner always returns a valid, legal sequence, never an illegal or
  partial one, and never freezes play.
- Live execution is unchanged: the chosen plan is executed one move at a
  time through the existing, untouched executeMove()/endTurn() path with
  normal dice animation, commentary, stats, history, and Pause/Reset/
  aiRunToken cancellation behavior; a move is re-verified against the
  live authoritative legal set immediately before execution and the plan
  is safely replanned if anything has changed.

Also in this pass, one small authorized presentation-only change:
commentary toast/display duration (COMMENTARY_TOAST_VISIBLE_MS) reduced
from 10 seconds to 8 seconds. Does not touch commentary event timing,
cooldowns, frequency gating, phrase selection, or audio playback
duration.

Public product surface is unchanged: still exactly one Computer option,
"Computer (Pro)", public player-type value 'cpu-ai'; no Easy/Medium/
Hard/Expert selector added; old saves remain compatible; no AI-debug
information is exposed publicly. Every prior public-beta fix/feature in
v2.1.4 (Pause/Resume + autosave, the v2.1.3 blocked-Bar-entry fix, and
the v2.1.4 Rotate Board control) is preserved unmodified.
-->
<!--
TrigammonX v2.1.4 — Public Rotate Board control (UI/presentation only)
(Source: TrigammonX-v2.1.3.html, which was NOT modified by this pass —
verified by diff/MD5, byte-identical before and after. The locked
trigammonx-v257-simulation-lab-stable.html Core/Simulation baseline was
not touched, edited, patched, or derived from.)

Requested by public beta tester Tony (iPad): a simple Rotate Board
button so players can inspect the board from the other two viewpoints
during play. v2.1.3 already contained fully validated rotation
infrastructure (PLAYER_ROTATIONS, boardViewMode, boardRotationDeg,
syncBoardView(), setBoardRotation(), setBoardAutoRotate(),
setBoardFixed(), exercised for years by the Admin View controls) — this
pass exposes exactly one new player-facing control, "↻ Rotate Board", in
the existing Game Flow row beside Start/Pause/Resume and Sound. It is
NOT Pro-only/developer-only.

The button is a single new function, cyclePublicBoardView(), that calls
ONLY the existing setBoardRotation()/setBoardAutoRotate() functions —
no new rotation system, no direct manipulation of
#board-rotation-shell/boardRotationAccum/boardRotationDeg, no changes to
currentPlayer/TURN_ORDER/board geometry/click logic. Tapping it cycles,
always starting from whatever the current player's own Auto angle is:
AUTO -> +120° -> +240° -> back to AUTO (via the existing
setBoardAutoRotate() path) -> repeat. Stopping after 1 or 2 taps
intentionally leaves that alternate view showing for the rest of the
turn; Reset/New Game and ordinary turn-to-turn auto-rotation are
unaffected. Full test matrix and reproduction of existing-infrastructure
reuse are in TrigammonX-v2.1.4-change-report.md.
-->
<!--
TrigammonX v2.1.3 — Public beta bugfix pass (Source: TrigammonX-v2.1.2.html,
which was NOT modified by this pass — verified by diff/MD5, byte-identical
before and after. The locked trigammonx-v257-simulation-lab-stable.html
Core/Simulation baseline was not touched, edited, patched, or derived from.)

Prompted by a first public tester's (Tony, iPad) bug report and a
supplied screenshot: "I've got 2 pieces in the centre, I've just rolled
double 5 but the green outer 5 is covered and I can't move on. All
player actions are greyed out." The screenshot confirmed: Official 2
Dice, raw roll 5+5 (four expanded 5s shown), Blue (human) has 2
checkers on the Bar, no bar-entry destination is offered, Roll Dice and
End Turn are both disabled, and the Game Flow button reads "Pause" (the
game is actively running, not paused) — ruling out the v2.1.2
Pause/Resume bug as the cause of this occurrence.

ROOT CAUSE (confirmed, matching the suspected asymmetry): rollDice()'s
post-roll flow calls checkTurnCompleteAfterMove() when a player with NO
Bar checkers rolls into a fully-blocked position, but a player WITH Bar
checkers is routed to onBarCheckerClick() instead — which, when it finds
zero legal bar-entry moves (Bar checkers must re-enter before any other
move, so a blocked Bar entry blocks the whole turn), already recorded
the blocked turn and set an info message, but never called
checkTurnCompleteAfterMove(). End Turn was left stuck in whatever
disabled state rollDice() set at roll start.

FIX: one call added inside onBarCheckerClick()'s existing "no legal
entry" branch — checkTurnCompleteAfterMove('bar entry fully blocked') —
reusing the exact same authoritative completion engine every other
completed-turn path already uses (getMaxDiceConstrainedMoves() via
isCurrentTurnComplete()), unchanged. No bar-entry rule, max-dice-use
rule, doubles expansion, or AI/headless behavior was touched — this
function's own isComputerPlayer()/gamePaused/computerThinking/isRolling
guards make it a safe no-op for every non-human-blocked-turn call site
(rollDice(), setTestDice(), a direct bar-checker click, executeMove(),
afterTurnStarted()). Full investigation, reproduction, and test results
are in TrigammonX-v2.1.3-change-report.md.
-->
<!--
TrigammonX v2.1.2 — Public beta bugfix pass (Source: TrigammonX-v2.1.1.html,
which was NOT modified by this pass — verified by diff/MD5, byte-identical
before and after. The locked trigammonx-v257-simulation-lab-stable.html
Core/Simulation baseline was not touched, edited, patched, or derived from.)

Prompted by a first public tester's bug report (iPad, Autosave mode,
bearing off with dice 6 and 5, "moving the smaller stack"): after his
move, End Move stayed disabled with no available moves shown, and a
later attempt to resume via the supplied game links showed a new game
instead of his saved one. Full investigation, reproduction steps, root
causes, and test results are in TrigammonX-v2.1.2-change-report.md —
summary of what actually changed:

BUG A (End Move stuck disabled) — root cause confirmed by exhaustive
automated testing of the dice-6+5 bearing-off scenario and 13 required
variants (doubles, triples, opponent blocks/hits, order-dependent
max-dice-use, single/final checker, etc.): the core legal-move / turn-
completion engine (getLegalMovesForPlayer(), getMaxDiceConstrainedMoves(),
isCurrentTurnComplete(), checkTurnCompleteAfterMove(), setEndTurnReady())
was ALREADY CORRECT for every one of those scenarios — zero invariant
violations found — and was NOT changed. The actual, reproduced root
cause: nothing in onCheckerClick()/executeMove() gates human moves on
gamePaused, so a move CAN be made while the game is paused (e.g. Pause
was clicked mid-turn); when that move completes the turn,
checkTurnCompleteAfterMove()'s existing (intentional) `if (gamePaused)
return false;` guard silently skips calling setEndTurnReady(), leaving
End Turn stuck disabled even after the turn is genuinely complete. The
gamePaused guard itself was NOT removed (it correctly keeps a paused
display frozen) — the fix is the one missing step: continueGame() now
calls the existing checkTurnCompleteAfterMove() once more, after
gamePaused is cleared, to resynchronize End Turn's true state. A second,
purely cosmetic finding was also fixed: the "Available Moves" die chips
in renderDicePanel() only ever reflected diceUsed[i] (played or not),
never whether an unplayed die still had a legal move anywhere — so a
die with zero legal moves left could still render as "available",
compounding the stuck-looking UI. Chips now also read the existing
getMaxDiceConstrainedMoves() result to show a distinct "dead" style for
an unplayed-but-unplayable die. No dice/legal-move/turn logic changed.

BUG B (autosave not recovered) — autosave coverage was found to already
be comprehensive (every committed transition — move, bear-off, End
Turn, Pause, Continue, Take Back, Begin Play, finishGame, etc. — already
calls the existing maybeAutosave()), and startup/Reset code was
confirmed to never touch the saved game in localStorage before the
player can load it. The one identified, narrow gap: iOS Safari does not
reliably fire 'beforeunload' when a tab is backgrounded or swiped away.
Added a 'pagehide' listener as a backup-only safety net that calls the
EXISTING maybeAutosave() (same SAVE_KEY = 'trigammonx_v172_saved_game',
same serializeGameState()) — no new key, no new serializer, never runs
during simulation/headless, never alters game state, never throws.

STANDING VERSION RULE (carried forward): every future iteration — even
a one-line fix — must ship its own newly incremented public version
number (e.g. v2.1.2 -> v2.1.3 -> v2.2) and must never overwrite an
earlier version file.
-->
<!--
TrigammonX v2.1.1 — Release-candidate patch (three authorized changes
only; everything else byte-identical to TrigammonX-v2.1.html)
Derived exclusively from TrigammonX-v2.1.html, which was not modified by
this pass. The locked trigammonx-v257-simulation-lab-stable.html
Core/Simulation baseline was not touched, edited, patched, or derived
from.
1) STALL_TURN_LIMIT restored from 500 to 1500 — matching the locked
   v257 baseline's value. This is the only Core-related change in this
   patch, explicitly authorized because it restores the public branch
   to the locked validated baseline value; nowhere it's used, no
   surrounding stall-detection/validation/simulation/winner-detection
   logic, was touched.
2) TRIGAMMONX_BETA_FEEDBACK_URL set from '#' to
   'https://trigammonx.com/feedback/'. The Give Beta Feedback button's
   styling, placement, wording, and window.open(...,'_blank','noopener')
   behaviour are unchanged — only the constant's value changed.
3) Public version bumped v2.1 -> v2.1.1: browser title, on-page heading,
   header badge, and footer. No other public-facing wording changed.
No AI/RNG/dice/legal-move/checker-movement/board-geometry/CLICK_POINTS/
checker-anchor/hit/bar/bearing-off/turn-order/opening-roll/tie/winner-
detection/validation/simulation/commentary/Save-Load/Take-Back/Move-
History/Device-Preview/board-plinth-alignment logic or CSS was touched
anywhere in this pass. See TrigammonX-v2.1.1-change-report.md for the
full accounting and targeted diff against TrigammonX-v2.1.html.
STANDING VERSION RULE: every future iteration — even a one-line fix —
must ship its own newly incremented public version number (e.g.
v2.1.1 -> v2.1.2 -> v2.1.3 -> v2.2) and must never overwrite an earlier
version file.
-->
<!--
TrigammonX v2.1 — Public build alignment + version update (presentation/
layout/versioning pass only — no AI/RNG/dice/movement/legal-move/board-
geometry/turn-order/opening-roll/tie/winner/validation/simulation logic
touched anywhere)
Derived exclusively from TrigammonX-Beta-v1.0.html (the current public
build, itself derived from trigammonx-v266.html). TrigammonX-Beta-v1.0.html
was not modified by this pass. The locked
trigammonx-v257-simulation-lab-stable.html Core/Simulation baseline was
not touched, edited, patched, or derived from.
- PUBLIC VERSIONING: every public-facing "Beta v1.0" label updated to
  "v2.1" — browser title, on-page heading, header badge, and footer.
  The existing tasteful tester-thank-you banner (#beta-banner: "Thanks
  for helping test TrigammonX...", "All Pro features are unlocked
  during the Beta...") was left in place unedited, per instruction —
  only the version LABEL itself (the small badge beside the TRIGAMMONX
  wordmark) changed, from "BETA v1.0" to "v2.1". FUTURE VERSIONING RULE
  (see the change report for full detail): from this release onward,
  every iteration — however small — must carry its own clearly
  incremented public version number (v2.1 → v2.1.1 → v2.1.2 → v2.2,
  etc.), following this same pattern.
- MAIN FIX (backboard/board-stage/board alignment): verified, not
  re-changed. The prior pass already fixed .board-panel::before to
  derive its left/width from #board-stage's own width formula
  (min(72vw,840px)) instead of an independent 76vw/880px figure, which
  is what caused the drift at intermediate desktop widths (~1024-1150px,
  e.g. ~1128px). Re-measured in this pass via headless-browser
  getBoundingClientRect() across all three visual layers — the plinth
  (.board-panel::before), the board stage (#board-stage), and the
  actual board/board image (.board-wrap/#board-img) — at 390/480/760/
  900/1024/1128/1300/1500px: all three share the same centreline to
  within 0.02px at every width. No further CSS change to
  .board-panel::before, #board-stage, #board-wrap, or board geometry
  was needed or made in this pass.
- SECONDARY FIX (leftover public preview indicator): the real cause of
  the still-visible "PREVIEW:" badge (and, very likely, of the board
  area still looking visually "off" in the screenshot this task was
  filed from) is that loadDevicePreviewMode() unconditionally restores
  a saved Device Preview mode from localStorage on every page load —
  including a value saved from an earlier internal/admin testing
  session in the same browser. That restored mode applies
  body.preview-desktop/tablet/mobile-landscape/mobile-portrait, which
  both shows the #preview-badge AND reflows .page-layout into a
  simulated device-frame grid — a completely different (and, to a
  public player, inescapable, since the only "Exit Preview" control
  lives inside the now-hidden Developer/Admin section) layout than the
  real one for that viewport. Fixed by guarding the single
  loadDevicePreviewMode() call so it only ever runs when
  PRODUCT_TIER==='developer' (one line, presentation-level, uses the
  file's own existing tier mechanism — see PRODUCT_TIER near the top of
  the main script) — so a public ('pro' tier) load never restores or
  applies any preview-mode body class in the first place, regardless of
  what a prior session left in localStorage. A defensive CSS rule was
  also added that force-hides #preview-badge outside body.tier-developer
  as a belt-and-braces safety net. setDevicePreviewMode(),
  loadDevicePreviewMode(), DEVICE_PREVIEW_MODES, and every Device
  Preview button/function are otherwise completely untouched and remain
  fully intact for internal/developer use.
- No other public-facing content changed: all currently-unlocked Pro
  features, Standard/Cheeky/Adult commentary, Voice, Commentary
  Frequency, Save/Load, Take Back, Themes, How to Play, Quick Start,
  Table Talk, Computer Opponents, and both dice modes are unchanged.
  Move History remains hidden (#move-history-card{display:none},
  untouched); Developer/Admin remains non-public (PRODUCT_TIER='pro',
  untouched).
- No AI/RNG/dice/legal-move/checker-movement/board-geometry/CLICK_POINTS/
  checker-anchor/hit/bar/bearing-off/turn-order/opening-roll/tie/winner-
  detection/validation/simulation logic was touched anywhere in this
  pass. STALL_TURN_LIMIT is unchanged (500). See
  TrigammonX-v2.1-change-report.md for the full accounting and targeted
  diff against TrigammonX-Beta-v1.0.html.
-->
<!--
TrigammonX Beta v1.0 — Public Beta release build (presentation/packaging
pass only — no AI/RNG/dice/movement/legal-move/board-geometry/turn-order/
opening-roll/tie/winner/validation/simulation logic touched anywhere)
Derived exclusively from trigammonx-v266.html (itself derived from the
v265 lineage). trigammonx-v266.html was not modified by this pass. The
locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
baseline was not touched, edited, patched, or derived from.
- Public identity: browser title, on-page heading (<h1 class="page-title">)
  and footer now read "TrigammonX Beta v1.0" instead of the internal
  "TrigammonX v266 — Device Preview + Pro Move History" build label. A new
  small "BETA v1.0" badge sits beside the TRIGAMMONX wordmark in the
  header. All prior version history comments below (v265 and earlier)
  are preserved unedited for internal traceability, per instruction.
- Beta banner (new #beta-banner, directly under .tx-header, normal
  document flow, never a modal/overlay): "Thanks for helping test
  TrigammonX. Your feedback helps us improve the game." and "All Pro
  features are unlocked during the Beta — try them and tell us what you
  think." Shown once, continuously, in place — never a popup, never
  repeats/interrupts play. Same card also hosts the new "Give Beta
  Feedback" button (opens window.TRIGAMMONX_BETA_FEEDBACK_URL — see the
  named constant TRIGAMMONX_BETA_FEEDBACK_URL near PRODUCT_TIER at the
  top of the main script — in a new tab via window.open(...,'_blank',
  'noopener'). No feedback URL has been supplied yet, so the constant is
  '#'; update only that one constant when the real destination is ready.
  No analytics/tracking of any kind was added.
- Developer/Admin tools hidden from the public build: PRODUCT_TIER
  changed from 'developer' to 'pro' (single-line change — see the
  constant's own comment). This is the file's own existing, already-
  validated presentation-tier mechanism (v253): body.tier-pro already
  hides #tx-section-admin via pre-existing CSS, and PRODUCT_TIER never
  gates any game logic (confirmed — its only effect anywhere in this file
  is the body class applyProductTier() sets). This hides, as one
  self-contained block, Device Preview, Point Labels/Show Point Numbers,
  Anchor Tools (Show/Edit/Export), Click Zone Tools (Show/Edit/Export),
  Manual Setup, Test Dice, Dice RNG Test, Commentary Debug, Test
  Commentary, Auto Match Runner, Match Summary, Match/Balance Log, Admin
  View, the Technical Move Log, the Browser TTS Test Lab, the Real Time
  clock, and the (already Free/Pro-hidden) Doubling Cube visual test —
  all still physically present and untouched in the file (per
  instruction: presentation-level hiding, not deletion), simply
  unreachable from the public UI because their sole entry point (the
  "⚙ Show DEVELOPER / ADMIN" button) lives inside the now-hidden section.
  The #tx-section-pro ("TRIGAMMONX PRO") section remains fully visible
  and fully functional under tier-pro, exactly as designed — this is how
  every other future-Pro feature (Computer opponents, Player Names, Save/
  Load, Take Back, Full UI Themes, Cheeky/Adult commentary, etc.) stays
  completely unlocked and usable during the Beta. No PRODUCT_TIER value
  anywhere disables/locks a control; no payments, subscriptions, accounts,
  logins, licence checks, entitlement checks, or server-side
  authentication were added.
- Move History (Pro) intentionally NOT exposed in Beta v1.0 (still under
  owner testing internally, per instruction): new CSS rule
  `#move-history-card { display: none; }` presentation-hides the card.
  Its underlying implementation (moveHistoryTurns, startMoveHistoryTurn(),
  recordMoveHistoryEntry(), removeLastMoveHistoryEntry(),
  resetMoveHistory(), renderMoveHistoryPanel(), toggleMoveHistory(), the
  Save/Load fields, and its Take Back integration) is completely
  untouched and remains dormant — still recorded internally, still saved/
  loaded in the game payload, simply not rendered to the public player.
- Commentary: Off / Standard / Cheeky / Adult – Expletives all remain
  publicly selectable; internal values std/cheeky/auunc, phrase IDs,
  event IDs, hosted audio filenames/paths, frequency/cooldown/rarity
  logic, WELCOME/OPENING sequencing, and Table Talk are all byte-for-byte
  unchanged. Standard remains the default; Cheeky/Adult are never
  defaulted. New small unobtrusive notice added next to the Commentary
  selector: "Adult commentary contains strong language." — a single
  static line, not a popup, shown once, not repeated. emitCommentaryEvent()
  and pickCommentaryPhrase() were not modified.
- Voice defaults to On, continues using the existing hosted prerecorded
  Scotty MP3 commentary audio; browser speechSynthesis is still only used
  by the (now admin-hidden) Browser TTS Test Lab audition tool, exactly as
  in v266.
- No AI/RNG/dice/legal-move/checker-movement/board-geometry/CLICK_POINTS/
  checker-anchor/hit/bar/bearing-off/turn-order/opening-roll/tie/winner-
  detection/validation/simulation logic was touched anywhere in this pass.
  STALL_TURN_LIMIT is unchanged (500). See
  TrigammonX-Beta-v1.0-change-report.md for the full accounting and
  targeted diff against trigammonx-v266.html.
-->
<!--
TrigammonX v266 — Device Preview + Pro Move History (UI/Product
presentation pass — no AI/RNG/dice/movement/legal-move/board-geometry/
turn-order/opening-roll/tie/winner/validation/simulation logic touched)
- PART 1 — Admin Device Preview cleaned up to a compact primary choice:
  🖥 Desktop | Tablet | 📱 Mobile, with a secondary Portrait/Landscape
  sub-row that only appears once Mobile is selected (default Portrait).
  Full Width / Exit Preview is now a small secondary control below the
  primary row so it doesn't visually compete with Desktop/Tablet/Mobile.
  This is a thin presentation wrapper only: the existing
  setDevicePreviewMode()/loadDevicePreviewMode()/DEVICE_PREVIEW_MODES/
  DEVICE_PREVIEW_CLASSES are byte-identical and still do all the actual
  work (body class, badge/status text, localStorage, renderAll()) — new
  applyDevicePreview()/onDevicePreviewMobileClick()/
  syncDevicePreviewCompactUI()/initDevicePreviewCompactUI() just decide
  which compact button to show as active and whether the mobile
  orientation sub-row is visible. No new board scaling calculations; the
  existing safe re-render/resize mechanism (renderAll() inside
  setDevicePreviewMode()) is reused unchanged. Admin/developer
  convenience only.
- PART 2 — New player-facing "▶ Move History (Pro)" card, collapsed by
  default, directly below the Table Talk/Commentary card. "(Pro)" is a
  presentation label only — PRODUCT_TIER stays 'developer' and nothing is
  actually locked, exactly like every other future-Pro label added in
  v265. Explicitly separate from, and does not touch, the existing
  Technical Move Log (#move-log/logMsg(), Developer/Admin only).
  Move History is built as an isolated presentation/history data
  structure (moveHistoryTurns) — it never determines legality, turn
  order, hits, or bearing off; it only records facts already computed by
  the existing engine at the narrowest points those facts become known:
    - startMoveHistoryTurn(player, diceArray) is called from inside the
      existing, already-guarded recordDiceRollOnceForTurn() (one line
      added) — the established once-per-turn "dice are now known" choke
      point already used for dice stats, for both human and AI rolls.
      Opens a new turn group with a presentation-only turn counter
      (moveHistoryTurnCounter), the player/colour/name, and the dice
      actually rolled (2 or 3, per diceMode).
    - recordMoveHistoryEntry(...) is called from inside executeMove()
      (one line added, right before the existing checkForWinner() check)
      using only facts executeMove() had already computed for its own
      commentary classification (fromPt/toPt/color/dieValue/wasBarEntry/
      wasHit/hitColor/wasBearOffMove) — placed before the winner-check
      early return so the game-winning move is still recorded. No second
      move-legality engine of any kind.
  Take Back: undoLastMove() now also calls removeLastMoveHistoryEntry()
  (one line added, after the existing restore), which removes exactly
  the most recently recorded move line — mirroring the engine's own
  single-shot undo snapshot (pushUndoMoveSnapshot() is called exactly
  once per successful move, so "the last recorded line" and "the move
  Take Back just undid" are always the same move) — and removes the
  turn group too if it becomes empty. Take Back's own restore path
  (restoreMoveUndoSnapshot()) is completely untouched; Move History only
  follows the undo, it never drives it.
  Save/Load: serializeGameState() now includes moveHistoryTurns and
  moveHistoryTurnCounter (two lines added); restoreGameState() restores
  them, defaulting to an empty history when a save predates this field
  (old v265 saves still load normally). Autosave reuses
  serializeGameState() unchanged, so it carries Move History for free.
  Reset/New Game: resetToStart() now also calls resetMoveHistory() (one
  line added, alongside the existing resetCommentaryEngineState() call),
  clearing the panel back to "Moves will appear here once play begins."
  Simulation safety: every new Move History function opens with the same
  `if (headlessSimulationActive || simulationBatchActive) return;` guard
  used throughout the rest of the file (e.g. maybeAutosave()) — no
  recording, no rendering, no DOM churn during headless/batch play, and
  no change to simulation behaviour, results, or performance.
  Display format matches spec exactly: "Turn N — Player" or
  "Turn N — Name (Player)" when a Player Name is set, "Rolled: X + Y" (or
  three dice for Triple Dice mode), then one line per successful move —
  "A → B using D", "Bar → B using D", "A → Off using D" — each with an
  optional " · Hit Colour" suffix. Never shows AI reasoning, coordinates,
  click-zone data, legality diagnostics, timers, internal state,
  validation/simulation/system messages.
- v265 features preserved exactly as delivered: Table Talk/Commentary
  location, STD/CHEEKY/AUUNC internal commentary build, WELCOME→OPENING
  sequencing, Quick Start collapsed-by-default, mobile layouts/touch
  targets, Full UI Themes, clocks, Game Trends, Live Game Stats, Borne
  Off/Bar displays, existing Save/Load/Take Back behaviour, game-over
  presentation, How to Play, Developer/Admin tools, and the Technical
  Move Log — none of these were altered beyond the additive hooks listed
  above.
-->
<!--
TrigammonX v265 — Beta Product Structure + Commentary Flow (UI/Product
structure pass + one isolated commentary-start sequencing fix)
- Table Talk / Commentary controls (Commentary, Frequency, Voice,
  commentary-pack-status, Table Talk history) moved out of TRIGAMMONX PRO
  and into a new .under-board-commentary card directly below Player
  Actions / Game Flow, so commentary reads as part of normal play. Same
  ids and onchange handlers throughout (commentary-mode-select/
  onCommentaryModeChange(), commentary-frequency-select/
  onCommentaryFrequencyChange(), voice-enabled-select/onVoiceToggle(),
  commentary-pack-status, table-talk-panel) — no change to commentary
  event detection, phrase selection, cooldowns, or Table Talk content.
- Player-facing Commentary dropdown now reads Off / Standard (Free) /
  Cheeky (Pro) / Adult - Expletives (Pro) — presentation labels only; the
  internal option values (std/cheeky/auunc), normalizeCommentaryMode(),
  and every audio URL/event mapping are unchanged. Default remains
  Standard (Free) + Voice On; Adult - Expletives is never the default.
  All three styles remain usable in this internal build.
- Future Free/Pro identification (labels only, nothing locked or
  disabled): Computer player-type option reads "Computer (Pro)"; Player
  Name inputs are marked Pro via their placeholder text; Save Game / Load
  Saved Game / Take Back are relabeled "(Pro)" ("Take Back" becomes "Take
  Back Last Move (Pro)"); Full UI Themes were already inside the
  TRIGAMMONX PRO section header and needed no further marking. Left
  unmarked, as specified: Human-vs-human play, Official 2 Dice, Standard
  commentary, Voice On/Off, Commentary Frequency, Table Talk, How to Play,
  Quick Start, Show Point Numbers, normal game controls. PRODUCT_TIER
  stays 'developer' — nothing is actually gated in this internal build.
- Quick Start is now collapsed by default (▶ Quick Start), expands on
  click/tap (▼ Quick Start). No localStorage persistence — always starts
  collapsed on a fresh page load, per spec. All existing step
  highlighting/next-action glow (.qs-active/.qs-done via
  updateGuidedNextAction(), untouched) still applies correctly whether the
  list is expanded or not.
- WELCOME/OPENING presentation sequencing: WELCOME can now fire on the
  first genuine pre-game setup interaction (opening Quick Start, changing
  Player Type, entering a Player Name, changing Commentary/Voice/
  Frequency, opening How to Play), not only from Roll for First Player —
  new maybeFireWelcomeOnFirstInteraction(), guarded by the existing
  commentaryWelcomeFired once-per-game flag. The real fix: OPENING's own
  commentary audio is now genuinely waited on (via the existing
  armCommentarySettleWatch()/fireCommentarySettleWatchIfMatch() machinery
  and playCommentaryAudioFile()'s real <audio> onended/onerror — the same
  reusable pattern WELCOME already used) before the opening dice roll
  proceeds, with a short ~300ms presentation pause only when real audio
  had a chance to play; previously OPENING's audio could still be playing
  when the dice rolled. Tie-rerolls still never replay WELCOME/OPENING;
  Reset/New Game still re-arms WELCOME (resetCommentaryEngineState(),
  untouched). No change to emitCommentaryEvent(), pickCommentaryPhrase(),
  opening-roll RNG, tie handling, or winner determination anywhere.
- v264's mobile layout, button styling, hosted board image, themes, game
  statistics, game-over presentation, How to Play, and point-number
  behaviour are all fully preserved — untouched.
- no AI/RNG/dice values/checker movement/legal-move generation/board
  geometry/point coordinates/checker anchors/click zones/hit-bar logic/
  bearing off/turn order/opening-roll rules/tie handling/simulation
  logic/validation logic touched anywhere
- the locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
  baseline was not modified; trigammonx-v264.html (source) was not
  modified

TrigammonX v264 — Mobile Dice Status Layout (UI/product change only)
- Rolled / Available Moves no longer stack on ordinary mobile portrait
  widths. .udp-dice-grid was previously included in the shared
  @media(max-width:760px) rule that stacked it to a single column — the
  same breakpoint used for the wider Bar/Pips strip and general panel
  reflow — even though it never actually needed that much room. That grid
  is now removed from the 760px rule (Bar/Pips' .under-board-stats-strip
  still stacks there, untouched) and instead keeps its v263 content-based
  layout (grid-template-columns: max-content minmax(0,1fr), 10px gap —
  both unchanged) all the way down to 340px, where a new, dedicated,
  much-narrower fallback finally stacks it — only when the dice tray and
  Available Moves genuinely can no longer sit side by side. Current
  Turn/player badge still sits above this grid at every width (its own
  layout, untouched). Dice size, dice animation, dice values, and
  available-move chip markup/logic are completely unchanged; Available
  Moves chips already wrap on their own via the existing
  .dice-row{flex-wrap:wrap} rule (unchanged), verified directly for
  doubles (4 chips) at narrow widths
- no board geometry, gameplay, RNG, or other Core logic touched anywhere
- v263 button styling (Roll Dice / End Turn / Clear Move Marker / Take
  Back construction, End Turn Ready state) fully preserved — untouched
- the locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
  baseline was not modified

TrigammonX v263 — Small UI Polish (UI/product change only)
- Rolled / Available Moves spacing: .udp-dice-grid's two dice-status
  columns changed from equal-width (minmax(0,1fr) minmax(0,1fr)) to
  content-based Rolled + flexible Available Moves (max-content
  minmax(0,1fr)), removing the empty space that used to sit to the right
  of the rolled dice. Dice size, dice animation, available-move chips,
  dice values, and the existing @media(max-width:760px) narrow-screen
  single-column stacking override are all unchanged
- Player Action button visual consistency: Clear Move Marker and Take
  Back, previously plain <button> elements with inline
  border-color/color-only styling, are now proper classes
  (.btn-clear-marker / .btn-take-back) carrying the same filled-hover
  treatment as Roll Dice/End Turn, and now share the .wide-action class
  so all four Player Action buttons have matching width/shape. Border
  thickness (1px), radius (var(--tx-radius-sm)) and the layered depth
  box-shadow were already shared across all four via the existing base
  button/.under-board-actions button rules — untouched. Functional
  colours preserved exactly: Roll Dice gold, End Turn blue, Clear Move
  Marker grey, Take Back amber. The existing End Turn Ready state
  (.btn-end-turn.end-turn-ready, toggled only by setEndTurnReady()) is
  completely untouched — same activation conditions, same appearance
- commentary: no changes. Commentary event logic, phrase mapping, and
  audio mapping (including the AUUNC double-threes line) are untouched
- v262 fully preserved: mobile legal-destination ring sizing, checker
  touch halo, landscape tip, WELCOME->OPENING sequencing, Quick Start,
  guided next-action glow, Commentary STD/CHEEKY/AUUNC, Voice On/Off,
  commentary frequency, 10-second toast, hosted board image, themes, Pro
  architecture — none of this was touched
- no AI/RNG/rules/checker-movement/legal-move/board-coordinate/turn/
  opening-roll/validation/simulation logic changed anywhere
- the locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
  baseline was not modified

TrigammonX v262 — Mobile Board Usability Polish (UI/product change only)
- legal destination rings: the visible green "legal destination" ring is
  now a separate .pt-zone.legal-dest::after pseudo-element, decoupled from
  the .pt-zone div itself, which remains the actual 50x50px click/touch
  target at every screen size (unchanged position/size/CLICK_POINTS
  coordinates). On narrow screens the VISIBLE ring only shrinks via CSS
  media query (50px unchanged above 520px, 22px at <=520px, 18px at
  <=360px; border thickness and glow scaled down proportionally) — the
  touch target itself never changes size or position
- checker tapping: added a small invisible touch-halo (.checker::before,
  pointer-events default, background transparent) that expands each
  checker's actual clickable area slightly beyond its visible circle,
  without moving/resizing the visible checker, its anchor coordinates, or
  stack spacing. Sized from a new HALO_INSET_BOARD constant (2.5 board-
  space units, in the same 2000x2000 space as CHECKER_RADIUS_BOARD),
  chosen after programmatically checking the closest anchor-to-anchor
  spacing between every pair of points on the whole board (tightest case
  ~61.85 board units vs. a 56-unit checker diameter) so the halo can never
  bridge the gap to a neighbouring point's own checker or click target at
  any screen size. Applies to both point checkers (renderPieces()) and bar
  checkers (renderBarPieces()) via one shared CSS custom property,
  --checker-halo-inset, set once per render
- portrait/landscape: no forced orientation anywhere. A new small,
  dismissible, non-blocking landscape-tip-banner ("Tip: Landscape gives
  you a larger board.") appears only via a max-width:480px AND
  orientation:portrait CSS media query, always in normal document flow
  (never position:fixed/overlay/modal), and never disables or covers any
  control. Dismissal persists via a new localStorage key
  (trigammonx_v262_landscape_tip_dismissed), same pattern as the existing
  Voice/Commentary preference keys
- v261 fully preserved: WELCOME->OPENING sequencing, Quick Start guide,
  guided next-action glow, Commentary STD/CHEEKY/AUUNC + Voice On/Off +
  Frequency, 10-second commentary toast, hosted board image, themes, Pro
  architecture — none of this was touched
- no destination coordinates, click-zone centres, checker anchors, stack
  geometry, board geometry, or legal-move/gameplay logic changed anywhere
  — confirmed by function-level diff and full-file diff review
- the locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
  baseline was not modified

TrigammonX v261 — Commentary Toast Duration (UI/product change only)
- commentary toast/display duration changed from 6 seconds to 10 seconds
  (COMMENTARY_TOAST_VISIBLE_MS, the single constant controlling how long
  a Table Talk toast stays visible before it fades out) — presentation
  only; does not touch commentary event timing, cooldowns, frequency
  gating, audio playback, or any gameplay logic
- no password/authentication logic or credentials added anywhere in this
  file — the Pro preview's access control is handled at the web-server
  level, outside this file, per instruction
- the locked trigammonx-v257-simulation-lab-stable.html Core/Simulation
  baseline was not modified

TrigammonX v260 — Guided Start + Commentary UI Polish (UI/product change only)
- WELCOME timing fixed: no longer fires at page/board init (before the
  player may have enabled commentary or given the browser a real audio
  gesture). Now fires once per GAME, from the game's first "Roll for
  First Player" click — a genuine user gesture — immediately followed by
  OPENING, then the existing opening-roll sequence (WELCOME -> OPENING ->
  dice roll). If Commentary is Off, or Voice is Off, no artificial wait is
  introduced — the presentation layer settles immediately and the roll
  proceeds without delay; popup/Table Talk text still shows regardless of
  Voice. Tie-reroll clicks never replay WELCOME/OPENING; Reset/New Game
  re-arms WELCOME so the next genuinely new game gets a fresh random
  Welcome. Implemented entirely via new presentation-layer sequencing
  (playWelcomeThenOpening(), a small commentary "settle watch" primitive)
  — emitCommentaryEvent()/pickCommentaryPhrase() are untouched (confirmed
  byte-identical to v259 by function-level diff)
- new compact Quick Start card, directly below How to Play in the right
  panel — 5 steps; Enter Names and Choose Commentary are explicitly
  optional guidance and never gate advancing to Roll for First Player
- new guided next-action glow: a subtle companion cue on Player Types and
  the existing (untouched) Roll for First Player glow during setup, a new
  glow on Roll Dice once it's actually the player's turn to use it, and
  the corresponding Quick Start step highlighted as current/done — all
  derived purely from existing state (gameStarted/gameOver/
  openingRollResolved/the Roll Dice button's own already-computed disabled
  state), no new game-state or duplicated rule logic. End Turn keeps its
  existing .end-turn-ready cue untouched, with no competing new effect
- normal player-facing commentary controls simplified to Commentary /
  Voice / Frequency only; the old browser-TTS Narrator Voice / Voice
  Style / Test Voice / Speed / Pitch block moved verbatim to Developer/
  Admin as "Browser TTS Test Lab" (same ids/functions, location only
  changed) — kept visually/functionally separate from the real Scotty MP3
  commentary system
- safe defaults for this internal build: Commentary defaults to STD,
  Voice defaults to On, frequency default unchanged (Normal); never
  defaults to CHEEKY/AUUNC. A player's own saved choice (new, dedicated
  localStorage key, same pattern as the existing Voice On/Off preference)
  is preserved across reloads once made, including an explicit Off; an
  obsolete stored value falls back to STD, never Off, and LIGHT/
  lighthearted is never mapped to CHEEKY
- v259 commentary content/behaviour for WELCOME, OPENING, and DOUBLES 1–6
  preserved exactly — phrase/audio mappings, frequency logic, cooldowns,
  per-turn limits, rarity logic, Table Talk, and the commentary toast are
  all unchanged; events still awaiting new STD/CHEEKY/AUUNC content remain
  silent-safe
- no AI, RNG, dice results, checker movement, legal-move logic, turn
  order, opening-roll rules/tie handling, board geometry, hit/bar logic,
  bearing off, or game-state/validation/simulation logic touched; the
  only change to reset mechanics is the presentation-only WELCOME re-arm
  described above; the locked trigammonx-v257-simulation-lab-stable.html
  Core/Simulation baseline was not modified

TrigammonX v259 — Commentary Integration (UI/product change only)
- replaces the old professional/lighthearted commentary modes with the
  current STD / CHEEKY / AUUNC styles (LIGHT/lighthearted fully retired,
  never mapped to CHEEKY)
- commentary event-detection/timing engine (emitCommentaryEvent(),
  pickCommentaryPhrase(), event IDs, frequency dial, per-turn cap,
  cooldown, rarity weighting, once-per-game handling, race detection,
  existing hook sites) is unchanged — v259 is presentation/content layer
  only
- phrase bank now sourced from TrigammonX_commentary_manifest_final_v3.md
  (the sole authoritative manifest); popup text and MP3 filenames/paths
  used verbatim, nothing paraphrased or invented
- real commentary now plays pre-recorded MP3s (hosted at
  https://trigammonx.com/audio/SCOTTY/{EVENT}/{STYLE}/{FILENAME}) via a
  single reusable <audio> element instead of browser speechSynthesis;
  audio failure always fails silently — popup text still shows, gameplay
  is never blocked
- two new, explicitly user-authorized minimal hooks: WELCOME (fires once
  per page session, at the existing one-time board-ready init) and
  OPENING (fires once per game, immediately before the existing
  roll-for-first-player sequence begins) — neither hook alters game
  initialization, RNG, turn order, or the opening-roll sequence itself
- DOUBLES commentary (existing DICE_03 event) extended, with explicit
  user authorization, from doubles 4/5/6 only to doubles 1–6, using new
  per-value sub-event IDs (DICE_03_1..DICE_03_6) so the protected
  pickCommentaryPhrase() filter logic did not need to change; dice
  generation/RNG/move/turn logic untouched
- events MOVE_01, MOVE_02, BAR_01, BAR_02, BAR_03, RACE_01, RACE_02,
  BEAR_01, BEAR_03, BEAR_05, SOCIAL_04 keep their existing hooks/timing
  exactly, but currently have no STD/CHEEKY/AUUNC phrases yet (old
  professional/lighthearted phrases removed) — they are silent/suppressed
  under the new tone system until new content is supplied
- Narrator Voice / Voice Style / Speed / Pitch audition panel left fully
  in place and untouched (still browser-TTS based) but is no longer used
  for real commentary playback, only for its own voice audition/testing
- hosted board image, themes, Pro architecture, dice/clock readability,
  responsive behaviour, and UI layout all preserved from v258
- no AI, RNG, rules, movement, legal-move, board-geometry, turn, opening-
  roll, bearing-off, bar-entry, reset, validation, or simulation logic
  touched; the locked trigammonx-v257-simulation-lab-stable.html Core /
  Simulation baseline was not modified

TrigammonX v258 — Hosted Board Image (UI/product change only)
- board base-image now loads from a single hosted URL
  (https://trigammonx.com/ximages/TrigammonX-board.png) instead of the local
  trigammon-board.png file, so the artwork can be replaced later without
  touching this file
- the URL lives in one named constant, window.TRIGAMMONX_BOARD_IMAGE_URL
  (see the board-wrap markup, just after the #board-img element)
- board geometry, scaling, aspect ratio, overlays, checkers, dice, bars, hit
  areas, and responsive behaviour are all unchanged
- no AI, RNG, rules, movement, turn logic, validation, or simulation logic
  touched; the locked trigammonx-v257-simulation-lab-stable.html Core /
  Simulation baseline was not modified

TrigammonX v133 Playable Baseline
Full test game completed with no obvious movement errors.
This version is the protected working baseline after 133 iterations.
Do not make broad changes from this version without first creating a new numbered copy.
-->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TrigammonX v5.1.5 — Play TrigammonX</title>
<!-- v2.2.5: GA4 Beta Analytics loader — see the top-of-file traceability
     comment and TrigammonX-v2.2.5-change-report.md. Standard async gtag.js
     snippet, unmodified from Google's own template. If this fails to load
     (ad-blocker, offline, network policy) the page still loads and plays
     identically — txTrack() (10-clocks-themes-ui.js) checks `typeof gtag`
     before every call. To remove analytics entirely, delete this block
     plus the four txTrack() call sites documented in the top comment. -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-YVJDNE6L2G"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-YVJDNE6L2G');
</script>
    <link rel="stylesheet" href="trigammonx-v5.1.5/css/01-base-layout.css">
    <link rel="stylesheet" href="trigammonx-v5.1.5/css/02-board-game.css">
    <link rel="stylesheet" href="trigammonx-v5.1.5/css/03-components-features.css">
    <link rel="stylesheet" href="trigammonx-v5.1.5/css/04-themes-responsive.css">
</head>
<body>

<!-- ══ v195/v2.1.6: Game Over Celebration → Winner Results Dashboard ══
     Populated and revealed by showGameOverCelebration(player).
     Never shown during Auto Match / headless / batch / stalled games.
     v2.1.6 expands this SAME system into a full results dashboard —
     no second winner modal exists anywhere in this file. The card now
     scrolls internally (#goc-card) so it can never run off-screen; the
     top bar is sticky so Share/New Game/Close stay reachable while
     scrolled. All values below are placeholders replaced at runtime by
     showGameOverCelebration() from real game data — nothing here is a
     hard-coded sample number.
     ═════════════════════════════════════════════════════════════════ -->
<!-- ═════════════════════════════════════════════════════════════════
     v2.1.9 — SAVE GAME AS dialog
     Presentation-only modal; every action inside calls new v2.1.9 JS
     (performSaveAs()/confirmSaveAs()) which itself only reads/writes
     NAMED_SAVES_KEY and calls the existing, unmodified
     serializeGameState(). Never touches SAVE_KEY (the autosave/recovery
     slot) or restoreGameState()/game state.
     ═════════════════════════════════════════════════════════════════ -->
<div class="txsave-backdrop" id="save-as-backdrop">
  <div class="txsave-card" id="save-as-card">
    <div class="txsave-card-title">💾 Save Game As</div>
    <div class="txsave-field-label">Game Name</div>
    <input type="text" id="save-as-name-input" maxlength="80" placeholder="e.g. Friday Night with Tony" class="txsave-text-input" onkeydown="if(event.key==='Enter'){confirmSaveAs(false);}">
    <div class="txsave-summary" id="save-as-summary"></div>
    <div class="txsave-btn-row">
      <button onclick="confirmSaveAs(false)" class="txsave-btn txsave-btn-primary">Save</button>
      <button onclick="confirmSaveAs(true)" class="txsave-btn">Save &amp; Export</button>
      <button onclick="closeSaveAsDialog()" class="txsave-btn txsave-btn-cancel">Cancel</button>
    </div>
    <div class="txsave-status" id="save-as-status"></div>
  </div>
</div>

<!-- ═════════════════════════════════════════════════════════════════
     v2.1.9 — LOAD SAVED GAME library (Autosave/Recovery + Named Saves
     + Import). loadNamedSave()/loadAutosaveFromLibrary() both ultimately
     call the existing, unmodified restoreGameState() — no second
     restore implementation. Import validates and adds to
     NAMED_SAVES_KEY only; it never mutates the live game until the user
     explicitly clicks Load on the imported row.
     ═════════════════════════════════════════════════════════════════ -->
<div class="txsave-backdrop" id="saved-games-backdrop">
  <div class="txsave-card txsave-card-wide" id="saved-games-card">
    <div class="txsave-card-title">↩ Load Saved Game</div>

    <div id="autosave-recovery-section"></div>

    <div class="txsave-card-subtitle">Saved Games</div>
    <div id="saved-games-list"></div>
    <div style="font-size:10px;color:var(--tx-text-faint);line-height:1.4;margin-top:10px;">
      Named saved games stay on this browser/device until you delete them. Export a save file if you want a portable backup.
    </div>

    <div class="txsave-btn-row">
      <button onclick="openImportSavedGameDialog()" class="txsave-btn">Import Saved Game…</button>
      <button onclick="closeSavedGamesLibrary()" class="txsave-btn txsave-btn-cancel">Close</button>
    </div>
    <input type="file" id="import-tgxsave-input" accept=".tgxsave,application/json" style="display:none;" onchange="handleImportFileSelected(event)">
    <div class="txsave-status" id="saved-games-status"></div>
  </div>
</div>

<!-- v3.7.1 (Issue 5 — iPad auto-lock / Safari background interruption
     protection). Shown only via showInterruptionOverlay() (10-clocks-
     themes-ui.js) when a live real game is auto-paused because the page
     was hidden/backgrounded — never opened any other way. Deliberately a
     SEPARATE backdrop from #goc-backdrop (Winner Certificate) and any
     other existing modal — this one's whole job is to block the board
     specifically after an involuntary interruption, and it must be able
     to sit on top of anything else that might already be open. -->
<div id="interruption-overlay">
  <div id="interruption-card">
    <div class="interruption-icon" aria-hidden="true">⏸</div>
    <div class="interruption-title">GAME PAUSED</div>
    <div class="interruption-body">
      TrigammonX was paused while your device was away or locked.
    </div>
    <button class="interruption-resume-btn" id="interruption-resume-btn" onclick="resumeFromInterruption()">▶ RESUME PLAY</button>
  </div>
</div>

<!-- v4.2 (Module D) — compact end-of-game banner shown OVER the frozen
     final board (see showEndgameBanner()/tgxEndgameAction(),
     06-stats-history.js). Three explicit choices, never vague Yes/No.
     "View Winner Certificate" opens the existing #goc-backdrop dashboard;
     the completed result is already archived at finalisation in
     finishGame() so none of the three choices can lose it. -->
<div id="tgx-endgame-banner" role="dialog" aria-labelledby="tgx-endgame-headline">
  <div id="tgx-endgame-card">
    <div class="tgx-endgame-headline" id="tgx-endgame-headline">🏆 WINNER</div>
    <div class="tgx-endgame-stats" id="tgx-endgame-stats"></div>
    <div class="tgx-endgame-matchnote" id="tgx-endgame-matchnote" style="display:none;"></div>
    <div class="tgx-endgame-actions">
      <button type="button" id="tgx-endgame-cert-btn" class="tgx-endgame-btn tgx-endgame-btn-primary" onclick="tgxEndgameAction('cert')">View Winner Certificate</button>
      <button type="button" class="tgx-endgame-btn" onclick="tgxEndgameAction('newgame')">New Game</button>
      <button type="button" class="tgx-endgame-btn tgx-endgame-btn-ghost" onclick="tgxEndgameAction('stay')">Stay on Board</button>
    </div>
  </div>
</div>

<!-- v4.2 (Module D) — persistent post-game bar. Appears after "Stay on
     Board" (or after the player closes the certificate dashboard while the
     game is still over). Keeps the certificate + a new game reachable;
     cleared by every New Game / Reset path via tgxClearEndgameUi(). -->
<div id="tgx-postgame-bar" role="region" aria-label="Completed game actions">
  <span class="tgx-postgame-label">🏁 Game over</span>
  <button type="button" class="tgx-postgame-btn" onclick="tgxEndgameAction('cert')">🏆 Winner Certificate</button>
  <button type="button" class="tgx-postgame-btn" onclick="gocNewGame()">↺ New Game</button>
</div>

<div id="goc-backdrop">
  <div id="goc-card">

    <div class="goc-topbar" id="goc-topbar">
      <div class="goc-topbar-info" id="goc-topbar-info"><!-- mode / duration / turns / date --></div>
      <div class="goc-topbar-actions">
        <button class="goc-btn-share" onclick="gocShareResults()" id="goc-share-btn" title="Share your results">📤 <span class="goc-btn-text">Share Results</span></button>
        <button class="goc-btn-new"   onclick="gocNewGame()" title="Start a new game">↺ <span class="goc-btn-text">New Game</span></button>
        <button class="goc-x-close"   onclick="closeGameOverCelebration()" aria-label="Close">✕</button>
      </div>
    </div>

    <!-- v2.4.4: explicit social share row — secondary to Share Results
         above (which stays the primary native-share action). Compact
         text-label buttons so this doesn't read as a new large panel;
         excluded from #goc-cert-capture below for the same reason
         Share/New Game/Copy Report/JPG/PNG already are. -->
    <div class="goc-social-row" id="goc-social-row">
      <span class="goc-social-label">Share to:</span>
      <button class="goc-social-btn" onclick="gocShareEmail()" title="Share via email">Email</button>
      <button class="goc-social-btn" onclick="gocShareFacebook()" title="Share on Facebook">Facebook</button>
      <button class="goc-social-btn" onclick="gocShareX()" title="Share on X">X</button>
      <button class="goc-social-btn" onclick="gocShareInstagram()" id="goc-share-instagram-btn" title="Share to Instagram">Instagram</button>
      <button class="goc-social-btn" onclick="gocShareCopy()" title="Copy result text">Copy</button>
    </div>

    <!-- v3.4.0: Winner Certificate Archive — compact secondary row, same
         presentation convention as .goc-social-row above (excluded from
         #goc-cert-capture below for the same reason Share/New Game/
         social/JPG/PNG already are). The certificate is auto-saved to
         the archive the moment this modal opens (see
         gocArchiveCertificateIfNeeded(), 06-stats-history.js) —
         #goc-export-status shows a brief "Saved to Winner Archive"
         confirmation. Both buttons also remain reachable outside the
         certificate (see the under-board Winner Archive / Career Stats
         row, below the Save/Resume row). -->
    <div class="goc-social-row" id="goc-archive-row">
      <span class="goc-social-label">This device:</span>
      <button class="goc-archive-btn" onclick="openWinnerArchive()" title="View saved Winner Certificates">🏆 View Archive</button>
      <button class="goc-archive-btn" onclick="openCareerStats()" title="View cumulative career stats">📊 Career Stats</button>
    </div>

    <!-- v2.2.5: #goc-cert-capture wraps ONLY the certificate content that
         should appear in an exported JPG/PNG or a shared image — it
         deliberately EXCLUDES .goc-topbar (Share/New Game/Close) above,
         .goc-social-row (Email/Facebook/X/Instagram/Copy, v2.4.4) above,
         and .goc-buttons (Copy Report/Close/Download) below, per spec's
         "does not capture the download/share buttons themselves." -->
    <div id="goc-cert-capture">
      <!-- v2.2.6: .goc-cert-frame is the ornate gold outer certificate
           border (CSS gradient/pseudo-element corners, no image
           dependency) wrapping the whole composition, per the
           visual-parity spec. .goc-cert-hero-row lays out the three
           top-of-certificate elements side by side: the champion
           medallion (colour set purely by CSS via #goc-card's existing
           goc-blue/goc-green/goc-red class — no JS change), the central
           winner masthead, and the board-design panel. -->
      <div class="goc-cert-frame">
        <span class="goc-cert-corner goc-cert-corner-tl" aria-hidden="true"></span>
        <span class="goc-cert-corner goc-cert-corner-tr" aria-hidden="true"></span>
        <span class="goc-cert-corner goc-cert-corner-bl" aria-hidden="true"></span>
        <span class="goc-cert-corner goc-cert-corner-br" aria-hidden="true"></span>
        <div class="goc-cert-hero-row">
          <div class="goc-medallion" id="goc-medallion">
            <!-- v3.4.0: STANDALONE TROPHY REDESIGN — the circular
                 .goc-medallion-ring (gold disc + border + box-shadow
                 ring) is removed entirely; the trophy now sits directly
                 on the certificate's dark background, much larger, with
                 a soft glow/shadow filter standing in for a drawn frame
                 (see .goc-medallion-trophy in css/03-components-
                 features.css). onerror is a single self-contained inline
                 statement (no dependency on any script having loaded
                 yet, unlike the board-image error path) that hides the
                 broken <img> and reveals the pre-existing sibling
                 fallback glyph below — same graceful degradation as
                 before, just without the ring around it. -->
            <img class="goc-medallion-trophy" src="https://trigammonx.com/ximages/trophy.png" alt="Trophy" onerror="this.style.display='none'; this.nextElementSibling.style.display='block';">
            <div class="goc-medallion-trophy-fallback" aria-hidden="true">🏆</div>
            <div class="goc-medallion-label">OFFICIAL WINNER</div>
            <div class="goc-medallion-sub">CHAMPION</div>
          </div>

          <div class="goc-hero">
            <canvas id="goc-sparkle-canvas"></canvas>
            <!-- v3.5.1: approved TrigammonX logo, placed above the existing
                 v3.5.0 title-case "TrigammonX™" wordmark per spec's desired
                 hierarchy. A new packaged asset (never existed in any prior
                 package — see the change report's logo-asset section), so
                 it is referenced via the same versioned-relative-path
                 convention as every other local asset in this app (CSS/JS
                 src="trigammonx-v3.5.3/..."), NOT an external ximages URL.
                 onerror hides just the <img> itself, leaving the
                 .goc-brand text wordmark immediately below fully intact —
                 the same graceful degrade-to-typographic-masthead pattern
                 as the trophy image's own onerror handling above. -->
            <img class="goc-brand-logo" src="trigammonx-v5.1.5/img/trigammonx-logo.png" alt="TrigammonX" onerror="this.style.display='none';">
            <div class="goc-brand">TrigammonX™</div>
            <div class="goc-cert-label">WINNER CERTIFICATE</div>
            <div class="goc-congrats">Congratulations to</div>
            <div class="goc-winner" id="goc-winner-name">Blue</div>
            <div class="goc-cert-title" id="goc-cert-title"></div>
            <div class="goc-cert-summary" id="goc-cert-summary"></div>
          </div>

          <div class="goc-badge-row" id="goc-badge-row"><!-- board design badge, populated by showGameOverCelebration() --></div>
        </div>

        <div class="goc-rule"></div>

        <div class="goc-stats" id="goc-stats">
          <!-- Populated dynamically by showGameOverCelebration() -->
        </div>
      </div>
    </div>

    <div class="goc-buttons">
      <button class="goc-btn-copy"  onclick="gocCopyReport()">⎘ Copy Report</button>
      <button class="goc-btn-jpg"   onclick="gocDownloadJPG()" title="Download the certificate as a JPG image">⬇ JPG</button>
      <button class="goc-btn-png"   onclick="gocDownloadPNG()" title="Download the certificate as a PNG image">⬇ PNG</button>
      <button class="goc-btn-close" onclick="closeGameOverCelebration()">Close</button>
    </div>
    <div id="goc-export-status" class="goc-export-status" role="status" aria-live="polite"></div>
  </div>
</div>

<!-- ══ v3.4.0: Winner Certificate Archive ══════════════════════════
     Local-device-only list of every auto-archived Winner Certificate
     (see gocArchiveCertificateIfNeeded(), 06-stats-history.js). Reuses
     the existing .txsave-backdrop/.txsave-card modal chrome (same
     pattern as Save Game As.../Load Saved Game, 09-saves.js) so this
     reads as a natural sibling of the existing library dialogs rather
     than a new visual language. Two child views inside one card:
     #wa-list-view (the list + filters, default) and #wa-viewer-view (a
     single reopened certificate + its own download/share actions),
     toggled via display:none — see openWinnerArchive()/
     gocOpenArchiveCertificate()/closeArchiveViewer() in JS. -->
<div class="txsave-backdrop" id="wa-backdrop">
  <div class="txsave-card txsave-card-wide" id="wa-card">

    <div id="wa-list-view">
      <div class="txsave-card-title">🏆 Winner Archive</div>
      <div class="wa-scope-note">This device only — archived certificates are stored locally in this browser, not synced to an account.</div>
      <div class="wa-controls">
        <label class="hx-game-select-label">Show
          <select id="wa-filter-select" class="hx-game-select" onchange="onArchiveFilterChange(this.value)">
            <option value="all">All</option>
            <option value="regular">Regular Play</option>
            <option value="tournament">Tournament</option>
            <option value="blue">Blue Wins</option>
            <option value="green">Green Wins</option>
            <option value="red">Red Wins</option>
          </select>
        </label>
      </div>
      <div id="wa-list" class="wa-list"></div>
      <div class="txsave-btn-row">
        <button onclick="closeWinnerArchive()" class="txsave-btn txsave-btn-cancel">Close</button>
        <!-- v4.2 (Module F): full-archive delete. v5.0.8 SAFETY FIX — this
             button no longer wipes the archive on one confirm(); it opens
             the same two-stage warning → type "DELETE ARCHIVE" → final
             flow as Advanced / Data Management (gocClearAllArchive() now
             delegates to pxOpenArchiveDeleteConfirm()). -->
        <button onclick="gocClearAllArchive()" class="txsave-btn txsave-btn-cancel" style="border-color:#c0392b;color:#ff9b8f;">🗑 Delete Archive…</button>
      </div>
      <div class="wa-scope-note">Automatically keeps your most recent 100 completed results — older entries roll off first.</div>
      <div class="txsave-status" id="wa-status"></div>
    </div>

    <div id="wa-viewer-view" style="display:none;">
      <!-- v3.5.2 Part D: obvious top-right Close control — in addition to
           (not a replacement for) the existing "← Back to Archive" button
           below, plus Escape-key support (see the keydown handler,
           06-stats-history.js). Both call the exact same closeArchiveViewer()
           — same clean return to the list view, same guarantee that
           closing never touches the archive record itself. -->
      <button type="button" class="wa-viewer-close-x" onclick="closeArchiveViewer()" aria-label="Close and return to Winner Archive" title="Close">✕</button>
      <div class="txsave-card-title" id="wa-viewer-title">Winner Certificate</div>
      <div class="wa-viewer-imgwrap">
        <img id="wa-viewer-img" class="wa-viewer-img" alt="Archived Winner Certificate preview">
      </div>
      <div class="txsave-btn-row">
        <button onclick="gocArchiveDownloadJPGFromViewer()" class="txsave-btn">⬇ JPG</button>
        <button onclick="gocArchiveDownloadPNGFromViewer()" class="txsave-btn">⬇ PNG</button>
        <button onclick="gocArchiveShareResultsFromViewer()" class="txsave-btn">📤 Share Results</button>
        <button onclick="closeArchiveViewer()" class="txsave-btn txsave-btn-cancel">← Back to Archive</button>
      </div>
      <div class="txsave-status" id="wa-viewer-status"></div>
    </div>

  </div>
</div>

<!-- ══ v3.4.0 / rebuilt v5.0.7: Statistics ═══════════════════════════
     TWO views behind a tab strip inside one .txsave-* card:
       #cs-view-career  — IDENTITY-OWNED "Career Stats" (DEFAULT). Reads
         the Player/Profile + AI stat stores (window.pxStore, 16-players.js)
         for the identity chosen in #cs-identity-select. NOT re-aggregated
         from the Winner Archive. Rendered by _csRenderIdentityView().
       #cs-view-archive — the pre-existing browser/device aggregate over
         the Winner Certificate Archive (gocComputeCareerStats() →
         _gocRenderCareerStats()), renamed "Archive & Device Statistics".
     openCareerStats() always opens on the Career Stats tab.
     The old combined "Reset Archive & Career Stats" button is REMOVED —
     destructive actions live only in Advanced / Data Management →
     Danger Zone (#px-clear-career-btn / #px-delete-archive-btn). -->
<div class="txsave-backdrop" id="cs-backdrop">
  <div class="txsave-card txsave-card-wide" id="cs-card">
    <div class="cs-tabs" role="tablist" aria-label="Statistics views">
      <button type="button" class="cs-tab active" id="cs-tab-career" role="tab" onclick="_csSwitchTab('career')">📊 Career Stats</button>
      <button type="button" class="cs-tab" id="cs-tab-archive" role="tab" onclick="_csSwitchTab('archive')">🗄 Archive &amp; Device Statistics</button>
    </div>

    <div id="cs-view-career" class="cs-view">
      <div class="cs-identity-row">
        <label class="cs-identity-label" for="cs-identity-select">Showing</label>
        <select id="cs-identity-select" class="hx-game-select" onchange="_csOnIdentityChange(this.value)" aria-label="Choose a player profile or AI identity"></select>
      </div>
      <div class="wa-scope-note">Stored locally on this device. Cross-device sync is not yet enabled.</div>
      <div id="cs-identity-body" class="cs-body"></div>
    </div>

    <div id="cs-view-archive" class="cs-view" style="display:none;">
      <div class="txsave-card-title" style="margin-bottom:2px;">🗄 Archive &amp; Device Statistics</div>
      <div class="wa-scope-note">This device only — aggregated from the Winner Certificate Archive stored in this browser.</div>
      <div id="cs-archive-body" class="cs-body"></div>
    </div>

    <div class="txsave-btn-row">
      <button onclick="closeCareerStats()" class="txsave-btn txsave-btn-cancel">Close</button>
    </div>
    <div class="txsave-status" id="cs-status"></div>
  </div>
</div>

<!-- ══ v197: How to Play Modal ══════════════════════════════════════ -->
<div id="htp-backdrop" onclick="if(event.target===this)closeHowToPlay()">
  <div id="htp-card">

    <div class="htp-header">
      <div class="htp-title">✦ How to Play</div>
      <button class="htp-close" onclick="closeHowToPlay()">Close ✕</button>
    </div>

    <div class="htp-section-title">Getting Started</div>
    <ul class="htp-steps">
      <li><span class="htp-step-num">1</span>Choose Human or Computer for each player (Blue, Green, Red).</li>
      <li><span class="htp-step-num">2</span>Click <strong style="color:var(--tx-green)">▶ Begin Play</strong> to start the game.</li>
      <li><span class="htp-step-num">3</span>Click <strong style="color:var(--tx-gold)">🎲 Roll Dice</strong> on your turn.</li>
      <li><span class="htp-step-num">4</span>Click one of your coloured checkers on the board.</li>
      <li><span class="htp-step-num">5</span>Legal destination points will light up in your colour.</li>
      <li><span class="htp-step-num">6</span>Click a highlighted destination to move your checker.</li>
      <li><span class="htp-step-num">7</span>Use as many of your available moves as possible.</li>
      <li><span class="htp-step-num">8</span>Click <strong style="color:#74b9ff">End Turn →</strong> when finished.</li>
      <li><span class="htp-step-num">9</span>First to bear off all 15 checkers wins!</li>
    </ul>

    <div class="htp-section-title">Quick Rules</div>
    <div class="htp-rules">
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>Three players: Blue, Green, and Red — each racing to bear off 15 checkers.</div>
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>Official mode uses 2 dice. Rolling doubles gives you 4 moves of that number.</div>
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>Triple Dice Variant uses 3 dice — all different gives 3 moves; a pair, e.g. 5-5-2, gives four 5 moves plus one 2 move (5 movement dice in total); a triple, e.g. 6-6-6, gives nine moves of that value.</div>
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>A lone enemy checker (a blot) can be hit — it goes to the Bar.</div>
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>A checker on the Bar must re-enter before any other move can be made.</div>
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>Bearing off begins once all your checkers are in your home board (the last 6 points of your path).</div>
      <div class="htp-rule-item"><div class="htp-rule-dot"></div>You must use both dice values if a legal move exists. Partial use is allowed only when no full move is possible.</div>
    </div>

    <div class="htp-footer-note">
      TrigammonX is a three-player variant of backgammon.<br>
      Tips and strategy can be found in the Game Stats panel after a completed game.
    </div>

  </div>
</div>

<div class="tx-header">
  <!-- v3.5.2 Part A: approved gold TrigammonX wordmark replaces the old
       large text-based "TRIGAMMONX" heading — smaller/more refined, still
       the one deliberately "designed" moment on the page. A new packaged
       asset (trigammonx-v3.5.3/img/trigammonx-wordmark-gold.png), so it
       follows the same versioned-relative-path convention as this app's
       own CSS/JS, not an external URL. onerror hides just the <img> and
       reveals the ORIGINAL, completely unmodified .tx-header-mark text
       element immediately below it — the exact pre-v3.5.2 heading — so a
       failed image load degrades gracefully to "the current text-based
       TrigammonX heading" per spec, not a blank header. -->
  <img class="tx-header-wordmark-img" src="trigammonx-v5.1.5/img/trigammonx-wordmark-gold.png" alt="TrigammonX" onerror="this.style.display='none'; this.nextElementSibling.style.display='block';">
  <div class="tx-header-mark" id="tx-header-mark-fallback" style="display:none;">TrigammonX</div>
  <!-- v5.1.3: compact premium Beta status line, directly under the
       wordmark — replaces the old large .beta-banner paragraph as the
       primary "this is a Public Beta, Pro is unlocked" signal. Purely
       presentational; no gameplay/analytics tie. -->
  <div class="tx-header-subtitle" id="tx-header-subtitle">Public Beta &bull; All Pro Features Unlocked</div>
  <!-- v2.1: this badge carries the public version number (was "BETA
       v1.0"); class name kept as tx-beta-badge to minimize diff.
       v5.1.3: grouped with the tagline into one compact row (was two
       stacked lines) so adding the subtitle above nets to no extra
       header height. -->
  <div class="tx-header-meta-row">
    <div class="tx-beta-badge" id="tx-beta-badge">v5.1.5 PUBLIC BETA</div>
    <div class="tx-header-tagline">Backgammon for Three</div>
  </div>
  <!-- v3.6.1: prominent quick Background Music controls. Full Track/Loop
       settings remain in the Background Music card below the board. -->
  <div class="tx-header-music-quick" id="tx-header-music-quick" aria-label="Background music quick controls">
    <button type="button" class="tx-header-music-toggle" id="header-music-toggle"
            onclick="onMusicHeaderToggle()" aria-pressed="true">♫ Music On</button>
    <label class="tx-header-music-volume" for="header-music-volume-slider">
      <span class="tx-header-music-volume-label">Volume</span>
      <input type="range" id="header-music-volume-slider" min="0" max="100" step="1" value="25"
             oninput="onMusicVolumeInput(this.value)" aria-label="Background music volume">
      <span class="tx-header-music-volume-value" id="header-music-volume-value">25%</span>
    </label>
  </div>
  <div class="tx-header-rule"></div>
</div>

<!-- v5.1.3: the old large two-paragraph Beta explanatory block (#beta-banner)
     is replaced by this single compact "Give Beta Feedback" button — same
     id/onclick/destination/analytics (openBetaFeedback() ->
     TRIGAMMONX_BETA_FEEDBACK_URL -> feedback_clicked), just no more
     explanatory text and no more card padding, to reclaim vertical space.
     Still normal document flow, never a modal/overlay. -->
<div class="beta-banner" id="beta-banner">
  <button type="button" class="beta-feedback-btn" id="beta-feedback-btn" onclick="openBetaFeedback()">Give Beta Feedback</button>
</div>

<!-- v189: device preview mode indicator — fixed top-right, CSS-driven visibility -->
<div class="preview-badge" id="preview-badge">Preview: Full Width</div>

<!-- v3.5.0 Part C: Smart "New Version Available" notice — fixed,
     non-blocking, bottom-right toast. Hidden by default; JS adds the
     .show class only after latest-version.json (fetched asynchronously,
     after the app is already usable) reports a version genuinely newer
     than TRIGAMMONX_CURRENT_VERSION (01-config-data.js). Never a modal —
     never blocks the board, never auto-refreshes, never touches saved
     data. See initUpdateChecker()/tgxCheckForUpdate()/tgxRefreshNow()/
     tgxDismissUpdateNotice() in 10-clocks-themes-ui.js. -->
<div class="tgx-update-toast" id="tgx-update-toast" role="status" aria-live="polite">
  <div class="tgx-update-title">TrigammonX Update Available</div>
  <div class="tgx-update-text">A newer version of TrigammonX is available.</div>
  <div class="tgx-update-versions">
    You're running: <span id="tgx-update-current-version">v5.1.5</span><br>
    Latest version: <span id="tgx-update-latest-version">v5.1.5</span>
  </div>
  <div class="tgx-update-note">Your saved games and preferences will not be affected.</div>
  <div class="tgx-update-btns">
    <button type="button" class="tgx-update-btn tgx-update-btn-primary" id="tgx-update-refresh-btn" onclick="tgxRefreshNow()">Refresh Now</button>
    <button type="button" class="tgx-update-btn tgx-update-btn-later" id="tgx-update-later-btn" onclick="tgxDismissUpdateNotice()">Later</button>
  </div>
</div>

<div class="page-layout">

  <section class="board-column">

    <!-- v3.7.2 Task 3 (iPad finding 4): removed the redundant
         <h1 class="page-title">TrigammonX v3.7.2</h1> that used to sit
         here, directly above the board. It duplicated the real page
         header (.tx-header, wordmark + "Backgammon for Three" tagline +
         version badge, further up the page) and cost extra vertical
         space that mattered on tablet, where setup+board can otherwise
         force a scroll before play. The .page-title CSS rule is left in
         place (unused/harmless) rather than removed, in case any other
         markup still references the class. -->

    <!-- v262: small, non-blocking, dismissible landscape tip — normal
         document flow (never fixed/overlay/modal), hidden by default and
         shown only on very narrow portrait viewports via CSS media query.
         Never disables or covers any control; a player can ignore it and
         play in portrait with no loss of function. See
         initLandscapeTip()/dismissLandscapeTip(). -->
    <div class="landscape-tip-banner" id="landscape-tip-banner">
      <span class="lt-text">Tip: Landscape gives you a larger board.</span>
      <button type="button" class="lt-dismiss" id="landscape-tip-dismiss" onclick="dismissLandscapeTip()" aria-label="Dismiss tip">✕</button>
    </div>

    <!-- v253: the three giant clocks that used to sit here (above the
         board) are gone — they took too much visual priority from the
         board. Clock LOGIC and IDs are completely unchanged (see
         updateClocks()); Game Time / Turn Time now render in a compact
         format inside the Pro "Game Insights" card, and Real Time (not
         important to normal gameplay) moved into Developer/Admin. -->

  <!-- ══ CENTRE: Board + info + log ══ -->
  <main class="board-panel">

    <!-- Anchor-edit hint -->
    <div id="anchor-edit-hint">
      ⚓ <strong>Edit Checker Anchors ON</strong> — drag <span style="color:#ff0080;">A{N} crosshairs</span> to move base (x,y). Drag <span style="color:#00cec9;">D{N} diamonds</span> to change direction. Export when done.
    </div>

    <!-- Anchor export panel -->
    <div class="anchor-export-panel" id="anchor-export-panel">
      <div style="color:#ff0080;font-weight:bold;font-size:12px;margin-bottom:6px;">
        CHECKER_ANCHORS export — paste over existing constant in source file
      </div>
      <textarea id="anchor-export-ta" readonly></textarea>
      <div style="margin-top:6px;display:flex;gap:8px;">
        <button onclick="copyAnchorExport()"
          style="font-size:11px;padding:4px 10px;border-color:#ff0080;color:#ff0080;">📋 Copy</button>
        <button onclick="document.getElementById('anchor-export-panel').classList.remove('open')"
          style="font-size:11px;padding:4px 10px;border-color:#888;color:#888;">Close</button>
      </div>
    </div>

    <!-- Click-zone edit hint -->
    <div id="czl-edit-hint">
      🎯 <strong>Edit Click Zones ON</strong> — drag <span style="color:#fdcb6e;">yellow circles</span> to reposition each point's click zone. Export when done.
    </div>

    <!-- Click-zone export panel -->
    <div class="czl-export-panel" id="czl-export-panel">
      <div style="color:#fdcb6e;font-weight:bold;font-size:12px;margin-bottom:6px;">
        CLICK_POINTS export — paste over existing constant in source file
      </div>
      <textarea id="czl-export-ta" readonly></textarea>
      <div style="margin-top:6px;display:flex;gap:8px;">
        <button onclick="copyCzlExport()"
          style="font-size:11px;padding:4px 10px;border-color:#fdcb6e;color:#fdcb6e;">📋 Copy</button>
        <button onclick="document.getElementById('czl-export-panel').classList.remove('open')"
          style="font-size:11px;padding:4px 10px;border-color:#888;color:#888;">Close</button>
      </div>
    </div>

    <!-- Manual Setup Panel -->
    <div id="manual-setup-panel">
      <div class="msp-title">⚒ Manual Setup Mode</div>
      <div class="msp-warning">&#x26A0; Legal move rules are bypassed. Click any board point to place pieces directly.</div>
      <div class="msp-row">
        <label>Colour:
          <select id="msp-color">
            <option value="blue">Blue</option>
            <option value="green">Green</option>
            <option value="red">Red</option>
          </select>
        </label>
        <label>Destination:
          <select id="msp-dest">
            <option value="bar">Bar</option>
            <optgroup label="Points">
              <option value="1">Point 1</option><option value="2">Point 2</option>
              <option value="3">Point 3</option><option value="4">Point 4</option>
              <option value="5">Point 5</option><option value="6">Point 6</option>
              <option value="7">Point 7</option><option value="8">Point 8</option>
              <option value="9">Point 9</option><option value="10">Point 10</option>
              <option value="11">Point 11</option><option value="12">Point 12</option>
              <option value="13">Point 13</option><option value="14">Point 14</option>
              <option value="15">Point 15</option><option value="16">Point 16</option>
              <option value="17">Point 17</option><option value="18">Point 18</option>
              <option value="19">Point 19</option><option value="20">Point 20</option>
              <option value="21">Point 21</option><option value="22">Point 22</option>
              <option value="23">Point 23</option><option value="24">Point 24</option>
              <option value="25">Point 25</option><option value="26">Point 26</option>
              <option value="27">Point 27</option><option value="28">Point 28</option>
              <option value="29">Point 29</option><option value="30">Point 30</option>
              <option value="31">Point 31</option><option value="32">Point 32</option>
              <option value="33">Point 33</option><option value="34">Point 34</option>
              <option value="35">Point 35</option><option value="36">Point 36</option>
            </optgroup>
          </select>
        </label>
        <label>Count: <input type="number" id="msp-count" value="1" min="1" max="15"></label>
      </div>
      <div class="msp-row">
        <button class="btn-msp" onclick="mspAddSet()">Add / Set</button>
        <button class="btn-msp" onclick="mspRemove()">Remove Point</button>
        <button class="btn-msp danger" onclick="mspClearBoard()">Clear Board</button>
        <button class="btn-msp" onclick="resetToStart()">Reset to Start</button>
        <button class="btn-msp exit" onclick="toggleManualSetup()">Exit Manual Setup</button>
      </div>
    </div>

    <!-- Board image — v150: outer shell rotates, inner board-wrap stays axis-aligned -->
    <!-- v167: fixed dark stage/matte sits behind the rotating board so the
         transparent/white-label board art reads correctly and never makes
         the page background look like it is rotating along with it -->
    <!-- v4.3 (Module A): BORNE OFF and BAR / CAPTURED are now children of
         #board-stage — overlaid inside the framed board area, in the empty
         dark bands the board art already leaves above/below the playable
         triangle field (measured ~13.5-15% of the stage height at every
         breakpoint and every 0/120/240 board rotation). Purely a re-parent
         + absolute-position of the SAME live strips (same ids
         #borneoff-trays / #bar-trays / #bar-display, same render functions,
         same tap targets); #board-viewport / #board-rotation-* / .board-wrap
         / #board-img and the CLICK_POINTS / CHECKER_ANCHORS coordinate
         system are completely untouched. See .board-tray-strip-inframe in
         css/02-board-game.css. -->
    <div id="board-stage">

      <!-- v3.7.2 Task 1 → v4.3: compact horizontal BORNE OFF strip, now in
           the empty band INSIDE the top of the board frame.
           renderBorneOffDisplay() (06-stats-history.js) fills
           #borneoff-trays. Presentation only — borne-off counts,
           statistics and winner detection are untouched. -->
      <div class="board-tray-strip board-tray-strip-inframe" id="borneoff-strip">
        <div class="board-tray-strip-title">Borne Off</div>
        <div class="board-tray-row" id="borneoff-trays"></div>
      </div>

      <div id="board-viewport">
        <div id="board-rotation-center">
          <div id="board-rotation-shell">
            <div class="board-wrap" id="board-wrap">
              <img id="board-img" onload="if (window.onBoardReady) { onBoardReady(); } else { window.__trigammonBoardImgLoadedEarly = true; }" onerror="if (window.handleBoardImageError) { handleBoardImageError(); } else { window.__trigammonBoardImgErroredEarly = true; }">
              <!-- ══ v258: Board Base Image — Config ═══════════════════════════
                   v2.1.9: single source of truth is now the small board-design
                   library below (window.TRIGAMMONX_BOARD_DESIGNS), not one bare
                   URL string — see PART C of the v2.1.9 change report. A future
                   board only ever needs one new entry added to this array (same
                   geometry artwork) plus the corresponding <button> in the Pro
                   Themes "Board Design" row further down the page; no other
                   code changes. This still resolves and sets
                   window.TRIGAMMONX_BOARD_IMAGE_URL and #board-img.src exactly
                   as the old single-URL version did, at the same point in page
                   load, using whichever design the player last chose
                   (trigammonx_board_design in localStorage; defaults to Classic
                   if unset/invalid) — so the correct artwork paints immediately
                   on first render instead of flashing Classic then swapping.
                   Nothing about board geometry, scaling, overlays, or the
                   onload/onerror handshake above was touched. -->
              <script>
                window.TRIGAMMONX_BOARD_DESIGNS = [
                  { id: 'classic', label: 'Bronze Metal', url: 'https://trigammonx.com/ximages/TrigammonX-board.png' },
                  { id: 'blue-circuits', label: 'Blue Circuits', url: 'https://trigammonx.com/ximages/TrigammonX-board-blue-circuits.png' },
                  { id: 'm51', label: 'M51 Spiral Galaxy', url: 'https://trigammonx.com/ximages/TrigammonX-board-M51.png' },
                  { id: 'brown-eye', label: 'Brown Eye', url: 'https://trigammonx.com/ximages/TrigammonX-board-brown-eye.png' },
                  { id: 'digital-brain', label: 'Digital Brian', url: 'https://trigammonx.com/ximages/TrigammonX-board-digital-brain.png' },
                  { id: 'chrome', label: 'Chrome', url: 'https://trigammonx.com/ximages/TrigammonX-board-Chrome.png' },
                  { id: 'quantum-grid', label: 'Quantum Grid', url: 'https://trigammonx.com/ximages/TrigammonX-board-quantum-grid.png' },
                  { id: 'moon', label: 'Moon', url: 'https://trigammonx.com/ximages/TrigammonX-board-Moon.png' },
                  { id: 'spiral-glass', label: 'Spiral Glass', url: 'https://trigammonx.com/ximages/TrigammonX-board-Spiral-Glass.png' },
                  { id: 'techno-ring', label: 'Techno Ring', url: 'https://trigammonx.com/ximages/TrigammonX-board-Techno-Ring.png' },
                  { id: 'retro-speedo', label: 'Retro Speedo', url: 'https://trigammonx.com/ximages/TrigammonX-board-Retro-Speedo.png' },
                  { id: 'tesla', label: 'Tesla', url: 'https://trigammonx.com/ximages/TrigammonX-board-Tesla.png' },
                  { id: 'fractal', label: 'Fractal', url: 'https://trigammonx.com/ximages/TrigammonX-board-Fractal.png' },
                  { id: 'fire-clouds', label: 'Fire Clouds', url: 'https://trigammonx.com/ximages/TrigammonX-board-Fire-Clouds.png' },
                  { id: 'quantum-spark', label: 'Quantum Spark', url: 'https://trigammonx.com/ximages/TrigammonX-board-Quantum-Spark.png' },
                  { id: 'electric-fractal', label: 'Electric Fractal', url: 'https://trigammonx.com/ximages/TrigammonX-board-Electric-Fractal.png' },
                  { id: 'cabbage', label: 'Cabbage', url: 'https://trigammonx.com/ximages/TrigammonX-board-Cabbage.png' },
                  { id: 'colorful-spiral', label: 'Colorful Spiral', url: 'https://trigammonx.com/ximages/TrigammonX-board-Colorful-Spiral.png' },
                  { id: 'x-academy', label: 'X-Academy', url: 'https://trigammonx.com/ximages/TrigammonX-board-X-Academy.png' }   /* v5.0 (Module B) — default Academy board; verified live */
                ];
                window.TRIGAMMONX_BOARD_DESIGN_STORAGE_KEY = 'trigammonx_board_design';
                (function () {
                  var chosenId = 'classic';
                  try {
                    var stored = localStorage.getItem(window.TRIGAMMONX_BOARD_DESIGN_STORAGE_KEY);
                    if (stored === 'deco-speedo') stored = 'retro-speedo';
                    if (stored && window.TRIGAMMONX_BOARD_DESIGNS.some(function (d) { return d.id === stored; })) chosenId = stored;
                  } catch (e) { /* ignore — default to Classic */ }
                  var design = window.TRIGAMMONX_BOARD_DESIGNS.filter(function (d) { return d.id === chosenId; })[0] || window.TRIGAMMONX_BOARD_DESIGNS[0];
                  window.TRIGAMMONX_BOARD_IMAGE_URL = design.url;
                  document.getElementById('board-img').src = window.TRIGAMMONX_BOARD_IMAGE_URL;
                })();
              </script>
            </div>
          </div>
        </div>
      </div>
      <!-- v243 Fix 2: static TrigammonX branding — outside #board-viewport/
           #board-rotation-shell entirely, so it never rotates with the
           board and never moves as currentPlayer changes. Purely visual;
           pointer-events:none so it can never block a checker/point click. -->
      <!-- v3.7.2 tablet fix — Task 1: the visible "TrigammonX / Backgammon
           for Three" wording that used to render here was a duplicate of
           the real page header (.tx-header wordmark + tagline, further up)
           and has been removed. This element is now a transparent,
           text-free safe hit-zone centred over the non-playing centre/logo
           area only. On touch devices (pointer-events re-enabled solely
           under @media (pointer: coarse) — see css/02-board-game.css — so a
           desktop mouse click here is a complete no-op regardless of window
           width), tapping it during live play triggers a quick Pause via
           handleBoardBrandingTap(). It sits at z-index 6, BELOW .pt-zone
           (10) and .checker (20), and outside #board-viewport/
           #board-rotation-shell, so it never rotates/moves and can never
           intercept a real checker/point move. See handleBoardBrandingTap()
           (05-gameplay-interaction.js). -->
      <div id="board-static-branding" aria-hidden="true" onclick="handleBoardBrandingTap(event)"></div>

      <!-- v3.7.2 Task 1: animated Triple Dice opening dice — visual only,
           landing in fixed safe slots near the board's centre/logo area
           (never tied to board-art coordinates, so this is identical
           across every board design). Hidden (.td3-active not set)
           outside an active Triple Dice opening ceremony, and outside
           #board-viewport/#board-rotation-shell so it never rotates or
           collides with the Bar/Borne-Off zones (Task 7/8), which live
           lower on the board. Purely reactive to values
           td3StartOpeningDieSpin()/td3SettleOpeningDie() (03-rules-
           engine.js) are given — never itself decides or alters a roll,
           the Triple Dice opening rules, or any checker/game state.
           Official 2 Dice's own opening-roll display is completely
           untouched and never uses this element. -->
      <div id="td3-opening-dice-stage" aria-hidden="true">
        <div class="td3-opening-die-slot" id="td3-opening-die-blue"></div>
        <div class="td3-opening-die-slot" id="td3-opening-die-red"></div>
        <div class="td3-opening-die-slot" id="td3-opening-die-green"></div>
      </div>

      <!-- v3.7.2 Task 2 → v4.3: compact horizontal BAR / CAPTURED strip, now
           in the empty band INSIDE the bottom of the board frame. All Bar
           bays/checkers stay OFF the wooden playing surface; renderBarPieces()
           fills #bar-trays; each tray stays a tap/keyboard target for legal
           Bar re-entry — a tap on the current player's tray still calls the
           unchanged onBarCheckerClick(colour). Logical Bar state (barState /
           BAR_ANCHORS) and every re-entry rule are untouched. #bar-display
           is kept (hidden) so renderBarDisplay()'s existing call sites keep
           working. -->
      <div class="board-tray-strip board-tray-strip-inframe" id="bar-strip">
        <div class="board-tray-strip-title">Bar / Captured</div>
        <div class="board-tray-row" id="bar-trays"></div>
        <span id="bar-display" hidden></span>
      </div>

    </div>

    <!-- Dice / Status panel (v190c) — refined so Rolled and Available
         Moves sit side-by-side near the top, while Bar and Pips move below
         the main action controls for a cleaner reading order. All inner
         element IDs are unchanged so the existing render/update functions
         continue to work without logic changes. -->

    <!-- v201b: Opening Roll Panel — FIRST in the under-board order.
         Appears before Current Turn / Rolled / Available Moves so it
         reads as the mandatory first step before anything else. Hidden
         once the opening turn is complete (body.orp-panel-hidden). -->
    <!-- v3.7.1: single-Human colour chooser — shown instead of the panel
         below only when the player configuration is exactly 1 Human + 2
         Computer and that Human hasn't already chosen a seat for this
         game. renderTripleDiceOpeningPanel() (js/03-rules-engine.js)
         toggles display; hidden by default so it never flashes for
         Official 2 Dice or any other player configuration. -->
    <div class="colour-choice-panel" id="colour-choice-panel" style="display:none;">
      <div class="orp-title">CHOOSE YOUR COLOUR</div>
      <div class="cc-status" id="cc-status">You're the only Human player — pick which colour you want to play.</div>
      <div class="cc-btn-row">
        <button class="cc-btn cc-btn-blue"  onclick="chooseOpeningColour('blue')">BLUE</button>
        <button class="cc-btn cc-btn-red"   onclick="chooseOpeningColour('red')">RED</button>
        <button class="cc-btn cc-btn-green" onclick="chooseOpeningColour('green')">GREEN</button>
      </div>
    </div>

    <div class="opening-roll-panel" id="opening-roll-panel">
      <div class="orp-title">Opening Roll — who goes first?</div>

      <!-- v3.7.2 bugfix: opening-roll presentation order standardized to
           Blue -> Red -> Green (matches the ceremony's own roll order and
           renderTripleDiceOpeningPanel()'s ['blue','red','green'] loop). -->
      <div class="orp-dice-row">
        <div class="orp-player">
          <div class="orp-dot" style="background:#74b9ff;"></div>
          <span class="orp-player-name">Blue</span>
          <div class="orp-die" id="orp-die-blue">—</div>
        </div>
        <div class="orp-player">
          <div class="orp-dot" style="background:#ff7675;"></div>
          <span class="orp-player-name">Red</span>
          <div class="orp-die" id="orp-die-red">—</div>
        </div>
        <div class="orp-player">
          <div class="orp-dot" style="background:#55efc4;"></div>
          <span class="orp-player-name">Green</span>
          <div class="orp-die" id="orp-die-green">—</div>
        </div>
      </div>

      <div class="orp-status" id="orp-status">Roll one die for each player to determine who starts.</div>

      <!-- v3.7.1: dispatches to Official 2 Dice's own unmodified
           performOpeningRoll() or, for Triple Dice, the new sequential
           per-colour roll handler — see handleOpeningRollButtonClick(),
           js/03-rules-engine.js. -->
      <button class="orp-btn orp-glowing" id="orp-roll-btn" onclick="handleOpeningRollButtonClick()">🎲 Roll for First Player</button>
    </div>

    <div class="under-board-dice-panel">
      <div class="udp-col udp-col-turn">
        <div class="dice-label">Current Turn</div>
        <div class="turn-badge blue" id="turn-badge">Blue</div>
      </div>

      <div class="udp-col udp-col-dice-combo">
        <div class="udp-dice-grid">
          <div class="udp-col udp-col-rolled dice-col-rolled">
            <div class="dice-label">Rolled</div>
            <!-- v196: .dice-roll-stage-mini is the coordinate system for
                 travelling dice. #dice-raw-row is unchanged and remains
                 the permanent landing zone for all renderRolledDice() calls.
                 .drs-traveller elements are created/removed by rollDiceFromTray()
                 and are always pointer-events:none so they never block clicks. -->
            <div class="dice-roll-stage-mini" id="dice-roll-stage-mini">
              <div class="dice-tray-mini" id="dice-tray-mini">
                <div class="dice-tray-dot"></div>
                <div class="dice-tray-dot"></div>
              </div>
              <div class="dice-landing-mini">
                <div class="dice-row" id="dice-raw-row"></div>
              </div>
            </div>
          </div>

          <div class="udp-col udp-col-available dice-col-available">
            <div class="dice-label">Available Moves</div>
            <div class="dice-row" id="dice-exp-row"></div>
            <div class="roll-type" id="roll-type-label"></div>
          </div>
        </div>
      </div>
    </div>

    <!-- Action buttons — directly below dice/status panel. -->
    <div class="under-board-actions">

      <div class="under-board-row">
        <div class="under-board-row-title">Player Actions</div>
        <button onclick="rollDice()" class="btn-roll-dice wide-action">🎲 Roll Dice</button>
        <button onclick="endTurn()" class="btn-end-turn wide-action">End Turn →</button>
        <button onclick="clearLastMoveMarkers()" class="btn-clear-marker wide-action">Clear Move Marker</button>
        <button onclick="undoLastMove()" class="btn-take-back wide-action">Take Back Last Move (Plus)</button>
      </div>

      <div class="under-board-row">
        <div class="under-board-row-title">Game Flow</div>
        <!-- v236 Fix 3: single context-sensitive button replaces the old
             Continue Play / Pause / Continue trio. playGame() routes to
             beginPlay() / pauseGame() / continueGame() as appropriate;
             updateGameFlowButton() keeps the label in sync. -->
        <button class="btn-begin-play" id="btn-begin-play" onclick="playGame()" style="border-color:#55efc4;color:#55efc4;">▶ Start Game</button>
        <!-- v2.1.4: public Rotate Board control — available to every
             player (not Pro/developer-only). Thin wrapper only; see
             cyclePublicBoardView() for the existing-infrastructure reuse
             this calls into. Same base button styling as its Game Flow
             row neighbors (.under-board-actions button), so touch target
             size on iPad/mobile matches Start Game / Sound already. -->
        <button class="btn-rotate-board" id="btn-rotate-board" onclick="cyclePublicBoardView()" title="View the board from the next player side" style="border-color:#ffd700;color:#ffd700;">↻ Rotate Board</button>
        <!-- v242: master UI-sound toggle. Purely a feedback preference —
             stored in localStorage only, not part of the game save format. -->
        <button class="btn-sound-toggle" id="btn-sound-toggle" onclick="toggleUiSound()" style="border-color:#636e72;color:#b2bec3;">🔊 Sound On</button>
      </div>

    </div><!-- /.under-board-actions -->

    <!-- Info bar — v3.7.2 final UI pass Task 3: moved up here (was below the
         collapsibles) so gameplay prompts read directly under Player
         Actions, keeping the play area coherent. -->
    <div class="info-bar" id="info-bar">Loading board…</div>

    <!-- GAME TRENDS — v5.0.6 (public §1): the Pip Race / Dice Fortune
         graphs, promoted to a WIDE visual area here in the board column,
         directly ABOVE Table Talk. Side by side on desktop, stacked on
         iPad / narrow / mobile (flex-wrap — no JS layout switching). Same
         #pro-card-trends id (so TX_COLLAPSIBLE_SECTIONS['trends'],
         toggleTxCollapsible('trends'), Expand All / Collapse All, the
         open-by-default rule and the v4.1.1 contain:layout /
         overflow-anchor:none stability rule all still apply), same
         #chart-pip-race / #chart-dice-fortune ids, same
         renderGameTrendsCharts() data / calculations / update timing —
         only the DOM position and width changed. Open by default. -->
    <div class="pro-card tx-collapsible" id="pro-card-trends">
      <div class="panel-title" id="pro-card-trends-title" onclick="toggleTxCollapsible('trends')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('trends');}">▼ Game Trends</div>
      <div class="gt-large-row">
        <div class="gt-chart-block gt-chart-block-large">
          <div class="gt-chart-title">Pip Race <span class="gt-chart-sub">lower is better</span></div>
          <div id="chart-pip-race" class="gt-chart-svg-wrap"></div>
        </div>
        <div class="gt-chart-block gt-chart-block-large">
          <div class="gt-chart-title">Dice Fortune <span class="gt-chart-sub">cumulative rolled</span></div>
          <div id="chart-dice-fortune" class="gt-chart-svg-wrap"></div>
        </div>
      </div>
    </div>

    <!-- v265: Table Talk / Commentary controls, relocated directly below
         Player Actions / Game Flow so commentary reads as part of playing
         the game rather than a separate Pro panel — see the removal note
         where this card used to sit inside TRIGAMMONX PRO. Same ids and
         onchange handlers as before (commentary-mode-select/
         onCommentaryModeChange(), commentary-frequency-select/
         onCommentaryFrequencyChange(), voice-enabled-select/
         onVoiceToggle(), commentary-pack-status, table-talk-panel) —
         nothing about commentary event detection, phrase selection,
         cooldowns, audio mapping, or Table Talk content changed, only
         this card's position and outer container (.under-board-commentary
         instead of .pro-card/.pro-card-wide, styled to match its new
         Player Actions/Game Flow/Save-Resume neighbors). The Commentary
         dropdown's option TEXT now reads Standard (Free) / Cheeky (Pro) /
         Adult - Expletives (Pro) — presentation only; option values
         (std/cheeky/auunc) and the STD/CHEEKY/AUUNC internal identifiers
         used everywhere else (phrase ids, audio URLs, commentaryMode
         checks) are completely untouched. Default remains Standard
         (Free) + Voice On; Adult - Expletives is never the default; all
         three styles remain fully usable in this internal build. -->
    <div class="under-board-commentary tx-collapsible" id="under-board-commentary">
      <div class="panel-title" id="under-board-commentary-title" onclick="toggleTxCollapsible('commentary')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('commentary');}">▼ Table Talk</div>

      <!-- Commentary (v248) — wording pack is embedded directly in this
           HTML file (see "TrigammonX Commentary Pack v1 — embedded"
           above). Off by default so existing play is unchanged unless
           enabled. -->
      <div class="commentary-controls">
        <label class="commentary-control-label">
          Commentary
          <select id="commentary-mode-select" onchange="onCommentaryModeChange(this.value)" class="player-type-select">
            <option value="off">Off</option>
            <option value="std" selected>Standard (Free)</option>
            <option value="cheeky">Cheeky (Plus)</option>
            <option value="auunc">Adult - Expletives (Plus)</option>
          </select>
        </label>
        <label class="commentary-control-label">
          Frequency
          <select id="commentary-frequency-select" onchange="onCommentaryFrequencyChange(this.value)" class="player-type-select">
            <option value="keyMoments">Key Moments</option>
            <option value="normal" selected>Normal</option>
            <option value="chatty">Chatty</option>
          </select>
        </label>
        <!-- v5.0.4 (Section 2) — AI Turn Commentary. Independent of the
             Commentary style / Frequency / Voice controls: OFF stops
             SPOKEN commentary for computer-player turns only (your own
             turns keep following the Voice setting; the game-winner line
             is always announced). Persisted; Reset All restores 'On'. -->
        <label class="commentary-control-label">
          AI Turn Commentary
          <select id="ai-turn-commentary-select" onchange="onAiTurnCommentaryChange(this.value)" class="player-type-select">
            <option value="on" selected>On</option>
            <option value="off">Off</option>
          </select>
        </label>
      </div>
      <!-- v247: spoken voice — independent of the existing UI Sound On/Off
           button in Game Setup (that one only covers short click/whoosh
           effects). -->
      <div class="commentary-controls">
        <label class="commentary-control-label" style="flex:1 1 100%;">
          Voice
          <select id="voice-enabled-select" onchange="onVoiceToggle(this.value === 'on')" class="player-type-select">
            <option value="on" selected>On</option>
            <option value="off">Off</option>
          </select>
        </label>
      </div>
      <!-- v2.3.0: Voice Speed + Volume — playback controls for the
           prerecorded Scotty commentary MP3s only (playCommentaryAudioFile(),
           07-commentary.js), placed directly with the existing public
           Voice/Commentary controls above. Independent of the Developer/
           Admin browser-TTS "Browser TTS Test Lab" Narrator Voice tuning
           (unaffected). Persisted standalone in localStorage
           (trigammonx_voice_speed / trigammonx_voice_volume) — not part of
           the game save, autosave, .tgxsave, Winner Certificate, or GA4;
           Reset/New Game does not reset them. -->
      <div class="commentary-controls">
        <label class="commentary-control-label" style="flex:1 1 100%;">
          Voice Speed
          <div class="voice-speed-btn-row" id="voice-speed-btn-row" role="group" aria-label="Voice Speed">
            <button type="button" class="voice-speed-btn" data-speed="0.85" onclick="onVoiceSpeedChange('0.85')" aria-pressed="false">0.85×</button>
            <button type="button" class="voice-speed-btn" data-speed="1" onclick="onVoiceSpeedChange('1')" aria-pressed="true">1.0×</button>
            <button type="button" class="voice-speed-btn" data-speed="1.1" onclick="onVoiceSpeedChange('1.1')" aria-pressed="false">1.10×</button>
            <button type="button" class="voice-speed-btn" data-speed="1.2" onclick="onVoiceSpeedChange('1.2')" aria-pressed="false">1.20×</button>
            <button type="button" class="voice-speed-btn" data-speed="1.3" onclick="onVoiceSpeedChange('1.3')" aria-pressed="false">1.30×</button>
            <button type="button" class="voice-speed-btn" data-speed="1.4" onclick="onVoiceSpeedChange('1.4')" aria-pressed="false">1.40×</button>
            <button type="button" class="voice-speed-btn" data-speed="1.5" onclick="onVoiceSpeedChange('1.5')" aria-pressed="false">1.50×</button>
          </div>
          <button type="button" class="voice-sample-btn" id="voice-sample-btn" onclick="toggleVoiceSpeedSample()" aria-pressed="false">▶ Play Sample</button>
        </label>
      </div>
      <!-- Public Beta v1.0: small, unobtrusive, non-blocking notice next
           to the Commentary selector — a single static line, not a popup,
           shown once and never repeated on launch. -->
      <div class="commentary-adult-note" id="commentary-adult-note">Adult commentary contains strong language.</div>
      <!-- v260: the old browser-TTS Narrator Voice / Voice Style / Test
           Voice / Speed / Pitch block that used to sit here has moved to
           Developer/Admin ("Browser TTS Test Lab" — see #tx-section-admin
           below). Real commentary is now the recorded Scotty MP3 system
           (Commentary/Voice above), so browser-TTS tuning is no longer
           appropriate in the normal player-facing UI. Same ids, same
           functions (onNarratorVoiceChange(), onVoiceStyleChange(),
           onVoiceRateInput(), onVoicePitchInput(), testVoiceAudition(),
           syncVoiceControlsUI(), populateNarratorVoiceDropdown()) —
           only their controls' location in the page changed. -->
      <div id="commentary-pack-status" class="commentary-pack-status">Commentary pack: loading…</div>

      <!-- Table Talk (v246) — player-facing commentary. Deliberately
           separate from the technical Move Log, which now lives in
           Developer/Admin (id="move-log"). -->
      <div class="panel-section-title">Table Talk</div>
      <div id="table-talk-panel" class="table-talk-panel">
        <div class="tt-empty">No commentary yet.</div>
      </div>
    </div><!-- /.under-board-commentary -->

    <!-- v3.6.0: Background Music — optional, low-volume ambient music,
         entirely independent of UI Sound (Game Flow row, above) and Voice
         (Table Talk card, above). Same visual card language as its
         .under-board-actions/.under-board-commentary neighbors (see
         .under-board-music, css/01-base-layout.css). On/Off + Loop use the
         same On/Off <select> pattern as the existing Voice control; Track
         is populated at startup from TRIGAMMONX_MUSIC_TRACKS
         (10-clocks-themes-ui.js) so adding a track later never requires an
         HTML change. Presentation only — never synced to gameplay, RNG,
         AI, dice/turn timing, or the Tournament Clock; never recorded in
         Game History or the Winner Certificate. -->
    <div class="under-board-music tx-collapsible" id="under-board-music">
      <div class="panel-title" id="under-board-music-title" onclick="toggleTxCollapsible('music')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('music');}">▼ Background Music</div>
      <div class="music-controls">
        <label class="music-control-label">
          Music
          <select id="music-enabled-select" onchange="onMusicToggle(this.value === 'on')" class="player-type-select">
            <option value="on" selected>On</option>
            <option value="off">Off</option>
          </select>
        </label>
        <label class="music-control-label">
          Track
          <select id="music-track-select" onchange="onMusicTrackChange(this.value)" class="player-type-select"></select>
        </label>
      </div>
      <div class="music-controls">
        <label class="music-control-label" style="flex:1 1 100%;">
          Volume <span id="music-volume-value" class="voice-tuning-value">25%</span>
          <input type="range" id="music-volume-slider" class="voice-tuning-slider"
                 min="0" max="100" step="1" value="25"
                 oninput="onMusicVolumeInput(this.value)">
        </label>
      </div>
      <div class="music-controls">
        <label class="music-control-label">
          Loop
          <select id="music-loop-select" onchange="onMusicLoopToggle(this.value === 'on')" class="player-type-select">
            <option value="on" selected>On</option>
            <option value="off">Off</option>
          </select>
        </label>
      </div>
      <div id="music-status" class="music-status"></div>
    </div><!-- /.under-board-music -->

    <!-- v266: player-facing Move History (Pro) — collapsed by default,
         directly below Table Talk/Commentary. "(Pro)" is a presentation
         label only, same as Take Back/Save/Load — PRODUCT_TIER stays
         'developer' and nothing here is actually gated. This is
         DELIBERATELY separate from the Technical Move Log
         (id="move-log", Developer/Admin only, untouched) — different id,
         different data source (moveHistoryTurns, a presentation-only
         array built by startMoveHistoryTurn()/recordMoveHistoryEntry()/
         removeLastMoveHistoryEntry()/resetMoveHistory() — see JS), never
         raw log text, never used for legality/turn/hit/bear-off
         decisions. -->
    <div class="move-history-card mh-collapsed" id="move-history-card">
      <div class="mh-title" id="move-history-title" onclick="toggleMoveHistory()" role="button" tabindex="0"
           onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleMoveHistory();}">▶ Move History (Plus)</div>
      <div class="mh-panel" id="move-history-panel">
        <div class="mh-empty">Moves will appear here once play begins.</div>
      </div>
    </div><!-- /.move-history-card -->

    <!-- v3.3.0: Game History / Match History — a structured, PERSISTED
         (Save/Load/autosave/.tgxsave — see 09-saves.js), exportable
         chronological record of what actually happened, built from the
         new matchHistoryEvents stream (02-state-utils.js). Deliberately
         separate from Move History (Pro) above, which stays exactly as
         it was (session-only, presentation-only, unchanged). Title reads
         "GAME HISTORY" in Regular Play / "MATCH HISTORY" in Tournament
         Mode; the Game selector + Export controls only appear in
         Tournament Mode (renderHistoryPanel() toggles both — see JS).
         Collapsed by default, same convention as Move History (Pro)
         immediately above. -->
    <div class="history-card hx-collapsed" id="history-card">
      <div class="hx-title" id="history-title" onclick="toggleHistory()" role="button" tabindex="0"
           onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleHistory();}">▶ GAME HISTORY</div>
      <div class="hx-controls" id="history-controls" style="display:none;">
        <label class="hx-game-select-label">Game
          <select id="history-game-select" class="hx-game-select" onchange="onHistoryGameFilterChange(this.value)">
            <option value="all">All Games</option>
          </select>
        </label>
        <button type="button" class="hx-export-btn" onclick="exportHistoryTxt()">Export TXT</button>
      </div>
      <div class="hx-panel" id="history-events">
        <div class="hx-empty">Game history will appear here once play begins.</div>
      </div>
    </div><!-- /.history-card -->

    <!-- v253: the Doubling Cube visual-test section used to live here,
         directly under the board. It's unfinished (visual only, no
         scoring) and now lives in Developer/Admin instead, hidden from
         Free/Pro consumer presentation entirely (see body.tier-free/
         body.tier-pro .under-board-dc-section CSS) — same
         #under-board-dc-section/#dc-tray/#dc-token markup and doubling-
         cube logic, only its position in the page changed. -->

    <!-- v3.7.2 final UI pass Tasks 1-3: the old combined Bar + Borne Off
         panel that used to sit here is gone. Borne Off is now the compact
         horizontal strip ABOVE the board (#borneoff-strip); Bar / Captured
         is the compact horizontal strip BELOW the board (#bar-strip). The
         info bar moved up under Player Actions. -->

    <!-- Save/Resume and Undo — secondary controls (v190b) -->
    <div class="under-board-controls" id="under-board-controls">

      <div class="under-board-row">
        <div class="under-board-row-title">Save / Resume</div>
        <!-- v2.1.9: manual Save Game (Pro) is now "Save Game As…", opening
             the named-save dialog instead of writing straight to the
             single-slot SAVE_KEY autosave/recovery slot. loadGameFromLocalStorage()
             and clearSavedGame() are unchanged, unmodified functions —
             still operate on SAVE_KEY only — reused inside the new Load
             Saved Game library (see #saved-games-backdrop) as the
             Autosave/Recovery section's "Load Autosave" action; the
             standalone Clear button below is simply relabeled for clarity
             now that "saved game" could otherwise be read as ambiguous
             between Autosave and a named save. -->
        <button onclick="openSaveAsDialog()" style="border-color:#55efc4;color:#55efc4;">💾 Save Game As… (Plus)</button>
        <button onclick="openSavedGamesLibrary()" style="border-color:#74b9ff;color:#74b9ff;">↩ Load Saved Game… (Plus)</button>
        <button onclick="clearSavedGame()" style="border-color:#ff7675;color:#ff7675;">✕ Clear Autosave</button>
        <label class="under-board-inline-label">
          <input type="checkbox" id="autosave-checkbox" checked onchange="onAutosaveToggle(this.checked)">
          Autosave
        </label>
        <div id="save-status" class="small-status">No saved game loaded.</div>
      </div>

      <!-- v3.4.0: always-available access to the Winner Archive/Career
           Stats, independent of a Winner Certificate currently being
           open (see also the compact row inside #goc-card itself,
           .goc-archive-row, for in-modal access right after a win). -->
      <div class="under-board-row">
        <div class="under-board-row-title">Winner Archive &amp; Career Stats</div>
        <button onclick="openWinnerArchive()" style="border-color:#f0cf8c;color:#f0cf8c;">🏆 Winner Archive</button>
        <button onclick="openCareerStats()" style="border-color:#f0cf8c;color:#f0cf8c;">📊 Career Stats</button>
      </div>

      <div class="under-board-row" style="display:none;">
        <div id="undo-status" class="small-status">No undo history yet.</div>
      </div>

    </div>

    <!-- Selected-checker legal move list -->
    <div class="move-list-panel" id="move-list-panel">
      <div class="mlp-title" id="mlp-title">Legal moves</div>
      <div id="mlp-body"></div>
    </div>

    <!-- v253: the technical Move Log used to sit here, directly under
         the board. It's a developer/debug tool (raw event-by-event
         system log), not player-facing, and now lives in Developer/
         Admin instead — same #move-log id and logMsg()-appended
         .ml-sys/.ml-{player} entries, only its position changed. -->

  </main>

  </section>

  <!-- ══ RIGHT PANEL: Player Controls ══ -->
  <!-- v253: this was the long "Player Controls" sidebar — simplified into
       a compact GAME SETUP card beside the board, per the Free/Pro/
       Developer restructuring. Game Stats, Game Report, AI Speed,
       Commentary, Voice, and Table Talk all moved into TRIGAMMONX PRO
       below (see #tx-section-pro); Pips moved into the new horizontal
       Pip Race strip beneath the board. Every element kept its existing
       id — nothing here is a new control. -->
  <aside class="right-panel player-panel">
    <div class="panel-title">Game Setup</div>

    <!-- v197: How to Play -->
    <button class="htp-btn" onclick="openHowToPlay()">? How to Play</button>

    <!-- v260: Quick Start — a compact, always-visible companion to How to
         Play. Steps 2 (Enter Names) and 3 (Choose Commentary) are pure
         guidance and never gate advancement — the game itself has no such
         requirement, and this list must not invent one. Step highlighting
         (.qs-active/.qs-done) is applied purely visually by
         updateGuidedNextAction() and never disables anything here. -->
    <!-- v265: collapsed by default to save vertical space — same
         .qs-step/.qs-active/.qs-done markup and updateGuidedNextAction()
         highlighting as before, untouched; only the card's open/closed
         state is new. No localStorage persistence — always starts
         collapsed on a fresh page load, per spec. -->
    <div class="qs-card qs-collapsed" id="qs-card">
      <div class="qs-title" id="qs-title" onclick="toggleQuickStart()" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleQuickStart();}">▶ Quick Start</div>
      <ol class="qs-list" id="qs-list">
        <li class="qs-step" data-qs-step="players">
          <span class="qs-num">1</span>
          <span class="qs-text"><strong>Choose Players</strong><br>Select Human or Computer for Blue, Green and Red.</span>
        </li>
        <li class="qs-step qs-optional" data-qs-step="names">
          <span class="qs-num">2</span>
          <span class="qs-text"><strong>Enter Names</strong> <em>(optional)</em><br>Add player names if desired.</span>
        </li>
        <li class="qs-step qs-optional" data-qs-step="commentary">
          <span class="qs-num">3</span>
          <span class="qs-text"><strong>Choose Commentary</strong> <em>(optional)</em><br>Select your commentary style and voice preference.</span>
        </li>
        <li class="qs-step" data-qs-step="roll-first">
          <span class="qs-num">4</span>
          <span class="qs-text"><strong>Roll for First Player</strong><br>Each player rolls one die. Highest starts and uses the two highest opening dice for the first turn.</span>
        </li>
        <li class="qs-step" data-qs-step="play">
          <span class="qs-num">5</span>
          <span class="qs-text"><strong>Play!</strong><br>Follow the highlighted controls during your turn.</span>
        </li>
      </ol>
    </div>

    <!-- v199: New Game Setup helper card -->
    <div class="ngs-card" id="ngs-card">
      <div class="ngs-title">New Game Setup</div>
      <div class="ngs-hint" id="ngs-hint">Choose players and dice mode, then click Begin Play.</div>
      <div class="ngs-status" id="ngs-status">Ready: Blue Human, Green Human, Red Human — Official 2 Dice</div>
    </div>

    <!-- v3.7.2 Task 5: Play Mode is now a prominent top-level choice next
         to primary setup, instead of being buried in a small dropdown
         further down. This is a presentation-only addition — the real
         #play-mode-select <select> below (now visually hidden) still
         exists unchanged and still owns every existing behaviour
         (onPlayModeChange(), the live-game lock, save/load sync); these
         buttons just drive it via setPlayModeViaButton(), so no existing
         wiring needed to change. _syncPlayModeButtons() (05-gameplay-
         interaction.js) keeps the active/locked visual state in sync. -->
    <div class="pm-prominent" id="pm-prominent">
      <div class="pm-prominent-title">PLAY MODE</div>
      <div class="pm-prominent-buttons">
        <button type="button" class="pm-prominent-btn pm-active" id="pm-btn-regular"
          onclick="setPlayModeViaButton('regular')">Regular Play</button>
        <button type="button" class="pm-prominent-btn pm-btn-tournament" id="pm-btn-tournament"
          onclick="setPlayModeViaButton('tournament')">🏆 Tournament Mode</button>
        <!-- v5.0 (Module A) — Academy: a third, distinct play mode. Drives the
             same hidden #play-mode-select via setPlayModeViaButton('academy'). -->
        <button type="button" class="pm-prominent-btn pm-btn-academy" id="pm-btn-academy"
          onclick="setPlayModeViaButton('academy')">🎓 Academy</button>
      </div>
      <div class="pm-prominent-lock-note" id="pm-prominent-lock-note" style="display:none;"></div>
    </div>

    <!-- v5.0 (Module A) — Academy visual identity + Practice Mode marker.
         Shown only while playMode === 'academy' (js/15-academy.js toggles
         display + body.academy-mode). Presentation only. -->
    <div class="academy-identity" id="academy-identity" style="display:none;">
      <div class="academy-identity-title">TrigammonX Academy</div>
      <div class="academy-identity-sub">Position Lab &bull; Practice &bull; Learn</div>
      <!-- v5.0.3 (Part 5) — non-interactive status badge (was a pill that
           looked selectable). aria-disabled + no tabindex; CSS gives it a
           plain status-tag look, no hover/pointer affordance. -->
      <div class="academy-identity-badge academy-status-badge" aria-disabled="true">ACADEMY &bull; PRACTICE</div>
      <!-- v5.1 — always-available reopen for the first-visit welcome popout. -->
      <button type="button" class="academy-help-link" id="academy-help-link" onclick="academyOpenWelcome()">What can I do here?</button>
    </div>

    <!-- v5.0 (Modules C/D/E) — Position Lab v1. Shown while Academy Position
         Setup is active. All controls call into js/15-academy.js; nothing
         here routes through normal move legality or executeMove(). -->
    <div class="academy-lab" id="academy-lab" style="display:none;">
      <div class="academy-lab-title">POSITION SETUP</div>
      <!-- v5.1.1 (handoff §3): ONE click/tap interaction model on every
           device — drag removed. js/15-academy.js sets the exact hint
           text; #academy-lab-hint-desktop now carries the stack/group-
           selection tip (handoff §4) on every device, not a desktop-only
           drag note. -->
      <div class="academy-lab-hint" id="academy-lab-hint">Tap or click a checker to select it, then tap or click where you want to place it. Arrange any colour, choose who moves next, then select Play From Position.</div>
      <div class="academy-lab-hint academy-lab-hint-desktop" id="academy-lab-hint-desktop">Tip: tap or click lower in a stack to pick up that checker and everything above it.</div>
      <div class="academy-pickup-note" id="academy-pickup-note" aria-live="polite"></div>

      <div class="academy-valid-status invalid" id="academy-valid-status">Checking position…</div>

      <div class="academy-lab-row">
        <span class="academy-lab-label">Next Player:</span>
        <span class="academy-next-row" id="academy-next-row">
          <button type="button" class="acq-next-btn acq-blue"  data-acq-next="blue"  onclick="academySetNextPlayer('blue')">Blue</button>
          <button type="button" class="acq-next-btn acq-red"   data-acq-next="red"   onclick="academySetNextPlayer('red')">Red</button>
          <button type="button" class="acq-next-btn acq-green" data-acq-next="green" onclick="academySetNextPlayer('green')">Green</button>
        </span>
      </div>
      <div class="academy-lab-note" id="academy-dice-note"></div>

      <div class="academy-lab-row academy-lab-btns">
        <button type="button" class="academy-lab-btn" onclick="academyResetToStandard()">Reset to Standard Start</button>
        <button type="button" class="academy-lab-btn" id="academy-undo-btn" onclick="academyUndoSetup()">Undo Last Setup Move</button>
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" id="academy-play-btn" onclick="academyPlayFromPosition()" disabled>▶ Play From Position</button>
      </div>
      <!-- v5.1 — Saved Positions: save the current setup / open the local library. -->
      <div class="academy-lab-row academy-lab-btns">
        <button type="button" class="academy-lab-btn" id="academy-save-pos-btn" onclick="academyOpenSaveModal()">💾 Save Position</button>
        <button type="button" class="academy-lab-btn" id="academy-library-btn" onclick="academyOpenLibrary()">📚 Saved Positions</button>
      </div>
    </div>

    <!-- v5.0.2 (Module D) — shown ONLY while an Academy practice game is in
         progress. "Edit Position" halts the practice game (AI, animations,
         commentary), copies the current board / Bar / Borne Off into the
         editor, drops any half-finished dice turn, and re-opens Position
         Setup. js/15-academy.js toggles this bar's visibility. -->
    <div class="academy-practice-bar" id="academy-practice-bar" style="display:none;">
      <span class="academy-practice-bar-label">Academy Practice in progress</span>
      <!-- v5.1.1 — Hint: read-only AI-planner suggestion for the CURRENT
           Human decision point. Never mutates the live board. -->
      <button type="button" class="academy-lab-btn" id="academy-hint-btn" onclick="academyRequestHint()" title="Ask the AI planner what it would play — advisory only">💡 Hint</button>
      <!-- v5.1.1 — Retry Last Turn: same dice, back to the start of the
           MOST RECENTLY COMPLETED turn (distinct from Try Again, which
           goes all the way back to where this practice attempt began). -->
      <button type="button" class="academy-lab-btn academy-try-again-btn" id="academy-try-again-retry-btn" onclick="academyRetryLastTurn()" title="Replay your last completed turn with the same dice" disabled>↻ Retry Last Turn</button>
      <!-- v5.1 — Try Again: back to the exact position THIS attempt started
           from (distinct from Edit Position, which keeps the CURRENT board). -->
      <button type="button" class="academy-lab-btn academy-try-again-btn" id="academy-try-again-btn" onclick="academyTryAgain()" title="Restore the position this practice attempt started from">↻ Try Again</button>
      <button type="button" class="academy-lab-btn academy-lab-btn-primary" id="academy-edit-pos-btn" onclick="academyEditPosition()" title="Turn the CURRENT board back into an editable setup">✎ Edit Position</button>
    </div>

    <!-- v5.0 (Module F) — Academy practice completion. NOT a normal Winner
         Certificate / archive path. -->
    <div class="academy-complete" id="academy-complete" style="display:none;">
      <div class="academy-complete-kicker">ACADEMY PRACTICE COMPLETE</div>
      <div class="academy-complete-head acq-blue" id="academy-complete-head">WINNER</div>
      <div class="academy-complete-note">Practice result — not recorded to any win/loss, history, archive or Tournament record.</div>
      <div class="academy-complete-btns">
        <button type="button" class="academy-lab-btn" onclick="academyCompleteAction('stay')">Stay on Board</button>
        <button type="button" class="academy-lab-btn academy-try-again-btn" id="academy-complete-retry-btn" onclick="academyRetryLastTurn()" title="Replay that last turn with the same dice" disabled>↻ Retry Last Turn</button>
        <button type="button" class="academy-lab-btn academy-try-again-btn" onclick="academyTryAgain()">↻ Try Again</button>
        <button type="button" class="academy-lab-btn" onclick="academyCompleteAction('edit')">Edit Position</button>
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" onclick="academyCompleteAction('newsetup')">New Academy Setup</button>
      </div>
    </div>

    <!-- Player Types (v149) + Player Names (v246, display only) -->
    <div class="panel-section-title">Player Types</div>
    <div class="player-types-section">
      <div class="player-type-row">
        <span class="player-type-label blue">Blue</span>
        <select class="player-type-select" id="pt-blue" onchange="onPlayerTypeChange('blue', this.value)">
          <option value="human" selected>Human</option>
          <option value="cpu-ai">Computer (Plus)</option>
        </select>
        <input type="text" class="player-name-input" id="pn-blue" placeholder="Name (optional, Plus)" maxlength="24"
          oninput="onPlayerNameChange('blue', this.value)">
      </div>
      <div class="player-type-row">
        <span class="player-type-label green">Green</span>
        <select class="player-type-select" id="pt-green" onchange="onPlayerTypeChange('green', this.value)">
          <option value="human" selected>Human</option>
          <option value="cpu-ai">Computer (Plus)</option>
        </select>
        <input type="text" class="player-name-input" id="pn-green" placeholder="Name (optional, Plus)" maxlength="24"
          oninput="onPlayerNameChange('green', this.value)">
      </div>
      <div class="player-type-row">
        <span class="player-type-label red">Red</span>
        <select class="player-type-select" id="pt-red" onchange="onPlayerTypeChange('red', this.value)">
          <option value="human" selected>Human</option>
          <option value="cpu-ai">Computer (Plus)</option>
        </select>
        <input type="text" class="player-name-input" id="pn-red" placeholder="Name (optional, Plus)" maxlength="24"
          oninput="onPlayerNameChange('red', this.value)">
      </div>
      <div class="player-types-status" id="player-types-status">
        Blue: Human | Green: Human | Red: Human
      </div>
    </div>

    <!-- v5.0.3 (Parts 3/6/13) — Players / Seats. Per-seat identity: Human
         (with a local profile) or AI (with a selectable strength — Easy /
         Normal / Pro). Editable before AND during play; a live change
         takes effect at that seat's next clean turn. All rendered/wired by
         js/16-players.js. Reset All returns every seat to Guest / Human
         but never deletes profiles or any statistics. -->
    <div class="px-seats-panel" id="px-seats-panel">
      <div class="panel-section-title">Players / Seats</div>
      <div class="px-seats-body" id="px-seats-body"><!-- rendered by js/16-players.js --></div>
    </div>

    <!-- v5.0.3 (Part 4) — Academy pre-play seat confirmation. Shown by
         js/16-players.js when Play From Position is pressed; "Start
         Practice" proceeds, "Back to Position" returns to the Lab. -->
    <div class="px-academy-confirm" id="px-academy-confirm" style="display:none;">
      <div class="px-academy-confirm-kicker">READY TO PLAY</div>
      <div class="px-academy-confirm-body" id="px-academy-confirm-body"><!-- rendered --></div>
      <div class="px-academy-confirm-btns">
        <button type="button" class="academy-lab-btn" onclick="pxAcademyConfirmAction('back')">Back to Position</button>
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" onclick="pxAcademyConfirmAction('start')">Start Practice</button>
      </div>
    </div>

    <!-- AI play note (v157) -->
    <div id="ai-play-note" class="ai-play-note">Ready.</div>

    <!-- Dice Mode -->
    <div class="dice-mode-bar">
      <label for="dice-mode-select" style="color:#a29bfe;font-weight:bold;white-space:nowrap;">Dice Mode:</label>
      <select id="dice-mode-select" onchange="onDiceModeChange(this.value)"
        style="background:#16213e;border:1px solid #a29bfe;color:#ffd700;border-radius:5px;padding:4px 8px;font-size:12px;font-family:inherit;cursor:pointer;">
        <option value="official2">Official 2 Dice</option>
        <option value="triple3" selected>Triple Dice Variant — 3 Dice</option>
      </select>
      <span class="dice-mode-badge triple" id="dice-mode-badge">Triple Dice Variant</span>
    </div>

    <!-- v300: Play Mode — Regular Play (default) vs Tournament Mode.
         v3.7.2 Task 5: the prominent PLAY MODE buttons above are now the
         primary control; this original bar (and its real <select>, which
         every existing onPlayModeChange()/updateUndoStatus()/save-load
         code path still reads/writes) is kept fully functional but
         visually hidden so nothing had to be re-wired. Toggling still
         shows/hides the Tournament/Match panel right below it and gates
         Take Back (Task 4) via onPlayModeChange(). Never touches move
         legality/dice/board state. -->
    <div class="dice-mode-bar" id="play-mode-bar" style="display:none;">
      <label for="play-mode-select" style="color:#a29bfe;font-weight:bold;white-space:nowrap;">Play Mode:</label>
      <select id="play-mode-select" onchange="onPlayModeChange(this.value)"
        style="background:#16213e;border:1px solid #a29bfe;color:#ffd700;border-radius:5px;padding:4px 8px;font-size:12px;font-family:inherit;cursor:pointer;">
        <option value="regular" selected>Regular Play</option>
        <option value="tournament">Tournament Mode</option>
        <option value="academy">Academy</option>
      </select>
      <span class="dice-mode-badge" id="play-mode-badge">Regular Play</span>
    </div>

    <!-- v300: Tournament/Match panel — hidden unless Play Mode is
         Tournament Mode (renderTournamentPanel() toggles display:none).
         Shows match target, per-colour scores, game number, match-complete
         state, a match-length selector, New Match, and non-functional
         Doubling Cube / Tournament Clock roadmap placeholders (Task 5/6 —
         no click action, no state, no scoring effect from either card).
         Deliberately named .txm-* (not .clock-*) — this page already has
         an unrelated, real Game/Turn/Real Time clock feature using
         .clock-card/.clock-title, so this avoids any naming collision. -->
    <div class="txm-panel" id="txm-panel" style="display:none;">
      <div class="txm-title">🏆 Tournament Match</div>
      <div class="txm-row">
        <label for="txm-length-select" class="txm-length-label">Match to:</label>
        <select id="txm-length-select" onchange="onMatchLengthChange(this.value)">
          <option value="3">3</option>
          <option value="5" selected>5</option>
          <option value="7">7</option>
          <option value="9">9</option>
          <option value="11">11</option>
        </select>
      </div>
      <div class="txm-scores" id="txm-scores"></div>
      <div class="txm-meta-row">
        <span class="txm-game-num" id="txm-game-num">Game 1</span>
        <span class="txm-status" id="txm-status">Match to 5</span>
      </div>
      <button type="button" class="txm-new-match-btn" id="txm-new-match-btn" onclick="confirmStartNewMatch()">🏆 New Match</button>
      <div class="txm-placeholder-row">
        <!-- v300 correction: a small STATIC doubling-cube visual, purely
             presentational. This is a brand-new element (.txm-cube-face) —
             deliberately NOT the existing Developer/Admin visual-test cube
             (#dc-tray/#dc-token/.dc-* markup, cubeValue/cubeOwner/
             cubeOfferedBy state, toggleDoublingCube()/offerDouble()/
             takeDouble()/passDouble()/cycleCubePreview()). No onclick, no
             id, no state, no scoring logic, no wiring to that code at all
             — the "2" is a hardcoded static label, not bound to any cube
             value. -->
        <div class="txm-placeholder-card" title="Not yet functional — no cube value, no doubling logic, no scoring effect.">
          <div class="txm-cube-face" aria-hidden="true">2</div>
          <div class="txm-placeholder-name">Doubling Cube</div>
          <div class="txm-placeholder-soon">Coming Soon</div>
        </div>
      </div>

      <!-- v3.1.0: real Tournament Clock (Task 1) — replaces the former
           "Tournament Clock — Coming Soon" placeholder card above. Full
           logic lives in js/06-stats-history.js: renderTournamentClockCards()/
           renderTournamentClockStats()/updateTournamentClockOverlay() paint
           this card, tcTick() (called every 500ms from the pre-existing
           updateClocks() interval, never a second timer) keeps it live, and
           onTournamentClockModeChange()/onTournamentClockReserveChange()/
           onTournamentClockDelayChange()/pauseTournamentMatch()/
           resumeTournamentMatch()/toggleTournamentClockStats() are the
           handlers wired below. This card self-hides (display:none) via
           renderTournamentClockCards() whenever Play Mode is not Tournament
           Mode or the Clock preset is Off — it is never visible/competitive
           in Regular Play (Task 11). The static Doubling Cube placeholder
           card just above is untouched and remains non-functional. -->
      <div class="txm-clock-card" id="txm-clock-card">
        <div class="txm-clock-header">
          <span class="txm-clock-title">⏱ Tournament Clock</span>
          <span class="txm-clock-preset-label" id="txm-clock-preset-label">2 min/pt + 12 sec delay</span>
        </div>

        <div class="txm-clock-settings-row">
          <label for="txm-clock-mode-select" class="txm-clock-settings-label">Clock:</label>
          <select id="txm-clock-mode-select" onchange="onTournamentClockModeChange(this.value)">
            <option value="standard" selected>Tournament Standard</option>
            <option value="off">Off</option>
            <option value="custom">Custom</option>
          </select>
        </div>
        <div class="txm-clock-settings-row" id="txm-clock-custom-row" style="display:none;">
          <label for="txm-clock-reserve-select" class="txm-clock-settings-label">Reserve:</label>
          <select id="txm-clock-reserve-select" onchange="onTournamentClockReserveChange(this.value)">
            <option value="1.5">1.5 min/pt</option>
            <option value="2" selected>2.0 min/pt</option>
            <option value="2.5">2.5 min/pt</option>
            <option value="3">3.0 min/pt</option>
          </select>
          <label for="txm-clock-delay-select" class="txm-clock-settings-label">Delay:</label>
          <select id="txm-clock-delay-select" onchange="onTournamentClockDelayChange(this.value)">
            <option value="10">10 sec</option>
            <option value="12" selected>12 sec</option>
            <option value="15">15 sec</option>
            <option value="18">18 sec</option>
          </select>
        </div>

        <div class="txm-clock-status-banner" id="txm-clock-status-banner" style="display:none;"></div>

        <!-- v3.7.8 Goal 4 — ALL-AI Tournament playback speed. Shown only in
             Tournament Mode; the buttons are active only when all three
             seats are Computer, and locked to 1x (with a note) the moment
             any seat is Human. This is a playback/clock speed, NOT an
             AI-skill setting — see tgxTournamentSpeed() in 06-stats-history.js.
             renderTournamentClockCards() manages visibility / disabled
             state / the active highlight. -->
        <div class="txm-clock-speed-row" id="txm-clock-speed-row" style="display:none;">
          <span class="txm-clock-settings-label">Tournament Speed:</span>
          <div class="txm-clock-speed-btns" id="txm-clock-speed-btns" role="group" aria-label="All-AI Tournament playback speed">
            <button type="button" class="txm-speed-btn" data-speed="1"  onclick="onTournamentSpeedChange(1)">1×</button>
            <button type="button" class="txm-speed-btn" data-speed="2"  onclick="onTournamentSpeedChange(2)">2×</button>
            <button type="button" class="txm-speed-btn" data-speed="5"  onclick="onTournamentSpeedChange(5)">5×</button>
            <button type="button" class="txm-speed-btn" data-speed="10" onclick="onTournamentSpeedChange(10)">10×</button>
          </div>
          <span class="txm-clock-speed-note" id="txm-clock-speed-note"></span>
        </div>

        <!-- v3.7.10 Task 2 / v3.9 refinement — spectator option, shown for
             EVERY Tournament game (Human or all-AI). A mirror of the same
             control lives in Play Options / Analysis so it is reachable in
             Regular Play too; both are synced by
             _tgxSyncScrollAutoPauseControls() (10-clocks-themes-ui.js) and
             call the same tgxSetScrollAutoPause(). Gates ONLY the 'scroll'
             pause reason — manual Pause and genuine device-interruption /
             visibility / pagehide protection are unaffected. -->
        <div class="txm-clock-speed-row" id="txm-clock-scrollpause-row" style="display:none;">
          <label class="txm-clock-scrollpause-label">
            <input type="checkbox" id="txm-clock-scrollpause-cb" onchange="tgxSetScrollAutoPause(this.checked)">
            Pause game when board is off-screen
          </label>
          <span class="txm-clock-speed-note" id="txm-clock-scrollpause-note"></span>
        </div>

        <div class="txm-clock-rows" id="txm-clock-rows"></div>

        <!-- v3.7.2 (Task 11/Task 12 — Unified Tournament Pause/Resume + Clean
             Paused UI): the standalone "Pause Match" button is gone — it used
             to pause ONLY the Tournament Clock via a separate code path
             (pauseTournamentMatch()) that never touched gamePaused/AI
             scheduling, which is the confirmed real-device bug where AI
             gameplay never resumed after Resume. Pausing is now available
             exclusively through the single Game Flow button (#btn-begin-play,
             playGame()/pauseGame()), which pauses the Tournament Clock
             internally too — see pauseGame() in 05-gameplay-interaction.js.
             The one remaining control here is a large, touch-friendly Resume
             shortcut shown only while paused, right next to the MATCH PAUSED
             banner — it now routes through resumeTournamentClockOrGame()
             (06-stats-history.js), which resumes gameplay+AI+clock together
             via playGame() whenever gamePaused is the active state, and
             falls back to resuming just the clock for the one narrower,
             pre-existing exception (Save Game As... settling the clock
             without pausing gameplay) — see that function's own comment. -->
        <div class="txm-clock-controls" id="txm-clock-controls">
          <button type="button" class="txm-clock-btn txm-clock-btn-resume" id="txm-clock-resume-btn" onclick="resumeTournamentClockOrGame()" style="display:none;">▶ RESUME PLAY</button>
          <span class="txm-clock-speed-note" id="txm-clock-resume-note" style="display:none;"></span>
        </div>

        <div class="txm-clock-stats-toggle" id="txm-clock-stats-toggle" onclick="toggleTournamentClockStats()">
          <span id="txm-clock-stats-caret">▾</span> Clock Statistics
        </div>
        <div class="txm-clock-stats" id="txm-clock-stats" style="display:none;"></div>

        <!-- v3.2.1: light Match Statistics foundation (games won, hits,
             bar entries, dice, reserve used, avg turn — see matchStats/
             accumulateMatchStatsForCompletedGame()/renderMatchStatsPanel()
             in js/06-stats-history.js). Same collapsible pattern as Clock
             Statistics immediately above, reusing its .txm-clock-stat-*
             CSS — no new CSS needed. Tournament Mode only, same visibility
             as the rest of this card. -->
        <div class="txm-clock-stats-toggle" id="txm-match-stats-toggle" onclick="toggleMatchStats()">
          <span id="txm-match-stats-caret">▾</span> Match Statistics
        </div>
        <div class="txm-clock-stats" id="txm-match-stats" style="display:none;"></div>
      </div>
    </div>

    <!-- v222d: Take Back option. v240 Fix 1: Take Back is now automatic for
         human play (enabled right after any human checker move, no opt-in
         required), so this checkbox is no longer part of normal player-facing
         controls. Left in the DOM (hidden) rather than deleted so the
         underlying allowResetLastMove/resetLastMoveOptionLocked state, its
         functions, and old save files all keep working unchanged. -->
    <div class="dice-mode-bar" style="align-items:flex-start;flex-direction:column;gap:4px;display:none;">
      <label style="color:#fdcb6e;font-weight:bold;font-size:12px;display:flex;gap:6px;align-items:center;">
        <input type="checkbox" id="allow-reset-last-move-checkbox" onchange="onAllowResetLastMoveToggle(this)">
        Allow Reset Last Move
      </label>
      <div id="allow-reset-last-move-status" class="small-status">Off by default. Enables Take Back for this game.</div>
    </div>

    <!-- v222b: Reset belongs in the right column, not the player action row. -->
    <!-- v300 correction: the VISIBLE label is now "New Game" (Bill's
         preferred player-facing pairing is New Game / Reset All) — the
         onclick target/internal function name confirmResetGame() is
         unchanged, and its underlying behaviour (restart current game/
         pieces only) is unchanged; only the button text and confirm()
         copy changed. -->
    <div class="panel-section-title">Game Controls</div>
    <button onclick="confirmResetGame()" style="border-color:#ff7675;color:#ff7675;width:100%;margin-bottom:8px;">↺ New Game</button>
    <!-- v300: Reset All — new full return-to-defaults action (Task 7).
         Distinct from New Game above: New Game only restarts the
         current game/pieces; Reset All also returns Play Mode, Dice Mode,
         Player Type, UI Sound, Voice Speed, Full UI Theme, Board Design
         and the Tournament match state to their defaults. Never deletes
         named saves. -->
    <button onclick="confirmResetAll()" style="border-color:#ff7675;color:#ff7675;width:100%;">⟲ Reset All (Return to Defaults)</button>

    <!-- v5.0.3 (Part 12B) — DESTRUCTIVE data actions. Kept visually
         distinct from the ordinary Reset controls above. Each opens a
         multi-step, type-to-confirm dialog (js/16-players.js). Neither is
         reachable from Reset All. Reset All never deletes profiles,
         career stats, AI stats, the archive, achievements or Academy
         progress. -->
    <!-- v5.0.5 (Issue 3): the destructive-data "Danger Zone" moved OUT of
         this Game Controls sidebar to a quiet, collapsed-by-default
         "Advanced / Data Management" card at the very bottom of the Plus
         section (#pro-card-advanced). Same buttons, same multi-step
         type-to-confirm modal, same deletion scope — only lower and less
         prominent. -->
  </aside>

  <!-- v5.0.3 (Part 12B) — multi-step destructive-data confirmation modal.
       Step 2 states exact scope deleted AND preserved; Step 3 requires
       typing an exact phrase (profile name / "DELETE ARCHIVE"); Step 4 is
       the final action. Never auto-focuses or pre-fills; Enter alone
       cannot trigger deletion unless validation passes. -->
  <div class="px-dx-modal" id="px-dx-modal" style="display:none;">
    <div class="px-dx-card" role="dialog" aria-modal="true" aria-labelledby="px-dx-title">
      <div class="px-dx-title" id="px-dx-title">Permanently clear career statistics?</div>

      <!-- STAGE 1 (v5.0.8): permanent-loss warning. No input on this stage,
           so a stray click / Enter cannot delete anything. -->
      <div id="px-dx-stage-warn">
        <div class="px-dx-body" id="px-dx-body"></div>
        <div class="px-dx-btns">
          <button type="button" class="academy-lab-btn" id="px-dx-cancel">Cancel</button>
          <button type="button" class="px-danger-btn" id="px-dx-continue">Continue</button>
        </div>
      </div>

      <!-- STAGE 2 (v5.0.8): shown only after Continue. Type the exact phrase;
           the final button stays disabled until it matches exactly. -->
      <div id="px-dx-stage-type" style="display:none;">
        <label class="px-dx-typelabel" id="px-dx-typelabel" for="px-dx-input">To confirm, type the phrase</label>
        <input type="text" id="px-dx-input" class="player-name-input" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false">
        <div class="px-dx-btns">
          <button type="button" class="academy-lab-btn" id="px-dx-cancel-2">Cancel</button>
          <button type="button" class="px-danger-btn px-danger-btn-final" id="px-dx-final" disabled>Permanently Clear Statistics</button>
        </div>
      </div>
    </div>
  </div>

  <!-- v5.0.6 (public §2) — Official 2 Dice informational notice. Shown at
       most once per browser session, only when the player DELIBERATELY
       switches the Dice Mode selector to Official 2 Dice (see
       onDiceModeChange() / _maybeShowOfficial2DiceNotice(),
       js/05-gameplay-interaction.js). Informational, not a warning. -->
  <div class="o2-dice-notice" id="o2-dice-notice" style="display:none;">
    <div class="o2-dice-notice-card" role="dialog" aria-modal="true" aria-labelledby="o2-dice-notice-kicker">
      <div class="o2-dice-notice-kicker" id="o2-dice-notice-kicker">OFFICIAL 2 DICE SELECTED</div>
      <div class="o2-dice-notice-body">
        <p>Two-dice games generally require more strategy and can take considerably longer to complete.</p>
        <p>Remember, you can save your game at any time and continue later.</p>
      </div>
      <div class="o2-dice-notice-btns">
        <button type="button" class="o2-dice-notice-btn" onclick="o2DiceNoticeAction('switch')">Switch to Triple Dice</button>
        <button type="button" class="o2-dice-notice-btn primary" onclick="o2DiceNoticeAction('continue')">Continue with 2 Dice</button>
      </div>
    </div>
  </div>

  <!-- ══ v5.1.1 — TrigammonX Academy: Welcome popout ═════════════════════
       Shows on every fresh Academy visit (handoff §1: NO permanent
       dismissal — the owner does not want an accidental "never show
       again"). Always reopenable via the "What can I do here?" link.
       Position Lab / Practice wording — never called a "lesson", no
       claim of formal lessons/courses/certification. (js/15-academy.js) -->
  <div class="academy-modal" id="academy-welcome-modal">
    <div class="academy-modal-card academy-welcome-card" role="dialog" aria-modal="true" aria-labelledby="academy-welcome-title">
      <div class="academy-modal-kicker">Welcome to TrigammonX Academy</div>
      <div class="academy-modal-title" id="academy-welcome-title">Position Lab &bull; Practice &bull; Learn</div>
      <div class="academy-welcome-lead">Challenge yourself. Experiment. Make mistakes. Try again.</div>
      <div class="academy-welcome-note">Academy lets you create positions you may never encounter in an ordinary game — then put your ideas, tactics and strategy to the test.</div>
      <ul class="academy-welcome-list">
        <li><b>Test your end-game skills.</b> Set up a tight race, a difficult bear-off, or a position where one wrong move could cost you the game.</li>
        <li><b>Put yourself in trouble — then find your way out.</b> Start on the Bar, leave yourself exposed, or build a position where you're fighting from behind.</li>
        <li><b>Give your brain a workout with Official 2 Dice.</b> Play the longer game and see how much more planning, patience and strategy it can demand.</li>
        <li><b>Experiment with Triple Dice.</b> See how the extra die changes your options, tempo and tactical possibilities.</li>
        <li><b>Explore the advantage of strategy.</b> Replay a turn with the same dice, try a different move, and see how the position changes.</li>
        <li><b>Choose your opposition.</b> Put Human, AI Easy, AI Normal or AI Pro in any seat.</li>
        <li><b>Create your own challenges.</b> Tap or click checkers into any valid position, choose who moves next, and play from there.</li>
        <li><b>Save your favourite positions.</b> Build a personal library of situations you want to practise again.</li>
        <li><b>Try it another way.</b> Use Try Again, Retry Last Turn and Edit Position to experiment without penalty.</li>
      </ul>
      <div class="academy-welcome-note">There's no penalty for experimenting. Academy practice does not affect your normal Career Stats.</div>
      <div class="academy-welcome-foot">More Academy features and challenges are being added throughout Beta.</div>
      <div class="academy-modal-btns">
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" onclick="academyWelcomeAction('start')">Start Academy</button>
      </div>
    </div>
  </div>

  <!-- ══ v5.1 — Save / Rename Academy position ══════════════════════════ -->
  <div class="academy-modal" id="academy-save-modal">
    <div class="academy-modal-card" role="dialog" aria-modal="true" aria-labelledby="academy-save-title">
      <div class="academy-modal-kicker" id="academy-save-title">Save Academy Position</div>
      <div class="academy-modal-sub">Stored locally on this device only.</div>
      <label class="academy-field-label" for="academy-save-name">Position Name</label>
      <input type="text" id="academy-save-name" maxlength="60" autocomplete="off" autocapitalize="off" spellcheck="false" placeholder="e.g. Back-game vs blockade">
      <label class="academy-field-label" for="academy-save-notes">Notes (optional)</label>
      <textarea id="academy-save-notes" maxlength="300" placeholder="What are you practising here?"></textarea>
      <div class="academy-modal-dup" id="academy-save-dup">A saved position with this name already exists.</div>
      <div class="academy-modal-btns">
        <button type="button" class="academy-lab-btn" onclick="academySaveModalCancel()">Cancel</button>
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" id="academy-save-confirm" onclick="academySaveModalConfirm(false)">Save Position</button>
      </div>
    </div>
  </div>

  <!-- ══ v5.1 — Saved Positions library ════════════════════════════════ -->
  <div class="academy-modal" id="academy-lib-modal">
    <div class="academy-modal-card" role="dialog" aria-modal="true" aria-labelledby="academy-lib-title">
      <div class="academy-modal-kicker" id="academy-lib-title">Saved Positions</div>
      <div class="academy-modal-sub">Local Academy library — Load a position back into setup, then choose Play From Position.</div>
      <div id="academy-lib-body"><!-- rendered by js/15-academy.js --></div>
      <div class="academy-modal-btns">
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" onclick="academyLibraryClose()">Close</button>
      </div>
    </div>
  </div>

  <!-- ══ v5.1.1 — Academy Hint / Suggested Play ══════════════════════════
       Read-only training aid (handoff §6/§7) — never labelled "Best
       Move". Board-side numbered markers are rendered by js/15-academy.js
       (_acqRenderHintStepMarker() etc.) directly onto #board-wrap / the
       Bar-Borne-Off trays; this card only carries the text side plus
       Previous/Next/Show Full Suggestion/Close. -->
  <div class="academy-modal" id="academy-hint-modal">
    <div class="academy-modal-card academy-hint-card" role="dialog" aria-modal="true" aria-labelledby="academy-hint-kicker">
      <div class="academy-modal-kicker" id="academy-hint-kicker">💡 Hint</div>
      <div class="academy-modal-sub" id="academy-hint-dice"></div>
      <div id="academy-hint-body"><!-- rendered by js/15-academy.js --></div>
      <div class="academy-hint-nav">
        <button type="button" class="academy-lab-btn" id="academy-hint-prev" onclick="academyHintPrev()">◀ Previous Move</button>
        <button type="button" class="academy-lab-btn" id="academy-hint-next" onclick="academyHintNext()">Next Move ▶</button>
      </div>
      <div class="academy-modal-btns">
        <button type="button" class="academy-lab-btn" id="academy-hint-full" onclick="academyHintToggleFull()">Show Full Suggestion</button>
        <button type="button" class="academy-lab-btn academy-lab-btn-primary" onclick="academyHintClose()">Close</button>
      </div>
      <div class="academy-hint-disclaimer">A training aid, not a claim of perfect play.</div>
    </div>
  </div>

</div>

<!-- ══ PIP RACE STRIP — Free tier. Horizontal strip beneath the board +
     Game Setup card. Same #pip-display id and untouched
     renderPipDisplay()/calculatePipsForPlayer() as before — only the
     CSS box layout of the existing .pip-row children changes, from
     stacked-in-a-sidebar to side-by-side in this strip. ══ -->
<div class="pip-race-strip-shell">
  <div class="panel-section-title">Pip Race — lower wins</div>
  <div id="pip-display" class="pip-display pip-race-strip-inner"></div>
</div>

<!-- ══════════════════════════════════════════════════════════════════
     SECTION 2 — TRIGAMMONX PRO
     Full-width section directly beneath Play. Game Stats, Game Report,
     AI Speed, Commentary, Voice, Table Talk and Game Trends all moved
     here verbatim from the old right sidebar / game-trends-shell — same
     ids, same functions, only their position in the page changed. The
     Pro Themes card (presentation-only CSS variable swap — see
     applyUiTheme(), v257) is the unified Full UI Theme selector. Hidden
     entirely from the Free tier (body.tier-free #tx-section-pro{display:
     none}); Free instead shows the single .pro-teaser block below.
     ══════════════════════════════════════════════════════════════════ -->
<section class="tx-section-pro-shell" id="tx-section-pro">
  <div class="tx-section-header">
    <!-- v3.5.2 Part B: a small, restrained gold "X" accent above the
         existing PRO title — a light branded echo of the new main-header
         wordmark (Part A) without repeating the full wordmark here (per
         spec: "Do NOT repeat the full large TrigammonX wordmark
         everywhere"). Reuses the EXISTING v3.5.1 certificate-logo asset
         (the approved standalone hexagon "X" badge) rather than inventing
         a new external asset path, exactly as the spec allows. onerror
         simply hides the icon — the "TRIGAMMONX PRO" text title below is
         completely unaffected either way, so there is no broken-image
         risk and nothing to fall back to beyond the title that was
         already there. -->
    <img class="tx-section-header-icon" src="trigammonx-v5.1.5/img/trigammonx-logo.png" alt="" aria-hidden="true" onerror="this.style.display='none';">
    <div class="tx-section-header-title">TrigammonX Plus</div>
    <!-- v2.2.7: copy/presentation only — communicates Pro is fully unlocked
         during the Beta. No entitlement/payment logic; PRODUCT_TIER and the
         existing Free/Pro gating are completely untouched (see PRODUCT_TIER
         near the top of this file). Deliberately smaller/lighter than the
         title so PRO branding stays the strongest element. -->
    <div class="tx-section-header-badge">Plus &mdash; Free During Beta</div>
    <div class="tx-section-header-subtitle">Insights • Commentary • Game Analysis</div>
    <div class="tx-section-header-rule"></div>
  </div>

  <!-- v5.0.5 (Issue 5): one-tap Expand All / Collapse All for the normal
       information/analysis sections below. Compact + secondary — never a
       primary action. Danger Zone (#pro-card-advanced) is deliberately
       NOT in scope. js/06-stats-history.js: txToggleExpandAll(). -->
  <div class="tx-expand-all-row">
    <button type="button" id="tx-expand-all-btn" class="tx-expand-all-btn"
      onclick="txToggleExpandAll()" aria-label="Collapse all information sections">⊖ Collapse All</button>
  </div>

  <div class="pro-card-grid">

    <!-- v5.0.6 (public §1): the Game Trends card moved OUT of this grid to
         a WIDE visual area inside the board column, directly ABOVE Table
         Talk (see #pro-card-trends just before .under-board-commentary in
         <main class="board-panel">). Same id / markup / rendering — only
         its DOM position and width changed. -->

    <!-- GAME INSIGHTS — Live Game Stats, Game Report, compact Game/Turn clocks -->
    <!-- v3.7.2 Task 4: collapsible secondary/statistics section — see
         toggleTxCollapsible()/TX_COLLAPSIBLE_SECTIONS (06-stats-history.js)
         and .tx-collapsible/.tx-collapsed (css/01-base-layout.css). -->
    <div class="pro-card tx-collapsible" id="pro-card-insights">
      <div class="panel-title" id="pro-card-insights-title" onclick="toggleTxCollapsible('insights')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('insights');}">▼ Game Insights</div>

      <!-- v253: Game Time / Turn Time — moved here, compact, from the old
           above-the-board clock row. Same #clock-game/#clock-turn ids and
           updateClocks() logic, unchanged; only this markup shrank. Real
           Time is not important to normal gameplay and now lives in
           Developer/Admin instead (see #tx-section-admin). -->
      <div class="clock-panel-compact">
        <div class="clock-card">
          <div class="clock-title">Game Time</div>
          <div class="clock-face">
            <div class="clock-ring"></div>
            <div id="clock-game" class="clock-main">00:00:00</div>
            <div class="clock-sub">Total</div>
          </div>
        </div>
        <div class="clock-card">
          <div class="clock-title">Turn Time</div>
          <div class="clock-face">
            <div class="clock-ring"></div>
            <div id="clock-turn" class="clock-main">00:00</div>
            <div class="clock-sub">Current Player</div>
          </div>
        </div>
      </div>

      <!-- v258: Clock Style — presentation only, toggles the Digital vs
           Classic Dial CSS above via body.tx-clock-dial. Same
           #clock-game/#clock-turn ids and updateClocks() timing logic
           either way; never tied to a Full UI Theme, so it works
           identically under all 12 themes. Persisted separately from
           theme choice (trigammonx_clock_style). -->
      <div class="clock-style-row">
        <span class="clock-style-label">Clock Style:</span>
        <button type="button" class="clock-style-btn" id="clock-style-digital-btn" onclick="applyClockStyle('digital')">Digital</button>
        <button type="button" class="clock-style-btn" id="clock-style-dial-btn" onclick="applyClockStyle('dial')">Classic Dial</button>
      </div>

      <!-- Game Stats (v166) -->
      <div class="panel-section-title">Game Stats</div>
      <div id="stats-panel" class="stats-panel"></div>

      <!-- Game Report (v169) -->
      <div class="panel-section-title">Game Report</div>
      <div id="game-report-panel" class="game-report-panel">No completed game yet.</div>
      <button onclick="copyGameReport()" style="border-color:#636e72;color:#aaa;">Copy Report</button>
    </div>

    <!-- v5.0.5 (Issue 4): the Game Trends card that used to sit here is now
         the FIRST card in this grid (directly under Game Controls, open by
         default). Same ids/markup/rendering — only its position changed. -->

    <!-- v265: the Table Talk / Commentary card that used to sit here
         moved directly below Player Actions / Game Flow (see
         .under-board-commentary, under .under-board-actions) so
         commentary reads as part of normal play rather than a separate
         Pro panel. Same ids, same onchange handlers, same content —
         only its position and outer container class changed. -->

    <!-- PLAY OPTIONS / ANALYSIS -->
    <div class="pro-card tx-collapsible" id="pro-card-playoptions">
      <div class="panel-title" id="pro-card-playoptions-title" onclick="toggleTxCollapsible('playoptions')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('playoptions');}">▼ Play Options / Analysis</div>
      <!-- v3.7.10 Task 1: AI Speed is a REGULAR PLAY control only. In
           Tournament Mode this whole row is hidden (syncAiSpeedControlForPlayMode(),
           11-simulation-admin.js) and Tournament Speed is the single
           presentation-pace control; the player's Regular AI Speed choice
           is remembered and restored on return to Regular Play. -->
      <div id="ai-speed-row">
        <div class="panel-section-title">AI Speed <span style="font-weight:normal;opacity:0.7;">(Regular Play)</span></div>
        <select id="ai-speed-select" onchange="onAiSpeedChange(this.value)" class="player-type-select">
          <option value="watch">Watch</option>
          <option value="normal" selected>Normal</option>
          <option value="fast">Fast</option>
          <option value="simulation">Simulation</option>
        </select>
      </div>
      <div id="ai-speed-tournament-note" style="display:none;font-size:11px;opacity:0.75;line-height:1.4;">
        In Tournament Mode, use <strong>Tournament Speed</strong> (on the Tournament Clock) to set the watching pace.
      </div>

      <!-- v3.9 refinement — user-controlled scroll auto-pause, available in
           EVERY play mode (Regular Play + Tournament, Human or AI seats). A
           mirror of the Tournament Clock spectator control; both call the
           same tgxSetScrollAutoPause() and are kept in sync by
           _tgxSyncScrollAutoPauseControls() (10-clocks-themes-ui.js). OFF
           gates ONLY the 'scroll' pause reason — device background /
           interruption / pagehide safety pauses and manual Pause are never
           affected. -->
      <div id="playopt-scrollpause-row" style="margin-top:10px;">
        <label class="txm-clock-scrollpause-label" style="display:flex;align-items:flex-start;gap:6px;font-size:12px;line-height:1.4;">
          <input type="checkbox" id="playopt-scrollpause-cb" onchange="tgxSetScrollAutoPause(this.checked)" style="margin-top:2px;">
          Pause game when board is off-screen
        </label>
        <div id="playopt-scrollpause-note" style="font-size:10px;color:var(--tx-text-faint);line-height:1.4;margin-top:4px;"></div>
      </div>
    </div>

    <!-- PRO THEMES (v257 — unified Full UI Theme system) — CSS-variable-
         only, presentation-only. Replaces the separate v253 Table Theme
         <select> and v256 Background preset grid with ONE theme choice
         that controls page background, panel background, recessed
         panel background, borders, primary/secondary/faint text, and
         primary/secondary accent together (see applyUiTheme() / the
         body.tx-full-* CSS overrides above, which only remap a subset
         of the existing --tx-* design-token variables — no new colour
         system). Never touches Blue/Red/Green checker/player-identity
         colours, board artwork, checker graphics, or dice results.
         Persisted via localStorage so the choice survives a reload. -->
    <div class="pro-card tx-collapsible" id="pro-card-theme">
      <div class="panel-title" id="pro-card-theme-title" onclick="toggleTxCollapsible('theme')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('theme');}">▼ Plus Themes</div>
      <div class="panel-section-title">Theme</div>
      <!-- v300 UI compaction pass: the 12-button .ui-theme-grid was replaced
           with one compact <select>, populated from UI_THEMES (the existing,
           unchanged source of truth) via _populateUiThemeSelect(); its value
           is kept in sync by _syncUiThemeButtons(). Selecting a new theme
           calls the existing, unchanged applyUiTheme() — same apply/
           persistence architecture as before, presentation-only change. -->
      <div class="txpro-select-row">
        <label for="ui-theme-select">Full UI Theme</label>
        <select id="ui-theme-select" onchange="applyUiTheme(this.value)"></select>
      </div>
      <div style="font-size:10px;color:var(--tx-text-faint);line-height:1.4;margin-top:6px;">
        Cosmetic only — never changes Blue/Red/Green player colours, the board, or checker graphics.
      </div>

      <!-- v2.1.9: Board Design — presentation-only, swaps ONLY #board-img.src
           between curated same-geometry board artwork options (see
           window.TRIGAMMONX_BOARD_DESIGNS / applyBoardDesign()). Never
           touches CLICK_POINTS, CHECKER_ANCHORS, board geometry, Rotate
           Board math, or game state; independent of the Full UI Theme
           above and persisted separately (trigammonx_board_design).
           v300 UI compaction pass: the 3-button .clock-style-row/
           .board-design-btn row was replaced with one compact <select>,
           populated from window.TRIGAMMONX_BOARD_DESIGNS via
           _populateBoardDesignSelect(); its value is kept in sync by
           _syncBoardDesignButtons(). Selecting a new board calls the
           existing, unchanged applyBoardDesign(). -->
      <div class="txpro-select-row txpro-board-design-row" style="margin-top:8px;">
        <div class="board-design-preview" id="board-design-preview" aria-hidden="true">
          <img id="board-design-preview-img" alt="" draggable="false" onerror="if (window.handleBoardPreviewImageError) handleBoardPreviewImageError(this);">
        </div>
        <div class="txpro-select-control">
          <label for="board-design-select">Board Design</label>
          <!-- v5.0 (Module B): in Academy this routes the pick to the separate
               Academy board preference; outside Academy it is applyBoardDesign() verbatim. -->
          <select id="board-design-select" onchange="(window.onBoardDesignSelectChange||applyBoardDesign)(this.value)"></select>
        </div>
      </div>
      <div style="font-size:10px;color:var(--tx-text-faint);line-height:1.4;margin-top:4px;">
        Changes only the board artwork — your current game position is never affected.
      </div>
    </div>

    <!-- v5.0.5 (Issue 3): ADVANCED / DATA MANAGEMENT — the destructive
         "Danger Zone", moved here from the Game Controls sidebar. Quiet,
         collapsed by default, LAST in the panel, and never opened by
         Expand All. The multi-step type-to-confirm dialog (#px-dx-modal,
         near the end of the page) and the exact deletion scope are
         unchanged from v5.0.3. Reset All remains separate and never
         deletes any of this. -->
    <div class="pro-card tx-collapsible tx-collapsed pro-card-advanced" id="pro-card-advanced">
      <div class="panel-title" id="pro-card-advanced-title" onclick="toggleTxCollapsible('advanced')" role="button" tabindex="0"
        onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleTxCollapsible('advanced');}">▶ Advanced / Data Management</div>
      <div class="pro-card-advanced-body">
        <div class="px-danger-note">
          <b>Danger Zone.</b> These permanently delete stored data and cannot be undone.
          Each needs a typed confirmation. <b>Reset All</b> does <b>not</b> touch any of this.
        </div>
        <button type="button" id="px-clear-career-btn" class="px-danger-btn">🗑 Clear Career Statistics…</button>
        <button type="button" id="px-delete-archive-btn" class="px-danger-btn">🗑 Delete Game / Certificate Archive…</button>
      </div>
    </div>

  </div>
</section>

<!-- v2.1.7: Did You Know? + Beta Updates & Fixes — always-visible,
     ungated, player-facing info row. Moved here in v2.1.7 (owner
     decision) from directly below Table Talk, so it reads as clearly
     secondary and no longer competes visually with live gameplay/Table
     Talk — now placed after the public Game Trends charts (end of
     TRIGAMMONX PRO, above) and before the Developer/Admin shell below.
     This is a position-only move: same element, same id (never
     duplicated), still a sibling of #tx-section-pro/#tx-section-admin
     rather than nested inside either, so it stays visible regardless of
     tier, exactly as before. Both boxes still reuse the exact same
     DID_YOU_KNOW_TIPS/BETA_UPDATE_NOTES data and
     gocRenderDykMounts()/gocRenderBetaMounts() functions as the
     Winner/Results dashboard's own lower row (see
     showGameOverCelebration() below) — one shared data source, not a
     second, competing content system. Purely informational; never
     reads or writes gameplay/board/AI/RNG state, and is never shown/
     updated any differently during headless simulation or an Auto
     Match batch (both render functions return immediately in that
     case, same guard pattern as every other renderX() in this file). -->
<div class="goc-lower-row" id="tx-info-row">
  <div class="goc-dyk-card">
    <div class="tx-tip-title">💡 Did You Know?</div>
    <div class="tx-tip-body dyk-body-mount">Loading…</div>
    <div class="tx-tip-nav">
      <span class="tx-tip-counter dyk-counter-mount">1/1</span>
      <button onclick="dykPrevTip()" aria-label="Previous tip">‹</button>
      <button onclick="dykNextTip()" aria-label="Next tip">›</button>
    </div>
  </div>
  <div class="goc-beta-card">
    <div class="tx-beta-title">🔧 Beta Updates &amp; Fixes</div>
    <div class="tx-beta-list beta-list-mount"><!-- populated by gocRenderBetaMounts() --></div>
    <div class="tx-beta-link"><a href="#" id="tx-beta-feedback-link" target="_blank" rel="noopener">Send feedback →</a></div>
  </div>
</div><!-- /#tx-info-row -->

<!-- Free-tier teaser — ONE compact block, no disabled controls or
     padlocks scattered through the Free UI. Hidden by default; shown
     only when body.tier-free (see CSS above). -->
<div class="pro-teaser">
  <div class="pro-teaser-title">✨ TrigammonX Plus</div>
  <div class="pro-teaser-body">Game analysis • Charts • Table Talk • Spoken commentary • Themes</div>
</div>

<!-- ══════════════════════════════════════════════════════════════════
     SECTION 3 — DEVELOPER / ADMIN (v175, renamed + reorganised in
     v253). Collapsed by default; must never appear when the tier is
     Free or Pro (see body.tier-free/body.tier-pro #tx-section-admin
     CSS above). Real Time clock, Doubling Cube visual test, and
     Technical Move Log all moved here in v253 — same ids and logic as
     before (updateClocks(), logMsg(), doubling-cube functions),
     only their position in the page changed.
     ══════════════════════════════════════════════════════════════════ -->
<section class="bottom-admin-shell" id="tx-section-admin">
  <button id="admin-toggle-btn" class="admin-toggle-btn" onclick="toggleBottomAdmin()">
    ⚙ Show DEVELOPER / ADMIN
  </button>

  <div id="bottom-admin-panel" class="bottom-admin-panel collapsed">
    <div class="panel-title">DEVELOPER / ADMIN</div>

    <div class="bottom-admin-grid">

      <!-- v253: Real Time clock — moved here from the old above-the-board
           clock row. Not important to normal gameplay, so it no longer
           appears in Free/Pro. Same #clock-real id and updateClocks()
           logic, unchanged; only this markup shrank. -->
      <div class="admin-group">
        <div class="panel-section-title">Real Time</div>
        <div class="clock-panel-compact">
          <div class="clock-card">
            <div class="clock-title">Real Time</div>
            <div class="clock-face">
              <div class="clock-ring"></div>
              <div id="clock-real" class="clock-main">--:--:--</div>
              <div class="clock-sub">Local</div>
            </div>
          </div>
        </div>
      </div>

      <!-- v200/v253: Doubling Cube visual test section — moved here from
           directly under the board. Visual only, no scoring yet; kept
           out of normal Free/Pro play until its gameplay/scoring
           implementation is complete (see body.tier-free/body.tier-pro
           .under-board-dc-section CSS above). Same #under-board-dc-section/
           #dc-tray/#dc-token markup and doubling-cube logic as before. -->
      <div class="admin-group admin-group-wide">
        <div class="under-board-dc-section" id="under-board-dc-section">
          <div style="display:flex;align-items:baseline;gap:8px;">
            <div class="dc-section-title">Doubling Cube</div>
            <div class="dc-section-badge">— visual test only</div>
          </div>
          <div class="dc-section-body">

            <!-- Token tray (#dc-tray is the single source of truth for the cube visual) -->
            <div id="dc-tray" class="dc-hidden">
              <div id="dc-token-wrap" class="dc-col-neutral">
                <div id="dc-token">
                  <div id="dc-token-face">
                    <span id="dc-value-num">2</span>
                  </div>
                  <div id="dc-bevel-right"></div>
                  <div id="dc-bevel-bottom"></div>
                </div>
              </div>
              <div id="dc-owner-badge">Neutral</div>
              <div id="dc-value-ladder"></div>
            </div>

            <!-- Cube controls -->
            <div class="dc-section-controls">
              <div class="dc-ctrl-row">
                <button class="dc-btn dcb-show" id="dc-btn-showhide" onclick="toggleDoublingCube()">👁 Show Cube</button>
                <button class="dc-btn dcb-offer" id="dc-btn-offer" onclick="offerDouble(currentPlayer)" disabled>⬆ Offer</button>
              </div>
              <div class="dc-ctrl-row">
                <button class="dc-btn dcb-take" id="dc-btn-take"  onclick="takeDouble(currentPlayer)"  disabled>✓ Take</button>
                <button class="dc-btn dcb-pass" id="dc-btn-pass"  onclick="passDouble(currentPlayer)"  disabled>✕ Pass</button>
                <button class="dc-btn dcb-cycle" id="btn-cycle" onclick="cycleCubePreview()">↻ Flip</button>
              </div>
            </div>

          </div>
        </div>
      </div>

      <!-- v253: Technical Move Log — moved here from directly under the
           board. Raw event-by-event system log, not player-facing;
           deliberately separate from the player-facing Table Talk panel
           in TRIGAMMONX PRO. Same #move-log id and logMsg()-appended
           .ml-sys/.ml-{player} entries as before. -->
      <div class="admin-group admin-group-wide">
        <div class="panel-section-title">Technical Move Log</div>
        <div class="move-log" id="move-log">
          <span class="ml-sys">TrigammonX v253 — Free / Plus / Developer UI. Choose players, then roll for first player.</span>
        </div>
      </div>

      <!-- v260: Browser TTS Test Lab — the old v249 Narrator Voice /
           Voice Style / Test Voice / Speed / Pitch block, moved here
           verbatim from the normal player-facing Table Talk card. Real
           commentary is now the recorded Scotty MP3 system (Commentary/
           Voice controls in TRIGAMMONX PRO); this block is development/
           audition tooling only, kept visually and functionally separate
           so players can never confuse browser TTS with production
           commentary. Same ids and functions as before
           (onNarratorVoiceChange(), onVoiceStyleChange(),
           onVoiceRateInput(), onVoicePitchInput(), testVoiceAudition()) —
           ▶ Test Voice still speaks a fixed sample line directly via
           speakUtteranceNow() and never touches Table Talk, cooldowns,
           commentaryHistory, or any other game state. -->
      <div class="admin-group admin-group-wide">
        <div class="panel-section-title">Browser TTS Test Lab</div>
        <div style="font-size:10px;color:#636e72;line-height:1.4;margin-bottom:6px;">
          Development/audition tooling only — browser text-to-speech, separate from the real Scotty MP3 commentary system used in normal play.
        </div>
        <div class="commentary-controls">
          <label class="commentary-control-label" style="flex:1 1 100%;">
            Narrator Voice
            <select id="narrator-voice-select" onchange="onNarratorVoiceChange(this.value)" class="player-type-select">
              <option value="" disabled selected>Loading voices…</option>
            </select>
          </label>
          <label class="commentary-control-label">
            Voice Style
            <select id="voice-style-select" onchange="onVoiceStyleChange(this.value)" class="player-type-select">
              <option value="natural" selected>Natural</option>
              <option value="commentator">Commentator</option>
              <option value="relaxed">Relaxed</option>
            </select>
          </label>
          <label class="commentary-control-label" style="flex:1 1 100%;">
            <button id="test-voice-btn" type="button" onclick="testVoiceAudition()" class="test-voice-btn" style="width:100%;margin-top:2px;">▶ Test Voice</button>
          </label>
          <label class="commentary-control-label">
            Speed <span id="voice-rate-value" class="voice-tuning-value">0.92×</span>
            <input type="range" id="voice-rate-slider" class="voice-tuning-slider"
                   min="0.75" max="1.20" step="0.01" value="0.92"
                   oninput="onVoiceRateInput(this.value)">
          </label>
          <label class="commentary-control-label">
            Pitch <span id="voice-pitch-value" class="voice-tuning-value">0.98×</span>
            <input type="range" id="voice-pitch-slider" class="voice-tuning-slider"
                   min="0.80" max="1.20" step="0.01" value="0.98"
                   oninput="onVoicePitchInput(this.value)">
          </label>
        </div>
      </div>

      <!-- v189: Device Preview — design-testing only, no game logic
           touched. v266: simplified to a compact primary choice
           (Desktop | Tablet | Mobile), with a Mobile-only Portrait/
           Landscape sub-row (default Portrait) and Full Width/Exit
           Preview demoted to a small secondary control below. This is a
           pure presentation wrapper — applyDevicePreview()/
           onDevicePreviewMobileClick()/syncDevicePreviewCompactUI()/
           initDevicePreviewCompactUI() (see JS) only decide which
           button looks active and whether the orientation sub-row
           shows; the untouched v189 setDevicePreviewMode() (body class,
           badge/status text, localStorage, renderAll()) still does all
           the actual work, called directly from every button here. -->
      <div class="admin-group">
        <div class="panel-section-title">Device Preview</div>
        <div class="dp-compact-row">
          <button id="dpc-desktop" onclick="applyDevicePreview('desktop')" style="border-color:#74b9ff;color:#74b9ff;">🖥 Desktop</button>
          <button id="dpc-tablet"  onclick="applyDevicePreview('tablet')"  style="border-color:#55efc4;color:#55efc4;">Tablet</button>
          <button id="dpc-mobile"  onclick="onDevicePreviewMobileClick()" style="border-color:#ff7675;color:#ff7675;">📱 Mobile</button>
        </div>
        <div class="dp-compact-row dp-orientation-row" id="dp-mobile-orientation-row" style="display:none;">
          <button id="dpc-mobile-portrait"  onclick="applyDevicePreview('mobile-portrait')"  style="border-color:#ff7675;color:#ff7675;">Portrait</button>
          <button id="dpc-mobile-landscape" onclick="applyDevicePreview('mobile-landscape')" style="border-color:#fdcb6e;color:#fdcb6e;">Landscape</button>
        </div>
        <button id="dpc-full" class="dp-secondary-btn" onclick="applyDevicePreview('full')" style="border-color:#a29bfe;color:#a29bfe;">Full Width / Exit Preview</button>
        <div class="device-preview-status" id="device-preview-status">Device Preview: Full Width</div>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Point Labels</div>
        <button id="btn-numbers" onclick="toggleNumbers()">Show Point Numbers</button>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Anchor Tools</div>
        <button id="btn-anchors" onclick="toggleAnchorDots()" style="border-color:#ff0080;color:#ff0080;">Show Anchor Dots</button>
        <button id="btn-anchor-edit" onclick="toggleAnchorEditMode()" style="border-color:#00cec9;color:#00cec9;">Edit Checker Anchors</button>
        <button onclick="exportAnchors()" style="border-color:#ff80d0;color:#ff80d0;">Export CHECKER_ANCHORS</button>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Click Zone Tools</div>
        <button id="btn-clickzones" onclick="toggleClickZones()" style="border-color:#b0b0b0;color:#b0b0b0;">Show Click Zones</button>
        <button id="btn-czl-edit" onclick="toggleCzlEditMode()" style="border-color:#fdcb6e;color:#fdcb6e;">Edit Click Zones</button>
        <button onclick="exportClickPoints()" style="border-color:#fdcb6e;color:#fdcb6e;">Export CLICK_POINTS</button>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Board Setup</div>
        <button id="btn-manual-setup" onclick="toggleManualSetup()" style="border-color:#fdcb6e;color:#fdcb6e;font-weight:bold;">Manual Setup</button>
      </div>

      <!-- v3.7.0: Decision Analysis Foundation — Developer/Admin-only,
           never player-facing (lives inside this same collapsed-by-default
           DEVELOPER / ADMIN shell as every other tool on this page). Pure
           diagnostics: record counts and an approximate stored size, no
           move-quality labels of any kind — this release does not judge
           moves. renderAnalysisDiagnosticPanel() (js/06-stats-history.js)
           fills #adx-diagnostic-body; exportAnalysisDataJson() reuses the
           existing hxDownloadTextFile() helper, same pattern as the Game/
           Match History JSON export above. -->
      <div class="admin-group admin-group-wide">
        <div class="panel-section-title">Decision Analysis <span style="font-size:9px;color:#636e72;font-weight:normal;text-transform:none;letter-spacing:0;">internal data capture — does not judge moves</span></div>
        <div style="font-size:10px;color:#636e72;line-height:1.4;margin-bottom:6px;">
          Background data-capture foundation for future move-analysis tooling. Records position-before/after, dice, moves played, and player/match context per completed turn. No move-quality classification, equity, or win-probability logic exists in this release.
        </div>
        <div id="adx-diagnostic-body" style="font-size:11px;color:#dfe6e9;line-height:1.7;margin-bottom:8px;">Records: <b>0</b></div>
        <button onclick="exportAnalysisDataJson()" style="border-color:#a29bfe;color:#a29bfe;">📤 Export Analysis Data</button>
        <button onclick="runAnalysisReplayValidation()" style="border-color:#a29bfe;color:#a29bfe;">🧪 Validate Decision Records</button>
        <!-- v3.7.0 correction (Correction 7): Developer/Admin-only structural
             replay check — reconstructs positionAfter from positionBefore +
             moveSequencePlayed via the same applyMove() the real engine
             uses, purely as a regression/test helper. Never runs
             automatically during gameplay; never becomes production
             analysis. runAnalysisReplayValidation() (js/06-stats-history.js)
             fills this element. -->
        <div id="adx-validate-result" style="font-size:10px;color:#b2bec3;line-height:1.4;margin-top:6px;">Not yet run.</div>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Test Dice</div>
        <div class="dice-test-inputs admin-test-dice-inputs" id="test-dice-inputs">
          <input type="number" id="td1" min="1" max="6" value="6">
          <input type="number" id="td2" min="1" max="6" value="6">
          <input type="number" id="td3" min="1" max="6" value="6" style="display:none;">
          <button onclick="setTestDice()" style="padding:4px 10px;">Set Test Dice</button>
        </div>
        <div style="font-size:10px;color:#aaa;line-height:1.4;">
          Admin/testing only. Uses current game mode.
        </div>
      </div>

      <!-- v245 (large-charts-rng pass): Dice RNG Test — an isolated
           fairness check on the real rand6() function. Runs entirely in
           its own local counters; never touches boardState, barState,
           playerStats, liveGameHistory, clockState, currentPlayer, or any
           other live-game state. Safe to run at any time, including
           mid-game, without affecting the game in progress. -->
      <div class="admin-group admin-group-wide">
        <div class="panel-section-title">Dice RNG Test <span style="font-size:9px;color:#636e72;font-weight:normal;text-transform:none;letter-spacing:0;">isolated — does not touch live game state</span></div>
        <div class="rng-test-btns">
          <button id="rng-test-10k"  onclick="runRngTest(10000)"   style="border-color:#a29bfe;color:#a29bfe;">🎲 10,000 Rolls</button>
          <button id="rng-test-100k" onclick="runRngTest(100000)"  style="border-color:#74b9ff;color:#74b9ff;">🎲 100,000 Rolls</button>
          <button id="rng-test-1m"   onclick="runRngTest(1000000)" style="border-color:#55efc4;color:#55efc4;">🎲 1,000,000 Rolls</button>
        </div>
        <div id="rng-test-status" style="font-size:10px;color:#aaa;line-height:1.4;margin-top:4px;">RNG Test idle.</div>
        <div id="rng-test-results" class="rng-test-results"></div>
      </div>

      <!-- v246: Commentary Debug — shows "Event ID | Phrase ID | Tone" under
           each Table Talk entry so the pilot's event arbitration can be
           verified. Never shown in normal play (checkbox default off). -->
      <div class="admin-group">
        <div class="panel-section-title">Commentary Debug</div>
        <label style="font-size:11px;color:#aaa;display:flex;gap:6px;align-items:center;">
          <input type="checkbox" id="commentary-debug-checkbox" onchange="onCommentaryDebugToggle(this.checked)">
          Show Event ID | Phrase ID | Tone in Table Talk
        </label>
        <div style="font-size:10px;color:#636e72;line-height:1.4;">
          Debug/testing only. Off by default; never shown to normal players.
        </div>
      </div>

      <!-- v247: fires one harmless line through the real presentation
           pipeline (Table Talk + Toast + Voice) WITHOUT going through
           emitCommentaryEvent() — never touches commentaryHistory,
           cooldowns, once-per-game tracking, the ordinary per-turn cap,
           or any board/stat/turn state. Lets you verify speakers and
           toast visibility before playing a whole game. -->
      <div class="admin-group">
        <div class="panel-section-title">Test Commentary</div>
        <button onclick="testCommentaryPipeline()" style="border-color:#a29bfe;color:#a29bfe;">🔔 Test Commentary</button>
        <div style="font-size:10px;color:#636e72;line-height:1.4;">
          Sends one test line through Table Talk + Toast + Voice. Requires Commentary to be STD, CHEEKY, or AUUNC. Never affects board state, stats, or commentary history.
        </div>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Auto Match Runner</div>

        <label style="font-size:10px;color:#aaa;line-height:1.4;">
          Games to Play
          <input type="number" id="auto-match-games-input" min="1" max="50" value="10"
            style="width:64px;margin-top:4px;background:#16213e;border:1px solid #555;color:#ffd700;border-radius:4px;text-align:center;font-family:'Courier New',monospace;">
        </label>

        <label style="font-size:10px;color:#aaa;line-height:1.4;">
          Starting Player
          <select id="auto-match-starting-player-select"
            onchange="onAutoMatchStartingModeChange(this.value)"
            style="width:100%;margin-top:4px;background:#16213e;border:1px solid #555;color:#ffd700;border-radius:4px;font-family:'Courier New',monospace;">
            <option value="blue" selected>Always Blue</option>
            <option value="rotate">Rotate Blue / Green / Red</option>
            <option value="random">Random</option>
          </select>
        </label>

        <button onclick="startAutoMatchRunner()" style="border-color:#55efc4;color:#55efc4;">▶ Start Auto Match</button>
        <button onclick="stopAutoMatchRunner()" style="border-color:#ff7675;color:#ff7675;">■ Stop Auto Match</button>

        <div id="auto-match-status" style="font-size:10px;color:#aaa;line-height:1.4;">
          Auto Match: idle.
        </div>

        <div style="font-size:10px;color:#636e72;line-height:1.4;">
          Runs games sequentially using current player types, game mode, and AI speed. Clear Match Log first if you want a clean run.
        </div>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Match Summary</div>
        <div id="match-summary-panel" class="match-summary-panel">No games recorded yet.</div>
        <button onclick="copyMatchSummary()" style="border-color:#55efc4;color:#55efc4;">Copy Summary</button>
      </div>

      <div class="admin-group admin-group-wide">
        <div class="panel-section-title">Match / Balance Log</div>
        <div id="match-log-panel" class="match-log-panel">No games recorded this session.</div>
        <div class="player-action-btns">
          <button onclick="copyMatchLog()" style="border-color:#74b9ff;color:#74b9ff;">Copy Match Log</button>
          <button onclick="clearMatchLog()" style="border-color:#ff7675;color:#ff7675;">Clear Match Log</button>
        </div>
      </div>

      <div class="admin-group">
        <div class="panel-section-title">Admin View</div>
        <div class="admin-view-btns">
          <button id="btn-view-fixed" onclick="setBoardFixed()" style="border-color:#a29bfe;color:#a29bfe;">📐 Fixed Board</button>
          <button id="btn-view-blue" class="btn-view-blue" onclick="setBoardRotation(0, 'Blue Side')" style="border-color:#74b9ff;color:#74b9ff;">🔵 Show Blue Side (0°)</button>
          <button id="btn-view-green" class="btn-view-green" onclick="setBoardRotation(120, 'Green Side')" style="border-color:#55efc4;color:#55efc4;">🟢 Show Green Side (120°)</button>
          <button id="btn-view-red" class="btn-view-red" onclick="setBoardRotation(240, 'Red Side')" style="border-color:#ff7675;color:#ff7675;">🔴 Show Red Side (240°)</button>
          <button id="btn-view-auto" class="btn-view-auto btn-view-active" onclick="setBoardAutoRotate()" style="border-color:#ffd700;color:#ffd700;">⟳ Auto Rotate to Player</button>
        </div>
        <div id="board-view-status">Board View: Auto — Blue 0°</div>
      </div>
    </div>
  </div>
</section>

<!-- v180d: fixed floating status box — the only thing that visibly
     updates during a headless Simulation Auto Match run -->
<div id="headless-sim-status" class="headless-sim-status" style="display:none;">
  Simulation idle.
</div>

<!-- v248: Commentary Pack — wording lives here, not in the game script.
     As of v248 this is EMBEDDED directly in the page (previously an
     external trigammonx-commentary-pack-v1.js file, which broke when
     that file wasn't served alongside the HTML). It still executes as
     its own inline <script> BEFORE the main script below, so
     window.TrigammonCommentaryPack is already set by the time any game
     code could try to use it — no network request, no fetch/XHR, no
     same-directory file dependency. initCommentaryPackStatus() and
     isCommentaryPackReady() in the main script still check the global
     defensively rather than assuming it's shaped correctly, but with the
     pack embedded that check should now always pass. -->
<!-- v4.1 TEST CHANNEL: point the update check at the TEST manifest so this
     unreleased build never compares against / is nagged by the public
     latest-version.json. Must run BEFORE 01-config-data.js. -->
<script src="trigammonx-v5.1.5/js/01-config-data.js"></script>
<script src="trigammonx-v5.1.5/js/02-state-utils.js"></script>
<script src="trigammonx-v5.1.5/js/03-rules-engine.js"></script>
<script src="trigammonx-v5.1.5/js/04-board-render.js"></script>
<script src="trigammonx-v5.1.5/js/05-gameplay-interaction.js"></script>
<script src="trigammonx-v5.1.5/js/06-stats-history.js"></script>
<script src="trigammonx-v5.1.5/js/07-commentary.js"></script>
<!-- v3.7.1 CORRECTION: single source of truth for legal-move generation +
     AI planning, loaded here AND (via importScripts()) inside the new AI
     Worker (js/14-ai-worker.js, created at runtime by js/08-ai.js — never
     referenced by a <script> tag here). See 13-ai-engine-shared.js's own
     header comment and TrigammonX-v3.7.1-change-report.md's "Correction —
     Web Worker for AI planning" section. -->
<script src="trigammonx-v5.1.5/js/13-ai-engine-shared.js"></script>
<script src="trigammonx-v5.1.5/js/08-ai.js"></script>
<script src="trigammonx-v5.1.5/js/09-saves.js"></script>
<script src="trigammonx-v5.1.5/js/10-clocks-themes-ui.js"></script>
<script src="trigammonx-v5.1.5/js/11-simulation-admin.js"></script>
<script src="trigammonx-v5.1.5/js/12-bootstrap.js"></script>
<!-- v5.0 (Modules A-G) — TrigammonX Academy: isolated setup/editor layer. Loads LAST so every core symbol it hooks already exists. -->
<script src="trigammonx-v5.1.5/js/15-academy.js"></script>
<!-- v5.0.3 — Players / Profiles / AI identities / stat ownership foundation. Loads after Academy so every core + Academy symbol it hooks already exists. Pure data-architecture + compact UI; never touches rules/RNG/geometry/executeMove/simulation. -->
<script src="trigammonx-v5.1.5/js/16-players.js"></script>
<!-- v197: page footer -->
<div class="page-footer">TrigammonX v5.1.5 PUBLIC BETA</div>

</body>
</html>