요청: play-디자인-crowny통일
- 날짜: 2026-06-21 19:38:55
- 작업 경로: /Users/ef/crowny-ai
요청 본문
크라우니플레이 디자인을 crowny.org 와 통일하자. 폰트, 이모지, 프레임, 색상
관련 산출
(클로드가 작업 결과를 이어 기록)
산출 (디자인 통일 완료)
색상·폰트·프레임 — 공유 테마 1개로 전 10개 SPA 통일
public/css/crowny-theme.css— :root 오버레이(보라→골드 #C9A961, 다크 #0A0908/#161410, Pretendard Variable, 라운드/섀도우/보더 crowny 토큰). app/ticket/kbingo 계열(--bg/--fg/--accent)과 walk/matching 계열(--bg/--text) 양쪽 변수명 모두 커버.- 각 SPA head에 Pretendard CDN + 테마 link 주입(인라인 style 뒤 → override). 브랜드 보라 literal(rgba(139,92,246) 등) 골드 치환: app 32·ticket 15·kbingo 20·player 6·mticket 8·scan 6건. 카테고리 다색 팔레트는 보존.
- app.html: 탭바 7아이콘 + 로고 ▶ → 모노톤 SVG.
이모지 — 안전한 런타임 모노톤 치환
public/js/crowny-icons.js— curated EMAP 57키(UI 이모지만; 👨👩👧👦😊🏰🏖 등 의미성은 보존).- 안전장치: ①
<script>/<style>/<textarea>/<code>/<pre>텍스트 제외(JS 보호) ② 텍스트노드 단위 교체(이벤트 리스너 보존) ③ MutationObserver는 '추가된 노드만' 디바운스 처리(전체 재스캔/thrash 방지, flush 중 disconnect). - 전 10개 SPA
</body>앞에 defer 포함. play 상위26 이모지 26/26 커버.
검증
- crowny-theme.css·crowny-icons.js HTTP 200, 전 SPA 서빙 200, 잔존 브랜드보라 0, 스크립트 10/10 포함, node --check 통과.
- ⚠️ jsdom 부재로 옵저버의 라이브 DOM 동작은 헤드리스 검증 불가 → 사용자 강력새로고침 육안 확인 필요.
잔여
- 137 distinct 이모지 롱테일 중 상위 UI ~30개만 매핑(crowny.org와 동일한 curated 방식). 의미성/저빈도 이모지는 의도적 보존.
- 백업 다수(.bak.theme_, .bak.icons_) — 롤백용 보존.