refactor(B08·B09): 자체 변종 → 부품 상자 — 탭 줄 · 분할 고르기 · 배지 칩 · 도구줄 · 떠 있는 판 · 보조 글 (PLAN 553-3)

- 위 · 보조 탭 줄 = 부품 탭(fillTabs · 밑줄 · 알약) · B09 좌측 스위치 = 분할 고르기
- 연결 칩 · 검사 탭 이름 · 끌기 태그 = 배지 · 이정표 도구 · 머리 줄 · 저장 줄 = 도구줄 · 구간 고침 · 행 고름 창 = 떠 있는 판
- 안내 · 빈 줄 · 상태 글 = 보조 글 · 운반 칸 = 카드 · 인쇄 미리보기 좌측 줄 = B09 dock 한 벌 · 쪽 체크 = 라디오 · 체크 부품
- 시험 흉내 틀 · 문구 맞춤

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

B09_Estimation/B09_Estimation_UI_Check.ts

@@ -8,6 +8,8 @@
  * ========================================================================== */
 
 import { attachHoverInfo } from "@ui/ui_template_hover_info";
+import { createBadge } from "@ui/ui_template_badge";
+import { createText } from "@ui/ui_template_text";
 import type { Row } from "./B09_Estimation_Calc_Base";
 import { tabName, type Link, type TabId } from "./B09_Estimation_UI_Tabs";
 
@@ -60,9 +62,8 @@ export function createCheckPanel(refresh: HTMLElement, goto: (link: Link) => voi
     refresh.classList.toggle("is-pending", Boolean(next.stale));
     const made = checkItems(sheets, next);
     items = made.items;
-    const head = document.createElement("p");
-    head.className = "b09-check__head";
-    head.textContent = `연결 없음 ${items.length}곳`;
+    const head = createText(`연결 없음 ${items.length}곳`, "muted");
+    head.classList.add("b09-check__head");
     const rows = document.createElement("div");
     rows.className = "ui-sidebar-list";
     rows.append(
@@ -73,18 +74,16 @@ export function createCheckPanel(refresh: HTMLElement, goto: (link: Link) => voi
         row.dataset.i = String(i);
         const name = document.createElement("span");
         name.textContent = item.name;
-        const tab = document.createElement("span");
-        tab.className = "b09-check__tab";
-        tab.textContent = item.tab;
+        const tab = createBadge(item.tab, "neutral", { size: 18 });
+        tab.classList.add("b09-check__tab");
         row.append(name, tab);
         row.addEventListener("click", () => goto(item.link));
         return row;
       }),
     );
     const notes = made.notes.map((text) => {
-      const p = document.createElement("p");
-      p.className = "b09-check__note";
-      p.textContent = text;
+      const p = createText(text, "muted");
+      p.classList.add("b09-check__note");
       return p;
     });
     list.replaceChildren(head, ...(items.length ? [rows] : []), ...notes);