fix: close phase 2 journey blockers

tests/browser/scene-controls.spec.ts

@@ -10,6 +10,37 @@ test('keeps the decorative world separate from the semantic reading path', async
   await expect(page.locator('main#portfolio-content')).toBeVisible();
 });
 
+test('keeps the desktop identity and navigation in a paint layer above the world', async ({ page, distUrl }) => {
+  await page.setViewportSize({ width: 1440, height: 900 });
+  await page.goto(distUrl, { waitUntil: 'domcontentloaded' });
+
+  const layers = await page.evaluate(() => {
+    const world = document.querySelector<HTMLElement>('.journey-world');
+    const header = document.querySelector<HTMLElement>('.site-header');
+    const heading = document.querySelector<HTMLElement>('.site-header h1');
+    const navigation = document.querySelector<HTMLElement>('.site-navigation');
+    if (!world || !header || !heading || !navigation) throw new Error('Missing top-screen structure');
+    const worldStyle = getComputedStyle(world);
+    const headerStyle = getComputedStyle(header);
+    return {
+      worldZ: Number(worldStyle.zIndex),
+      headerZ: Number(headerStyle.zIndex),
+      headerPosition: headerStyle.position,
+      headingVisible: heading.getBoundingClientRect().width > 0 && heading.getBoundingClientRect().height > 0,
+      navigationVisible: navigation.getBoundingClientRect().width > 0 && navigation.getBoundingClientRect().height > 0,
+      headerOpacity: Number.parseFloat(headerStyle.backgroundColor.match(/[\d.]+(?=\))/gu)?.at(-1) ?? '1'),
+    };
+  });
+
+  expect(layers).toMatchObject({
+    headerPosition: 'relative',
+    headingVisible: true,
+    navigationVisible: true,
+  });
+  expect(layers.headerZ).toBeGreaterThan(layers.worldZ);
+  expect(layers.headerOpacity).toBeGreaterThanOrEqual(0.94);
+});
+
 test('provides native motion and quality controls with visible state', async ({ page, distUrl }) => {
   await page.goto(distUrl, { waitUntil: 'domcontentloaded' });
 
@@ -17,13 +48,21 @@ test('provides native motion and quality controls with visible state', async ({
   await expect(quality).toBeVisible();
   await expect(page.getByRole('button', { name: 'Pause motion' })).toBeVisible();
   await expect(page.getByRole('status')).toContainText('Motion:');
+  const canvas = page.locator('.journey-canvas');
+  const originalCanvas = await canvas.elementHandle();
+  const originalGeneration = await page.locator('.journey-world').getAttribute('data-scene-generation');
 
   await page.getByRole('button', { name: 'Pause motion' }).click();
   await expect(page.getByRole('button', { name: 'Resume motion' })).toBeVisible();
-  await expect(page.locator('.journey-canvas')).toHaveCount(0);
+  await expect(canvas).toHaveCount(1);
+  await expect(page.locator('.journey-world')).toHaveAttribute('data-scene-generation', originalGeneration ?? '');
+  expect(await originalCanvas?.evaluate((element) => element.isConnected)).toBe(true);
 
   await page.getByRole('button', { name: 'Resume motion' }).click();
   await expect(page.getByRole('button', { name: 'Pause motion' })).toBeVisible();
+  await expect(canvas).toHaveCount(1);
+  await expect(page.locator('.journey-world')).toHaveAttribute('data-scene-generation', originalGeneration ?? '');
+  expect(await originalCanvas?.evaluate((element) => element.isConnected)).toBe(true);
 
   await quality.selectOption('static');
   await expect(page.getByRole('button', { name: 'Enable motion' })).toBeVisible();