add: figma_to_html_agent/blocks/ + 변환 도구 docs 갱신

전체 401 files (397 추가 + 4 수정), 14304 insertions.

추가:
- figma_to_html_agent/blocks/ — Figma 변환 결과 (32 frame, ~79MB).
  각 frame folder = {analysis.md, flat.md, texts.md, index.html, assets/,
  _renders/, _render.py, RELATIONSHIPS.md / STATUS.md / classification.md
  (일부 frame)}.
  Phase Z 의 *figma source layer* — runtime 에서 직접 사용 X, contract /
  partial / builder adapter (미래 axis A) 의 source.
- figma_to_html_agent/DISCUSSION-SUMMARY-20260411.md — 변환 설계 회의 기록.
- figma_to_html_agent/HARNESS.md — 변환 검증 harness.
- figma_to_html_agent/scripts/fetch_figma_screenshots.py — Figma 스크린샷 자동 수집.

수정:
- figma_to_html_agent/PROCESS-CONTROL.md / PROCESS.md / RULES.md —
  변환 프로세스 / 룰 갱신 (R8/R9 lock 강화 등).
- figma_to_html_agent/blocks_index.md — 32 frame 인덱스 갱신.

Phase Z 영향 0 (figma_to_html_agent/blocks/ 가 V4 catalog +
templates/phase_z2/families adapter 의 source — runtime 에서 직접 import X).

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

figma_to_html_agent/blocks/1171281202/RELATIONSHIPS.md

