# [Lv.3] RP 화면 — 전체담보 표+계단식을 PDF 2섹션으로 분리 (수정 PDF 정합, 직각 화살표)

## allowed_resources
```yaml
allowed_resources:
  paths:
    - "src/components/composite/**"
    - "src/pages/CompositeDesign.tsx"
    - "src/lib/**"
    - "src/**/__tests__/**"
    - "tests/e2e/**"
  forbidden_paths:
    - "server/**"
    - "extension/**"
    - ".github/**"
    - "src/config/api.ts"
    - "src/integrations/**"
  commands: ["npx vitest","npx tsc","git"]
  merge_policy: "none"
  ttl_hours: 18
```
> ★ merge_policy=none. base=현 origin/main(#144 task-2868 포함: CompositeGeneralIntro 일반론 인포그래픽·RpPresentation 계단식 존재). webapp-only, 서버 무변경.

## 배경 (회장 수정 PDF `인슈로 복합설계 프리젠테이션 수정`)
현재 전체담보 표+계단식이 **하나로 합쳐져** 표현됨. 회장: **PDF 1페이지·2페이지를 각각 별도 섹션으로** 표현해야 하고, **곡선 말고 직각 화살표**로, PDF 의미 그대로.

## 목표 — 2개 독립 섹션 (PDF 페이지 그대로)

### 섹션 1 — "1개회사 & 2개회사 전체담보 비교" (PDF 1페이지)
- **표**: 담보명 | 가입한도 | **1개회사 선택시**[최고 Max=L사(회사명), 최저 min=M사] | **2개회사 선택시 최저 min**[선택1=O사, 선택2=P사]
  - 각 담보행: 그 담보 담당 회사 열에만 보험료(task-2867 회사별 열 구조 유지). 1개회사 최고=최고 단일사 그 담보 보험료, 최저=최저 단일사, 2사=조합 담당회사.
  - **보험료 합계행**: 상기합계액1(최고 단일사 총액) · 상기합계액2(최저 단일사) · 상기합계액3(2사 조합).
- **계단식**(이 섹션):
  - `[최고 Max] L사(회사명) — 상기합계액1`
  - `↓ −차액총액` (직각 아래 화살표, 합계액1→합계액2)
  - `[최저 min] M사 — 상기합계액2`
  - `↓ −차액총액` (합계액2→합계액3)
  - `[2개회사 복합설계] O사+P사 — 상기합계액3`
  - **직각 화살표(파랑)**: 합계액1(최고) → 합계액3(2사), 라벨 `−차액총액` (최고 vs 2사 누적).

### 섹션 2 — "2개회사 & 3개회사 전체담보 비교" (PDF 2페이지)
- **표**: 담보명 | 가입한도 | **2개회사 선택시 최저 min**[O사, P사] | **3개회사 선택시 최저 min**[선택1=Q사, 선택2=R사, 선택3=S사]
  - 담당 회사 열에만 보험료. **합계행**: 상기합계액3(2사) · 상기합계액4(3사).
- **계단식(4단계 전체)**:
  - `[최고 Max] L사 — 합계액1`
  - `↓ −차액총액`
  - `[최저 min] M사 — 합계액2`
  - `↓ −차액총액`
  - `[2개회사 복합설계] O사+P사 — 합계액3`
  - `↓ −차액총액`
  - `[3개회사 복합설계] Q사+R사+S사 — 합계액4`
  - **직각 화살표(파랑)**: 합계액1 → 합계액3 (최고 vs 2사), `−차액총액`.
  - **직각 화살표(주황)**: 합계액1 → 합계액4 (최고 vs 3사), `−차액총액`.
- **최종 대형문구**(섹션2 끝): "최고 Max 보험료와 3개회사 복합설계 최저 min 보험료의 X년간 납입 보험료 총액 차이는 XXXXX원입니다." (X=payment_years, XXXXX=합계액1−합계액4, exact 원, 가장 큰 폰트.)

## 핵심 변경
- **현재 합쳐진 표 1개 + 계단식 1개 → 섹션1·섹션2 두 개로 분리.** 각각 자기 표 + 계단식.
- **곡선 전면 제거 → 직각(ㄱ자) 화살표.** 최고 박스에서 세로로 내려가다 대상 합계액(2사·3사) 옆으로 꺾어 연결. 파랑=최고vs2사, 주황=최고vs3사.
- 계단식 각 단계에 **실제 회사명** 표기(L사=최고 단일사명 예 하나손해, M사=최저 예 메리츠, O+P=2사 조합 회사, Q+R+S=3사 조합 회사) — task-2868 회사명 유지.
- exact 원(task-2867 반올림 제거 유지), 회사별 열(task-2867), 일반론 인포그래픽(CompositeGeneralIntro, 최상단) **유지**.

## 화면 순서
(최상단) 일반론 인포그래픽 → 고객정보 → 단일담보(암진단비) 비교[유지] → **섹션1(1&2사)** → **섹션2(2&3사)+최종문구**.

## 제약
- webapp-only. 서버/확장 0. 데이터(단일사 총액·2사/3사 조합·담당회사·payment_years)는 기존 계산결과 재사용. exact 원.
- 섹션1·2가 각각 PDF 페이지와 의미 동일. 직각 화살표 방향·색·라벨 정확. 기존(단일담보·인포그래픽·삭제버튼) 회귀 0.
- 신규/변경 요소 data-testid + e2e strict-mode 회귀 방지(clean worktree 검증).

## 검증
- `npx tsc` 클린. `npx vitest run` 전체 PASS. 신규:
  - 섹션1: 표(1개회사 최고/최저 + 2개회사 O/P 담당열·합계액1/2/3) / 계단식(3단계 회사명·직각 아래화살표·파랑 직각 합계액1→3).
  - 섹션2: 표(2사 O/P + 3사 Q/R/S 담당열·합계액3/4) / 계단식(4단계 회사명·직각 아래·파랑 합계액1→3·주황 합계액1→4) / 최종문구(합계액1−합계액4 exact).
  - 곡선 요소 부재(직각만), 두 섹션 분리 렌더, exact 원.
- e2e clean /tmp worktree PASS.

## 완료 (★ 순서 B)
- 변경 = src/ (+tests/e2e) 만. 서버/확장 불변.
- **dev6 금지** — dev1. 커밋 → push → finish-task **foreground 1회** → .done 즉시 종료. **background+wait 금지.** ANU 검증(e2e)·Codex 검토·머지·CF Pages 배포는 ANU.

## goal_assertions (auto-generated)
- `npx tsc`
- `npx vitest run`