fix: center trick pile; add error boundary (surface post-buy crash)

- Trick area: smaller offsets (±50/52) + retuned scale so the played pile sits
  centered in the felt instead of flung out to the side seats.
- ErrorBoundary around screens + overlays: a render error now shows a recoverable
  in-app message with the cause (and logs componentStack) instead of the browser's
  blank "page couldn't load" — helps pinpoint the post-purchase crash.

Verified: tsc + next build clean; web rebuilt on :1500.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/components/GameTable.tsx

@@ -65,7 +65,7 @@ export function GameTable({
   const exit = onExit ?? reset;
   const vw = useViewportWidth();
   // Pull the played-card pile inward on narrow screens so it clears the side stacks.
-  const trickScale = vw < 360 ? 0.5 : vw < 460 ? 0.6 : 1;
+  const trickScale = vw < 400 ? 0.82 : 1;
   // Smaller played cards on phones so the center pile stays clear of the side seats.
   const trickCardSize: "sm" | "md" = vw < 480 ? "sm" : "md";
   const { phase, players, hakem, trump, turn, currentTrick } = game;
@@ -410,11 +410,13 @@ function OpponentHand({
 
 /* ----------------------------- Trick area ----------------------------- */
 
+// Compact, centered cross — small magnitudes keep the played pile in the middle of
+// the felt (clear of the side seats/stacks). Each card still nudges toward its player.
 const TRICK_OFFSET: Record<Seat, { x: number; y: number }> = {
-  0: { x: 0, y: 70 },
-  1: { x: 96, y: 0 },
-  2: { x: 0, y: -70 },
-  3: { x: -96, y: 0 },
+  0: { x: 0, y: 52 },
+  1: { x: 50, y: 0 },
+  2: { x: 0, y: -52 },
+  3: { x: -50, y: 0 },
 };
 const TRICK_ENTER: Record<Seat, { x: number; y: number }> = {
   0: { x: 0, y: 260 },