style(storybook): unify page hierarchy and compact layouts

src/components/button.stories.tsx

@@ -231,18 +231,7 @@ function DestructiveBoard() {
   )
 }
 
-// Compact PC layout of the representative page (Storybook presentation only; Button itself is unchanged).
-// Page and section spacing are tightened for this Story only through `compactPage`; the shared story-page.css is not edited.
-// The important modifier is required because the shared rules use the same specificity.
-const compactPage = [
-  "py-4!",
-  "[&_.sb-page-header]:pb-3!",
-  "[&_.sb-page-title]:mt-1!",
-  "[&_.sb-page-title]:mb-2!",
-  "[&_.sb-page-section]:mt-5!",
-  "[&_.sb-page-section-header]:pb-2!",
-  "[&_.sb-page-section-header]:mb-3!",
-].join(" ")
+// Page and section spacing come from the common compact Story page (story-page.css); this Story keeps no override.
 // 8px gap so the three Brand sizes stay on one line in the narrowest (Brand) column, same as the Variants rows.
 const compactRow = "flex flex-wrap items-center gap-2"
 // Equal two columns over the whole content width. StateBoard's own auto-fill grid left an empty third column
@@ -285,7 +274,7 @@ export const All: Story = {
   name: "Button",
   parameters: { layout: "fullscreen" },
   render: () => (
-    <StoryPage className={compactPage}>
+    <StoryPage>
       <StoryPageHeader title="Button" />
       <StorySection title="Sizes">
         {/* Same columns as Variants below (Brand / Standard Solid / Standard Outline): Brand and Standard Solid sizes line up with