feat(export): server-rendered artifacts behind one signed download URL

The finished-game export now works identically on every platform: the
client mints a signed relative URL (game.export_url) carrying its date
locale, IANA time zone and localized non-play labels, resolves it
against its own origin and hands it to the platform's native download —
Telegram downloadFile, VKWebAppDownloadFile, or a plain browser anchor
(also the desktop VK iframe). Both artifacts ride the route: the .gcg
text (no more clipboard mode, except the legacy pre-8.0 Telegram
fallback) and the PNG of the final position.

The PNG is rasterized by a new internal 'renderer' sidecar (node:22-slim
+ skia-canvas + baked Liberation/Noto Color Emoji fonts) executing the
SAME ui/src/lib/gameimage.ts the web project unit-tests, bundled at
image build time — one renderer, no drift; the browser no longer draws
or delivers bytes itself. The backend rebuilds the render payload from
the journal + engine.AlphabetTable, verifies the HMAC (10-minute TTL,
BACKEND_EXPORT_SIGN_KEY, constant-time, uniform 404s) on its public
group, and streams the artifact as a named attachment; the gateway
forwards /dl/* behind the per-IP public rate limiter (caddy @gateway
matcher extended — the landing catch-all trap).

Deploy: renderer service (compose + prod overlay + roll before backend
+ prod push list), EXPORT_SIGN_KEY env (TEST_/PROD_ secrets), CI runs
the sidecar smoke in the ui job. Docs: ARCHITECTURE export-delivery
section, FUNCTIONAL(+_ru), UI_DESIGN, TESTING, deploy/README.

ui/src/lib/gameimage.ts

@@ -1,12 +1,12 @@
 // Finished-game PNG export: a light-theme snapshot of the final board (classic A..O / 1..15
 // axes) with a compact per-seat scoresheet beside it. Everything is drawn by hand on a
-// Canvas 2D — no dependencies — and the module is reached only through a dynamic import, so
-// it stays out of the startup bundle. The scoresheet typography is fixed; the board instead
-// stretches to the scoresheet's height (never below MIN_SIDE), so a long game grows the
-// board rather than leaving a hole under it.
+// Canvas 2D — no dependencies. The module is the SHARED source of truth for the export
+// image: the render sidecar bundles it (renderer/src/entry.ts) and rasterizes on
+// skia-canvas, while this ui project keeps the pure parts unit-tested (the browser app
+// itself no longer imports it — delivery is the server's signed URL).
 //
-// buildScoresheet and layoutImage are pure (vitest-covered); renderGameImage is the thin
-// canvas pass exercised by the Playwright e2e.
+// buildScoresheet and layoutImage are pure (vitest-covered); drawGameImage is the thin
+// canvas pass exercised by the sidecar's node test.
 
 import type { GameView, MoveRecord, Variant } from './model';
 import { replay } from './board';
@@ -56,16 +56,22 @@ export interface Scoresheet {
 }
 
 /** formatFinishedDate renders the game's finish time for the footer in the DEVICE locale
- *  (regional date conventions, not the UI language) — e.g. "3 июля 2026 г., 16:23".
- *  dateLocale is for tests; production passes undefined = the system default. */
-export function formatFinishedDate(unixSec: number, dateLocale?: string): string {
-  return new Intl.DateTimeFormat(dateLocale, {
+ *  and time zone (regional conventions, not the UI language) — e.g. "3 июля 2026 г., 16:23".
+ *  Both ride in from the client on a server render; an invalid zone falls back to the
+ *  process default rather than failing the whole image. */
+export function formatFinishedDate(unixSec: number, dateLocale?: string, timeZone?: string): string {
+  const opts: Intl.DateTimeFormatOptions = {
     year: 'numeric',
     month: 'long',
     day: 'numeric',
     hour: '2-digit',
     minute: '2-digit',
-  }).format(new Date(unixSec * 1000));
+  };
+  try {
+    return new Intl.DateTimeFormat(dateLocale, { ...opts, timeZone }).format(new Date(unixSec * 1000));
+  } catch {
+    return new Intl.DateTimeFormat(dateLocale, opts).format(new Date(unixSec * 1000));
+  }
 }
 
 /**
@@ -78,7 +84,7 @@ export function buildScoresheet(
   game: GameView,
   moves: MoveRecord[],
   actionLabel: (action: string) => string,
-  opts?: { hostname?: string; dateLocale?: string },
+  opts?: { hostname?: string; dateLocale?: string; timeZone?: string },
 ): Scoresheet {
   const seats = game.seats;
   const grid = historyGrid(moves, seats.length, null);
@@ -106,7 +112,7 @@ export function buildScoresheet(
     rows,
     adjustments,
     hasAdjustments: adjustments.some((a) => a !== 0),
-    footer: `${host} · ${formatFinishedDate(game.lastActivityUnix, opts?.dateLocale)}`,
+    footer: `${host} · ${formatFinishedDate(game.lastActivityUnix, opts?.dateLocale, opts?.timeZone)}`,
   };
 }
 
@@ -190,27 +196,36 @@ export interface RenderOptions {
   hostname?: string;
   /** Footer date locale override (defaults to the device locale) — for tests. */
   dateLocale?: string;
+  /** Footer IANA time zone (the device zone on a server render; defaults to local). */
+  timeZone?: string;
   /** Canvas pixel scale (default 2 — crisp on hi-dpi screens and in chats). */
   scale?: number;
 }
 
