Apply velvet-table redesign, fix game lifecycle and history bugs

Frontend:
- Dark green/gold "velvet table" visual redesign across the whole app
  (Auth, Lobby, GameList, GameTable, History, GameOver, modals), with
  Playfair Display/DM Sans typography and a centralized Tailwind palette.
- Desktop game table fit-scales to fill the window; mobile gets
  overlapping hand/trick layouts and larger touch-friendly cards.
- Standings sidebar now groups completed rounds by series with a
  per-series subtotal row, struck-through tips on missed bids.
- History page rewritten into a scoreboard-style detail view (player
  totals beside names, series grouped 2-up on desktop / stacked on
  mobile) and gained game names, completed/abandoned status, and a
  button to reopen a prematurely-ended game back into the lobby.

Backend:
- Fix started games being deleted from memory (and vanishing from
  everyone's lobby) when all players disconnect; only `end_game` tears
  down a started game now.
- Fix a crash writing a timezone-aware datetime into the naive
  `ended_at` Postgres column.
- Add `reopen_game`/`restore_game` to un-end a prematurely-ended game
  from history and resume it from the lobby.
- Let any seated player end an abandoned game once the host is
  offline, not just the host, so the game isn't stuck forever.
- Expose SERIES_PER_GAME/ROUNDS_PER_SERIES as named constants on the
  engine so the persistence layer derives game-completion rules from
  bridzik.py instead of re-encoding them.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

frontend/src/lib/useFitScale.ts

@@ -0,0 +1,45 @@
+import { useLayoutEffect, useRef, useState } from 'react';
+
+/**
+ * Zooms the desktop board to fill the whole window. The board is a canvas of
+ * fixed height (`designHeight`) whose width is computed to span the viewport,
+ * and the scale is driven by height — so everything (cards, circles, text,
+ * header) grows and shrinks together while the felt always uses the full width.
+ *
+ * Returns the container ref (the viewport), the `scale` for `transform`, and
+ * `contentWidth` — the pre-scale canvas width (`viewportWidth / scale`) so that
+ * after scaling it exactly fills the viewport width.
+ *
+ * `deps` should change when the layout swaps (mobile↔desktop) so the observer
+ * re-attaches to the freshly rendered element.
+ */
+export function useFitScale(deps: unknown[] = [], designHeight = 860, maxScale = 2.6) {
+  const containerRef = useRef<HTMLDivElement>(null);
+  const [box, setBox] = useState({ scale: 1, contentWidth: 1280 });
+
+  useLayoutEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+
+    const measure = () => {
+      const availW = el.clientWidth;
+      const availH = el.clientHeight;
+      if (!availW || !availH) return;
+      const scale = Math.min(maxScale, availH / designHeight);
+      const contentWidth = availW / scale;
+      setBox((prev) =>
+        Math.abs(prev.scale - scale) > 0.004 || Math.abs(prev.contentWidth - contentWidth) > 1
+          ? { scale, contentWidth }
+          : prev,
+      );
+    };
+
+    measure();
+    const ro = new ResizeObserver(measure);
+    ro.observe(el);
+    return () => ro.disconnect();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, deps);
+
+  return { containerRef, scale: box.scale, contentWidth: box.contentWidth };
+}