diff --git a/scripts/barrier_picker_app/static/index.html b/scripts/barrier_picker_app/static/index.html
index fe229a7..d0b83f5 100644
--- a/scripts/barrier_picker_app/static/index.html
+++ b/scripts/barrier_picker_app/static/index.html
@@ -22,8 +22,12 @@
     #meta .role-training { color: #cd6 !important; }
     #meta .role-testing { color: #6cd !important; }
     main { display: flex; flex-direction: column; align-items: center; padding: 1rem; }
-    video { width: 100%; max-width: 1400px; height: auto; background: #000;
-            border-radius: 4px; }
+    /* Reason: lock the video box to the source aspect ratio (1920x1088 is
+       what the ethoscope cameras emit). Without this, the box collapses
+       to spinner size while a new video is loading and every other
+       component on the page jumps around. */
+    video { width: 100%; max-width: 1400px; aspect-ratio: 1920 / 1088;
+            background: #000; border-radius: 4px; }
     #controls { margin-top: 1rem; display: flex; gap: 1rem; flex-wrap: wrap;
                 justify-content: center; }
     button { padding: 0.7rem 1.4rem; font-size: 0.95rem; border: 1px solid #444;