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/1171281206/analysis.md

@@ -0,0 +1,60 @@
+# Frame 1171281206 — 상용 S/W 의존의 4대 문제
+
+## 내용 설명
+
+상용 S/W 의존이 초래한 4가지 병렬 문제를 카드 그리드로 나열하는
+디자인. 독과점 생태계 형성, 기술예속 심화, S/W 사용료 과다, 존폐
+위기 같은 4개 동등 문제/위기/한계를 각 카드에 라벨 + 설명으로
+제시. 4가지 병렬 문제 진단·시장 지배력 이슈·의존성 위험에 적합.
+시간 순서·원인-결과·3개 이하·5개 이상 항목·비교 구조에는 부적합.
+
+## 후보 키워드
+
+상용, S/W, 의존, 독과점, 기술예속, 사용료, 존폐위기, 과다, 시장, 지배력, 생태계
+
+## 정제 Anchor Sets
+
+- **sw_dependency**: 상용, S/W, 의존
+- **four_problems**: 독과점, 기술예속, 사용료, 존폐위기, 과다
+- **market_dominance**: 시장, 지배력, 독과점, 생태계
+
+## 구조 매칭 정보
+
+- **family**: cards
+- **layout**: cards-4-grid
+- **axis**: horizontal
+- **relation_type**: parallel
+- **cardinality**: ideal 4 / min 4 / max 4
+- **slots** (9개, required 9개): title, problem_1_label, problem_1_body, problem_2_label, problem_2_body, problem_3_label, problem_3_body, problem_4_label, problem_4_body
+- **source title**: 상용 S/W 의존의 4대 문제
+- **original layout**: cards-4
+
+## 적합/부적합 기준
+
+### suits
+- 4가지 병렬 문제 진단
+- 시장 지배력 이슈
+- 의존성 4대 위기/한계
+
+### not_suits
+- 시간 순서
+- 원인-결과 흐름
+- 3개 이하 항목
+- 5개 이상 항목
+- 비교 구조 (대조)
+
+## 재구성 허용
+
+- **split**: True
+- **merge**: True
+- **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/1171281206/analysis.md.pre_milestone2.bak

@@ -0,0 +1,17 @@
+# Frame 1171281206 — 상용 S/W 의존의 4대 문제
+
+## 구조
+- **layout**: cards-4
+- **detail**: 4개 카드 (독과점 생태계·기술예속 심화·S/W 사용료 과다·존폐 위기) + 각 카드 하단 설명
+
+## 내용
+상용 S/W 의존이 초래한 4가지 문제 — 독과점 생태계 형성, 기술예속 심화, S/W 사용료 과다, 존폐 위기.
+
+## 후보 키워드
+상용S/W의존, 독과점, 독과점생태계, 기술예속, S/W사용료, 과다, 존폐위기, 4문제, 4대문제, 시장지배력, 3rdParty
+
+## 메타
+- 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/1171281206/assets/divider.svg

@@ -0,0 +1,3 @@
+<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 701 2" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector 945" d="M701 1H0" stroke="var(--stroke-0, #CE4D16)" stroke-width="2" stroke-dasharray="2 2"/>
+</svg>

figma_to_html_agent/blocks/1171281206/flat.md

