Stop iOS nested scroll snap-back on Studio and Queue.

Co-authored-by: Cursor <cursoragent@cursor.com>

assets/css/main.css

@@ -11,7 +11,14 @@ body,
 #__nuxt {
   min-height: 100%;
   max-width: 100%;
-  overflow-x: hidden;
+}
+
+html {
+  overflow-x: clip;
+}
+
+body {
+  overflow-x: clip;
 }
 
 body {

components/DurationField.vue

@@ -79,6 +79,7 @@ function onSlider(event: Event) {
 
 function onPointerDown(event: PointerEvent) {
   if (event.button !== 0) return
+  if (event.pointerType === 'touch') return
   const input = event.currentTarget as HTMLInputElement
   const startY = event.clientY
   const startValue = model.value

pages/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="min-h-screen min-w-0 overflow-x-hidden">
+  <div class="min-h-dvh min-w-0">
     <header class="sticky top-0 z-20 border-b border-white/5 bg-zinc-950/70 backdrop-blur-xl">
       <div class="mx-auto flex max-w-7xl items-center justify-between px-4 py-4 sm:px-6">
         <div class="flex items-center gap-3">
@@ -2816,7 +2816,7 @@ onMounted(async () => {
     if (savedPreset) recommendPresetId.value = savedPreset
   } catch { /* ignore */ }
   applyInstancePrivacy()
-  window.addEventListener('pointerdown', onSitePointerDown, true)
+  window.addEventListener('click', onSitePointerDown, true)
   const [health, me] = await Promise.all([
     $fetch<{ comfy?: { ok?: boolean; busy?: boolean } }>('/api/health').catch(() => ({ comfy: { ok: false, busy: false } })),
     $fetch<{ user?: { name?: string; email?: string }; authEnabled?: boolean; authMode?: string; instanceName?: string }>('/api/auth/me').catch(() => ({ user: null })),
@@ -2845,7 +2845,7 @@ onMounted(async () => {
 })
 
 onBeforeUnmount(() => {
-  window.removeEventListener('pointerdown', onSitePointerDown, true)
+  window.removeEventListener('click', onSitePointerDown, true)
   window.removeEventListener('keydown', onEditLightboxKey)
   if (healthTimer) clearInterval(healthTimer)
   healthTimer = null
@@ -3951,7 +3951,7 @@ function onEditLightboxKey(event: KeyboardEvent) {
   if (event.key === 'Escape') closeEditLightbox()
 }
 
-function onSitePointerDown(event: PointerEvent) {
+function onSitePointerDown(event: Event) {
   const target = event.target as Node | null
   if (editLightbox.value && target && editLightbox.value.contains(target)) return
   if (editLightboxUrl.value) closeEditLightbox()

pages/queue.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="min-h-screen min-w-0 overflow-x-hidden">
+  <div class="min-h-dvh min-w-0">
     <header class="sticky top-0 z-20 border-b border-white/5 bg-zinc-950/70 backdrop-blur-xl">
       <div class="mx-auto flex max-w-7xl items-center justify-between px-4 py-4 sm:px-6">
         <div class="flex items-center gap-3">