chore(android): versionCode 6, versionName 1.0.5

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

.gitea/workflows/ci.yaml

@@ -1,8 +1,9 @@
 name: CI
 
 on:
+  # main 은 Deploy 워크플로가 테스트+빌드를 수행하므로 CI 중복 실행 제외(배포 시간 단축).
   push:
-    branches: [main, dev]
+    branches: [dev]
   pull_request:
     branches: [main, dev]
 
@@ -17,7 +18,7 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: '22'
-          cache: 'npm'
+          # cache 제거: Gitea 캐시 서버 미연결 시 'Save cache' 후처리가 수 분 hang → '가짜 실패' 유발
 
       - name: Install dependencies
         run: npm ci

.gitea/workflows/deploy.yaml

@@ -24,7 +24,7 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: '22'
-          cache: 'npm'
+          # cache 제거: Gitea 캐시 서버 미연결 시 'Save cache' 후처리가 수 분 hang → '가짜 실패' 유발
 
       - name: Install
         run: npm ci

README.md

@@ -1,44 +1,71 @@
-# sb_pt
+# 돈돼지 가계부 — 프론트엔드 (sb_pt)
 
-This template should help get you started developing with Vue 3 in Vite.
+Vue 3 + Vite 기반의 가계부·자산·게시판 앱 프론트엔드. 웹 / 안드로이드(Capacitor) / Windows 데스크톱(Electron) 3개 플랫폼을 하나의 코드베이스로 빌드합니다.
 
