feat(game): finished-game export as a PNG image behind a format chooser

The history header's export button now opens a chooser — Telegram's
native popup inside Telegram, the app's own modal elsewhere — offering
the GCG file and a new client-rendered PNG of the final position
(lib/gameimage, Canvas 2D, lazy dynamic import, zero dependencies):
light theme, classic A..O/1..15 axes, label-free premium fills, and a
fixed-typography per-seat scoresheet with GCG-style move coordinates,
multi-word sub-lines, endgame rack-settlement row, winner trophy and a
hostname + device-locale finish date footer; a long game stretches the
board, never the typography.

Delivery mirrors the GCG rules (Web Share with no blob fallback, else
download) except on Android Telegram/VK WebViews and the desktop VK
iframe, where a binary PNG has no clipboard-text fallback: those get a
preview modal with a long-press/right-click save hint and a copy-image
button where ClipboardItem exists.

ui/e2e/export.spec.ts

@@ -0,0 +1,90 @@
+import { expect, test, type Page } from './fixtures';
+
+// The finished-game export: the history header's 📤 button opens a format chooser —
+// the GCG file or the rendered PNG image (lib/gameimage) — as a native Telegram popup
+// inside Telegram and as the app's own modal elsewhere. g3 ("vs Rick") is the seeded
+// finished game. Web Share is force-disabled per test so every engine deterministically
+// exercises the download (plain browser) or preview (in-app webview) branch.
+
+async function disableWebShare(page: Page): Promise<void> {
+  await page.addInitScript(() => {
+    Object.defineProperty(navigator, 'canShare', { value: () => false, configurable: true });
+    Object.defineProperty(navigator, 'share', { value: undefined, configurable: true });
+  });
+}
+
+async function openFinishedHistory(page: Page): Promise<void> {
+  await page.goto('/');
+  await page.getByRole('button', { name: /guest/i }).click();
+  await page.getByRole('button', { name: /Rick/ }).click();
+  await expect(page.locator('[data-cell]').first()).toBeVisible();
+  await page.locator('.scoreboard').click();
+  await expect(page.getByRole('button', { name: 'Export game' })).toBeVisible();
+}
+
+test('the export chooser downloads the PNG image on a plain browser', async ({ page }) => {
+  await disableWebShare(page);
+  await openFinishedHistory(page);
+  await page.getByRole('button', { name: 'Export game' }).click();
+
+  // The app's own chooser modal (not inside Telegram) offers both formats.
+  await expect(page.getByRole('button', { name: 'GCG file' })).toBeVisible();
+  const download = page.waitForEvent('download');
+  await page.getByRole('button', { name: 'Image (PNG)' }).click();
+  expect((await download).suggestedFilename()).toMatch(/^game-.+\.png$/);
+});
+
+test('the export chooser downloads the GCG file on a plain browser', async ({ page }) => {
+  await disableWebShare(page);
+  await openFinishedHistory(page);
+  await page.getByRole('button', { name: 'Export game' }).click();
+
+  const download = page.waitForEvent('download');
+  await page.getByRole('button', { name: 'GCG file' }).click();
+  expect((await download).suggestedFilename()).toMatch(/^game-.+\.gcg$/);
+});
+
+test('inside Telegram the chooser is the native popup and the image lands in the preview modal', async ({
+  page,
+}) => {
+  await disableWebShare(page);
+  // A Telegram WebApp stub whose showPopup records its params and picks the image option —
+  // the native-chooser path. With no Web Share in the webview, the image must land in the
+  // long-press preview modal (the Android Telegram delivery), never a dead <a download>.
+  await page.addInitScript(() => {
+    Object.assign(window, {
+      Telegram: {
+        WebApp: {
+          initData: 'query_id=test&user=%7B%22id%22%3A1%7D&auth_date=1&hash=deadbeef',
+          initDataUnsafe: {},
+          ready() {},
+          expand() {},
+          showPopup(params: unknown, cb: (id: string) => void) {
+            (window as unknown as { __popup?: unknown }).__popup = params;
+            setTimeout(() => cb('image'), 0);
+          },
+        },
+      },
+    });
+  });
+  await page.goto('/');
+  await expect(page.getByText('Your turn')).toBeVisible(); // auto-authenticated lobby
+  await page.getByRole('button', { name: /Rick/ }).click();
+  await expect(page.locator('[data-cell]').first()).toBeVisible();
+  await page.locator('.scoreboard').click();
+  await page.getByRole('button', { name: 'Export game' }).click();
+
+  // The native popup carried both formats plus cancel (≤3 buttons, Bot API 6.2)…
+  const popup = await page.evaluate(
+    () => (window as unknown as { __popup?: { buttons?: { id?: string; type?: string }[] } }).__popup,
+  );
+  expect(popup?.buttons?.map((b) => b.id ?? b.type)).toEqual(['image', 'gcg', 'cancel']);
+  // …and no in-app chooser modal was mounted.
+  await expect(page.getByRole('button', { name: 'GCG file' })).toHaveCount(0);
+
+  // The preview modal shows the rendered PNG as a data: URL (long-press-saveable) + the hint.
+  const img = page.locator('.export-preview');
+  await expect(img).toBeVisible();
+  expect(await img.getAttribute('src')).toMatch(/^data:image\/png/);
+  await expect(page.locator('.export-hint')).toBeVisible();
+});

ui/e2e/quickmatch.spec.ts

@@ -80,7 +80,7 @@ test('AI game: after it ends, no GCG export and no comms entry', async ({ page }
   // Reopen the history (resigning auto-closed it): the finished AI game offers no GCG export and
   // no comms entry at all.
   await page.locator('.scoreboard').click();
-  await expect(page.getByRole('button', { name: 'Export GCG' })).toHaveCount(0);
+  await expect(page.getByRole('button', { name: 'Export game' })).toHaveCount(0);
   await expect(page.getByRole('button', { name: 'Chat' })).toHaveCount(0);
 });
 

ui/e2e/social.spec.ts

@@ -154,14 +154,14 @@ test('GCG export appears only for a finished game', async ({ page }) => {
   // The finished game vs Kaya exposes export 📤 in the history header.
   await page.getByRole('button', { name: /Kaya/ }).click();
   await page.locator('.scoreboard').click(); // open the history
-  await expect(page.getByRole('button', { name: 'Export GCG' })).toBeVisible();
+  await expect(page.getByRole('button', { name: 'Export game' })).toBeVisible();
 });
 
 test('GCG export is hidden for an active game', async ({ page }) => {
   await loginLobby(page);
   await page.getByRole('button', { name: /Ann/ }).click();
   await page.locator('.scoreboard').click(); // open the history (shows 🏁 leave, not 📤 export)
-  await expect(page.getByRole('button', { name: 'Export GCG' })).toHaveCount(0);
+  await expect(page.getByRole('button', { name: 'Export game' })).toHaveCount(0);
 });
 
 test('finished game draws an inert footer and trims live-only controls', async ({ page }) => {
@@ -172,7 +172,7 @@ test('finished game draws an inert footer and trims live-only controls', async (
   await expect(page.locator('.tab').first()).toBeDisabled();
   // The history header offers Export GCG, not Drop game, once the game is over.
   await page.locator('.scoreboard').click();
-  await expect(page.getByRole('button', { name: 'Export GCG' })).toBeVisible();
+  await expect(page.getByRole('button', { name: 'Export game' })).toBeVisible();
   await expect(page.getByRole('button', { name: 'Drop game' })).toHaveCount(0);
   // The comms hub offers Chat only — the Dictionary tab is hidden for a finished game.
   await page.getByRole('button', { name: 'Chat' }).click(); // 💬