diff --git a/packages/player/src/iframe-dom.ts b/packages/player/src/iframe-dom.ts
index 1140024d1..e788e42d6 100644
--- a/packages/player/src/iframe-dom.ts
+++ b/packages/player/src/iframe-dom.ts
@@ -64,9 +64,13 @@ export function scaleIframeToFit(
   compositionWidth: number,
   compositionHeight: number,
 ): void {
-  const rect = playerElement.getBoundingClientRect();
-  if (rect.width === 0 || rect.height === 0) return;
-  const scale = Math.min(rect.width / compositionWidth, rect.height / compositionHeight);
+  // Use offsetWidth/offsetHeight (layout dimensions) instead of getBoundingClientRect(),
+  // which returns visual dimensions inflated by ancestor CSS zoom. Using the zoomed rect
+  // would double-scale the iframe when an ancestor has CSS zoom applied.
+  const width = playerElement.offsetWidth;
+  const height = playerElement.offsetHeight;
+  if (width === 0 || height === 0) return;
+  const scale = Math.min(width / compositionWidth, height / compositionHeight);
   iframe.style.width = `${compositionWidth}px`;
   iframe.style.height = `${compositionHeight}px`;
   iframe.style.transform = `translate(-50%, -50%) scale(${scale})`;
diff --git a/packages/studio/src/components/nle/NLEPreview.tsx b/packages/studio/src/components/nle/NLEPreview.tsx
index 46a2640fa..e85942423 100644
--- a/packages/studio/src/components/nle/NLEPreview.tsx
+++ b/packages/studio/src/components/nle/NLEPreview.tsx
@@ -264,7 +264,7 @@ export const NLEPreview = memo(function NLEPreview({
     <div className="flex flex-col h-full min-h-0">
       <div
         ref={viewportRef}
-        className="relative flex-1 flex items-center justify-center p-2 overflow-hidden min-h-0 outline-none focus:ring-1 focus:ring-studio-accent/40"
+        className="relative flex-1 flex items-center justify-center p-2 overflow-hidden min-h-0 outline-none focus-visible:ring-1 focus-visible:ring-studio-accent/40 bg-neutral-900"
         tabIndex={0}
         aria-label="Composition preview"
         onPointerDown={handlePointerDown}
@@ -279,6 +279,9 @@ export const NLEPreview = memo(function NLEPreview({
             zoom: toDomPrecision(initial.zoomPercent / 100),
             transform: `translate(${toDomPrecision(initial.panX)}px, ${toDomPrecision(initial.panY)}px)`,
             transformOrigin: "0 0",
+            outline: "1px solid rgba(255,255,255,0.3)",
+            outlineOffset: "0px",
+            boxShadow: "0 4px 32px rgba(0,0,0,0.7)",
           }}
           data-testid="preview-zoom-stage"
         >