refactor(storybook): consolidate property panel comparison layout

Keep sw-header--property-panel-compare as the single property panel state
page: the four existing SWHeaderPropertyPanel states in 2 columns x 2 rows
at their original size, inside a scrolling Inner. Remove the duplicate
Property Panel Variants and the four single-state Stories (SW 24 -> 19).
Storybook-only change; SW runtime and public API untouched.

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

packages/sw/tests/detail-buttons.browser.mjs

@@ -2,7 +2,7 @@ import { createRequire } from 'node:module'
 import { mkdir, readFile, writeFile } from 'node:fs/promises'
 import path from 'node:path'
 import http from 'node:http'
-import { swStoryEntries, retainedInventory } from './storybook-inventory.mjs'
+import { swStoryEntries, retainedInventory, retiredPropertyPanelIds } from './storybook-inventory.mjs'
 
 // Usage: node packages/sw/tests/detail-buttons.browser.mjs baseline|verify <evidence-dir> [base-url]
 const mode = process.argv[2] ?? 'verify'
@@ -50,9 +50,9 @@ try {
       check(`required responsive width ${width}`,layout.height===49&&layout.overflow===0&&layout.documentOverflow===0,layout)
     }
     await page.setViewportSize({width:1920,height:1000})
+    await goto('property-panel-compare')
     for(const [id,height] of [['none',256],['all',361],['circle',658],['expanded',754]]){
-      await goto(`property-panel-${id}`)
-      const box=await page.locator('.hm-sw-property').first().boundingBox()
+      const box=await page.locator(`[data-compare="${id}"] .hm-sw-property`).boundingBox()
       check(`preserve property panel ${id}`,box.width===314&&box.height===height,box)
     }
     await goto('composition')
@@ -100,8 +100,10 @@ try {
     for(const key of Object.keys(snapshots).filter(k=>!k.startsWith('text'))) check(`unchanged header ${key} (capture a current baseline for replacement fixtures)`,JSON.stringify(before[key])===JSON.stringify(snapshots[key]))
     const oldIds=JSON.parse(await readFile(path.join(output,'baseline-story-ids.json'),'utf8'))
     const retiredIds=['default','controls','responsive','text-stroke','dynamic-data','layer-dropdown','color-dropdown','line-style-dropdown','text-dimension-style-dropdown'].map(id=>`sw-header--${id}`)
-    const retainedIds=retainedInventory(oldIds.map(id=>({id}))).map(e=>e.id)
-    check('retained stories remain; only approved retirements are absent',ids.length===24&&retainedIds.every(id=>ids.includes(id))&&retiredIds.every(id=>!ids.includes(id)),{before:oldIds.length,after:ids.length})
+    // 2026-10-19: the five duplicate property panel demos are retired as well (24 -> 19).
+    retiredIds.push(...retiredPropertyPanelIds)
+    const retainedIds=retainedInventory(oldIds.map(id=>({id}))).map(e=>e.id).filter(id=>!retiredPropertyPanelIds.includes(id))
+    check('retained stories remain; only approved retirements are absent',ids.length===19&&retainedIds.every(id=>ids.includes(id))&&retiredIds.every(id=>!ids.includes(id)),{before:oldIds.length,after:ids.length})
     for(const id of ids){await goto(id.replace('sw-header--',''));check(`render ${id}`,!(await page.locator('.sb-errordisplay').isVisible()))}
     await goto('composition')
     const presets=['기본 전체','구성 A','구성 B (레이어·선스타일)','구성 C (로고만)','파일 목록 제거','레이어 제거','색상 제거','스타일 그룹 제거','여러 메뉴 제거','순서 변경','숨김 + 순서 변경']