Device preview + responsive spacing in the Style panel

Style panel gets a real-viewport iframe preview (390/820/1280px) tied to the
breakpoint tab, reloaded after each edit, and spacing/gap controls per
breakpoint. The editor does not boot inside the preview frame. Mock and
tests mirror the new k6n layout template.

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

src/main.ts

@@ -2,10 +2,12 @@
 // own loader only when the preview cookie is set (docs/onpage-editor.md §2).
 // It re-checks, so loading it by mistake never shows editor UI to visitors.
 import { boot } from './boot'
+import { PREVIEW_FRAME_NAME } from './style/DevicePreview'
 
 export const previewEnabled = () => /(?:^|;\s*)cms_preview=1/.test(document.cookie)
 
-if (previewEnabled()) boot()
+// The device-preview iframe shows the page only; it must not boot a second editor.
+if (previewEnabled() && window.name !== PREVIEW_FRAME_NAME) boot()
 
 export { boot }
 export * from './registry'