refactor(storybook): simplify component and preview examples

Drop page / section descriptions, state notes and repeated captions from
the representative Stories of 44 components, the Patterns, Center
Graphic and OrgChart pages. Value readouts, spec lists and captions hide
only on the representative page; hidden verification Stories keep them.
Tabs Default API and the Filter Bar draft / applied counts move to the
hidden DefaultApi and DraftApplied Stories; Center Overview is hidden
with its direct URL kept. Story IDs are unchanged.

Align the component, pattern and OrgChart docs with the pages, point the
quality reference check at the DraftApplied Story, and make the P8
styles check expect no section header on the preview-only Expanded page.

src/components/radio-group.stories.tsx

@@ -12,6 +12,7 @@ function Group({
   disabledItem,
   invalid,
   orientation,
+  hoverItem,
 }: {
   prefix: string
   defaultValue?: string
@@ -19,12 +20,14 @@ function Group({
   disabledItem?: string
   invalid?: boolean
   orientation?: "horizontal" | "vertical"
+  // Pins :hover on one item with the Storybook-only data-sb-hover attribute (.storybook/pseudo-states.ts).
+  hoverItem?: string
 }) {
   return (
     <RadioGroup defaultValue={defaultValue} disabled={disabled} orientation={orientation} aria-label={prefix}>
       {["a", "b", "c"].map((v) => (
         <div key={v} className="flex items-center gap-2">
-          <RadioGroupItem value={v} id={`${prefix}-${v}`} disabled={disabledItem === v} aria-invalid={invalid ? true : undefined} />
+          <RadioGroupItem value={v} id={`${prefix}-${v}`} disabled={disabledItem === v} aria-invalid={invalid ? true : undefined} data-sb-hover={hoverItem === v ? "" : undefined} />
           <Label htmlFor={`${prefix}-${v}`}>Option {v.toUpperCase()}</Label>
         </div>
       ))}
@@ -53,12 +56,9 @@ export const All: Story = {
   parameters: { layout: "fullscreen", controls: { disable: true } },
   render: () => (
     <StoryPage>
-      <StoryPageHeader
-        title="Radio Group"
-        description="그룹 안에서 방향키로 이동·선택"
-      />
+      <StoryPageHeader title="Radio Group" />
       <StorySection title="Overview">
-        <StateBoard min={240} states={[{ id: "vertical", label: "Vertical (default) · Checked / Unchecked", children: <Group prefix="v" defaultValue="b" /> }]} />
+        <StateBoard min={240} states={[{ id: "vertical", label: "Vertical", children: <Group prefix="v" defaultValue="b" /> }]} />
       </StorySection>
       <StorySection title="Variants">
         <StateBoard min={240} states={[{ id: "horizontal", label: "Horizontal", children: <Group prefix="h" orientation="horizontal" /> }]} />
@@ -67,14 +67,14 @@ export const All: Story = {
         <StateBoard
           min={240}
           states={[
-            { id: "hover", label: "Hover", noteAfter: true, note: "Hover한 항목의 테두리가 primary 색이 됩니다.", children: <Group prefix="hv" defaultValue="" /> },
-            { id: "focus", label: "Focus", noteAfter: true, note: "그룹에 Tab으로 들어가면 선택된 항목에 focus ring이 표시됩니다.", children: <Group prefix="f" /> },
+            { id: "hover", label: "Hover", children: <Group prefix="hv" defaultValue="" hoverItem="a" /> },
+            { id: "focus", label: "Focus", children: <Group prefix="f" /> },
             { id: "disabled-item", label: "Disabled · 항목", children: <Group prefix="di" disabledItem="b" /> },
             { id: "disabled-group", label: "Disabled · 그룹", children: <Group prefix="dg" disabled /> },
           ]}
         />
       </StorySection>
-      <StorySection title="Validation" description="aria-invalid → Error 테두리">
+      <StorySection title="Validation">
         <StateBoard min={240} states={[{ id: "error", label: "Error", children: <Group prefix="e" invalid /> }]} />
       </StorySection>
     </StoryPage>