+/** CanvasLike is the minimal canvas surface drawGameImage needs — satisfied by both the
+ *  browser HTMLCanvasElement and the render sidecar's skia-canvas Canvas, so the drawing
+ *  code is shared verbatim between the two runtimes. */
+export interface CanvasLike {
+  width: number;
+  height: number;
+  getContext(contextId: '2d'): CanvasRenderingContext2D | null;
+}
+
 /**
- * renderGameImage draws the finished game as a PNG blob: final board with classic axes on
- * the left, the scoresheet on the right, the site + finish date at the bottom. Light theme
- * always; no last-move highlight (an archival artifact, not a live frame).
+ * drawGameImage sizes the canvas and draws the finished game onto it: final board with
+ * classic axes on the left, the scoresheet on the right, the site + finish date at the
+ * bottom. Light theme always; no last-move highlight (an archival artifact, not a live
+ * frame). The caller owns the canvas and its PNG encoding (toBlob in the browser,
+ * toBuffer in the sidecar).
  */
-export async function renderGameImage(
-  game: GameView,
-  moves: MoveRecord[],
-  opts: RenderOptions,
-): Promise<Blob> {
+export function drawGameImage(canvas: CanvasLike, game: GameView, moves: MoveRecord[], opts: RenderOptions): void {
   const sheet = buildScoresheet(game, moves, opts.actionLabel, {
     hostname: opts.hostname,
     dateLocale: opts.dateLocale,
+    timeZone: opts.timeZone,
   });
   const layout = layoutImage(sheet);
   const scale = opts.scale ?? 2;
-  const canvas = document.createElement('canvas');
   canvas.width = Math.round(layout.w * scale);
   canvas.height = Math.round(layout.h * scale);
   const ctx = canvas.getContext('2d');
@@ -228,12 +243,9 @@ export async function renderGameImage(
   ctx.textAlign = 'left';
   ctx.textBaseline = 'alphabetic';
   ctx.fillText(sheet.footer, layout.margin, layout.h - layout.margin - 6);
-
-  return new Promise<Blob>((resolve, reject) => {
-    canvas.toBlob((b) => (b ? resolve(b) : reject(new Error('gameimage: toBlob failed'))), 'image/png');
-  });
 }
 
+
 function drawAxes(ctx: CanvasRenderingContext2D, l: ImageLayout): void {
   const { x, y, cell } = l.board;
   ctx.fillStyle = C.muted;