Daily Word mobile: true viewport + flat warm keyboard + height-aware tiles

Make Daily Word feel like a focused mobile app screen, not a page with a keyboard.
* True viewport: while view==='play' && game==='word', a $effect locks body scroll
  and hides the site footer (mobile only), so the keyboard is genuinely pinned, not
  riding the document scroll. Effect cleanup ALWAYS removes the class on re-run or
  unmount, so leaving /play (back button OR any navigation) can never strand it.
* Keyboard restyled on-brand + modern: flat off-white (--surface) keys with a
  hairline border, soft 11px radius, no heavy raised shadow, ~46px tall, ↵ / ⌫
  glyphs, centered (max-width 430) instead of a full-bleed beige slab.
* Tiles now size to fit BOTH width and the height left above the keyboard
  (--tile = min(cap, width/cols, (100dvh-budget)/rows), gap 4px), so the active row
  and keyboard are always visible — Long Word's 6×7 gets slightly smaller tiles.

Real-device Safari/Chrome is the final check (100dvh + safe-area handling).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/routes/play/+page.svelte

@@ -73,6 +73,16 @@
 
   function openGame(g) { game = g; view = 'select'; refreshStatus(); }
   function pick(v) { if (game === 'word') variant = v; else wsSize = v; view = 'play'; }
+
+  // Daily Word on mobile = a focused viewport: lock scroll + hide footer. Cleanup
+  // ALWAYS removes the class (re-run or unmount), so leaving /play can't strand it.
+  $effect(() => {
+    if (typeof document === 'undefined') return;
+    if (view === 'play' && game === 'word') {
+      document.documentElement.classList.add('playing-word');
+      return () => document.documentElement.classList.remove('playing-word');
+    }
+  });
   function back() {
     view = view === 'play' ? 'select' : 'hub';
     refreshStatus();