-## Recommended IDE Setup
+- 서비스명 **돈돼지 가계부** (구 Slim Budget)
+- 운영: [app.sblog.kr](https://app.sblog.kr) · 안내/정책 페이지 [www.sblog.kr](https://www.sblog.kr)
 
-[VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
-
-## Recommended Browser Setup
-
-- Chromium-based browsers (Chrome, Edge, Brave, etc.):
-  - [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
-  - [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters)
-- Firefox:
-  - [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/)
-  - [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/)
-
-## Customize configuration
-
-See [Vite Configuration Reference](https://vite.dev/config/).
-
-## Project Setup
+## 기술 스택
+- **Vue 3** (`<script setup>` Composition API) + **Vite**
+- **Pinia** (상태관리), **Vue Router** (라우팅 + 인증 가드)
+- **Axios** (공통 인스턴스 + 토큰/401 인터셉터)
+- **Toast UI Editor** + Prism.js (게시판 마크다운 작성/뷰어)
+- **Capacitor** (안드로이드 하이브리드 앱), **Electron** (Windows 데스크톱)
+- **Vitest** + `@vue/test-utils` (테스트)
 
+## 빠른 시작
 ```sh
 npm install
+npm run dev        # 개발 서버 (전체 앱 표시 — 웹 접근 제한 예외)
 ```
+- Node: `^20.19.0 || >=22.12.0`
+- API 베이스 URL: `VITE_API_BASE_URL` (기본 `/api`, Nginx 가 백엔드 8080 으로 프록시)
 
-### Compile and Hot-Reload for Development
+## 주요 스크립트
+| 명령 | 설명 |
+|---|---|
+| `npm run dev` | 개발 서버 (HMR) |
+| `npm run build` | `dist/` 정적 빌드 (웹 배포용) |
+| `npm run build:app` | Capacitor 모드 빌드 (`--mode capacitor`, 앱 전용 env) |
+| `npm run cap:sync` | 앱 빌드 + `cap sync` (안드로이드 동기화) |
+| `npm run cap:android` | Android Studio 열기 |
+| `npm run electron:dev` | Electron 데스크톱 실행 |
+| `npm run electron:build` | Windows 설치파일(`DonDwaeji-Setup.exe`) 빌드 |
+| `npm test` | Vitest 실행 |
+| `npm run lint` | oxlint + eslint (`--fix`) |
 
-```sh
-npm run dev
-```
+## 플랫폼별 동작
+- **웹(PC·모바일)**: 안내 페이지만 노출(앱 다운로드 유도). 실제 이용은 앱에서. (`npm run dev` 는 예외로 전체 앱 표시)
+- **안드로이드**: Capacitor WebView 패키징. 빌드 전 `.env.capacitor` 의 백엔드 절대 URL 설정 필수 → [docs/ANDROID.md](docs/ANDROID.md)
+- **Windows**: Electron 이 라이브 사이트(app.sblog.kr)를 직접 로드 → 프론트 변경이 재설치 없이 반영
 
-### Compile and Minify for Production
+## 인증
+- 로그인 시 발급된 **Bearer 토큰**을 `localStorage` 에 저장, `http.js` 인터셉터가 `Authorization` 헤더에 주입
+- **구글 로그인**(웹/PC=GIS, 앱=네이티브 플러그인) — 현재 소셜 로그인 전용(아이디/비번 폼은 `features.js` 플래그로 숨김)
+- 401 응답 시 토큰 정리 후 로그인 모달, 라우트 `meta.requiresAuth` / `requiresAdmin` 가드
 
-```sh
-npm run build
-```
+## 주요 기능
+- **가계부** — 수입·지출·이체 기록, 검색·필터, 날짜 그룹 접기/펴기, 외화 입력(환율 자동환산)
+- **AI 보조** — 자연어 한 줄 입력("어제 스타벅스 5천원"), 영수증 사진 구조화, 분류·계좌 자동 추천, 통계 화면 재무 코멘트·절약 가이드 (Claude Haiku, 집계만 전송·저장은 사용자 확인 후)
+- **계좌·자산** — 은행·현금·카드·대출·투자 계좌, 순자산 자동 집계
+- **고정 지출** — 반복 규칙 자동 생성 + '확인' 확정 흐름
+- **통계** — '이번 달 현황'(예산·수입 대비 통합), 분류별 분석, 순자산 추이, 월말 예상 지출(일회성 큰 지출 제외 결정적 계산), 지난달 대비
+- **예산** — 월별 카테고리 예산, 예산 대비 진행률
+- **활동 포인트** — 가계부·게시판 활동 적립, 한 달 개근(모든 날 기록) 랜덤 보너스
+- **게시판** — 커뮤니티/짠테크/재테크 3개 게시판, 댓글·태그·이미지 업로드·공지
+- **테마** — 시스템/라이트/다크 모드
 
-### Lint with [ESLint](https://eslint.org/)
+## 문서
+| 문서 | 내용 |
+|---|---|
+| [docs/FRONTEND.md](docs/FRONTEND.md) | 아키텍처·디렉터리 구조·화면 명세 |
+| [docs/release-2026-06-06.md](docs/release-2026-06-06.md) | 누적 변경 이력 (릴리스 노트) |
+| [docs/ANDROID.md](docs/ANDROID.md) | 안드로이드(Capacitor) 빌드·배포 |
+| [docs/plan-membership-tiers.md](docs/plan-membership-tiers.md) | 무료/유료 티어 설계 (미구현) |
+| [deploy/README.md](deploy/README.md) | 프론트 배포(Nginx + Gitea Actions) |
+| [brand/LAUNCH-PROGRESS.md](brand/LAUNCH-PROGRESS.md) | Play 스토어 출시 진행 상황·로드맵 |
 
-```sh
-npm run lint
-```
+## 배포
+- `main` 푸시 → Gitea Actions 가 CI(빌드·테스트) + Deploy(Nginx 업로드·reload) 실행
+- **테스트 게이트**: CI·배포 워크플로 모두 테스트 실패 시 배포 중단
+- 상세: [deploy/README.md](deploy/README.md)

android/.gitignore

@@ -99,3 +99,8 @@ app/src/main/assets/public
 app/src/main/assets/capacitor.config.json
 app/src/main/assets/capacitor.plugins.json
 app/src/main/res/xml/config.xml
+
+# 릴리스 서명 (절대 커밋 금지)
+*.jks
+*.keystore
+key.properties

android/app/build.gradle

@@ -1,5 +1,13 @@
 apply plugin: 'com.android.application'
 
+// 릴리스 서명: android/key.properties 가 있으면 사용, 없으면 디버그 서명으로 폴백.
+def keystorePropsFile = rootProject.file("key.properties")
+def keystoreProps = new Properties()
+if (keystorePropsFile.exists()) {
+    keystoreProps.load(new FileInputStream(keystorePropsFile))
+}
+def hasReleaseKeystore = keystorePropsFile.exists()
+
 android {
     namespace = "kr.sblog.slimbudget"
     compileSdk = rootProject.ext.compileSdkVersion
@@ -7,8 +15,8 @@ android {
         applicationId "kr.sblog.slimbudget"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 1
-        versionName "1.0"
+        versionCode 6
+        versionName "1.0.5"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
@@ -16,8 +24,20 @@ android {
             ignoreAssetsPattern = '!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~'
         }
     }
+    signingConfigs {
+        if (hasReleaseKeystore) {
+            release {
+                storeFile rootProject.file(keystoreProps['storeFile'])
+                storePassword keystoreProps['storePassword']
+                keyAlias keystoreProps['keyAlias']
+                keyPassword keystoreProps['keyPassword']
+            }
+        }
+    }
     buildTypes {
         release {
+            // 키스토어가 있으면 릴리스 서명, 없으면 디버그 서명(로컬 테스트용)
+            signingConfig hasReleaseKeystore ? signingConfigs.release : signingConfigs.debug
             minifyEnabled false
             proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
         }

android/app/capacitor.build.gradle

@@ -11,7 +11,10 @@ apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
 dependencies {
     implementation project(':capacitor-app')
     implementation project(':capacitor-camera')
+    implementation project(':capacitor-filesystem')
+    implementation project(':capacitor-local-notifications')
     implementation project(':capacitor-preferences')
+    implementation project(':capacitor-share')
     implementation project(':capawesome-capacitor-google-sign-in')
 
 }

android/app/src/main/AndroidManifest.xml

@@ -29,7 +29,10 @@
             <meta-data android:name="android.support.FILE_PROVIDER_PATHS" android:resource="@xml/file_paths" />
         </provider>
 
-        <!-- 카드 결제 알림 자동인식: 알림 접근 리스너 서비스 -->
+        <!-- 카드 결제 알림 자동인식(알림 접근 리스너) — 스토어 첫 출시에서는 비활성화.
+             Google Play NotificationListenerService(알림 접근) 정책 심사 회피용으로 선언 제거.
+             추후 정당화/선언 후 재활성화하려면 아래 service 블록 주석을 해제할 것. -->
+        <!--
         <service
             android:name=".CardNotifListenerService"
             android:label="@string/app_name"
@@ -39,6 +42,7 @@
                 <action android:name="android.service.notification.NotificationListenerService" />
             </intent-filter>
         </service>
+        -->
     </application>
 
     <!-- Permissions -->

android/capacitor.settings.gradle

@@ -8,8 +8,17 @@ project(':capacitor-app').projectDir = new File('../node_modules/@capacitor/app/
 include ':capacitor-camera'
 project(':capacitor-camera').projectDir = new File('../node_modules/@capacitor/camera/android')
 
+include ':capacitor-filesystem'
+project(':capacitor-filesystem').projectDir = new File('../node_modules/@capacitor/filesystem/android')
+
+include ':capacitor-local-notifications'
+project(':capacitor-local-notifications').projectDir = new File('../node_modules/@capacitor/local-notifications/android')
+
 include ':capacitor-preferences'
 project(':capacitor-preferences').projectDir = new File('../node_modules/@capacitor/preferences/android')
 
+include ':capacitor-share'
+project(':capacitor-share').projectDir = new File('../node_modules/@capacitor/share/android')
+
 include ':capawesome-capacitor-google-sign-in'
 project(':capawesome-capacitor-google-sign-in').projectDir = new File('../node_modules/@capawesome/capacitor-google-sign-in/android')

brand/LAUNCH-PROGRESS.md

@@ -0,0 +1,198 @@
+# 돈돼지 가계부 — Play 스토어 첫 출시 진행 상황
+
+> 최종 업데이트: 2026-07-11. 첫 정식 출시(무료 앱) 준비 로그 + 남은 로드맵.
+> 관련 문서: [play-store-listing.md](play-store-listing.md) · [production-access-draft.md](production-access-draft.md)
+
+---
+
+## ✅ 완료된 작업
+
+### 출시 전략 결정
+- **무료 앱**으로 첫 출시 (수익화 기능은 순차 도입)
+- 첫 출시 기능 플래그 (`src/config/features.js`, 전부 `false`):
+  - `BILLING_ENABLED=false` — 인앱결제 스텁이라 결제 없이 프리미엄 부여되는 악용 차단
+  - `ADS_ENABLED=false` — 애드핏 미승인 + 데이터 안전 양식 단순화(광고 식별자 미수집)
+  - `CARD_NOTIF_ENABLED=false` — NotificationListenerService 정책 심사 회피
+- 패키지명 `kr.sblog.slimbudget` **유지**(출시 후 영구 고정. 사용자 비노출이라 무방)
+
+### 인프라 / 정책 페이지
+- **www.sblog.kr** 도메인 + 인증서 확장 (app.sblog.kr와 동일 dist 서빙)
+- 공개 URL: `/privacy`, `/terms`, `/account-deletion` (모두 200 확인)
+- 개인정보처리방침 광고 문구 → "현재 광고 없음 + 향후 도입 가능" 미래형으로 정합화
+
+### 빌드 / 서명
+- **AAB**: `android/app/build/outputs/bundle/release/app-release.aab`
+  - targetSdk 36, versionCode 1, versionName 1.0
+  - 업로드 키(CN=Don Dwaeji) 서명 확인 (디버그 아님)
+  - 결제·광고·카드알림 전부 OFF 클린 (NotificationListener 권한 없음 검증)
+- 키스토어: `android/upload-keystore.jks` + `android/key.properties` (gitignore, **이 PC에만 존재 — 분실 시 업데이트 불가, 반드시 백업**)
+
+### 스토어 그래픽 (`brand/store/`)
+- `icon-512.png` (512×512 불투명)
+- `feature-1024x500.png` / `feature-1024x500-text.png` (피처그래픽, 택1)
+- 생성기 `brand/gen-store-assets.mjs` + 마스터 `brand/logo-1024.png`
+
+### 스크린샷 (`brand/screenshots/`, 7컷, 실기기 1080×2340)
+- shot0 홈 대시보드(리드) / shot1 가계부 내역 / shot2 통계 / shot3 정기결제 / shot4 계좌 / shot5 게시판 / shot6 게시글 상세
+
+### 등록 문서
+- `brand/play-store-listing.md` — 등록정보(제목·설명)·데이터안전 양식·콘텐츠등급 답안
+- `brand/production-access-draft.md` — 프로덕션 액세스 신청서 초안(4문항)
+
+### 코드 수정 (배포 완료)
+- 인앱결제 진입점 비활성화 (UpgradeView "곧 출시 예정", AccountInfoView 정기결제 카드 숨김)
+- 광고 비활성화 (AdBanner + App.vue 게이팅, 하단 광고 여백 제거)
+- 둘러보기(데모) 모드 메뉴 접근 버그 수정 (AppHeader 햄버거 `demo.on` 노출)
+- 계정삭제 공개 페이지 추가
+
+### 테스트 데이터 (캡처용, `sb_bt/scripts/`, gitignore 로컬 전용)
+- 테스트 계정 `kenneth73510@gmail.com` (DB로 PREMIUM 부여)
+- `seed-test-kenneth.sql`(계정+가계부), `seed-test-board.sql`(게시판 더미)
+- `cleanup-test-board.sql`(게시판 더미 삭제 — **캡처 후 정리 완료**)
+
+---
+
+## 🚧 현재 상태 (2026-07-05)
+- ✅ 개발자 계정 신원확인 완료 → 앱 생성 완료(`kr.sblog.slimbudget`)
+- ✅ 필수 설정(데이터안전·콘텐츠등급(전체이용가)·앱액세스(둘러보기)·광고없음·비거래자·방침URL) 완료
+- ✅ 스토어 등록정보·이미지(아이콘512·피처·스크린샷7) 완료
+- ✅ **비공개 테스트 트랙에 v2(AAB) 게시 → 검토 통과**
+- ✅ 구글 로그인 SHA-1 이슈 해결(Play 앱서명 SHA-1 등록) → 로그인 정상
+- ✅ Google Search Console sblog.kr 도메인 소유권 인증 완료 (DNS TXT)
+- ⏳ **테스터 12명 opt-in 대기**(업체 의뢰) → 14일 → 프로덕션 신청
+- ⏳ **v4 AAB 빌드 완료** (versionCode 4, 1.0.3) → 비공개 트랙 업로드 대기
+- ⏳ 개인사업자 계정 전환 → DUNS 신청 완료(D&B 발급 대기) → 발급 후 Play Console에서 마저 진행
+  - Play Console 웹사이트 인증(www.sblog.kr) 완료
+
+### 🍎 iOS(App Store) 트랙 — 2026-07-11
+- ✅ **애플 개발자 등록 완료** (Team ID `G9PDM2C4L6`)
+- ✅ **애플 로그인(Sign in with Apple) 실기기 동작 확인** — App Store 4.8 요건 충족
+- ✅ **iOS 번들ID `kr.sblog.slimbudget.app`** (기존 `kr.sblog.slimbudget`는 타 계정 선점 → iOS 전용 새 ID, 안드로이드는 그대로)
+  - App ID + Sign in with Apple/Push capability, `CODE_SIGN_ENTITLEMENTS` 연결, `ITSAppUsesNonExemptEncryption=false`
+- ✅ **App Store Connect 앱 생성 + v1.0 (build 1) 심사 제출 완료** — 연령 15+, App Privacy(이메일·사용자콘텐츠·사용자ID / 추적없음 / 앱기능), 무료, 콘텐츠권한 없음, 스크린샷(6.5" 1242×2688 iPhone + iPad 13")
+  - 로그인은 구글/애플 소셜 전용 → 심사 메모에 **둘러보기(데모)** 안내
+- ⏳ **심사 결과 대기** (승인 시 출시 / 거부 시 Resolution Center 대응)
+
+---
+
+## 📋 남은 로드맵 (프로덕션까지)
+
+1. ⏳ **테스터 12명 opt-in** (업체 의뢰) — 14일 카운트 시작 조건
+2. ⏳ **14일 연속** 12명 유지 → **프로덕션 액세스 신청** (자료: production-access-draft.md)
+3. ⏳ **v4 AAB 비공개 트랙 업로드** — 빌드 완료(versionCode 4, 1.0.3), Play Console 업로드 후 검토 제출 (14일 카운트 리셋 안 됨)
+4. 승인 → **프로덕션 출시**
+
+### ⚠️ 폐쇄 테스트 의무 (개인 계정 + 2023-11-13 이후 개설)
+- **테스터 12명 이상 · 14일 연속** 폐쇄 테스트 후 프로덕션 신청 가능
+- 실기기·실계정 필수 (에뮬·봇·중복 불인정)
+- 14일 카운트 = "릴리스 승인 + 12명 opt-in" 둘 다 충족 시점부터
+- 테스터 확보: 지인 비공개 방침 → 품앗이 커뮤니티(무료·안전) 또는 평판 좋은 유료 서비스(실사용 보장형만)
+
+### 익명 셋업 체크리스트
+- [ ] 전용 Gmail 생성 (개발자 연락처 + 품앗이용)
+- [ ] 공개 개발자 이름 → 브랜드명 (법적이름은 구글 내부 전용, 비공개)
+- [ ] 연락처 이메일(계정+앱) → 전용 메일
+- [ ] 거래자 상태 → **비거래자(Non-trader)** (주소 비공개)
+- [ ] 품앗이 노출은 전용 Gmail로만
+
+---
+
+## ✅ 적용 완료 (전부 웹/소스 배포됨)
+
+**v2(versionCode 2, 1.0.1, 06-29)에 포함 — 비공개 테스트 게시·검토통과**
+- 신규 유저 빈 상태 CTA(홈 '시작하기'·내역·계좌) / 오프라인·네트워크 오류 배너
+- 앱 잠금(PIN, 옵트인) + 카메라/갤러리 복귀 오작동 수정
+- 전역 에러 폴백(흰 화면 방지) / 안드로이드 뒤로가기 통합(오버레이→뒤로→종료토스트)
+- 분류 순서변경 보호('순서변경' 토글)
+
+**v2 이후 추가 — 웹 배포됨, v3 빌드 대기**
+- 앱 잠금 **1시간 유예**(잦은 PIN 입력 해소)
+- **외화 입/지출** — 통화+환율 자동조회(open.er-api.com 무료)→원화 환산, 원본 보존. `amount`는 환산 원화라 통계·예산 무변경
+- **외화 환율 갱신 시각** — 환율 자동조회 후 '방금 / N분 전 / N시간 전' 레이블(30초 ticker), FxController `updatedAt` 응답 포함
+- **월별 예산 + 전월/다음달 복사** — budget에 year/month 추가, 기존 예산은 현재 월로 1회 이관
+- 내역추가 **전체화면 모달**(바깥 닫힘 방지) / 분류 **아코디언**(대분류 삼각형) / 계좌 셀렉트 정리(종류별 안내·이름만)
+- 구글 로그인 **Play 서명 SHA-1 등록**(Google Cloud Android OAuth 클라 추가)
+- **UI 전면 개편 (2026-07-04)** — 모든 입력 모달 전체화면 슬라이드업(AppModal) 적용:
+  - 공통 `CategoryPicker.vue` 컴포넌트 — 대분류/소분류 아코디언 칩 + 인라인 추가 (가계부·고정지출·예산 공통)
+  - `AccountView` 계좌종류·구분 셀렉트→뱃지, 분류→CategoryPicker
+  - `RecurringView` 구분·주기 셀렉트→뱃지, 계좌/카드→뱃지, 분류→CategoryPicker
+  - `AccountWalletView` 카드종류·상환방식 셀렉트→뱃지
+  - `BudgetView` 비고정/고정 라디오→뱃지, 카테고리→CategoryPicker
+  - `CategoryView` 리스트 UI → **칩 그리드 관리 모드** (CategoryPicker admin prop): ✏ 이름수정·✕ 삭제·⠿ 순서변경(토글 후 드래그)
+- **게시판 포인트 정책** — 작성 10P(일 5회·50P 한도), 스팸 키워드 포함 시 미지급; 추천 +5P(작성자·일 50P)/비추 -1P; 남글추천 +1P(투표자·일 10P)/취소 -1P
+- **가계부 작성 포인트** — 건당 10P, 일 5회(50P) 한도
+- **스팸 키워드 자동 블라인드** — 14개 키워드 포함 시 글/댓글 즉시 블라인드, 포인트 미지급
+- **관리자 신고글 목록 고도화** — 신고 누적 + 스팸 감지 통합; 🤖 스팸감지 뱃지·blockReason 표시; 스팸 항목 신고 무시 버튼 숨김
+
+**2026-07-09~11 추가 (웹·서버 배포 완료 / iOS는 재빌드 시 반영)**
+- **애플 로그인(Sign in with Apple)** — 프런트(`native/appleAuth`·LoginModal)·백엔드(`/auth/apple`, 애플 JWKS 검증·aud=번들ID)·DB(`member.apple_id`)·iOS entitlements 전 구간. iOS 번들ID `kr.sblog.slimbudget.app`로 변경, 서버 `apple-client-id` 정합. 실기기 로그인 확인
+- **입력 UI 모달 → 페이지 전환 + 바텀시트** (톤 통일)
+  - **계좌**(`WalletFormView`)·**정기결제**(`RecurringFormView`) → 별도 라우트 페이지, 생성 시 계좌 종류 선택 복원
+  - **내역·예산** → 콘텐츠 영역 인라인 페이지(`?entry`/`?budget` 라우트 바인딩, 뒤로가기로 닫힘) — 핵심 로직(AI·OCR·상환 등) 이관 없이 프레젠테이션만 변경(회귀 위험 최소화)
+  - 선택 항목 **바텀시트**: `BottomSheet`·`SheetSelect`·**`AccountPicker`(종류→계좌 아코디언)** 공통 컴포넌트. 계좌·분류·검색 필터에 적용(분류는 CategoryPicker `hideAdd`)
+  - **화면 헤더 뒤로가기 버튼 제거** → 하단 네비 뒤로가기로 유도
+- **계좌 관리 개편** — 탭 제거→종류별 그룹 목록, 계좌명 클릭 시 **상세 화면**(`AccountWalletDetailView`), 순서변경 잠금 토글, 투자계좌는 투자금만
+- **대출·카드할부 상환 조회(유료)** `RepaymentScheduleView`+`utils/repayment.js` — 상환방식별 상각+카드할부(무이자), 회차별 원금·이자·합계·잔액. **대출 월 상환금(loanPayment) 필드**로 은행 조회액과 정확 일치. 이자율 소수점 3자리. 홈 **'이번 달 상환 예정' 카드(유료)**
+- **예산 단순화** — '월 예산'만 등록, 고정/비고정·일/주/년·**1회성 예산 제거**
+- **레이아웃** — 하단 고정 내비에 가리던 문제 수정(본문 `padding-bottom`)
+- **정기결제 등록 자동세팅** — 원리금균등은 저장된 월 상환금 우선
+- **연락처 이메일** → `dondwaeji.app@gmail.com` (약관·계정삭제·스토어 문의)
+
+**2026-07-07 추가 (웹·서버 배포 완료)**
+- **정기결제 리네이밍** — 전체 화면 '고정지출' → '정기결제' (백업 엑셀 시트명은 기존 백업 복원 호환 위해 유지)
+- **정기결제 주기 월/년만** — DAILY·WEEKLY 제거, 요일선택 UI 제거 (`RecurringView`)
+- **계좌 관리 화면 개편** — 탭 제거 → **종류별 그룹 목록**, 계좌명 클릭 시 **상세 화면 분리**(`/account/wallets/:id` `AccountWalletDetailView`), 순서변경 **잠금 토글**, 투자계좌는 투자금만 표기·상세 비활성
+- **태그관리 순서변경 토글** — 기본 비활성, '순서변경' 버튼 클릭 시 드래그 활성 (`AccountTagView`)
+- **대출·카드할부 상환 조회 (유료)** — `RepaymentScheduleView.vue` + `utils/repayment.js`. 대출 상환방식별 상각(원리금균등·원금균등·만기일시) + 카드 할부(무이자) **남은 스케줄**, 회차별 **원금·이자·합계·남은잔액**, 이번 달/남은 총액. 사이드바 유료 메뉴
+- **대출 월 상환금(loanPayment) 필드** — 백엔드 컬럼(`wallet.loan_payment`)+DTO/매퍼, 계좌 폼 선택 입력. 원리금균등을 **은행 조회액과 정확히 일치**(이자=잔액×이율, 원금=월상환금−이자), **마지막 회차 잔여 반올림 정산**. 미입력 시 잔액·개월수로 PMT 추정
+- **대출 이자율 소수점 3자리** 입력(step 0.001, `loan_rate` DECIMAL(7,4))
+- **가계부 대출 상환 자동세팅** — 원리금균등 선택 시 저장된 **월 상환금 우선** 반영(옛 PMT 추정 대체), 마지막 회차 초과상환 방지 (`AccountView`)
+- **홈 대시보드 '이번 달 상환 예정' 카드 (유료)** — 현재일 기준 대출·카드할부 상환 예정 합계, **가계부에 상환 기록 있으면 제외**, 모두 기록 시 '상환 완료' 표시
+- **AI 교통 절약 팁 제외** — 버스·지하철·대중교통 분류는 정기권 최저비용 사용 중으로 tips에서 제외 (`AiEntryParser`)
+
+**2026-07-05 추가 (웹 배포됨, v3 빌드 대기)**
+- **AI 편의 기능** — 자연어 입력·영수증 비전·분류/계좌 추천·재무 코멘트·절약 가이드 (상세는 아래 🤖 섹션)
+- **홈 대시보드 오늘 기록 넛지** — '안녕하세요 OO님' → 오늘 기록 상태로 대체(없으면 '지금 기록하기' CTA / 있으면 'N건'·연속 2일+ 'N일 연속 🔥')
+- **통계 화면 정리** — '예산 대비'+'수입 대비' 두 패널 → '이번 달 현황' 단일 패널 통합; 예상 지출은 **결정적 계산**(일회성 큰 지출 제외, 매 접속 동일값); AI 코멘트 로딩 인디케이터
+- **한 달 개근 보너스 포인트** — 현재 월 모든 날 기록 시 **랜덤 1~100P**(월 1회, 전월 소급 제외, 화면 안내 없음, `MONTH_COMPLETE_yyyyMM`로 중복 차단)
+- **iOS 안전영역·클립보드 수정** — 사이드바 상단 상태바 겹침 해결; 모달 열 때 클립보드 자동읽기 제거(iOS '붙여넣기' 토스트 방지). 음성 입력=iOS 키보드 받아쓰기(실기기 확인)
+
+---
+
+## 📌 남은 백로그 (출시 후 업데이트)
+1. **앱 업데이트 안내** — 새 버전 알림 + 구글플레이 바로가기
+2. (선택) 첫 실행 온보딩 / Play 인앱 리뷰 / 생체 인증
+3. **조직 계정 전환** — 사업자등록→DUNS→앱이전
+4. ✅ **포인트 상점** (2026-07-10 구현 완료)
+   - **계좌 슬롯**: 500P/개, 최대 3개, 영구. `extra_wallet_slots` (member 테이블)
+   - **AI 통계 분석**: 1000P → 10회 이용권. `ai_stat_credits` (member 테이블)
+   - FREE 회원이 크레딧 없이 AI 코멘트 호출 시 402 → 통계 화면에서 상점 안내
+   - PREMIUM 회원은 AI 코멘트 무제한 (크레딧 불필요)
+
+### 🤖 AI 기능 — ✅ 구현·배포 완료 (2026-07-05)
+- 백엔드: `AiEntryParser`(Claude Haiku 4.5, raw HTTP `/v1/messages`), 키는 서버 `/opt/sb-backend/.env`(`ANTHROPIC_API_KEY`), 실패/미설정 시 규칙기반·Google Vision OCR 폴백.
+- ✅ **① 자연어 한 줄 입력** — "어제 스타벅스 5천원" → 폼 자동 채움. 내역 화면 '✨ 빠른 입력' 바 진입점. (음성=iOS 키보드 받아쓰기, 실기기 확인)
+- ✅ **② 영수증 사진 → AI 구조화** — Claude Vision이 금액·상호·날짜·분류·계좌 추출(`/ocr/receipt-ai`), 실패 시 Google Vision 폴백.
+- ✅ **③ 분류·계좌 자동 추천** — 사용자 실제 분류·계좌 목록 중에서 선택(할루시네이션 방지 검증).
+- ✅ **AI 재무 코멘트 + 절약 가이드** — 통계 화면, **집계 수치만** 전송(거래 원문 미전송), 정중체. 예상 지출은 비결정성 때문에 **결정적 계산**(일회성 큰 지출 제외)으로 분리.
+- ✅ **개인정보처리방침·데이터안전 갱신** — 처리자 Anthropic(Claude) 명시, 전송 데이터 범위·학습 미사용 고지 (terms.js §2·§3, play-store-listing.md 데이터안전).
+- 원칙 준수: AI는 폼 prefill·참고 코멘트만, **저장은 사용자 확인 후**.
+
+---
+
+## 🔨 빌드 상태
+- **v2** (versionCode 2, 1.0.1): 비공개 테스트 게시·검토통과
+- **v3** (versionCode 3): 위 'v2 이후 추가' + **AI 기능(자연어·영수증·분류/계좌·재무코멘트)** 전부 반영 — 빌드 후 비공개 트랙 업로드 (14일 카운트 리셋 안 됨)
+  - ⚠️ 빌드 전 서버 `.env`에 `ANTHROPIC_API_KEY`(AI) 확인
+  - ✅ 가계부 내역 오류 해결됨 (2026-07-05)
+  - ✅ 1회성 예산(BudgetOnetime) 백엔드 배포 완료 (2026-07-05)
+---
+
+## 다음 세션 재개 지점
+0. ⏳ **[진행중] iOS App Store 심사 결과 대기** — v1.0 제출 완료. 승인 시 출시(자동/수동), 거부 시 Resolution Center 대응(주로 데모 접근 안내)
+1. **테스터 12명 opt-in 진행상황 확인**(업체 의뢰) → 12명 + 14일 연속 충족되면 **프로덕션 액세스 신청**
+2. **v5 AAB 비공개 트랙 업로드** — 이번 작업분(애플로그인·페이지개편·상환조회 등) 반영해 AAB 재빌드·업로드
+3. **DUNS 발급 대기** → 발급 시 Play Console 개인사업자 계정 전환
+4. **수익화(출시 후)** — 구독(iOS StoreKit 미구현 → 결제코드+ASC상품+영수증검증 필요) / 광고(광고SDK+ATT+App Privacy 갱신). 둘 다 무료 출시 후 업데이트로
+5. (선택) **음성 전용 🎤 버튼** — `@capacitor-community/speech-recognition`
+6. **CI 러너 안정화** — Gitea act_runner 멈춤(재부팅 후 대기)로 배포 지연된 적 있음 → 자동재시작/헬스체크

brand/gen-store-assets.mjs

@@ -0,0 +1,93 @@
+// Play Console 스토어 그래픽 생성기.
+//   입력:  brand/logo-1024.png  (사용자가 저장한 1024x1024 돈돼지 마스터 아트)
+//   출력:  brand/store/icon-512.png            (스토어 고해상도 아이콘 512x512, 불투명)
+//          brand/store/feature-1024x500.png     (피처 그래픽 — 텍스트 없음, 항상 안정)
+//          brand/store/feature-1024x500-text.png(피처 그래픽 — 한글 텍스트 포함, best-effort)
+//
+// 실행:  node brand/gen-store-assets.mjs [입력경로]
+import sharp from 'sharp'
+import { mkdirSync, existsSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
+import { dirname, join, resolve } from 'node:path'
+
+const __dirname = dirname(fileURLToPath(import.meta.url))
+const SRC = resolve(process.argv[2] || join(__dirname, 'logo-1024.png'))
+const OUT = join(__dirname, 'store')
+
+// 브랜드 색 (아이콘 배경의 크림/옐로 계열)
+const CREAM = '#FBF7E9'
+const YELLOW = '#F2C94C'
+const BROWN = '#B8860B'
+
+if (!existsSync(SRC)) {
+  console.error(`\n[!] 마스터 아트가 없습니다: ${SRC}`)
+  console.error(`    1024x1024 돈돼지 PNG 를 위 경로에 저장한 뒤 다시 실행하세요.\n`)
+  process.exit(1)
+}
+mkdirSync(OUT, { recursive: true })
+
+const log = (f) => console.log('  ✓', f)
+
+// 1) 스토어 아이콘 512x512 — 불투명 크림 배경 위에 마스터를 합성(투명 PNG 대비)
+async function icon512() {
+  const logo = await sharp(SRC).resize(512, 512, { fit: 'contain', background: CREAM }).png().toBuffer()
+  const out = join(OUT, 'icon-512.png')
+  await sharp({ create: { width: 512, height: 512, channels: 4, background: CREAM } })
+    .composite([{ input: logo }])
+    .flatten({ background: CREAM })
+    .png()
+    .toFile(out)
+  log('store/icon-512.png  (512x512, 불투명)')
+}
+
+// 공통: 1024x500 배경 — 피그가 놓일 우측(크림)에서 좌측(옐로 살짝)으로.
+// 중심을 피그 쪽 크림으로 두어 마스터의 크림 배경 사각이 자연스럽게 녹도록 한다.
+function bgSvg(cx = '80%') {
+  return Buffer.from(`<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="500">
+    <defs>
+      <radialGradient id="g" cx="${cx}" cy="48%" r="95%">
+        <stop offset="0%" stop-color="${CREAM}"/>
+        <stop offset="62%" stop-color="${CREAM}"/>
+        <stop offset="100%" stop-color="${YELLOW}" stop-opacity="0.55"/>
+      </radialGradient>
+    </defs>
+    <rect width="1024" height="500" fill="url(#g)"/>
+  </svg>`)
+}
+
+// 2) 피처 그래픽 (텍스트 없음) — 가운데 큼직하게, 박스 없이 녹아들게
+async function featurePlain() {
+  const bg = await sharp(bgSvg('50%')).png().toBuffer()
+  const pig = await sharp(SRC).resize(420, 420, { fit: 'contain', background: { r: 0, g: 0, b: 0, alpha: 0 } }).png().toBuffer()
+  const out = join(OUT, 'feature-1024x500.png')
+  await sharp(bg).composite([{ input: pig, top: 40, left: 302 }]).png().toFile(out)
+  log('store/feature-1024x500.png  (텍스트 없음)')
+}
+
+// 3) 피처 그래픽 (한글 텍스트) — 좌측 텍스트 / 우측 피그, 겹침 없도록 간격 조정.
+async function featureWithText() {
+  const bg = await sharp(bgSvg('82%')).png().toBuffer()
+  const pig = await sharp(SRC).resize(380, 380, { fit: 'contain', background: { r: 0, g: 0, b: 0, alpha: 0 } }).png().toBuffer()
+  const text = Buffer.from(`<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="500">
+    <style>
+      .t { font-family: 'Malgun Gothic','맑은 고딕',sans-serif; fill:${BROWN}; }
+      .title { font-size: 80px; font-weight: 800; }
+      .sub { font-size: 29px; font-weight: 500; fill:#8a6d10; }
+    </style>
+    <text x="64" y="232" class="t title">돈돼지 가계부</text>
+    <text x="68" y="290" class="t sub">슬림하게 관리하는</text>
+    <text x="68" y="332" class="t sub">가계부 · 자산 · 예산</text>
+  </svg>`)
+  const out = join(OUT, 'feature-1024x500-text.png')
+  await sharp(bg)
+    .composite([{ input: pig, top: 60, left: 630 }, { input: text }])
+    .png()
+    .toFile(out)
+  log('store/feature-1024x500-text.png  (한글 텍스트, 폰트 렌더 확인 필요)')
+}
+
+console.log(`\n[스토어 에셋 생성]  입력: ${SRC}\n`)
+await icon512()
+await featurePlain()
+await featureWithText()
+console.log(`\n완료 → ${OUT}\n`)

brand/play-store-listing.md

@@ -0,0 +1,136 @@
+# Play Console 등록 자료 — 돈돼지 가계부
+
+> 첫 출시(무료 앱, 인앱결제·광고 모두 비활성화) 기준. Play Console 각 항목에 그대로 붙여넣기.
+> 광고(카카오 애드핏)를 껐으므로 광고 식별자 수집/제3자 공유가 없어 데이터 안전이 단순함.
+
+---
+
+## 1. 스토어 등록정보 (Main store listing)
+
+### 앱 이름 (30자 이내)
+```
+돈돼지 가계부
+```
+
+### 간단한 설명 / Short description (80자 이내)
+```
+가계부·자산·예산을 슬림하게. 고정지출 자동, 통계 차트, 영수증 인식까지.
+```
+
+### 자세한 설명 / Full description (4000자 이내)
+```
+🐷 돈돼지 가계부 — 슬림하게 관리하는 가계부 · 자산 · 예산
+
+복잡한 가계부는 그만! 수입·지출을 빠르게 기록하고, 자산과 예산을 한눈에 관리하세요.
+군더더기 없는 깔끔한 화면으로 매일 쓰기 부담 없는 가계부입니다.
+
+▪ 간편한 가계부
+· 수입·지출·이체를 몇 번의 터치로 기록
+· 자주 쓰는 내역을 칩으로 등록해 1초 입력
+· 월별 수입/지출/잔액 요약과 일별 내역 정리
+
+▪ 자산 · 부채 관리
+· 은행·현금·신용/체크카드·대출·투자 계좌를 한 곳에서
+· 총자산 · 총부채 · 순자산을 자동 집계
+
+▪ 고정 지출 자동 반영 (프리미엄)
+· 월세·구독료·급여 등 반복 거래를 등록해두면 주기에 맞춰 자동 생성
+· 실제 결제만 '확인'으로 확정 — 빠뜨림 없는 가계부
+
+▪ 통계와 예산 (프리미엄)
+· 분류별 지출, 수입 대비 지출, 지난달 대비, 월말 예상까지 차트로 분석
+· 카테고리별 예산을 정하고 예산 대비 지출을 한눈에
+
+▪ 영수증 인식 (프리미엄)
+· 영수증을 촬영하면 금액·내역을 자동 인식해 입력 시간을 단축
+
+▪ 커뮤니티
+· 짠테크·재테크 노하우를 나누는 게시판
+· 추천·댓글로 소통하고 좋은 글을 발견
+
+▪ 그 외
+· 다크 모드 지원
+· 엑셀 백업/복구로 내 데이터를 안전하게 (프리미엄)
+· 로그인 없이 '둘러보기'로 먼저 체험
+
+무료로 핵심 가계부 기능을 모두 사용할 수 있으며, 통계·예산·고정지출 자동화·영수증 인식·백업 등은 프리미엄에서 제공됩니다. (구독 기능은 순차적으로 제공될 예정입니다.)
+
+오늘부터 돈돼지와 함께 슬림한 가계 관리를 시작해보세요!
+
+문의: dondwaeji.app@gmail.com
+```
+
+### 기타 등록정보 필드
+- **앱 카테고리**: 금융 (Finance)
+- **태그**: 가계부, 예산, 자산관리
+- **연락처 이메일**: dondwaeji.app@gmail.com
+- **개인정보처리방침 URL**: https://www.sblog.kr/privacy
+- **그래픽 에셋**:
+  - 앱 아이콘: brand/store/icon-512.png
+  - 그래픽 이미지(피처): brand/store/feature-1024x500-text.png (또는 -text 없는 버전)
+  - 휴대전화 스크린샷: brand/screenshots/shot1~6 (6장)
+
+---
+
+## 2. 데이터 안전 (Data safety) 양식
+
+> "앱 콘텐츠 → 데이터 보안" 에서 작성. 아래 기준으로 답하면 개인정보처리방침과 일치함.
+
+### 개요 질문
+- 데이터를 수집하나요? → **예**
+- 데이터를 제3자와 공유하나요? → **아니요** (광고 끔. OCR·AI(Anthropic)는 대행 처리(처리 위탁)이며 Google Play 기준 '공유'에 해당하지 않음)
+- 전송 중 데이터가 암호화되나요? → **예** (HTTPS)
+- 사용자가 데이터 삭제를 요청할 수 있나요? → **예** (앱 내 '회원 탈퇴' + 이메일 요청, https://www.sblog.kr/account-deletion)
+
+### 수집하는 데이터 유형 (각 항목: 수집됨 / 목적 / 공유 여부)
+
+| 데이터 유형 | 수집 | 공유 | 목적 |
+|---|---|---|---|
+| **개인 정보 → 이름** | 예 | 아니요 | 앱 기능, 계정 관리 |
+| **개인 정보 → 이메일 주소** | 예 | 아니요 | 앱 기능, 계정 관리 |
+| **금융 정보 → 기타 금융 정보** (사용자가 입력한 수입·지출·자산 등 가계부 데이터) | 예 | 아니요 | 앱 기능 |
+| **사진 및 동영상 → 사진** (프로필·영수증·게시판 이미지) | 예 | 아니요 | 앱 기능 |
+| **앱 활동 → 사용자가 생성한 콘텐츠** (게시판 글·댓글) | 예 | 아니요 | 앱 기능 |
+| **앱 활동 → 앱 상호작용** | 예 | 아니요 | 앱 기능, 부정 이용 방지 |
+
+각 항목 공통:
+- **수집이 필수인가요?** → "데이터 수집이 필수임" (서비스 제공에 필요)
+- **데이터가 암호화되나요(전송 중)?** → 예
+- **삭제 요청 가능?** → 예
+
+> ✅ 광고를 껐으므로 **광고 식별자(기기 ID) 수집/공유가 없습니다** — 데이터 안전 양식이 단순해지고 심사 불일치 리스크가 사라졌습니다.
+
+### AI 편의 기능의 데이터 처리 (처리 위탁, 공유 아님)
+> 아래는 개인정보처리방침 3항과 정합. 회원이 해당 기능을 쓸 때에만, 기능 수행 목적으로 Anthropic(Claude) API에 전송됨. Anthropic은 학습에 사용하지 않고, 서비스도 별도 저장하지 않음(폼 자동 채움용). API 키는 서버 보관.
+> - 자연어 한 줄 입력: 입력 텍스트 → 금액·분류 등 구조화
+> - 영수증 사진 구조화: 영수증 이미지 → 금액·상호·날짜·분류
+> - 분류·계좌 자동 추천: 분류·계좌 '이름' 목록
+> - 재무 코멘트: 이번 달 **집계 수치만**(개별 거래 원문 미전송)
+>
+> Play 데이터 안전에서 위 데이터 유형(금융 정보·사진)의 **공유 여부는 계속 '아니요'** (대행 처리는 공유 아님). 다만 방침에 처리자(Anthropic)를 명시했으므로 심사자 교차확인에도 일치함.
+
+---
+
+## 3. 콘텐츠 등급 설문 (IARC)
+
+> "앱 콘텐츠 → 콘텐츠 등급" 설문. 핵심 답안:
+
+- 앱 카테고리: **유틸리티/생산성/기타** (또는 금융)
+- 폭력/성적/혐오/약물/도박 콘텐츠: **모두 없음**
+- **사용자 간 상호작용/사용자 생성 콘텐츠(게시판)**: **있음** → "사용자가 콘텐츠를 만들고 공유할 수 있음" 으로 정직하게 표시
+  - 신고 기능(5건 누적 블라인드)·관리자 차단 등 **중재 수단 보유** → 관련 질문에 "콘텐츠 신고/차단 기능 있음"으로 답변
+- 위치 공유 / 개인정보 공유 기능: **없음**
+- 디지털 구매(인앱결제): 첫 출시는 **비활성화** → "없음" (추후 활성화 시 등급 갱신)
+- **광고 포함 여부**: **아니요** (광고 껐음 — 추후 활성화 시 갱신)
+- 예상 등급: 대체로 **만 3세 이상(전체이용가)** 수준, UGC로 인해 일부 지역에서 Teen 가능 — 설문 결과 따름
+
+---
+
+## 4. 기타 출시 전 체크
+- **앱 액세스 권한**: 로그인 필요 → 심사용 테스트 계정 제공 (Play Console "앱 액세스 권한"에 kenneth73510 계정 또는 데모 안내). 데모(둘러보기)로도 핵심 화면 확인 가능함을 메모.
+- **타겟 출시 국가**: 대한민국 (필요 시 확대)
+- **데이터 삭제 URL**: https://www.sblog.kr/account-deletion (데이터 안전 양식 + 앱 콘텐츠)
+- **앱 카테고리/연락처/방침 URL** 위 1번 참고
+- 광고 포함 여부 질문: **아니요(광고 없음)** — 광고를 껐으므로 "광고 없음"으로 표시
+- ⚠️ **개인정보처리방침 정합성**: 현재 방침 4항이 "무료 회원에게 광고가 표시되며…"로 적혀 있어 광고 OFF 와 불일치. 심사자 교차확인 대비해 방침의 광고 문구를 "향후 광고가 도입될 수 있으며…"(미래형)로 완화 권장. (원하면 수정·배포 도와드림)
+```

brand/production-access-draft.md

@@ -0,0 +1,57 @@
+# 프로덕션 액세스 신청서 초안 — 돈돼지 가계부
+
+> 14일 폐쇄 테스트 완료 후 Play Console "프로덕션 액세스 신청" 폼에 입력.
+> ⚠️ [대괄호] 부분은 실제 테스트 후 본인 경험으로 교체하세요. 거짓·과장 금지 — 실제로 테스트한 내용을 적어야 합니다.
+
+---
+
+## Q1. 테스터를 어떻게 모집했나요? (How did you recruit your testers?)
+
+```
+실제 Android 기기와 Google 계정을 보유한 [12]명의 테스터를 모집해 비공개 테스트를 진행했습니다.
+테스터는 안드로이드 사용자 지인 및 개발자 커뮤니티의 베타 테스터 모임을 통해 모았으며,
+모두 실제 기기에 앱을 설치하고 14일간 사용했습니다.
+```
+> 유료/품앗이 서비스를 쓴 경우에도 "실제 기기·실제 계정 테스터"라는 사실 위주로 적되, 허위로 쓰지 마세요.
+
+## Q2. 테스터와 어떻게 소통하고 피드백을 수집했나요?
+
+```
+이메일과 메신저(오픈채팅)로 테스터에게 설치 안내와 점검 항목을 전달했습니다.
+점검 항목: 회원가입/구글 로그인, 가계부 수입·지출 기록, 계좌·자산 관리, 예산·통계 화면,
+고정지출 자동 반영, 커뮤니티 게시판(글·댓글·추천), 다크 모드.
+테스터가 사용 중 발견한 버그·불편 사항을 회신받아 정리했습니다.
+```
+
+## Q3. 어떤 피드백을 받았고, 무엇을 개선했나요?
+
+```
+주요 피드백과 개선:
+- 둘러보기(로그인 없이 체험) 모드에서 일부 화면의 메뉴 접근이 불편 → 메뉴 진입 동선 수정
+- 특정 기기에서 한글 입력 시 자동완성/맞춤법 검사로 입력이 끊김 → 입력 필드 설정 수정으로 해결
+- 무료/유료 기능 구분 및 화면 흐름이 헷갈린다는 의견 → 안내 문구·접근 동선 정리
+- [본인 테스트 중 실제로 발견한 버그/불편과 그에 대한 수정 내용을 추가 기재]
+크래시나 데이터 유실 등 치명적 문제는 발견되지 않았습니다.
+```
+
+## Q4. 앱이 프로덕션에 준비되었다고 보는 이유는?
+
+```
+돈돼지 가계부는 웹·Windows 데스크톱에서 이미 운영 중인 개인 가계부 서비스이며,
+이번 비공개 테스트로 Android 실기기에서 핵심 기능(가계부 기록, 계좌·자산, 예산·통계,
+고정지출 자동 반영, 커뮤니티, 구글 로그인)의 안정성을 14일간 검증했습니다.
+다양한 기기에서 크래시 없이 정상 동작하며, 테스트 중 제기된 개선 사항을 반영했습니다.
+개인정보처리방침·데이터 삭제 안내 등 정책 요건도 갖추어 정식 출시 준비가 되었다고 판단합니다.
+```
+
+---
+
+## (선택) 영어 버전 — 폼이 영어로 표시될 경우
+
+**Q1 Recruit:** I recruited [12] testers who own real Android devices with genuine Google accounts, through acquaintances and a developer beta-tester community. All installed the app and used it over the 14-day period.
+
+**Q2 Feedback collection:** I communicated via email and messenger, sharing install instructions and a checklist (Google sign-in, expense/income tracking, accounts & assets, budget & statistics, recurring transactions, community board, dark mode), and collected bug reports and usability feedback.
+
+**Q3 Findings & changes:** Key fixes included improving menu navigation in the guest "explore" mode, resolving a Korean-input (IME) issue on certain devices, and clarifying free/premium feature flow. [Add the real bugs you found.] No crashes or data-loss issues were found.
+
+**Q4 Readiness:** Don Dwaeji budget app already runs in production on web and Windows desktop. The closed test validated the Android build's core features on real devices over 14 days with no crashes, and feedback was addressed. Privacy policy and data-deletion pages are in place, so the app is ready for production.

build/installer.nsh

@@ -0,0 +1,9 @@
+; 기본 설치 경로 지정 (사용자 폴더 = 관리자 권한 불필요 → UAC 프롬프트 없음).
+; productName 이 한글이라 electron-builder 가 기본 경로를 package.json name(sb_pt)으로 폴백하는 문제도 함께 회피.
+; → %LOCALAPPDATA%\Programs\DonDwaeji 로 고정 (사용자는 설치 시 변경 가능).
+!macro preInit
+  SetRegView 64
+  WriteRegExpandStr HKCU "${INSTALL_REGISTRY_KEY}" InstallLocation "$LOCALAPPDATA\Programs\DonDwaeji"
+  SetRegView 32
+  WriteRegExpandStr HKCU "${INSTALL_REGISTRY_KEY}" InstallLocation "$LOCALAPPDATA\Programs\DonDwaeji"
+!macroend

docs/FRONTEND.md

@@ -1,16 +1,23 @@
-# Slim Budget — 프론트엔드 (sb_pt)
+# 돈돼지 가계부 — 프론트엔드 (sb_pt)
 
-Vue 3 + Vite 기반의 가계부·게시판 웹 애플리케이션 프론트엔드.
+Vue 3 + Vite 기반의 가계부·자산·게시판 앱 프론트엔드. 하나의 코드베이스로 **웹 / 안드로이드(Capacitor) / Windows 데스크톱(Electron)** 3개 플랫폼을 빌드합니다.
 
 ## 기술 스택
 - **Vue 3** (`<script setup>` Composition API) + **Vite**
 - **Pinia** (상태관리), **Vue Router** (라우팅)
 - **Axios** (HTTP, 공통 인스턴스 + 토큰/401 인터셉터)
 - **Toast UI Editor** (`@toast-ui/editor`) + Prism.js (게시판 마크다운 작성/뷰어·코드 하이라이트)
+- **Capacitor**(안드로이드 하이브리드 앱) · **Electron**(Windows 데스크톱) · **Vitest**(테스트)
 
 ## 브랜딩
-- 서비스명 **Slim Budget** (헤더 로고/타이틀/푸터)
-- 로고: `public/logo.svg` (브랜드 그린 `#00bc7e` 배지 + 슬림 막대 차트), 파비콘으로도 사용
+- 서비스명 **돈돼지 가계부** (구 Slim Budget)
+- 로고: 돈돼지(투명 배경) — 헤더/사이드바 로고·파비콘·앱 런처 아이콘. 브랜드 그린 `#00bc7e`
+
+## 플랫폼별 동작
+- **웹(PC·모바일)**: 안내 페이지([WebOnlyNotice.vue](../src/components/WebOnlyNotice.vue))만 노출(앱 다운로드 유도). 실제 이용은 앱에서. `npm run dev` 는 예외로 전체 앱 표시
+- **안드로이드**: Capacitor WebView 패키징 → [ANDROID.md](ANDROID.md)
+- **Windows**: Electron 이 라이브 사이트(app.sblog.kr)를 직접 로드 → 프론트 변경이 재설치 없이 반영
+- 기능 플래그 [src/config/features.js](../src/config/features.js): `ID_LOGIN_ENABLED`(아이디 로그인)·`BILLING_ENABLED`(인앱결제)·`ADS_ENABLED`(광고)·`CARD_NOTIF_ENABLED`(카드알림) — 첫 출시 기준 전부 `false`
 
 ## 디렉터리 구조
 ```
@@ -21,65 +28,76 @@ src/
 │   ├── boardApi.js    # 게시판
 │   ├── adminApi.js    # 관리자(태그 카테고리)
 │   └── accountApi.js  # 가계부 전체
+│   ├── billingApi.js  # 인앱결제/구독
 ├── stores/            # Pinia (auth, ui, user)
+├── config/features.js # 기능 플래그(아이디로그인·결제·광고·카드알림)
 ├── router/index.js    # 라우트 + 인증 가드
 ├── components/
-│   ├── layout/        # AppHeader / AppSidebar / AppFooter
-│   ├── ui/IconBtn.vue # 공통 SVG 아이콘 버튼
+│   ├── layout/        # AppHeader / AppSidebar / AppFooter / AppBottomNav
+│   ├── ui/            # IconBtn / AppModal(전체화면 슬라이드업) / AppDialog / CategoryPicker
 │   ├── editor/        # MarkdownEditor / MarkdownViewer
-│   ├── LoginModal.vue / SignupModal.vue
+│   ├── LoginModal.vue / SignupModal.vue / AppLockScreen.vue(PIN) / AdBanner.vue / WebOnlyNotice.vue
 ├── views/
-│   ├── HomeView.vue   # 홈(대시보드 자리, 현재 빈 공간)
-│   ├── UsersView.vue  # 사용자 관리
+│   ├── HomeView.vue   # 홈 대시보드(요약·일별 캘린더)
 │   ├── board/         # 게시판 (목록/상세/작성)
 │   ├── account/       # 가계부 (아래 참조)
-│   └── admin/         # 태그 관리(관리자)
-└── assets/main.css    # 전역 스타일
+│   └── admin/         # 회원/태그 관리(관리자)
+└── assets/            # base.css(data-theme 다크모드) 등 전역 스타일
 ```
 
 ## 인증
 - 로그인 시 발급된 **Bearer 토큰**을 `localStorage`에 저장, `http.js` 요청 인터셉터가 `Authorization` 헤더에 주입
+- **구글 로그인**(웹/PC=Google Identity Services, 앱=네이티브 플러그인) — 현재 소셜 로그인 전용(`ID_LOGIN_ENABLED=false` 로 아이디/비번 폼·회원가입 UI 숨김)
 - 401 응답 시 토큰 정리 후 `auth:unauthorized` 이벤트 → 로그인 모달 표시
 - 라우트 `meta.requiresAuth` / `requiresAdmin` 가드
 
-## 레이아웃 / 반응형
-- 그리드 레이아웃(헤더·사이드바·본문·푸터)
+## 레이아웃 / 반응형 / 테마
+- 그리드 레이아웃 — 사이드바가 좌측 상단(헤더 행)까지, 헤더는 현재 화면 타이틀 표시. 본문 폭 `--page-max`(760px)로 통일
+- **하단 고정 내비**([AppBottomNav.vue](../src/components/layout/AppBottomNav.vue)): 뒤로·앞으로·홈·새로고침·설정 (안드로이드 소프트키 위 안전영역)
 - **모바일(≤768px)**: 사이드바가 **오프캔버스 드로어**(햄버거 토글 + 백드롭, 라우트 이동 시 자동 닫힘)
-- 모든 액션 버튼은 **아이콘화**(`IconBtn`: 등록/수정/삭제/검색/페이징 등), `title`로 접근성·툴팁 제공
-- 한 줄에 담기 어려운 목록은 **2줄 표기**(게시판: 제목/메타, 가계부 내역: 분류·금액/날짜·메모·액션 등)
+- **입력 모달**: 전체화면 슬라이드업([AppModal.vue](../src/components/ui/AppModal.vue), 바깥 닫힘 방지). 셀렉트 대신 **뱃지/칩** 선택, 분류는 공통 [CategoryPicker.vue](../src/components/ui/CategoryPicker.vue)(대/소분류 아코디언)
+- **테마**: 시스템 / 라이트 / 다크 (설정 화면, `data-theme` 기반)
+- 모든 액션 버튼은 **아이콘화**(`IconBtn`), `title`로 접근성·툴팁 제공
 
 ## 게시판 (`/board`)
-- 목록(페이징·태그 필터·검색[제목/본문/댓글]), 상세, 작성/수정(마크다운)
-- 댓글, 태그, 관리자 **열람 제한/해제**
+- **커뮤니티 / 짠테크 수다방 / 재테크 팁** 3개 게시판(카테고리)
+- 목록(페이징·태그 필터·검색[제목/본문/댓글]·공지 최상단), 상세, 작성/수정(마크다운·이미지 업로드)
+- 댓글, 추천(vote), 태그, **공지**(관리자), 관리자 **열람 제한/해제**, 신고
 
 ## 가계부 (`/account`)
 사용자별 데이터 격리(본인 데이터만). 주요 화면(사이드바 하위 메뉴):
 
 | 경로 | 화면 | 설명 |
 |------|------|------|
-| `/account` | 대시보드 | 예산 대비 지출 도넛, **분류별 파이차트**, 기간별 예산대비지출 막대(툴팁), 수입대비지출, 월별 총액, **순자산 추이** 라인차트 |
-| `/account/entries` | 가계부 내역 | 월별 내역 CRUD, **검색·필터**(키워드/구분/분류/계좌/태그), 분류 인라인 추가 |
-| `/account/recurrings` | 정기 거래 | 일/주/월/년 반복 규칙, 진입 시 자동 반영(중복 없이) |
-| `/account/wallets` | 계좌 관리 | 은행/카드/대출/**투자** 계좌, 잔액·순자산, 상환/납부, **투자 포트폴리오** |
-| `/account/categories` | 분류 관리 | 수입/지출 분류 CRUD, 이름 변경 전파, 기존 내역에서 가져오기 |
-| `/account/budget` | 예산 설정 | 고정(일수 기준 자동 환산)/비고정, 예산 대비 진행률 |
+| `/account` | 대시보드 | 예산 대비 지출 도넛, **분류별 파이차트**(대분류 집계), 수입대비지출(월말 예상·지난달 대비), 월별 총액, **순자산 추이**(주간) 라인차트, 일별 캘린더 |
+| `/account/entries` | 가계부 내역 | 월별 내역 CRUD, **검색·필터**(키워드/구분/분류/계좌/태그), 날짜 그룹 접기/펴기, **외화 입력**(환율 자동환산), 내역→고정지출 바로 등록 |
+| `/account/recurrings` | 고정 지출 | 일/주/월/년 반복 규칙, 진입 시 자동 반영(중복 없이·'확인 필요'로 생성) |
+| `/account/wallets` | 계좌 관리 | 은행/**현금**/카드/대출/**투자** 계좌, 잔액·순자산, 상환/납부(원금·이자·연회비 분리), 월별 이용내역 |
+| `/account/categories` | 분류 관리 | 수입/지출 분류 CRUD(**대/소분류 2단계**), 칩 그리드 관리, 순서변경, 기존 내역에서 가져오기 |
+| `/account/budget` | 예산 설정 | **월별 예산**(전월/다음달 복사), 고정(일수 기준 자동 환산)/비고정, 예산 대비 진행률 |
 | `/account/tags` | 태그 관리 | 사용자별 가계부 태그 |
 
 ### 잔액·순자산 모델 (표시)
-- 자산(+) / 부채(−) 부호 모델. 지갑 잔액 = 개시잔액 + 수입 − 지출 − 이체출금 + 이체입금
+- 자산(+) / 부채(−) 부호 모델. 현금은 은행과 동일하게 자산 합산. 지갑 잔액 = 개시잔액 + 수입 − 지출 − 이체출금 + 이체입금
 - 순자산 = 총자산 − 총부채 (투자계좌는 평가금액 반영)
 
-### 투자 포트폴리오 (계좌 관리 > 투자 탭)
+### 투자 계좌 (계좌 관리 > 투자 탭)
 - 투자계좌를 펼치면 [InvestPortfolio.vue](../src/views/account/InvestPortfolio.vue) 패널
-- **종목별** 보유: 수량·평균매입단가·현재가(수동)·평가금액·**평가손익·수익률**·실현손익
-- **매수/매도** 건별 기록(이동평균 평단 자동 산출, 매도수량 초과 검증)
-- 입금은 가계부 **이체**(은행→투자)로, 예수금·주식평가는 자동 계산되어 순자산·추이에 반영
-- 원화·정수 수량 기준 (해외주식 소수점/환율·자동 시세는 범위 외)
+- **단순형 UI**: **투자금(투입원금) + 현재 평가액**만 입력 → 손익·수익률 자동 계산(퇴직연금·연금 등 포함). 계좌 펼침 시 투자금/평가액/손익(%) 요약 카드
+- 입금은 가계부 **이체**(은행→투자)로, 평가액은 순자산·추이에 반영
+- ℹ️ 백엔드는 종목 단위(매수·매도·시세 자동조회) API 를 유지하나 현재 UI 에는 노출하지 않음. 원화 기준
+
+## 설정 화면
+- 하단 내비 → 설정: 계정정보(이름·이메일·비밀번호 변경) · 테마(시스템/라이트/다크) · 앱 잠금(PIN, 1시간 유예) · 앱 버전 · App Data 삭제 · (PC)창 크기 프리셋
 
 ## 개발/빌드
 ```bash
 npm install
-npm run dev      # 개발 서버
-npm run build    # dist/ 정적 빌드
+npm run dev        # 개발 서버(전체 앱 표시)
+npm run build      # dist/ 정적 빌드(웹 배포)
+npm run cap:sync   # 앱 빌드 + 안드로이드 동기화
+npm run electron:build  # Windows 설치파일
+npm test           # Vitest
 ```
 - API 베이스 URL: `VITE_API_BASE_URL` (기본 `/api`)
+- 상세: [../README.md](../README.md) · 앱 [ANDROID.md](ANDROID.md) · 배포 [../deploy/README.md](../deploy/README.md)

docs/IOS.md

@@ -0,0 +1,81 @@
+# iOS 하이브리드 앱 (Capacitor)
+
+Vue `dist` 를 네이티브 WebView로 패키징해 iOS 앱으로 빌드합니다. 안드로이드와 **동일 코드베이스**이며, 플랫폼 분기는 `Capacitor.isNativePlatform()` / `getPlatform() === 'ios'` 로 처리합니다.
+
+## 구성
+- `capacitor.config.json` — appId `kr.sblog.slimbudget`(안드와 동일), appName `돈돼지 가계부`, webDir `dist`
+- `ios/` — 네이티브 프로젝트(커밋됨, 빌드 산출물 `ios/App/build`·`Pods` 는 .gitignore)
+- **Capacitor 8 = Swift Package Manager(SPM)** 사용 (CocoaPods 아님 — Podfile 불필요)
+- 웹 게이팅: iOS 는 `isNativePlatform()` 이 true → 안내 페이지가 아닌 전체 앱 표시
+
+## 사전 준비 (Mac)
+- **Xcode**(App Store, 대용량) + iOS SDK/시뮬레이터 런타임
+  ```bash
+  sudo xcode-select -s /Applications/Xcode.app/Contents/Developer
+  sudo xcodebuild -license accept
+  xcodebuild -downloadPlatform iOS   # 시뮬레이터 런타임(별도 온디맨드 다운로드)
+  ```
+- **Apple Developer Program($99/년)** — 실기기 배포·App Store·Apple 로그인 Capability 에 필요. (시뮬레이터 UI 테스트는 불필요)
+
+## 최초 셋업 (1회)
+```bash
+npm i @capacitor/ios
+npx cap add ios                 # ios/ 생성
+npm run build:app && npx cap sync ios
+npx capacitor-assets generate --ios   # 브랜드 아이콘 생성(assets/ 기준)
+```
+
+## 빌드 & 실행
+```bash
+npm run build:app && npx cap sync ios   # 코드 변경 시마다
+npx cap open ios                        # Xcode 열기
+# 또는 CLI 로 시뮬레이터에 바로:
+npx cap run ios --target <시뮬레이터-UDID>
+```
+시뮬레이터 목록: `xcrun simctl list devices available | grep iPhone`
+
+### 실기기 실행 (Xcode)
+1. **데이터 지원 케이블**로 아이폰 연결 → "이 컴퓨터 신뢰" (충전 전용 케이블은 인식 안 됨)
+2. Xcode → **App 타겟 → Signing & Capabilities → Automatically manage signing → Team 선택**(무료 Apple ID 도 7일 한정 가능)
+3. 상단 툴바 중앙 **기기 선택**(스킴 `App` 옆) → 연결된 아이폰 → **▶ Run**
+4. 최초엔 아이폰이 **개발자 모드**를 요구 → Run 시도 후 **설정 → 개인정보 보호 및 보안 → 개발자 모드 → 켬 → 재시동**
+5. "신뢰할 수 없는 개발자" → **설정 → 일반 → VPN 및 기기 관리 → 개발자 앱 → 신뢰**
+
+## 필수 설정 (반영 완료)
+- **번들 ID** `kr.sblog.slimbudget` (안드로이드와 동일 — App Store Connect 에서 그대로 사용)
+- **Info.plist 권한 문구** (없으면 카메라/사진 접근 시 크래시):
+  - `NSCameraUsageDescription`(영수증·프로필·게시판 촬영)
+  - `NSPhotoLibraryUsageDescription` / `NSPhotoLibraryAddUsageDescription`
+- **safe-area**: `index.html` 의 `viewport-fit=cover` + CSS `env(safe-area-inset-*)`.
+  ⚠️ 전역 `box-sizing: border-box` 에서 고정 `height` 를 쓰면 safe-area 패딩이 높이에 포함돼 콘텐츠가 눌린다 → 헤더는 `min-height`+세로패딩, 하단 내비는 `height: calc(56px + env(safe-area-inset-bottom))` 로 처리(적용됨).
+
+## Apple 로그인 (Sign in with Apple)
+> App Store 심사 가이드라인 **4.8**: 제3자 소셜 로그인(구글)을 제공하면 **Apple 로그인도 동등하게 제공**해야 함. iOS 출시에 **사실상 필수**.
+
+**구현 상태(코드 완료):**
+- 프론트: `@capacitor-community/apple-sign-in` + [LoginModal.vue](../src/components/LoginModal.vue) Apple 버튼(iOS 전용) + [appleAuth.js](../src/native/appleAuth.js)
+  - ⚠️ 이 플러그인은 Capacitor 7 기준(`capacitor-swift-pm 7.x`) → **patch-package** 로 8.x 로 패치(`patches/`). `npm ci` 후 `postinstall` 이 자동 적용. @capawesome 구글 플러그인과 iOS 공존.
+- 백엔드: `POST /api/auth/apple` — **nimbus-jose-jwt 로 Apple JWKS(공개키) 서명 검증** + iss/aud(번들ID)/exp 확인, `member.apple_id` 로 구글과 동일하게 이메일 자동연결. `app.apple-client-id`(기본 `kr.sblog.slimbudget`).
+- `ios/App/App/App.entitlements` — `applesignin` 엔틀먼트 준비됨.
+
+**작동시키려면(유료 승인 후):**
+1. Apple Developer 포털: App ID `kr.sblog.slimbudget` 에 **Sign in with Apple 활성화**
+2. Xcode → Signing & Capabilities → **+ Capability → "Sign in with Apple"** (준비된 `App.entitlements` 연결 + 프로비저닝)
+3. 테스트: 시뮬레이터 **설정 → Apple ID 로그인** 후 `cap run ios` → Apple 버튼
+   - Sign in with Apple 은 **시뮬레이터에서도 작동**(카메라/푸시와 달리). 단 1~2 가 갖춰져야 함.
+
+## 배포 (App Store)
+- **의무 테스트 기간 없음** — 안드로이드(Play)의 "테스터 12명·14일"과 달리, iOS 는 **바로 심사 제출 가능**. TestFlight 은 **선택**.
+- 절차: App Store Connect 앱 생성 → 아이콘·스크린샷(6.x" iPhone 규격)·App Privacy 작성 → Xcode Archive → 업로드 → 심사(보통 1~3일)
+- **TestFlight**(선택): 유료 승인 후 빌드 업로드 → **케이블 없이 아이폰에 무선 설치**(데이터 케이블 없을 때 유용). 내부 100명 즉시 / 외부 10,000명(가벼운 베타 심사).
+
+## 자주 막히는 부분
+- **SPM 의존성 충돌**: 플러그인이 서로 다른 `capacitor-swift-pm`/`googlesignin-ios` 버전을 요구하면 빌드 실패. Capacitor 8 전용 플러그인을 쓰거나(patch-package) 버전 정렬 필요.
+- **USB 연결이 충전만 됨**: 충전 전용 케이블 → **데이터 케이블**로 교체. 무선 디버깅도 최초 1회 유선 페어링 필요.
+- **개발자 모드 메뉴가 없음**: Xcode 로 기기 설치를 **한 번 시도한 뒤** 설정에 항목이 생김(iOS 16+).
+- **Developer 등록 "보류"**: 개인 등록은 Apple 이 추가 본인확인을 요청할 수 있음 → **Apple ID 이메일 확인 후 회신**해야 진행됨(자동으로 안 풀림).
+- **카메라/푸시는 시뮬레이터 제한** → 실기기 필요. Apple 로그인은 시뮬레이터 가능.
+
+## 참고
+- 안드로이드 빌드: [ANDROID.md](ANDROID.md) · 아키텍처: [FRONTEND.md](FRONTEND.md)
+- 앱 전용 백엔드 URL: `.env.capacitor` 의 `VITE_API_BASE_URL`(HTTPS 필수)

docs/plan-membership-tiers.md

@@ -0,0 +1,51 @@
+# 멤버십(무료/유료) 메뉴·기능 구분 — 설계 (추후 구현)
+
+> 상태: **설계만** (미구현). 결제·게이팅은 추후 작업.
+> 방향: **핵심 기록은 무료로 개방**(진입장벽 ↓), **과금 기능·자동화·고급 분석·무제한·백업은 유료**.
+> 계좌 개수 제한은 **두지 않음**(1~소수 제한은 핵심 기능을 막아 거부감 → 제외).
+
+---
+
+## 1. 무료 / 유료 구분
+
+| 메뉴 / 기능 | 무료 | 유료(프리미엄) | 비고 |
+|---|:--:|:--:|---|
+| **가계부 내역**(수입·지출 기록) | ✅ | ✅ | 핵심 — 무료 개방 |
+| **계좌 관리**(은행·현금·카드·대출) | ✅ **무제한** | ✅ 무제한 | 개수 제한 없음 |
+| 자주 쓰는 내역(빠른 등록) | ✅ | ✅ | 편의, 무료 |
+| 월별 요약(수입/지출/잔액) | ✅ | ✅ | 기본 요약은 무료 |
+| 분류 관리 | ✅ 기본+소수 | ✅ 무제한·소분류(2단계) | 무료는 기본 분류 위주 |
+| 태그 관리 | — | ✅ | |
+| **통계**(순자산 추이·예상 지출·지난달 대비·분류 분석) | — | ✅ | 고급 분석은 유료 |
+| 예산 설정 | — | ✅ | |
+| 고정 지출(자동 생성·확인) | — | ✅ | 자동화 = 유료 |
+| **영수증 OCR** | — | ✅ | **Google Vision 과금** → 유료 필수 |
+| **카드 결제 알림 자동인식** | — | ✅ | 강력한 유료 훅(편의·자동화) |
+| 투자/자산(평가액) 관리 | — | ✅ | |
+| 데이터 백업/복구(엑셀·JSON) | — | ✅ | 추후 백업 기능과 연계 |
+| 게시판(커뮤니티/짠테크/재테크 팁) | ✅ | ✅ | 커뮤니티는 전체 개방 |
+| 다크모드·테마 | ✅ | ✅ | 기본 제공 |
+| 광고 | (도입 시) 표시 | 제거 | 광고 모델은 미정 |
+
+## 2. 구분 기준
+- **무료** = 기본 기록 + (무제한)계좌 + 기본 분류 + 월 요약 → "충분히 써볼 만한" 수준
+- **유료** = ① 과금 기능(OCR) · ② 자동화(카드 알림 인식 · 고정지출) · ③ 고급 분석(통계 전체 · 예산) · ④ 무제한(태그/소분류) · ⑤ 백업/복구
+- 원칙: **무료를 일부러 불편하게 만들지 않고, 유료에 "확실히 편한 것"을 몰아준다**(전환율 우선).
+
+## 3. 구현 시 필요한 것 (추후)
+- **데이터**: `member.plan`(`FREE`/`PREMIUM`) + `plan_expires_at`(만료일) 컬럼.
+- **게이팅(이중)**:
+  - 프론트: 유료 메뉴에 **잠금 배지 + 업그레이드 유도**(데모의 잠금 화면 재사용 가능), 비유료는 진입 차단.
+  - 백엔드: 해당 API에 **plan 권한 체크**(프론트 우회 방지). OCR·알림 인식·통계·예산·고정지출·투자·백업 엔드포인트.
+- **결제 연동**: 안드로이드 인앱결제(Google Play Billing) / 웹·PC는 PG. 정기결제 시 만료일 갱신.
+- **기존 데이터 보호**: 유료→무료 강등(만료) 시 데이터는 보존하되 **유료 메뉴만 잠금**(읽기 정도는 허용 검토).
+
+## 4. 추후 결정 필요(미정)
+- 가격·주기(월/연), 무료체험 기간.
+- 광고 모델 도입 여부(무료=광고 / 유료=제거).
+- 무료 "기본 분류" 범위(개수·기본 템플릿만 허용 여부).
+- 강등 시 잠금 정책(완전 차단 vs 읽기 허용).
+
+---
+
+*참고: 데모(`/demo`)의 잠금 안내 화면을 유료 게이팅 UI 의 기반으로 재사용할 수 있음.*

docs/release-2026-06-06.md

@@ -156,13 +156,67 @@
 
 ---
 
+# (이어진 작업 4) 구글 로그인 · 다크모드 · UI 개편 (2026-06-28)
+
+## 34. 구글 로그인/가입 (소셜 로그인)
+- **웹/PC/앱 3플랫폼 구글 로그인**: 웹·PC(Electron)는 **Google Identity Services(GIS)** ID 토큰, 앱(안드로이드)은 **네이티브 플러그인 `@capawesome/capacitor-google-sign-in`**(Credential Manager). 모두 ID 토큰을 백엔드 `POST /api/auth/google` 로 전달 → **tokeninfo 로 검증(aud=웹 클라이언트 ID)** 후 세션 발급.
+- **PC(Electron) 팝업 수정**: `accounts.google.com` 팝업을 외부 브라우저로 보내 결과가 안 돌아오던 문제 → **앱 내부 자식 창**으로 열어 opener 로 credential 전달.
+- **같은 이메일 자동 연결**: 구글 로그인 시 `member.google_id`(신규 컬럼)로 조회, 없으면 **검증된 동일 이메일의 기존 계정에 연결**(provider 유지 → 아이디 로그인/프로필 편집 보존), 그래도 없으면 신규 생성.
+- 설정 필요: Google Cloud **웹 + Android OAuth 클라이언트**(패키지 `kr.sblog.slimbudget` + 서명 SHA-1), 서버 `.env` `GOOGLE_CLIENT_ID`.
+
+## 35. 구글 전용 로그인 (아이디 로그인/회원가입 숨김)
+- `src/config/features.js` `ID_LOGIN_ENABLED=false` 플래그로 **아이디/비번 폼·회원가입 UI 숨김**(로그인 모달·홈 랜딩). 백엔드 `/auth/login`·`/signup` 은 비상용으로 유지(복구 가능).
+
+## 36. 브랜딩 — 돈돼지 가계부
+- 앱/파비콘/PC 아이콘을 **돈돼지(투명 배경)** 로 교체, 헤더 로고·런처 라벨 정리. 런처 라벨 `돈돼지가계부`(한 줄), 앱 표시명 `돈돼지 가계부`.
+
+## 37. PC 설치파일 (Electron)
+- 산출물명 `SlimBudget-Setup.exe` → **`DonDwaeji-Setup.exe`**, 다운로드 URL `/download/DonDwaeji-Setup.exe`.
+- **사용자 폴더 설치**(`%LOCALAPPDATA%\Programs\DonDwaeji`, `build/installer.nsh`)로 변경 → **관리자 권한(UAC) 프롬프트 제거**. (게시자 미서명 경고/SmartScreen 은 인증서 없이는 잔존)
+
+## 38. 게시판 공지 기능 (관리자)
+- `post.notice` 컬럼(멱등 ALTER), 목록 **정렬 `notice DESC, id DESC`(공지 최상단)**, 목록·상세 **공지 배지**.
+- 공지 설정은 **글 작성/수정 시 체크박스**로 일원화(커뮤니티+관리자). 상세의 공지 토글 버튼 제거, **목록 이동 아이콘** 추가.
+
+## 39. 라이트/다크 테마
+- 설정 화면에 **시스템 / 라이트 / 다크** 선택. `base.css` 를 **`data-theme` 기반 수동 다크 + 시스템 폴백**으로 전환, `theme.js` 유틸 + ui 스토어 상태, `main.js` 시작 시 즉시 적용(깜빡임 방지).
+
+## 40. 사이드바/헤더 개편 · 레이아웃 정리
+- 사이드바 상단에 **돼지 로고 + '돈돼지 가계부'**(메뉴 텍스트 대체), 사이드바 **메뉴 아이콘**(lucide) 추가. **헤더는 현재 화면 타이틀** 표시(돼지 로고 제거).
+- **PC 레이아웃**: 그리드 `'left top'` → 사이드바가 **좌측 상단(헤더 행)까지** 차지, 헤더는 우측 콘텐츠 영역만.
+- **화면 내 페이지 타이틀(`<h1>`) 제거 → 헤더로 일원화**, **화면 내 뒤로가기 버튼 제거**(하단 내비 뒤로가기만 유지).
+- **전 화면 본문 폭 통일**: `--page-max`(760px) + `.layout-body > *` 전역 규칙(뷰별 제각각 max-width 대체).
+
+## 41. 화면별 액션 아이콘 위치 정리
+- 가계부/예산 **month-nav**: 좌 spacer + 우 액션으로 **월 변경은 가운데, 추가·검색/필터는 우측**. 고정지출: 안내문구 아래. 커뮤니티 글쓰기: 태그 필터와 같은 줄. 분류: 지출/수입 탭과 같은 줄.
+- **커뮤니티 검색 모달**: input `min-width:0` 으로 **검색 버튼이 모달 밖으로 밀리던 문제** 수정.
+
+## 42. 자주 쓰는 내역 UX 정리
+- 등록 모달의 **'자주 쓰는 내역 불러오기' 버튼·피커 모달 제거**(번거로운 3단계 해소, 저장 기능은 유지). 가계부 quick-bar 에 **'⭐ 자주 쓰는 내역' 라벨** 추가.
+- 빠른등록(`useQuick`) **등록 성공과 목록 갱신 분리** — 갱신 오류가 '등록 실패'로 오인되던 케이스 방지.
+
+## 43. 계정정보 단순화 · 구글 계정 이름 변경
+- 계정정보에서 **아이디·가입유형 행 제거**(이름/이메일/권한만). **소셜(구글) 계정도 비밀번호 재인증 없이 이름만 변경** 가능(ProfileEdit), 백엔드 `updateProfile` 그대로.
+
+## 44. PC 화면 해상도 변경
+- Electron **preload(`window.desktop`) + IPC(`window:setSize`)** 추가, 설정 화면(PC)에 **창 크기 프리셋**(1024×720 ~ 1920×1080). 선택 크기는 Electron 창 상태 저장으로 다음 실행에도 유지.
+
+## 45. 기타
+- 통계 '분류별 지출/수입'을 **대분류 기준 집계**(소분류 펼침 제거로 스크롤 단축).
+- 게시판 작성일: 1시간 이내 'N분 전' / 1일 이내 'N시간 전' / 그 이상 **`YYYY.MM.DD`**.
+- 웹 안내 페이지 한국어 줄바꿈 **절(어절) 단위**(`word-break: keep-all` + inline-block 묶음).
+
+---
+
 ## 운영 반영 시 체크
 - 서버 `/opt/sb-backend/.env`
   - `ACCOUNT_CRYPTO_KEY` — 계좌번호 암호화를 켤 때만(미설정 시 평문, 깨지지 않음).
+  - `GOOGLE_CLIENT_ID` — 구글 로그인 웹 클라이언트 ID(미설정 시 구글 버튼 미노출). **앱 구글 로그인**은 Google Cloud 에 **Android OAuth 클라이언트**(패키지 `kr.sblog.slimbudget` + 서명 SHA-1) 등록 필요.
+- `member.google_id`(계정 연결) · `post.notice`(공지) 컬럼 — 기동 시 **멱등 ALTER** 자동 적용.
 - `app_setting` · `auth_session` · `board_image` 테이블 — 배포 시 `member.sql`/`board.sql` 초기화로 자동 생성(가입 허용 / 세션 DB 백업 / 게시글 이미지).
 - Redis `appendonly yes` — 세션 영속(이미 적용). 단, 세션 DB 이중 저장으로 Redis 유실에도 로그인 유지.
 - 서버 `.env`/환경변수 `PUBLIC_URL`(기본 `https://app.sblog.kr`) — 업로드 이미지 절대 URL 베이스(앱에서 이미지 로드에 필요).
 - **nginx**(`deploy/nginx-sb-front.conf` 참고): `location /` 에 `Cache-Control no-cache`(진입 HTML 최신화), `location /download/` → `/var/www/sb-downloads`(설치파일, 배포에 안 지워지는 영속 경로).
 - 앱 버전 표기는 `package.json` 의 `version`(현재 `1.0.0`)을 단일 출처로 사용.
-- **PC 설치파일**: `npm run electron:build` → `release-desktop/SlimBudget-Setup.exe`(서명 없음, SmartScreen 경고 정상).
+- **PC 설치파일**: `npm run electron:build` → `release-desktop/DonDwaeji-Setup.exe`(**사용자 폴더 설치=UAC 없음**, 미서명 → SmartScreen 경고 정상). 서버는 `/var/www/sb-downloads/DonDwaeji-Setup.exe` 로 업로드.
 - 배포는 `main` 푸시 → CI·Deploy 워크플로 모두 **테스트 통과해야 진행**(Gitea Actions).

electron/main.cjs

@@ -1,15 +1,43 @@
-// Slim Budget 데스크톱(Electron) 메인 프로세스.
+// 돈돼지 가계부 데스크톱(Electron) 메인 프로세스.
 // 라이브 사이트(https://app.sblog.kr)를 직접 로드한다 → 프론트 변경이 자동 반영(재설치 불필요),
 // 같은 출처라 CORS 우회도 불필요. 배포된 웹 게이트가 Electron 을 감지해 안내페이지 대신 전체 앱을 띄운다.
-const { app, BrowserWindow, shell, session } = require('electron')
+//
+// 로딩 UX: 예전에는 시작 시 HTTP 캐시를 통째로 비워 매번 전체 자산을 재다운로드 → 흰 화면이 오래 노출됐다.
+// 이제 index.html 만 캐시버스트(?_=t)로 항상 최신을 받고, 해시된 정적 자산(JS/CSS)은 캐시를 유지해
+// 재시작이 빠르다. 로드되는 동안에는 스플래시(로딩) 창을 띄워 빈 화면을 가린다.
+// 또한 단일 인스턴스 잠금으로 중복 실행을 막아(두 번째 실행 시 사이트를 다시 로드하며 빈 화면이 보이던 문제),
+// 이미 실행 중이면 기존 창을 활성화한다.
+const { app, BrowserWindow, shell, ipcMain, Menu } = require('electron')
 const fs = require('fs')
 const path = require('path')
 
+// 기본 애플리케이션 메뉴(File/Edit/View/Window) 제거 — 메인 창뿐 아니라
+// 구글 로그인 팝업 등 자식 창에도 메뉴바가 안 붙도록 전역으로 비활성화.
+Menu.setApplicationMenu(null)
+
 // 네이티브 대화상자(alert/confirm) 제목은 app.getName() 을 쓴다 → package.json name('sb_pt') 대신 표기.
 app.setName('돈돼지 가계부')
 
 const APP_URL = 'https://app.sblog.kr'
 
+// 현재 메인 창 참조(중복 실행 시 활성화 대상).
+let mainWindow = null
+
+// 중복 실행 방지: 잠금을 못 얻으면 이미 실행 중 → 새 인스턴스를 즉시 종료한다.
+// (두 번째 실행에서 라이브 사이트를 다시 로드하느라 빈 화면이 보이던 현상 해결)
+if (!app.requestSingleInstanceLock()) {
+  app.quit()
+} else {
+  // 두 번째 실행 시도가 들어오면 기존 창을 복원/활성화.
+  app.on('second-instance', () => {
+    if (mainWindow && !mainWindow.isDestroyed()) {
+      if (mainWindow.isMinimized()) mainWindow.restore()
+      if (!mainWindow.isVisible()) mainWindow.show()
+      mainWindow.focus()
+    }
+  })
+}
+
 // 창 크기/위치를 userData 에 저장해 다음 실행 때 복원 (기본 해상도 고정 대신 사용자가 맞춘 크기 유지)
 function stateFile() {
   return path.join(app.getPath('userData'), 'window-state.json')
@@ -31,6 +59,23 @@ function saveState(win) {
   }
 }
 
+// 스플래시(로딩) 화면 — 라이브 사이트가 첫 렌더될 때까지 빈 흰 화면 대신 표시.
+function splashHtml() {
+  const html = `<!doctype html><html><head><meta charset="utf-8"><title>돈돼지 가계부</title>
+<style>html,body{height:100%;margin:0;display:flex;align-items:center;justify-content:center;
+background:#1a1a1a;color:#eee;font-family:system-ui,'Segoe UI',sans-serif;-webkit-user-select:none;user-select:none}
+.box{text-align:center}
+.pig{font-size:46px;line-height:1}
+.name{margin-top:10px;font-size:17px;font-weight:700;letter-spacing:-0.01em}
+.spin{margin:18px auto 0;width:26px;height:26px;border:3px solid rgba(255,255,255,.2);
+border-top-color:#00bc7e;border-radius:50%;animation:r .8s linear infinite}
+@keyframes r{to{transform:rotate(360deg)}}
+.tip{margin-top:12px;font-size:12px;opacity:.5}</style></head>
+<body><div class="box"><div class="pig">🐷</div><div class="name">돈돼지 가계부</div>
+<div class="spin"></div><div class="tip">불러오는 중…</div></div></body></html>`
+  return 'data:text/html;charset=utf-8,' + encodeURIComponent(html)
+}
+
 // 오프라인/로드 실패 시 안내 화면 (다시 시도 버튼)
 function offlineHtml() {
   const html = `<!doctype html><html><head><meta charset="utf-8"><title>돈돼지 가계부</title>
@@ -53,27 +98,61 @@ function createWindow() {
     y: s?.y,
     minWidth: 360,
     minHeight: 560,
+    show: false, // 첫 렌더(ready-to-show) 전까지 숨김 → 빈 흰 화면 노출 방지(스플래시가 대신 보임)
     backgroundColor: '#1a1a1a',
     title: '돈돼지 가계부',
     webPreferences: {
       contextIsolation: true,
       nodeIntegration: false,
+      preload: path.join(__dirname, 'preload.cjs'),
       // 한글 IME 첫 글자 중복 입력 방지 — Chromium 맞춤법 검사기가 조합을 방해하는 Electron 알려진 버그 회피
       spellcheck: false,
     },
   })
   if (s?.maximized) win.maximize()
+  mainWindow = win
+
+  // 로딩 스플래시(프레임 없는 작은 창) — 메인이 준비되면 닫는다.
+  const splash = new BrowserWindow({
+    width: 300,
+    height: 300,
+    frame: false,
+    resizable: false,
+    movable: false,
+    skipTaskbar: true,
+    alwaysOnTop: true,
+    backgroundColor: '#1a1a1a',
+    title: '돈돼지 가계부',
+  })
+  splash.loadURL(splashHtml())
+  splash.center()
+
+  // 메인 창을 한 번만 노출하고 스플래시를 정리(이벤트 중복/지연 대비).
+  let revealed = false
+  const reveal = () => {
+    if (revealed) return
+    revealed = true
+    if (!win.isDestroyed()) win.show()
+    if (!splash.isDestroyed()) splash.destroy()
+  }
+  win.once('ready-to-show', reveal)
+  // 안전장치: 로드가 비정상적으로 지연돼도 12초 후엔 메인 창을 띄운다.
+  setTimeout(reveal, 12000)
 
   // 기본 메뉴바 제거(앱 자체 내비게이션 사용)
   win.removeMenu()
-  win.loadURL(APP_URL)
+  // index.html 만 캐시버스트(?_=t) → 항상 최신 프론트. 해시 자산은 캐시 유지 → 빠른 재시작.
+  win.loadURL(APP_URL + '/?_=' + Date.now())
 
   // 닫을 때 창 크기/위치 저장 → 다음 실행에 복원
   win.on('close', () => saveState(win))
 
   // 메인 프레임 로드 실패(오프라인 등) 시 안내 화면. -3(aborted, 리다이렉트 등)은 무시.
   win.webContents.on('did-fail-load', (event, errorCode, errorDescription, validatedURL, isMainFrame) => {
-    if (isMainFrame && errorCode !== -3) win.loadURL(offlineHtml())
+    if (isMainFrame && errorCode !== -3) {
+      win.loadURL(offlineHtml())
+      reveal() // 오프라인 안내도 보이도록 메인 창 노출
+    }
   })
 
   // 외부(앱 외 도메인) 링크는 기본 브라우저로, 앱 내 링크는 창에서 처리
@@ -91,14 +170,22 @@ function createWindow() {
   })
 }
 
-app.whenReady().then(async () => {
-  // 시작 시 HTTP 캐시 비움 → 라이브 사이트의 최신 프론트를 항상 로드(옛 HTML 캐시로 인한 미반영 방지).
-  // localStorage(로그인 세션)는 캐시가 아니라 영향 없음.
-  try {
-    await session.defaultSession.clearCache()
-  } catch {
-    /* 캐시 클리어 실패 무시 */
-  }
+// 데스크톱 창 크기(해상도) 변경 — 렌더러(설정 화면)에서 호출
+ipcMain.handle('window:setSize', (e, w, h) => {
+  const win = BrowserWindow.fromWebContents(e.sender)
+  if (!win) return false
+  if (win.isMaximized()) win.unmaximize()
+  win.setSize(Math.max(360, Math.round(w)), Math.max(560, Math.round(h)))
+  win.center()
+  return true
+})
+ipcMain.handle('window:getSize', (e) => {
+  const win = BrowserWindow.fromWebContents(e.sender)
+  return win ? win.getSize() : [0, 0]
+})
+
+app.whenReady().then(() => {
+  // 캐시는 비우지 않는다(빠른 재시작). 최신 프론트는 index.html 캐시버스트로 보장.
   createWindow()
   app.on('activate', () => {
     if (BrowserWindow.getAllWindows().length === 0) createWindow()

electron/preload.cjs

@@ -0,0 +1,8 @@
+// 렌더러(웹)에서 안전하게 호출할 데스크톱 전용 API 노출 (contextIsolation 유지).
+const { contextBridge, ipcRenderer } = require('electron')
+
+contextBridge.exposeInMainWorld('desktop', {
+  // 데스크톱 창 크기(해상도) 변경
+  setWindowSize: (w, h) => ipcRenderer.invoke('window:setSize', w, h),
+  getWindowSize: () => ipcRenderer.invoke('window:getSize'),
+})

index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <link rel="icon" type="image/png" href="/favicon.png">
     <link rel="apple-touch-icon" href="/apple-touch-icon.png">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
     <title>돈돼지 가계부</title>
   </head>
   <body>

ios/.gitignore

@@ -0,0 +1,13 @@
+App/build
+App/Pods
+App/output
+App/App/public
+DerivedData
+xcuserdata
+
+# Cordova plugins for Capacitor
+capacitor-cordova-ios-plugins
+
+# Generated Config files
+App/App/capacitor.config.json
+App/App/config.xml

ios/App/App.xcodeproj/project.pbxproj

@@ -0,0 +1,393 @@
+// !$*UTF8*$!
+{
+	archiveVersion = 1;
+	classes = {
+	};
+	objectVersion = 60;
+	objects = {
+
+/* Begin PBXBuildFile section */
+		2FAD9763203C412B000D30F8 /* config.xml in Resources */ = {isa = PBXBuildFile; fileRef = 2FAD9762203C412B000D30F8 /* config.xml */; };
+		4D22ABE92AF431CB00220026 /* CapApp-SPM in Frameworks */ = {isa = PBXBuildFile; productRef = 4D22ABE82AF431CB00220026 /* CapApp-SPM */; };
+		50379B232058CBB4000EE86E /* capacitor.config.json in Resources */ = {isa = PBXBuildFile; fileRef = 50379B222058CBB4000EE86E /* capacitor.config.json */; };
+		504EC3081FED79650016851F /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 504EC3071FED79650016851F /* AppDelegate.swift */; };
+		504EC30D1FED79650016851F /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 504EC30B1FED79650016851F /* Main.storyboard */; };
+		504EC30F1FED79650016851F /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 504EC30E1FED79650016851F /* Assets.xcassets */; };
+		504EC3121FED79650016851F /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 504EC3101FED79650016851F /* LaunchScreen.storyboard */; };
+		50B271D11FEDC1A000F3C39B /* public in Resources */ = {isa = PBXBuildFile; fileRef = 50B271D01FEDC1A000F3C39B /* public */; };
+/* End PBXBuildFile section */
+
+/* Begin PBXFileReference section */
+		2FAD9762203C412B000D30F8 /* config.xml */ = {isa = PBXFileReference; lastKnownFileType = text.xml; path = config.xml; sourceTree = "<group>"; };
+		327E84D03001463F00AB0467 /* App.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = App.entitlements; sourceTree = "<group>"; };
+		50379B222058CBB4000EE86E /* capacitor.config.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = capacitor.config.json; sourceTree = "<group>"; };
+		504EC3041FED79650016851F /* App.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = App.app; sourceTree = BUILT_PRODUCTS_DIR; };
+		504EC3071FED79650016851F /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
+		504EC30C1FED79650016851F /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
+		504EC30E1FED79650016851F /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
+		504EC3111FED79650016851F /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
+		504EC3131FED79650016851F /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
+		50B271D01FEDC1A000F3C39B /* public */ = {isa = PBXFileReference; lastKnownFileType = folder; path = public; sourceTree = "<group>"; };
+		958DCC722DB07C7200EA8C5F /* debug.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; name = debug.xcconfig; path = ../debug.xcconfig; sourceTree = SOURCE_ROOT; };
+/* End PBXFileReference section */
+
+/* Begin PBXFrameworksBuildPhase section */
+		504EC3011FED79650016851F /* Frameworks */ = {
+			isa = PBXFrameworksBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				4D22ABE92AF431CB00220026 /* CapApp-SPM in Frameworks */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXFrameworksBuildPhase section */
+
+/* Begin PBXGroup section */
+		504EC2FB1FED79650016851F = {
+			isa = PBXGroup;
+			children = (
+				958DCC722DB07C7200EA8C5F /* debug.xcconfig */,
+				504EC3061FED79650016851F /* App */,
+				504EC3051FED79650016851F /* Products */,
+			);
+			sourceTree = "<group>";
+		};
+		504EC3051FED79650016851F /* Products */ = {
+			isa = PBXGroup;
+			children = (
+				504EC3041FED79650016851F /* App.app */,
+			);
+			name = Products;
+			sourceTree = "<group>";
+		};
+		504EC3061FED79650016851F /* App */ = {
+			isa = PBXGroup;
+			children = (
+				327E84D03001463F00AB0467 /* App.entitlements */,
+				50379B222058CBB4000EE86E /* capacitor.config.json */,
+				504EC3071FED79650016851F /* AppDelegate.swift */,
+				504EC30B1FED79650016851F /* Main.storyboard */,
+				504EC30E1FED79650016851F /* Assets.xcassets */,
+				504EC3101FED79650016851F /* LaunchScreen.storyboard */,
+				504EC3131FED79650016851F /* Info.plist */,
+				2FAD9762203C412B000D30F8 /* config.xml */,
+				50B271D01FEDC1A000F3C39B /* public */,
+			);
+			path = App;
+			sourceTree = "<group>";
+		};
+/* End PBXGroup section */
+
+/* Begin PBXNativeTarget section */
+		504EC3031FED79650016851F /* App */ = {
+			isa = PBXNativeTarget;
+			buildConfigurationList = 504EC3161FED79650016851F /* Build configuration list for PBXNativeTarget "App" */;
+			buildPhases = (
+				504EC3001FED79650016851F /* Sources */,
+				504EC3011FED79650016851F /* Frameworks */,
+				504EC3021FED79650016851F /* Resources */,
+			);
+			buildRules = (
+			);
+			dependencies = (
+			);
+			name = App;
+			packageProductDependencies = (
+				4D22ABE82AF431CB00220026 /* CapApp-SPM */,
+			);
+			productName = App;
+			productReference = 504EC3041FED79650016851F /* App.app */;
+			productType = "com.apple.product-type.application";
+		};
+/* End PBXNativeTarget section */
+
+/* Begin PBXProject section */
+		504EC2FC1FED79650016851F /* Project object */ = {
+			isa = PBXProject;
+			attributes = {
+				BuildIndependentTargetsInParallel = YES;
+				LastSwiftUpdateCheck = 0920;
+				LastUpgradeCheck = 2660;
+				TargetAttributes = {
+					504EC3031FED79650016851F = {
+						CreatedOnToolsVersion = 9.2;
+						LastSwiftMigration = 1100;
+						ProvisioningStyle = Automatic;
+					};
+				};
+			};
+			buildConfigurationList = 504EC2FF1FED79650016851F /* Build configuration list for PBXProject "App" */;
+			compatibilityVersion = "Xcode 8.0";
+			developmentRegion = en;
+			hasScannedForEncodings = 0;
+			knownRegions = (
+				en,
+				Base,
+			);
+			mainGroup = 504EC2FB1FED79650016851F;
+			packageReferences = (
+				D4C12C0A2AAA248700AAC8A2 /* XCLocalSwiftPackageReference "CapApp-SPM" */,
+			);
+			productRefGroup = 504EC3051FED79650016851F /* Products */;
+			projectDirPath = "";
+			projectRoot = "";
+			targets = (
+				504EC3031FED79650016851F /* App */,
+			);
+		};
+/* End PBXProject section */
+
+/* Begin PBXResourcesBuildPhase section */
+		504EC3021FED79650016851F /* Resources */ = {
+			isa = PBXResourcesBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				504EC3121FED79650016851F /* LaunchScreen.storyboard in Resources */,
+				50B271D11FEDC1A000F3C39B /* public in Resources */,
+				504EC30F1FED79650016851F /* Assets.xcassets in Resources */,
+				50379B232058CBB4000EE86E /* capacitor.config.json in Resources */,
+				504EC30D1FED79650016851F /* Main.storyboard in Resources */,
+				2FAD9763203C412B000D30F8 /* config.xml in Resources */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXResourcesBuildPhase section */
+
+/* Begin PBXSourcesBuildPhase section */
+		504EC3001FED79650016851F /* Sources */ = {
+			isa = PBXSourcesBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				504EC3081FED79650016851F /* AppDelegate.swift in Sources */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXSourcesBuildPhase section */
+
+/* Begin PBXVariantGroup section */
+		504EC30B1FED79650016851F /* Main.storyboard */ = {
+			isa = PBXVariantGroup;
+			children = (
+				504EC30C1FED79650016851F /* Base */,
+			);
+			name = Main.storyboard;
+			sourceTree = "<group>";
+		};
+		504EC3101FED79650016851F /* LaunchScreen.storyboard */ = {
+			isa = PBXVariantGroup;
+			children = (
+				504EC3111FED79650016851F /* Base */,
+			);
+			name = LaunchScreen.storyboard;
+			sourceTree = "<group>";
+		};
+/* End PBXVariantGroup section */
+
+/* Begin XCBuildConfiguration section */
+		504EC3141FED79650016851F /* Debug */ = {
+			isa = XCBuildConfiguration;
+			baseConfigurationReference = 958DCC722DB07C7200EA8C5F /* debug.xcconfig */;
+			buildSettings = {
+				ALWAYS_SEARCH_USER_PATHS = NO;
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_ANALYZER_NUMBER_OBJECT_CONVERSION = YES_AGGRESSIVE;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++14";
+				CLANG_CXX_LIBRARY = "libc++";
+				CLANG_ENABLE_MODULES = YES;
+				CLANG_ENABLE_OBJC_ARC = YES;
+				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
+				CLANG_WARN_BOOL_CONVERSION = YES;
+				CLANG_WARN_COMMA = YES;
+				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
+				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
+				CLANG_WARN_DOCUMENTATION_COMMENTS = YES;
+				CLANG_WARN_EMPTY_BODY = YES;
+				CLANG_WARN_ENUM_CONVERSION = YES;
+				CLANG_WARN_INFINITE_RECURSION = YES;
+				CLANG_WARN_INT_CONVERSION = YES;
+				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
+				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
+				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
+				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
+				CLANG_WARN_STRICT_PROTOTYPES = YES;
+				CLANG_WARN_SUSPICIOUS_MOVE = YES;
+				CLANG_WARN_UNGUARDED_AVAILABILITY = YES_AGGRESSIVE;
+				CLANG_WARN_UNREACHABLE_CODE = YES;
+				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
+				CODE_SIGN_IDENTITY = "iPhone Developer";
+				COPY_PHASE_STRIP = NO;
+				DEBUG_INFORMATION_FORMAT = dwarf;
+				DEVELOPMENT_TEAM = G9PDM2C4L6;
+				ENABLE_STRICT_OBJC_MSGSEND = YES;
+				ENABLE_TESTABILITY = YES;
+				ENABLE_USER_SCRIPT_SANDBOXING = YES;
+				GCC_C_LANGUAGE_STANDARD = gnu11;
+				GCC_DYNAMIC_NO_PIC = NO;
+				GCC_NO_COMMON_BLOCKS = YES;
+				GCC_OPTIMIZATION_LEVEL = 0;
+				GCC_PREPROCESSOR_DEFINITIONS = (
+					"DEBUG=1",
+					"$(inherited)",
+				);
+				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
+				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
+				GCC_WARN_UNDECLARED_SELECTOR = YES;
+				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
+				GCC_WARN_UNUSED_FUNCTION = YES;
+				GCC_WARN_UNUSED_VARIABLE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
+				MTL_ENABLE_DEBUG_INFO = YES;
+				ONLY_ACTIVE_ARCH = YES;
+				SDKROOT = iphoneos;
+				STRING_CATALOG_GENERATE_SYMBOLS = YES;
+				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
+				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
+			};
+			name = Debug;
+		};
+		504EC3151FED79650016851F /* Release */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				ALWAYS_SEARCH_USER_PATHS = NO;
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_ANALYZER_NUMBER_OBJECT_CONVERSION = YES_AGGRESSIVE;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++14";
+				CLANG_CXX_LIBRARY = "libc++";
+				CLANG_ENABLE_MODULES = YES;
+				CLANG_ENABLE_OBJC_ARC = YES;
+				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
+				CLANG_WARN_BOOL_CONVERSION = YES;
+				CLANG_WARN_COMMA = YES;
+				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
+				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
+				CLANG_WARN_DOCUMENTATION_COMMENTS = YES;
+				CLANG_WARN_EMPTY_BODY = YES;
+				CLANG_WARN_ENUM_CONVERSION = YES;
+				CLANG_WARN_INFINITE_RECURSION = YES;
+				CLANG_WARN_INT_CONVERSION = YES;
+				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
+				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
+				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
+				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
+				CLANG_WARN_STRICT_PROTOTYPES = YES;
+				CLANG_WARN_SUSPICIOUS_MOVE = YES;
+				CLANG_WARN_UNGUARDED_AVAILABILITY = YES_AGGRESSIVE;
+				CLANG_WARN_UNREACHABLE_CODE = YES;
+				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
+				CODE_SIGN_IDENTITY = "iPhone Developer";
+				COPY_PHASE_STRIP = NO;
+				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
+				DEVELOPMENT_TEAM = G9PDM2C4L6;
+				ENABLE_NS_ASSERTIONS = NO;
+				ENABLE_STRICT_OBJC_MSGSEND = YES;
+				ENABLE_USER_SCRIPT_SANDBOXING = YES;
+				GCC_C_LANGUAGE_STANDARD = gnu11;
+				GCC_NO_COMMON_BLOCKS = YES;
+				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
+				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
+				GCC_WARN_UNDECLARED_SELECTOR = YES;
+				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
+				GCC_WARN_UNUSED_FUNCTION = YES;
+				GCC_WARN_UNUSED_VARIABLE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
+				MTL_ENABLE_DEBUG_INFO = NO;
+				SDKROOT = iphoneos;
+				STRING_CATALOG_GENERATE_SYMBOLS = YES;
+				SWIFT_COMPILATION_MODE = wholemodule;
+				SWIFT_OPTIMIZATION_LEVEL = "-O";
+				VALIDATE_PRODUCT = YES;
+			};
+			name = Release;
+		};
+		504EC3171FED79650016851F /* Debug */ = {
+			isa = XCBuildConfiguration;
+			baseConfigurationReference = 958DCC722DB07C7200EA8C5F /* debug.xcconfig */;
+			buildSettings = {
+				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CODE_SIGN_ENTITLEMENTS = App/App.entitlements;
+				CODE_SIGN_STYLE = Automatic;
+				CURRENT_PROJECT_VERSION = 1;
+				INFOPLIST_FILE = App/Info.plist;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
+				MARKETING_VERSION = 1.0;
+				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
+				PRODUCT_BUNDLE_IDENTIFIER = kr.sblog.slimbudget.app;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
+				SWIFT_VERSION = 5.0;
+				TARGETED_DEVICE_FAMILY = "1,2";
+			};
+			name = Debug;
+		};
+		504EC3181FED79650016851F /* Release */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CODE_SIGN_ENTITLEMENTS = App/App.entitlements;
+				CODE_SIGN_STYLE = Automatic;
+				CURRENT_PROJECT_VERSION = 1;
+				INFOPLIST_FILE = App/Info.plist;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
+				MARKETING_VERSION = 1.0;
+				PRODUCT_BUNDLE_IDENTIFIER = kr.sblog.slimbudget.app;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
+				SWIFT_VERSION = 5.0;
+				TARGETED_DEVICE_FAMILY = "1,2";
+			};
+			name = Release;
+		};
+/* End XCBuildConfiguration section */
+
+/* Begin XCConfigurationList section */
+		504EC2FF1FED79650016851F /* Build configuration list for PBXProject "App" */ = {
+			isa = XCConfigurationList;
+			buildConfigurations = (
+				504EC3141FED79650016851F /* Debug */,
+				504EC3151FED79650016851F /* Release */,
+			);
+			defaultConfigurationIsVisible = 0;
+			defaultConfigurationName = Release;
+		};
+		504EC3161FED79650016851F /* Build configuration list for PBXNativeTarget "App" */ = {
+			isa = XCConfigurationList;
+			buildConfigurations = (
+				504EC3171FED79650016851F /* Debug */,
+				504EC3181FED79650016851F /* Release */,
+			);
+			defaultConfigurationIsVisible = 0;
+			defaultConfigurationName = Release;
+		};
+/* End XCConfigurationList section */
+
+/* Begin XCLocalSwiftPackageReference section */
+		D4C12C0A2AAA248700AAC8A2 /* XCLocalSwiftPackageReference "CapApp-SPM" */ = {
+			isa = XCLocalSwiftPackageReference;
+			relativePath = "CapApp-SPM";
+		};
+/* End XCLocalSwiftPackageReference section */
+
+/* Begin XCSwiftPackageProductDependency section */
+		4D22ABE82AF431CB00220026 /* CapApp-SPM */ = {
+			isa = XCSwiftPackageProductDependency;
+			package = D4C12C0A2AAA248700AAC8A2 /* XCLocalSwiftPackageReference "CapApp-SPM" */;
+			productName = "CapApp-SPM";
+		};
+/* End XCSwiftPackageProductDependency section */
+	};
+	rootObject = 504EC2FC1FED79650016851F /* Project object */;
+}

ios/App/App.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

ios/App/App.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -0,0 +1,105 @@
+{
+  "originHash" : "275f5197fc45ecbed402538938c9f019518bacb33270bc32cf5549af9b2891e6",
+  "pins" : [
+    {
+      "identity" : "app-check",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/app-check.git",
+      "state" : {
+        "revision" : "bb4002485ff867768dec13bf904a2ddb050bd1b1",
+        "version" : "11.3.0"
+      }
+    },
+    {
+      "identity" : "appauth-ios",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/openid/AppAuth-iOS.git",
+      "state" : {
+        "revision" : "2781038865a80e2c425a1da12cc1327bcd56501f",
+        "version" : "1.7.6"
+      }
+    },
+    {
+      "identity" : "capacitor-swift-pm",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/ionic-team/capacitor-swift-pm.git",
+      "state" : {
+        "revision" : "2231987d85b8b0b289320b1d0947b4ae8345cde4",
+        "version" : "8.4.1"
+      }
+    },
+    {
+      "identity" : "googlesignin-ios",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/GoogleSignIn-iOS",
+      "state" : {
+        "revision" : "65fb3f1aa6ffbfdc79c4e22178a55cd91561f5e9",
+        "version" : "8.0.0"
+      }
+    },
+    {
+      "identity" : "googleutilities",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/GoogleUtilities.git",
+      "state" : {
+        "revision" : "9f183ae842be978784f2963a343682e0c46d8fb3",
+        "version" : "8.1.2"
+      }
+    },
+    {
+      "identity" : "gtm-session-fetcher",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/gtm-session-fetcher.git",
+      "state" : {
+        "revision" : "a2ab612cb980066ee56d90d60d8462992c07f24b",
+        "version" : "3.5.0"
+      }
+    },
+    {
+      "identity" : "gtmappauth",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/GTMAppAuth.git",
+      "state" : {
+        "revision" : "5d7d66f647400952b1758b230e019b07c0b4b22a",
+        "version" : "4.1.1"
+      }
+    },
+    {
+      "identity" : "interop-ios-for-google-sdks",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/interop-ios-for-google-sdks.git",
+      "state" : {
+        "revision" : "040d087ac2267d2ddd4cca36c757d1c6a05fdbfe",
+        "version" : "101.0.0"
+      }
+    },
+    {
+      "identity" : "ion-ios-camera",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/ionic-team/ion-ios-camera.git",
+      "state" : {
+        "revision" : "2cd4f06b0ece21b6458e23357280c51f94bfceb8",
+        "version" : "1.0.4"
+      }
+    },
+    {
+      "identity" : "ion-ios-filesystem",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/ionic-team/ion-ios-filesystem.git",
+      "state" : {
+        "revision" : "0d81e26e828ff9582807e2339112cedf2e0fab85",
+        "version" : "1.1.2"
+      }
+    },
+    {
+      "identity" : "promises",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/google/promises.git",
+      "state" : {
+        "revision" : "f4a19a3c313dc2616c70bb49d29a799fb16be837",
+        "version" : "2.4.1"
+      }
+    }
+  ],
+  "version" : 3
+}

ios/App/App/App.entitlements

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>aps-environment</key>
+	<string>development</string>
+	<key>com.apple.developer.applesignin</key>
+	<array>
+		<string>Default</string>
+	</array>
+</dict>
+</plist>

ios/App/App/AppDelegate.swift

@@ -0,0 +1,49 @@
+import UIKit
+import Capacitor
+
+@UIApplicationMain
+class AppDelegate: UIResponder, UIApplicationDelegate {
+
+    var window: UIWindow?
+
+    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
+        // Override point for customization after application launch.
+        return true
+    }
+
+    func applicationWillResignActive(_ application: UIApplication) {
+        // Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state.
+        // Use this method to pause ongoing tasks, disable timers, and invalidate graphics rendering callbacks. Games should use this method to pause the game.
+    }
+
+    func applicationDidEnterBackground(_ application: UIApplication) {
+        // Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later.
+        // If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits.
+    }
+
+    func applicationWillEnterForeground(_ application: UIApplication) {
+        // Called as part of the transition from the background to the active state; here you can undo many of the changes made on entering the background.
+    }
+
+    func applicationDidBecomeActive(_ application: UIApplication) {
+        // Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface.
+    }
+
+    func applicationWillTerminate(_ application: UIApplication) {
+        // Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:.
+    }
+
+    func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
+        // Called when the app was launched with a url. Feel free to add additional processing here,
+        // but if you want the App API to support tracking app url opens, make sure to keep this call
+        return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
+    }
+
+    func application(_ application: UIApplication, continue userActivity: NSUserActivity, restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void) -> Bool {
+        // Called when the app was launched with an activity, including Universal Links.
+        // Feel free to add additional processing here, but if you want the App API to support
+        // tracking app url opens, make sure to keep this call
+        return ApplicationDelegateProxy.shared.application(application, continue: userActivity, restorationHandler: restorationHandler)
+    }
+
+}

ios/App/App/Assets.xcassets/AppIcon.appiconset/Contents.json

@@ -0,0 +1,14 @@
+{
+  "images": [
+    {
+      "idiom": "universal",
+      "size": "1024x1024",
+      "filename": "AppIcon-512@2x.png",
+      "platform": "ios"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  }
+}

ios/App/App/Assets.xcassets/Contents.json

@@ -0,0 +1,6 @@
+{
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

ios/App/App/Assets.xcassets/Splash.imageset/Contents.json

@@ -0,0 +1,23 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "splash-2732x2732-2.png",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "filename" : "splash-2732x2732-1.png",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "filename" : "splash-2732x2732.png",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

ios/App/App/Base.lproj/LaunchScreen.storyboard

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="17132" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+    <device id="retina4_7" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17105"/>
+        <capability name="System colors in document resources" minToolsVersion="11.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <scenes>
+        <!--View Controller-->
+        <scene sceneID="EHf-IW-A2E">
+            <objects>
+                <viewController id="01J-lp-oVM" sceneMemberID="viewController">
+                    <imageView key="view" userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="Splash" id="snD-IY-ifK">
+                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                        <autoresizingMask key="autoresizingMask"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                    </imageView>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="53" y="375"/>
+        </scene>
+    </scenes>
+    <resources>
+        <image name="Splash" width="1366" height="1366"/>
+        <systemColor name="systemBackgroundColor">
+            <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+        </systemColor>
+    </resources>
+</document>

ios/App/App/Base.lproj/Main.storyboard

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="14111" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES" initialViewController="BYZ-38-t0r">
+    <device id="retina4_7" orientation="portrait">
+        <adaptation id="fullscreen"/>
+    </device>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14088"/>
+    </dependencies>
+    <scenes>
+        <!--Bridge View Controller-->
+        <scene sceneID="tne-QT-ifu">
+            <objects>
+                <viewController id="BYZ-38-t0r" customClass="CAPBridgeViewController" customModule="Capacitor" sceneMemberID="viewController"/>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="dkx-z0-nzr" sceneMemberID="firstResponder"/>
+            </objects>
+        </scene>
+    </scenes>
+</document>

ios/App/App/Info.plist

@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>ITSAppUsesNonExemptEncryption</key>
+	<false/>
+    <key>CAPACITOR_DEBUG</key>
+	<string>$(CAPACITOR_DEBUG)</string>
+	<key>NSCameraUsageDescription</key>
+	<string>영수증·프로필·게시판 사진을 촬영할 때 카메라를 사용합니다.</string>
+	<key>NSPhotoLibraryUsageDescription</key>
+	<string>영수증·프로필·게시판 사진을 첨부할 때 사진 보관함에서 이미지를 불러옵니다.</string>
+	<key>NSPhotoLibraryAddUsageDescription</key>
+	<string>촬영한 사진을 사진 보관함에 저장할 때 사용합니다.</string>
+	<key>GIDClientID</key>
+	<string>127753308411-9617kn17bjfjmenbscfgvobjgc0l8vne.apps.googleusercontent.com</string>
+	<key>CFBundleURLTypes</key>
+	<array>
+		<dict>
+			<key>CFBundleURLSchemes</key>
+			<array>
+				<string>com.googleusercontent.apps.127753308411-9617kn17bjfjmenbscfgvobjgc0l8vne</string>
+			</array>
+		</dict>
+	</array>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>en</string>
+	<key>CFBundleDisplayName</key>
+        <string>돈돼지 가계부</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>$(PRODUCT_NAME)</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>$(MARKETING_VERSION)</string>
+	<key>CFBundleVersion</key>
+	<string>$(CURRENT_PROJECT_VERSION)</string>
+	<key>LSRequiresIPhoneOS</key>
+	<true/>
+	<key>UILaunchStoryboardName</key>
+	<string>LaunchScreen</string>
+	<key>UIMainStoryboardFile</key>
+	<string>Main</string>
+	<key>UIRequiredDeviceCapabilities</key>
+	<array>
+		<string>armv7</string>
+	</array>
+	<key>UISupportedInterfaceOrientations</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UISupportedInterfaceOrientations~ipad</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationPortraitUpsideDown</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UIViewControllerBasedStatusBarAppearance</key>
+	<true/>
+</dict>
+</plist>

ios/App/CapApp-SPM/.gitignore

@@ -0,0 +1,9 @@
+.DS_Store
+/.build
+/Packages
+/*.xcodeproj
+xcuserdata/
+DerivedData/
+.swiftpm/config/registries.json
+.swiftpm/xcode/package.xcworkspace/contents.xcworkspacedata
+.netrc

ios/App/CapApp-SPM/Package.swift

@@ -0,0 +1,41 @@
+// swift-tools-version: 5.9
+import PackageDescription
+
+// DO NOT MODIFY THIS FILE - managed by Capacitor CLI commands
+let package = Package(
+    name: "CapApp-SPM",
+    platforms: [.iOS(.v15)],
+    products: [
+        .library(
+            name: "CapApp-SPM",
+            targets: ["CapApp-SPM"])
+    ],
+    dependencies: [
+        .package(url: "https://github.com/ionic-team/capacitor-swift-pm.git", exact: "8.4.1"),
+        .package(name: "CapacitorCommunityAppleSignIn", path: "../../../node_modules/@capacitor-community/apple-sign-in"),
+        .package(name: "CapacitorApp", path: "../../../node_modules/@capacitor/app"),
+        .package(name: "CapacitorCamera", path: "../../../node_modules/@capacitor/camera"),
+        .package(name: "CapacitorFilesystem", path: "../../../node_modules/@capacitor/filesystem"),
+        .package(name: "CapacitorLocalNotifications", path: "../../../node_modules/@capacitor/local-notifications"),
+        .package(name: "CapacitorPreferences", path: "../../../node_modules/@capacitor/preferences"),
+        .package(name: "CapacitorShare", path: "../../../node_modules/@capacitor/share"),
+        .package(name: "CapawesomeCapacitorGoogleSignIn", path: "../../../node_modules/@capawesome/capacitor-google-sign-in")
+    ],
+    targets: [
+        .target(
+            name: "CapApp-SPM",
+            dependencies: [
+                .product(name: "Capacitor", package: "capacitor-swift-pm"),
+                .product(name: "Cordova", package: "capacitor-swift-pm"),
+                .product(name: "CapacitorCommunityAppleSignIn", package: "CapacitorCommunityAppleSignIn"),
+                .product(name: "CapacitorApp", package: "CapacitorApp"),
+                .product(name: "CapacitorCamera", package: "CapacitorCamera"),
+                .product(name: "CapacitorFilesystem", package: "CapacitorFilesystem"),
+                .product(name: "CapacitorLocalNotifications", package: "CapacitorLocalNotifications"),
+                .product(name: "CapacitorPreferences", package: "CapacitorPreferences"),
+                .product(name: "CapacitorShare", package: "CapacitorShare"),
+                .product(name: "CapawesomeCapacitorGoogleSignIn", package: "CapawesomeCapacitorGoogleSignIn")
+            ]
+        )
+    ]
+)

ios/App/CapApp-SPM/README.md

@@ -0,0 +1,5 @@
+# CapApp-SPM
+
+This package is used to host SPM dependencies for your Capacitor project
+
+Do not modify the contents of it or there may be unintended consequences.

ios/App/CapApp-SPM/Sources/CapApp-SPM/CapApp-SPM.swift

@@ -0,0 +1 @@
+public let isCapacitorApp = true

ios/debug.xcconfig

@@ -0,0 +1 @@
+CAPACITOR_DEBUG = true

package-lock.json

@@ -8,12 +8,17 @@
       "name": "sb_pt",
       "version": "1.0.0",
       "dependencies": {
+        "@capacitor-community/apple-sign-in": "^7.1.0",
         "@capacitor/android": "^8.3.4",
         "@capacitor/app": "^8.1.0",
         "@capacitor/camera": "^8.2.0",
         "@capacitor/cli": "^8.3.4",
         "@capacitor/core": "^8.3.4",
+        "@capacitor/filesystem": "^8.1.2",
+        "@capacitor/ios": "^8.4.1",
+        "@capacitor/local-notifications": "^8.2.0",
         "@capacitor/preferences": "^8.0.1",
+        "@capacitor/share": "^8.0.1",
         "@capawesome/capacitor-google-sign-in": "^0.1.2",
         "@toast-ui/editor": "^3.2.2",
         "@toast-ui/editor-plugin-code-syntax-highlight": "^3.1.0",
@@ -22,7 +27,8 @@
         "prismjs": "^1.30.0",
         "sortablejs": "^1.15.7",
         "vue": "^3.5.32",
-        "vue-router": "^5.0.4"
+        "vue-router": "^5.0.4",
+        "xlsx": "^0.18.5"
       },
       "devDependencies": {
         "@capacitor/assets": "^3.0.5",
@@ -39,6 +45,7 @@
         "jsdom": "^29.1.1",
         "npm-run-all2": "^8.0.4",
         "oxlint": "~1.60.0",
+        "patch-package": "^8.0.1",
         "vite": "^8.0.8",
         "vite-plugin-vue-devtools": "^8.1.1",
         "vitest": "^4.1.8"
@@ -596,6 +603,19 @@
         "specificity": "bin/cli.js"
       }
     },
+    "node_modules/@capacitor-community/apple-sign-in": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/@capacitor-community/apple-sign-in/-/apple-sign-in-7.1.0.tgz",
+      "integrity": "sha512-df7cA7vfvvvilTtpJKeVvxO31W+py5t3HK9233GBD5MvgAgtGvCqeQ3pI0noNkVsKPF9B1g/po8Mph6s4bVSmw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/scriptjs": "0.0.2",
+        "scriptjs": "^2.5.9"
+      },
+      "peerDependencies": {
+        "@capacitor/core": ">=7.0.0"
+      }
+    },
     "node_modules/@capacitor/android": {
       "version": "8.3.4",
       "resolved": "https://registry.npmjs.org/@capacitor/android/-/android-8.3.4.tgz",
@@ -1179,14 +1199,44 @@
       }
     },
     "node_modules/@capacitor/core": {
-      "version": "8.3.4",
-      "resolved": "https://registry.npmjs.org/@capacitor/core/-/core-8.3.4.tgz",
-      "integrity": "sha512-CqRQCkb6HXxcx/N7s+hHTN6ef2CmamFiRMITwm4qB840ph56mS42bzUgn6tKCP+RZjdDweiRHj9ytDDeN6jFag==",
+      "version": "8.4.1",
+      "resolved": "https://registry.npmjs.org/@capacitor/core/-/core-8.4.1.tgz",
+      "integrity": "sha512-xqhOGLbTAYeOWK+IDUNSjQJAPapQjRHrIcgk9PYp52or9zFTaaMko31uNi16N6W+CRJ8VrRram6fOYILkBG2Hg==",
       "license": "MIT",
       "dependencies": {
         "tslib": "^2.1.0"
       }
     },
+    "node_modules/@capacitor/filesystem": {
+      "version": "8.1.2",
+      "resolved": "https://registry.npmjs.org/@capacitor/filesystem/-/filesystem-8.1.2.tgz",
+      "integrity": "sha512-doaaMfGoFR2hWU6aV6u83I+5ZsGyJVq+Gz4r9lMpJzUKMm1eMu0hLnFdV1aXZlU9FlK/RndFrVD8oRZfNOqWgQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@capacitor/synapse": "^1.0.4"
+      },
+      "peerDependencies": {
+        "@capacitor/core": ">=8.0.0"
+      }
+    },
+    "node_modules/@capacitor/ios": {
+      "version": "8.4.1",
+      "resolved": "https://registry.npmjs.org/@capacitor/ios/-/ios-8.4.1.tgz",
+      "integrity": "sha512-EgcAk7NYheHMTyP3CUrA65qKs4D2UEAKgw44HI6Uk3dTw6KjLQkdLOQWvbeRncHaZ2gklfOojUoc5DlSw2lhYg==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": "^8.4.0"
+      }
+    },
+    "node_modules/@capacitor/local-notifications": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/@capacitor/local-notifications/-/local-notifications-8.2.0.tgz",
+      "integrity": "sha512-fvLY0w2w4MiX+DD4+Wv4DOwOLdzKZsMDwAcRv/Juudd+QbKbn69s6cM3xVqPwAiDqfnqsY4/S8xtQD6M73wY2A==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": ">=8.0.0"
+      }
+    },
     "node_modules/@capacitor/preferences": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/@capacitor/preferences/-/preferences-8.0.1.tgz",
@@ -1196,6 +1246,21 @@
         "@capacitor/core": ">=8.0.0"
       }
     },
+    "node_modules/@capacitor/share": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/@capacitor/share/-/share-8.0.1.tgz",
+      "integrity": "sha512-3cSBKBCJVon54rKDROP2rqGyeGks4pBh9TbaEk9S375Kbek/ZHe72N50zIa0Vn9Eac/SuhwgehO/mmA4CsUOiw==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": ">=8.0.0"
+      }
+    },
+    "node_modules/@capacitor/synapse": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@capacitor/synapse/-/synapse-1.0.4.tgz",
+      "integrity": "sha512-/C1FUo8/OkKuAT4nCIu/34ny9siNHr9qtFezu4kxm6GY1wNFxrCFWjfYx5C1tUhVGz3fxBABegupkpjXvjCHrw==",
+      "license": "ISC"
+    },
     "node_modules/@capawesome/capacitor-google-sign-in": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/@capawesome/capacitor-google-sign-in/-/capacitor-google-sign-in-0.1.2.tgz",
@@ -3512,6 +3577,12 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/scriptjs": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/@types/scriptjs/-/scriptjs-0.0.2.tgz",
+      "integrity": "sha512-GFrUgzGYfNX3VWZwMyzr0JrBwzLv5Kes4BQBvo6hXdRy14/GBbpCiVwwB7v1o2xIEvFf+9GyznmYhuesQQjSag==",
+      "license": "MIT"
+    },
     "node_modules/@types/slice-ansi": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/@types/slice-ansi/-/slice-ansi-4.0.0.tgz",
@@ -3963,6 +4034,13 @@
         "node": ">=14.6"
       }
     },
+    "node_modules/@yarnpkg/lockfile": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz",
+      "integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ==",
+      "dev": true,
+      "license": "BSD-2-Clause"
+    },
     "node_modules/abbrev": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-2.0.0.tgz",
@@ -4015,6 +4093,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/adler-32": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz",
+      "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/agent-base": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
@@ -4729,6 +4816,19 @@
         "node": "18 || 20 || >=22"
       }
     },
+    "node_modules/braces": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fill-range": "^7.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/browserslist": {
       "version": "4.28.2",
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz",
@@ -5120,6 +5220,25 @@
         "node": ">=8"
       }
     },
+    "node_modules/call-bind": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.9.tgz",
+      "integrity": "sha512-a/hy+pNsFUTR+Iz8TCJvXudKVLAnz/DyeSUo10I5yvFDQJBFU2s9uqQpoSrJlroHUKoKqzg+epxyP9lqFdzfBQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "get-intrinsic": "^1.3.0",
+        "set-function-length": "^1.2.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/call-bind-apply-helpers": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
@@ -5133,6 +5252,23 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/call-bound": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "get-intrinsic": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/camelcase": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
@@ -5182,6 +5318,19 @@
       ],
       "license": "CC-BY-4.0"
     },
+    "node_modules/cfb": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
+      "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "adler-32": "~1.3.0",
+        "crc-32": "~1.2.0"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/chai": {
       "version": "6.2.2",
       "resolved": "https://registry.npmjs.org/chai/-/chai-6.2.2.tgz",
@@ -5378,6 +5527,15 @@
         "node": ">=4"
       }
     },
+    "node_modules/codepage": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
+      "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/color": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
@@ -5782,6 +5940,18 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/crc-32": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
+      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==",
+      "license": "Apache-2.0",
+      "bin": {
+        "crc32": "bin/crc32.njs"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/create-require": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
@@ -6091,7 +6261,6 @@
       "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
       "dev": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "es-define-property": "^1.0.0",
         "es-errors": "^1.3.0",
@@ -7375,6 +7544,19 @@
         "node": ">=10"
       }
     },
+    "node_modules/fill-range": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/find-up": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
@@ -7392,6 +7574,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/find-yarn-workspace-root": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz",
+      "integrity": "sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "micromatch": "^4.0.2"
+      }
+    },
     "node_modules/flat-cache": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
@@ -7479,6 +7671,15 @@
         "node": ">= 6"
       }
     },
+    "node_modules/frac": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
+      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/fs-constants": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
@@ -8012,7 +8213,6 @@
       "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
       "dev": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "es-define-property": "^1.0.0"
       },
@@ -8407,6 +8607,16 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
     "node_modules/is-obj": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-2.0.0.tgz",
@@ -8813,6 +9023,26 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/json-stable-stringify": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.3.0.tgz",
+      "integrity": "sha512-qtYiSSFlwot9XHtF9bD9c7rwKjr+RecWT//ZnPvSmEjpV5mmPOCN4j8UjY5hbjNkOwZ/jQv3J6R1/pL7RwgMsg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "isarray": "^2.0.5",
+        "jsonify": "^0.0.1",
+        "object-keys": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/json-stable-stringify-without-jsonify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
@@ -8820,6 +9050,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/json-stable-stringify/node_modules/isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/json-stringify-safe": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
@@ -8858,6 +9095,16 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "node_modules/jsonify": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.1.tgz",
+      "integrity": "sha512-2/Ki0GcmuqSrgFyelQq9M05y7PS0mEwuIzrf3f1fPqkVDVRvZrPZtVSMHxdgo8Aq0sxAOb/cr2aqqA3LeWHVPg==",
+      "dev": true,
+      "license": "Public Domain",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/jsonparse": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/jsonparse/-/jsonparse-1.3.1.tgz",
@@ -8905,6 +9152,16 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/klaw-sync": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz",
+      "integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.1.11"
+      }
+    },
     "node_modules/kleur": {
       "version": "4.1.5",
       "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
@@ -9670,6 +9927,33 @@
         "semver": "bin/semver"
       }
     },
+    "node_modules/micromatch": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "braces": "^3.0.3",
+        "picomatch": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=8.6"
+      }
+    },
+    "node_modules/micromatch/node_modules/picomatch": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/mime": {
       "version": "2.6.0",
       "resolved": "https://registry.npmjs.org/mime/-/mime-2.6.0.tgz",
@@ -10397,7 +10681,6 @@
       "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
       "dev": true,
       "license": "MIT",
-      "optional": true,
       "engines": {
         "node": ">= 0.4"
       }
@@ -10727,6 +11010,169 @@
         "url": "https://github.com/fb55/entities?sponsor=1"
       }
     },
+    "node_modules/patch-package": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/patch-package/-/patch-package-8.0.1.tgz",
+      "integrity": "sha512-VsKRIA8f5uqHQ7NGhwIna6Bx6D9s/1iXlA1hthBVBEbkq+t4kXD0HHt+rJhf/Z+Ci0F/HCB2hvn0qLdLG+Qxlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@yarnpkg/lockfile": "^1.1.0",
+        "chalk": "^4.1.2",
+        "ci-info": "^3.7.0",
+        "cross-spawn": "^7.0.3",
+        "find-yarn-workspace-root": "^2.0.0",
+        "fs-extra": "^10.0.0",
+        "json-stable-stringify": "^1.0.2",
+        "klaw-sync": "^6.0.0",
+        "minimist": "^1.2.6",
+        "open": "^7.4.2",
+        "semver": "^7.5.3",
+        "slash": "^2.0.0",
+        "tmp": "^0.2.4",
+        "yaml": "^2.2.2"
+      },
+      "bin": {
+        "patch-package": "index.js"
+      },
+      "engines": {
+        "node": ">=14",
+        "npm": ">5"
+      }
+    },
+    "node_modules/patch-package/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/patch-package/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/patch-package/node_modules/ci-info": {
+      "version": "3.9.0",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-3.9.0.tgz",
+      "integrity": "sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/sibiraj-s"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/patch-package/node_modules/fs-extra": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz",
+      "integrity": "sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/patch-package/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/patch-package/node_modules/is-docker": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "is-docker": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/patch-package/node_modules/is-wsl": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-docker": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/patch-package/node_modules/open": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-docker": "^2.0.0",
+        "is-wsl": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/patch-package/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -12088,6 +12534,12 @@
         "node": ">=v12.22.7"
       }
     },
+    "node_modules/scriptjs": {
+      "version": "2.5.9",
+      "resolved": "https://registry.npmjs.org/scriptjs/-/scriptjs-2.5.9.tgz",
+      "integrity": "sha512-qGVDoreyYiP1pkQnbnFAUIS5AjenNwwQBdl7zeos9etl+hYKWahjRTfzAZZYBv5xNHx7vNKCmaLDQZ6Fr2AEXg==",
+      "license": "MIT"
+    },
     "node_modules/scule": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/scule/-/scule-1.3.0.tgz",
@@ -12152,6 +12604,24 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/set-function-length": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
+      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.4",
+        "gopd": "^1.0.1",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/sharp": {
       "version": "0.32.6",
       "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.32.6.tgz",
@@ -12346,6 +12816,16 @@
       "integrity": "sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==",
       "license": "MIT"
     },
+    "node_modules/slash": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
+      "integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/slice-ansi": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz",
@@ -12540,6 +13020,18 @@
       "license": "BSD-3-Clause",
       "optional": true
     },
+    "node_modules/ssf": {
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
+      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "frac": "~1.1.2"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/ssri": {
       "version": "12.0.0",
       "resolved": "https://registry.npmjs.org/ssri/-/ssri-12.0.0.tgz",
@@ -13126,6 +13618,19 @@
         "tmp": "^0.2.0"
       }
     },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    },
     "node_modules/totalist": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.1.tgz",
@@ -14175,6 +14680,24 @@
         "node": ">=8"
       }
     },
+    "node_modules/wmf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
+      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
+    "node_modules/word": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
+      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/word-wrap": {
       "version": "1.2.5",
       "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
@@ -14297,6 +14820,27 @@
         "node": ">=10.0.0"
       }
     },
+    "node_modules/xlsx": {
+      "version": "0.18.5",
+      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.18.5.tgz",
+      "integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "adler-32": "~1.3.0",
+        "cfb": "~1.2.1",
+        "codepage": "~1.15.0",
+        "crc-32": "~1.2.1",
+        "ssf": "~0.11.2",
+        "wmf": "~1.0.1",
+        "word": "~0.3.0"
+      },
+      "bin": {
+        "xlsx": "bin/xlsx.njs"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/xml-js": {
       "version": "1.6.11",
       "resolved": "https://registry.npmjs.org/xml-js/-/xml-js-1.6.11.tgz",

package.json

@@ -5,6 +5,7 @@
   "type": "module",
   "main": "electron/main.cjs",
   "scripts": {
+    "postinstall": "patch-package",
     "dev": "vite",
     "build": "vite build",
     "build:app": "vite build --mode capacitor",
@@ -31,21 +32,27 @@
     "win": {
       "target": "nsis",
       "icon": "build/icon.ico",
-      "artifactName": "SlimBudget-Setup.${ext}"
+      "artifactName": "DonDwaeji-Setup.${ext}"
     },
     "nsis": {
       "oneClick": false,
       "perMachine": false,
-      "allowToChangeInstallationDirectory": true
+      "allowToChangeInstallationDirectory": true,
+      "include": "build/installer.nsh"
     }
   },
   "dependencies": {
+    "@capacitor-community/apple-sign-in": "^7.1.0",
     "@capacitor/android": "^8.3.4",
     "@capacitor/app": "^8.1.0",
     "@capacitor/camera": "^8.2.0",
     "@capacitor/cli": "^8.3.4",
     "@capacitor/core": "^8.3.4",
+    "@capacitor/filesystem": "^8.1.2",
+    "@capacitor/ios": "^8.4.1",
+    "@capacitor/local-notifications": "^8.2.0",
     "@capacitor/preferences": "^8.0.1",
+    "@capacitor/share": "^8.0.1",
     "@capawesome/capacitor-google-sign-in": "^0.1.2",
     "@toast-ui/editor": "^3.2.2",
     "@toast-ui/editor-plugin-code-syntax-highlight": "^3.1.0",
@@ -54,7 +61,8 @@
     "prismjs": "^1.30.0",
     "sortablejs": "^1.15.7",
     "vue": "^3.5.32",
-    "vue-router": "^5.0.4"
+    "vue-router": "^5.0.4",
+    "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@capacitor/assets": "^3.0.5",
@@ -71,6 +79,7 @@
     "jsdom": "^29.1.1",
     "npm-run-all2": "^8.0.4",
     "oxlint": "~1.60.0",
+    "patch-package": "^8.0.1",
     "vite": "^8.0.8",
     "vite-plugin-vue-devtools": "^8.1.1",
     "vitest": "^4.1.8"

patches/@capacitor-community+apple-sign-in+7.1.0.patch

@@ -0,0 +1,13 @@
+diff --git a/node_modules/@capacitor-community/apple-sign-in/Package.swift b/node_modules/@capacitor-community/apple-sign-in/Package.swift
+index 94246df..7d9d007 100644
+--- a/node_modules/@capacitor-community/apple-sign-in/Package.swift
++++ b/node_modules/@capacitor-community/apple-sign-in/Package.swift
+@@ -10,7 +10,7 @@ let package = Package(
+             targets: ["SignInWithApple"])
+     ],
+     dependencies: [
+-        .package(url: "https://github.com/ionic-team/capacitor-swift-pm.git", from: "7.0.0")
++        .package(url: "https://github.com/ionic-team/capacitor-swift-pm.git", from: "8.0.0")
+     ],
+     targets: [
+         .target(

src/App.vue

@@ -1,20 +1,40 @@
 <script setup>
-import { onMounted, onUnmounted, watch } from 'vue'
-import { RouterView, useRoute } from 'vue-router'
+import { computed, onErrorCaptured, onMounted, onUnmounted, ref, watch } from 'vue'
+import { RouterView, useRoute, useRouter } from 'vue-router'
 import AppHeader from '@/components/layout/AppHeader.vue'
 import AppSidebar from '@/components/layout/AppSidebar.vue'
 import AppBottomNav from '@/components/layout/AppBottomNav.vue'
+import AdBanner from '@/components/AdBanner.vue'
 import LoginModal from '@/components/LoginModal.vue'
 import SignupModal from '@/components/SignupModal.vue'
 import WebOnlyNotice from '@/components/WebOnlyNotice.vue'
 import AppDialog from '@/components/ui/AppDialog.vue'
+import AppLockScreen from '@/components/AppLockScreen.vue'
+import { appLock } from '@/composables/appLock'
+import { appError, reportFatal } from '@/composables/appError'
 import { Capacitor } from '@capacitor/core'
+import { reminders } from '@/native/reminders'
 import { useAuthStore } from '@/stores/auth'
 import { useUiStore } from '@/stores/ui'
+import { demo, exitDemo } from '@/demo'
+import { ADS_ENABLED } from '@/config/features'
 
 const auth = useAuthStore()
 const ui = useUiStore()
 const route = useRoute()
+const router = useRouter()
+
+// 로그인 또는 둘러보기(데모) 상태면 사이드바/전체 셸 표시
+const authed = computed(() => auth.isAuthenticated || demo.on)
+// 광고: 광고 기능이 켜져 있고 유료(PREMIUM) 회원이 아닐 때만 표시 (레이아웃 하단 여백도 함께 제어)
+const showAds = computed(() => ADS_ENABLED && !auth.isPremium)
+// 공개 법적 고지(개인정보처리방침·약관)는 웹 브라우저에서도 접근 허용 (앱 마켓 정책 URL)
+const isPublicLegal = computed(() => !!route.meta.public)
+
+function leaveDemo() {
+  exitDemo()
+  router.push('/')
+}
 
 // 앱(Capacitor 네이티브) 또는 데스크톱(Electron) 클라이언트에서 전체 이용.
 // 웹(브라우저)은 안내 페이지만 노출. 개발 모드(npm run dev)는 예외로 전체 앱 표시.
@@ -26,54 +46,194 @@ function onUnauthorized() {
   auth.clear()
   ui.openLogin()
 }
+// http.js 의 403 PREMIUM_REQUIRED 처리 → 업그레이드 안내 화면으로
+function onPremiumRequired() {
+  if (route.name !== 'upgrade') router.push({ name: 'upgrade' })
+}
+
+// ===== 네트워크 상태 배너 =====
+// 오프라인이거나(서버 연결 끊김) 서버 응답이 없을 때 상단에 안내 배너를 띄운다.
+const online = ref(typeof navigator !== 'undefined' ? navigator.onLine : true)
+const netTrouble = ref(false) // 온라인인데 서버 응답이 없는 경우(타임아웃/서버다운) 잠깐 표시
+let netTimer = null
+function onOnline() { online.value = true }
+function onOffline() { online.value = false }
+function onNetError() {
+  if (typeof navigator !== 'undefined' && !navigator.onLine) { online.value = false; return }
+  netTrouble.value = true
+  clearTimeout(netTimer)
+  netTimer = setTimeout(() => { netTrouble.value = false }, 5000)
+}
+const showNetBanner = computed(() => !online.value || netTrouble.value)
+const netBannerText = computed(() =>
+  !online.value
+    ? '📡 인터넷 연결이 끊겼어요. 연결 상태를 확인해 주세요.'
+    : '⚠️ 서버에 연결할 수 없어요. 잠시 후 다시 시도해 주세요.',
+)
+function retryReload() {
+  window.location.reload()
+}
+
+// ===== 앱 잠금(PIN) =====
+// 잠깐 다른 앱 다녀온 정도로는 잠그지 않고, 일정 시간 이상 백그라운드였을 때만 잠근다.
+// (완전 종료/재시작은 onMounted 에서 잠금) — 카메라/갤러리/공유 등 인앱 동작은 suppress 로 제외.
+const LOCK_GRACE_MS = 60 * 60 * 1000 // 1시간 미만 이탈은 잠그지 않음(잦은 PIN 입력 방지)
+let backgroundedAt = 0
+function onVisibility() {
+  if (document.hidden) {
+    backgroundedAt = Date.now()
+  } else {
+    const away = backgroundedAt ? Date.now() - backgroundedAt : 0
+    backgroundedAt = 0
+    if (away >= LOCK_GRACE_MS) appLock.lock() // lock() 은 suppress 창이면 건너뜀
+    appLock.clearSuppress() // 복귀 — 일시중지 창 해제
+  }
+}
+// 파일 선택(input[type=file]) 클릭 시 다음 백그라운드 전환을 잠금에서 제외
+function onFileInputClick(e) {
+  const t = e.target
+  if (t && t.tagName === 'INPUT' && t.type === 'file') appLock.suppressLock()
+}
+
+// ===== 토스트 (뒤로가기 종료 안내 등) =====
+const toastMsg = ref('')
+let toastTimer = null
+function onToast(e) {
+  toastMsg.value = e.detail || ''
+  clearTimeout(toastTimer)
+  toastTimer = setTimeout(() => { toastMsg.value = '' }, 1800)
+}
+
 onMounted(() => {
   if (!isApp) return // 웹은 안내만 — 앱 전용 초기화 생략
   window.addEventListener('auth:unauthorized', onUnauthorized)
+  window.addEventListener('premium:required', onPremiumRequired)
+  window.addEventListener('online', onOnline)
+  window.addEventListener('offline', onOffline)
+  window.addEventListener('net:error', onNetError)
+  window.addEventListener('app:toast', onToast)
+  // 앱 잠금: 저장된 세션으로 재진입하는 경우 시작 시 잠금(새 로그인 직후는 잠그지 않음)
+  if (appLock.state.enabled && appLock.hasSession()) appLock.lock()
+  document.addEventListener('visibilitychange', onVisibility)
+  document.addEventListener('click', onFileInputClick, true)
   ui.loadSignupEnabled() // 회원가입 허용 여부 선로딩(랜딩/로그인 가입 버튼에 반영)
+  // 로그인 상태면 전체 프로필(아바타·포인트) 최신화 — 재로그인 없이 헤더 아바타 반영
+  if (auth.isAuthenticated) {
+    auth.refreshProfile().then(() => {
+      if (reminders.isNative()) {
+        reminders.scheduleExpiryReminder({
+          premium: auth.isPremium,
+          autoRenew: !!auth.user?.planAutoRenew,
+          expiresAt: auth.user?.planExpiresAt,
+        })
+      }
+    })
+    if (reminders.isNative()) reminders.scheduleEntryReminder(false) // 오늘 기록 여부는 홈/내역에서 보정
+  }
+})
+onUnmounted(() => {
+  window.removeEventListener('auth:unauthorized', onUnauthorized)
+  window.removeEventListener('premium:required', onPremiumRequired)
+  window.removeEventListener('online', onOnline)
+  window.removeEventListener('offline', onOffline)
+  window.removeEventListener('net:error', onNetError)
+  window.removeEventListener('app:toast', onToast)
+  document.removeEventListener('visibilitychange', onVisibility)
+  document.removeEventListener('click', onFileInputClick, true)
+  clearTimeout(netTimer)
+  clearTimeout(toastTimer)
+})
+
+// 자식 컴포넌트의 렌더/라이프사이클 오류를 잡아 흰 화면 대신 폴백 표시
+onErrorCaptured((err, _instance, info) => {
+  reportFatal({ err, info })
+  return false // 상위로 전파 중단
 })
-onUnmounted(() => window.removeEventListener('auth:unauthorized', onUnauthorized))
 
 // 페이지 이동 시 모바일 사이드바 자동 닫힘
 watch(() => route.fullPath, () => ui.closeSidebar())
 </script>
 
 <template>
-  <!-- 웹(브라우저): 안내 페이지만 -->
-  <WebOnlyNotice v-if="!isApp" />
+  <!-- 치명적 오류 폴백 (흰 화면 방지) -->
+  <div v-if="appError.hasError" class="fatal-screen">
+    <div class="fatal-inner">
+      <div class="fatal-emoji">😵</div>
+      <h1 class="fatal-title">문제가 발생했어요</h1>
+      <p class="fatal-sub">일시적인 오류일 수 있어요. 새로고침 후 다시 시도해 주세요.</p>
+      <button type="button" class="fatal-btn" @click="retryReload">새로고침</button>
+    </div>
+  </div>
+
+  <template v-else>
+  <!-- 웹(브라우저): 공개 법적 고지는 노출, 그 외엔 안내 페이지 -->
+  <template v-if="!isApp">
+    <RouterView v-if="isPublicLegal" />
+    <WebOnlyNotice v-else />
+  </template>
 
   <!-- 앱(Capacitor): 전체 기능 -->
   <template v-else>
-    <div class="layout" :class="{ 'sidebar-open': ui.sidebarOpen, 'no-sidebar': !auth.isAuthenticated }">
+    <!-- 앱 잠금 화면 (로그인 상태 + 잠금 활성 시) -->
+    <AppLockScreen v-if="appLock.state.locked && auth.isAuthenticated" />
+
+    <!-- 네트워크 오류/오프라인 안내 배너 -->
+    <Transition name="netbar">
+      <div v-if="showNetBanner" class="net-banner" role="alert">
+        <span class="net-text">{{ netBannerText }}</span>
+        <button type="button" class="net-retry" @click="retryReload">새로고침</button>
+      </div>
+    </Transition>
+
+    <div class="layout" :class="{ 'sidebar-open': ui.sidebarOpen, 'no-sidebar': !authed, 'has-ad': showAds }">
       <AppHeader class="layout-top" />
-      <!-- 로그인 전에는 메뉴가 없어 사이드바를 숨김(빈 칸 제거·중앙 정렬) -->
-      <template v-if="auth.isAuthenticated">
+      <!-- 로그인/둘러보기 전에는 메뉴가 없어 사이드바를 숨김(빈 칸 제거·중앙 정렬) -->
+      <template v-if="authed">
         <AppSidebar class="layout-left" />
         <div class="sidebar-backdrop" @click="ui.closeSidebar()"></div>
       </template>
       <main class="layout-body">
+        <div v-if="demo.on" class="demo-bar">
+          <span>👀 <b>둘러보기 모드</b> · 샘플 데이터입니다.</span>
+          <span class="demo-actions">
+            <button type="button" class="db-login" @click="ui.openLogin('/account')">로그인</button>
+            <button type="button" class="db-exit" @click="leaveDemo">나가기</button>
+          </span>
+        </div>
         <RouterView />
       </main>
+      <!-- 하단 내비 위 광고 (유료 회원 제외). 앱은 320x50 모바일 배너(임시) -->
+      <AdBanner v-if="showAds" class="app-ad" unit="DAN-qd8As3nqJjXTQKa6" :width="320" :height="50" />
       <AppBottomNav class="layout-bottom" />
     </div>
 
     <LoginModal />
     <SignupModal />
+
+    <!-- 토스트 (뒤로가기 종료 안내 등) -->
+    <Transition name="toast">
+      <div v-if="toastMsg" class="app-toast" role="status">{{ toastMsg }}</div>
+    </Transition>
   </template>
 
   <!-- 공용 인앱 다이얼로그 (네이티브 alert/confirm/prompt 대체) -->
   <AppDialog />
   </template>
+</template>
 
 <style scoped>
 .layout {
   display: grid;
   grid-template-areas:
-    'top    top'
+    'left   top'
     'left   body'
     'bottom bottom';
   grid-template-columns: 220px 1fr;
   grid-template-rows: auto 1fr auto;
-  min-height: 100vh;
+  /* 앱 셸: 뷰포트 높이에 고정하고 본문(layout-body)만 스크롤 → 상단 헤더·하단 내비 고정, 페이지 전체 스크롤 방지 */
+  height: 100vh; /* 폴백 */
+  height: 100dvh; /* 동적 뷰포트(주소창·안전영역 반영) */
+  overflow: hidden;
 }
 
 .layout-top {
@@ -84,18 +244,187 @@ watch(() => route.fullPath, () => ui.closeSidebar())
   grid-area: left;
 }
 
+.demo-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+  margin-bottom: 1rem;
+  padding: 0.55rem 0.9rem;
+  border: 1px solid hsla(160, 100%, 37%, 0.4);
+  border-radius: 8px;
+  background: hsla(160, 100%, 37%, 0.08);
+  font-size: 0.88rem;
+}
+
+/* 네트워크 오류/오프라인 배너 — 화면 최상단 고정 */
+.net-banner {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 2000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.75rem;
+  padding: calc(env(safe-area-inset-top, 0) + 0.5rem) 0.9rem 0.5rem;
+  background: #c0392b;
+  color: #fff;
+  font-size: 0.85rem;
+  font-weight: 600;
+  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.25);
+}
+.net-text {
+  word-break: keep-all;
+}
+.net-retry {
+  flex: none;
+  padding: 0.25rem 0.7rem;
+  border: 1px solid rgba(255, 255, 255, 0.7);
+  border-radius: 6px;
+  background: transparent;
+  color: #fff;
+  font-size: 0.8rem;
+  font-weight: 700;
+  cursor: pointer;
+}
+.net-retry:hover {
+  background: rgba(255, 255, 255, 0.15);
+}
+.netbar-enter-active,
+.netbar-leave-active {
+  transition: transform 0.2s ease, opacity 0.2s ease;
+}
+.netbar-enter-from,
+.netbar-leave-to {
+  transform: translateY(-100%);
+  opacity: 0;
+}
+
+/* 토스트 */
+.app-toast {
+  position: fixed;
+  left: 50%;
+  bottom: calc(72px + env(safe-area-inset-bottom, 0));
+  transform: translateX(-50%);
+  z-index: 2600;
+  max-width: 80vw;
+  padding: 0.6rem 1.1rem;
+  border-radius: 999px;
+  background: rgba(0, 0, 0, 0.82);
+  color: #fff;
+  font-size: 0.85rem;
+  white-space: nowrap;
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+.toast-enter-active,
+.toast-leave-active {
+  transition: opacity 0.2s ease, transform 0.2s ease;
+}
+.toast-enter-from,
+.toast-leave-to {
+  opacity: 0;
+  transform: translateX(-50%) translateY(8px);
+}
+
+/* 치명적 오류 폴백 화면 */
+.fatal-screen {
+  position: fixed;
+  inset: 0;
+  z-index: 4000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1.5rem;
+  background: var(--color-background);
+}
+.fatal-inner {
+  text-align: center;
+  max-width: 360px;
+}
+.fatal-emoji {
+  font-size: 2.8rem;
+}
+.fatal-title {
+  margin-top: 0.6rem;
+  font-size: 1.2rem;
+  color: var(--color-heading);
+}
+.fatal-sub {
+  margin-top: 0.5rem;
+  font-size: 0.9rem;
+  opacity: 0.7;
+  line-height: 1.6;
+  word-break: keep-all;
+}
+.fatal-btn {
+  margin-top: 1.4rem;
+  padding: 0.7rem 1.8rem;
+  border: 0;
+  border-radius: 10px;
+  background: hsla(160, 100%, 37%, 1);
+  color: #fff;
+  font-size: 0.95rem;
+  font-weight: 700;
+  cursor: pointer;
+}
+.fatal-btn:hover {
+  background: hsla(160, 100%, 32%, 1);
+}
+.demo-actions {
+  display: flex;
+  gap: 0.4rem;
+}
+.demo-bar button {
+  padding: 0.35rem 0.8rem;
+  border-radius: 6px;
+  font-weight: 600;
+  font-size: 0.85rem;
+  cursor: pointer;
+}
+.db-login {
+  border: 1px solid hsla(160, 100%, 37%, 1);
+  background: hsla(160, 100%, 37%, 1);
+  color: #fff;
+}
+.db-exit {
+  border: 1px solid var(--color-border);
+  background: var(--color-background);
+  color: var(--color-text);
+}
 .layout-body {
   grid-area: body;
   padding: 1.5rem 2rem;
-  /* 하단 고정 내비(56px)+소프트키 인셋만큼 비워 콘텐츠가 가리지 않게 */
+  /* 하단 고정 내비(56px + 안전영역) 뒤로 마지막 내용이 가려지지 않도록 항상 여백 확보 */
   padding-bottom: calc(56px + env(safe-area-inset-bottom, 0) + 1rem);
-  overflow: auto;
+  /* 그리드 1fr 트랙 안에서만 스크롤(콘텐츠로 인해 트랙이 늘어나 페이지 전체가 스크롤되지 않도록 min-height:0) */
+  min-height: 0;
+  overflow-y: auto;
+  overflow-x: hidden; /* 페이지 가로 스크롤 방지 — 넓은 표/차트는 각자 컨테이너에서 스크롤 */
+  -webkit-overflow-scrolling: touch;
 }
 
 .layout-bottom {
   grid-area: bottom;
 }
 
+/* 하단 내비(56px) 바로 위 고정 광고 */
+.app-ad {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: calc(56px + env(safe-area-inset-bottom, 0));
+  z-index: 999;
+  background: var(--color-background);
+  border-top: 1px solid var(--color-border);
+}
+/* 광고가 있을 땐 본문 하단 여백을 광고 높이(320x50 배너)만큼 더 확보 */
+.layout.has-ad .layout-body {
+  padding-bottom: calc(56px + 62px + env(safe-area-inset-bottom, 0) + 1rem);
+}
+
 /* 로그인 전: 사이드바 없이 단일 컬럼 — 콘텐츠가 창 중앙에 오도록 */
 .layout.no-sidebar {
   grid-template-columns: 1fr;

src/api/accountApi.js

@@ -1,7 +1,8 @@
 import http from './http'
+import { demo, demoApi } from '@/demo'
 
 // 백엔드 /api/account 엔드포인트와 매핑 (본인 데이터만)
-export const accountApi = {
+const realApi = {
   list({ year, month, type, category, walletId, keyword, tagId } = {}) {
     return http.get('/account/entries', { params: { year, month, type, category, walletId, keyword, tagId } })
   },
@@ -14,6 +15,10 @@ export const accountApi = {
   categoryStats({ type, year, month } = {}) {
     return http.get('/account/category-stats', { params: { type, year, month } })
   },
+  // 통계 화면 집계 → AI 재무 코멘트(유료). 실패해도 화면을 막지 않도록 전역 배너 억제
+  aiComment(payload) {
+    return http.post('/account/ai-comment', payload, { timeout: 30000, suppressNetError: true })
+  },
   netWorthTrend({ months, weeks, unit } = {}) {
     return http.get('/account/networth/trend', { params: { months, weeks, unit } })
   },
@@ -27,8 +32,13 @@ export const accountApi = {
     return http.delete(`/account/entries/${id}`)
   },
   // 문자/푸시 텍스트 파싱(저장 안 함) → 추가 폼 자동채움
-  parseText({ title, text } = {}) {
-    return http.post('/account/entries/parse', { title, text })
+  // categoryHints/walletHints: AI가 이 후보들 중에서 분류·결제수단을 고르도록 사용자 목록 전달
+  parseText({ title, text, categoryHints, walletHints } = {}) {
+    return http.post('/account/entries/parse', { title, text, categoryHints, walletHints })
+  },
+  // 환율 조회 — 외화 결제 입력 시 통화→원화 환율 자동 채움
+  fxRate(from, to = 'KRW') {
+    return http.get('/fx/rate', { params: { from, to } })
   },
 
   // 자주 쓰는 내역(빠른 등록 템플릿)
@@ -71,8 +81,12 @@ export const accountApi = {
   },
 
   // 예산 (사용자별)
-  budgets() {
-    return http.get('/account/budgets')
+  budgets({ year, month } = {}) {
+    return http.get('/account/budgets', { params: { year, month } })
+  },
+  // 다른 월 예산을 이 달로 복사(전월 복사 등)
+  copyBudget({ fromYear, fromMonth, toYear, toMonth }) {
+    return http.post('/account/budgets/copy', null, { params: { fromYear, fromMonth, toYear, toMonth } })
   },
   budgetStatus({ year, month }) {
     return http.get('/account/budgets/status', { params: { year, month } })
@@ -86,8 +100,8 @@ export const accountApi = {
   setExpectedIncome({ year, month, expectedIncome }) {
     return http.put('/account/budgets/income', { expectedIncome }, { params: { year, month } })
   },
-  createBudget(payload) {
-    return http.post('/account/budgets', payload)
+  createBudget(payload, { year, month } = {}) {
+    return http.post('/account/budgets', payload, { params: { year, month } })
   },
   updateBudget(id, payload) {
     return http.put(`/account/budgets/${id}`, payload)
@@ -95,6 +109,19 @@ export const accountApi = {
   removeBudget(id) {
     return http.delete(`/account/budgets/${id}`)
   },
+  // 1회성 예산
+  onetimeBudgets() {
+    return http.get('/account/budgets/onetime')
+  },
+  createOnetimeBudget(payload) {
+    return http.post('/account/budgets/onetime', payload)
+  },
+  updateOnetimeBudget(id, payload) {
+    return http.put(`/account/budgets/onetime/${id}`, payload)
+  },
+  removeOnetimeBudget(id) {
+    return http.delete(`/account/budgets/onetime/${id}`)
+  },
   createWallet(payload) {
     return http.post('/account/wallets', payload)
   },
@@ -188,13 +215,82 @@ export const accountApi = {
     return http.post(`/account/entries/${id}/confirm`, payload || {})
   },
 
-  // 영수증 OCR (백엔드가 Google Vision 호출 → 전체 텍스트 반환)
+  // 데이터 복구(가져오기) — 전체 데이터 덮어쓰기
+  restore(payload) {
+    return http.post('/account/restore', payload)
+  },
+
+  // 가계부 데이터 전체 삭제 (내역·계좌·분류·태그·예산·고정지출·투자 전부)
+  deleteAllData() {
+    return http.delete('/account/all')
+  },
+
+  // 포인트 상점 — 현황 조회 / 아이템 구매
+  shopStatus() {
+    return http.get('/account/shop/status')
+  },
+  buyShopItem(item) {
+    return http.post('/account/shop/buy', { item })
+  },
+
+  // 영수증 OCR (백엔드가 Google Vision 호출 → 전체 텍스트 반환) — AI 폴백용
+  // suppressNetError: runOcr 이 자체 formError 로 안내하므로 전역 배너 억제
   ocrReceipt(blob) {
     const fd = new FormData()
     fd.append('image', blob, 'receipt.jpg')
     return http.post('/account/ocr/receipt', fd, {
       headers: { 'Content-Type': 'multipart/form-data' },
       timeout: 30000,
+      suppressNetError: true,
+    })
+  },
+  // 영수증 AI 구조화 (Claude Vision) — 금액·상호·날짜·분류·계좌를 한 번에. 사용자 후보 목록을 함께 전달
+  // 비전 처리가 느릴 수 있어 타임아웃 상향, 실패 시 OCR 폴백이 있으므로 전역 배너 억제
+  parseReceiptAi(blob, { categoryHints = [], walletHints = [] } = {}) {
+    const fd = new FormData()
+    fd.append('image', blob, 'receipt.jpg')
+    // 멀티파트 파트 수 제한(Tomcat 기본 10) 회피: 후보를 각각 한 파트에 줄바꿈으로 합쳐 전송
+    if (categoryHints.length) fd.append('categoryHints', categoryHints.join('\n'))
+    if (walletHints.length) fd.append('walletHints', walletHints.join('\n'))
+    return http.post('/account/ocr/receipt-ai', fd, {
+      headers: { 'Content-Type': 'multipart/form-data' },
+      timeout: 60000,
+      suppressNetError: true,
     })
   },
 }
+
+// ===== 둘러보기(데모) 모드 =====
+// demo.on 이면 읽기는 더미 데이터, 쓰기는 차단(안내 메시지)으로 응답한다.
+const DEMO_READS = {
+  list: demoApi.list,
+  summary: demoApi.summary,
+  wallets: demoApi.wallets,
+  netWorth: demoApi.netWorth,
+  categories: demoApi.categories,
+  recurrings: demoApi.recurrings,
+  quickEntries: demoApi.quickEntries,
+  pendingCount: demoApi.pendingCount,
+  tags: demoApi.tags,
+  walletEntries: demoApi.walletEntries,
+}
+const DEMO_WRITES = new Set([
+  'create', 'update', 'remove', 'parseText', 'createQuickEntry', 'removeQuickEntry', 'repayment',
+  'createRecurring', 'updateRecurring', 'removeRecurring', 'runRecurrings',
+  'createWallet', 'updateWallet', 'removeWallet', 'reorderWallets',
+  'createCategory', 'updateCategory', 'removeCategory', 'reorderCategories', 'importCategories',
+  'createTag', 'updateTag', 'removeTag', 'reorderTags', 'confirmEntry', 'ocrReceipt', 'parseReceiptAi', 'aiComment', 'restore', 'deleteAllData', 'buyShopItem',
+  'createBudget', 'updateBudget', 'removeBudget', 'setExpectedIncome',
+  'createHolding', 'updateHolding', 'removeHolding', 'addTrade', 'updateTrade', 'removeTrade',
+  'refreshPrices', 'refreshAllPrices',
+])
+
+export const accountApi = new Proxy(realApi, {
+  get(target, prop) {
+    if (demo.on) {
+      if (DEMO_READS[prop]) return DEMO_READS[prop]
+      if (DEMO_WRITES.has(prop)) return () => demoApi.block()
+    }
+    return target[prop]
+  },
+})

src/api/adminApi.js

@@ -23,12 +23,6 @@ export const adminApi = {
   removeTag(id) {
     return http.delete(`/admin/tags/${id}`)
   },
-  getBoardSetting() {
-    return http.get('/admin/board-setting')
-  },
-  setBoardSetting(tagCategoryId) {
-    return http.put('/admin/board-setting', { tagCategoryId })
-  },
 
   // 기본(디폴트) 분류 관리 (관리자) — 사용자가 '기본 분류 불러오기'로 가져감
   defaultCategories() {
@@ -62,6 +56,9 @@ export const adminApi = {
   updateMemberRole(id, role) {
     return http.put(`/admin/members/${id}/role`, { role })
   },
+  updateMemberPlan(id, plan) {
+    return http.put(`/admin/members/${id}/plan`, { plan })
+  },
   updateMemberStatus(id, status) {
     return http.put(`/admin/members/${id}/status`, { status })
   },

src/api/authApi.js

@@ -18,6 +18,10 @@ export const authApi = {
   googleClientId() {
     return http.get('/auth/google-client-id')
   },
+  // 애플 로그인/가입 — Sign in with Apple 에서 받은 identity token 전달
+  appleLogin(payload) {
+    return http.post('/auth/apple', payload)
+  },
   logout() {
     return http.post('/auth/logout')
   },
@@ -35,4 +39,25 @@ export const authApi = {
   updateProfile(payload) {
     return http.put('/auth/profile', payload)
   },
+  // 프로필 사진 변경/해제 — image 가 null/빈값이면 해제(구글 사진으로 폴백)
+  updateProfileImage(image) {
+    return http.put('/auth/profile-image', { image })
+  },
+  // 현재 사용자 활동 포인트 (최신값)
+  points() {
+    return http.get('/auth/points')
+  },
+  // 포인트 적립/차감 내역 — year+month 지정 시 해당 월, 미지정 시 최근 100건
+  pointHistory(year, month) {
+    const params = year && month ? { year, month } : {}
+    return http.get('/auth/point-history', { params })
+  },
+  // 현재 사용자 전체 프로필(아바타·포인트 포함) — 재로그인 없이 최신값 동기화
+  profile() {
+    return http.get('/auth/profile')
+  },
+  // 회원 탈퇴 — 계정·데이터 전체 삭제
+  withdraw() {
+    return http.delete('/auth/me')
+  },
 }

src/api/billingApi.js

@@ -0,0 +1,29 @@
+import http from './http'
+
+// 백엔드 /api/billing 엔드포인트와 매핑
+export const billingApi = {
+  // 구독 상품 목록
+  products() {
+    return http.get('/billing/products')
+  },
+  // Google Play 구매 검증 → 멤버십 부여
+  verifyGoogle(payload) {
+    return http.post('/billing/google/verify', payload)
+  },
+  // 현재 구독 현황 (플랜·만료일·다음 결제일·자동갱신)
+  subscription() {
+    return http.get('/billing/subscription')
+  },
+  // 구독 해지 (자동 갱신 중단)
+  cancel() {
+    return http.post('/billing/cancel')
+  },
+  // 구독 재개 (만료 전 자동 갱신 재개)
+  resume() {
+    return http.post('/billing/resume')
+  },
+  // 구매 복원 (기기 변경·재설치)
+  restore() {
+    return http.post('/billing/restore')
+  },
+}

src/api/boardApi.js

@@ -17,6 +17,13 @@ export const boardApi = {
   get(id) {
     return http.get(`/board/posts/${id}`)
   },
+  // 내 글/댓글 모아보기
+  myPosts({ page = 1, size = 10 } = {}) {
+    return http.get('/board/my/posts', { params: { page, size } })
+  },
+  myComments({ page = 1, size = 10 } = {}) {
+    return http.get('/board/my/comments', { params: { page, size } })
+  },
   create(payload) {
     return http.post('/board/posts', payload)
   },
@@ -35,11 +42,11 @@ export const boardApi = {
       timeout: 30000,
     })
   },
-  tags() {
-    return http.get('/board/tags')
+  tags(category) {
+    return http.get('/board/tags', { params: { category: category || undefined } })
   },
-  tagGroups() {
-    return http.get('/board/tag-groups')
+  tagGroups(category) {
+    return http.get('/board/tag-groups', { params: { category: category || undefined } })
   },
   addComment(id, content) {
     return http.post(`/board/posts/${id}/comments`, { content })
@@ -47,10 +54,47 @@ export const boardApi = {
   removeComment(commentId) {
     return http.delete(`/board/comments/${commentId}`)
   },
+  // 추천/비추천 (토글) — type: 'UP' | 'DOWN'
+  votePost(id, type) {
+    return http.post(`/board/posts/${id}/vote`, { type })
+  },
+  voteComment(commentId, type) {
+    return http.post(`/board/comments/${commentId}/vote`, { type })
+  },
+  // 추천(👍)한 사람 목록
+  recommenders(id) {
+    return http.get(`/board/posts/${id}/recommenders`)
+  },
+  // 신고 (누적 5건 시 블라인드)
+  reportPost(id) {
+    return http.post(`/board/posts/${id}/report`)
+  },
+  reportComment(commentId) {
+    return http.post(`/board/comments/${commentId}/report`)
+  },
+  // 댓글 블라인드 해제 (관리자)
+  unblockComment(commentId) {
+    return http.post(`/board/comments/${commentId}/unblock`)
+  },
+  // 신고 관리 (관리자) — 신고된 글/댓글 목록
+  reports() {
+    return http.get('/board/reports')
+  },
+  // 신고 무시 (관리자) — 블라인드 없이 신고 기록만 초기화
+  dismissReport(targetType, targetId) {
+    return http.post('/board/reports/dismiss', { targetType, targetId })
+  },
   block(id, reason) {
     return http.post(`/board/posts/${id}/block`, { reason })
   },
   unblock(id) {
     return http.post(`/board/posts/${id}/unblock`)
   },
+  // 공지 설정/해제 (관리자) — 목록 최상단 고정
+  setNotice(id) {
+    return http.post(`/board/posts/${id}/notice`)
+  },
+  unsetNotice(id) {
+    return http.post(`/board/posts/${id}/unnotice`)
+  },
 }

src/api/http.js

@@ -31,6 +31,13 @@ http.interceptors.response.use(
       localStorage.removeItem('token')
       localStorage.removeItem('auth_user')
       window.dispatchEvent(new CustomEvent('auth:unauthorized'))
+    } else if (status === 403 && error.response?.data?.code === 'PREMIUM_REQUIRED') {
+      // 유료 전용 API 를 무료 회원이 호출(우회/직접 접근) — 업그레이드 안내
+      window.dispatchEvent(new CustomEvent('premium:required'))
+    } else if (!error.response && error.code !== 'ERR_CANCELED' && !error.config?.suppressNetError) {
+      // 응답 자체가 없음 = 네트워크 오류(오프라인/타임아웃/서버 연결 불가). 취소 요청은 제외.
+      // suppressNetError: 자체 폴백/에러표시가 있는 호출(예: 영수증 AI)은 전역 배너를 띄우지 않음.
+      window.dispatchEvent(new CustomEvent('net:error'))
     }
     return Promise.reject(error)
   },

src/assets/base.css

@@ -34,10 +34,12 @@
   --color-text: var(--vt-c-text-light-1);
 
   --section-gap: 160px;
+  /* 모든 화면 본문 공통 폭 (화면별 제각각이던 max-width 를 일관되게) */
+  --page-max: 760px;
 }
 
-@media (prefers-color-scheme: dark) {
-  :root {
+/* 다크 변수 묶음 — 명시적 다크(data-theme=dark)와 시스템 다크에서 공통 사용 */
+:root[data-theme='dark'] {
   --color-background: var(--vt-c-black);
   --color-background-soft: var(--vt-c-black-soft);
   --color-background-mute: var(--vt-c-black-mute);
@@ -46,7 +48,21 @@
   --color-border-hover: var(--vt-c-divider-dark-1);
 
   --color-heading: var(--vt-c-text-dark-1);
-    --color-text: var(--vt-c-text-dark-2);
+  --color-text: var(--vt-c-text-dark-1);
+}
+
+/* 시스템 설정 따름(테마 미지정 = 시스템). 명시적 라이트/다크가 있으면 그게 우선 */
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme]) {
+    --color-background: var(--vt-c-black);
+    --color-background-soft: var(--vt-c-black-soft);
+    --color-background-mute: var(--vt-c-black-mute);
+
+    --color-border: var(--vt-c-divider-dark-2);
+    --color-border-hover: var(--vt-c-divider-dark-1);
+
+    --color-heading: var(--vt-c-text-dark-1);
+    --color-text: var(--vt-c-text-dark-1);
   }
 }
 

src/assets/main.css

@@ -4,6 +4,14 @@
   font-weight: normal;
 }
 
+/* 모든 화면 본문 폭 통일 — 각 뷰가 제각각 두던 root max-width 를 한 곳에서 일관되게.
+   (본문 직계 자식 = 각 화면 루트 컨테이너) scoped 스타일을 덮기 위해 !important 사용. */
+.layout-body > * {
+  max-width: var(--page-max) !important;
+  margin-left: auto !important;
+  margin-right: auto !important;
+}
+
 /* 폼 요소 폰트 상속(표준 리셋) — 네이티브 input/select/textarea 가 서로 폰트·높이 달라
    보이던 이질감 해소. (개별 화면 scoped 스타일이 더 구체적이면 그쪽이 우선) */
 input,

src/capacitor.js

@@ -1,18 +1,13 @@
 // Capacitor 네이티브(안드로이드) 통합. 웹에서는 no-op.
 import { Capacitor } from '@capacitor/core'
 import { App as CapApp } from '@capacitor/app'
+import { handleBack } from '@/composables/appBack'
 
 export function setupCapacitor(router) {
   if (!Capacitor.isNativePlatform()) return
 
-  // 안드로이드 하드웨어 뒤로가기 → 라우터 뒤로, 더 못 가면 앱 종료
-  CapApp.addListener('backButton', ({ canGoBack }) => {
-    if (canGoBack && window.history.length > 1) {
-      router.back()
-    } else {
-      CapApp.exitApp()
-    }
-  })
+  // 안드로이드 하드웨어 뒤로가기 → 하단 내비 뒤로 버튼과 동일한 통합 처리
+  CapApp.addListener('backButton', () => handleBack(router))
 
   // 네이티브 표시용 클래스 (safe-area 등 스타일 분기)
   document.documentElement.classList.add('is-native')

src/components/AdBanner.vue

@@ -0,0 +1,50 @@
+<script setup>
+import { computed, onMounted, ref } from 'vue'
+import { useAuthStore } from '@/stores/auth'
+import { ADS_ENABLED } from '@/config/features'
+
+// 카카오 애드핏 배너. 광고 기능이 켜져 있고 유료(PREMIUM) 회원이 아닐 때만 표시한다.
+const props = defineProps({
+  unit: { type: String, default: 'DAN-n0I5XRBOwAdSFbEX' },
+  width: { type: Number, default: 728 },
+  height: { type: Number, default: 90 },
+})
+
+const auth = useAuthStore()
+const showAd = computed(() => ADS_ENABLED && !auth.isPremium)
+
+const host = ref(null)
+const ADFIT_SRC = '//t1.kakaocdn.net/kas/static/ba.min.js'
+
+onMounted(() => {
+  if (!showAd.value || !host.value) return
+  // SPA 에서 동적 삽입 시 애드핏이 인식하도록 ins 를 직접 만들고 로더를 다시 실행한다.
+  const ins = document.createElement('ins')
+  ins.className = 'kakao_ad_area'
+  ins.style.display = 'none'
+  ins.setAttribute('data-ad-unit', props.unit)
+  ins.setAttribute('data-ad-width', String(props.width))
+  ins.setAttribute('data-ad-height', String(props.height))
+  host.value.appendChild(ins)
+
+  const s = document.createElement('script')
+  s.type = 'text/javascript'
+  s.src = ADFIT_SRC
+  s.async = true
+  host.value.appendChild(s)
+})
+</script>
+
+<template>
+  <div v-if="showAd" ref="host" class="ad-banner" :style="{ minHeight: height + 'px' }"></div>
+</template>
+
+<style scoped>
+.ad-banner {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  overflow: hidden; /* 좁은 화면에서 가로 넘침 방지 */
+}
+</style>

src/components/AppLockScreen.vue

@@ -0,0 +1,96 @@
+<script setup>
+import { ref } from 'vue'
+import { appLock, PIN_LENGTH } from '@/composables/appLock'
+import { useAuthStore } from '@/stores/auth'
+import PinPad from '@/components/PinPad.vue'
+
+const auth = useAuthStore()
+const pin = ref('')
+const error = ref(false)
+
+async function onComplete(p) {
+  if (await appLock.verify(p)) {
+    pin.value = ''
+    error.value = false
+    appLock.unlock()
+  } else {
+    error.value = true
+    pin.value = ''
+  }
+}
+function onInput(v) {
+  pin.value = v
+  error.value = false
+}
+async function forgot() {
+  // PIN 분실 → 잠금 해제 + 로그아웃(재로그인 후 다시 설정). 갇힘 방지.
+  appLock.disable()
+  await auth.logout()
+  appLock.unlock()
+}
+</script>
+
+<template>
+  <div class="lock-screen">
+    <div class="lock-inner">
+      <div class="lock-logo">🐷</div>
+      <h1 class="lock-title">돈돼지 가계부</h1>
+      <p class="lock-sub" :class="{ err: error }">
+        {{ error ? 'PIN이 일치하지 않아요' : 'PIN을 입력하세요' }}
+      </p>
+      <PinPad :value="pin" :length="PIN_LENGTH" class="lock-pad" @update:value="onInput" @complete="onComplete" />
+      <button type="button" class="lock-forgot" @click="forgot">PIN을 잊으셨나요? 로그아웃</button>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.lock-screen {
+  position: fixed;
+  inset: 0;
+  z-index: 3000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: calc(env(safe-area-inset-top, 0) + 1rem) 1rem calc(env(safe-area-inset-bottom, 0) + 1rem);
+  background: var(--color-background);
+}
+.lock-inner {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+}
+.lock-logo {
+  font-size: 2.6rem;
+}
+.lock-title {
+  margin-top: 0.4rem;
+  font-size: 1.25rem;
+  color: var(--color-heading);
+}
+.lock-sub {
+  margin-top: 0.6rem;
+  margin-bottom: 1.8rem;
+  font-size: 0.92rem;
+  opacity: 0.7;
+}
+.lock-sub.err {
+  color: #c0392b;
+  opacity: 1;
+  font-weight: 600;
+}
+.lock-forgot {
+  margin-top: 2rem;
+  border: 0;
+  background: transparent;
+  color: var(--color-text);
+  opacity: 0.6;
+  font-size: 0.85rem;
+  text-decoration: underline;
+  cursor: pointer;
+}
+.lock-forgot:hover {
+  opacity: 0.9;
+}
+</style>

src/components/LoginModal.spec.js

@@ -6,10 +6,14 @@ import { setActivePinia, createPinia } from 'pinia'
 const { pushMock } = vi.hoisted(() => ({ pushMock: vi.fn() }))
 vi.mock('vue-router', () => ({ useRouter: () => ({ push: pushMock }) }))
 
+// 아이디 로그인 플로우 검증용 — 운영에선 숨김(ID_LOGIN_ENABLED=false)이지만 로직은 유지되므로 켜서 테스트
+vi.mock('@/config/features', () => ({ ID_LOGIN_ENABLED: true }))
+
 vi.mock('@/api/authApi', () => ({
   authApi: {
     login: vi.fn(),
     signupEnabled: vi.fn(() => Promise.resolve({ enabled: true })),
+    googleClientId: vi.fn(() => Promise.resolve({ clientId: '' })),
   },
 }))
 

src/components/LoginModal.vue

@@ -5,6 +5,8 @@ import { useAuthStore } from '@/stores/auth'
 import { useUiStore } from '@/stores/ui'
 import { authApi } from '@/api/authApi'
 import { isNativeGoogle, nativeGoogleIdToken } from '@/native/googleAuth'
+import { isNativeApple, nativeAppleCredential } from '@/native/appleAuth'
+import { ID_LOGIN_ENABLED } from '@/config/features'
 
 const auth = useAuthStore()
 const ui = useUiStore()
@@ -63,6 +65,33 @@ async function handleNativeGoogle() {
   }
 }
 
+// ===== 애플 로그인 (iOS 전용) =====
+const isApple = isNativeApple()
+
+async function handleNativeApple() {
+  if (loading.value) return
+  loading.value = true
+  try {
+    const { identityToken, name } = await nativeAppleCredential()
+    loading.value = false
+    if (!identityToken) return
+    error.value = null
+    loading.value = true
+    await auth.appleLogin(identityToken, name, form.rememberMe)
+    const redirect = ui.redirectPath
+    ui.closeLogin()
+    router.push(redirect || '/')
+  } catch (e) {
+    // 사용자가 취소(USER_CANCELLED/1001 등)한 경우는 조용히 무시
+    const msg = `${e?.code || ''} ${e?.message || ''}`
+    if (!/cancel|1001/i.test(msg)) {
+      error.value = e.response?.data?.message || '애플 로그인에 실패했습니다.'
+    }
+  } finally {
+    loading.value = false
+  }
+}
+
 // GIS 스크립트 로드 (한 번만). 실패하면 reject.
 function loadGisScript() {
   if (window.google?.accounts?.id) return Promise.resolve()
@@ -173,7 +202,7 @@ onUnmounted(() => window.removeEventListener('keydown', onKeydown))
           <button class="close" type="button" aria-label="닫기" @click="ui.closeLogin()">×</button>
           <h2>로그인</h2>
 
-          <form class="form" @submit.prevent="handleLogin">
+          <form v-if="ID_LOGIN_ENABLED" class="form" @submit.prevent="handleLogin">
             <input v-model="form.loginId" type="text" placeholder="아이디" autocomplete="username" :disabled="loading" />
             <input v-model="form.password" type="password" placeholder="비밀번호" autocomplete="current-password" :disabled="loading" />
             <label class="remember">
@@ -187,7 +216,7 @@ onUnmounted(() => window.removeEventListener('keydown', onKeydown))
 
           <!-- 구글 로그인 — 서버에 클라이언트 ID 가 설정된 경우에만 노출 -->
           <div v-show="googleClientId" class="google-wrap">
-            <div class="divider"><span>또는</span></div>
+            <div v-if="ID_LOGIN_ENABLED" class="divider"><span>또는</span></div>
             <!-- 앱(안드로이드): 네이티브 버튼 / 웹·PC: GIS 렌더 버튼 -->
             <button
               v-if="isNative"
@@ -207,11 +236,25 @@ onUnmounted(() => window.removeEventListener('keydown', onKeydown))
             <div v-else ref="googleBtn" class="google-btn"></div>
           </div>
 
+          <!-- 애플 로그인 — iOS 전용(App Store 가이드라인 4.8 대응). 서버 설정 불필요 -->
+          <button
+            v-if="isApple"
+            type="button"
+            class="apple-native"
+            :disabled="loading"
+            @click="handleNativeApple"
+          >
+            <svg class="a-logo" viewBox="0 0 384 512" width="16" height="16" aria-hidden="true">
+              <path fill="currentColor" d="M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"/>
+            </svg>
+            Apple로 계속하기
+          </button>
+
           <button v-if="SOCIAL_LOGIN_ENABLED" type="button" class="naver" :disabled="loading" @click="handleNaverLogin">
             네이버로 로그인 (준비 중)
           </button>
 
-          <p class="links">
+          <p v-if="ID_LOGIN_ENABLED" class="links">
             <template v-if="ui.signupEnabled">
               계정이 없으신가요?
               <a href="#" @click.prevent="goSignup">회원가입</a>
@@ -338,6 +381,32 @@ h2 {
 .google-native .g-logo {
   flex: none;
 }
+/* Apple 로그인 버튼 — HIG 권장(검은 배경 + 흰 로고/텍스트) */
+.apple-native {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+  width: 100%;
+  max-width: 300px;
+  margin: 0.6rem auto 0;
+  padding: 0.6rem 1rem;
+  border: 1px solid #000;
+  border-radius: 4px;
+  background: #000;
+  color: #fff;
+  font-size: 0.95rem;
+  font-weight: 500;
+  cursor: pointer;
+}
+.apple-native:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+.apple-native .a-logo {
+  flex: none;
+  margin-top: -2px;
+}
 .divider {
   display: flex;
   align-items: center;

src/components/PinPad.vue

@@ -0,0 +1,85 @@
+<script setup>
+// 재사용 PIN 키패드 — 점 표시 + 숫자 키패드. 길이 도달 시 complete 방출.
+const props = defineProps({
+  value: { type: String, default: '' },
+  length: { type: Number, default: 4 },
+})
+const emit = defineEmits(['update:value', 'complete'])
+
+function press(d) {
+  if (props.value.length >= props.length) return
+  const next = props.value + d
+  emit('update:value', next)
+  if (next.length === props.length) emit('complete', next)
+}
+function del() {
+  emit('update:value', props.value.slice(0, -1))
+}
+</script>
+
+<template>
+  <div class="pinpad">
+    <div class="dots">
+      <span v-for="i in length" :key="i" class="dot" :class="{ on: value.length >= i }"></span>
+    </div>
+    <div class="keys">
+      <button v-for="n in 9" :key="n" type="button" class="key" @click="press(String(n))">{{ n }}</button>
+      <span class="key empty" aria-hidden="true"></span>
+      <button type="button" class="key" @click="press('0')">0</button>
+      <button type="button" class="key del" aria-label="지우기" @click="del">⌫</button>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.pinpad {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 1.6rem;
+}
+.dots {
+  display: flex;
+  gap: 0.9rem;
+}
+.dot {
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  border: 2px solid currentColor;
+  opacity: 0.5;
+}
+.dot.on {
+  background: currentColor;
+  opacity: 1;
+}
+.keys {
+  display: grid;
+  grid-template-columns: repeat(3, 64px);
+  gap: 0.8rem;
+}
+.key {
+  width: 64px;
+  height: 64px;
+  border-radius: 50%;
+  border: 1px solid var(--color-border);
+  background: var(--color-background-soft);
+  color: var(--color-text);
+  font-size: 1.4rem;
+  font-weight: 600;
+  cursor: pointer;
+}
+.key:active {
+  background: var(--color-border);
+}
+.key.empty {
+  border: 0;
+  background: transparent;
+  cursor: default;
+}
+.key.del {
+  font-size: 1.2rem;
+  border: 0;
+  background: transparent;
+}
+</style>

src/components/UserAvatar.vue

@@ -0,0 +1,62 @@
+<script setup>
+import { computed, ref, watch } from 'vue'
+
+// 작성자/추천자 아바타. 우선순위: 커스텀(profileImage) > 구글(googlePicture) > 이니셜.
+const props = defineProps({
+  name: { type: String, default: '' },
+  googlePicture: { type: String, default: '' },
+  profileImage: { type: String, default: '' },
+  size: { type: Number, default: 28 },
+})
+
+const broken = ref(false)
+const src = computed(() => props.profileImage || props.googlePicture || '')
+const initial = computed(() => {
+  const s = (props.name || '').trim()
+  return s ? s[0].toUpperCase() : '?'
+})
+// src 가 바뀌면 깨짐 상태 리셋
+watch(src, () => { broken.value = false })
+</script>
+
+<template>
+  <span class="user-avatar" :style="{ width: size + 'px', height: size + 'px' }" :title="name">
+    <img
+      v-if="src && !broken"
+      :src="src"
+      :alt="name"
+      referrerpolicy="no-referrer"
+      @error="broken = true"
+    />
+    <span v-else class="ua-initial" :style="{ fontSize: Math.round(size * 0.45) + 'px' }">{{ initial }}</span>
+  </span>
+</template>
+
+<style scoped>
+.user-avatar {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  overflow: hidden;
+  flex: none;
+  vertical-align: middle;
+  background: var(--color-background-mute);
+}
+.user-avatar img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+.ua-initial {
+  font-weight: 700;
+  color: #fff;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: hsla(160, 100%, 37%, 1);
+}
+</style>

src/components/WebOnlyNotice.vue

@@ -1,7 +1,9 @@
 <script setup>
+import { RouterLink } from 'vue-router'
+import AdBanner from '@/components/AdBanner.vue'
 // PC·모바일 웹에서 노출되는 안내 페이지. 실제 이용은 앱(모바일) 또는 PC 데스크톱 클라이언트에서.
 // PC 설치파일은 서버 /download/ 경로(영속 디렉터리)에서 서빙 — nginx 설정 참고.
-const PC_DOWNLOAD_URL = '/download/SlimBudget-Setup.exe'
+const PC_DOWNLOAD_URL = '/download/DonDwaeji-Setup.exe'
 // 모바일 앱(APK/스토어) 링크는 준비되면 연결
 const mobileReady = false
 </script>
@@ -13,8 +15,14 @@ const mobileReady = false
       <p class="tagline">슬림하게 관리하는 가계부 · 자산 · 예산</p>
 
       <div class="notice">
-        <p class="lead">🖥️ PC는 <b>설치형 앱</b>으로, 📱 모바일은 <b>앱</b>으로 이용해요.</p>
-        <p class="sub">웹 브라우저에서는 안내만 제공됩니다. 설치한 뒤 로그인해 주세요.</p>
+        <p class="lead">
+          <span class="ln">🖥️ PC는 <b>설치형 앱</b>으로,</span>
+          <span class="ln">📱 모바일은 <b>앱</b>으로 이용해요.</span>
+        </p>
+        <p class="sub">
+          <span class="ln">웹 브라우저에서는 안내만 제공됩니다.</span>
+          <span class="ln">설치한 뒤 로그인해 주세요.</span>
+        </p>
       </div>
 
       <div class="dl-group">
@@ -31,7 +39,18 @@ const mobileReady = false
         <li><span class="f-icon">🏦</span><b>자산·부채 관리</b><span>계좌·카드·대출·투자까지</span></li>
         <li><span class="f-icon">🎯</span><b>예산과 분석</b><span>예산 대비 지출·차트</span></li>
       </ul>
+
+      <nav class="legal-links">
+        <RouterLink to="/privacy">개인정보처리방침</RouterLink>
+        <span aria-hidden="true">·</span>
+        <RouterLink to="/terms">이용약관</RouterLink>
+        <span aria-hidden="true">·</span>
+        <RouterLink to="/account-deletion">계정 삭제</RouterLink>
+      </nav>
     </div>
+
+    <!-- 하단 광고 (유료 회원 제외) -->
+    <AdBanner class="web-ad" />
   </main>
 </template>
 
@@ -39,13 +58,18 @@ const mobileReady = false
 .web-only {
   min-height: 100vh;
   display: flex;
+  flex-direction: column;
   align-items: center;
   justify-content: center;
+  gap: 1.75rem;
   padding: 1.5rem;
   background:
     radial-gradient(120% 120% at 50% 0%, hsla(160, 100%, 37%, 0.12), transparent 60%),
     var(--color-background);
 }
+.web-ad {
+  margin-top: auto; /* 페이지 하단으로 */
+}
 .card {
   width: 100%;
   max-width: 420px;
@@ -54,6 +78,8 @@ const mobileReady = false
   border: 1px solid var(--color-border);
   border-radius: 16px;
   background: var(--color-background-soft);
+  /* 한국어는 단어(어절) 단위로 줄바꿈 — 'O요.' 가 혼자 다음 줄로 떨어지는 현상 방지 */
+  word-break: keep-all;
 }
 .brand {
   font-size: 2rem;
@@ -76,6 +102,11 @@ const mobileReady = false
   font-size: 0.86rem;
   opacity: 0.7;
 }
+/* 각 구절을 한 덩어리로 — 좁으면 절(span) 경계에서만 줄바꿈, 넓으면 한 줄 */
+.lead .ln,
+.sub .ln {
+  display: inline-block;
+}
 .dl-group {
   display: flex;
   flex-direction: column;
@@ -136,4 +167,18 @@ const mobileReady = false
   font-size: 0.78rem;
   opacity: 0.65;
 }
+.legal-links {
+  margin-top: 1.4rem;
+  display: flex;
+  justify-content: center;
+  gap: 0.5rem;
+  font-size: 0.8rem;
+  opacity: 0.7;
+}
+.legal-links a {
+  color: var(--color-text);
+}
+.legal-links a:hover {
+  color: hsla(160, 100%, 37%, 1);
+}
 </style>

src/components/layout/AppBottomNav.vue

@@ -1,6 +1,7 @@
 <script setup>
 import { computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
+import { handleBack } from '@/composables/appBack'
 
 const router = useRouter()
 const route = useRoute()
@@ -9,9 +10,8 @@ const isHome = computed(() => route.path === '/')
 const isSettings = computed(() => route.path.startsWith('/settings'))
 
 function goBack() {
-  // 히스토리가 있으면 뒤로, 없으면 홈으로 (앱 첫 화면에서 빠져나가지 않게)
-  if (window.history.length > 1) router.back()
-  else router.push('/')
+  // 하드웨어 뒤로가기와 동일 동작(오버레이 닫기 → 화면 뒤로 → 최상위 종료 안내)
+  handleBack(router)
 }
 function goForward() {
   router.forward()
@@ -74,11 +74,18 @@ function goSettings() {
   display: flex;
   align-items: stretch;
   justify-content: space-around;
-  height: 56px;
-  /* 안드로이드 소프트키(시스템 내비게이션 바) 위에 위치 */
+  /* 아이콘 행은 항상 56px 확보 + 그 아래로 홈 인디케이터(safe-area) 공간을 더한다.
+     (box-sizing:border-box 전역이라 height 에 인셋을 더해야 아이콘 행이 눌리지 않음) */
+  height: calc(56px + env(safe-area-inset-bottom, 0));
+  /* 안드로이드 소프트키·iOS 홈 인디케이터 영역 확보 */
   padding-bottom: env(safe-area-inset-bottom, 0);
   background: var(--color-background-soft);
   border-top: 1px solid var(--color-border);
+  /* 스크롤 콘텐츠와 시각적으로 분리(iOS 탭바처럼 은은한 상단 그림자) */
+  box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.07);
+}
+:global([data-theme='dark']) .bottom-nav {
+  box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.35);
 }
 .nav-btn {
   flex: 1;

src/components/layout/AppHeader.vue

@@ -1,12 +1,44 @@
 <script setup>
-import { RouterLink, useRouter } from 'vue-router'
+import { computed } from 'vue'
+import { RouterLink, useRouter, useRoute } from 'vue-router'
 import { useAuthStore } from '@/stores/auth'
 import { useUiStore } from '@/stores/ui'
+import { demo } from '@/demo'
+import { boardLabel } from '@/constants/boards'
 import IconBtn from '@/components/ui/IconBtn.vue'
+import UserAvatar from '@/components/UserAvatar.vue'
 
 const auth = useAuthStore()
 const ui = useUiStore()
 const router = useRouter()
+const route = useRoute()
+
+// 라우트별 헤더 타이틀(현재 화면 이름)
+const TITLES = {
+  home: '돈돼지 가계부',
+  'demo-locked': '둘러보기',
+  'account-entries': '가계부 내역',
+  'account-stats': '통계',
+  'account-recurrings': '정기결제',
+  'account-wallets': '계좌 관리',
+  'account-categories': '분류 관리',
+  'account-budget': '예산 설정',
+  'account-tags': '태그 관리',
+  'my-board': '내 글·댓글',
+  users: '회원 관리',
+  'admin-tags': '태그 관리(관리자)',
+  'admin-default-categories': '기본 분류 설정',
+  'admin-reports': '신고 관리',
+  settings: '설정',
+  'settings-account': '계정정보',
+  'settings-account-edit': '가입정보 변경',
+}
+const pageTitle = computed(() => {
+  const n = route.name
+  if (n === 'board' || n === 'board-detail') return boardLabel(route.params.category)
+  if (n === 'board-write' || n === 'board-edit') return route.params.id ? '글 수정' : '글쓰기'
+  return TITLES[n] || '돈돼지 가계부'
+})
 
 async function handleLogout() {
   await auth.logout()
@@ -17,20 +49,25 @@ async function handleLogout() {
 <template>
   <header class="app-header">
     <div class="header-left">
-      <button v-if="auth.isAuthenticated" class="hamburger" type="button" aria-label="메뉴" @click="ui.toggleSidebar()">
+      <button v-if="auth.isAuthenticated || demo.on" class="hamburger" type="button" aria-label="메뉴" @click="ui.toggleSidebar()">
         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
           <path d="M3 12h18" /><path d="M3 6h18" /><path d="M3 18h18" />
         </svg>
       </button>
-      <RouterLink to="/" class="brand">
-        <img class="brand-mark" src="/logo-piggy.png" alt="" aria-hidden="true" />
-        <span class="brand-text">돈돼지 가계부</span>
-      </RouterLink>
+      <h1 class="page-title">{{ pageTitle }}</h1>
     </div>
 
     <div class="header-right">
       <template v-if="auth.isAuthenticated">
+        <RouterLink to="/settings/account" class="me" title="계정정보">
+          <UserAvatar
+            :name="auth.user?.name || auth.user?.loginId"
+            :google-picture="auth.user?.googlePicture"
+            :profile-image="auth.user?.profileImage"
+            :size="26"
+          />
           <span class="username">{{ auth.user?.name || auth.user?.loginId }}님</span>
+        </RouterLink>
         <IconBtn icon="logout" title="로그아웃" @click="handleLogout" />
       </template>
       <IconBtn v-else icon="login" title="로그인" variant="primary" @click="ui.openLogin()" />
@@ -43,8 +80,11 @@ async function handleLogout() {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  height: 56px;
-  padding: 0 1.5rem;
+  /* height 대신 min-height — 네이티브에서 layout-top 이 상단 safe-area 패딩을 더하므로
+     (box-sizing:border-box) 고정 height 면 콘텐츠가 눌린다. min-height 로 헤더가 커지게. */
+  min-height: 56px;
+  /* 세로 패딩으로 버튼/타이틀이 하단 구분선에 붙지 않게 (상단 패딩은 네이티브에서 layout-top 이 override). */
+  padding: 0.5rem 1.5rem;
   background: var(--color-background-soft);
   border-bottom: 1px solid var(--color-border);
 }
@@ -66,43 +106,46 @@ async function handleLogout() {
   width: 22px;
   height: 22px;
 }
-.brand {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.45rem;
+.page-title {
   font-size: 1.2rem;
   font-weight: 700;
   color: var(--color-heading);
-}
-.brand:hover {
-  background: transparent;
-}
-.brand-mark {
-  height: 28px;
-  width: auto;
-  max-width: 38px;
-  object-fit: contain;
-  flex-shrink: 0;
-}
-.brand-text {
   letter-spacing: -0.01em;
   white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 .header-right {
   display: flex;
   align-items: center;
   gap: 0.75rem;
 }
+.me {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  color: var(--color-text);
+}
+.me:hover {
+  opacity: 0.85;
+}
 .username {
   font-size: 0.9rem;
 }
+@media (max-width: 480px) {
+  /* 좁은 폰 화면: 이름 숨기고 아바타만 */
+  .username {
+    display: none;
+  }
+}
 
 @media (max-width: 768px) {
   .hamburger {
     display: inline-flex;
   }
   .app-header {
-    padding: 0 1rem;
+    /* 세로 패딩 유지(로그인 버튼이 하단 구분선에 붙지 않게). 상단은 네이티브에서 layout-top override. */
+    padding: 0.5rem 1rem;
   }
   /* 좁은 화면(폰/앱): 브랜드명 텍스트 숨기고 로고만 — 두 줄 줄바꿈 방지 */
   .brand-text {

src/components/layout/AppSidebar.vue

@@ -1,29 +1,84 @@
 <script setup>
+import { computed } from 'vue'
 import { RouterLink } from 'vue-router'
 import { useAuthStore } from '@/stores/auth'
 import { useUiStore } from '@/stores/ui'
 import { BOARDS } from '@/constants/boards'
+import { demo } from '@/demo'
 
 const auth = useAuthStore()
 const ui = useUiStore()
+// 로그인 또는 둘러보기(데모)면 메뉴 노출. 데모에선 잠금 배지를 함께 표시.
+const showMenu = computed(() => auth.isAuthenticated || demo.on)
+// 유료 전용 메뉴 잠금 배지: 데모이거나, 로그인했지만 무료 회원일 때.
+const lockPremium = computed(() => demo.on || (auth.isAuthenticated && !auth.isPremium))
+
+// 메뉴 아이콘 (lucide 스타일 인라인 SVG path — 하단 내비와 동일 톤). 값은 정적/신뢰 마크업.
+const icons = {
+  entries: '<line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/>',
+  stats: '<line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/>',
+  recurrings: '<polyline points="17 1 21 5 17 9"/><path d="M3 11V9a4 4 0 0 1 4-4h14"/><polyline points="7 23 3 19 7 15"/><path d="M21 13v2a4 4 0 0 1-4 4H3"/>',
+  wallets: '<rect x="1" y="4" width="22" height="16" rx="2" ry="2"/><line x1="1" y1="10" x2="23" y2="10"/>',
+  categories: '<path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>',
+  budget: '<path d="M21.21 15.89A10 10 0 1 1 8 2.83"/><path d="M22 12A10 10 0 0 0 12 2v10z"/>',
+  tags: '<path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"/><line x1="7" y1="7" x2="7.01" y2="7"/>',
+  board: '<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>',
+  users: '<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/>',
+  sliders: '<line x1="4" y1="21" x2="4" y2="14"/><line x1="4" y1="10" x2="4" y2="3"/><line x1="12" y1="21" x2="12" y2="12"/><line x1="12" y1="8" x2="12" y2="3"/><line x1="20" y1="21" x2="20" y2="16"/><line x1="20" y1="12" x2="20" y2="3"/><line x1="1" y1="14" x2="7" y2="14"/><line x1="9" y1="8" x2="15" y2="8"/><line x1="17" y1="16" x2="23" y2="16"/>',
+  flag: '<path d="M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z"/><line x1="4" y1="22" x2="4" y2="15"/>',
+  repay: '<polyline points="23 18 13.5 8.5 8.5 13.5 1 6"/><polyline points="17 18 23 18 23 12"/>',
+}
 </script>
 
 <template>
   <aside class="app-sidebar">
     <div class="drawer-head">
-      <span class="drawer-title">메뉴</span>
+      <RouterLink to="/" class="brand" @click="ui.closeSidebar()">
+        <img class="brand-mark" src="/logo-piggy.png" alt="" aria-hidden="true" />
+        <span class="brand-text">돈돼지 가계부</span>
+      </RouterLink>
       <button class="drawer-close" type="button" aria-label="닫기" @click="ui.closeSidebar()">×</button>
     </div>
     <nav class="menu">
       <!-- 가계부 영역 (홈은 하단 내비게이션으로 이동) -->
-      <template v-if="auth.isAuthenticated">
-        <RouterLink to="/account/entries" class="menu-item">가계부 내역</RouterLink>
-        <RouterLink to="/account/stats" class="menu-item">통계</RouterLink>
-        <RouterLink to="/account/recurrings" class="menu-item">고정 지출</RouterLink>
-        <RouterLink to="/account/wallets" class="menu-item">계좌 관리</RouterLink>
-        <RouterLink to="/account/categories" class="menu-item">분류 관리</RouterLink>
-        <RouterLink to="/account/budget" class="menu-item">예산 설정</RouterLink>
-        <RouterLink to="/account/tags" class="menu-item">태그 관리</RouterLink>
+      <template v-if="showMenu">
+        <RouterLink to="/account/entries" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.entries" />
+          <span>가계부 내역</span>
+        </RouterLink>
+        <RouterLink to="/account/stats" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.stats" />
+          <span>통계</span>
+          <span v-if="lockPremium" class="lock-badge">🔒</span>
+        </RouterLink>
+        <RouterLink to="/account/recurrings" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.recurrings" />
+          <span>정기결제</span>
+          <!-- 무료도 2건까지 사용 가능 → 🔒 미표시 -->
+        </RouterLink>
+        <RouterLink to="/account/wallets" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.wallets" />
+          <span>계좌 관리</span>
+        </RouterLink>
+        <RouterLink to="/account/repayments" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.repay" />
+          <span>대출·할부 상환</span>
+          <span v-if="lockPremium" class="lock-badge">🔒</span>
+        </RouterLink>
+        <RouterLink to="/account/categories" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.categories" />
+          <span>분류 관리</span>
+        </RouterLink>
+        <RouterLink to="/account/budget" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.budget" />
+          <span>예산 설정</span>
+          <span v-if="lockPremium" class="lock-badge">🔒</span>
+        </RouterLink>
+        <RouterLink to="/account/tags" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.tags" />
+          <span>태그 관리</span>
+          <span v-if="lockPremium" class="lock-badge">🔒</span>
+        </RouterLink>
 
         <!-- 게시판 영역 -->
         <hr class="menu-divider" />
@@ -32,15 +87,36 @@ const ui = useUiStore()
           :key="b.key"
           :to="`/board/${b.key}`"
           class="menu-item"
-        >{{ b.label }}</RouterLink>
+        >
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.board" />
+          <span>{{ b.label }}</span>
+          <span v-if="demo.on" class="lock-badge">🔒</span>
+        </RouterLink>
+        <RouterLink v-if="auth.isAuthenticated" to="/my-board" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.entries" />
+          <span>내 글·댓글</span>
+        </RouterLink>
       </template>
 
       <!-- 관리자 영역 -->
       <template v-if="auth.user?.role === 'ADMIN'">
         <hr class="menu-divider" />
-        <RouterLink to="/users" class="menu-item">회원 관리</RouterLink>
-        <RouterLink to="/admin/tags" class="menu-item">태그 관리(관리자)</RouterLink>
-        <RouterLink to="/admin/default-categories" class="menu-item">기본 분류 설정</RouterLink>
+        <RouterLink to="/users" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.users" />
+          <span>회원 관리</span>
+        </RouterLink>
+        <RouterLink to="/admin/tags" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.tags" />
+          <span>태그 관리(관리자)</span>
+        </RouterLink>
+        <RouterLink to="/admin/default-categories" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.sliders" />
+          <span>기본 분류 설정</span>
+        </RouterLink>
+        <RouterLink to="/admin/reports" class="menu-item">
+          <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" v-html="icons.flag" />
+          <span>신고 관리</span>
+        </RouterLink>
       </template>
     </nav>
   </aside>
@@ -50,28 +126,42 @@ const ui = useUiStore()
 .app-sidebar {
   background: var(--color-background-soft);
   border-right: 1px solid var(--color-border);
-  padding: 1rem 0;
-}
-.drawer-head {
-  display: none;
-}
-@media (max-width: 768px) {
-  .app-sidebar {
-    background: var(--color-background);
-    min-height: 100%;
+  /* iOS 상태바(노치) 영역만큼 위 여백 — 드로어 상단이 상태바에 가리지 않도록 */
+  padding: env(safe-area-inset-top, 0) 0 1rem;
 }
 .drawer-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
-    padding: 0.5rem 1rem 0.75rem;
-    border-bottom: 1px solid var(--color-border);
+  height: 56px; /* 헤더 높이와 맞춰 상단 정렬 (하단 보더 일치) */
+  padding: 0 1.1rem;
   margin-bottom: 0.5rem;
+  border-bottom: 1px solid var(--color-border);
 }
-  .drawer-title {
+.brand {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.45rem;
+  font-size: 1.15rem;
   font-weight: 700;
+  color: var(--color-heading);
+}
+.brand:hover {
+  background: transparent;
+}
+.brand-mark {
+  height: 26px;
+  width: auto;
+  max-width: 34px;
+  object-fit: contain;
+  flex-shrink: 0;
+}
+.brand-text {
+  letter-spacing: -0.01em;
+  white-space: nowrap;
 }
 .drawer-close {
+  display: none; /* 데스크톱: 숨김 (모바일 드로어에서만 노출) */
   border: 0;
   background: transparent;
   color: var(--color-text);
@@ -79,16 +169,41 @@ const ui = useUiStore()
   line-height: 1;
   cursor: pointer;
 }
+@media (max-width: 768px) {
+  .app-sidebar {
+    background: var(--color-background);
+    min-height: 100%;
+  }
+  .drawer-close {
+    display: inline-flex;
+  }
 }
 .menu {
   display: flex;
   flex-direction: column;
 }
 .menu-item {
+  display: flex;
+  align-items: center;
+  gap: 0.7rem;
   padding: 0.7rem 1.5rem;
   color: var(--color-text);
   font-size: 0.95rem;
 }
+.menu-icon {
+  width: 18px;
+  height: 18px;
+  flex: none;
+  opacity: 0.8;
+}
+.lock-badge {
+  margin-left: auto;
+  font-size: 0.72rem;
+  opacity: 0.55;
+}
+.menu-item.router-link-exact-active .menu-icon {
+  opacity: 1;
+}
 .menu-divider {
   border: 0;
   border-top: 1px solid var(--color-border);

src/components/ui/AccountPicker.vue

@@ -0,0 +1,163 @@
+<script setup>
+// 계좌 선택기: 종류(대분류) 클릭 → 해당 종류 계좌(소분류) 펼침. CategoryPicker 형태.
+import { computed, ref, watch } from 'vue'
+import BottomSheet from './BottomSheet.vue'
+
+const props = defineProps({
+  modelValue: { type: [String, Number], default: '' },
+  wallets: { type: Array, default: () => [] }, // { id, name, type, issuer }
+  title: { type: String, default: '계좌 선택' },
+  placeholder: { type: String, default: '계좌를 선택하세요' },
+  disabled: { type: Boolean, default: false },
+  emptyText: { type: String, default: '선택할 계좌가 없습니다' },
+  allLabel: { type: String, default: '' }, // 필터용 '전체' 옵션(설정 시 노출)
+})
+const emit = defineEmits(['update:modelValue'])
+
+const KINDS = [
+  { key: 'BANK', label: '은행계좌' },
+  { key: 'CASH', label: '현금' },
+  { key: 'CARD', label: '카드' },
+  { key: 'LOAN', label: '대출' },
+  { key: 'MINUS', label: '마이너스' },
+  { key: 'INVEST', label: '투자' },
+]
+const groups = computed(() =>
+  KINDS.map((k) => ({ ...k, items: props.wallets.filter((w) => w.type === k.key) })).filter(
+    (g) => g.items.length,
+  ),
+)
+const selected = computed(() => props.wallets.find((w) => w.id === props.modelValue) || null)
+const triggerLabel = computed(() => {
+  if (selected.value) return selected.value.name
+  if (props.allLabel && !props.modelValue) return props.allLabel
+  return props.placeholder
+})
+const isEmptyState = computed(() => !selected.value && !(props.allLabel && !props.modelValue))
+
+const open = ref(false)
+const expanded = ref('')
+const expandedGroup = computed(() => groups.value.find((g) => g.key === expanded.value) || null)
+watch(open, (o) => {
+  if (o) expanded.value = selected.value?.type || (groups.value.length === 1 ? groups.value[0].key : '')
+})
+function toggle(k) {
+  expanded.value = expanded.value === k ? '' : k
+}
+function pick(id) {
+  emit('update:modelValue', id)
+  open.value = false
+}
+</script>
+
+<template>
+  <button
+    type="button" class="ap-trigger" :class="{ empty: isEmptyState }"
+    :disabled="disabled" @click="open = true"
+  >
+    <span class="ap-label">{{ triggerLabel }}</span>
+    <span class="ap-caret">▾</span>
+  </button>
+
+  <BottomSheet v-model="open" :title="title">
+    <div v-if="groups.length" class="ap-picker">
+      <div class="ap-grid">
+        <button
+          v-if="allLabel"
+          type="button" class="ap-chip all" :class="{ active: !modelValue }"
+          @click="pick('')"
+        >{{ allLabel }}</button>
+        <button
+          v-for="g in groups" :key="g.key"
+          type="button" class="ap-chip major" :class="{ active: expanded === g.key }"
+          @click="toggle(g.key)"
+        >{{ g.label }}</button>
+      </div>
+      <div v-if="expandedGroup" class="ap-sub-grid">
+        <button
+          v-for="w in expandedGroup.items" :key="w.id"
+          type="button" class="ap-chip sub" :class="{ active: w.id === modelValue }"
+          @click="pick(w.id)"
+        >{{ w.name }}</button>
+      </div>
+    </div>
+    <p v-else class="ap-empty">{{ emptyText }}</p>
+  </BottomSheet>
+</template>
+
+<style scoped>
+.ap-trigger {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  width: 100%;
+  padding: 0.55rem 0.75rem;
+  border: 1px solid var(--color-border);
+  border-radius: 6px;
+  background: var(--color-background-soft);
+  color: var(--color-text);
+  font-size: 0.9rem;
+  cursor: pointer;
+  text-align: left;
+}
+.ap-trigger:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+.ap-trigger.empty .ap-label {
+  opacity: 0.5;
+}
+.ap-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.ap-caret {
+  opacity: 0.5;
+  font-size: 0.8rem;
+  flex-shrink: 0;
+}
+.ap-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  padding: 0.2rem 0 0.4rem;
+}
+.ap-sub-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  padding: 0.5rem;
+  margin-bottom: 0.4rem;
+  border-radius: 0 6px 6px 6px;
+  background: var(--color-background-mute);
+  border-left: 3px solid hsla(160, 100%, 37%, 0.4);
+}
+.ap-chip {
+  flex: 1 1 calc(25% - 0.35rem);
+  min-width: 0;
+  padding: 0.5rem 0.4rem;
+  border: 1px solid var(--color-border);
+  border-radius: 6px;
+  background: transparent;
+  color: var(--color-text);
+  font-size: 0.82rem;
+  cursor: pointer;
+  text-align: center;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.ap-chip.active {
+  border-color: hsla(160, 100%, 37%, 1);
+  background: hsla(160, 100%, 37%, 0.1);
+  color: hsla(160, 100%, 37%, 1);
+  font-weight: 600;
+}
+.ap-empty {
+  padding: 1.2rem 0.4rem;
+  opacity: 0.6;
+  text-align: center;
+}
+</style>

src/components/ui/AppModal.vue

@@ -0,0 +1,88 @@
+<script setup>
+defineProps({
+  modelValue: { type: Boolean, required: true },
+  title: { type: String, default: '' },
+  zIndex: { type: Number, default: 1000 },
+})
+defineEmits(['update:modelValue'])
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition name="am">
+      <div v-if="modelValue" class="am-wrap" :style="{ zIndex }">
+        <div class="am-panel" role="dialog" aria-modal="true">
+          <button class="am-close" type="button" @click="$emit('update:modelValue', false)">×</button>
+          <div class="am-inner">
+            <h2 v-if="title" class="am-title">{{ title }}</h2>
+            <slot />
+          </div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>
+
+<style scoped>
+.am-wrap {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.4);
+}
+
+.am-panel {
+  position: absolute;
+  inset: 0;
+  background: var(--color-background);
+  overflow-y: auto;
+  padding: calc(3rem + env(safe-area-inset-top)) 1.25rem calc(2rem + env(safe-area-inset-bottom));
+}
+
+.am-inner {
+  max-width: 460px;
+  margin: 0 auto;
+}
+
+.am-close {
+  position: absolute;
+  top: calc(0.5rem + env(safe-area-inset-top));
+  right: 0.6rem;
+  width: 2rem;
+  height: 2rem;
+  border: 0;
+  background: transparent;
+  font-size: 1.5rem;
+  line-height: 1;
+  cursor: pointer;
+  color: var(--color-text);
+  z-index: 1;
+}
+
+.am-title {
+  margin-bottom: 1.25rem;
+  font-size: 1.2rem;
+  text-align: center;
+}
+
+/* ── 슬라이드업 애니메이션 ── */
+.am-enter-active {
+  transition: background 0.25s ease;
+}
+.am-leave-active {
+  transition: background 0.2s ease;
+}
+.am-enter-from,
+.am-leave-to {
+  background: rgba(0, 0, 0, 0);
+}
+.am-enter-active .am-panel {
+  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
+}
+.am-leave-active .am-panel {
+  transition: transform 0.22s cubic-bezier(0.4, 0, 1, 1);
+}
+.am-enter-from .am-panel,
+.am-leave-to .am-panel {
+  transform: translateY(100%);
+}
+</style>

src/components/ui/BottomSheet.vue

@@ -0,0 +1,93 @@
+<script setup>
+// 아래에서 올라오는 바텀시트(콘텐츠 높이). 선택 항목(계좌·분류 등)에 사용.
+defineProps({
+  modelValue: { type: Boolean, required: true },
+  title: { type: String, default: '' },
+})
+defineEmits(['update:modelValue'])
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition name="bs">
+      <div v-if="modelValue" class="bs-wrap" @click.self="$emit('update:modelValue', false)">
+        <div class="bs-panel" role="dialog" aria-modal="true">
+          <div class="bs-grip" @click="$emit('update:modelValue', false)"></div>
+          <div class="bs-head">
+            <span class="bs-title">{{ title }}</span>
+            <button type="button" class="bs-close" aria-label="닫기" @click="$emit('update:modelValue', false)">×</button>
+          </div>
+          <div class="bs-body"><slot /></div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>
+
+<style scoped>
+.bs-wrap {
+  position: fixed;
+  inset: 0;
+  z-index: 1100;
+  background: rgba(0, 0, 0, 0.4);
+  display: flex;
+  align-items: flex-end;
+}
+.bs-panel {
+  width: 100%;
+  max-width: 560px;
+  margin: 0 auto;
+  background: var(--color-background);
+  border-radius: 16px 16px 0 0;
+  max-height: 85vh;
+  overflow-y: auto;
+  padding: 0.4rem 1.1rem calc(1rem + env(safe-area-inset-bottom, 0));
+  box-shadow: 0 -8px 30px rgba(0, 0, 0, 0.25);
+}
+.bs-grip {
+  width: 40px;
+  height: 4px;
+  border-radius: 2px;
+  background: var(--color-border);
+  margin: 0.4rem auto 0.2rem;
+  cursor: pointer;
+}
+.bs-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.3rem 0 0.6rem;
+}
+.bs-title {
+  font-weight: 700;
+  font-size: 1rem;
+}
+.bs-close {
+  border: 0;
+  background: transparent;
+  font-size: 1.4rem;
+  line-height: 1;
+  color: var(--color-text);
+  cursor: pointer;
+}
+.bs-enter-active {
+  transition: background 0.2s ease;
+}
+.bs-leave-active {
+  transition: background 0.18s ease;
+}
+.bs-enter-from,
+.bs-leave-to {
+  background: rgba(0, 0, 0, 0);
+}
+.bs-enter-active .bs-panel {
+  transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
+}
+.bs-leave-active .bs-panel {
+  transition: transform 0.2s cubic-bezier(0.4, 0, 1, 1);
+}
+.bs-enter-from .bs-panel,
+.bs-leave-to .bs-panel {
+  transform: translateY(100%);
+}
+</style>

src/components/ui/CategoryPicker.vue

@@ -0,0 +1,535 @@
+<script setup>
+import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
+import Sortable from 'sortablejs'
+import { accountApi } from '@/api/accountApi'
+
+const props = defineProps({
+  modelValue:  { type: String,  default: '' },
+  type:        { type: String,  required: true },
+  categories:  { type: Array,   default: () => [] },
+  disabled:    { type: Boolean, default: false },
+  admin:       { type: Boolean, default: false },
+  reorderable: { type: Boolean, default: false },
+  hideAdd:     { type: Boolean, default: false }, // 분류 추가(+대분류/+소분류) 버튼 숨김 (필터 등 선택 전용)
+})
+const emit = defineEmits(['update:modelValue', 'category-added', 'rename', 'delete', 'reorder'])
+
+// ─── accordion state ───────────────────────────────────────────────────
+const categoryMajor = ref('')
+
+const majorOptions = computed(() =>
+  props.categories.filter((c) => c.type === props.type && c.parentId == null)
+)
+// select 모드: 4개씩 행 분할
+const majorRows = computed(() => {
+  const rows = []
+  for (let i = 0; i < majorOptions.value.length; i += 4)
+    rows.push(majorOptions.value.slice(i, i + 4))
+  return rows
+})
+// admin 일반 모드: 2개씩 행 분할 (이름+아이콘 공간 확보)
+const adminRows = computed(() => {
+  const rows = []
+  for (let i = 0; i < majorOptions.value.length; i += 2)
+    rows.push(majorOptions.value.slice(i, i + 2))
+  return rows
+})
+const selectedMajorObj = computed(() =>
+  majorOptions.value.find((m) => m.name === categoryMajor.value) ?? null
+)
+function subsByMajor(majorId) {
+  return props.categories.filter((c) => c.parentId === majorId)
+}
+
+// select 모드: 클릭 시 accordion 토글 + 값 emit
+function onMajorClick(major) {
+  if (categoryMajor.value === major.name) {
+    categoryMajor.value = ''
+    emit('update:modelValue', '')
+  } else {
+    categoryMajor.value = major.name
+    if (!subsByMajor(major.id).length) emit('update:modelValue', major.name)
+    else emit('update:modelValue', '')
+  }
+}
+// admin 모드: 클릭 시 accordion 토글만 (값 emit 없음)
+function onAdminMajorClick(major) {
+  categoryMajor.value = categoryMajor.value === major.name ? '' : major.name
+}
+
+// modelValue / type / categories 변경 시 대분류 상태 동기화
+function syncFromValue() {
+  if (props.admin) return
+  const cur = props.modelValue
+  if (!cur) { categoryMajor.value = ''; return }
+  const c = props.categories.find((x) => x.type === props.type && x.name === cur)
+  if (c && c.parentId != null) {
+    const parent = props.categories.find((x) => x.id === c.parentId)
+    categoryMajor.value = parent ? parent.name : cur
+  } else {
+    categoryMajor.value = cur
+  }
+}
+watch(() => [props.modelValue, props.type, props.categories], syncFromValue, { immediate: true })
+
+// ─── 인라인 분류 추가 ──────────────────────────────────────────────────
+const addingCategory = ref(false)
+const addingAsMajor  = ref(true)
+const newCategoryName = ref('')
+const catSubmitting  = ref(false)
+
+function startAddMajor() {
+  if (!props.admin) { categoryMajor.value = ''; emit('update:modelValue', '') }
+  newCategoryName.value = ''
+  addingAsMajor.value = true
+  addingCategory.value = true
+}
+function startAddSub() {
+  newCategoryName.value = ''
+  addingAsMajor.value = false
+  addingCategory.value = true
+}
+function cancelAdd() {
+  addingCategory.value = false
+  newCategoryName.value = ''
+}
+async function confirmAdd() {
+  const name = newCategoryName.value.trim()
+  if (!name) return
+  catSubmitting.value = true
+  const parent = props.categories.find(
+    (c) => c.type === props.type && c.parentId == null && c.name === categoryMajor.value,
+  )
+  const parentId = parent ? parent.id : null
+  try {
+    await accountApi.createCategory({ type: props.type, name, parentId })
+    emit('category-added')
+    if (!props.admin) {
+      emit('update:modelValue', name)
+      if (!parentId) categoryMajor.value = name
+    } else {
+      if (!parentId) categoryMajor.value = name
+    }
+    cancelAdd()
+  } catch (e) {
+    if (e.response?.status === 409) {
+      if (!props.admin) emit('update:modelValue', name)
+      syncFromValue()
+      cancelAdd()
+    } else {
+      alert(e.response?.data?.message || '분류 추가에 실패했습니다.')
+    }
+  } finally {
+    catSubmitting.value = false
+  }
+}
+
+// ─── Admin: 인라인 이름 수정 ───────────────────────────────────────────
+const editingId = ref(null)
+const editingName = ref('')
+const editingCategory = ref(null)
+
+function startEdit(c) {
+  editingId.value = c.id
+  editingName.value = c.name
+  editingCategory.value = c
+  nextTick(() => {
+    const input = document.querySelector('.adm-edit-input')
+    if (input) input.focus()
+  })
+}
+function cancelEdit() {
+  editingId.value = null
+  editingName.value = ''
+  editingCategory.value = null
+}
+function confirmEdit() {
+  const name = editingName.value.trim()
+  if (name && editingCategory.value && name !== editingCategory.value.name) {
+    emit('rename', editingCategory.value, name)
+  }
+  cancelEdit()
+}
+
+// ─── Admin: SortableJS (순서변경 모드에서만 활성) ─────────────────────
+const majorGridEl = ref(null)
+const subGridEl   = ref(null)
+let majorSortable = null
+let subSortable   = null
+
+function destroySortables() {
+  majorSortable?.destroy(); majorSortable = null
+  subSortable?.destroy();   subSortable   = null
+}
+function initMajorSortable() {
+  if (!props.admin || !props.reorderable || !majorGridEl.value) return
+  majorSortable?.destroy()
+  majorSortable = Sortable.create(majorGridEl.value, {
+    handle: '.adm-handle',
+    draggable: '.admin-chip',
+    animation: 150,
+    onEnd: () => {
+      const ids = [...majorGridEl.value.querySelectorAll(':scope > .admin-chip')]
+        .map((el) => Number(el.dataset.id))
+      emit('reorder', ids)
+    },
+  })
+}
+function initSubSortable() {
+  if (!props.admin || !props.reorderable || !subGridEl.value) return
+  subSortable?.destroy()
+  subSortable = Sortable.create(subGridEl.value, {
+    handle: '.adm-handle',
+    draggable: '.admin-chip',
+    animation: 150,
+    onEnd: () => {
+      const ids = [...subGridEl.value.querySelectorAll(':scope > .admin-chip')]
+        .map((el) => Number(el.dataset.id))
+      if (ids.length) emit('reorder', ids)
+    },
+  })
+}
+
+watch(majorGridEl, (el) => { if (el && props.admin && props.reorderable) initMajorSortable() })
+watch(subGridEl,   (el) => { if (el && props.admin && props.reorderable) initSubSortable() })
+watch(
+  () => [props.admin, props.reorderable, props.categories],
+  async () => {
+    if (!props.admin || !props.reorderable) { destroySortables(); return }
+    await nextTick()
+    initMajorSortable()
+    initSubSortable()
+  },
+)
+
+onBeforeUnmount(destroySortables)
+</script>
+
+<template>
+  <!-- ═══ SELECT MODE ══════════════════════════════════════════ -->
+  <template v-if="!admin">
+    <div v-if="!addingCategory" class="cat-picker">
+      <template v-for="(row, rowIdx) in majorRows" :key="rowIdx">
+        <div class="acc-major-grid">
+          <button
+            v-for="m in row" :key="m.id"
+            type="button" class="acc-chip major"
+            :class="{ active: categoryMajor === m.name }"
+            :disabled="disabled"
+            @click="onMajorClick(m)"
+          >{{ m.name }}</button>
+        </div>
+        <div
+          v-if="selectedMajorObj && row.some(m => m.id === selectedMajorObj.id)"
+          class="acc-sub-grid"
+        >
+          <button
+            v-for="s in subsByMajor(selectedMajorObj.id)" :key="s.id"
+            type="button" class="acc-chip sub"
+            :class="{ active: modelValue === s.name }"
+            :disabled="disabled"
+            @click="$emit('update:modelValue', s.name)"
+          >{{ s.name }}</button>
+          <button v-if="!hideAdd" type="button" class="acc-chip add-chip sub-add" :disabled="disabled" @click="startAddSub">+ 소분류</button>
+        </div>
+      </template>
+      <button v-if="!hideAdd" type="button" class="acc-chip add-chip" :disabled="disabled" @click="startAddMajor">+ 대분류</button>
+    </div>
+    <div v-else class="cat-input">
+      <input
+        v-model="newCategoryName" type="text"
+        :placeholder="addingAsMajor
+          ? (type === 'EXPENSE' ? '새 지출 대분류' : '새 수입 대분류')
+          : `${categoryMajor} > 새 소분류`"
+        :disabled="catSubmitting"
+        @keyup.enter.prevent="confirmAdd"
+      />
+      <button type="button" class="cat-add-btn primary" :disabled="catSubmitting" @click="confirmAdd">확인</button>
+      <button type="button" class="cat-add-btn" :disabled="catSubmitting" @click="cancelAdd">취소</button>
+    </div>
+  </template>
+
+  <!-- ═══ ADMIN MODE ════════════════════════════════════════════ -->
+  <template v-else>
+    <div v-if="!addingCategory" class="cat-picker">
+
+      <!-- ─── 일반 모드: 행 단위, 소분류 정위치 ─────────────── -->
+      <template v-if="!reorderable">
+        <template v-for="(row, rowIdx) in adminRows" :key="rowIdx">
+          <div class="acc-major-grid">
+            <div
+              v-for="m in row" :key="m.id"
+              class="acc-chip major admin-chip"
+              :class="{ active: categoryMajor === m.name }"
+              @click="onAdminMajorClick(m)"
+            >
+              <template v-if="editingId === m.id">
+                <input
+                  v-model="editingName" class="adm-edit-input"
+                  @keyup.enter.stop="confirmEdit" @keyup.escape="cancelEdit" @click.stop
+                />
+                <button type="button" class="adm-ok" @mousedown.prevent @click.stop="confirmEdit">✓</button>
+              </template>
+              <span v-else class="adm-label">{{ m.name }}</span>
+              <button v-if="editingId !== m.id" type="button" class="adm-edit-btn" title="이름 수정" @click.stop="startEdit(m)">✏</button>
+              <button type="button" class="adm-del" title="삭제" @click.stop="$emit('delete', m)">✕</button>
+            </div>
+          </div>
+          <!-- 이 행에 선택된 대분류가 있을 때만 바로 아래에 소분류 트레이 노출 -->
+          <div
+            v-if="selectedMajorObj && row.some(m => m.id === selectedMajorObj.id)"
+            class="acc-sub-grid adm-sub-grid"
+          >
+            <div
+              v-for="s in subsByMajor(selectedMajorObj.id)" :key="s.id"
+              class="acc-chip sub admin-chip"
+              :data-id="s.id"
+            >
+              <template v-if="editingId === s.id">
+                <input
+                  v-model="editingName" class="adm-edit-input"
+                  @keyup.enter.stop="confirmEdit" @keyup.escape="cancelEdit" @click.stop
+                />
+                <button type="button" class="adm-ok" @mousedown.prevent @click.stop="confirmEdit">✓</button>
+              </template>
+              <span v-else class="adm-label">{{ s.name }}</span>
+              <button v-if="editingId !== s.id" type="button" class="adm-edit-btn" title="이름 수정" @click.stop="startEdit(s)">✏</button>
+              <button type="button" class="adm-del" title="삭제" @click.stop="$emit('delete', s)">✕</button>
+            </div>
+            <button type="button" class="acc-chip add-chip sub-add" @click="startAddSub">+ 소분류</button>
+          </div>
+        </template>
+        <button type="button" class="acc-chip add-chip" @click="startAddMajor">+ 대분류</button>
+      </template>
+
+      <!-- ─── 순서변경 모드: flat 그리드 + SortableJS ──────── -->
+      <template v-else>
+        <div class="acc-major-grid adm-grid" ref="majorGridEl">
+          <div
+            v-for="m in majorOptions" :key="m.id"
+            class="acc-chip major admin-chip"
+            :class="{ active: categoryMajor === m.name }"
+            :data-id="m.id"
+            @click="onAdminMajorClick(m)"
+          >
+            <span class="adm-handle" @click.stop>⠿</span>
+            <span class="adm-label">{{ m.name }}</span>
+          </div>
+        </div>
+        <!-- 선택된 대분류의 소분류 순서 변경 -->
+        <div
+          v-if="selectedMajorObj"
+          class="acc-sub-grid adm-sub-grid"
+          ref="subGridEl"
+          :data-major="selectedMajorObj.id"
+        >
+          <div
+            v-for="s in subsByMajor(selectedMajorObj.id)" :key="s.id"
+            class="acc-chip sub admin-chip"
+            :data-id="s.id"
+          >
+            <span class="adm-handle" @click.stop>⠿</span>
+            <span class="adm-label">{{ s.name }}</span>
+          </div>
+        </div>
+      </template>
+
+    </div>
+    <div v-else class="cat-input">
+      <input
+        v-model="newCategoryName" type="text"
+        :placeholder="addingAsMajor
+          ? (type === 'EXPENSE' ? '새 지출 대분류' : '새 수입 대분류')
+          : `${categoryMajor} > 새 소분류`"
+        :disabled="catSubmitting"
+        @keyup.enter.prevent="confirmAdd"
+      />
+      <button type="button" class="cat-add-btn primary" :disabled="catSubmitting" @click="confirmAdd">확인</button>
+      <button type="button" class="cat-add-btn" :disabled="catSubmitting" @click="cancelAdd">취소</button>
+    </div>
+  </template>
+</template>
+
+<style scoped>
+.cat-picker {
+  display: flex;
+  flex-direction: column;
+  gap: 0.4rem;
+}
+.acc-major-grid,
+.acc-sub-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+}
+.acc-sub-grid {
+  padding: 0.45rem;
+  border-radius: 0 6px 6px 6px;
+  background: var(--color-background-mute);
+  border-left: 3px solid hsla(160, 100%, 37%, 0.4);
+}
+.acc-chip {
+  flex: 1 1 calc(25% - 0.35rem);
+  min-width: 0;
+  padding: 0.38rem 0.4rem;
+  border: 1px solid var(--color-border);
+  border-radius: 6px;
+  background: transparent;
+  cursor: pointer;
+  font-size: 0.82rem;
+  color: var(--color-text);
+  text-align: center;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.acc-chip:disabled { opacity: 0.45; cursor: not-allowed; }
+.acc-chip.major.active {
+  border-color: hsla(160, 100%, 37%, 1);
+  background: hsla(160, 100%, 37%, 0.1);
+  color: hsla(160, 100%, 37%, 1);
+  font-weight: 600;
+}
+.acc-chip.sub { background: transparent; }
+.acc-chip.sub.active {
+  border-color: hsla(160, 100%, 37%, 1);
+  background: hsla(160, 100%, 37%, 0.1);
+  color: hsla(160, 100%, 37%, 1);
+  font-weight: 600;
+}
+.acc-chip.add-chip {
+  opacity: 0.55;
+  border-style: dashed;
+}
+.acc-chip.add-chip.sub-add { flex: 0 0 auto; }
+
+/* ── admin 칩 공통 ──────────────────────────────────────── */
+/* 2개씩 한 줄 (이름+아이콘 공간 확보) */
+.admin-chip {
+  flex: 1 1 calc(50% - 0.35rem) !important;
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding: 0.32rem 0.4rem;
+  text-align: left;
+  cursor: default;
+  overflow: visible;
+}
+.adm-handle {
+  flex-shrink: 0;
+  cursor: grab;
+  color: var(--color-text);
+  opacity: 0.35;
+  font-size: 0.85rem;
+  touch-action: none;
+  user-select: none;
+  line-height: 1;
+}
+.adm-handle:active { cursor: grabbing; }
+.adm-label {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.adm-edit-input {
+  flex: 1;
+  min-width: 0;
+  padding: 0.1rem 0.3rem;
+  border: 1px solid var(--color-border);
+  border-radius: 3px;
+  background: var(--color-background);
+  color: var(--color-text);
+  font-size: 0.8rem;
+}
+.adm-ok {
+  flex-shrink: 0;
+  width: 1.3rem;
+  height: 1.3rem;
+  border: 1px solid hsla(160, 100%, 37%, 0.5);
+  border-radius: 3px;
+  background: hsla(160, 100%, 37%, 0.1);
+  color: hsla(160, 100%, 37%, 1);
+  font-size: 0.65rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.adm-edit-btn {
+  flex-shrink: 0;
+  width: 1.3rem;
+  height: 1.3rem;
+  border: 1px solid var(--color-border);
+  border-radius: 3px;
+  background: transparent;
+  color: var(--color-text);
+  opacity: 0.45;
+  font-size: 0.65rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.adm-edit-btn:hover { opacity: 0.9; }
+.adm-del {
+  flex-shrink: 0;
+  width: 1.3rem;
+  height: 1.3rem;
+  border: 1px solid rgba(192, 57, 43, 0.3);
+  border-radius: 3px;
+  background: rgba(192, 57, 43, 0.06);
+  color: #c0392b;
+  font-size: 0.65rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.adm-del:hover { background: rgba(192, 57, 43, 0.15); }
+
+.adm-sub-grid {
+  gap: 0.3rem;
+  background: var(--color-background-mute);
+  border-left: 3px solid hsla(160, 100%, 37%, 0.4);
+  border-radius: 0 6px 6px 6px;
+  padding: 0.45rem;
+}
+/* 소분류 칩은 트레이 배경이 보이도록 투명 처리 */
+.adm-sub-grid .admin-chip {
+  background: transparent;
+}
+
+/* ── 인라인 추가 입력 ──────────────────────────────────── */
+.cat-input {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  align-items: center;
+}
+.cat-input input {
+  flex: 1;
+  min-width: 0;
+  padding: 0.45rem 0.7rem;
+  border: 1px solid var(--color-border);
+  border-radius: 4px;
+  background: var(--color-background-soft);
+  color: var(--color-text);
+  font-size: 0.85rem;
+}
+.cat-add-btn {
+  padding: 0.38rem 0.7rem;
+  border: 1px solid var(--color-border);
+  border-radius: 4px;
+  background: var(--color-background-soft);
+  color: var(--color-text);
+  font-size: 0.82rem;
+  cursor: pointer;
+  white-space: nowrap;
+}
+.cat-add-btn.primary {
+  border-color: hsla(160, 100%, 37%, 1);
+  color: hsla(160, 100%, 37%, 1);
+}
+.cat-add-btn:disabled { opacity: 0.5; cursor: not-allowed; }
+</style>

src/components/ui/ChipSelect.vue

@@ -0,0 +1,84 @@
+<script setup>
+// select 대체 칩 선택기. 균일한 박스 그리드로 정렬(계좌 등 선택지가 적을 때 드롭다운 대신).
+// 사용: <ChipSelect v-model="form.walletId" :options="[{value,label}]" :disabled="..." />
+defineProps({
+  modelValue: { type: [String, Number], default: '' },
+  options: { type: Array, default: () => [] }, // [{ value, label }]
+  disabled: { type: Boolean, default: false },
+  emptyText: { type: String, default: '선택할 항목이 없습니다' },
+})
+const emit = defineEmits(['update:modelValue'])
+function pick(v, disabled) {
+  if (disabled) return
+  emit('update:modelValue', v)
+}
+</script>
+
+<template>
+  <div class="chip-select">
+    <button
+      v-for="o in options"
+      :key="String(o.value)"
+      type="button"
+      class="cs-chip"
+      :class="{ active: modelValue === o.value }"
+      :disabled="disabled"
+      :title="o.label"
+      @click="pick(o.value, disabled)"
+    >
+      {{ o.label }}
+    </button>
+    <span v-if="!options.length" class="cs-empty">{{ emptyText }}</span>
+  </div>
+</template>
+
+<style scoped>
+/* 계좌 선택 영역: 배경 패널 안에 칩 3개씩 균일 정렬 */
+.chip-select {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 0.4rem;
+  min-width: 0; /* 긴 계좌명이 그리드를 부모보다 넓게 밀어 가로 오버플로우 나는 것 방지 */
+  box-sizing: border-box;
+  background: rgba(127, 127, 127, 0.08);
+  border: 1px solid var(--color-border);
+  border-radius: 10px;
+  padding: 0.5rem;
+}
+.cs-chip {
+  min-width: 0; /* 그리드 아이템 기본 min-width:auto(=글자너비) 해제 → 칸이 줄고 긴 이름은 …로 */
+  padding: 0.5rem 0.5rem;
+  border: 1px solid var(--color-border-hover);
+  border-radius: 8px;
+  background: var(--color-background);
+  color: var(--color-text);
+  font-size: 0.85rem;
+  font-weight: 500;
+  cursor: pointer;
+  line-height: 1.3;
+  text-align: center;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  transition:
+    border-color 0.12s,
+    background 0.12s,
+    color 0.12s;
+}
+.cs-chip:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+.cs-chip.active {
+  border-color: hsla(160, 100%, 37%, 1);
+  background: hsla(160, 100%, 37%, 1);
+  color: #fff;
+  font-weight: 700;
+}
+.cs-empty {
+  grid-column: 1 / -1;
+  font-size: 0.82rem;
+  opacity: 0.55;
+  padding: 0.28rem 0;
+}
+</style>

src/components/ui/IconBtn.vue

@@ -27,6 +27,7 @@ const ICONS = {
   refresh: ['M23 4v6h-6', 'M1 20v-6h6', 'M3.51 9a9 9 0 0 1 14.85-3.36L23 10', 'M1 14l4.64 4.36A9 9 0 0 0 20.49 15'],
   filter: ['M22 3H2l8 9.46V19l4 2v-8.54L22 3z'],
   menu: ['M3 12h18', 'M3 6h18', 'M3 18h18'],
+  list: ['M8 6h13', 'M8 12h13', 'M8 18h13', 'M3 6h.01', 'M3 12h.01', 'M3 18h.01'],
   back: ['M19 12H5', 'M12 19l-7-7 7-7'],
   logout: ['M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4', 'M16 17l5-5-5-5', 'M21 12H9'],
   login: ['M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4', 'M10 17l5-5-5-5', 'M15 12H3'],
@@ -34,6 +35,7 @@ const ICONS = {
   send: ['M22 2L11 13', 'M22 2l-7 20-4-9-9-4 20-7z'],
   save: ['M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z', 'M17 21v-8H7v8', 'M7 3v5h8'],
   lock: ['M5 11h14a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2z', 'M8 11V7a4 4 0 0 1 8 0v4'],
+  sparkle: ['M12 4l1.6 6.4L20 12l-6.4 1.6L12 20l-1.6-6.4L4 12l6.4-1.6z'],
 }
 
 const paths = computed(() => ICONS[props.icon] || ICONS.plus)

src/components/ui/SheetSelect.vue

@@ -0,0 +1,111 @@
+<script setup>
+// 필드형 트리거를 누르면 바텀시트로 옵션을 보여주고 단일 선택. (계좌·카드 선택 등)
+import { computed, ref } from 'vue'
+import BottomSheet from './BottomSheet.vue'
+
+const props = defineProps({
+  modelValue: { type: [String, Number], default: '' },
+  options: { type: Array, default: () => [] }, // [{ value, label }]
+  placeholder: { type: String, default: '선택하세요' },
+  title: { type: String, default: '선택' },
+  disabled: { type: Boolean, default: false },
+  emptyText: { type: String, default: '선택할 항목이 없습니다' },
+})
+const emit = defineEmits(['update:modelValue'])
+
+const open = ref(false)
+const selected = computed(() => props.options.find((o) => o.value === props.modelValue) || null)
+function pick(o) {
+  emit('update:modelValue', o.value)
+  open.value = false
+}
+</script>
+
+<template>
+  <button
+    type="button" class="ss-trigger" :class="{ empty: !selected }"
+    :disabled="disabled" @click="open = true"
+  >
+    <span class="ss-label">{{ selected ? selected.label : placeholder }}</span>
+    <span class="ss-caret">▾</span>
+  </button>
+
+  <BottomSheet v-model="open" :title="title">
+    <div v-if="options.length" class="ss-chips">
+      <button
+        v-for="o in options" :key="o.value"
+        type="button" class="ss-chip" :class="{ active: o.value === modelValue }"
+        @click="pick(o)"
+      >{{ o.label }}</button>
+    </div>
+    <p v-else class="ss-empty">{{ emptyText }}</p>
+  </BottomSheet>
+</template>
+
+<style scoped>
+.ss-trigger {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  width: 100%;
+  padding: 0.55rem 0.75rem;
+  border: 1px solid var(--color-border);
+  border-radius: 6px;
+  background: var(--color-background-soft);
+  color: var(--color-text);
+  font-size: 0.9rem;
+  cursor: pointer;
+  text-align: left;
+}
+.ss-trigger:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+.ss-trigger.empty .ss-label {
+  opacity: 0.5;
+}
+.ss-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.ss-caret {
+  opacity: 0.5;
+  font-size: 0.8rem;
+  flex-shrink: 0;
+}
+/* CategoryPicker(.acc-chip)와 동일한 4열 균일 박스 그리드 */
+.ss-chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+  padding: 0.2rem 0 0.4rem;
+}
+.ss-chip {
+  flex: 1 1 calc(25% - 0.35rem);
+  min-width: 0;
+  padding: 0.5rem 0.4rem;
+  border: 1px solid var(--color-border);
+  border-radius: 6px;
+  background: transparent;
+  color: var(--color-text);
+  font-size: 0.82rem;
+  cursor: pointer;
+  text-align: center;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.ss-chip.active {
+  border-color: hsla(160, 100%, 37%, 1);
+  background: hsla(160, 100%, 37%, 0.1);
+  color: hsla(160, 100%, 37%, 1);
+  font-weight: 600;
+}
+.ss-empty {
+  padding: 1.2rem 0.4rem;
+  opacity: 0.6;
+  text-align: center;
+}
+</style>

src/composables/appBack.js

@@ -0,0 +1,39 @@
+import { Capacitor } from '@capacitor/core'
+import { App as CapApp } from '@capacitor/app'
+import { useUiStore } from '@/stores/ui'
+import { appLock } from '@/composables/appLock'
+
+// 통합 뒤로가기 처리 — 하드웨어 뒤로(capacitor.js)와 하단 내비 뒤로 버튼이 동일 동작.
+// 우선순위:
+//   1) 잠금 화면이면 우회 불가 → (네이티브) 종료
+//   2) 열린 전역 오버레이(회원가입/로그인/비번/사이드바) 닫기
+//   3) 화면 뒤로(히스토리)
+//   4) 최상위에서 '한 번 더 누르면 종료'(네이티브만, 실수 종료 방지)
+let exitArmed = false
+let exitTimer = null
+
+export function handleBack(router) {
+  const native = Capacitor.isNativePlatform()
+  const ui = useUiStore()
+
+  if (appLock.state.locked) {
+    if (native) CapApp.exitApp()
+    return
+  }
+
+  if (ui.signupOpen) { ui.closeSignup(); return }
+  if (ui.loginOpen) { ui.closeLogin(); return }
+  if (ui.passwordOpen) { ui.closePassword(); return }
+  if (ui.sidebarOpen) { ui.closeSidebar(); return }
+
+  if (window.history.length > 1) { router.back(); return }
+
+  // 최상위(더 갈 곳 없음)
+  if (native) {
+    if (exitArmed) { CapApp.exitApp(); return }
+    exitArmed = true
+    window.dispatchEvent(new CustomEvent('app:toast', { detail: '한 번 더 누르면 종료됩니다' }))
+    clearTimeout(exitTimer)
+    exitTimer = setTimeout(() => { exitArmed = false }, 2000)
+  }
+}

src/composables/appError.js

@@ -0,0 +1,16 @@
+import { reactive } from 'vue'
+
+// 전역 치명적 오류 상태. 컴포넌트 트리 밖에서 관리해, 렌더 오류로 화면이
+// 깨져도(흰 화면) App.vue 가 폴백 UI 를 대신 렌더할 수 있게 한다.
+export const appError = reactive({ hasError: false })
+
+export function reportFatal(err) {
+  // 콘솔에는 원본을 남기고, 사용자에겐 폴백 화면을 보여준다.
+  // eslint-disable-next-line no-console
+  console.error('[fatal]', err)
+  appError.hasError = true
+}
+
+export function clearFatal() {
+  appError.hasError = false
+}

src/composables/appLock.js

@@ -0,0 +1,67 @@
+import { reactive } from 'vue'
+
+// 앱 잠금(PIN). 자체 구현 — 네이티브 플러그인 없이 동작.
+// PIN 은 평문 저장하지 않고 SHA-256 해시만 보관. 기본 비활성(옵트인).
+// 갇힘 방지: 잠금 화면에서 'PIN 분실 → 로그아웃' 으로 disable + 로그아웃 가능.
+const KEY_ENABLED = 'applock:enabled'
+const KEY_HASH = 'applock:hash'
+
+export const PIN_LENGTH = 4
+
+const state = reactive({
+  enabled: localStorage.getItem(KEY_ENABLED) === '1',
+  locked: false,
+})
+
+// 카메라/갤러리/공유 등 앱 내 네이티브 동작을 호출하면 웹뷰가 잠깐 백그라운드로
+// 인식돼 잠금이 걸리는 오작동을 막기 위한 "잠금 일시중지" 창(timestamp).
+let suppressUntil = 0
+
+async function hashPin(pin) {
+  const data = new TextEncoder().encode('dondwaeji-applock:' + pin)
+  const buf = await crypto.subtle.digest('SHA-256', data)
+  return Array.from(new Uint8Array(buf)).map((b) => b.toString(16).padStart(2, '0')).join('')
+}
+
+export const appLock = {
+  state,
+  /** PIN 설정 + 잠금 활성화 */
+  async setPin(pin) {
+    localStorage.setItem(KEY_HASH, await hashPin(pin))
+    localStorage.setItem(KEY_ENABLED, '1')
+    state.enabled = true
+  },
+  /** 입력 PIN 검증 */
+  async verify(pin) {
+    const stored = localStorage.getItem(KEY_HASH)
+    return !!stored && (await hashPin(pin)) === stored
+  },
+  /** 잠금 해제(설정 끄기) */
+  disable() {
+    localStorage.removeItem(KEY_HASH)
+    localStorage.removeItem(KEY_ENABLED)
+    state.enabled = false
+    state.locked = false
+  },
+  /** 잠금 걸기(활성화 + 일시중지 창 밖일 때만) */
+  lock() {
+    if (Date.now() < suppressUntil) return // 네이티브 동작 복귀 — 잠그지 않음
+    if (state.enabled) state.locked = true
+  },
+  /** 다음 백그라운드 전환을 잠그지 않음(카메라/갤러리/공유 호출 직전에 사용) */
+  suppressLock(ms = 60000) {
+    suppressUntil = Date.now() + ms
+  },
+  /** 일시중지 창 해제(앱으로 복귀 시) */
+  clearSuppress() {
+    suppressUntil = 0
+  },
+  /** 잠금 풀기(이번 세션) */
+  unlock() {
+    state.locked = false
+  },
+  /** 저장된 세션이 있는지(앱 시작 시 잠금 여부 판단용) */
+  hasSession() {
+    return !!localStorage.getItem('token')
+  },
+}

src/config/features.js

@@ -0,0 +1,23 @@
+// 로그인 방식 기능 플래그.
+// 구글 로그인만 운영하므로 아이디 로그인 폼 / 회원가입 UI 를 숨긴다.
+// 백엔드(/api/auth/login, /api/auth/signup)는 비상용으로 그대로 유지 —
+// 되돌리려면 이 값을 true 로 바꾸면 아이디 로그인/회원가입이 다시 노출된다.
+export const ID_LOGIN_ENABLED = false
+
+// 카드 결제 알림 자동인식(NotificationListenerService) 기능.
+// 스토어 첫 출시에서는 Google Play 알림 접근 정책 심사 회피를 위해 비활성화.
+// (AndroidManifest 의 CardNotifListenerService 선언도 함께 주석 처리되어 있음)
+export const CARD_NOTIF_ENABLED = false
+
+// 인앱결제(유료 구독) 기능.
+// 첫 출시는 무료 앱으로 등록 — 실제 Google Play Billing 연동(결제 플러그인 +
+// 서버 영수증 검증) 전까지는 구매 흐름이 테스트 스텁이라, 활성화하면 결제 없이
+// 프리미엄이 부여되는 문제가 있다. 그래서 구매 진입점을 모두 숨긴다.
+// 실연동 완료 후 true 로 바꾸면 업그레이드/정기결제 관리 화면이 다시 노출된다.
+export const BILLING_ENABLED = false
+
+// 광고(카카오 애드핏) 노출 기능.
+// 첫 출시는 광고 미승인 상태 + 데이터 안전 양식 단순화를 위해 비활성화.
+// (광고 식별자 수집/제3자 공유가 사라져 심사가 단순해짐)
+// 애드핏 앱 광고단위 승인 후 true 로 바꾸면 무료 회원에게 광고가 다시 노출된다.
+export const ADS_ENABLED = false

src/constants/terms.js

@@ -1,14 +1,17 @@
-// 회원가입 약관 본문. 모달에서 '전문 보기'로 노출.
+// 이용약관 / 개인정보처리방침 본문. 가입 모달 '전문 보기' 및 /terms, /privacy 페이지에서 노출.
 // 서비스명: 돈돼지 가계부 (가계부·자산·예산 관리)
 
 export const SERVICE_NAME = '돈돼지 가계부'
+export const EFFECTIVE_DATE = '2026-07-05'
+// 개인정보 보호 문의 — 운영자 연락처(필요 시 변경)
+export const CONTACT_EMAIL = 'dondwaeji.app@gmail.com'
 
 export const TERMS_OF_SERVICE = `제1조 (목적)
 이 약관은 ${SERVICE_NAME}(이하 "서비스")가 제공하는 가계부·자산·예산 관리 서비스의 이용과 관련하여 서비스와 회원 간의 권리, 의무 및 책임사항을 규정함을 목적으로 합니다.
 
 제2조 (정의)
 1. "회원"이란 본 약관에 동의하고 서비스에 가입하여 이용하는 자를 말합니다.
-2. "계정"이란 회원 식별과 서비스 이용을 위해 회원이 등록한 아이디와 비밀번호를 말합니다.
+2. "계정"이란 회원 식별과 서비스 이용을 위해 회원이 등록(또는 소셜 로그인으로 연동)한 식별 정보를 말합니다.
 
 제3조 (약관의 효력 및 변경)
 1. 본 약관은 회원이 가입 시 동의함으로써 효력이 발생합니다.
@@ -26,33 +29,78 @@ export const TERMS_OF_SERVICE = `제1조 (목적)
 제6조 (게시물)
 회원이 게시판 등에 작성한 게시물의 권리와 책임은 작성자에게 있으며, 서비스 운영이나 타인의 권리를 침해하는 게시물은 사전 통지 없이 제한될 수 있습니다.
 
-제7조 (계약 해지)
-회원은 언제든지 탈퇴를 요청할 수 있으며, 탈퇴 시 회원의 데이터는 관련 법령에서 정한 경우를 제외하고 지체 없이 삭제됩니다.
+제7조 (유료 서비스 및 결제)
+1. 서비스는 일부 기능을 유료(프리미엄) 구독으로 제공할 수 있습니다.
+2. 모바일 앱의 결제는 Google Play 등 앱 마켓의 인앱결제를 통해 이루어지며, 결제·환불·정기결제(자동 갱신)의 처리 및 정책은 해당 마켓의 규정을 따릅니다.
+3. 구독은 만료일까지 이용할 수 있으며, 해지하더라도 남은 기간 동안 이용이 유지된 후 무료로 전환됩니다.
+4. 청약철회 및 환불은 관련 법령과 앱 마켓 정책에 따릅니다.
 
-제8조 (면책)
-서비스는 천재지변, 회원의 귀책사유, 제3자 서비스(시세 제공처 등)의 장애 등 합리적으로 통제할 수 없는 사유로 인한 손해에 대하여 책임을 지지 않습니다.
+제8조 (광고)
+서비스는 무료 회원에게 광고를 표시할 수 있으며, 유료(프리미엄) 회원에게는 광고를 표시하지 않습니다.
+
+제9조 (계약 해지)
+회원은 언제든지 앱 내 '회원 탈퇴' 기능으로 탈퇴할 수 있으며, 탈퇴 시 회원의 데이터는 관련 법령에서 정한 경우를 제외하고 지체 없이 삭제됩니다.
+
+제10조 (면책)
+서비스는 천재지변, 회원의 귀책사유, 제3자 서비스(시세 제공처, 앱 마켓, 광고 등)의 장애 등 합리적으로 통제할 수 없는 사유로 인한 손해에 대하여 책임을 지지 않습니다.
 
 부칙
-본 약관은 가입 시점부터 적용됩니다.`
+본 약관은 ${EFFECTIVE_DATE}부터 적용됩니다.`
 
-export const PRIVACY_POLICY = `${SERVICE_NAME}는 회원가입 및 서비스 제공을 위해 아래와 같이 개인정보를 수집·이용합니다.
+export const PRIVACY_POLICY = `${SERVICE_NAME}(이하 "서비스")는 이용자의 개인정보를 중요하게 생각하며, 「개인정보 보호법」 등 관련 법령을 준수합니다. 본 방침은 서비스가 어떤 정보를 어떻게 수집·이용·보관하는지 안내합니다.
 
-1. 수집 항목
-- 필수: 아이디, 비밀번호(암호화 저장), 이름
-- 선택: 이메일
-- 서비스 이용 과정에서 회원이 직접 입력하는 가계부·자산·거래 내역 등
+1. 수집하는 개인정보 항목
+가) 회원가입·계정
+- 로컬 가입: 아이디, 비밀번호(단방향 암호화 저장), 이름, 이메일(선택)
+- 구글 로그인: 구글 계정 식별자, 이름, 이메일, 프로필 사진(구글 제공 범위)
+나) 서비스 이용 과정에서 회원이 직접 입력·등록하는 정보
+- 가계부·계좌·자산·예산·거래 내역 등 가계부 데이터
+- 게시판 글·댓글, 직접 업로드한 프로필 사진(선택)
+다) 자동으로 생성·수집되는 정보
+- 서비스 이용 기록, 기기·브라우저 정보(부정 이용 방지 및 향후 광고 도입 시 광고 제공 목적)
+- 인앱결제 시 구매 토큰 및 구독 상태(결제 검증·구독 관리 목적)
 
 2. 수집·이용 목적
 - 회원 식별 및 로그인 등 계정 관리
 - 가계부·자산·예산 관리 기능 제공 및 회원 데이터 보관
+- AI 기반 편의 기능 제공(자연어 한 줄 입력, 영수증 사진 구조화, 분류·계좌 자동 추천, 이번 달 집계 기반 재무 코멘트)
+- 유료 구독 결제 검증 및 구독(자동 갱신·해지) 관리
+- (향후 도입 시) 무료 회원 대상 광고 제공
 - 서비스 운영, 문의 응대 및 부정 이용 방지
 
-3. 보유 및 이용 기간
-- 회원 탈퇴 시까지 보유하며, 탈퇴 시 지체 없이 파기합니다.
+3. 처리위탁 및 제3자
+서비스는 기능 제공을 위해 아래 사업자의 서비스를 이용하며, 필요한 범위에서 정보가 처리될 수 있습니다.
+- Google: 구글 로그인(인증), 인앱결제(Google Play), 영수증 문자 인식(Google Cloud Vision OCR — AI 인식의 보조·폴백)
+- Anthropic(Claude): AI 편의 기능 처리. 회원이 해당 기능을 사용할 때에 한해 아래 정보가 처리 목적 범위에서 전송됩니다.
+  · 자연어 한 줄 입력: 회원이 입력한 텍스트(예: "어제 스타벅스 5천원")
+  · 영수증 사진 구조화: 회원이 촬영·선택한 영수증 이미지
+  · 분류·계좌 자동 추천: 회원의 분류·계좌 '이름' 목록
+  · 재무 코멘트: 이번 달 집계 수치(수입·지출·예산·분류별 합계 등)로 한정하며, 개별 거래 원문은 전송하지 않습니다.
+  Anthropic은 API로 전송된 데이터를 AI 모델 학습에 사용하지 않습니다. API 키는 서버에만 보관되며 앱에 노출되지 않습니다.
+- Kakao(카카오): 광고 노출(카카오 애드핏) — 향후 광고 도입 시, 무료 회원에 한함
+영수증 인식·AI 편의 기능은 회원이 제공한 정보를 해당 기능 수행 목적으로만 처리하며, 결과는 폼 자동 채움·참고 코멘트 용도로 저장은 회원 확인 후 이루어집니다. 서비스는 회원의 개인정보를 위 목적 외로 외부에 판매하지 않습니다.
+
+4. 광고
+- 현재 서비스에는 광고가 표시되지 않습니다.
+- 향후 무료 회원을 대상으로 광고가 도입될 수 있으며, 이 경우 광고 식별·노출을 위해 기기 정보 등이 광고 사업자에 의해 처리될 수 있습니다. 유료(프리미엄) 회원에게는 광고가 표시되지 않습니다.
+
+5. 결제 정보
+- 결제는 Google Play 등 앱 마켓의 인앱결제로 처리되며, 카드번호 등 결제수단 정보는 서비스가 저장하지 않습니다.
+- 서비스는 결제 검증·구독 관리를 위한 구매 토큰과 구독 상태(상품, 만료일 등)만 보관합니다.
+
+6. 보유 및 이용 기간
+- 회원 탈퇴 시까지 보유하며, 탈퇴 시 회원의 데이터(가계부·게시물·포인트·결제기록 등)를 지체 없이 파기합니다.
 - 다만 관련 법령에 따라 보존이 필요한 경우 해당 기간 동안 보관합니다.
 
-4. 동의 거부 권리 및 불이익
-- 회원은 개인정보 수집·이용 동의를 거부할 권리가 있습니다.
-- 다만 필수 항목에 동의하지 않을 경우 회원가입 및 서비스 이용이 제한됩니다.
+7. 이용자의 권리
+- 회원은 자신의 개인정보에 대해 열람·정정·삭제·처리정지를 요청할 수 있으며, 앱 내 '회원 탈퇴'로 계정과 데이터를 삭제할 수 있습니다.
+- 개인정보 수집·이용 동의를 거부할 권리가 있으나, 필수 항목 미동의 시 회원가입 및 서비스 이용이 제한됩니다.
 
-비밀번호는 복호화가 불가능한 방식으로 암호화하여 저장되며, 운영자도 원문을 확인할 수 없습니다.`
+8. 안전성 확보 조치
+- 비밀번호는 복호화가 불가능한 방식으로 암호화하여 저장하며, 운영자도 원문을 확인할 수 없습니다.
+- 전송 구간 암호화(HTTPS) 등 합리적인 보호조치를 적용합니다.
+
+9. 개인정보 보호 문의
+- 문의: ${CONTACT_EMAIL}
+
+본 개인정보처리방침은 ${EFFECTIVE_DATE}부터 적용됩니다.`

src/demo/index.js

@@ -0,0 +1,150 @@
+// 둘러보기(데모) 모드 — 실제 화면 컴포넌트를 그대로 쓰되 API 만 더미로 응답한다.
+// demo.on 이 true 면 accountApi 의 읽기는 아래 더미를, 쓰기는 block()(안내 메시지)으로 응답.
+import { reactive } from 'vue'
+
+export const demo = reactive({ on: false })
+
+export function enterDemo() {
+  demo.on = true
+}
+export function exitDemo() {
+  demo.on = false
+}
+
+// ===== 더미 데이터 (백엔드 응답 DTO 형태와 동일) =====
+const WALLETS = [
+  { id: 1, type: 'BANK', name: '신한 주거래', issuer: '신한', accountNumber: null, openingBalance: 0, balance: 2540000, manualValuation: false },
+  { id: 2, type: 'BANK', name: '주택청약', issuer: '국민', accountNumber: null, openingBalance: 0, balance: 5000000, manualValuation: false },
+  { id: 3, type: 'CASH', name: '현금', openingBalance: 0, balance: 120000, manualValuation: false },
+  { id: 4, type: 'CARD', name: '삼성카드', issuer: '삼성', cardType: 'CREDIT', openingBalance: 0, balance: -340000, manualValuation: false },
+  {
+    id: 5, type: 'INVEST', name: '연금저축', manualValuation: true,
+    investedAmount: 7000000, currentValue: 8200000, balance: 8200000,
+    valuationGain: 1200000, deposit: 0, stockValue: 8200000,
+  },
+]
+
+const CATEGORIES = [
+  // 지출 대분류/소분류
+  { id: 10, type: 'EXPENSE', name: '식비', parentId: null },
+  { id: 11, type: 'EXPENSE', name: '점심', parentId: 10 },
+  { id: 12, type: 'EXPENSE', name: '저녁', parentId: 10 },
+  { id: 13, type: 'EXPENSE', name: '카페/간식', parentId: 10 },
+  { id: 20, type: 'EXPENSE', name: '교통', parentId: null },
+  { id: 21, type: 'EXPENSE', name: '대중교통', parentId: 20 },
+  { id: 22, type: 'EXPENSE', name: '택시', parentId: 20 },
+  { id: 30, type: 'EXPENSE', name: '주거/통신', parentId: null },
+  { id: 31, type: 'EXPENSE', name: '월세', parentId: 30 },
+  { id: 32, type: 'EXPENSE', name: '통신비', parentId: 30 },
+  { id: 40, type: 'EXPENSE', name: '문화/여가', parentId: null },
+  { id: 41, type: 'EXPENSE', name: 'OTT/구독', parentId: 40 },
+  { id: 50, type: 'EXPENSE', name: '쇼핑', parentId: null },
+  // 수입
+  { id: 60, type: 'INCOME', name: '급여', parentId: null },
+  { id: 61, type: 'INCOME', name: '용돈', parentId: null },
+]
+
+// 이번 달(현 시점) 기준 샘플 내역
+function ymd(day) {
+  const now = new Date()
+  const m = String(now.getMonth() + 1).padStart(2, '0')
+  return `${now.getFullYear()}-${m}-${String(day).padStart(2, '0')}`
+}
+function E(id, day, type, category, amount, memo, walletId, walletName, opt = {}) {
+  return {
+    id, entryDate: ymd(day), type, category, amount, memo,
+    walletId, walletName, toWalletId: null, toWalletName: null,
+    installmentMonths: null, pending: !!opt.pending, tags: opt.tags || [],
+  }
+}
+const ENTRIES = [
+  E(101, 27, 'EXPENSE', '점심', 9000, '김밥천국', 4, '삼성카드'),
+  E(102, 27, 'EXPENSE', '카페/간식', 5300, '스타벅스', 4, '삼성카드'),
+  E(103, 27, 'EXPENSE', '대중교통', 2800, '지하철', 3, '현금'),
+  E(104, 27, 'EXPENSE', '쇼핑', 25200, '다이소', 4, '삼성카드', { pending: true }),
+  E(105, 25, 'INCOME', '급여', 4600000, '6월 급여', 1, '신한 주거래'),
+  E(106, 25, 'EXPENSE', '통신비', 45300, '휴대폰 요금', 1, '신한 주거래'),
+  E(107, 23, 'EXPENSE', 'OTT/구독', 17000, '넷플릭스', 4, '삼성카드', { tags: ['구독'] }),
+  E(108, 23, 'EXPENSE', '저녁', 23000, '배달', 4, '삼성카드'),
+  E(109, 20, 'EXPENSE', '쇼핑', 285000, '마트 장보기', 4, '삼성카드'),
+  E(110, 18, 'EXPENSE', '저녁', 62000, '친구 외식', 4, '삼성카드', { tags: ['데이트'] }),
+  E(111, 15, 'EXPENSE', '택시', 28000, '심야 택시', 4, '삼성카드'),
+  E(112, 12, 'EXPENSE', '쇼핑', 320000, '의류 구매', 4, '삼성카드'),
+  E(113, 8, 'EXPENSE', '대중교통', 55000, '교통카드 충전', 3, '현금'),
+  E(114, 5, 'EXPENSE', '카페/간식', 18500, '베이커리', 4, '삼성카드'),
+  E(115, 1, 'EXPENSE', '월세', 600000, '6월 월세', 1, '신한 주거래'),
+]
+
+const RECURRINGS = [
+  { id: 201, title: '월세', type: 'EXPENSE', amount: 600000, category: '월세', memo: null, walletId: 1, walletName: '신한 주거래', toWalletId: null, toWalletName: null, frequency: 'MONTHLY', dayOfMonth: 1, dayOfWeek: null, monthOfYear: null, startDate: ymd(1), endDate: null, lastRunDate: null, nextDate: ymd(1), active: true },
+  { id: 202, title: '통신비', type: 'EXPENSE', amount: 45300, category: '통신비', memo: null, walletId: 1, walletName: '신한 주거래', toWalletId: null, toWalletName: null, frequency: 'MONTHLY', dayOfMonth: 15, dayOfWeek: null, monthOfYear: null, startDate: ymd(15), endDate: null, lastRunDate: null, nextDate: ymd(15), active: true },
+  { id: 203, title: '넷플릭스', type: 'EXPENSE', amount: 17000, category: 'OTT/구독', memo: null, walletId: 4, walletName: '삼성카드', toWalletId: null, toWalletName: null, frequency: 'MONTHLY', dayOfMonth: 23, dayOfWeek: null, monthOfYear: null, startDate: ymd(23), endDate: null, lastRunDate: null, nextDate: ymd(23), active: true },
+  { id: 204, title: '급여', type: 'INCOME', amount: 4600000, category: '급여', memo: null, walletId: 1, walletName: '신한 주거래', toWalletId: null, toWalletName: null, frequency: 'MONTHLY', dayOfMonth: 25, dayOfWeek: null, monthOfYear: null, startDate: ymd(25), endDate: null, lastRunDate: null, nextDate: ymd(25), active: true },
+]
+
+const QUICK = [
+  { id: 301, label: '점심', type: 'EXPENSE', category: '점심', amount: 9000, memo: '점심', walletId: 4, walletName: '삼성카드' },
+  { id: 302, label: '커피', type: 'EXPENSE', category: '카페/간식', amount: 5300, memo: '커피', walletId: 4, walletName: '삼성카드' },
+  { id: 303, label: '대중교통', type: 'EXPENSE', category: '대중교통', amount: 2800, memo: '교통', walletId: 3, walletName: '현금' },
+]
+
+const TAGS = [
+  { id: 401, name: '구독' },
+  { id: 402, name: '데이트' },
+  { id: 403, name: '경조사' },
+]
+
+// 해당 연·월 내역만 (월 이동 반영)
+function inMonth(e, year, month) {
+  if (!year || !month) return true
+  return e.entryDate.startsWith(`${year}-${String(month).padStart(2, '0')}`)
+}
+// 검색·필터 적용
+function filterEntries(p = {}) {
+  let rows = ENTRIES.filter((e) => inMonth(e, p.year, p.month))
+  if (p.type) rows = rows.filter((e) => e.type === p.type)
+  if (p.category) rows = rows.filter((e) => e.category === p.category)
+  if (p.walletId) rows = rows.filter((e) => String(e.walletId) === String(p.walletId))
+  if (p.keyword) {
+    const k = String(p.keyword).trim()
+    rows = rows.filter((e) => (e.memo || '').includes(k) || (e.category || '').includes(k))
+  }
+  if (p.tagId) {
+    const t = TAGS.find((x) => String(x.id) === String(p.tagId))
+    if (t) rows = rows.filter((e) => (e.tags || []).includes(t.name))
+  }
+  return rows
+}
+function summaryOf(p = {}) {
+  let income = 0, expense = 0
+  for (const e of ENTRIES) {
+    if (!inMonth(e, p.year, p.month)) continue
+    if (e.type === 'INCOME') income += e.amount
+    else if (e.type === 'EXPENSE') expense += e.amount
+  }
+  return { totalIncome: income, totalExpense: expense, balance: income - expense }
+}
+const NETWORTH = { totalAssets: 15860000, totalLiabilities: 340000, netWorth: 15520000 }
+
+function ok(data) {
+  // 깊은 복제로 화면에서 수정해도 원본 더미는 보존
+  return Promise.resolve(JSON.parse(JSON.stringify(data)))
+}
+function block() {
+  return Promise.reject({ response: { data: { message: '둘러보기 모드에서는 저장되지 않습니다. 로그인 후 이용해 주세요.' } } })
+}
+
+// 읽기 응답 / 쓰기 차단
+export const demoApi = {
+  list: (params) => ok(filterEntries(params)),
+  summary: (params) => ok(summaryOf(params)),
+  wallets: () => ok(WALLETS),
+  netWorth: () => ok(NETWORTH),
+  categories: () => ok(CATEGORIES),
+  recurrings: () => ok(RECURRINGS),
+  quickEntries: () => ok(QUICK),
+  pendingCount: () => ok({ count: 1 }),
+  tags: () => ok(TAGS),
+  walletEntries: () => ok([]),
+  block,
+}

src/main.js

@@ -8,6 +8,11 @@ import router from './router'
 import { setupCapacitor } from './capacitor'
 import { useAuthStore } from './stores/auth'
 import { useDialog } from './composables/dialog'
+import { reportFatal } from './composables/appError'
+import { initTheme } from './theme'
+
+// 저장된 테마(라이트/다크/시스템) 즉시 적용 — 첫 렌더 깜빡임 방지
+initTheme()
 
 // 네이티브 alert 를 인앱 다이얼로그로 대체 (PC 'sb_pt' 제목 제거 + 웹/APK 일관).
 // confirm/prompt 는 동기 반환이라 오버라이드 불가 → 각 호출부에서 await dialog.confirm/prompt 사용.
@@ -18,6 +23,11 @@ window.alert = (message) => {
 
 const app = createApp(App)
 
+// 렌더/라이프사이클 중 처리되지 않은 오류 → 흰 화면 대신 폴백 UI 표시
+app.config.errorHandler = (err, instance, info) => {
+  reportFatal({ err, info })
+}
+
 app.use(createPinia())
 app.use(router)
 

src/native/appleAuth.js

@@ -0,0 +1,22 @@
+// 네이티브 Sign in with Apple 래퍼 (iOS 전용). 플러그인은 지연 import.
+// 반환된 identity token(JWT)의 aud 는 앱 번들 ID → 백엔드 /api/auth/apple 가 JWKS 로 검증한다.
+import { Capacitor } from '@capacitor/core'
+
+// Apple 로그인은 iOS 네이티브에서만 노출한다(웹/안드로이드는 별도 흐름 필요 — 현재 미지원).
+export function isNativeApple() {
+  return Capacitor.getPlatform() === 'ios'
+}
+
+// Sign in with Apple 수행 → { identityToken, name }.
+// 이름(givenName/familyName)은 애플이 '최초 인증 시에만' 주므로 신규 가입 채움용으로 함께 반환.
+export async function nativeAppleCredential() {
+  const { SignInWithApple } = await import('@capacitor-community/apple-sign-in')
+  const result = await SignInWithApple.authorize({
+    clientId: 'kr.sblog.slimbudget.app',
+    redirectURI: 'https://app.sblog.kr/auth/apple/callback',
+    scopes: 'email name',
+  })
+  const r = result?.response || {}
+  const name = [r.givenName, r.familyName].filter(Boolean).join(' ').trim() || null
+  return { identityToken: r.identityToken || null, name }
+}

src/native/billing.js

@@ -0,0 +1,26 @@
+import { Capacitor } from '@capacitor/core'
+
+// 인앱 결제(Google Play) 헬퍼.
+// 결제는 Android 앱에서만 가능 — 웹/데스크톱(PC)은 앱 다운로드로 유도한다.
+export const billing = {
+  // Capacitor 네이티브(안드로이드) 여부
+  isNative() {
+    return Capacitor.isNativePlatform()
+  },
+
+  /**
+   * 상품 구매 → 구매 토큰 반환.
+   * 스캐폴드(테스트): 실제 스토어 호출 없이 test- 토큰을 만들어 백엔드 검증 흐름을 태운다.
+   *
+   * TODO(실연동): Google Play Billing 플러그인(cordova-plugin-purchase 등)을 연결해
+   *   실제 구매 후 purchaseToken/orderId 를 받아 반환하도록 교체.
+   */
+  async purchase(productId) {
+    const rand = (globalThis.crypto?.randomUUID?.() || `${Date.now()}-${Math.floor(Math.random() * 1e9)}`)
+    return {
+      productId,
+      purchaseToken: `test-${productId}-${rand}`,
+      orderId: `TEST-${rand}`,
+    }
+  },
+}

src/native/reminders.js

@@ -0,0 +1,124 @@
+import { Capacitor } from '@capacitor/core'
+import { Preferences } from '@capacitor/preferences'
+
+// 로컬 알림(앱 전용) — 가계부 기록 리마인더 + 구독 만료 임박 알림.
+// 서버 푸시(FCM) 없이 기기에서 예약되며, 앱을 켜지 않아도 예약 시간에 표시된다.
+
+const PREF_ENABLED = 'notif_enabled'
+const PREF_HOUR = 'notif_hour'
+const ENTRY_BASE = 5000 // 가계부 리마인더 id 5000~5006 (7일 롤링)
+const ENTRY_DAYS = 7
+const EXPIRY_ID = 5100 // 구독 만료 임박 id
+
+let LN = null
+async function ln() {
+  if (!Capacitor.isNativePlatform()) return null
+  if (!LN) LN = (await import('@capacitor/local-notifications')).LocalNotifications
+  return LN
+}
+
+async function cancelIds(ids) {
+  const n = await ln()
+  if (!n) return
+  try {
+    await n.cancel({ notifications: ids.map((id) => ({ id })) })
+  } catch {
+    /* 무시 */
+  }
+}
+
+export const reminders = {
+  isNative() {
+    return Capacitor.isNativePlatform()
+  },
+
+  async getSettings() {
+    const e = (await Preferences.get({ key: PREF_ENABLED })).value
+    const h = (await Preferences.get({ key: PREF_HOUR })).value
+    return { enabled: e === '1', hour: h != null ? Number(h) : 21 }
+  },
+
+  async setSettings({ enabled, hour }) {
+    await Preferences.set({ key: PREF_ENABLED, value: enabled ? '1' : '0' })
+    if (hour != null) await Preferences.set({ key: PREF_HOUR, value: String(hour) })
+  },
+
+  /** 알림 권한 요청 (Android 13+). 허용되면 true */
+  async ensurePermission() {
+    const n = await ln()
+    if (!n) return false
+    let p = await n.checkPermissions()
+    if (p.display !== 'granted') p = await n.requestPermissions()
+    return p.display === 'granted'
+  },
+
+  /** 가계부 리마인더 — 향후 7일 매일 예약(오늘 이미 기록했으면 오늘은 제외) */
+  async scheduleEntryReminder(hasEntryToday = false) {
+    const n = await ln()
+    if (!n) return
+    await cancelIds(Array.from({ length: ENTRY_DAYS }, (_, i) => ENTRY_BASE + i))
+    const { enabled, hour } = await this.getSettings()
+    if (!enabled) return
+    const now = new Date()
+    const list = []
+    for (let i = 0; i < ENTRY_DAYS; i++) {
+      const at = new Date(now)
+      at.setDate(now.getDate() + i)
+      at.setHours(hour, 0, 0, 0)
+      if (at <= now) continue
+      if (i === 0 && hasEntryToday) continue
+      list.push({
+        id: ENTRY_BASE + i,
+        title: '돈돼지 가계부',
+        body: '오늘 가계부 기록을 잊지 않으셨나요? 📝',
+        schedule: { at },
+      })
+    }
+    if (list.length) {
+      try {
+        await n.schedule({ notifications: list })
+      } catch {
+        /* 무시 */
+      }
+    }
+  },
+
+  /** 오늘 기록을 완료하면 오늘자 리마인더만 취소 */
+  async clearTodayReminder() {
+    await cancelIds([ENTRY_BASE])
+  },
+
+  /**
+   * 구독 만료 임박 알림 — 해지(자동갱신 off) 상태에서 만료 3일 전 예약.
+   * sub: { premium, autoRenew, expiresAt }
+   */
+  async scheduleExpiryReminder(sub) {
+    const n = await ln()
+    if (!n) return
+    await cancelIds([EXPIRY_ID])
+    const { enabled } = await this.getSettings()
+    if (!enabled || !sub || !sub.premium || sub.autoRenew || !sub.expiresAt) return
+    const exp = new Date(sub.expiresAt)
+    if (Number.isNaN(exp.getTime())) return
+    const at = new Date(exp.getTime() - 3 * 24 * 60 * 60 * 1000)
+    at.setHours(10, 0, 0, 0)
+    if (at <= new Date()) return
+    try {
+      await n.schedule({
+        notifications: [{
+          id: EXPIRY_ID,
+          title: '돈돼지 가계부',
+          body: `프리미엄 구독이 ${exp.getFullYear()}.${exp.getMonth() + 1}.${exp.getDate()}에 만료돼요. 계속 이용하려면 갱신해 주세요.`,
+          schedule: { at },
+        }],
+      })
+    } catch {
+      /* 무시 */
+    }
+  },
+
+  /** 알림 전체 해제 (토글 off) */
+  async cancelAll() {
+    await cancelIds([...Array.from({ length: ENTRY_DAYS }, (_, i) => ENTRY_BASE + i), EXPIRY_ID])
+  },
+}

src/router/index.js

@@ -2,6 +2,10 @@ import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router
 import HomeView from '../views/HomeView.vue'
 import { useAuthStore } from '@/stores/auth'
 import { useUiStore } from '@/stores/ui'
+import { demo } from '@/demo'
+
+// 둘러보기(데모)에서 더미로 진입 가능한 화면
+const DEMO_ALLOWED = new Set(['account-entries', 'account-recurrings', 'account-wallets', 'account-categories'])
 
 // Electron(데스크톱)은 file:// 로 로드 → 해시 히스토리라야 새로고침/딥링크가 안전
 const isDesktop = typeof navigator !== 'undefined' && /electron/i.test(navigator.userAgent)
@@ -14,6 +18,40 @@ const router = createRouter({
       name: 'home',
       component: HomeView,
     },
+    {
+      // 둘러보기(데모)에서 미지원(로그인 필요) 화면 진입 시 — 잠금 안내 (공개)
+      path: '/demo-locked',
+      name: 'demo-locked',
+      component: () => import('../views/DemoLockedView.vue'),
+    },
+    {
+      // 유료 멤버십 안내/업그레이드 (로그인 필요, 무료 회원도 접근 가능)
+      path: '/upgrade',
+      name: 'upgrade',
+      component: () => import('../views/UpgradeView.vue'),
+      meta: { requiresAuth: true },
+    },
+    {
+      // 개인정보처리방침 (공개 — 웹에서도 접근, 앱 마켓 정책 URL)
+      path: '/privacy',
+      name: 'privacy',
+      component: () => import('../views/LegalView.vue'),
+      meta: { public: true, doc: 'privacy' },
+    },
+    {
+      // 이용약관 (공개)
+      path: '/terms',
+      name: 'terms',
+      component: () => import('../views/LegalView.vue'),
+      meta: { public: true, doc: 'terms' },
+    },
+    {
+      // 계정·데이터 삭제 안내 (공개 — 앱 마켓 데이터 삭제 정책 URL)
+      path: '/account-deletion',
+      name: 'account-deletion',
+      component: () => import('../views/AccountDeletionView.vue'),
+      meta: { public: true },
+    },
     {
       path: '/users',
       name: 'users',
@@ -28,6 +66,12 @@ const router = createRouter({
       component: () => import('../views/board/BoardListView.vue'),
       meta: { requiresAuth: true },
     },
+    {
+      path: '/my-board',
+      name: 'my-board',
+      component: () => import('../views/board/MyBoardView.vue'),
+      meta: { requiresAuth: true },
+    },
     {
       path: '/board/:category(community|saving|tips)/write',
       name: 'board-write',
@@ -60,6 +104,12 @@ const router = createRouter({
       component: () => import('../views/admin/DefaultCategoryView.vue'),
       meta: { requiresAuth: true, requiresAdmin: true },
     },
+    {
+      path: '/admin/reports',
+      name: 'admin-reports',
+      component: () => import('../views/admin/ReportAdminView.vue'),
+      meta: { requiresAuth: true, requiresAdmin: true },
+    },
     {
       // 구 가계부 대시보드 → 내역으로 (대시보드 정보는 홈/통계로 이전)
       path: '/account',
@@ -75,13 +125,13 @@ const router = createRouter({
       path: '/account/stats',
       name: 'account-stats',
       component: () => import('../views/account/AccountDashboardView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true, requiresPremium: true },
     },
     {
       path: '/account/tags',
       name: 'account-tags',
       component: () => import('../views/account/AccountTagView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true, requiresPremium: true },
     },
     {
       path: '/account/wallets',
@@ -89,6 +139,30 @@ const router = createRouter({
       component: () => import('../views/account/AccountWalletView.vue'),
       meta: { requiresAuth: true },
     },
+    {
+      path: '/account/wallets/new',
+      name: 'account-wallet-new',
+      component: () => import('../views/account/WalletFormView.vue'),
+      meta: { requiresAuth: true },
+    },
+    {
+      path: '/account/wallets/:id(\\d+)/edit',
+      name: 'account-wallet-edit',
+      component: () => import('../views/account/WalletFormView.vue'),
+      meta: { requiresAuth: true },
+    },
+    {
+      path: '/account/wallets/:id(\\d+)',
+      name: 'account-wallet-detail',
+      component: () => import('../views/account/AccountWalletDetailView.vue'),
+      meta: { requiresAuth: true },
+    },
+    {
+      path: '/account/repayments',
+      name: 'account-repayments',
+      component: () => import('../views/account/RepaymentScheduleView.vue'),
+      meta: { requiresAuth: true, requiresPremium: true },
+    },
     {
       path: '/account/categories',
       name: 'account-categories',
@@ -99,12 +173,25 @@ const router = createRouter({
       path: '/account/budget',
       name: 'account-budget',
       component: () => import('../views/account/BudgetView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true, requiresPremium: true },
     },
     {
       path: '/account/recurrings',
       name: 'account-recurrings',
       component: () => import('../views/account/RecurringView.vue'),
+      // 정기결제은 무료도 2건까지 체험(초과 시 업셀) — 유료 게이트 해제
+      meta: { requiresAuth: true },
+    },
+    {
+      path: '/account/recurrings/new',
+      name: 'account-recurring-new',
+      component: () => import('../views/account/RecurringFormView.vue'),
+      meta: { requiresAuth: true },
+    },
+    {
+      path: '/account/recurrings/:id(\\d+)/edit',
+      name: 'account-recurring-edit',
+      component: () => import('../views/account/RecurringFormView.vue'),
       meta: { requiresAuth: true },
     },
     // 설정 (앱 하단 내비게이션 → 설정)
@@ -126,12 +213,27 @@ const router = createRouter({
       component: () => import('../views/settings/ProfileEditView.vue'),
       meta: { requiresAuth: true },
     },
+    {
+      path: '/settings/shop',
+      name: 'settings-shop',
+      component: () => import('../views/settings/ShopView.vue'),
+      meta: { requiresAuth: true },
+    },
   ],
 })
 
 // 전역 네비게이션 가드
 router.beforeEach((to, from) => {
   const auth = useAuthStore()
+  // 둘러보기(데모): 지원 화면은 더미로 진입, 그 외 보호 화면은 잠금 안내로
+  if (demo.on && !auth.isAuthenticated) {
+    if (to.name === 'home') return { name: 'account-entries' }
+    if (to.meta.requiresAuth) {
+      if (DEMO_ALLOWED.has(to.name)) return true
+      return { name: 'demo-locked', query: { from: to.name || '' } }
+    }
+    return true // 공개 라우트(잠금 안내 등)
+  }
   // 인증이 필요한 페이지인데 미로그인 → 로그인 팝업 오픈 (원래 목적지 보존), 이동은 취소/홈
   if (to.meta.requiresAuth && !auth.isAuthenticated) {
     const ui = useUiStore()
@@ -142,6 +244,10 @@ router.beforeEach((to, from) => {
   if (to.meta.requiresAdmin && auth.user?.role !== 'ADMIN') {
     return { name: 'home' }
   }
+  // 유료 전용 페이지 — 무료 회원은 업그레이드 안내로
+  if (to.meta.requiresPremium && !auth.isPremium) {
+    return { name: 'upgrade' }
+  }
 })
 
 // 새 배포로 청크 해시가 바뀐 뒤, 캐시된 옛 index.html 이 삭제된 옛 청크를 부르면

src/stores/auth.js

@@ -2,6 +2,7 @@ import { defineStore } from 'pinia'
 import { ref, computed } from 'vue'
 import { Preferences } from '@capacitor/preferences'
 import { authApi } from '@/api/authApi'
+import { exitDemo } from '@/demo'
 
 // 세션 토큰은 Capacitor Preferences(네이티브 영속 저장 / 웹은 localStorage)로 보관한다.
 // http.js 요청 인터셉터가 동기로 읽을 수 있도록 localStorage 에도 미러링한다.
@@ -14,6 +15,9 @@ export const useAuthStore = defineStore('auth', () => {
   const ready = ref(false)
 
   const isAuthenticated = computed(() => !!token.value)
+  const isAdmin = computed(() => user.value?.role === 'ADMIN')
+  // 유료(PREMIUM) 멤버십 여부. 관리자는 항상 유료 기능 사용 가능.
+  const isPremium = computed(() => isAdmin.value || user.value?.plan === 'PREMIUM')
 
   // localStorage 동기화 (http.js 가 동기로 토큰을 읽음)
   function mirrorLocal() {
@@ -59,6 +63,7 @@ export const useAuthStore = defineStore('auth', () => {
     const res = await authApi.login({ loginId, password, rememberMe })
     token.value = res.token
     user.value = res.member
+    exitDemo()
     await persist()
     return res
   }
@@ -68,6 +73,15 @@ export const useAuthStore = defineStore('auth', () => {
     const res = await authApi.googleLogin({ idToken, rememberMe })
     token.value = res.token
     user.value = res.member
+    exitDemo()
+    await persist()
+    return res
+  }
+  async function appleLogin(identityToken, name, rememberMe = true) {
+    const res = await authApi.appleLogin({ identityToken, name, rememberMe })
+    token.value = res.token
+    user.value = res.member
+    exitDemo()
     await persist()
     return res
   }
@@ -99,13 +113,25 @@ export const useAuthStore = defineStore('auth', () => {
     await persist()
   }
 
+  // 서버에서 전체 프로필(아바타·포인트 포함)을 받아 병합 — 재로그인 없이 최신화
+  async function refreshProfile() {
+    if (!token.value) return
+    try {
+      const me = await authApi.profile()
+      await applyUser(me)
+    } catch {
+      // 실패해도 캐시된 사용자 정보 유지
+    }
+  }
+
   async function clear() {
+    exitDemo()
     token.value = ''
     user.value = null
     await persist()
   }
 
-  return { token, user, ready, isAuthenticated, restore, login, googleLogin, signup, fetchMe, applyUser, logout, clear }
+  return { token, user, ready, isAuthenticated, isAdmin, isPremium, restore, login, googleLogin, appleLogin, signup, fetchMe, applyUser, refreshProfile, logout, clear }
 })
 
 function safeParse(value) {

src/stores/ui.js

@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia'
 import { ref } from 'vue'
 import { authApi } from '@/api/authApi'
+import { getStoredTheme, setTheme as persistTheme } from '@/theme'
 
 // 전역 UI 상태 (로그인/회원가입 레이어 팝업 등)
 export const useUiStore = defineStore('ui', () => {
@@ -28,6 +29,13 @@ export const useUiStore = defineStore('ui', () => {
     sidebarOpen.value = false
   }
 
+  // 테마 (system | light | dark)
+  const theme = ref(getStoredTheme())
+  function setTheme(t) {
+    theme.value = t
+    persistTheme(t)
+  }
+
   // 비밀번호 변경 모달
   const passwordOpen = ref(false)
   function openPassword() {
@@ -63,5 +71,6 @@ export const useUiStore = defineStore('ui', () => {
     signupEnabled, loadSignupEnabled,
     sidebarOpen, toggleSidebar, closeSidebar,
     passwordOpen, openPassword, closePassword,
+    theme, setTheme,
   }
 })

src/theme.js

@@ -0,0 +1,34 @@
+// 테마(라이트/다크/시스템) 적용 — <html data-theme> 속성으로 제어.
+//   light/dark : 명시 적용,  system : 속성 제거 → OS prefers-color-scheme 따름
+const KEY = 'theme'
+
+export function getStoredTheme() {
+  try {
+    return localStorage.getItem(KEY) || 'system'
+  } catch {
+    return 'system'
+  }
+}
+
+export function applyTheme(theme) {
+  const el = document.documentElement
+  if (theme === 'light' || theme === 'dark') {
+    el.setAttribute('data-theme', theme)
+  } else {
+    el.removeAttribute('data-theme') // system
+  }
+}
+
+export function setTheme(theme) {
+  try {
+    localStorage.setItem(KEY, theme)
+  } catch {
+    /* 저장 실패 무시 */
+  }
+  applyTheme(theme)
+}
+
+// 앱 시작 시 저장값 즉시 적용 (마운트 전 호출 → 깜빡임 방지)
+export function initTheme() {
+  applyTheme(getStoredTheme())
+}

src/utils/avatar.js

@@ -0,0 +1,55 @@
+// 프로필 아바타 유틸 — 표시 우선순위(커스텀 > 구글 > 이니셜)와 업로드용 다운스케일.
+
+/**
+ * 표시할 아바타 이미지 소스를 고른다.
+ * 우선순위: 사용자 지정(profileImage) > 구글 아바타(googlePicture) > null(이니셜 폴백)
+ */
+export function avatarSrc(user) {
+  if (!user) return null
+  return user.profileImage || user.googlePicture || null
+}
+
+/** 이름/아이디에서 이니셜(첫 글자) 한 글자 — 이미지 없을 때 폴백 */
+export function avatarInitial(user) {
+  const s = (user?.name || user?.loginId || '').trim()
+  return s ? s[0].toUpperCase() : '?'
+}
+
+/**
+ * 업로드용으로 이미지 파일을 정사각형으로 크롭·축소해 JPEG data URL 로 변환한다.
+ * (서버/로컬 저장 용량을 작게 — 기본 192px)
+ */
+export function fileToAvatarDataUrl(file, size = 192, quality = 0.85) {
+  return new Promise((resolve, reject) => {
+    if (!file || !file.type?.startsWith('image/')) {
+      reject(new Error('이미지 파일이 아닙니다.'))
+      return
+    }
+    const url = URL.createObjectURL(file)
+    const img = new Image()
+    img.onload = () => {
+      try {
+        const canvas = document.createElement('canvas')
+        canvas.width = size
+        canvas.height = size
+        const ctx = canvas.getContext('2d')
+        // 중앙 정사각형 크롭(cover)
+        const min = Math.min(img.width, img.height)
+        const sx = (img.width - min) / 2
+        const sy = (img.height - min) / 2
+        ctx.drawImage(img, sx, sy, min, min, 0, 0, size, size)
+        const dataUrl = canvas.toDataURL('image/jpeg', quality)
+        URL.revokeObjectURL(url)
+        resolve(dataUrl)
+      } catch (e) {
+        URL.revokeObjectURL(url)
+        reject(e)
+      }
+    }
+    img.onerror = () => {
+      URL.revokeObjectURL(url)
+      reject(new Error('이미지를 읽지 못했습니다.'))
+    }
+    img.src = url
+  })
+}

src/utils/backup.js

@@ -0,0 +1,154 @@
+// 데이터 백업 — 가계부 전체 데이터를 엑셀(.xlsx)로 내보내기.
+// 참조는 이름 기준(계좌명·분류명·태그명)으로 저장해 추후 '가져오기(복구)' 시 재매핑이 단순하도록 한다.
+import { Capacitor } from '@capacitor/core'
+import { accountApi } from '@/api/accountApi'
+import { appLock } from '@/composables/appLock'
+
+async function safe(promise) {
+  try {
+    return await promise
+  } catch {
+    return []
+  }
+}
+
+function fileName() {
+  const d = new Date()
+  const p = (n) => String(n).padStart(2, '0')
+  return `돈돼지가계부_백업_${d.getFullYear()}${p(d.getMonth() + 1)}${p(d.getDate())}.xlsx`
+}
+
+// 워크북을 플랫폼에 맞게 저장: 웹/PC=다운로드, 앱(네이티브)=파일 저장 후 공유
+async function saveWorkbook(XLSX, wb, name) {
+  if (Capacitor.isNativePlatform()) {
+    const base64 = XLSX.write(wb, { type: 'base64', bookType: 'xlsx' })
+    const { Filesystem, Directory } = await import('@capacitor/filesystem')
+    const { Share } = await import('@capacitor/share')
+    const res = await Filesystem.writeFile({ path: name, data: base64, directory: Directory.Cache })
+    try {
+      appLock.suppressLock() // 공유 시트 복귀 시 앱 잠금 오작동 방지
+      await Share.share({ title: name, text: '가계부 백업 파일', url: res.uri })
+    } catch {
+      /* 공유 취소 — 파일은 캐시에 저장됨 */
+    }
+  } else {
+    XLSX.writeFile(wb, name)
+  }
+}
+
+export async function exportBackup() {
+  const XLSX = await import('xlsx')
+
+  const [entries, wallets, categories, recurrings, budgets, tags, quick] = await Promise.all([
+    safe(accountApi.list({})),
+    safe(accountApi.wallets()),
+    safe(accountApi.categories()),
+    safe(accountApi.recurrings()),
+    // 예산은 월별 — 백업엔 현재 월 예산을 담는다
+    safe(accountApi.budgets({ year: new Date().getFullYear(), month: new Date().getMonth() + 1 })),
+    safe(accountApi.tags()),
+    safe(accountApi.quickEntries()),
+  ])
+
+  const catNameById = {}
+  categories.forEach((c) => (catNameById[c.id] = c.name))
+
+  const wb = XLSX.utils.book_new()
+  const add = (name, rows) => XLSX.utils.book_append_sheet(wb, XLSX.utils.json_to_sheet(rows), name)
+
+  add('내역', entries.map((e) => ({
+    날짜: e.entryDate, 구분: e.type, 분류: e.category, 금액: e.amount, 메모: e.memo,
+    계좌: e.walletName, 계좌ID: e.walletId, 입금계좌: e.toWalletName, 입금계좌ID: e.toWalletId,
+    할부개월: e.installmentMonths, 태그: (e.tags || []).join(','),
+  })))
+  add('계좌', wallets.map((w) => ({
+    ID: w.id, 종류: w.type, 이름: w.name, '은행/카드사': w.issuer, 계좌번호: w.accountNumber,
+    카드유형: w.cardType, 개시잔액: w.openingBalance, 개시일: w.openingDate, '평가액(수동)': w.currentValue,
+  })))
+  add('분류', categories.map((c) => ({
+    구분: c.type, 이름: c.name, 대분류: c.parentId ? catNameById[c.parentId] || '' : '',
+  })))
+  add('고정지출', recurrings.map((r) => ({
+    제목: r.title, 구분: r.type, 금액: r.amount, 분류: r.category, 메모: r.memo,
+    계좌: r.walletName, 계좌ID: r.walletId, 입금계좌: r.toWalletName, 입금계좌ID: r.toWalletId, 주기: r.frequency,
+    일: r.dayOfMonth, 요일: r.dayOfWeek, 월: r.monthOfYear,
+    시작일: r.startDate, 종료일: r.endDate, 활성: r.active,
+  })))
+  add('예산', budgets.map((b) => ({
+    분류: b.category, 고정: b.fixed, 기준단위: b.baseUnit, 기준금액: b.baseAmount,
+    일: b.daily, 주: b.weekly, 월: b.monthly, 년: b.yearly,
+  })))
+  add('태그', tags.map((t) => ({ 이름: t.name })))
+  add('자주쓰는내역', quick.map((q) => ({
+    라벨: q.label, 구분: q.type, 분류: q.category, 금액: q.amount, 메모: q.memo, 계좌: q.walletName, 계좌ID: q.walletId,
+  })))
+
+  await saveWorkbook(XLSX, wb, fileName())
+}
+
+// ===== 가져오기(복구) — 엑셀 파싱 → 백엔드 복구 =====
+export async function importBackup(file) {
+  const XLSX = await import('xlsx')
+  const buf = await file.arrayBuffer()
+  const wb = XLSX.read(buf, { type: 'array' })
+
+  const rows = (name) => {
+    const ws = wb.Sheets[name]
+    return ws ? XLSX.utils.sheet_to_json(ws, { defval: null }) : []
+  }
+  const str = (v) => (v === null || v === undefined || v === '' ? null : String(v).trim())
+  const num = (v) => (v === null || v === undefined || v === '' ? null : Number(v))
+  const bool = (v) => v === true || v === 1 || ['true', 'TRUE', '1', 'Y', '예'].includes(String(v))
+  const date = (v) => {
+    if (v === null || v === undefined || v === '') return null
+    if (typeof v === 'number' && XLSX.SSF) {
+      const d = XLSX.SSF.parse_date_code(v)
+      if (d) return `${d.y}-${String(d.m).padStart(2, '0')}-${String(d.d).padStart(2, '0')}`
+    }
+    return String(v).trim().slice(0, 10) // 'YYYY-MM-DD'
+  }
+
+  const payload = {
+    wallets: rows('계좌')
+      .map((r) => ({
+        oldId: num(r['ID']), type: str(r['종류']), name: str(r['이름']), issuer: str(r['은행/카드사']),
+        accountNumber: str(r['계좌번호']), cardType: str(r['카드유형']),
+        openingBalance: num(r['개시잔액']), openingDate: date(r['개시일']), currentValue: num(r['평가액(수동)']),
+      }))
+      .filter((w) => w.name && w.type),
+    categories: rows('분류')
+      .map((r) => ({ type: str(r['구분']), name: str(r['이름']), parent: str(r['대분류']) }))
+      .filter((c) => c.name && c.type),
+    tags: rows('태그').map((r) => str(r['이름'])).filter(Boolean),
+    entries: rows('내역')
+      .map((r) => ({
+        entryDate: date(r['날짜']), type: str(r['구분']), category: str(r['분류']),
+        amount: num(r['금액']), memo: str(r['메모']), walletId: num(r['계좌ID']), toWalletId: num(r['입금계좌ID']),
+        installmentMonths: num(r['할부개월']),
+        tags: str(r['태그']) ? String(r['태그']).split(',').map((s) => s.trim()).filter(Boolean) : [],
+      }))
+      .filter((e) => e.entryDate && e.type),
+    recurrings: rows('고정지출')
+      .map((r) => ({
+        title: str(r['제목']), type: str(r['구분']), amount: num(r['금액']), category: str(r['분류']), memo: str(r['메모']),
+        walletId: num(r['계좌ID']), toWalletId: num(r['입금계좌ID']), frequency: str(r['주기']),
+        dayOfMonth: num(r['일']), dayOfWeek: num(r['요일']), monthOfYear: num(r['월']),
+        startDate: date(r['시작일']), endDate: date(r['종료일']), active: bool(r['활성']),
+      }))
+      .filter((r) => r.title && r.type),
+    budgets: rows('예산')
+      .map((r) => ({
+        category: str(r['분류']), fixed: bool(r['고정']), baseUnit: str(r['기준단위']), baseAmount: num(r['기준금액']),
+        daily: num(r['일']), weekly: num(r['주']), monthly: num(r['월']), yearly: num(r['년']),
+      }))
+      .filter((b) => b.category),
+    quickEntries: rows('자주쓰는내역')
+      .map((r) => ({
+        label: str(r['라벨']), type: str(r['구분']), category: str(r['분류']),
+        amount: num(r['금액']), memo: str(r['메모']), walletId: num(r['계좌ID']),
+      }))
+      .filter((q) => q.type),
+  }
+
+  await accountApi.restore(payload)
+}

src/utils/datetime.js

@@ -1,7 +1,7 @@
 // 날짜/시간 표시 유틸
 
 /**
- * 1일 이내면 "방금 전 / N분 전 / N시간 전", 그 이상이면 YYYYMMDD 로 표시.
+ * 1시간 이내면 "방금 전 / N분 전", 1일 이내면 "N시간 전", 그 이상이면 YYYY.mm.dd 로 표시.
  */
 export function formatRelative(value) {
   if (!value) return '-'
@@ -17,7 +17,7 @@ export function formatRelative(value) {
   const diffHour = Math.floor(diffMin / 60)
   if (diffHour < 24) return `${diffHour}시간 전`
 
-  return formatYmd(date)
+  return formatYmdDot(date)
 }
 
 /** YYYYMMDD */
@@ -29,3 +29,13 @@ export function formatYmd(value) {
   const d = String(date.getDate()).padStart(2, '0')
   return `${y}${m}${d}`
 }
+
+/** YYYY.MM.DD */
+export function formatYmdDot(value) {
+  const date = value instanceof Date ? value : new Date(value)
+  if (Number.isNaN(date.getTime())) return String(value)
+  const y = date.getFullYear()
+  const m = String(date.getMonth() + 1).padStart(2, '0')
+  const d = String(date.getDate()).padStart(2, '0')
+  return `${y}.${m}.${d}`
+}

src/utils/repayment.js

@@ -0,0 +1,157 @@
+// 대출·카드할부 남은 상환 스케줄 계산 (원금/이자/합계/회차별 남은 잔액)
+// - 카드 할부: 무이자 가정(원금만, 이자 0)
+// - 대출: 상환방식별 상각 (원리금균등/원금균등/만기일시), 현재 남은 원금(balance) 기준
+
+function addMonths(y, m, delta) {
+  const d = new Date(y, m - 1 + delta, 1)
+  return { y: d.getFullYear(), m: d.getMonth() + 1 }
+}
+function label(y, m) {
+  return `${y}.${String(m).padStart(2, '0')}`
+}
+// (by,bm) - (ay,am) 개월 차
+function monthsBetween(ay, am, by, bm) {
+  return (by - ay) * 12 + (bm - am)
+}
+
+export function currentYm() {
+  const d = new Date()
+  return { y: d.getFullYear(), m: d.getMonth() + 1 }
+}
+
+// 대출 남은 상환 스케줄. 반환: { rows:[{label,principal,interest,total,balance}], partial:boolean }
+export function loanSchedule(w, now = currentYm(), cap = 600) {
+  const r = (Number(w.loanRate) || 0) / 100 / 12
+  let bal = Math.abs(Number(w.balance) || 0) // 현재 남은 원금
+  const method = w.loanMethod || 'EQUAL_PAYMENT'
+  if (bal <= 0) return { rows: [], partial: false }
+
+  // 경과·남은 개월수
+  let elapsed = 0
+  if (w.loanStart) {
+    const [sy, sm] = String(w.loanStart).slice(0, 7).split('-').map(Number)
+    if (sy && sm) elapsed = Math.max(0, monthsBetween(sy, sm, now.y, now.m))
+  }
+  const nRem = w.loanMonths ? Math.max(1, Number(w.loanMonths) - elapsed) : null
+
+  const rows = []
+  let { y, m } = now
+
+  if (method === 'EQUAL_PRINCIPAL') {
+    // 원금균등: 매월 원금 고정 = 최초원금 / 총개월 (없으면 잔액/남은개월)
+    const principalPer =
+      w.loanAmount && w.loanMonths
+        ? Math.round(Number(w.loanAmount) / Number(w.loanMonths))
+        : nRem
+          ? Math.round(bal / nRem)
+          : bal
+    while (bal > 0 && rows.length < cap) {
+      const interest = Math.round(bal * r)
+      const principal = Math.min(principalPer, bal)
+      bal = Math.max(0, bal - principal)
+      rows.push({ label: label(y, m), principal, interest, total: principal + interest, balance: bal })
+      ;({ y, m } = addMonths(y, m, 1))
+    }
+    return { rows, partial: false }
+  }
+
+  if (method === 'BULLET') {
+    // 만기일시: 매월 이자만, 마지막 달에 원금 전액
+    const n = nRem || 1
+    for (let i = 0; i < n && rows.length < cap; i++) {
+      const interest = Math.round(bal * r)
+      const isLast = i === n - 1
+      const principal = isLast ? bal : 0
+      const nb = isLast ? 0 : bal
+      rows.push({ label: label(y, m), principal, interest, total: principal + interest, balance: nb })
+      bal = nb
+      ;({ y, m } = addMonths(y, m, 1))
+    }
+    return { rows, partial: !nRem }
+  }
+
+  // EQUAL_PAYMENT 원리금균등
+  // (0) 월 상환금(고정)이 입력돼 있으면 그대로 사용 → 이자=잔액×이율, 원금=상환금-이자 로 은행과 정확히 일치
+  const fixed = Number(w.loanPayment) || 0
+  if (fixed > 0) {
+    while (bal > 0 && rows.length < cap) {
+      const interest = Math.round(bal * r)
+      if (fixed <= interest) {
+        // 상환금이 이자에 못 미침(데이터 이상) → 더 진행 못함
+        rows.push({ label: label(y, m), principal: 0, interest, total: fixed, balance: bal })
+        break
+      }
+      // 마지막 회차: 남은 잔액 한 번에 정산(은행은 잔여 반올림을 마지막 납입에 합산 → 추가 회차 안 생김)
+      if (bal <= fixed) {
+        rows.push({ label: label(y, m), principal: bal, interest, total: bal + interest, balance: 0 })
+        break
+      }
+      const principal = fixed - interest
+      bal = bal - principal
+      rows.push({ label: label(y, m), principal, interest, total: principal + interest, balance: bal })
+      ;({ y, m } = addMonths(y, m, 1))
+    }
+    return { rows, partial: false }
+  }
+
+  // (1) 남은 개월수 n 산출: 최초 상환액으로 역산(loanStart 없어도 정확) → 안되면 loanStart 경과
+  let n = null
+  if (w.loanAmount && w.loanMonths && r > 0) {
+    const origPay = (Number(w.loanAmount) * r) / (1 - Math.pow(1 + r, -Number(w.loanMonths)))
+    // bal = origPay·(1-(1+r)^-n)/r  →  n = -ln(1 - bal·r/origPay) / ln(1+r)
+    const ratio = 1 - (bal * r) / origPay
+    if (ratio > 0 && ratio < 1) {
+      n = Math.min(Number(w.loanMonths), Math.max(1, Math.ceil(-Math.log(ratio) / Math.log(1 + r) - 1e-9)))
+    }
+  }
+  if (n == null) n = nRem
+  if (n == null) {
+    // 개월·원금 정보 부족 → 이번 달 이자만 안내(원금 분리 불가)
+    const interest = Math.round(bal * r)
+    return {
+      rows: [{ label: label(y, m), principal: null, interest, total: null, balance: bal }],
+      partial: true,
+    }
+  }
+  // (2) 스케줄 상환액은 '현재 잔액'을 n개월에 상각 → 원금 항상 양수, 잔액이 0으로 수렴
+  //     (최초원금 기준을 쓰면 잔액>원금 등 데이터 불일치 시 원금이 음수가 되어 잔액이 증가함)
+  const payment = r > 0 ? Math.round((bal * r) / (1 - Math.pow(1 + r, -n))) : Math.round(bal / n)
+  for (let i = 0; i < n && bal > 0 && rows.length < cap; i++) {
+    const interest = Math.round(bal * r)
+    let principal = Math.max(0, payment - interest)
+    if (i === n - 1 || principal > bal) principal = bal // 마지막 회차 잔액 정산
+    bal = Math.max(0, bal - principal)
+    rows.push({ label: label(y, m), principal, interest, total: principal + interest, balance: bal })
+    ;({ y, m } = addMonths(y, m, 1))
+  }
+  return { rows, partial: false }
+}
+
+// 카드 할부(무이자) 남은 스케줄. entry: {amount, installmentMonths, entryDate}
+// 반환: { rows:[...], monthly } 또는 null(진행중 할부 아님)
+export function cardInstallmentSchedule(entry, now = currentYm()) {
+  const N = Number(entry.installmentMonths) || 0
+  const amount = Math.abs(Number(entry.amount) || 0)
+  const date = entry.entryDate ? String(entry.entryDate).slice(0, 7) : ''
+  if (N < 2 || amount <= 0 || !date) return null
+  const [py, pm] = date.split('-').map(Number)
+  if (!py || !pm) return null
+
+  const monthly = Math.round(amount / N)
+  // 청구 회차: 구매 다음 달부터 N개월 (k = 1..N). 마지막 회차는 반올림 오차 정산.
+  const all = []
+  for (let k = 1; k <= N; k++) {
+    const { y, m } = addMonths(py, pm, k)
+    const principal = k === N ? amount - monthly * (N - 1) : monthly
+    all.push({ y, m, principal })
+  }
+  const remaining = all.filter((x) => monthsBetween(now.y, now.m, x.y, x.m) >= 0)
+  if (!remaining.length) return null
+
+  let bal = remaining.reduce((s, x) => s + x.principal, 0)
+  const rows = remaining.map((x) => {
+    bal -= x.principal
+    return { label: label(x.y, x.m), principal: x.principal, interest: 0, total: x.principal, balance: Math.max(0, bal) }
+  })
+  return { rows, monthly }
+}