diff --git a/src/gui/gui.ts b/src/gui/gui.ts
index 0f88bf0..087bc6f 100644
--- a/src/gui/gui.ts
+++ b/src/gui/gui.ts
@@ -61,10 +61,10 @@ export function setupGui(
       .onChange(onPatientChange);
   }
 
-  const onZoomChange = (value: number) =>
-    ((
-      jellyfishGui.querySelector(".jellyfish-plot") as HTMLElement
-    ).style.transform = `scale(${value})`);
+  const onZoomChange = (value: number) => {
+    const plot = jellyfishGui.querySelector(".jellyfish-plot") as HTMLElement;
+    plot.style.transform = `translate(-50%, -50%) scale(${value})`;
+  };
 
   gui.add(generalProps, "zoom", 0.2, 2).onChange(onZoomChange);
 
@@ -248,7 +248,9 @@ function makePatientNavigator(
 const HTML_TEMPLATE = `
   <div class="jellyfish-gui">
     <div class="jellyfish-plot-container">
-      <div class="jellyfish-plot"></div>
+      <div class="jellyfish-center">
+        <div class="jellyfish-plot"></div>
+      </div>
     </div>
     <div class="jellyfish-patient-nav" style="display: none">
       <button class="jellyfish-prev-patient">
diff --git a/style.css b/style.css
index 6029f60..81c2956 100644
--- a/style.css
+++ b/style.css
@@ -27,8 +27,15 @@ body {
   position: absolute;
   inset: 0;
 
-  overflow-x: hidden;
-  overflow-y: auto;
+  overflow: hidden;
+}
+
+.jellyfish-center {
+  position: relative;
+}
+
+.jellyfish-plot {
+  position: absolute;
 }
 
 .jellyfish-patient-nav {
@@ -91,6 +98,9 @@ body {
 
 .jellyfish-error-message {
   color: #bb0000;
+  background-color: #f8f8f8;
+  padding: 0.5em;
+  min-width: 50vw;
 }
 
 @media print {