refactor(B07): 한 장짜리 도면은 컨테이너 없이 버튼만 둔다

도면이 한 장뿐인 그룹(종단면도)과 아직 만들지 않은 그룹은 접이식 컨테이너에
항목 하나를 넣을 이유가 없다. 그룹 이름을 단 버튼 하나로 바꾼다.

- 0~1장: 컨테이너 없이 버튼 하나 (없으면 비활성 + '준비 중')
- 2장 이상(횡단면도): 기존 접이식 컨테이너 유지
- 버튼 생성은 drawingButton() 헬퍼로 합침

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

B07_DesignDetail/B07_DesignDetail_UI_Page.ts

@@ -115,39 +115,53 @@ function buildDrawingSidePanel(
     return panel;
   }
 
+  const drawingButton = (drawing: DesignDrawingItem, label: string): HTMLButtonElement => {
+    const button = document.createElement("button");
+    button.type = "button";
+    button.className = "b07-drawing-button";
+    button.dataset.drawingId = drawing.id;
+    button.dataset.confirmed = String(drawing.confirmed);
+    const name = document.createElement("span");
+    name.className = "b07-drawing-button__name";
+    name.textContent = label;
+    button.append(name);
+    button.addEventListener("click", () => onSelect(drawing));
+    return button;
+  };
+
   for (const group of DRAWING_GROUPS) {
     const items = group.kind ? drawings.filter((item) => item.kind === group.kind) : [];
+    // 한 장짜리(와 아직 없는 도면)는 컨테이너 없이 버튼 하나로 둔다.
+    if (items.length <= 1) {
+      const [drawing] = items;
+      const button = drawing
+        ? drawingButton(drawing, group.label)
+        : document.createElement("button");
+      if (!drawing) {
+        button.type = "button";
+        button.className = "b07-drawing-button";
+        button.disabled = true;
+        button.title = "준비 중";
+        const name = document.createElement("span");
+        name.className = "b07-drawing-button__name";
+        name.textContent = group.label;
+        button.append(name);
+      }
+      button.dataset.pending = String(!drawing);
+      panel.append(button);
+      continue;
+    }
     const section = document.createElement("section");
     // ui-sidebar-section: 사이드 컨테이너 공통 외곽선(B04~B06과 통일, 2026-08-06 사용자 지시).
     section.className = "b07-drawing-group ui-collapsible ui-sidebar-section";
     if (group.kind) section.dataset.kind = group.kind;
-    section.dataset.pending = String(!group.kind);
     const sectionTitle = document.createElement("h3");
     sectionTitle.className = "ui-collapsible__title";
-    sectionTitle.textContent = items.length ? `${group.label} ${items.length}` : group.label;
+    sectionTitle.textContent = `${group.label} ${items.length}`;
     section.append(sectionTitle);
-    if (!items.length) {
-      const note = document.createElement("p");
-      note.className = "b07-drawing-list__empty";
-      note.textContent = "준비 중";
-      section.append(note);
-      section.classList.add("is-collapsed");
-      panel.append(section);
-      continue;
-    }
     for (const drawing of items) {
-      const button = document.createElement("button");
-      button.type = "button";
-      button.className = "b07-drawing-button";
-      button.dataset.drawingId = drawing.id;
-      button.dataset.confirmed = String(drawing.confirmed);
-      const name = document.createElement("span");
-      name.className = "b07-drawing-button__name";
       // 횡단면도는 장 단위(여러 측점)라 서버가 준 "N장 (구간)" 라벨을 그대로 쓴다.
-      name.textContent = drawing.label;
-      button.append(name);
-      button.addEventListener("click", () => onSelect(drawing));
-      section.append(button);
+      section.append(drawingButton(drawing, drawing.label));
     }
     panel.append(section);
   }

B07_DesignDetail/B07_DesignDetail_UI_Style.css

@@ -63,13 +63,10 @@
   font-weight: 600;
 }
 
-/* 아직 만들지 않는 도면 그룹 — 자리만 잡아 둔다. */
-.b07-drawing-group[data-pending="true"] h3 {
-  opacity: 0.55;
-}
-
-.b07-drawing-group .b07-drawing-list__empty {
-  margin: 0 0 var(--spacing-4);
+/* 아직 만들지 않는 도면 — 자리만 잡아 둔 버튼. */
+.b07-drawing-button[data-pending="true"] {
+  opacity: 0.5;
+  cursor: not-allowed;
 }
 
 /* 그리드 제목은 두 열을 가로지른다 */