fix: seek bars work on iOS (onchange+oninput), minimal bar is range input, float drag direction corrected

ui/src/lib/components/AudioPlayer.svelte

@@ -995,9 +995,11 @@
 		// Only start moving if dragged > 6px to preserve tap detection
 		if (!floatMoved && Math.hypot(dx, dy) < 6) return;
 		floatMoved = true;
+		// right  = MARGIN - x  → drag right (dx>0) should decrease right → x increases → x = ox + dx
+		// bottom = MARGIN - y  → drag down  (dy>0) should decrease bottom → y increases → y = oy + dy
 		const raw = {
-			x: floatDragStart.ox - dx,  // x increases toward left (away from right edge)
-			y: floatDragStart.oy - dy,  // y increases toward top (away from bottom edge)
+			x: floatDragStart.ox + dx,
+			y: floatDragStart.oy + dy,
 		};
 		audioStore.floatPos = clampFloatPos(raw.x, raw.y);
 	}
@@ -1274,15 +1276,18 @@
 		</svg>
 	</button>
 
-	<!-- Seek bar -->
-	<!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions -->
-	<div
-		role="none"
-		class="flex-1 h-1.5 bg-(--color-surface-3) rounded-full overflow-hidden cursor-pointer"
-		onclick={seekFromBar}
-	>
-		<div class="h-full bg-(--color-brand) rounded-full transition-none" style="width: {playPct}%"></div>
-	</div>
+	<!-- Seek bar — proper range input so drag works on iOS too -->
+	<input
+		type="range"
+		aria-label="Seek"
+		min="0"
+		max={audioStore.duration || 0}
+		value={audioStore.currentTime}
+		oninput={(e) => { audioStore.seekRequest = parseFloat((e.target as HTMLInputElement).value); }}
+		onchange={(e) => { audioStore.seekRequest = parseFloat((e.target as HTMLInputElement).value); }}
+		class="flex-1 h-1.5 cursor-pointer"
+		style="accent-color: var(--color-brand);"
+	/>
 
 	<!-- Time -->
 	<span class="flex-shrink-0 text-[11px] tabular-nums text-(--color-muted)">

ui/src/routes/+layout.svelte

@@ -990,6 +990,7 @@
 					max={audioStore.duration || 0}
 					value={audioStore.currentTime}
 					oninput={seek}
+					onchange={seek}
 					class="w-full h-1 accent-[--color-brand] cursor-pointer block"
 					style="margin: 0; border-radius: 0; accent-color: var(--color-brand);"
 				/>