feat(stats): best-move word, moves & hint-share, and a hint-count fix (#81)

The statistics screen gains real depth, plus a hint-count bug fix found along the way.

- Best move per variant: the screen shows the actual best-move word (drawn as game
  tiles; a wildcard shows its letter but no value), broken down by game variant, empty
  variants omitted. New account_best_move table, written at game finish.
- Moves & hint share: two new lifetime tiles — the player's play count and the share of
  plays that used a hint — from summed account_stats counters (moves, hints_used).
  Honest-AI games are excluded, like the rest of the stats.
- Hint-count fix: the in-game hint badge no longer goes stale across games. The global
  wallet now rides the wire apart from the per-game allowance (wallet_balance on
  StateView/HintResult/StatsView), so the client reads the live wallet rather than a
  per-game snapshot; game_players.hints_used now counts every hint (allowance + wallet),
  its true per-game total.
- Account merge: sums the new moves/hints_used counters and merges the per-variant best
  moves (higher score kept), which it previously dropped.
- Admin: the user card shows Moves and Hints used.
- UI polish: tab/label wording, game-over text, and e2e selectors hardened against label
  changes.

All wire additions are trailing (backward-compatible). Docs (ARCHITECTURE, FUNCTIONAL +ru,
UISN_DESIGN) updated in step.

ui/src/screens/Lobby.svelte

@@ -306,7 +306,7 @@
         <span class="sq">🎲</span><span class="lbl">{t('lobby.new')}</span>
       </button>
       <button class="tab" onclick={() => navigate('/stats')}>
-        <span class="sq">📊</span><span class="lbl">{t('lobby.stats')}</span>
+        <span class="sq">✏️</span><span class="lbl">{t('lobby.stats')}</span>
       </button>
       <button class="tab" onclick={() => navigate('/settings')}>
         <span class="sq">⚙️{#if settingsBadge > 0}<span class="badge">{settingsBadge}</span>{/if}</span>

ui/src/screens/Stats.svelte

@@ -1,11 +1,22 @@
 <script lang="ts">
   import { onMount } from 'svelte';
   import Screen from '../components/Screen.svelte';
+  import WordTiles from '../components/WordTiles.svelte';
   import { app, handleError } from '../lib/app.svelte';
   import { gateway } from '../lib/gateway';
-  import { t, type MessageKey } from '../lib/i18n/index.svelte';
-  import { gamesPlayed, winRate } from '../lib/stats';
-  import type { Stats } from '../lib/model';
+  import { t, i18n, type MessageKey } from '../lib/i18n/index.svelte';
+  import { gamesPlayed, hintSharePercent, winRate } from '../lib/stats';
+  import { ALL_VARIANTS, variantNameKey } from '../lib/variants';
+  import type { BestMove, Stats } from '../lib/model';
+
+  // hintShare is shown to one decimal in the active locale's notation ("4.8%" / "4,8%").
+  function hintShare(s: Stats): string {
+    const pct = hintSharePercent(s).toLocaleString(i18n.locale, {
+      minimumFractionDigits: 1,
+      maximumFractionDigits: 1,
+    });
+    return `${pct}%`;
+  }
 
   let stats = $state<Stats | null>(null);
 
@@ -21,16 +32,25 @@
   const cards = $derived<{ key: MessageKey; value: string | number }[]>(
     stats
       ? [
-          { key: 'stats.wins', value: stats.wins },
-          { key: 'stats.losses', value: stats.losses },
-          { key: 'stats.draws', value: stats.draws },
           { key: 'stats.played', value: gamesPlayed(stats) },
-          { key: 'stats.winRate', value: `${winRate(stats)}%` },
+          { key: 'stats.wins', value: stats.wins },
+          { key: 'stats.draws', value: stats.draws },
+          { key: 'stats.losses', value: stats.losses },
+          { key: 'stats.moves', value: stats.moves },
+          { key: 'stats.hintShare', value: hintShare(stats) },
           { key: 'stats.maxGame', value: stats.maxGamePoints },
-          { key: 'stats.maxWord', value: stats.maxWordPoints },
+          { key: 'stats.winRate', value: `${winRate(stats)}%` },
         ]
       : [],
   );
+
+  // The best move is shown as a full-width breakdown with the word itself, one row per
+  // variant the player has played, in catalogue order (the backend lists only non-empty
+  // variants). It replaces the former single "best move" number card.
+  const ORDER = ALL_VARIANTS.map((v) => v.id);
+  const bestMoves = $derived<BestMove[]>(
+    stats ? [...stats.bestMoves].sort((a, b) => ORDER.indexOf(a.variant) - ORDER.indexOf(b.variant)) : [],
+  );
 </script>
 
 <Screen title={t('stats.title')} back="/">
@@ -46,6 +66,18 @@
           </div>
         {/each}
       </div>
+      {#if bestMoves.length > 0}
+        <div class="card bestmove">
+          <span class="lbl">{t('stats.maxWord')}</span>
+          <div class="rows">
+            {#each bestMoves as bm (bm.variant)}
+              <span class="variant">{t(variantNameKey(bm.variant))}</span>
+              <span class="wordcell"><WordTiles word={bm.word} /></span>
+              <span class="score">{bm.score}</span>
+            {/each}
+          </div>
+        </div>
+      {/if}
     {/if}
   </div>
 </Screen>
@@ -79,4 +111,33 @@
     color: var(--text-muted);
     font-size: 0.85rem;
   }
+  .bestmove {
+    margin-top: 12px;
+    gap: 12px;
+  }
+  /* One grid for all rows so columns align across them: variant on the left, the word
+     tiles right-aligned to a shared edge, the score right-aligned in its own column. */
+  .rows {
+    display: grid;
+    /* minmax(0, 1fr) lets the word column shrink below its tiles' intrinsic width on a
+       narrow screen (the cell then scrolls) instead of overlapping the variant label. */
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    align-items: center;
+    row-gap: 12px;
+    column-gap: 8px;
+  }
+  .variant {
+    color: var(--text-muted);
+    font-size: 0.95rem;
+  }
+  .wordcell {
+    justify-self: end;
+    min-width: 0;
+    overflow-x: auto;
+  }
+  .score {
+    justify-self: end;
+    font-weight: 700;
+    font-variant-numeric: tabular-nums;
+  }
 </style>