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

@@ -37,7 +37,8 @@ function useReadout() {
   return { setApi, current, count }
 }
 
-function Basic() {
+// `showValue={false}` hides the value readout on the representative page; the verification Stories keep it.
+function Basic({ showValue = true }: { showValue?: boolean }) {
   const { setApi, current, count } = useReadout()
   return frame(
     <div className="grid gap-2">
@@ -52,7 +53,7 @@ function Basic() {
         <CarouselPrevious />
         <CarouselNext />
       </Carousel>
-      <span className="text-center text-sm text-muted-foreground" data-testid="readout">{`slide ${current} / ${count}`}</span>
+      {showValue ? <span className="text-center text-sm text-muted-foreground" data-testid="readout">{`slide ${current} / ${count}`}</span> : null}
     </div>
   )
 }
@@ -73,7 +74,7 @@ function Multiple() {
   )
 }
 
-function Loop() {
+function Loop({ showValue = true }: { showValue?: boolean }) {
   const { setApi, current, count } = useReadout()
   return frame(
     <div className="grid gap-2">
@@ -88,7 +89,7 @@ function Loop() {
         <CarouselPrevious />
         <CarouselNext />
       </Carousel>
-      <span className="text-center text-sm text-muted-foreground" data-testid="loop-readout">{`slide ${current} / ${count}`}</span>
+      {showValue ? <span className="text-center text-sm text-muted-foreground" data-testid="loop-readout">{`slide ${current} / ${count}`}</span> : null}
     </div>
   )
 }
@@ -130,11 +131,11 @@ function Media() {
 }
 
 const sections = [
-  { id: "basic", label: "Basic (single item) + setApi readout", node: <Basic /> },
-  { id: "multiple", label: "Multiple items (basis-1/2)", node: <Multiple /> },
-  { id: "loop", label: "Loop (controls never disable)", node: <Loop /> },
+  { id: "basic", label: "Basic", node: <Basic showValue={false} /> },
+  { id: "multiple", label: "Multiple items", node: <Multiple /> },
+  { id: "loop", label: "Loop", node: <Loop showValue={false} /> },
   { id: "vertical", label: "Vertical", node: <Vertical /> },
-  { id: "media", label: "Media (AspectRatio composition)", node: <Media /> },
+  { id: "media", label: "Media", node: <Media /> },
 ]
 
 const meta = { title: "Components/Data & Display/Carousel", component: Carousel, parameters: { layout: "padded" } } satisfies Meta<typeof Carousel>
@@ -151,12 +152,9 @@ export const All: Story = {
   parameters: { layout: "fullscreen", controls: { disable: true } },
   render: () => (
     <StoryPage>
-      <StoryPageHeader
-        title="Carousel"
-        description="슬라이드 폭(basis-*)은 CarouselItem className"
-      />
+      <StoryPageHeader title="Carousel" />
       <StorySection title="Overview">{board("basic")}</StorySection>
-      <StorySection title="Variants" description="여러 항목 · loop · 세로">{board("multiple", "loop", "vertical")}</StorySection>
+      <StorySection title="Variants">{board("multiple", "loop", "vertical")}</StorySection>
       <StorySection title="Usage">{board("media")}</StorySection>
     </StoryPage>
   ),