diff --git a/static/js/main.js b/static/js/main.js
index 7fc07a5..8b22202 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -354,14 +354,8 @@
         const zoomLevel = zoomValue / 100;
 
         requestAnimationFrame(() => {
-            // Use transform scale for true zoom that extends beyond viewport
-            zoomWrapper.style.transform = `scale(${zoomLevel})`;
-            zoomWrapper.style.transformOrigin = 'top center';
-
-            // Adjust wrapper height to account for scale
-            // This ensures the footer appears at the correct position
-            const originalHeight = zoomWrapper.scrollHeight;
-            zoomWrapper.style.marginBottom = `${originalHeight * (zoomLevel - 1)}px`;
+            // Use CSS zoom property - it properly affects layout and extends beyond viewport
+            zoomWrapper.style.zoom = zoomLevel;
 
             // Update display
             updateZoomDisplay(zoomValue);