# [Lv.3] 확장 플로팅 카드 내부 UI 업그레이드 — 버튼 명확화 + 보험료 테이블 + 디자인 폴리시

## allowed_resources
```yaml
allowed_resources:
  paths:
    - "extension/content.js"
    - "extension/__tests__/**"
  forbidden_paths:
    - "src/**"
    - "server/**"
    - ".github/**"
    - "extension/manifest.json"
    - "extension/background/**"
  commands: ["npx vitest","git"]
  merge_policy: "none"
  ttl_hours: 12
```
> ★ merge_policy=none. base=현 origin/main. 신규 브랜치. **캡처/동의/egress/매칭 로직 절대 불변 — 렌더/구조/스타일만.**

## 배경 (회장 피드백)
플로팅 캡처 카드가 뜨지만 내부가 **raw 텍스트** — 버튼이 버튼처럼 안 보이고, 보험사별 보험료가 그냥 나열. 요구:
1. 클릭 버튼(고객검색/신규 등록/동의하고 저장)을 **직관적 버튼**으로
2. 보험사별 보험료를 **테이블**로
3. 전반 내부 디자인 업그레이드(여백·타이포·섹션·브랜딩)

## 작업 — 아래 구체 CSS 값으로 (확장=순수 JS+인라인/주입 <style>, React/Tailwind 없음)
### 카드 컨테이너
- position:fixed 우측하단, width 360px, max-height 82vh(overflow-y auto), z-index 2147483000. bg #fff, border 1px solid #e5e7eb, border-radius 12px, box-shadow 0 8px 32px rgba(0,0,0,.16). 폰트 -apple-system/Pretendard 계열, 기본 13px, color #374151.
- **헤더 바**: bg #2563eb, color #fff, padding 10px 14px, radius 12px 12px 0 0, "InsuRo" 로고+제목 좌측, **최소화(–)/닫기 토글 우측**(클릭 시 접힘).

### 섹션 헤딩
- font 12px, weight 700, color #6b7280, letter-spacing .3px, margin 14px 14px 8px, 아이콘+텍스트. 섹션 간 border-top 1px solid #f3f4f6.

### 보험사 보험료 테이블 (신규)
- `<table>` width 100%, font 12px, border-collapse collapse, margin 0 14px.
- 헤더행: bg #f3f4f6, color #6b7280, weight 600, padding 6px 8px. 열=보험사명(left)·월보험료(right)·검증상태(center).
- 데이터행: padding 6px 8px, border-bottom 1px solid #f3f4f6, 짝수행 bg #fafafa(zebra). 보험료 right + font-variant-numeric tabular-nums + weight 500. 최저가 행 강조(bg #eff6ff or 파란 좌측 보더).
- **검증상태 뱃지**: "허용오차 이내" → bg #dcfce7 / color #16a34a / radius 4px / font 10px / padding 2px 6px. "검증 전" → bg #fef3c7 / color #d97706.

### 버튼 3종 위계 (모두 cursor:pointer, min-height 38px, border:none 또는 명시, transition .15s, border-radius 8px, font-weight 600)
- **Primary(동의하고 저장)**: bg #2563eb, color #fff, padding 11px 16px, width 100%, font 14px, box-shadow 0 1px 2px rgba(37,99,235,.3). hover bg #1d4ed8. 가장 강조.
- **Secondary(고객검색)**: bg #fff, border 1px solid #2563eb, color #2563eb, padding 9px 14px, font 13px. hover bg #eff6ff.
- **Tertiary(신규 등록)**: bg #f3f4f6, border 1px solid #d1d5db, color #374151, padding 9px 14px, font 13px. hover bg #e5e7eb.
- disabled 상태: opacity .5, cursor:not-allowed.

### 입력 필드(이름/생년월일/휴대폰/지역)
- border 1px solid #d1d5db, radius 6px, padding 8px 10px, font 13px, width 100%. focus: border #2563eb + box-shadow 0 0 0 3px rgba(37,99,235,.15). label: font 11px, color #6b7280, weight 500, mb 4px.

### 상태 안내
- "먼저 고객을 확인해주세요" 등: font 12px, color #9ca3af, 아이콘 동반.

### 팔레트
- primary #2563eb / hover #1d4ed8, success #16a34a·bg #dcfce7, warn #d97706·bg #fef3c7, text #374151·muted #6b7280/#9ca3af, border #e5e7eb/#d1d5db, subtle-bg #f3f4f6/#fafafa.

## 제약
- **content.js 렌더/스타일만.** 캡처·동의·single-egress·taint-guard·매칭·저장 로직 0 변경. 휴대폰 3-4-4 포맷·consent.scope 등 기존 기능 회귀 0.
- 접근성: 대비 AA, 버튼 클릭영역 ≥38px, focus-visible.
- floating 항상 보임·스크롤 무관 유지.

## 검증
- `npx vitest run extension/__tests__/` 전체 PASS(회귀 0). 렌더 테스트: 버튼 role/스타일 존재, 테이블 구조(thead/tbody/tr), 검증뱃지. 캡처/동의/egress/휴대폰포맷 회귀 0.

## 완료 (★ 순서 B)
- content.js(+테스트) 외 변경 0.
- **dev6 금지** — dev2. 커밋 → push → finish-task **foreground 1회** → .done 즉시 종료. **background+wait 금지.** ANU 검증·Codex 검토·머지·새 파일럿빌드 전송은 ANU.

## goal_assertions (auto-generated)
- `npx vitest run extension/__tests__/`