fix

frontend/src/detail/PreviewZoomOverlay.tsx

@@ -264,6 +264,7 @@ const PreviewZoomOverlay: React.FC<PreviewZoomOverlayProps> = ({
     if (isPdfDisplay) {
       return;
     }
+    event.stopPropagation();
     toggleZoomAtPoint(event.clientX ?? 0, event.clientY ?? 0);
   };
 

frontend/src/preview/DocumentViewerPanel.tsx

@@ -1,4 +1,5 @@
 import React, {
+  Children,
   useCallback,
   useEffect,
   useMemo,
@@ -432,13 +433,7 @@ const DocumentViewerPanel: React.FC<DocumentViewerPanelProps> = ({
   const headerLeadingButtons = isSidebarVariant
     ? [collapseButton, maximizeButton].filter(Boolean)
     : [sidebarToggle, closeButton].filter(Boolean);
-  const headerLeadingContent = headerLeadingButtons.length
+  const headerLeadingContent = headerLeadingButtons.length ? Children.toArray(headerLeadingButtons) : null;
-    ? (
-        <>
-          {headerLeadingButtons}
-        </>
-      )
-    : null;
 
   const resizeHandle = isSidebarVariant ? (
     <button

frontend/src/preview/PdfViewer.tsx

@@ -82,8 +82,8 @@ const resolvePdfWasmBaseUrl = (): string => {
 
 const PdfViewer = ({ src, title, className, viewportRef }: PdfViewerProps): JSX.Element => {
   const containerRef = useRef<HTMLDivElement>(null);
-  const [viewportWidth, setViewportWidth] = useState(() => window.innerWidth);
+  const [viewportWidth, setViewportWidth] = useState(0);
-  const [viewportHeight, setViewportHeight] = useState(() => window.innerHeight);
+  const [viewportHeight, setViewportHeight] = useState(0);
   const [renderWidth, setRenderWidth] = useState(0);
   const [status, setStatus] = useState<RenderStatus>('idle');
   const [errorMessage, setErrorMessage] = useState<string | null>(null);

frontend/src/styles/documents/viewer.css

@@ -455,8 +455,8 @@
   flex-direction: column;
   gap: var(--pdf-viewer-stack-padding, 0);
   align-items: center;
-  --pdf-viewer-viewport-width: 100vw;
+  --pdf-viewer-viewport-width: 100%;
-  --pdf-viewer-viewport-height: 100vh;
+  --pdf-viewer-viewport-height: 100%;
   padding: var(--pdf-viewer-stack-padding, 0);
   width: 100%;
   box-sizing: border-box;

frontend/src/styles/preview/preview-zoom.css

@@ -23,44 +23,45 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  max-width: 95vw;
+  max-width: 99vw;
-  max-height: 95vh;
+  max-height: 99vh;
   z-index: 3000000;
 }
 
 .preview-zoom__stage--pdf {
   width: 100%;
   height: 100%;
-  max-width: none;
+  max-width: 99vw;
-  max-height: none;
+  max-height: 99vh;
 }
 
 .preview-zoom__image {
-  max-width: 95vw;
+  max-width: 99vw;
-  max-height: 95vh;
+  max-height: 99vh;
   width: auto;
   height: auto;
+  box-shadow: 0 32px 120px var(--shadow-deep);
 }
 
 .preview-zoom__scroll {
   display: flex;
   align-items: center;
   justify-content: center;
-  max-width: 95vw;
+  max-width: 99vw;
-  max-height: 95vh;
+  max-height: 99vh;
 }
 
 .preview-zoom__scroll--pdf {
   width: 100%;
   height: 100%;
-  max-width: none;
+  max-width: 99vw;
-  max-height: none;
+  max-height: 99vh;
   padding: 0;
   box-sizing: border-box;
   overflow: auto;
   align-items: flex-start;
   justify-content: center;
-  --pdf-viewer-stack-padding: 2rem;
+  --pdf-viewer-stack-padding: 1vh;
 }
 
 .preview-zoom__scroll:focus {