refactor(B03): 좌측 안내 패널을 B04~B07 공용양식으로 맞춤

처음엔 B03 전용 스타일로 문단을 만들었으나, 좌측 패널 양식은 다른 단계와 같아야 한다는
사용자 지시(2026-09-03). 공용 조립으로 교체함.

- 패널 루트 `b03-file__form`, 문단은 `ui-collapsible ui-sidebar-section`,
  제목은 `ui-collapsible__title` — 외곽선·캐럿·접힘 동작이 전부 공용 CSS·동작이다.
- 값도 `b04-surface__form`·`__group`·`__group-legend` 와 같게 맞춤
  (gap·padding 16, 배경 `--color-surface-raised`, legend `--text-caption`).

검증: 실측 — 문단 클래스 `b03-file__guide-group ui-collapsible ui-sidebar-section`,
패딩 16px, 배경 `rgb(37,31,56)`, 제목 클릭 시 `is-collapsed` 토글·복귀 확인.
typecheck·prettier 통과.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

B03_FileInput/B03_FileInput_UI_Guide.ts

@@ -7,25 +7,28 @@
  * 같은 자리 — 공용 오버레이의 좌측 패널(`createWorkflowOverlays.optionsContent`) — 로
  * 옮기고, 본문은 고르는 자리만 남긴다.
  *
- * 문단 구획은 공용 `ui-sidebar-section`을 쓴다(B04·B05 좌측 패널과 같은 테두리·간격).
+ * 패널 양식은 **B04~B07과 같은 공용 양식**을 그대로 쓴다(2026-09-03 사용자 지시):
+ * 패널 루트 `{page}__form`, 문단은 `ui-collapsible ui-sidebar-section` + 제목에
+ * `ui-collapsible__title`. 제목 행을 누르면 접히는 동작·캐럿·외곽선이 전부 공용 것이다.
  * ========================================================================== */
 
+import { attachCollapsible } from "@ui/ui_template_collapsible";
 import { ui_locales, currentLanguageIndex } from "@ui/ui_template_locale";
 
 function L(key: keyof typeof ui_locales): string {
   return ui_locales[key][currentLanguageIndex];
 }
 
-/** 안내 문단 하나 — 제목 + 항목 목록. */
+/** 안내 문단 하나 — 공용 접기 컨테이너(B06 `buildGroup`과 같은 조립). */
 function section(
   titleKey: keyof typeof ui_locales,
   itemKeys: (keyof typeof ui_locales)[],
 ): HTMLElement {
   const group = document.createElement("section");
-  group.className = "ui-sidebar-section b03-file__guide-group";
+  group.className = "b03-file__guide-group ui-collapsible ui-sidebar-section";
 
   const title = document.createElement("h3");
-  title.className = "b03-file__guide-title";
+  title.className = "b03-file__guide-legend ui-collapsible__title";
   title.textContent = L(titleKey);
 
   const list = document.createElement("ul");
@@ -49,7 +52,7 @@ function section(
  */
 export function createInputGuide(statusNote?: HTMLElement): HTMLElement {
   const guide = document.createElement("div");
-  guide.className = "b03-file__guide";
+  guide.className = "b03-file__form";
   const howTo = section("B03_Guide_How_Title", [
     "B03_Guide_How_Drop",
     "B03_Guide_How_Card",
@@ -69,5 +72,6 @@ export function createInputGuide(statusNote?: HTMLElement): HTMLElement {
       "B03_Guide_Notes_LasFree",
     ]),
   );
+  attachCollapsible(guide);
   return guide;
 }

B03_FileInput/B03_FileInput_UI_Style.css

@@ -232,26 +232,33 @@
   }
 }
 
-/* --- 좌측 안내 패널 (2026-09-03) — 본문에서 뺀 설명이 사는 자리. --- */
-.b03-file__guide {
+/* --- 좌측 안내 패널 (2026-09-03) — 본문에서 뺀 설명이 사는 자리.
+   양식은 B04~B07 좌측 패널과 **같은 공용 양식**이다: 루트 `__form`, 문단은
+   `ui-collapsible ui-sidebar-section`(외곽선·접힘·캐럿은 공용 CSS 몫), 제목은
+   `__group-legend` 크기. 여기서는 값만 맞추고 새로 만들지 않는다. --- */
+.b03-file__form {
   display: flex;
   flex-direction: column;
-  gap: var(--spacing-12);
-  padding: var(--spacing-12);
+  gap: var(--spacing-16);
+  padding: var(--spacing-16);
 }
 
 .b03-file__guide-group {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-8);
-  padding: var(--spacing-12);
+  margin: 0;
+  padding: var(--spacing-16);
+  border-radius: var(--radius-cards);
+  background-color: var(--color-surface-raised);
 }
 
-.b03-file__guide-title {
+.b03-file__guide-legend {
   margin: 0;
-  font-size: var(--text-body-sm, 14px);
-  font-weight: var(--font-weight-medium, 500);
-  color: var(--color-text, #26114a);
+  padding: 0 var(--spacing-8);
+  font-size: var(--text-caption);
+  font-weight: var(--font-weight-medium);
+  color: var(--color-text-secondary);
 }
 
 .b03-file__guide-list {