크레딧 현황 UI + 리퍼럴 대시보드 + 구매 페이지 + 크레딧 부족 안내

## 작업 내용

### 1. 크레딧 현황 페이지 수정 (`app/views/credits/index.html.erb`)
기존 리포트 크레딧만 표시 → 2종류 크레딧 분리 표시.

- **리포트 크레딧 카드**: 기존 balance 표시, 용도: "강점 리포트 열람"
- **진단 크레딧 카드**: diagnosis_balance 표시, 용도: "Big5 / 성장 / 행복도 진단"
- "구매하기" 버튼 → diagnosis_credits/new 링크
- "공유로 무료 획득" 안내 문구
- 거래 내역에 credit_type 표시 (리포트/진단 구분)
- 기존 Tailwind 디자인 시스템 유지

CreditsController도 수정 필요:
```ruby
def index
@user = Current.user
@user.ensure_credit!
@credit = @user.credit
@transactions = @user.credit_transactions.order(created_at: :desc).limit(50)
@referrals = @user.referrals_given.rewarded.this_month # 월간 리퍼럴 현황
end
```

### 2. 리퍼럴 현황 섹션
크레딧 페이지 내에 리퍼럴 섹션 추가 (별도 페이지 불필요):
- 이번 달 보상 횟수: N / 10
- 최근 추천 목록 (rewarded 상태, 날짜, 피추천자 이름)
- "친구에게 공유하기" CTA → 진단 결과 공유 안내

### 3. 진단 크레딧 구매 페이지 (`app/views/diagnosis_credits/new.html.erb`)
PR4에서 이미 생성됨 — 확인 후 디자인 개선:
- 가격 표시: 3,000원 / 크레딧
- 수량 선택 (1, 3, 5개)
- Toss Payments 결제 버튼
- 기존 paywall 디자인 참고 (`app/views/diagnoses/paywall/`)

### 4. 크레딧 부족 안내 모달/페이지
진단 시작 시 크레딧 부족할 때 보여줄 UI:
- `app/views/diagnoses/_insufficient_credits.html.erb` (partial)
- "진단 크레딧이 필요합니다" 안내
- 두 가지 옵션:
1. "크레딧 구매" → diagnosis_credits/new 링크
2. "친구에게 공유하여 무료 크레딧 받기" → 공유 안내
- DiagnosesController에서 크레딧 부족 시 이 partial을 render하도록 (현재는 redirect + flash)

### 5. i18n (4개 언어)
```yaml
# credits 관련
credits:
index:
report_credit: "리포트 크레딧"
diagnosis_credit: "진단 크레딧"
report_credit_desc: "강점 리포트 열람에 사용"
diagnosis_credit_desc: "Big5 / 성장마인드셋 / 행복도 진단에 사용"
buy_credits: "크레딧 구매"
earn_free: "공유로 무료 획득"
referral_status: "이번 달 추천 보상"
referral_count: "%{count} / 10"
share_invite: "친구에게 공유하기"
transaction:
report: "리포트"
diagnosis: "진단"
referral: "추천 보상"

# diagnosis_credits 관련
diagnosis_credits:
new:
title: "진단 크레딧 구매"
price_per_credit: "크레딧당 %{price}원"
quantity: "수량"
total: "총 결제금액"
purchase: "결제하기"

# insufficient credits
diagnosis:
insufficient_credits:
title: "진단 크레딧이 필요합니다"
buy_option: "크레딧 구매하기"
share_option: "친구에게 공유하여 무료 크레딧 받기"
```

en, zh, vi도 추가.

### 6. 기존 UI 참고
- `app/views/diagnoses/paywall/` — 결제 페이지 디자인
- `app/views/credits/index.html.erb` — 현재 크레딧 페이지
- `app/views/shared/` — 공통 partial (_button, _card 등)
- Tailwind CSS 사용, 모바일 반응형 필수

## 완료 기준
- 크레딧 페이지에 2종류 크레딧 분리 표시
- 리퍼럴 현황 (N/10) 표시
- 진단 크레딧 구매 페이지 디자인
- 크레딧 부족 시 안내 UI
- 모바일 반응형
- 4개 locale i18n
- 테스트 통과