Fix: drag button without triggering recording (200ms hold threshold)

static/index.html

@@ -102,9 +102,15 @@ document.getElementById('cancelBtn').addEventListener('click',()=>{
   fetch('/cancel',{method:'POST'}).then(()=>{status.textContent='⌃C sent'}).catch(()=>{});
 });
 
-btn.addEventListener('pointerdown',e=>{if(e.pointerId!==undefined)btn.setPointerCapture(e.pointerId);e.preventDefault();start()});
-btn.addEventListener('pointerup',stop);
-btn.addEventListener('pointercancel',stop);
+btn.addEventListener('pointerdown',e=>{if(e.pointerId!==undefined)btn.setPointerCapture(e.pointerId);e.preventDefault();btn._startX=e.clientX;btn._startY=e.clientY;btn._dragged=false;btn._holdTimer=setTimeout(()=>{if(!btn._dragged)start();},200);});
+btn.addEventListener('pointermove',e=>{
+  const dx=e.clientX-btn._startX,dy=e.clientY-btn._startY;
+  if(Math.abs(dx)+Math.abs(dy)>10){btn._dragged=true;clearTimeout(btn._holdTimer);}
+});
+btn.addEventListener('pointerup',()=>{clearTimeout(btn._holdTimer);if(!btn._dragged)stop();});
+
+// Stop recording on pointerup anywhere if recording
+document.addEventListener('pointerup',()=>{if(mediaRec&&mediaRec.state==='recording')stop();});
 
 // Draggable FABs
 document.querySelectorAll('.fab').forEach(fab=>{