METADATA · TOKENS
🎨 메타데이터 토큰
DB theme JSONB → CSS 변수 14종 매핑 + 9-슬롯 기본 레이아웃 + Zod-equivalent 스키마 검증.
| 키 | 값 | CSS 변수 | 미리보기 |
|---|---|---|---|
primaryBg | #0C0C1E | --cl-bg | |
accentColor | #6366F1 | --cl-main | |
accentHover | #818CF8 | --cl-main-hover | |
accentPress | #4F46E5 | --cl-main-press | |
cardBg | #14142B | --cl-card | |
surfaceBg | #1E1E38 | --cl-surface | |
borderColor | #2D2D4A | --cl-border | |
text1 | #E0E0F0 | --cl-text1 | |
text2 | #C8C8E0 | --cl-text2 | |
text3 | #6B6B90 | --cl-text3 | |
gap | 16px | --mc-slot-gap | — |
radius | 16px | --mc-canvas-radius | — |
canvasBg | rgba(20, 20, 43, 0.65) | --mc-canvas-bg | |
canvasBackdrop | blur(16px) | --mc-canvas-backdrop | — |
resolveTokensToCss → 14개 매핑 (TOKEN_MAP에 등록된 키만 통과)
| # | id | 타입 | 제목 | 조건부 |
|---|---|---|---|---|
| 1 | hero | HEADER | 차량 프로필 | — |
| 2 | fuel-price | STATS | 실시간 유가 | — |
| 3 | alerts | CONTENT | 스마트 알림 | ✅ |
| 4 | insight | CONTENT | 인사이트 | ✅ |
| 5 | quick-actions | CONTENT | 빠른 실행 | — |
| 6 | services | CONTENT | 안전서약·영수증 | — |
| 7 | ai-analysis | CHART | AI 분석 | — |
| 8 | notifications | CONTENT | 알림센터 | ✅ |
| 9 | bottom-cards | CHART | 지출·세차 | — |
✅ 검증 통과