Add likes, follows and playlist visibility; redesign web-player UI

Backend:
- New Likes feature (toggle/get liked tracks) and endpoints
- User follow/unfollow, listening stats, public user profile
- Playlist visibility (public/private) support
- Various auth and DTO/response adjustments to support the above

Frontend (web-player):
- New design system pass: theme tokens/mode (light/dark), glass menu,
  tabs bar, player dock/extras/queue components, mix tiles, artist link
- New routes: Liked, public user profile (/u/[id]), likes API proxy
- Search refactor: shared SearchBox component used by TopBar and
  MobileHeader (search now reachable on mobile), live results as you
  type instead of requiring Enter, dropped the "Buscando…" quick-result
  preview
- Removed now-unused components (MobileNav, CoverBadge, MixBentoTile,
  PlayPauseOverlay, SuggestionsTable, userDirectory)
- Design handoff reference docs added under web-player/design_handoff_musify_player
  and web-player/docs/design-system-refactor-plan.md

web-player/src/lib/components/ui/ImageDropzone.svelte

@@ -1,10 +1,13 @@
 <script lang="ts">
 	import ImageIcon from '@lucide/svelte/icons/image';
+	import type { LucideIcon } from '@lucide/svelte';
 
 	interface Props {
 		name: string;
 		fallbackUrl?: string;
 		required?: boolean;
+		icon?: LucideIcon;
+		gradient?: boolean;
 		class?: string;
 	}
 
@@ -12,13 +15,16 @@
 		name,
 		fallbackUrl,
 		required = false,
-		class:
-			klass = 'h-40 w-40 sm:h-52 sm:w-52 rounded-control border border-line bg-surface hover:border-accent/50'
+		icon: Icon = ImageIcon,
+		gradient = false,
+		class: klass = 'h-40 w-40 sm:h-52 sm:w-52 rounded-control'
 	}: Props = $props();
 
 	let preview = $state('');
 	let fallbackFailed = $state(false);
 
+	const hasImage = $derived(preview !== '' || (!!fallbackUrl && !fallbackFailed));
+
 	function onInput(event: Event) {
 		const file = (event.currentTarget as HTMLInputElement).files?.[0];
 		if (file) preview = URL.createObjectURL(file);
@@ -26,7 +32,10 @@
 </script>
 
 <label
-	class="relative grid cursor-pointer place-items-center overflow-hidden transition-colors {klass}"
+	class="relative grid cursor-pointer place-items-center overflow-hidden transition-colors {gradient
+		? ''
+		: 'border border-line bg-surface hover:border-accent/50'} {klass}"
+	style={gradient && !hasImage ? 'background:var(--mf-cover-grad)' : undefined}
 >
 	<input
 		type="file"
@@ -48,6 +57,6 @@
 			class="h-full w-full object-cover"
 		/>
 	{:else}
-		<ImageIcon class="h-12 w-12 text-muted" />
+		<Icon class="h-9 w-9 {gradient ? 'text-white/70' : 'text-muted'}" strokeWidth={1.3} />
 	{/if}
 </label>