feat(ui): per-kind active-game limit lock on the New Game screen

Carry the caller's per-tier active-game caps and each game's kind on the
wire (Profile.game_limits + GameView.kind, additive FBS + gateway transcode
+ client codec, committed regen). The New Game screen counts the player's
active games per kind from the lobby and locks a capped start: an outline
button with a lock that opens a funnel modal instead of a game -- a sign-in
prompt for a guest, a "finish a current game first" notice for a signed-in
account (native Telegram popup, in-app modal elsewhere). The lock lifts via
the existing profile refetch after a guest->durable upgrade.

Remove the lobby's old at_game_limit New-Game tab disable + notice: the flag
(now the random-kind cap) conflicted with the per-kind lock -- it hid the
screen where the lock lives and wrongly blocked an unfulfilled kind. The New
Game tab is always enabled; the per-kind start lock is the only gate. The
at_game_limit wire field stays (unused by the client) for a later cleanup.

Tests: client lock logic + codec kind/game_limits roundtrip + gateway
transcode encode + native popup builders (unit); a mock e2e for the lock
badge and the modal.

ui/src/screens/Lobby.svelte

@@ -23,12 +23,6 @@
   let games = $state<GameView[]>([]);
   let invitations = $state<Invitation[]>([]);
   let incoming = $state<AccountRef[]>([]);
-  // True when the player has reached the simultaneous quick-game cap: the "New Game" tab is
-  // disabled and a notice shows under the lists. It rides the games.list response (which the
-  // lobby refetches on entry and on every game event) and the cached snapshot, so it renders
-  // in its last known state instantly and refreshes in the background. Optimistic default
-  // (enabled) for the very first, uncached load; the backend gate is the authority.
-  let atGameLimit = $state(false);
 
   const guest = $derived(app.profile?.isGuest ?? true);
   // The lobby ⚙️ badge is the shared count: incoming friend requests plus an awaiting
@@ -51,9 +45,8 @@
       games = local;
       invitations = [];
       incoming = [];
-      atGameLimit = false;
       app.notifications = 0;
-      setLobby({ games, invitations, incoming, atGameLimit, offline: offlineMode.active });
+      setLobby({ games, invitations, incoming, offline: offlineMode.active });
       app.lobbyReady = true;
       return;
     }
@@ -64,7 +57,6 @@
       // Seed the per-game unread badges from the authoritative list. The live stream only raises
       // unread (it never seeds it from a GameView), so a persisted unread survives a reload here.
       for (const g of games) seedChatUnread(g.id, g.unreadChat, g.unreadMessages);
-      atGameLimit = list.atGameLimit;
       if (!guest) {
         const [inv, inc] = await Promise.all([gateway.invitationsList(), gateway.friendsIncoming()]);
         if (seq !== loadSeq) return;
@@ -75,7 +67,7 @@
         app.notifications = incoming.length;
         void refreshFeedbackBadge();
       }
-      setLobby({ games, invitations, incoming, atGameLimit, offline: offlineMode.active });
+      setLobby({ games, invitations, incoming, offline: offlineMode.active });
       // Warm the cache for the ongoing games so opening one from the lobby is instant. The list
       // just loaded, so the connection is up; the call is non-blocking and re-running it on each
       // lobby refresh cheaply warms any newly appeared game (already-cached ones are skipped).
@@ -103,7 +95,6 @@
       games = cached.games;
       invitations = cached.invitations;
       incoming = cached.incoming;
-      atGameLimit = cached.atGameLimit;
     }
     void load();
   });
@@ -231,7 +222,7 @@
     revealedId = null;
     const prev = games;
     games = games.filter((g) => g.id !== id); // optimistic; the backend already filters it out
-    setLobby({ games, invitations, incoming, atGameLimit, offline: offlineMode.active });
+    setLobby({ games, invitations, incoming, offline: offlineMode.active });
     try {
       // A local (offline) game is deleted from the device store; an online game is hidden on the
       // backend. Routing by id keeps the delete off the network for a local game (the transport
@@ -240,7 +231,7 @@
       else await gateway.hideGame(id);
     } catch (e) {
       games = prev;
-      setLobby({ games, invitations, incoming, atGameLimit, offline: offlineMode.active });
+      setLobby({ games, invitations, incoming, offline: offlineMode.active });
       handleError(e);
     }
   }
