diff --git a/frontend/src/lib/components/Viewer.svelte b/frontend/src/lib/components/Viewer.svelte
index 0c436f4..42dac7a 100644
--- a/frontend/src/lib/components/Viewer.svelte
+++ b/frontend/src/lib/components/Viewer.svelte
@@ -423,15 +423,14 @@
 			scheduleViewport();
 			return;
 		}
-		// 100% от оригинала.
+		// 100% от оригинала, по центру фото.
 		zoomed = true;
 		scale = 1;
 		tick().then(() => {
 			const natW = baseWidth();
 			const natH = baseHeight();
-			const offset = imageOffset(natW, natH);
-			el.scrollLeft = offset.x;
-			el.scrollTop = offset.y;
+			el.scrollLeft = Math.max(0, (natW - el.clientWidth) / 2);
+			el.scrollTop = Math.max(0, (natH - el.clientHeight) / 2);
 			scheduleViewport();
 		});
 	}
@@ -625,7 +624,7 @@
 
 <div
 	bind:this={viewerEl}
-	class="bg-canvas relative flex h-full flex-col overflow-hidden"
+	class="bg-canvas relative flex h-full min-w-0 flex-col overflow-hidden"
 	data-pano={panoTag ? '1' : '0'}
 >
 	<div bind:this={topEl} class={topClass}>
@@ -654,7 +653,7 @@
 		</div>
 	</div>
 
-	<div class="relative flex min-h-0 flex-1 items-stretch">
+	<div class="relative flex min-h-0 min-w-0 flex-1 items-stretch">
 		<button
 			type="button"
 			class={leftBtnClass}
@@ -716,10 +715,10 @@
 				{/if}
 			</div>
 		{:else}
-			<div class="relative flex min-h-0 flex-1">
+			<div class="relative flex min-h-0 min-w-0 flex-1">
 				<div
 					bind:this={scroller}
-					class="bg-canvas flex min-h-0 flex-1 overscroll-contain {zoomed
+					class="bg-canvas flex min-h-0 min-w-0 flex-1 overscroll-contain {zoomed
 						? 'cursor-grab overflow-auto'
 						: 'overflow-hidden'}"
 					role="group"