feat(ui): single-word rule indicators + auto-match select redesign

Surface the per-game "single word" rule to the client and refine the
random-opponent New Game screen.

- Wire: thread multiple_words_per_turn into the GameView and Invitation
  FlatBuffers tables (Go + TS regenerated), through pkg/wire builders and both
  the backend push-event and gateway REST paths.
- In-game indicators (single-word games only): a small 1 in the status bar's
  score-preview slot (yields to the live preview) and a centred "One word per
  turn" label in the history-drawer header. Standard games show neither.
- Invitation card gains a "One word per turn" line for single-word invitations.
- Auto-match redesign: variant plaques are mutually-exclusive selects (highlight
  on tap, no longer enqueue); a lone offered variant is pre-selected; a bottom
  "Start game" button (disabled until a variant is chosen) confirms. The rule
  toggle appears once a Russian variant is selected.
- Tests: e2e for the new auto flow and the in-game indicator (mock g3 is a
  single-word game); mock/data + fixtures carry the new field. Docs: UI_DESIGN.

ui/src/game/Game.svelte

@@ -790,6 +790,7 @@
             {:else}
               <button class="hicon" onclick={() => (resignOpen = true)} aria-label={t('game.dropGame')}>🏁</button>
             {/if}
+            {#if !view.game.multipleWordsPerTurn}<span class="oneword-label">{t('game.oneWordRule')}</span>{/if}
             <button class="hicon" onclick={() => navigate(`/game/${id}/chat`)} aria-label={t('game.chat')}>
               💬{#if (app.chatUnread[id] ?? 0) > 0}<span class="cbadge">{app.chatUnread[id]}</span>{/if}
             </button>
@@ -857,7 +858,7 @@
         <span class="turn-ind">{isMyTurn ? t('game.yourTurn') : view.game.seats[view.game.toMove]?.displayName ?? ''}</span>
       {/if}
       <span class="scores">
-        {#if preview}{preview.legal ? t('game.previewWords', { words: preview.words.join(', '), n: preview.score }) : t('game.previewIllegal')}{/if}
+        {#if preview}{preview.legal ? t('game.previewWords', { words: preview.words.join(', '), n: preview.score }) : t('game.previewIllegal')}{:else if !view.game.multipleWordsPerTurn}<span class="oneword" title={t('game.oneWordRule')}>1️⃣</span>{/if}
       </span>
     </div>
 
@@ -1103,6 +1104,18 @@
     min-width: 64px;
     text-align: right;
   }
+  .oneword {
+    font-size: 0.95rem;
+  }
+  /* The single-word-rule label centred in the history header between its two icons. */
+  .oneword-label {
+    flex: 1;
+    text-align: center;
+    font-size: 0.78rem;
+    font-weight: 600;
+    color: var(--text-muted);
+    white-space: nowrap;
+  }
   .rack-row {
     display: flex;
     flex: none;

ui/src/gen/fbs/scrabblefb/game-view.ts

@@ -66,35 +66,40 @@ turnTimeoutSecs():number {
   return offset ? this.bb!.readInt32(this.bb_pos + offset) : 0;
 }
 
-moveCount():number {
+multipleWordsPerTurn():boolean {
   const offset = this.bb!.__offset(this.bb_pos, 18);
+  return offset ? !!this.bb!.readInt8(this.bb_pos + offset) : false;
+}
+
+moveCount():number {
+  const offset = this.bb!.__offset(this.bb_pos, 20);
   return offset ? this.bb!.readInt32(this.bb_pos + offset) : 0;
 }
 
 endReason():string|null
 endReason(optionalEncoding:flatbuffers.Encoding):string|Uint8Array|null
 endReason(optionalEncoding?:any):string|Uint8Array|null {
-  const offset = this.bb!.__offset(this.bb_pos, 20);
+  const offset = this.bb!.__offset(this.bb_pos, 22);
   return offset ? this.bb!.__string(this.bb_pos + offset, optionalEncoding) : null;
 }
 
 seats(index: number, obj?:SeatView):SeatView|null {
-  const offset = this.bb!.__offset(this.bb_pos, 22);
+  const offset = this.bb!.__offset(this.bb_pos, 24);
   return offset ? (obj || new SeatView()).__init(this.bb!.__indirect(this.bb!.__vector(this.bb_pos + offset) + index * 4), this.bb!) : null;
 }
 
 seatsLength():number {
-  const offset = this.bb!.__offset(this.bb_pos, 22);
+  const offset = this.bb!.__offset(this.bb_pos, 24);
   return offset ? this.bb!.__vector_len(this.bb_pos + offset) : 0;
 }
 
 lastActivityUnix():bigint {
-  const offset = this.bb!.__offset(this.bb_pos, 24);
+  const offset = this.bb!.__offset(this.bb_pos, 26);
   return offset ? this.bb!.readInt64(this.bb_pos + offset) : BigInt('0');
 }
 
 static startGameView(builder:flatbuffers.Builder) {
-  builder.startObject(11);
+  builder.startObject(12);
 }
 
 static addId(builder:flatbuffers.Builder, idOffset:flatbuffers.Offset) {
@@ -125,16 +130,20 @@ static addTurnTimeoutSecs(builder:flatbuffers.Builder, turnTimeoutSecs:number) {
   builder.addFieldInt32(6, turnTimeoutSecs, 0);
 }
 
+static addMultipleWordsPerTurn(builder:flatbuffers.Builder, multipleWordsPerTurn:boolean) {
+  builder.addFieldInt8(7, +multipleWordsPerTurn, +false);
+}
+
 static addMoveCount(builder:flatbuffers.Builder, moveCount:number) {
-  builder.addFieldInt32(7, moveCount, 0);
+  builder.addFieldInt32(8, moveCount, 0);
 }
 
 static addEndReason(builder:flatbuffers.Builder, endReasonOffset:flatbuffers.Offset) {
-  builder.addFieldOffset(8, endReasonOffset, 0);
+  builder.addFieldOffset(9, endReasonOffset, 0);
 }
 
 static addSeats(builder:flatbuffers.Builder, seatsOffset:flatbuffers.Offset) {
-  builder.addFieldOffset(9, seatsOffset, 0);
+  builder.addFieldOffset(10, seatsOffset, 0);
 }
 
 static createSeatsVector(builder:flatbuffers.Builder, data:flatbuffers.Offset[]):flatbuffers.Offset {
@@ -150,7 +159,7 @@ static startSeatsVector(builder:flatbuffers.Builder, numElems:number) {
 }
 
 static addLastActivityUnix(builder:flatbuffers.Builder, lastActivityUnix:bigint) {
-  builder.addFieldInt64(10, lastActivityUnix, BigInt('0'));
+  builder.addFieldInt64(11, lastActivityUnix, BigInt('0'));
 }
 
 static endGameView(builder:flatbuffers.Builder):flatbuffers.Offset {
@@ -158,7 +167,7 @@ static endGameView(builder:flatbuffers.Builder):flatbuffers.Offset {
   return offset;
 }
 
-static createGameView(builder:flatbuffers.Builder, idOffset:flatbuffers.Offset, variantOffset:flatbuffers.Offset, dictVersionOffset:flatbuffers.Offset, statusOffset:flatbuffers.Offset, players:number, toMove:number, turnTimeoutSecs:number, moveCount:number, endReasonOffset:flatbuffers.Offset, seatsOffset:flatbuffers.Offset, lastActivityUnix:bigint):flatbuffers.Offset {
+static createGameView(builder:flatbuffers.Builder, idOffset:flatbuffers.Offset, variantOffset:flatbuffers.Offset, dictVersionOffset:flatbuffers.Offset, statusOffset:flatbuffers.Offset, players:number, toMove:number, turnTimeoutSecs:number, multipleWordsPerTurn:boolean, moveCount:number, endReasonOffset:flatbuffers.Offset, seatsOffset:flatbuffers.Offset, lastActivityUnix:bigint):flatbuffers.Offset {
   GameView.startGameView(builder);
   GameView.addId(builder, idOffset);
   GameView.addVariant(builder, variantOffset);
@@ -167,6 +176,7 @@ static createGameView(builder:flatbuffers.Builder, idOffset:flatbuffers.Offset,
   GameView.addPlayers(builder, players);
   GameView.addToMove(builder, toMove);
   GameView.addTurnTimeoutSecs(builder, turnTimeoutSecs);
+  GameView.addMultipleWordsPerTurn(builder, multipleWordsPerTurn);
   GameView.addMoveCount(builder, moveCount);
   GameView.addEndReason(builder, endReasonOffset);
   GameView.addSeats(builder, seatsOffset);

ui/src/gen/fbs/scrabblefb/invitation.ts

@@ -68,34 +68,39 @@ hintsPerPlayer():number {
   return offset ? this.bb!.readInt32(this.bb_pos + offset) : 0;
 }
 
+multipleWordsPerTurn():boolean {
+  const offset = this.bb!.__offset(this.bb_pos, 18);
+  return offset ? !!this.bb!.readInt8(this.bb_pos + offset) : false;
+}
+
 dropoutTiles():string|null
 dropoutTiles(optionalEncoding:flatbuffers.Encoding):string|Uint8Array|null
 dropoutTiles(optionalEncoding?:any):string|Uint8Array|null {
-  const offset = this.bb!.__offset(this.bb_pos, 18);
+  const offset = this.bb!.__offset(this.bb_pos, 20);
   return offset ? this.bb!.__string(this.bb_pos + offset, optionalEncoding) : null;
 }
 
 status():string|null
 status(optionalEncoding:flatbuffers.Encoding):string|Uint8Array|null
 status(optionalEncoding?:any):string|Uint8Array|null {
-  const offset = this.bb!.__offset(this.bb_pos, 20);
+  const offset = this.bb!.__offset(this.bb_pos, 22);
   return offset ? this.bb!.__string(this.bb_pos + offset, optionalEncoding) : null;
 }
 
 gameId():string|null
 gameId(optionalEncoding:flatbuffers.Encoding):string|Uint8Array|null
 gameId(optionalEncoding?:any):string|Uint8Array|null {
-  const offset = this.bb!.__offset(this.bb_pos, 22);
+  const offset = this.bb!.__offset(this.bb_pos, 24);
   return offset ? this.bb!.__string(this.bb_pos + offset, optionalEncoding) : null;
 }
 
 expiresAtUnix():bigint {
-  const offset = this.bb!.__offset(this.bb_pos, 24);
+  const offset = this.bb!.__offset(this.bb_pos, 26);
   return offset ? this.bb!.readInt64(this.bb_pos + offset) : BigInt('0');
 }
 
 static startInvitation(builder:flatbuffers.Builder) {
-  builder.startObject(11);
+  builder.startObject(12);
 }
 
 static addId(builder:flatbuffers.Builder, idOffset:flatbuffers.Offset) {
@@ -138,20 +143,24 @@ static addHintsPerPlayer(builder:flatbuffers.Builder, hintsPerPlayer:number) {
   builder.addFieldInt32(6, hintsPerPlayer, 0);
 }
 
+static addMultipleWordsPerTurn(builder:flatbuffers.Builder, multipleWordsPerTurn:boolean) {
+  builder.addFieldInt8(7, +multipleWordsPerTurn, +false);
+}
+
 static addDropoutTiles(builder:flatbuffers.Builder, dropoutTilesOffset:flatbuffers.Offset) {
-  builder.addFieldOffset(7, dropoutTilesOffset, 0);
+  builder.addFieldOffset(8, dropoutTilesOffset, 0);
 }
 
 static addStatus(builder:flatbuffers.Builder, statusOffset:flatbuffers.Offset) {
-  builder.addFieldOffset(8, statusOffset, 0);
+  builder.addFieldOffset(9, statusOffset, 0);
 }
 
 static addGameId(builder:flatbuffers.Builder, gameIdOffset:flatbuffers.Offset) {
-  builder.addFieldOffset(9, gameIdOffset, 0);
+  builder.addFieldOffset(10, gameIdOffset, 0);
 }
 
 static addExpiresAtUnix(builder:flatbuffers.Builder, expiresAtUnix:bigint) {
-  builder.addFieldInt64(10, expiresAtUnix, BigInt('0'));
+  builder.addFieldInt64(11, expiresAtUnix, BigInt('0'));
 }
 
 static endInvitation(builder:flatbuffers.Builder):flatbuffers.Offset {

ui/src/lib/codec.ts

@@ -238,6 +238,7 @@ function decodeGameView(g: fb.GameView): GameView {
     players: g.players(),
     toMove: g.toMove(),
     turnTimeoutSecs: g.turnTimeoutSecs(),
+    multipleWordsPerTurn: g.multipleWordsPerTurn(),
     moveCount: g.moveCount(),
     endReason: s(g.endReason()),
     lastActivityUnix: Number(g.lastActivityUnix()),
@@ -686,6 +687,7 @@ function decodeInvitationTable(i: fb.Invitation): Invitation {
     turnTimeoutSecs: i.turnTimeoutSecs(),
     hintsAllowed: i.hintsAllowed(),
     hintsPerPlayer: i.hintsPerPlayer(),
+    multipleWordsPerTurn: i.multipleWordsPerTurn(),
     dropoutTiles: s(i.dropoutTiles()),
     status: s(i.status()),
     gameId: s(i.gameId()),
@@ -721,6 +723,7 @@ function emptyGame(): GameView {
     players: 0,
     toMove: 0,
     turnTimeoutSecs: 0,
+    multipleWordsPerTurn: true,
     moveCount: 0,
     endReason: '',
     lastActivityUnix: 0,

ui/src/lib/gamedelta.test.ts

@@ -12,6 +12,7 @@ function gameView(moveCount: number, over = false): GameView {
     players: 2,
     toMove: 1,
     turnTimeoutSecs: 300,
+    multipleWordsPerTurn: true,
     moveCount,
     endReason: over ? 'standard' : '',
     lastActivityUnix: 0,

ui/src/lib/i18n/en.ts

@@ -69,6 +69,7 @@ export const en = {
   'game.dropGame': 'Drop game',
   'game.previewWords': '{words}: {n}',
   'game.previewIllegal': 'Not a legal move',
+  'game.oneWordRule': 'One word per turn',
   'game.chooseBlank': 'Choose a letter for the blank',
   'game.exchangeTitle': 'Select tiles to exchange',
   'game.exchangeConfirm': 'Exchange {n}',
@@ -233,6 +234,7 @@ export const en = {
   'new.moveTime': 'Move time',
   'new.hintsPerPlayer': 'Hints per player',
   'new.multipleWordsPerTurn': 'Multiple words per turn',
+  'new.start': 'Start game',
   'new.invited': 'Invitation sent.',
   'new.noFriends': 'Add friends first to invite them.',
 

ui/src/lib/i18n/ru.ts

@@ -70,6 +70,7 @@ export const ru: Record<MessageKey, string> = {
   'game.dropGame': 'Покинуть игру',
   'game.previewWords': '{words}: {n}',
   'game.previewIllegal': 'Недопустимый ход',
+  'game.oneWordRule': 'Одно слово за ход',
   'game.chooseBlank': 'Выберите букву для бланка',
   'game.exchangeTitle': 'Выберите фишки для обмена',
   'game.exchangeConfirm': 'Обменять {n}',
@@ -234,6 +235,7 @@ export const ru: Record<MessageKey, string> = {
   'new.moveTime': 'Время на ход',
   'new.hintsPerPlayer': 'Подсказок на игрока',
   'new.multipleWordsPerTurn': 'Несколько слов за ход',
+  'new.start': 'Начать игру',
   'new.invited': 'Приглашение отправлено.',
   'new.noFriends': 'Сначала добавьте друзей, чтобы пригласить их.',
 

ui/src/lib/lobbysort.test.ts

@@ -21,6 +21,7 @@ function game(id: string, status: GameView['status'], toMove: number, lastActivi
     players: 2,
     toMove,
     turnTimeoutSecs: 0,
+    multipleWordsPerTurn: true,
     moveCount: 0,
     endReason: '',
     lastActivityUnix,

ui/src/lib/mock/client.ts

@@ -142,7 +142,7 @@ export class MockGateway implements GatewayClient {
   }
 
   // --- lobby ---
-  async lobbyEnqueue(variant: Variant, _multipleWords: boolean): Promise<MatchResult> {
+  async lobbyEnqueue(variant: Variant, multipleWords: boolean): Promise<MatchResult> {
     // Simulate a 10s-style robot substitution, sped up: match found shortly.
     const id = crypto.randomUUID();
     const g: MockGame = {
@@ -154,6 +154,7 @@ export class MockGateway implements GatewayClient {
         players: 2,
         toMove: 0,
         turnTimeoutSecs: 86400,
+        multipleWordsPerTurn: multipleWords,
         moveCount: 0,
         endReason: '',
         lastActivityUnix: Math.floor(Date.now() / 1000),
@@ -442,6 +443,7 @@ export class MockGateway implements GatewayClient {
       turnTimeoutSecs: settings.turnTimeoutSecs,
       hintsAllowed: settings.hintsAllowed,
       hintsPerPlayer: settings.hintsPerPlayer,
+      multipleWordsPerTurn: settings.multipleWordsPerTurn,
       dropoutTiles: settings.dropoutTiles,
       status: 'pending',
       gameId: '',

ui/src/lib/mock/data.ts

@@ -61,6 +61,7 @@ export function mockInvitations(): Invitation[] {
       turnTimeoutSecs: 86400,
       hintsAllowed: true,
       hintsPerPlayer: 1,
+      multipleWordsPerTurn: true,
       dropoutTiles: 'remove',
       status: 'pending',
       gameId: '',
@@ -141,6 +142,7 @@ function activeGame(): MockGame {
       players: 2,
       toMove: 0,
       turnTimeoutSecs: 86400,
+      multipleWordsPerTurn: true,
       moveCount: G1_MOVES.length,
       endReason: '',
       lastActivityUnix: Math.floor(Date.now() / 1000) - 7200,
@@ -175,6 +177,7 @@ function finishedG2(): MockGame {
       players: 2,
       toMove: 0,
       turnTimeoutSecs: 86400,
+      multipleWordsPerTurn: true,
       moveCount: 2,
       endReason: 'normal',
       lastActivityUnix: Math.floor(Date.now() / 1000) - 86400,
@@ -210,6 +213,7 @@ function finishedG3(): MockGame {
       players: 2,
       toMove: 0,
       turnTimeoutSecs: 86400,
+      multipleWordsPerTurn: false,
       moveCount: 1,
       endReason: 'resignation',
       lastActivityUnix: Math.floor(Date.now() / 1000) - 172800,

ui/src/lib/model.ts

@@ -38,6 +38,8 @@ export interface GameView {
   players: number;
   toMove: number;
   turnTimeoutSecs: number;
+  /** true = standard Scrabble; false = the single-word rule (Russian games). */
+  multipleWordsPerTurn: boolean;
   moveCount: number;
   endReason: string;
   /** Lobby sort key: the current turn's start (active) or the finish time (finished), Unix seconds. */
@@ -177,6 +179,8 @@ export interface Invitation {
   turnTimeoutSecs: number;
   hintsAllowed: boolean;
   hintsPerPlayer: number;
+  /** true = standard Scrabble; false = the single-word rule (Russian games). */
+  multipleWordsPerTurn: boolean;
   dropoutTiles: string;
   status: string;
   gameId: string;

ui/src/lib/result.test.ts

@@ -20,6 +20,7 @@ function game(seats: Seat[], status = 'finished', toMove = 0): GameView {
     players: seats.length,
     toMove,
     turnTimeoutSecs: 0,
+    multipleWordsPerTurn: true,
     moveCount: 0,
     endReason: '',
     lastActivityUnix: 0,

ui/src/screens/Lobby.svelte

@@ -160,6 +160,7 @@
                 <span class="who">{t('invitations.from', { name: inv.inviter.displayName })}</span>
                 <span class="sub">{t(variantKey[inv.variant] ?? 'new.english')}</span>
               {/if}
+              {#if !inv.multipleWordsPerTurn}<span class="sub">{t('game.oneWordRule')}</span>{/if}
             </span>
             <span class="acts">
               {#if inv.inviter.accountId === myId}

ui/src/screens/NewGame.svelte

@@ -24,7 +24,12 @@
   // "Multiple words per turn" off is the single-word rule; it is offered for Russian games
   // only (English is always standard and shows no toggle). Shared by both flows.
   let multipleWords = $state(false);
-  const autoHasRussian = $derived(variants.some((v) => supportsMultipleWordsToggle(v.id)));
+  // Auto-match: the variant is a select (highlight, no immediate enqueue) confirmed by the
+  // Start button. A lone offered variant is pre-selected; with several the player must pick.
+  let selectedAuto = $state<Variant | ''>('');
+  $effect(() => {
+    if (variants.length === 1 && !selectedAuto) selectedAuto = variants[0].id;
+  });
   const timeouts = [
     { secs: 300, key: 'time.minutes' as MessageKey, n: 5 },
     { secs: 1800, key: 'time.minutes' as MessageKey, n: 30 },
@@ -182,15 +187,14 @@
 
       {#if mode === 'auto'}
         <p class="subtitle">{t('new.subtitle')}</p>
-        {#if autoHasRussian}
-          <label class="toggle">
-            <span>{t('new.multipleWordsPerTurn')}</span>
-            <input type="checkbox" bind:checked={multipleWords} />
-          </label>
-        {/if}
         <div class="variants">
           {#each variants as v (v.id)}
-            <button class="variant" onclick={() => find(v.id)} disabled={!connection.online}>
+            <button
+              class="variant"
+              class:selected={selectedAuto === v.id}
+              onclick={() => (selectedAuto = v.id)}
+              disabled={!connection.online}
+            >
               <span class="vmain">
                 <span class="vname">{t(v.label)}</span>
                 {#if VARIANT_FLAG[v.id]}
@@ -203,7 +207,18 @@
             </button>
           {/each}
         </div>
+        {#if selectedAuto && supportsMultipleWordsToggle(selectedAuto)}
+          <label class="toggle">
+            <span>{t('new.multipleWordsPerTurn')}</span>
+            <input type="checkbox" bind:checked={multipleWords} />
+          </label>
+        {/if}
         <p class="movelimit">{t('new.moveLimit', { n: AUTO_MATCH_HOURS })}</p>
+        <button
+          class="invite"
+          disabled={!selectedAuto || !connection.online}
+          onclick={() => selectedAuto && find(selectedAuto)}
+        >{t('new.start')}</button>
       {:else if friends.length === 0}
         <p class="subtitle">{t('new.noFriends')}</p>
       {:else}
@@ -310,6 +325,12 @@
     font-size: 0.8rem;
     color: var(--text-muted);
   }
+  /* Selected auto-match variant: an accent inset border (the button no longer enqueues on
+     tap; the Start button confirms the choice). */
+  .variant.selected {
+    border-color: var(--accent);
+    box-shadow: inset 0 0 0 2px var(--accent);
+  }
   .movelimit {
     margin: 0;
     text-align: center;