fix ui view

static/js/ui.js

@@ -1,3 +1,27 @@
+// Keep a live measurement of the visual viewport for mobile browsers whose
+// address bar or software keyboard does not resize the layout viewport. CSS
+// combines this value with 100svh, so address-bar animation cannot make the
+// ticket shell jump while a genuinely smaller keyboard viewport still fits.
+(()=>{
+  let frame=0;
+  const syncViewport=()=>{
+    frame=0;
+    const viewport=window.visualViewport;
+    const height=Math.max(1,Math.round(viewport?.height||window.innerHeight));
+    const offsetTop=Math.max(0,Math.round(viewport?.offsetTop||0));
+    const root=document.documentElement;
+    root.style.setProperty('--visual-viewport-height',`${height}px`);
+    root.style.setProperty('--visual-viewport-offset-top',`${offsetTop}px`);
+    window.dispatchEvent(new CustomEvent('appviewportchange',{detail:{height,offsetTop}}));
+  };
+  const scheduleViewportSync=()=>{if(!frame)frame=requestAnimationFrame(syncViewport)};
+  syncViewport();
+  window.visualViewport?.addEventListener('resize',scheduleViewportSync,{passive:true});
+  window.visualViewport?.addEventListener('scroll',scheduleViewportSync,{passive:true});
+  window.addEventListener('resize',scheduleViewportSync,{passive:true});
+  window.addEventListener('orientationchange',()=>setTimeout(scheduleViewportSync,120),{passive:true});
+})();
+
 document.addEventListener('submit',event=>{
   const form=event.target;if(!form.matches('form'))return;
   requestAnimationFrame(()=>{if(!form.checkValidity())return;form.querySelectorAll('button[type="submit"],button:not([type])').forEach(button=>{button.disabled=true;button.setAttribute('aria-busy','true');if(!button.dataset.label)button.dataset.label=button.textContent;button.textContent='در حال ثبت…'})});