@@ -379,10 +370,6 @@
     {#if !games.length && !invitations.length}
       <p class="empty">{t('lobby.noActive')}</p>
     {/if}
-
-    {#if atGameLimit}
-      <p class="limit">{t('lobby.limitReached')}</p>
-    {/if}
   </div>
 
   {#if declineTarget}
@@ -411,7 +398,7 @@
 
   {#snippet tabbar()}
     <TabBar>
-      <button class="tab" disabled={atGameLimit} onclick={() => navigate('/new')}>
+      <button class="tab" onclick={() => navigate('/new')}>
         <span class="sq" data-coach="lobby-new">🎲</span><span class="lbl">{t('lobby.new')}</span>
       </button>
       <button class="tab" disabled={offlineMode.active} onclick={() => navigate('/stats')}>
@@ -444,13 +431,6 @@
     font-size: 0.9rem;
     margin: 0;
   }
-  /* A plain, low-emphasis line under the lists when the simultaneous-game cap is reached. */
-  .limit {
-    color: var(--text-muted);
-    font-size: 0.9rem;
-    margin: 0;
-    text-align: center;
-  }
   .invite {
     display: flex;
     align-items: center;

ui/src/screens/NewGame.svelte

@@ -2,7 +2,11 @@
   import { onMount } from 'svelte';
   import Screen from '../components/Screen.svelte';
   import Modal from '../components/Modal.svelte';
+  import GameLimitModal from '../components/GameLimitModal.svelte';
   import PinPad, { type PinResult } from '../components/PinPad.svelte';
+  import { getLobby } from '../lib/lobbycache';
+  import { isKindLocked } from '../lib/gamelimits';
+  import { GameKind } from '../lib/model';
   import { gateway } from '../lib/gateway';
   import { app, handleError, showToast } from '../lib/app.svelte';
   import { connection } from '../lib/connection.svelte';
@@ -51,6 +55,14 @@
   // or a random human via auto-match. AI is the default.
   let opponent = $state<'ai' | 'random'>('ai');
 
+  // Active-game limit lock: the auto-start kind (vs_ai or random by the opponent choice) tested
+  // against the caller's per-kind cap over the online lobby's active games. A capped start opens the
+  // funnel modal instead of enqueuing (the server also refuses it); offline never locks (local
+  // games are uncapped). The lock lifts when the profile is re-fetched after a guest→durable upgrade.
+  const autoKind = $derived(opponent === 'ai' ? GameKind.vsAi : GameKind.random);
+  const autoLocked = $derived(!offlineMode.active && isKindLocked(getLobby(false)?.games ?? [], app.profile?.gameLimits, autoKind));
+  let limitOpen = $state(false);
+
   // --- auto-match ---
   // Enqueue drops the player straight into a real game — a freshly opened one awaiting an
   // opponent, or another player's open game they just joined — so we navigate into it at once
@@ -329,9 +341,16 @@
         {#if opponent === 'random'}<p class="searchhint">{t('new.searchHint')}</p>{/if}
         <button
           class="invite"
-          disabled={!selectedAuto || (!connection.online && !offlineMode.active) || starting}
-          onclick={() => selectedAuto && find(selectedAuto)}
-        >{t('new.start')}</button>
+          class:locked={autoLocked}
+          disabled={(autoLocked ? false : !selectedAuto) || (!connection.online && !offlineMode.active) || starting}
+          onclick={() => (autoLocked ? (limitOpen = true) : selectedAuto && find(selectedAuto))}
+        >{#if autoLocked}🔒 {/if}{t('new.start')}</button>
+        <GameLimitModal
+          open={limitOpen}
+          {guest}
+          onclose={() => (limitOpen = false)}
+          onlogin={() => { limitOpen = false; navigate('/settings'); }}
+        />
       {:else if offlineMode.active}
         <!-- Offline pass-and-play (hotseat): a device-local 2-4 human game. The host sets a master
              PIN first (it gates the roster); each seat may add its own PIN. -->
@@ -660,6 +679,12 @@
   .invite:disabled {
     opacity: 0.5;
   }
+  /* A capped start (the active-game limit): an outline instead of the filled CTA, with a 🔒, so it
+     reads as gated rather than ready. Tapping it opens the funnel modal, never a game. */
+  .invite.locked {
+    background: transparent;
+    color: var(--accent);
+  }
   .searchhint {
     margin: 0;
     text-align: center;