@@ -0,0 +1,128 @@
+# Frame 1171281202 — 원본 시각 관계 분석
+
+> 소스: `design_agent(원본)/figma_to_html_agent/block-tests/bim-sw-overview.html`
+> 목적: hybrid 재구성 전, 보존/flow화/CSS대체 영역을 명확히 분리
+
+---
+
+## 1. 반드시 유지할 시각 관계
+
+### 1-A. 좌측 패널 전체 (absolute 유지, 변경 없음)
+
+| 요소 | 위치 | 크기 |
+|------|------|------|
+| left-bg | left:38, top:74.02 | w:964.14, h:759.99 |
+| cat-bar-1 | left:103.13, top:153 | w:693.19, h:49 |
+| cat-bar-2 | left:103.13, top:352 | w:693.19, h:49 |
+| cat-bar-3 | left:103.13, top:612 | w:693.19, h:49 |
+| cat-title-1 | left:162.77, top:126 | w:606.27, h:95.8 |
+| cat-title-2 | left:162.77, top:326 | w:606.27, h:95.8 |
+| cat-title-3 | left:162.77, top:586 | w:606.27, h:95.8 |
+| sw-1 | left:166.42, top:207 | w:323.36, h:120 |
+| sw-2 | left:166.42, top:405 | w:654.63, h:180 |
+| sw-3 | left:162.46, top:671 | w:654.63, h:120 |
+
+**좌측은 건드리지 않는다.**
+
+### 1-B. 타이틀 (absolute 유지)
+
+| 요소 | 위치 | 크기 |
+|------|------|------|
+| title-icon | left:0, top:13 | w:38.05, h:40 |
+| title-text | left:51, top:0 | w:1198, h:48 |
+| title-bar | left:26, top:42 | w:255.13, h:26 |
+
+### 1-C. 장식 요소 (absolute 유지)
+
+| 요소 | 위치 | 크기 |
+|------|------|------|
+| mid-deco | left:884.33, top:192 | w:180.96, h:541 |
+| mid-arrow | left:943.66, top:375 | w:73.18, h:158 |
+
+### 1-D. 우측 5행 top rhythm (absolute Y 유지)
+
+| Row | badge top | bar top | text top | arrow top | interval |
+|-----|-----------|---------|----------|-----------|----------|
+| 1 | 78 | 105 | 123 | 152 | — |
+| 2 | 230 | 257 | 276 | 302 | 152 |
+| 3 | 384 | 412 | 430 | 456 | 154 |
+| 4 | 539 | 567 | 586 | 606 | 155 |
+| 5 | 694 | 721 | 734 | 760 | 155 |
+
+**핵심**: 이 Y rhythm은 고정. flex column으로 일반화하면 안 됨.
+
+### 1-E. 우측 row 내부 겹침 관계
+
+각 row에서 4개 요소의 X 관계:
+```
+badge:  left:1047.5,  w:88.01  → 1047.5 ~ 1135.51
+bar:    left:1094.96, w:751.54 → 1094.96 ~ 1846.50
+text:   left:1176.05, w:687.26 → 1176.05 ~ 1863.31
+arrow:  left:1794.09, w:47.47  → 1794.09 ~ 1841.56
+```
+
+**겹침 관계:**
+- badge는 bar 시작점 좌측으로 47.46px 돌출 (1094.96-1047.5)
+- badge와 bar는 40.55px 겹침 (1135.51-1094.96)
+- text는 bar 좌측에서 81.09px 안쪽에서 시작 (1176.05-1094.96)
+- text는 bar 우측을 16.81px 넘어감 (1863.31-1846.50) ← 원본 특성
+- arrow는 bar 내부, 우측에서 52.41px 안쪽 (1846.50-1794.09)
+
+---
+
+## 2. flow/flex로 바꿔도 되는 내부 영역
+
+### 우측 row 내부만 (row Y는 유지)
+
+**현재 (원본)**:
+- badge, bar, text, arrow 모두 독립 absolute
+
+**하이브리드**:
+각 row를 하나의 컨테이너로 묶고, row의 top은 원본 값 유지.
+내부에서만 관계 재정의:
+
+```
+.row-N (absolute top: 원본 값, left: 1047.5px)
+  .badge (absolute overlay, z-index:2)
+  .bar (CSS background, position:relative)
+    .text (bar 내부 usable area 기준)
+    .arrow (bar 끝 구조 자산)
+```
+
+**"bar 내부 usable area" 계산:**
+- bar left edge → text start: 81px (padding-left)
+- text end → bar right edge: text가 16.8px 넘어감 → 넘어가도록 허용하거나 bar를 확장
+- arrow start → bar right edge: 52px (padding-right for arrow area)
+
+---
+
+## 3. CSS로 대체 가능한 자산
+
+| 원본 자산 | CSS 대체 | 상태 |
+|----------|---------|------|
+| left-bg | CSS gradient + clip-path | 원본에서 이미 CSS |
+| cat-bar × 3 | CSS gradient | 원본에서 이미 CSS |
+| right-bar × 5 | CSS background | 원본에서 이미 CSS |
+| mid-deco | CSS radial-gradient | 원본에서 이미 CSS |
+| title-bar | CSS blur | 원본에서 이미 CSS |
+| badge × 5 | **이미지 유지** (복잡한 원형 + 숫자) | — |
+| arrow × 5 | **이미지 유지** (화살표 아이콘) | — |
+| mid-arrow | **이미지 유지** | — |
+| title-icon | **이미지 유지** | — |
+
+→ 원본에서 이미 모든 CSS 변환 완료. 추가 대체 대상 없음.
+
+---
+
+## 4. 하이브리드 재구성 축 순서
+
+**축1 (먼저)**: row geometry
+- 좌측 전체 유지 (absolute 그대로)
+- 우측 5행: 각 row를 하나의 컨테이너로 묶기
+- row top은 원본 값 유지
+- 내부: badge overlay + bar(contains text + arrow)
+- 이 단계에서는 text usable area는 아직 안 건드림
+
+**축2 (다음)**: text usable area
+- bar 내부에서 text의 padding/width를 "bar usable area"로 재정의
+- arrow를 bar 끝 구조 자산으로 재배치

figma_to_html_agent/blocks/1171281202/STATUS.md

@@ -0,0 +1,25 @@
+# Frame 1171281202 — STATUS
+
+## classification: rewrite (fixed-row hybrid)
+
+## 현재 축: 축1 — row geometry
+
+### target axis
+- 우측 5행: 독립 absolute 요소들 → row 컨테이너로 묶기
+- row top은 원본 값 유지
+- 내부: badge(overlay) + bar(contains text + arrow)
+
+### do not touch
+- 좌측 패널 전체 (left-bg, cat-bar, cat-title, sw-list)
+- 타이틀 전체
+- 장식 요소 (mid-deco, mid-arrow)
+- 우측 row의 Y rhythm
+- zoom 값
+- text usable area (축2에서 처리)
+
+### baseline
+원본 bim-sw-overview.html (transform:scale → zoom만 변경)
+
+### stop condition
+- badge/bar 겹침 관계가 깨질 시 → 중단
+- 좌측 패널에 영향 발생 시 → 중단

figma_to_html_agent/blocks/1171281202/analysis.md

