1.9.2.1

Limit banner height movement

assets/js/hooks/useAppState.js

@@ -485,6 +485,39 @@ export function useAppState() {
     if (bannerIndex >= activeEvents.length) setBannerIndex(0);
   }, [activeEvents.length]);
 
+  // ── BANNER HEIGHT → shell padding-top ────────────────────────────────
+  // Floats the banner over the page. Padding only grows while open so
+  // shorter slides never cause the page to jump up. Resets on close.
+  const bannerMaxHeightRef = useRef(0);
+
+  useEffect(() => {
+    const shell = document.querySelector('.utci-shell');
+    if (!shell) return;
+
+    if (!bannerVisible) {
+      bannerMaxHeightRef.current = 0;
+      shell.style.paddingTop = '';
+      return;
+    }
+
+    const applyPadding = () => {
+      const wrap = document.querySelector('.event-banner-wrap');
+      if (!wrap) return;
+      const h = wrap.getBoundingClientRect().height;
+      if (h > bannerMaxHeightRef.current) {
+        bannerMaxHeightRef.current = h;
+        shell.style.paddingTop = h + 'px';
+      }
+    };
+
+    const tid = setTimeout(applyPadding, 460);
+    window.addEventListener('resize', applyPadding);
+    return () => {
+      clearTimeout(tid);
+      window.removeEventListener('resize', applyPadding);
+    };
+  }, [bannerVisible, bannerIndex, activeEvents.length]);
+
   // ── RETURN ALL STATE + HANDLERS ───────────────────────────────────────
   return {
     // location