diff --git a/service/pages.js b/service/pages.js
index f91ffc9..6292c29 100644
--- a/service/pages.js
+++ b/service/pages.js
@@ -385,7 +385,15 @@ export function submit() {
   .drop-zone .drop-main{color:var(--ink);font-size:15px}
   .drop-zone .drop-link{color:var(--acid);text-decoration:underline}
   .drop-zone .drop-small{color:var(--dim);font-size:12.5px;margin-top:.5rem;display:block}
-  .drop-zone input[type=file]{display:none}
+  /* Visually hide the input, but keep it in the layout and clickable.
+     display:none on a file input makes several mobile browsers refuse
+     to open the picker, even when the input is wrapped by a <label> or
+     a scripted .click() is used. The pattern below keeps the input a
+     real, focusable, clickable element at 1px that nobody can see. */
+  .drop-zone input[type=file]{
+    position:absolute;left:0;top:0;width:1px;height:1px;
+    opacity:0;overflow:hidden;
+  }
 </style>
 
 <header class="hero compact">
@@ -675,14 +683,13 @@ export function submit() {
   }
 
   // ===== STEP 1: upload (drag-drop zone + file picker) =====
+  // The drop zone IS a <label> wrapping the file input, so a tap/click on
+  // the label natively opens the picker — we don't bind our own click
+  // handler, because a scripted fi.click() on top of that fires a SECOND
+  // picker and some browsers (desktop Chrome in particular) ignore or
+  // error on the second one. Native-only is the reliable path.
   const dz = $('drop-zone');
   const fi = $('file-input');
-  dz.addEventListener('click', (ev) => {
-    // Clicking the hidden <input> directly works; stop click bubbling from
-    // the inner link span so we don't open the picker twice.
-    if (ev.target === fi) return;
-    fi.click();
-  });
   ['dragover','dragenter'].forEach((e) => dz.addEventListener(e, (ev) => {
     ev.preventDefault(); dz.classList.add('dragover');
   }));