drag drop pt. 4 grab handle

src/lib/components/GlobalPlayer.svelte

@@ -53,6 +53,7 @@
 		Trash2,
 		Volume2,
 		X,
+		GripVertical,
 	} from "@lucide/svelte";
 
 	const iconClass = "icon-btn";
@@ -855,12 +856,21 @@
 											]
 												.filter(Boolean)
 												.join(" ")}
-											draggable="true"
-											ondragstart={(e) => onDragStart(item.track.id, e)}
 											ondragover={(e) => onDragOver(item.track.id, e)}
 											ondrop={(e) => onDrop(item.track.id, e)}
+										>
+											<button
+												class="btn-icon"
+												type="button"
+												draggable="true"
+												aria-label="Reorder"
+												title="Drag to reorder"
+												ondragstart={(e) => onDragStart(item.track.id, e)}
 												ondragend={onDragEnd}
 											>
+												<GripVertical class={iconClass} />
+											</button>
+
 											<button
 												class="min-w-0 flex-1 truncate text-left text-sm hover:underline"
 												type="button"
@@ -1144,12 +1154,21 @@
 								]
 									.filter(Boolean)
 									.join(" ")}
-								draggable="true"
-								ondragstart={(e) => onDragStart(item.track.id, e)}
 								ondragover={(e) => onDragOver(item.track.id, e)}
 								ondrop={(e) => onDrop(item.track.id, e)}
+							>
+								<button
+									class="btn-icon"
+									type="button"
+									draggable="true"
+									aria-label="Reorder"
+									title="Drag to reorder"
+									ondragstart={(e) => onDragStart(item.track.id, e)}
 									ondragend={onDragEnd}
 								>
+									<GripVertical class={iconClass} />
+								</button>
+
 								<button
 									class="min-w-0 flex-1 truncate text-left text-sm hover:underline"
 									type="button"