UI: tab-bar navigation — drop the hamburger

Replace Menu.svelte (hamburger) everywhere with tab-bar navigation:
- Settings hub (SettingsHub) from the lobby ⚙️ tab: Settings/Profile/
  Friends/About as in-place tabs, back → lobby; the lobby ⚙️ badge counts
  incoming friend requests (invitations keep their own lobby section).
- Comms hub (CommsHub) from the move-history 💬: Chat/Dictionary tabs,
  back → game; Dictionary only while the game is active.
- Game menu items relocate into the open history: 🏁 leave / 📤 export in
  the header, 🤝 add-friend per opponent card, 💬 comms; unread chat is
  badged on the score bar + the 💬.
- TapConfirm (tap → fading ✅ → tap) replaces the Skip/Hint press-and-hold
  popovers and drives the add-friend confirm.
- Fix the move-history "jump": the slid board is inert and the stage can't
  scroll, so a swipe up genuinely closes the history.

Remove Menu.svelte + HoldConfirm.svelte. Docs: UI_DESIGN, FUNCTIONAL(+ru),
PRERELEASE. UI check/unit/build/bundle/e2e (Chromium+WebKit) all green.

ui/src/screens/Settings.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-  import Screen from '../components/Screen.svelte';
   import {
     app,
     setBoardLabels,
@@ -28,64 +27,62 @@
   };
 </script>
 
-<Screen title={t('settings.title')} back="/">
-  <div class="page">
-    {#if !insideTelegram()}
-      <section>
-        <h3>{t('settings.theme')}</h3>
-        <div class="seg">
-          {#each themes as th (th)}
-            <button class="opt" class:active={app.theme === th} onclick={() => setTheme(th)}>
-              {t(themeLabel[th])}
-            </button>
-          {/each}
-        </div>
-      </section>
-    {/if}
-
+<div class="page">
+  {#if !insideTelegram()}
     <section>
-      <h3>{t('settings.language')}</h3>
+      <h3>{t('settings.theme')}</h3>
       <div class="seg">
-        {#each locales as lc (lc)}
-          <button class="opt" class:active={app.locale === lc} onclick={() => setLocalePref(lc)}>
-            {t(lc === 'en' ? 'lang.en' : 'lang.ru')}
+        {#each themes as th (th)}
+          <button class="opt" class:active={app.theme === th} onclick={() => setTheme(th)}>
+            {t(themeLabel[th])}
           </button>
         {/each}
       </div>
     </section>
+  {/if}
 
-    <section>
-      <h3>{t('settings.boardStyle')}</h3>
-      <div class="sub">{t('settings.boardLabels')}</div>
-      <div class="seg">
-        {#each labelModes as lm (lm)}
-          <button class="opt" class:active={app.boardLabels === lm} onclick={() => setBoardLabels(lm)}>
-            {t(labelModeKey[lm])}
-          </button>
-        {/each}
-      </div>
-      <label class="row gridlines">
-        <span>{t('settings.boardLines')}</span>
-        <input
-          type="checkbox"
-          checked={app.boardLines}
-          onchange={(e) => setBoardLines(e.currentTarget.checked)}
-        />
-      </label>
-    </section>
+  <section>
+    <h3>{t('settings.language')}</h3>
+    <div class="seg">
+      {#each locales as lc (lc)}
+        <button class="opt" class:active={app.locale === lc} onclick={() => setLocalePref(lc)}>
+          {t(lc === 'en' ? 'lang.en' : 'lang.ru')}
+        </button>
+      {/each}
+    </div>
+  </section>
 
-    <section>
-      <label class="row">
-        <span>{t('settings.reduceMotion')}</span>
-        <input
-          type="checkbox"
-          checked={app.reduceMotion}
-          onchange={(e) => setReduceMotion(e.currentTarget.checked)}
-        />
-      </label>
-    </section>
-  </div>
-</Screen>
+  <section>
+    <h3>{t('settings.boardStyle')}</h3>
+    <div class="sub">{t('settings.boardLabels')}</div>
+    <div class="seg">
+      {#each labelModes as lm (lm)}
+        <button class="opt" class:active={app.boardLabels === lm} onclick={() => setBoardLabels(lm)}>
+          {t(labelModeKey[lm])}
+        </button>
+      {/each}
+    </div>
+    <label class="row gridlines">
+      <span>{t('settings.boardLines')}</span>
+      <input
+        type="checkbox"
+        checked={app.boardLines}
+        onchange={(e) => setBoardLines(e.currentTarget.checked)}
+      />
+    </label>
+  </section>
+
+  <section>
+    <label class="row">
+      <span>{t('settings.reduceMotion')}</span>
+      <input
+        type="checkbox"
+        checked={app.reduceMotion}
+        onchange={(e) => setReduceMotion(e.currentTarget.checked)}
+      />
+    </label>
+  </section>
+</div>
 
 <style>
   .page {