fix(storybook): refine responsive page inner width

- Story page Inner side margin: 16px up to a 480px viewport, linear to 60px at 768px, 60px beyond (no width jump)
- Follow the 60px margins: Responsive 1920 row from a 2040px page (was 2000px); property compare 3 columns from 1125px, 2 columns from 787px (was 1080 / 720)
- SW browser tests: drop the removed --sb-page-max-width override, compare thresholds 787 / 1125

packages/sw/tests/viewer-logo-document-menu-firefox.browser.mjs

@@ -46,8 +46,8 @@ const ev = async expr => { const r = await send('script.evaluate', { expression:
 const goto = async story => {
   await send('browsingContext.navigate', { context, url: `${base}/iframe.html?id=${story}&viewMode=story`, wait: 'complete' })
   for (let i = 0; i < 40; i++) { if (await ev(`!!document.querySelector('.hm-sw-viewer-header')`)) break; await sleep(250) }
-  // Lift the Story page envelope like the Chromium suites; scroll instantly (the preview sets smooth scrolling).
-  await ev(`(() => { const s = document.createElement('style'); s.textContent = '.sb-page { --sb-page-max-width: 100vw; } html { scroll-behavior: auto !important; }'; document.head.append(s); return true })()`)
+  // Scroll instantly (the preview sets smooth scrolling).
+  await ev(`(() => { const s = document.createElement('style'); s.textContent = 'html { scroll-behavior: auto !important; }'; document.head.append(s); return true })()`)
   await ev('document.fonts.ready.then(() => true)'); await sleep(400)
 }
 const frames = () => ev('new Promise(r => requestAnimationFrame(() => requestAnimationFrame(() => r(true))))')