feat: adapt presentation canvas ratio

web/apps/console/src/presentation/PresentationCanvas.tsx

@@ -1,8 +1,6 @@
 import { useEffect, useState, type ReactNode } from "react";
 import {
   fitPresentationCanvas,
-  PRESENTATION_HEIGHT,
-  PRESENTATION_WIDTH,
   type ViewportSize,
 } from "./canvas-fit.js";
 
@@ -13,8 +11,9 @@ const readViewport = (): ViewportSize => ({
   height: window.innerHeight,
 });
 
-// The fixed canvas deliberately prevents slide reflow; scenes always render
-// inside a 1280×720 coordinate system and the viewport scales proportionally.
+// The canvas adapts continuously from a 4:3 to 16:9 logical ratio while
+// preserving a fixed 720px height; scenes render inside this logical
+// coordinate system and the viewport scales proportionally.
 export const PresentationCanvas = ({ children }: PresentationCanvasProps) => {
   const [viewport, setViewport] = useState(readViewport);
   useEffect(() => {
@@ -29,8 +28,8 @@ export const PresentationCanvas = ({ children }: PresentationCanvasProps) => {
         className="presentation-canvas"
         data-testid="presentation-canvas"
         style={{
-          width: PRESENTATION_WIDTH,
-          height: PRESENTATION_HEIGHT,
+          width: fit.logicalWidth,
+          height: fit.logicalHeight,
           left: fit.offsetX,
           top: fit.offsetY,
           transform: `scale(${fit.scale})`,