fix(detail): keep the Back button from covering detail content

The shell's sticky Back control floated over its scroll owner: it covered
the start of the "Seasons and Episodes" heading and the inline player's
top-left corner. While Back is shown, every content column (hero, player,
episodes, About, extras) now starts after a 72px lane (16 + 40 + 16),
published as --detail-back-lane so content-hero and content-about honour
it too; hosts without Back (M3U) keep their inset. At the 640px phone
breakpoint a column that wide would clip the player controls, so there
the wrapper becomes an in-flow 56px sticky bar on --app-header-bg.

The season header now wraps its actions onto their own row before the
heading wraps (the pane, not the viewport, decides), and the narrow
inline player's title ellipsizes inside its card instead of spilling past
both edges.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web-e2e/src/m3u-movie-details.e2e.ts

@@ -416,6 +416,13 @@ test('@web @m3u @tmdb browse and watch keep the adjusted volume', async ({
         .click();
     await expect(inlineVideo(page)).toHaveCount(0);
     await expect(shell.locator('.shell__back-button')).toHaveCount(0);
+    // Without the arrow there is no lane to reserve: the hero keeps its own
+    // inset instead of the 72px column portal details give the Back control.
+    expect(
+        await shell
+            .locator('.hero__content')
+            .evaluate((el) => getComputedStyle(el).paddingInlineStart)
+    ).toBe('40px');
     await shell.focus();
     await page.keyboard.press('Escape');
     await expect(playButton).toBeVisible();