인트로 화면: 타이틀 일러스트 + 구름 걷힘 연출

- 접속 시 intro.png 타이틀 화면, 중앙 하단 둥실거리는 시작하기 버튼
- 시작하기 클릭: 인트로가 1초간 투명해지며 아래 깔린 구름 레이어가
  드러나고, 구름 두 장이 양옆으로 1.9초간 걷히며 마을 진입
- 구름은 CSS로 구성 (블러 처리한 본체 + 안쪽 가장자리 뭉게 퍼프 7개)

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

src/components/game/Game.tsx

@@ -7,6 +7,7 @@ import DbStatus from "@/components/DbStatus";
 import NicknameModal from "@/components/game/NicknameModal";
 import ChatTicker from "@/components/game/ChatTicker";
 import ChatPanel from "@/components/game/ChatPanel";
+import IntroScreen from "@/components/game/IntroScreen";
 import {
   engine,
   effectiveRate,
@@ -119,6 +120,7 @@ type Panel =
 export default function Game() {
   const { state, dispatch } = useGame();
   const [panel, setPanel] = useState<Panel>(null);
+  const [showIntro, setShowIntro] = useState(true);
   const [candidates, setCandidates] = useState<Cat[] | null>(null);
   const [placing, setPlacing] = useState<PlacingState | null>(null);
   const [message, setMessage] = useState<string | null>(null);
@@ -211,6 +213,8 @@ export default function Game() {
 
   return (
     <div className="fixed inset-0 overflow-hidden">
+      {/* ── 인트로 (시작하기 → 구름 걷힘) ── */}
+      {showIntro && <IntroScreen onDone={() => setShowIntro(false)} />}
       <VillageView
         onBuildingClick={(id) => {
           if (id === "hall") setPanel({ type: "hall" });