feat: implement user preference management with persistence, reactive CSS variables, and layout customization

AGENTS.md

@@ -58,49 +58,66 @@ src/
 
 | Tag | 내용 | 날짜 |
 |---|---|---|
-| `checkpoint-v1.0` | 기본 Full-Stack 기반 | 초기 |
-| `checkpoint-v2.0` | i18n, 3-Way Theme, Demo Mode | - |
-| `checkpoint-v2.1` | 리치 마크다운 렌더러, 적응형 메모장 | - |
-| `checkpoint-v2.2` | 하위 태스크 실시간 동기화 & 인라인 수정 | - |
-| `checkpoint-v3.0` | 사이드바 애니메이션, Import 이동, 커스텀 메뉴, TickTick 스타일 | - |
-| `checkpoint-v3.2` | N-depth 재귀 체크리스트, 태그, 휴지통, 설정 모달, 타임스탬프 | - |
-| `checkpoint-v4.0` | **(현재 최신)** 모바일 바텀시트, 스와이프 닫기, 오버레이 | 2026-08-20 |
+| `checkpoint-v0.1.0` | 기본 Full-Stack 기반 | 초기 |
+| `checkpoint-v0.2.0` | i18n, 3-Way Theme, Demo Mode | - |
+| `checkpoint-v0.2.1` | 리치 마크다운 렌더러, 적응형 메모장 | - |
+| `checkpoint-v0.2.2` | 하위 태스크 실시간 동기화 & 인라인 수정 | - |
+| `checkpoint-v0.3.0` | 사이드바 애니메이션, Import 이동, 커스텀 메뉴, TickTick 스타일 | - |
+| `checkpoint-v0.3.2` | N-depth 재귀 체크리스트, 태그, 휴지통, 설정 모달, 타임스탬프 | - |
+| `checkpoint-v0.4.0` | 모바일 바텀시트, 스와이프 닫기, 오버레이 | 2026-08-20 |
+| `checkpoint-v0.5.0` | **(현재 최신)** VSCode 스타일 무채색 다크 테마, 에디터 조잡한 툴바 제거 & 순수 캔버스 전환, 모듈형 블록 커스텀 (서브태스크 ↔ 노트 순서 스왑 및 스플릿 리사이저 높이 조절), CheckFlow Labs (3컬럼 칸반 보드 뷰), 기본값 복원(Reset to Defaults), 보안 패치 완료 | 2026-08-21 |
 
 ---
 
 ## 4. 구현 완료 기능
 
-- [x] i18n 3개국어 (영어 기본, 한국어, 일본어)
-- [x] 시스템/라이트/다크 테마 토글
-- [x] Demo 모드 (LocalStorage 기반)
+- [x] i18n 3개국어 (영어 기본, 한국어, 일본어 사전 100% 무결성)
+- [x] **VSCode 스타일 무채색 다크 테마** (`#181818`, `#1e1e1e`, `#252526`, `#2d2d2d`)
+- [x] **에디터 툴바 제거 & 심플 캔버스** (조잡한 `- [ ]` 툴바 제거, 순수한 텍스트/마크다운 에디팅)
+- [x] **모듈형 상세 패널 (Custom Blocks)**:
+  - 서브태스크 ↔ 노트 블록 **위치 스왑(⇄ Swap)**
+  - 마우스 드래그로 높이 비율(15%~85%)을 실시간 조절하는 **스플릿 리사이저(Split Resizer)**
+  - 각 블록별 독립적인 접기/펼치기 및 100% 풀스크린 확장
+- [x] **🧪 CheckFlow Labs (실험실 기능)**:
+  - 📋 **리스트 뷰** ↔ 📊 **3컬럼 칸반 보드 뷰 (To Do / In Progress / Done)** 원클릭 전환
+  - 언제든 초기 순정 상태로 되돌리는 **기본값 복원 (Reset to Defaults)**
+- [x] Demo 모드 (LocalStorage 기반 완전한 로컬 구동)
 - [x] N단계 재귀 체크리스트 (RecursiveTaskItem)
-- [x] 인라인 제목 수정
+- [x] 인라인 제목 수정 (더블클릭/엔터/ESC)
 - [x] 커스텀 우클릭 컨텍스트 메뉴 (전체 트리)
 - [x] Created / Edited 타임스탬프
 - [x] 커스텀 태그 (색상 자동 부여)
 - [x] 휴지통 (복원/영구삭제/보관 기간 설정)
-- [x] 마크다운 Preview/Edit + URL 새 탭 열기
-- [x] 설정 모달 (Profile/Preferences/Sync/Admin)
-- [x] 어드민 페이지 (/admin)
+- [x] 설정 모달 (Profile/Preferences/Labs/Sync/Admin)
+- [x] 어드민 대시보드 (`/admin` - ADMIN 롤 및 권한 통제 게이트)
+- [x] 정식 라우트 보호 미들웨어 (`src/middleware.ts` 인증 & 역할 검증)
+- [x] API IDOR 및 소유권 교차 검증 (서브태스크 및 리스트 이동)
+- [x] CSV / ICS Import Formula Injection 방어
 - [x] Ctrl+K 글로벌 명령 팔레트
 - [x] TickTick CSV/ICS 임포트
-- [x] CalDAV 동기화 안내
+- [x] CalDAV 동기화 안내 (DAVx⁵)
+- [x] **TickTick 스타일 스마트 퀵애드 툴바** (날짜, 우선순위 프리셋)
+- [x] **상단 프로젝트 브레드크럼 & 리스트 이동기** (`📁 프로젝트명 ▾`)
 - [x] **모바일 바텀시트 드로어** (Y축 스와이프, 오버레이)
 - [x] FAB 버튼 (모바일 태스크 추가)
 
 ---
 
