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/progress.stories.tsx

@@ -7,12 +7,13 @@ import { StoryPage, StoryPageHeader, StorySection } from "@/components/story-pag
 // Progress follows `value` (0..max). The representative Story shows fixed values plus one interactive value; the same specimens
 // also exist as Stories tagged `verification` (hidden from the sidebar). No status colors are defined, so there is one look.
 
-function Interactive() {
+// `showValue={false}` hides the value readout on the representative page; the verification Stories keep it.
+function Interactive({ showValue = true }: { showValue?: boolean }) {
   const [value, setValue] = useState(30)
   return (
     <div className="grid gap-3">
       <Progress value={value} aria-label="진행률" />
-      <p className="text-sm text-muted-foreground" data-testid="value">{`value = ${value}`}</p>
+      {showValue ? <p className="text-sm text-muted-foreground" data-testid="value">{`value = ${value}`}</p> : null}
       <div className="flex gap-2">
         <Button variant="cancel" appearance="solid" size="sm" onClick={() => setValue((v) => Math.max(0, v - 25))}>
           -25
@@ -40,8 +41,8 @@ const sections = [
   { id: "zero", label: "0%", node: <Progress value={0} aria-label="0%" /> },
   { id: "middle", label: "50%", node: <Progress value={50} aria-label="50%" /> },
   { id: "full", label: "100%", node: <Progress value={100} aria-label="100%" /> },
-  { id: "custom-maximum", label: "max = 200", note: "0 / 50 / 200과 값 없음: ARIA 범위와 실제 채움 비율 확인", node: <CustomMaximum /> },
-  { id: "interactive", label: "Interactive value", note: "버튼으로 value를 바꾸면 indicator 폭과 aria-valuenow가 함께 변합니다", node: <Interactive /> },
+  { id: "custom-maximum", label: "max = 200", node: <CustomMaximum /> },
+  { id: "interactive", label: "Interactive", node: <Interactive showValue={false} /> },
 ]
 
 const meta = { title: "Components/Data & Display/Progress", component: Progress, parameters: { layout: "padded" } } satisfies Meta<typeof Progress>
@@ -49,7 +50,7 @@ export default meta
 type Story = StoryObj<typeof meta>
 
 const board = (...ids: string[]) => (
-  <StateBoard min={320} states={sections.filter((s) => ids.includes(s.id)).map((s) => ({ id: s.id, label: s.label, note: s.note, noteAfter: true, children: s.node }))} />
+  <StateBoard min={320} states={sections.filter((s) => ids.includes(s.id)).map((s) => ({ id: s.id, label: s.label, children: s.node }))} />
 )
 
 // Representative Story: the common Story page; the sections group the same specimens.
@@ -58,10 +59,7 @@ export const All: Story = {
   parameters: { layout: "fullscreen", controls: { disable: true } },
   render: () => (
     <StoryPage>
-      <StoryPageHeader
-        title="Progress"
-        description="value(0..max) 비율로 채움"
-      />
+      <StoryPageHeader title="Progress" />
       <StorySection title="Overview">{board("middle")}</StorySection>
       <StorySection title="States">{board("zero", "full")}</StorySection>
       <StorySection title="Usage">{board("custom-maximum", "interactive")}</StorySection>