web-player: P10 — cabeceras, diálogos y tipografía

PageHeader fusiona CollectionHeader (title/eyebrow/description/meta/
cover?/actions?/align?): sin cover se comporta como el antiguo
PageHeader simple (acciones en línea), con cover como el antiguo
CollectionHeader (acciones debajo). Fija su propio margen inferior
(mb-7/8); se quitan los mt-* que ponía cada página después. Migra los
9 sitios que usaban uno u otro (álbumes, biblioteca, listas, subir,
Explorar ×2, me gusta, mezcla, perfil). CollectionHeader se borra.

AlbumHeader y PlaylistHeader se inlinean en sus páginas y se borran.
Decisión (recomendada, sin bloquear): PlaylistHeader gana iconos en
Editar/Eliminar/Reproducir, igual que ya tenía AlbumHeader.

ConfirmDialog nuevo sustituye los dos diálogos de borrado (álbum y
playlist), que tenían tipografías distintas. Modal pasa a usar
.glass-panel (en vez de duplicar el style= inline) y z-(--z-modal); su
eyebrow y título usan las recetas text-eyebrow/text-display-3.

SectionHeading gana `count?` (línea "N resultados", sustituye 4 copias
en Explorar) y `href?`/`linkLabel?` ("Ver todas", sustituye la de
Inicio). Aplica recetas de tipografía (text-display-2/3,
text-eyebrow, text-body) y tokens de ancho (max-w-prose-sm, max-w-hero)
en EmptyState, +error, "Sin resultados", hero y stats de Inicio, Queue
y Sidebar. El estado vacío "Todavía no has escuchado nada" (repetido
2 veces en Inicio) pasa a un snippet local.

Verificado con npm run check/build; sin QA visual autenticada (Docker
no disponible en esta sesión).

web-player/src/routes/(app)/liked/+page.svelte

@@ -5,7 +5,7 @@
 	import { liked } from '$lib/player/liked.svelte';
 	import { plural } from '$lib/format';
 	import Page from '$lib/components/ui/Page.svelte';
-	import CollectionHeader from '$lib/components/ui/CollectionHeader.svelte';
+	import PageHeader from '$lib/components/ui/PageHeader.svelte';
 	import Button from '$lib/components/ui/Button.svelte';
 	import EmptyState from '$lib/components/ui/EmptyState.svelte';
 	import TrackList from '$lib/components/ui/TrackList.svelte';
@@ -29,7 +29,7 @@
 </svelte:head>
 
 <Page>
-	<CollectionHeader
+	<PageHeader
 		eyebrow="Colección"
 		title="Me gusta"
 		meta={plural(tracks.length, 'canción', 'canciones')}
@@ -37,9 +37,9 @@
 	>
 		{#snippet cover()}
 			<div
-				class="grid h-36 w-36 shrink-0 place-items-center rounded-art-lg bg-[image:var(--mf-liked-grad)] sm:h-41 sm:w-41"
+				class="grid size-cover-hero shrink-0 place-items-center rounded-art-lg bg-[image:var(--mf-liked-grad)] sm:size-cover-hero-sm"
 			>
-				<Heart class="h-10 w-10 text-on-art/90" fill="currentColor" strokeWidth={0} />
+				<Heart class="size-icon-xl text-on-art/90" fill="currentColor" strokeWidth={0} />
 			</div>
 		{/snippet}
 		{#snippet actions()}
@@ -47,7 +47,7 @@
 				{isCurrentQueue && player.playing ? 'Pausar' : 'Reproducir'}
 			</Button>
 		{/snippet}
-	</CollectionHeader>
+	</PageHeader>
 
 	{#if tracks.length > 0}
 		<TrackList
@@ -59,7 +59,6 @@
 				icon: X,
 				label: 'Quitar de Me gusta'
 			}}
-			class="mt-6 sm:mt-8"
 		/>
 	{:else}
 		<EmptyState