feat(ui-kit): 틀 부품 여섯 — 작업 화면 틀 겉 · 일반 화면 틀 · 공개 화면 틀 · 단계 줄 · 패널 머리 · 목록 줄 (PLAN 552-4)

- 작업 화면 틀(overlay): 왼쪽 패널 = 흰 판 + 1 px 선 · 그림자 없음 · 덮개 = --color-scrim · 손잡이 강조색 그대로 · 자리 · 폭 그대로
- 일반 화면 틀 createPageFrame(대시보드 세부 꼴) · 공개 화면 틀 createPublicFrame(A01 hero · section 꼴)
- 단계 줄 data-size 28 · 40 · 상태 = 공통 값 · 패널 머리 createPanelHead · 목록 줄 createListRow(옛 .ui-sidebar-row 겉 함께)
- 부품 모음: 떠 있는 판 · 서랍 · 도구줄 · 단계 줄 · 패널 머리 · 목록 줄 여섯 줄을 frame 묶음으로 옮김 · 견본 = ui_template_ui_kit_frames.ts
- 지킴 시험 test_552_4_frames.py · B02~B09 · D · E · M02 전후 자리 수치 같음

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

ui_template/ui_template_general_layout.css

@@ -19,7 +19,6 @@
 
 .ui-general-layout__title {
   color: var(--color-text);
-  font-family: var(--font-display);
   font-size: var(--text-heading-sm);
 }
 
@@ -34,6 +33,47 @@
   gap: var(--spacing-24);
 }
 
+/* 일반 화면 틀(552-4) — 대시보드 세부 페이지 꼴(제목 20 · 설명 13 = 대시보드 값) */
+.ui-page-frame {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-16);
+  max-width: 1120px;
+  color: var(--color-text);
+}
+
+.ui-page-frame__head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: var(--spacing-16);
+}
+
+.ui-page-frame__title {
+  margin: 0;
+  color: var(--color-text);
+  font-size: 20px;
+  font-weight: var(--font-weight-bold);
+}
+
+.ui-page-frame__desc {
+  margin: var(--spacing-4) 0 0;
+  color: var(--color-text-muted);
+  font-size: 13px;
+}
+
+.ui-page-frame__action {
+  display: flex;
+  flex: none;
+  gap: var(--spacing-8);
+}
+
+.ui-page-frame__body {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
 .ui-general-block__section-header {
   display: flex;
   align-items: center;