M9: 컴퓨터와 연습하기 화면과 E2E

- 게임 상세·홈 [🤖 컴퓨터와 연습하기], 대기실 [🤖 컴퓨터 넣기]·[✕], 🤖 아바타·배지,
  연습 게임 안내, 한 판 더는 사람만 세기
- e2e/bots.e2e.ts: 오목 연습(컴퓨터가 여러 번 받음), 원카드 컴퓨터 2명 여러 턴

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/components/ui.tsx

@@ -1,7 +1,7 @@
 /** Shared UI primitives (docs/07 §4). */
 import { useEffect, useRef, useState, type ReactNode } from 'react';
 import type { PublicUser } from '@bg/shared/lite';
-import { formatRoomCode } from '@bg/shared/lite';
+import { formatRoomCode, isBotId } from '@bg/shared/lite';
 import { useToasts, toast } from '../store/toast';
 import { useRoom } from '../net/socket';
 import { haptic } from '../lib/feedback';
@@ -14,7 +14,7 @@ export function Avatar({ user, size = 40 }: { user: Pick<PublicUser, 'id' | 'nic
   const bg = AVATAR_COLORS[h % AVATAR_COLORS.length];
   return (
     <span className="avatar" style={{ width: size, height: size, background: bg, fontSize: size * 0.45 }} aria-hidden>
-      {user.avatar ? <img src={user.avatar} alt="" loading="lazy" referrerPolicy="no-referrer" /> : [...user.nickname][0]}
+      {user.avatar ? <img src={user.avatar} alt="" loading="lazy" referrerPolicy="no-referrer" /> : isBotId(user.id) ? '🤖' : [...user.nickname][0]}
     </span>
   );
 }