@@ -0,0 +1,64 @@
+# Frame 1171281202 — Model에 특화된 Engn. S/W
+
+## 내용 설명
+
+Model에 특화된 Engineering S/W(GIS·Modeler·Simulation)를 좌측
+카테고리 패널 + 우측 번호별 상세 설명 구조로 제시하는 디자인.
+이 디자인은 Solution Engineering S/W(Frame 21 협업·사용자 중심)와
+달리 모델 중심 S/W의 고가·고사양·전문가 중심 특성을 강조.
+Model 특화 S/W 분류 (GIS/Modeler/Simulation)·고가 전문가용 S/W
+특성 설명·번호별 카테고리 설명에 적합. Solution/협업 중심
+S/W(Frame 21)·주체별 나열·시간 순서·2개 개념 대조·필수요건
+나열에는 부적합.
+
+## 후보 키워드
+
+Model특화, GIS, Modeler, Simulation, 모델중심, 고가, 고사양, 모델, Engineering, Engn, S/W, EngineeringSW
+
+## 정제 Anchor Sets
+
+- **model_specialized**: Model특화, GIS, Modeler, Simulation, 모델중심
+- **high_cost_specialist**: 고가, 고사양, 모델
+- **engn_sw_context**: Engineering, Engn, S/W, EngineeringSW
+
+## 구조 매칭 정보
+
+- **family**: diagram
+- **layout**: split-panel-numbered
+- **axis**: horizontal
+- **relation_type**: parallel
+- **cardinality**: ideal 3 / min 3 / max 4
+- **slots** (5개, required 5개): title, category_panel, item_1_body, item_2_body, item_3_body
+- **source title**: Model에 특화된 Engn. S/W
+- **original layout**: split-panel-numbered
+
+## 적합/부적합 기준
+
+### suits
+- Model 특화 S/W 분류
+- 고가 전문가용 S/W 특성
+- GIS/Modeler/Simulation 나열
+
+### not_suits
+- Solution/협업 중심 S/W
+- 주체별 나열 (발주자/시공자/설계자)
+- 시간 순서
+- 2개 개념 대조
+- 필수요건 나열 (기술/사람/자연)
+- 단일 제품 심층
+
+## 재구성 허용
+
+- **split**: False
+- **merge**: False
+- **infer_missing_slot**: False
+- **rewrite_label**: True
+- **rewrite_body**: True
+
+## 메타
+
+- schema_version: template-fit-v1 mirror
+- source_of_truth: structure_ontology.yaml + keyword_base.yaml
+- structure_content_original_tagged_by: claude-opus-4-7 (2026-04-21)
+- keyword_base_sync_at: 2026-04-22
+- anchor_sets_cleaned_at: 2026-04-22

figma_to_html_agent/blocks/1171281202/analysis.md.pre_milestone2.bak

@@ -0,0 +1,17 @@
+# Frame 1171281202 — Model에 특화된 Engn. S/W
+
+## 구조
+- **layout**: split-panel-numbered
+- **detail**: 타이틀("Model에 특화된 Engn. S/W") + 좌측 카테고리 패널 + 우측 번호별 설명
+
+## 내용
+Model 특화 Engineering S/W — GIS·Modeler·Simulation 등 모델 중심 S/W의 고가·고사양·전문가 중심 특성 설명.
+
+## 후보 키워드
+Model특화, Engn.S/W, EngineeringSW, GIS, Modeler, Simulation, 고가, 고사양, 전문가중심, 모델중심, split-panel
+
+## 메타
+- source: texts.md + flat.md
+- schema_version: analysis-v1
+- tagged_by: claude-opus-4-7
+- tagged_at: 2026-04-21

figma_to_html_agent/blocks/1171281202/classification.md

