이모지 전면 이미지화: 건물 4종·자연 소품 9종·아이콘 12종

- build2.png → 고양이 집·햇볕 데크·장터·창고 일러스트 적용
- nature.png → 나무 3종(보드=소나무, 외곽=3종 순환)·데이지·튤립·밀·
  버섯·바위·꽃덤불 — 캔버스 나무/장식 이모지 제거
- icons.png → 생선·목재·돌·구이·발바닥 코인·망치·땀·접시·잠·화남·팬·하트
  판자 배지(아이콘+숫자), 말풍선(생산·식사·수면·파업·회수), HUD pill 적용
- 캔버스 이모지 렌더링이 브라우저/OS 폰트에 따라 깨지던 문제 해결
- 원본 3장 assets-src 보관, 이모지는 이미지 로드 실패 시 폴백으로 유지

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

src/components/game/Game.tsx

@@ -21,6 +21,7 @@ import {
   catSprite,
   DECO_DEFS,
   HALL_LEVELS,
+  ICON_IMG,
   KITCHEN_UPGRADE_COST,
   MEAL_PRICES,
   mealCap,
@@ -263,20 +264,27 @@ export default function Game() {
             </button>
             {/* 자원 pill */}
             <div className="mt-2 flex flex-wrap items-center gap-2">
-              {[
-                ["🐱", `${state.cats.length}/${state.hall.capacity}`],
-                ["🐟", Math.floor(state.resources.fish)],
-                ["🪵", Math.floor(state.resources.wood)],
-                ["🪨", Math.floor(state.resources.stone)],
-                ["🍖", meals],
-                ["🪙", Math.floor(state.coins ?? 0)],
-              ].map(([icon, value]) => (
+              {(
+                [
+                  ["🐱", null, `${state.cats.length}/${state.hall.capacity}`],
+                  ["🐟", ICON_IMG.fish, Math.floor(state.resources.fish)],
+                  ["🪵", ICON_IMG.wood, Math.floor(state.resources.wood)],
+                  ["🪨", ICON_IMG.stone, Math.floor(state.resources.stone)],
+                  ["🍖", ICON_IMG.meal, meals],
+                  ["🪙", ICON_IMG.coin, Math.floor(state.coins ?? 0)],
+                ] as Array<[string, string | null, string | number]>
+              ).map(([emoji, img, value]) => (
                 <span
-                  key={icon as string}
+                  key={emoji}
                   className="wood-pill flex items-center gap-1.5 py-1 pl-1 pr-3"
                 >
                   <span className="wood-pill-icon grid h-6 w-6 place-items-center text-[13px]">
-                    {icon}
+                    {img ? (
+                      /* eslint-disable-next-line @next/next/no-img-element */
+                      <img src={img} alt="" className="h-4 w-4 object-contain" />
+                    ) : (
+                      emoji
+                    )}
                   </span>
                   <span className="font-num text-sm leading-none">{value}</span>
                 </span>