-## 5. 개발 규칙 및 주의사항
+## 5. 개발 규칙 및 보안 원칙
 
-1. **메모장 우선 원칙**: 우측 패널에서 메모장은 항상 `flex: 1`.
-2. **컨텍스트 메뉴**: `ContextMenu.tsx` 사용, 브라우저 기본 메뉴 비활성화.
-3. **i18n 무결성**: 새 텍스트는 en/ko/ja 사전에 모두 추가.
-4. **모바일 CSS 규칙**:
+1. **최상위 원칙 - 보안, 프라이버시, 안정성**:
+   - 모든 API 요청은 세션 소유권(`userId === session.user.id`)을 철저히 검증할 것.
+   - 사용자 입력(마크다운, CSV/ICS 등)은 DOMPurify 및 Formula Sanitize를 반드시 통과할 것.
+   - 어드민 전용 라우트는 `role === "ADMIN"`을 서버/미들웨어 레벨에서 필터링할 것.
+2. **사용자 주도 커스터마이징 & 공간 효율성**:
+   - 모든 블록과 뷰(리스트/칸반, 서브태스크/노트 스플릿 비율 등)는 사용자가 원하는 대로 직관적으로 조절 가능해야 함.
+   - 불필요한 조잡한 툴바를 배제하고 심플하고 직관적인 조작성 유지.
+3. **컨텍스트 메뉴**: `ContextMenu.tsx` 사용, 브라우저 기본 메뉴 비활성화.
+4. **i18n 무결성**: 새 텍스트는 en/ko/ja 사전에 모두 추가.
+5. **모바일 CSS 규칙**:
    - `detail-panel mobile-open` 클래스가 바텀시트를 제어.
-   - **절대** `task-detail-panel` 클래스로 되돌리지 말 것 (구버전).
    - 모바일: `translateY(100%) → translateY(0)` 애니메이션.
    - 데스크탑: `detail-panel`이 flex 방향 측면 패널.
-5. **터치 제스처**: Y축 아래 방향 120px 이상 스와이프 → `onClose()`.
 6. **언어**: 사용자 응답 및 에이전트 간 소통은 한국어를 기본으로 할 것.
 
 ---
@@ -173,6 +190,8 @@ src/
 └── lib/
     ├── i18n/ (en, ko, ja 사전 및 useI18n 훅)
     ├── mockData.ts                    ← Demo 모드용 LocalStorage Store
+    ├── userPrefs.ts                   ← 글로벌 사용자 설정 스토어 (v0.6+)
+    ├── useUserPrefs.ts                ← 반응형 prefs 훅 + CSS var 인젝터
     ├── auth.ts / prisma.ts
 ```
 
@@ -184,7 +203,9 @@ src/
 - **`checkpoint-v2.0`**: i18n(EN/KO/JA), 3-Way Theme(System/Light/Dark), Demo Mode 탑재
 - **`checkpoint-v2.1`**: 리치 마크다운 GUI 렌더러(MarkdownNoteEditor), 적응형 와이드 메모장
 - **`checkpoint-v2.2`**: 하위 태스크 실시간 동기화 & 인라인 즉시 수정 UX
-- **`checkpoint-v3.0`**: **(현재 최신)** 부드러운 사이드바 애니메이션, 테마 버튼 잘림 완벽 해결, Import 기능 프로필 메뉴 이동, 커스텀 웹앱 우클릭 컨텍스트 메뉴, TickTick 스타일 우측 상세 탭 완비
+- **`checkpoint-v3.0`**: 부드러운 사이드바 애니메이션, 테마 버튼 잘림 완벽 해결, Import 기능 프로필 메뉴 이동, 커스텀 웹앱 우클릭 컨텍스트 메뉴, TickTick 스타일 우측 상세 탭 완비
+- **`checkpoint-v0.5.0`**: 버전 체계 0.x.x 전환, VSCode 무채색 다크 테마, 미니멀 에디터(툴바 제거), 모듈형 블록 스왑/리사이저, 칸반 보드 Labs, 설정 Labs 탭 신설
+- **`checkpoint-v0.6.0` (현재 최신)**: 글로벌 `UserPrefs` 시스템(`userPrefs.ts` / `useUserPrefs.ts`) 도입, 사이드바 드래그 리사이저, 디테일 패널 드래그 리사이저, Labs 탭 확장(밀도/폰트/라운드/애니메이션/색조/채도/패널 너비), 뷰 전환(리스트↔칸반) 페이지 리로드 없이 반응, 파스텔 매트 라이트 팔레트 적용
 
 ---
 
@@ -192,4 +213,14 @@ src/
 
 1. **메모장 우선 원칙**: 우측 상세 탭에서 메모장은 항상 메인 영역(`flex: 1`)을 차지하도록 유지할 것.
 2. **웹앱 인터랙션**: 브라우저 기본 컨텍스트 메뉴 대신 `ContextMenu.tsx`를 통해 앱스러운 UX를 유지할 것.
-3. **i18n 무결성**: 텍스트 추가 시 `src/lib/i18n`의 en, ko, ja 사전에 모두 추가할 것.
+3. **i18n 무결성**: 텍스트 추가 시 `src/lib/i18n`의 en, ko, ja 사전에 모두 추가할 것.
+
+<!-- BEGIN:nextjs-agent-rules -->
+
+# This is NOT the Next.js you know
+
+This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read the relevant guide in `node_modules/next/dist/docs/` (resolved from this file's directory; in monorepos the `next` package may not be visible from the repo root) before writing any code. Heed deprecation notices.
+
+This block is written and re-added by `next dev` — verify at `node_modules/next/dist/server/lib/generate-agent-files.js`. Removing it from a diff only re-creates the uncommitted change; committing it with your work keeps the tree clean.
+
+<!-- END:nextjs-agent-rules -->