@@ -0,0 +1,32 @@
+# Frame 1171281202 — 분류: rewrite
+
+## 근거
+1. 전체 absolute 배치 → R17 flex/flow 전환 필요
+2. 좌측 카테고리와 우측 번호 행이 모두 고정 좌표 → 텍스트 변경 시 깨짐
+3. 구조 변경 범위가 patch 수준 초과
+
+## 변경 대상
+- Layout: absolute → flex row (좌/우 분할) + flex column (각 패널 내부)
+- 좌측 카테고리: absolute → flex column (cat-header + sw-list flow)
+- 우측 번호 행: 각각 absolute → flex row (badge + bar + text + arrow)
+- 장식 요소: 별도 div → content-area 내 absolute (flow 영향 없음)
+
+## 변경하지 않는 것
+- 색상, gradient 값 (cat-bar, left-bg, right-bar)
+- 텍스트 내용
+- 에셋 이미지 (badge, arrow, icon)
+- zoom 값 (0.68706)
+
+## 구조 결정 (HARNESS §4)
+```
+이 블록의 레이아웃은?
+├── 좌우 분할 (좌:카테고리 / 우:번호 행)
+│   → flex row
+├── 좌측: 3 카테고리 순차 배치
+│   → flex column (category 간 flow)
+│   → 각 category: cat-header(relative) + sw-list(flow)
+├── 우측: 5 번호 행 순차 배치
+│   → flex column (gap: 57px)
+│   → 각 row: flex row (badge + bar(text + arrow))
+└── 장식: left-bg, mid-deco, mid-arrow → absolute
+```

figma_to_html_agent/blocks/1171281202/flat.md

@@ -0,0 +1,76 @@
+# Frame 1171281202 — 실측 기록 (flat)
+
+> 원본: 1863 × 834 px (node 112:49)
+> 패턴: split-panel-numbered (좌: 카테고리 리스트 / 우: 번호 항목)
+> Scale: 1280 / 1863 = 0.68707
+
+## 구조
+
+```
+Frame 112:49 (1863 × 834)
+├── 112:84 타이틀 (0, 0) 1249×53
+│   ├── 112:86 아이콘 IMG (0, 13) 38×40
+│   └── 112:85 TEXT "Model에 특화된 Engn. S/W" center_y=24 — 70px/50px gradient
+│
+├── 좌측 패널
+│   ├── 112:62 배경 IMG (38, 74.02) 964×760
+│   ├── 112:83 타이틀 장식 IMG (26, 42) 255×26
+│   ├── 112:64 구분선1 IMG (103.13, 153) 693×49
+│   ├── 112:65 구분선2 IMG (103.13, 352) 693×49
+│   ├── 112:66 구분선3 IMG (103.13, 612) 693×49
+│   ├── 112:67 TEXT "GIS" center_y=173.9 — 40px Bold white, text-shadow
+│   ├── 112:70 TEXT detail center_y=267 — 35px Medium black
+│   ├── 112:68 TEXT "Modeler" center_y=373.9 — 40px Bold white
+│   ├── 112:71 TEXT detail center_y=495 — 35px Medium black
+│   ├── 112:69 TEXT "Simulation & Video" center_y=633.9 — 40px Bold white
+│   └── 112:72 TEXT detail center_y=731 — 35px Medium black
+│
+├── 중앙 연결
+│   ├── 112:61 세로 괄호 IMG (884.33, 192) 181×541
+│   └── 112:63 커넥터 IMG (943.66, 375) 73×158
+│
+└── 우측 패널 — 5개 행 (번호 뱃지 + 설명 바 + 화살표)
+    ├── 행1: 112:78 뱃지01 IMG (1047.5, 78) 88×93
+    │        112:51 바 IMG (1094.96, 105) 751.5×97
+    │        112:73 TEXT center_y=153 "Model 구축에 필요한 기능 위주" — 45px Medium #11231d
+    │        112:56 화살표 IMG (1794.09, 152) 47.5×45 rotate(180deg)
+    │
+    ├── 행2: (1047.5, 230) / (1094.96, 257) / center_y=306 / (1794.09, 302)
+    │        "고가, 고사양, 복잡, 전문가용"
+    │
+    ├── 행3: (1047.5, 384) / (1094.96, 412) / center_y=460 / (1794.09, 456)
+    │        "Engn. S/W간에 호환 안됨"
+    │
+    ├── 행4: (1047.5, 539) / (1094.96, 567) / center_y=616 / (1794.09, 606)
+    │        "성과물 제작은 별도"
+    │
+    └── 행5: (1047.5, 694) / (1094.96, 721) / center_y=764 / (1794.09, 760)
+             "시공 현장상황 반영에 한계"
+```
+
+## 에셋 (15개, 모두 이미지 유지)
+
+| hash | 노드 | 의미 |
+|------|------|------|
+| 88055da8...png | 112:62 | 좌측 배경 |
+| 30a42d91...png | 112:83 | 타이틀 장식 |
+| d6fa176a...png | 112:64 | 구분선1 |
+| d40af52c...png | 112:65 | 구분선2 |
+| 1e3fb882...png | 112:66 | 구분선3 |
+| 81fe1c5f...png | 112:61 | 세로 괄호 |
+| 2f957489...png | 112:63 | 커넥터 |
+| 6c4cc6c0...png | 112:51~55 | 우측 행 바 (×5 동일) |
+| 42dca7c1...png | 112:78 | 뱃지 01 |
+| 9d86013a...png | 112:79 | 뱃지 02 |
+| 470d76de...png | 112:80 | 뱃지 03 |
+| 7e83d2e4...png | 112:81 | 뱃지 04 |
+| 4ea963b9...png | 112:82 | 뱃지 05 |
+| 7e7eb79f...png | 112:56~60 | 화살표 (×5 동일, rotate 180°) |
+| bd3796e1...png | 112:86 | 타이틀 아이콘 |
+
+## 변형 가능 축
+
+- left_categories[N=2~5] (required) — 카테고리명 + 상세 리스트
+- right_items[N=3~8] (required) — 번호 + 설명
+- bg_image (required)
+- bracket_image (optional)