@@ -0,0 +1,94 @@
+# Frame 1171281206 — 실측 기록 (flat)
+
+> 원본: 3714.75 × 923 px (node 182:2643, file 9S6LsQyO6zlRxtiqZccOUM, page 29:373)
+> 패턴: cards-4-grid-with-arrow-divider (4열 카드 + 상단 화살표 + dashed 분할선)
+> Scale: **min(1280/3714.75, 720/923) = 1280/3714.75 = 0.34457** (width fit, 1280×318 block)
+
+## 구조 (bottom-up)
+
+```
+Frame 182:2643 "Frame 1171281206" (3714.75 × 923)
+│
+├─ ① 상단 ▼ 화살표 (image 3526 stacked 2x with -rotate-90)
+│  ├─ 182:2666 (1534, 0, 632×174 after rotation) — top_arrow.png
+│  └─ 182:2667 (1534, 10.7, 632×174, opacity 0.5) — 동일 src 그림자 효과
+│
+├─ ② 외곽 흰 카드 컨테이너 (4.15, 204, 3710×701)
+│       border 3px #CE4D16, rounded 20, bg white
+│
+├─ ③ dashed 분할선 (3개 — vertical, #CE4D16 dashed 2px)
+│  ├─ 182:2646 at x=899.67, y=204, h=701
+│  ├─ 182:2647 at x=1853.23, y=204, h=701
+│  └─ 182:2648 at x=2783.99, y=204, h=701
+│
+├─ ④ 4 카드 헤더 pill (image 4331/4332/4333/4334 동일 src 4×, 632×88)
+│  ├─ 182:2651 (137.85, 187) — Card 1 (독과점 생태계 형성)
+│  ├─ 182:2654 (1060.32, 187) — Card 2 (기술예속 심화)
+│  ├─ 182:2652 (2002.48, 187) — Card 3 (S/W 사용료 과다)
+│  └─ 182:2653 (2933.24, 187) — Card 4 (존폐 위기)
+│
+├─ ⑤ 4 카드 타이틀 텍스트 (50px Bold white, line-height 90, text-shadow 0 7 4 rgba(0,0,0,0.25))
+│       모두 -translate-x-1/2 -translate-y-1/2 → center 좌표 명시
+│  ├─ 182:2655 "독과점 생태계 형성" center=(453.46, 230), w=770
+│  ├─ 182:2658 "기술예속 심화" center=(1376.97, 230), w=770, tracking -1px
+│  ├─ 182:2656 "S/W 사용료 과다" center=(2331.57, 230), w=770
+│  └─ 182:2657 "존폐 위기" center=(3248.85, 230), w=770
+│
+├─ ⑥ 4 일러스트 이미지 (DALL-E 생성, 모두 opacity 0.8)
+│  ├─ 182:2661 illust_1_monopoly.png (96.39, 303, 715×394, rounded 40)
+│  ├─ 182:2663 illust_2_dependency.png (970.15, 303, 815×394, rounded 32, h-overflow 109%)
+│  ├─ 182:2662 illust_3_cost.png (1926.82, 296, 783×390, rounded 40, h-overflow 106%)
+│  └─ 182:2664 illust_4_crisis.png (2894.89, 296, 707×390, rounded 40)
+│
+└─ ⑦ 4 카드 본문 텍스트 (40px Bold black, line-height 70, 모두 center 좌표)
+   ├─ 182:2649 center=(453.98, 795.5), w=907.96, h=255 — 2 줄
+   │     "3rd Party의 개발을 유도하여" / "시장 점유율을 높여 지배력 발휘"
+   ├─ 182:2650 center=(1378, 786), w=911.07 — 2 줄
+   │     "대형 S/W 전문회사의 확대로" / "사용 및 기술적용이 종속되게 됨"
+   ├─ 182:2659 center=(2318.09, 804), w=770.11 — 2 줄
+   │     "기술 종속으로 지속해서 높아지는" / "S/W의 사용료를 감당해야 함"
+   └─ 182:2660 center=(3249.89, 804), w=770.11 — 2 줄
+         "국내 건설산업 전체에 악영향을 미치며," / "엔지니어링 사업의 회사는 존폐 위기에 직면함" (tracking -0.32)
+```
+
+## 에셋 (7개 + 1 CSS)
+
+| 파일 | 의미 | 크기 | 사용 |
+|------|------|------|------|
+| `top_arrow.png` | 상단 ▼ 화살표 | 174×632 (rotate-90 → 632×174) | **2×** (1개 opacity 0.5) |
+| `header_pill.png` | 카드 상단 헤더 (브라운 pill) | 632×88 | **4×** |
+| `illust_1_monopoly.png` | DALL-E 독과점 생태계 일러스트 | 715×394 | 1× (opacity 0.8) |
+| `illust_2_dependency.png` | 기술예속 일러스트 | 815×394 | 1× (opacity 0.8) |
+| `illust_3_cost.png` | DALL-E S/W 사용료 일러스트 | 783×390 | 1× (opacity 0.8) |
+| `illust_4_crisis.png` | DALL-E 존폐 위기 일러스트 | 707×390 | 1× (opacity 0.8) |
+| `divider.svg` | dashed 분할선 (2px dashed #CE4D16) | 701×2 | **CSS로 대체** (R9: border-left: 2px dashed #CE4D16) |
+
+## 이상 탐지 결과
+
+| 검사 | 결과 |
+|------|------|
+| 회전 적용 | top_arrow 2× -rotate-90; dividers rotate-90 (CSS border 사용으로 회전 불필요) |
+| Vector 좌표 metadata vs design_context | 일치 |
+| **이미지 overflow** | illust_2/3은 부모 size보다 큰 width/height → overflow:hidden + position offset |
+| 중복 노드 | header_pill (4×), top_arrow (2×) — 정상 재사용 |
+
+## 변형 가능 축
+
+- **cards[N=4] (required)** — cardinality 4 고정
+  - `card_label` (required, 50px Bold white)
+  - `card_illust` (required, 일러스트 이미지)
+  - `card_body` (required, 40px Bold 2줄)
+- `outer_border_color` — #CE4D16 (orange, 정책/문제 톤)
+- `top_arrow` (required for this layout) — 상단 ▼ 모양 강조
+
+## Sub-patterns
+
+- `cards-4-grid-with-dashed-dividers` — 4 카드 + 사이에 점선 vertical divider
+- `arrow-down-pointer-from-top` — 상단 ▼ 화살표 강조
+- `card-with-illust-center` — 카드 = 헤더 pill + 일러스트 (opacity 0.8) + 본문
+
+## 임시 보정 (1:1, 템플릿화 시 재고려)
+
+- divider는 SVG 대신 CSS `border-left: 2px dashed #CE4D16` 사용 (R9 순수 CSS 우선)
+- 일러스트 이미지는 도메인-specific PNG (다른 콘텐츠 매칭 시 교체)
+- header_pill은 PNG로 유지 (CSS gradient + border-radius로 변환 가능 후보)

figma_to_html_agent/blocks/1171281206/texts.md

@@ -0,0 +1,39 @@
+# Frame 1171281206 — 텍스트 (TF-IDF 매칭용)
+
+> 프레임 안의 모든 텍스트를 빠짐없이 추출.
+
+## 4열 카드 헤더 (상단 배너)
+
+### 열1
+독과점 생태계 형성
+
+### 열2
+기술예속 심화
+
+### 열3
+S/W 사용료 과다
+
+### 열4
+존폐 위기
+
+## 본문 (4열 하단 설명)
+
+### 열1 — 독과점 생태계 형성
+
+3rd Party의 개발을 유도하여
+시장 점유율을 높여 지배력 발휘
+
+### 열2 — 기술예속 심화
+
+대형 S/W 전문회사의 확대로
+사용 및 기술적용이 종속되게 됨
+
+### 열3 — S/W 사용료 과다
+
+기술 종속으로 지속해서 높아지는
+S/W의 사용료를 감당해야 함
+
+### 열4 — 존폐 위기
+
+국내 건설산업 전체에 악영향을 미치며,
+엔지니어링 사업의 회사는 존폐 위기에 직면함