feat(web): clamp tabletop camera to the horizon

Add a maxPolarAngle prop to Scene and use it in the tabletop view so the
camera can't dip below the table and peek under face-down cards.

apps/web/src/components/viewers/Scene.tsx

@@ -16,7 +16,9 @@ import { EffectComposer, Vignette } from '@react-three/postprocessing';
  *
  * `autoRotate` and `enablePan` tune the orbit controls (a tabletop view, for
  * example, pans instead of rotating). `fullscreen` adds a toggle button that
- * expands the scene to the full screen.
+ * expands the scene to the full screen. `maxPolarAngle` (radians) clamps how
+ * far the camera can tilt below the horizon, e.g. to stop a tabletop view from
+ * peeking under face-down cards.
  */
 export default function Scene({
   children,
@@ -25,6 +27,7 @@ export default function Scene({
   fullscreen = false,
   overlay,
   shadowScale = 22,
+  maxPolarAngle = Math.PI,
 }: {
   children: ReactNode;
   autoRotate?: boolean;
@@ -34,6 +37,8 @@ export default function Scene({
   overlay?: ReactNode;
   /** Contact shadow plane size in world units; defaults to a generous 22. */
   shadowScale?: number;
+  /** Max camera polar angle in radians; defaults to unrestricted (π). */
+  maxPolarAngle?: number;
 }) {
   const containerRef = useRef<HTMLDivElement>(null);
   const [isFullscreen, setIsFullscreen] = useState(false);
@@ -93,6 +98,7 @@ export default function Scene({
           enablePan={enablePan}
           minDistance={0.01}
           maxDistance={8}
+          maxPolarAngle={maxPolarAngle}
           autoRotate={autoRotate}
           makeDefault
         />