Merge remote-tracking branches 'origin/sub_laptop_1', 'origin/sub_laptop_3' and 'origin/sub_laptop_5' into main_laptop_1

ui_template/ui_template_banner.css

@@ -14,6 +14,9 @@
   font-size: 13px;
   line-height: 1.45;
 }
+.ui-banner[hidden] {
+  display: none;
+}
 .ui-banner--warning {
   --banner-tone: var(--color-warning);
 }

ui_template/ui_template_public_layout.css

@@ -8,7 +8,7 @@
 
 .ui-public-frame__hero {
   padding: var(--spacing-96) var(--spacing-32);
-  border-bottom: 1px solid var(--color-border);
+  box-shadow: inset 0 -1px 0 var(--color-border);
   background: linear-gradient(to bottom, var(--color-accent-soft), var(--color-canvas));
 }
 
@@ -35,6 +35,14 @@
   line-height: var(--leading-heading-lg);
 }
 
+.ui-public-frame__hero[data-wide] .ui-public-frame__title {
+  max-width: 18ch;
+}
+
+.ui-public-frame__hero[data-wide] .ui-public-frame__lead {
+  max-width: 56ch;
+}
+
 .ui-public-frame__lead {
   max-width: 52ch;
   margin: 0;
@@ -66,6 +74,7 @@
   color: var(--color-text);
   font-size: var(--text-heading-sm);
   line-height: var(--leading-heading-sm);
+  text-align: center;
 }
 
 .ui-public-frame__section-body {

ui_template/ui_template_public_layout.ts

@@ -3,7 +3,7 @@
  * 공개 화면 틀 `public-frame`(552-4 틀) — 로그인 전 공개 페이지(A01 ~ A09) 몸통: 머리 띠(hero) · 구역 · 본문.
  *   꼴   = 머리 띠(제목 · 설명 · 주 단추 줄 · 가운데 / 왼쪽 맞춤) · 구역(제목 + 몸) 여럿
  *          공개 머리(로고 · 메뉴)와 바닥글(`.app-footer`)은 앱 셸 몫 — 이 틀은 그 사이 본문만
- *   크기 = 폭 = --page-max-width · 제목 = --text-heading-lg(좁으면 --text-heading) · 구역 제목 = --text-heading-sm
+ *   크기 = 폭 = --page-max-width · 제목 = --text-heading-lg(좁으면 --text-heading · `wide` = 18 자) · 구역 제목 = --text-heading-sm(가운데)
  *   상태 = 없음
  *   쓰는 법 = const f = createPublicFrame({ title: "임도 설계", lead: "…", actions: [btn] }); f.addSection("기능").append(grid)
  *   대신하는 옛 변종 = A01 ~ A05 `.a0N-hero` · `__inner` · `__title` · `__subtitle` · `__ctas` 다섯 벌 · `.a0N-section(__title)`
@@ -17,6 +17,8 @@ export interface PublicFrameOptions {
   actions?: HTMLElement[];
   /** 머리 띠 맞춤 — 기본 가운데 */
   align?: "center" | "start";
+  /** 제목 18 자 · 설명 56 자 폭(기본 14 · 52) */
+  wide?: boolean;
 }
 
 export interface PublicFrame {
@@ -41,6 +43,7 @@ export function createPublicFrame(opts: PublicFrameOptions): PublicFrame {
   const root = node("div", "ui-public-frame");
   const hero = node("section", "ui-public-frame__hero");
   hero.dataset.align = opts.align ?? "center";
+  if (opts.wide) hero.dataset.wide = "";
   const inner = node("div", "ui-public-frame__hero-inner");
   inner.append(node("h1", "ui-public-frame__title", opts.title));
   if (opts.lead) inner.append(node("p", "ui-public-frame__lead", opts.lead));