Checkpoint web-player design-system refactor and backend track genre tagging

Advances the ongoing token/componentization cleanup (anchored player dock,
border-based panels instead of floating shadows, corrected light-mode
accent/gradient tokens) alongside in-progress backend support for track
genre tags.

web-player/src/routes/(app)/albums/[id]/components/AlbumHeader.svelte

@@ -55,7 +55,7 @@
 			{trackIds}
 			{coverUrl}
 			size="large"
-			class="h-36 w-36 shrink-0 rounded-[18px] shadow-cover-lg sm:h-41 sm:w-41"
+			class="h-36 w-36 shrink-0 rounded-art-lg sm:h-41 sm:w-41"
 		/>
 	{/snippet}
 	{#snippet actions()}

web-player/src/routes/(app)/albums/[id]/components/AlbumTrackTable.svelte

@@ -10,7 +10,7 @@
 	import TrackIndexCell from '$lib/components/ui/TrackIndexCell.svelte';
 	import TrackTitleCell from '$lib/components/ui/TrackTitleCell.svelte';
 
-	type AlbumTrack = ApiTrackLike & { duration: number | string };
+	type AlbumTrack = ApiTrackLike & { duration: number | string; listensCount: number | string };
 
 	interface Props {
 		tracks: AlbumTrack[];
@@ -24,7 +24,12 @@
 	}
 </script>
 
-<TrackTable index action={isOwner} class="mt-6 sm:mt-8">
+<TrackTable
+	index
+	action={isOwner}
+	meta={[{ label: 'Escuchas', width: '100px' }]}
+	class="mt-6 sm:mt-8"
+>
 	{#each tracks as track, i (track.id)}
 		{@const active = player.current.id === track.id}
 		<TrackRow {active}>
@@ -38,6 +43,7 @@
 				{active}
 				onClick={() => playFrom(i)}
 			/>
+			<TrackMeta class="hidden sm:block">{Number(track.listensCount)}</TrackMeta>
 			<TrackMeta>{fmtTime(Number(track.duration))}</TrackMeta>
 			{#if isOwner}
 				<form

web-player/src/routes/(app)/albums/[id]/components/LibraryPicker.svelte

@@ -11,7 +11,7 @@
 	import TrackTitleCell from '$lib/components/ui/TrackTitleCell.svelte';
 	import NowPlaying from '$lib/components/ui/NowPlaying.svelte';
 
-	type LibraryTrack = ApiTrackLike & { duration: number | string };
+	type LibraryTrack = ApiTrackLike & { duration: number | string; listensCount: number | string };
 
 	interface Props {
 		library: LibraryTrack[];
@@ -26,7 +26,7 @@
 
 <div class="mt-10 sm:mt-12">
 	<SectionHeading title="Tus canciones subidas" />
-	<TrackTable action>
+	<TrackTable action meta={[{ label: 'Escuchas', width: '100px' }]}>
 		{#each library as track, i (track.id)}
 			{@const active = player.current.id === track.id}
 			<TrackRow {active}>
@@ -45,6 +45,7 @@
 						{/if}
 					{/snippet}
 				</TrackTitleCell>
+				<TrackMeta class="hidden sm:block">{Number(track.listensCount)}</TrackMeta>
 				<TrackMeta>{fmtTime(Number(track.duration))}</TrackMeta>
 				<form
 					method="POST"