figma_to_html_agent/blocks/1171281202/index.html

@@ -0,0 +1,250 @@
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=1280">
+<title>Model에 특화된 Engn. S/W (Frame 1171281202)</title>
+<!--
+  원본: design_agent(원본)/figma_to_html_agent/block-tests/bim-sw-overview.html
+  하이브리드: fixed-row hybrid
+  축1: 우측 5행 row 컨테이너화 (Y rhythm 유지, 내부만 재구성)
+  축2 (미적용): text usable area 재정의
+  변경하지 않은 것: 좌측 전체, 타이틀, 장식, zoom
+-->
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@500;700;900&display=swap" rel="stylesheet">
+<style>
+* { margin: 0; padding: 0; box-sizing: border-box; }
+body {
+  font-family: 'Noto Sans KR', sans-serif;
+  background: #e8ecf0;
+  display: flex; justify-content: center; align-items: center;
+  min-height: 100vh; padding: 20px;
+  word-break: keep-all;
+}
+.slide {
+  width: 1280px;
+  background: #fff;
+  position: relative;
+  box-shadow: 0 4px 20px rgba(0,0,0,.15);
+}
+.block { width: 1280px; position: relative; overflow: hidden; }
+.inner {
+  width: 1863.306px; height: 834.005px;
+  zoom: 0.68706; /* R19: transform:scale → zoom */
+  position: relative;
+}
+.abs { position: absolute; }
+.abs img { width: 100%; height: 100%; object-fit: cover; display: block; }
+
+/* ─── 타이틀 (원본 그대로) ─── */
+.title-icon { left: 0; top: 13px; width: 38.05px; height: 40px; }
+.title-text {
+  left: 51px; top: 0; width: 1198px; height: 48px;
+  font-weight: 900; line-height: 55px; white-space: nowrap;
+}
+.title-text .model {
+  font-size: 70px;
+  background-image: linear-gradient(180deg, #cc5200 0%, #883700 100%);
+  -webkit-background-clip: text; background-clip: text; color: transparent;
+}
+.title-text .sub {
+  font-size: 50px;
+  background-image: linear-gradient(180deg, #296b55 0%, #000 100%);
+  -webkit-background-clip: text; background-clip: text; color: transparent;
+}
+.title-bar {
+  left: 26px; top: 42px; width: 255.13px; height: 26px;
+  background: rgba(0,0,0,0.08);
+  border-radius: 4px;
+  filter: blur(8px);
+}
+
+/* ─── 좌측 패널 (원본 PNG 복원 — CSS clip-path 대신 원본 이미지 사용) ─── */
+.left-bg {
+  left: 38px; top: 74.02px; width: 964.14px; height: 759.99px;
+}
+.left-bg img {
+  width: 100%; height: 100%;
+  object-fit: fill;
+}
+.cat-bar { height: 49px; border-radius: 5px; }
+.cat-bar-1 {
+  left: 103.13px; top: 153px; width: 693.19px;
+  background: linear-gradient(90deg, #417d38 0%, #417d38 85%, rgba(65,125,56,0) 100%);
+}
+.cat-bar-2 {
+  left: 103.13px; top: 352px; width: 693.19px;
+  background: linear-gradient(90deg, #008e52 0%, #008e52 85%, rgba(0,142,82,0) 100%);
+}
+.cat-bar-3 {
+  left: 103.13px; top: 612px; width: 693.19px;
+  background: linear-gradient(90deg, #008970 0%, #008970 85%, rgba(0,137,112,0) 100%);
+}
+.cat-title {
+  font-weight: 700; font-size: 40px; line-height: 90px;
+  color: #fff; text-shadow: 0 0 4px rgba(0,0,0,0.5);
+  width: 606.27px;
+  display: flex; flex-direction: column; justify-content: center;
+}
+.cat-title-1 { left: 162.77px; top: 126px; height: 95.8px; }
+.cat-title-2 { left: 162.77px; top: 326px; height: 95.8px; }
+.cat-title-3 { left: 162.77px; top: 586px; height: 95.8px; }
+.sw-list {
+  font-weight: 500; font-size: 35px; line-height: 60px;
+  color: #000; text-shadow: 0 0 4px rgba(0,0,0,0.5);
+  display: flex; flex-direction: column; justify-content: center;
+}
+.sw-1 { left: 166.42px; top: 207px; width: 323.36px; height: 120px; }
+.sw-2 { left: 166.42px; top: 405px; width: 654.63px; height: 180px; }
+.sw-3 { left: 162.46px; top: 671px; width: 654.63px; height: 120px; }
+
+/* ─── 장식 (원본 그대로) ─── */
+.mid-deco {
+  left: 884.33px; top: 192px; width: 180.96px; height: 541px;
+  background: radial-gradient(ellipse 60% 50% at 100% 50%,
+    rgba(217,217,217,0.8) 0%,
+    rgba(217,217,217,0.13) 60%,
+    transparent 100%);
+}
+.mid-arrow { left: 943.66px; top: 375px; width: 73.18px; height: 158px; }
+
+/* ─── 축1: 우측 5행 — row 컨테이너 ─── */
+/* 각 row: absolute top = 원본 badge top (row 기준점)
+   내부: badge(overlay) + bar(contains text area + arrow) */
+.right-row {
+  position: absolute;
+  left: 1047.5px;
+  /* width: badge + bar 전체 = 1846.5 - 1047.5 = 799px */
+  width: 799px;
+  height: 97px; /* bar height 기준 */
+}
+.right-row-1 { top: 78px; }
+.right-row-2 { top: 230px; }
+.right-row-3 { top: 384px; }
+.right-row-4 { top: 539px; }
+.right-row-5 { top: 694px; }
+
+/* badge: row 내 overlay */
+.row-badge {
+  position: absolute;
+  left: 0; top: 0;
+  width: 88.01px; height: 93px;
+  z-index: 2;
+}
+.row-badge img { width: 100%; height: 100%; object-fit: contain; }
+
+/* bar: row 내 배경 — badge 오른쪽에서 시작 */
+.row-bar {
+  position: absolute;
+  /* bar left: 1094.96 - 1047.5 = 47.46px from row left */
+  left: 47.46px;
+  /* bar top: 105 - 78 = 27px from row top (row1 기준, 다른 row도 동일) */
+  top: 27px;
+  width: 751.54px; height: 97px;
+  background: #e8ede3;
+  border-radius: 10px;
+}
+
+/* text: bar 내부 usable area */
+.row-text {
+  position: absolute;
+  /* text left: 1176.05 - 1094.96 = 81.09px from bar left */
+  left: 81px;
+  top: 0; height: 100%;
+  width: 687.26px;
+  font-weight: 500; font-size: 45px; line-height: 60px;
+  color: #11231d; text-shadow: 0 0 4px rgba(0,0,0,0.5);
+  display: flex; align-items: center;
+}
+
+/* arrow: bar 끝 구조 자산 */
+.row-arrow {
+  position: absolute;
+  /* arrow left: 1794.09 - 1094.96 = 699.13px from bar left */
+  left: 699.13px;
+  /* arrow top: 152 - 105 = 47px from bar top (row1 기준) */
+  top: 47px;
+  width: 47.47px; height: 45px;
+  transform: rotate(180deg);
+}
+.row-arrow img { width: 100%; height: 100%; object-fit: contain; }
+</style>
+</head>
+<body>
+<div class="slide">
+  <div class="block">
+    <div class="inner">
+      <!-- 타이틀 (원본 그대로) -->
+      <div class="abs title-icon"><img src="assets/bd3796e13b417d32322b3cd6d3962f892c52ec9b.png" alt=""></div>
+      <div class="abs title-text"><span class="model">Model</span><span class="sub">에 특화된 Engn. S/W</span></div>
+      <div class="abs title-bar"></div>
+
+      <!-- 좌측 패널 BG (원본 PNG 복원) -->
+      <div class="abs left-bg"><img src="assets/88055da8b5f893371359dd5073785804141dc86a.png" alt=""></div>
+      <div class="abs cat-bar cat-bar-1"></div>
+      <div class="abs cat-bar cat-bar-2"></div>
+      <div class="abs cat-bar cat-bar-3"></div>
+      <div class="abs cat-title cat-title-1">GIS</div>
+      <div class="abs cat-title cat-title-2">Modeler</div>
+      <div class="abs cat-title cat-title-3">Simulation &amp; Video</div>
+      <div class="abs sw-list sw-1">· ArcGIS, QGIS<br>· 천지인</div>
+      <div class="abs sw-list sw-2">· Rhino, Blender, Sketch-up<br>· EG-BIM Modeller · Revit<br>· Civil 3D(+KG Road), Naviswork</div>
+      <div class="abs sw-list sw-3">· Twin Highway<br>· Infraworks</div>
+
+      <!-- 장식 (원본 그대로) -->
+      <div class="abs mid-deco"></div>
+      <div class="abs mid-arrow"><img src="assets/2f95748966536058809971fd1c9ed646d3e1f3a7.png" alt=""></div>
+
+      <!-- ═══ 축1: 우측 5행 — row 컨테이너 ═══ -->
+
+      <!-- Row 1 -->
+      <div class="right-row right-row-1">
+        <div class="row-badge"><img src="assets/42dca7c1ca42ba8520aa274fd4471bd054dfe36b.png" alt="01"></div>
+        <div class="row-bar">
+          <div class="row-text">Model 구축에 필요한 기능 위주</div>
+          <div class="row-arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
+        </div>
+      </div>
+
+      <!-- Row 2 -->
+      <div class="right-row right-row-2">
+        <div class="row-badge"><img src="assets/9d86013a10b048eede6cceb2012f7958dfaf616c.png" alt="02"></div>
+        <div class="row-bar">
+          <div class="row-text">고가, 고사양, 복잡, 전문가용</div>
+          <div class="row-arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
+        </div>
+      </div>
+
+      <!-- Row 3 -->
+      <div class="right-row right-row-3">
+        <div class="row-badge"><img src="assets/470d76de62f4864e6c42b25bcf7446e2aaef981a.png" alt="03"></div>
+        <div class="row-bar">
+          <div class="row-text">Engn. S/W간에 호환 안됨</div>
+          <div class="row-arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
+        </div>
+      </div>
+
+      <!-- Row 4 -->
+      <div class="right-row right-row-4">
+        <div class="row-badge"><img src="assets/7e83d2e4d7df471367df19708e2628010d586ed2.png" alt="04"></div>
+        <div class="row-bar">
+          <div class="row-text">성과물 제작은 별도</div>
+          <div class="row-arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
+        </div>
+      </div>
+
+      <!-- Row 5 -->
+      <div class="right-row right-row-5">
+        <div class="row-badge"><img src="assets/4ea963b9abbbbb2623d4ec41c2a6eea6ea2856d4.png" alt="05"></div>
+        <div class="row-bar">
+          <div class="row-text">시공 현장상황 반영에 한계</div>
+          <div class="row-arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
+        </div>
+      </div>
+
+    </div>
+  </div>
+</div>
+</body>
+</html>

figma_to_html_agent/blocks/1171281202/texts.md

@@ -0,0 +1,19 @@
+# Frame 1171281202 — 텍스트 (TF-IDF 매칭용)
+
+## 타이틀
+Model에 특화된 Engn. S/W
+
+## 좌측 패널 — 카테고리
+GIS
+· ArcGIS, QGIS · 천지인
+Modeler
+· Rhino, Blender, Sketch-up · EG-BIM Modeller · Revit · Civil 3D(+KG Road), Naviswork
+Simulation & Video
+· Twin Highway · Infraworks
+
+## 우측 패널 — 항목
+Model 구축에 필요한 기능 위주
+고가, 고사양, 복잡, 전문가용
+Engn. S/W간에 호환 안됨
+성과물 제작은 별도
+시공 현장상황 반영에 한계