Isolate error pages from site layout

e2e/navegacion.e2e.ts

@@ -182,11 +182,13 @@ test.describe('La página de error', () => {
 		}
 	});
 
-	test('mantiene la navegación del sitio alrededor de la lámina', async ({ page }) => {
+	test('aísla el error de la navegación, el pie y el reproductor del sitio', async ({ page }) => {
 		await page.goto('/no-existe-esto');
 
-		await expect(page.locator('header')).toBeVisible();
-		await expect(page.locator('footer')).toBeVisible();
+		await expect(page.locator('header')).toHaveCount(0);
+		await expect(page.locator('footer')).toHaveCount(0);
+		await expect(page.getByRole('region', { name: 'Reproductor' })).toHaveCount(0);
+		await expect(page.locator('main.pagina-error')).toBeVisible();
 		await expect(page.getByRole('link', { name: 'Volver al inicio' })).toBeVisible();
 	});
 

src/routes/+layout.svelte

@@ -18,11 +18,12 @@
 	const hayReproduccion = $derived(reproductor.pista !== null);
 
 	/*
-	 * La página de espera va desnuda: sin cabecera, sin pie y sin reproductor.
-	 * Las páginas de error recuperan su composición original dentro del sitio,
-	 * con su lámina propia y su control de música.
+	 * La página de espera y las páginas de error van desnudas: sin navegación,
+	 * pie, reproductor global ni modal de acceso. `page.error` distingue un error
+	 * de ruta real de una respuesta 4xx de un formulario válido.
 	 */
-	const desnuda = $derived(page.url.pathname === RUTA_ESPERA);
+	const paginaDeError = $derived(page.error !== null);
+	const desnuda = $derived(page.url.pathname === RUTA_ESPERA || paginaDeError);
 
 	/*
 	 * Avisa de que la página ya es interactiva.
@@ -52,7 +53,13 @@
 {/if}
 
 {#if desnuda}
-	{@render children()}
+	{#if paginaDeError}
+		<main id="contenido" class="pagina-error" tabindex="-1">
+			{@render children()}
+		</main>
+	{:else}
+		{@render children()}
+	{/if}
 {:else}
 	<div class="sitio" class:con-reproductor={hayReproduccion}>
 		<Cabecera />
@@ -98,6 +105,14 @@
 		outline: none;
 	}
 
+	.pagina-error {
+		display: grid;
+		align-items: center;
+		width: 100%;
+		min-height: 100vh;
+		min-height: 100dvh;
+	}
+
 	.saltar {
 		position: absolute;
 		left: var(--sp-4);