Add self-contained docker/ stack for the web UI

`docker/` now holds the whole web build — frontend (Vite + React + CanvasKit),
backend (Fastify + SQLite) and the compose file — so the folder can be moved to
another machine and run without the React Native project:

    cd docker && cp .env.example .env && docker compose up -d --build

Only `${WEB_PORT:-8090}` is published; nginx serves the SPA and proxies /api to
the `api` container over Docker's DNS. Photos never reach the server.

The shared render code is vendored into `docker/frontend/shared/` and aliased to
a CanvasKit shim, so the app's own frameUtils/toneShader/jpegDpi run unchanged.

Fix the all-black render on GPU surfaces: `MakeWebGLCanvasSurface` creates a
separate WebGL context per call, and a texture from one context cannot be
sampled by a surface on another — so any pass that drew a snapshot onto a second
surface (output sharpen, screen sharpen, polaroid/wallframe cards) came out
solid black, while the raster fallback was correct. Use one shared
GrDirectContext + MakeRenderTarget instead.

Verified in headless Chromium against the running stack: 12MP JPEG in, preview
mean=120.5 sd=60.5, export 2048x1536 mean=107.2 sd=62.1, JFIF density 300/300,
EXIF present, no console errors; health/signup/login/me/recipes all 2xx through
the nginx proxy.

docker/frontend/src/engine/imageOps.ts

@@ -0,0 +1,58 @@
+import exifr from 'exifr';
+import type { GPSInfo } from '../../shared/types';
+
+// Browser-side input handling: turn a dropped File into the source bytes the
+// engine wants, plus the two derived things the UI needs — a smaller copy for
+// the live preview, and whatever GPS the photo already carries.
+
+export async function fileToBytes(file: File | Blob): Promise<Uint8Array> {
+  return new Uint8Array(await file.arrayBuffer());
+}
+
+// Preview renders run on a downscaled copy: the grade is pixel-wise, so grading
+// a 1600px copy shows the same look, and it keeps the slider responsive. Export
+// always runs on the original bytes.
+export async function resizedJpeg(bytes: Uint8Array, maxDim: number, quality = 0.92): Promise<Uint8Array> {
+  const bitmap = await createImageBitmap(new Blob([bytes as BlobPart]));
+  try {
+    const longest = Math.max(bitmap.width, bitmap.height);
+    if (longest <= maxDim) return bytes;
+    const scale = maxDim / longest;
+    const w = Math.max(1, Math.round(bitmap.width * scale));
+    const h = Math.max(1, Math.round(bitmap.height * scale));
+    const canvas = new OffscreenCanvas(w, h);
+    const ctx = canvas.getContext('2d');
+    if (!ctx) return bytes;
+    ctx.drawImage(bitmap, 0, 0, w, h);
+    const blob = await canvas.convertToBlob({ type: 'image/jpeg', quality });
+    return new Uint8Array(await blob.arrayBuffer());
+  } finally {
+    bitmap.close();
+  }
+}
+
+// EXIF GPS of the loaded photo, in the shape the renderer + EXIF writer expect.
+// Returns null when the photo has none — the caller then offers manual entry.
+export async function readGps(bytes: Uint8Array): Promise<GPSInfo | null> {
+  try {
+    const gps = await exifr.gps(bytes);
+    if (!gps || typeof gps.latitude !== 'number' || typeof gps.longitude !== 'number') return null;
+    return {
+      latitude: gps.latitude,
+      longitude: gps.longitude,
+      timestamp: Date.now(),
+      source: 'exif',
+    };
+  } catch {
+    return null;
+  }
+}
+
+export function download(bytes: Uint8Array, filename: string): void {
+  const url = URL.createObjectURL(new Blob([bytes as BlobPart], { type: 'image/jpeg' }));
+  const a = document.createElement('a');
+  a.href = url;
+  a.download = filename;
+  a.click();
+  setTimeout(() => URL.revokeObjectURL(url), 10_000);
+}