M9: 게임 26종 30초 요약 카드·[?] 지금 할 수 있는 것 내용

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

apps/web/src/games/poker/quick.tsx

@@ -0,0 +1,79 @@
+/** 포커 30초 규칙 요약 (docs/07 §5). Chips are play points only. */
+import { PlayingCard } from '../../components/cards/PlayingCard';
+import { ChipIcon } from '../../components/cards/Chips';
+import type { QuickCard } from '../types';
+
+function Fan({ cards, label }: { cards: string[]; label: string }) {
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 8 }} aria-hidden>
+      <div style={{ display: 'flex' }}>
+        {cards.map((c, i) => (
+          <PlayingCard key={c} card={c} size="md" style={i > 0 ? { marginLeft: -16 } : undefined} />
+        ))}
+      </div>
+      <strong style={{ fontSize: '1.2rem' }}>{label}</strong>
+    </div>
+  );
+}
+
+function MiniButton({ text, sub, color }: { text: string; sub: string; color: string }) {
+  return (
+    <span
+      style={{ display: 'inline-flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', width: 58, height: 52, borderRadius: 10, background: color, color: '#fff', fontWeight: 800, lineHeight: 1.15 }}
+    >
+      <span style={{ fontSize: '1.05rem' }}>{text}</span>
+      <small style={{ fontSize: '0.75rem', opacity: 0.9 }}>{sub}</small>
+    </span>
+  );
+}
+
+function BetPic() {
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 10 }} aria-hidden>
+      <div style={{ display: 'flex', alignItems: 'center', gap: 6, fontWeight: 900, fontSize: '1.3rem' }}>
+        <ChipIcon size={26} />
+        <span>모인 칩 120</span>
+      </div>
+      <div style={{ display: 'flex', gap: 4 }}>
+        <MiniButton text="다이" sub="포기" color="#dc2626" />
+        <MiniButton text="체크" sub="0 칩" color="#2563eb" />
+        <MiniButton text="콜" sub="+10 칩" color="#2563eb" />
+        <MiniButton text="하프" sub="+60 칩" color="#7c3aed" />
+      </div>
+    </div>
+  );
+}
+
+function HandPic() {
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 8 }} aria-hidden>
+      <div style={{ display: 'flex', gap: 4 }}>
+        <PlayingCard card="QH" size="md" />
+        <PlayingCard card="QS" size="md" />
+        <PlayingCard card="7D" size="md" />
+      </div>
+      <span style={{ fontSize: '1.3rem', fontWeight: 900, padding: '2px 12px', borderRadius: 999, background: '#fde047', color: '#422006' }}>지금: 원페어</span>
+    </div>
+  );
+}
+
+export const quickStart: QuickCard[] = [
+  {
+    pic: <Fan cards={['KS', 'KH', 'KD', '7C', '7S']} label="풀하우스" />,
+    alt: '카드 5장(K 세 장과 7 두 장)이 펼쳐져 있고 아래에 풀하우스라고 적혀 있어요',
+    title: '족보가 센 사람이 이겨요',
+    text: '모드마다 카드를 받는 방법은 달라도, 마지막까지 남은 사람끼리 카드를 비교해 족보가 가장 센 사람이 모인 칩을 가져가요.',
+  },
+  {
+    pic: <BetPic />,
+    alt: '모인 칩 숫자 아래에 다이, 체크, 콜, 하프 버튼이 나란히 있어요',
+    title: '차례마다 칩을 걸어요',
+    text: '내 차례에 [체크]로 넘기거나 [콜]로 앞사람만큼 맞추거나 더 올려요. [다이]·[폴드]를 누르면 이번 판은 포기해요.',
+  },
+  {
+    pic: <HandPic />,
+    alt: '퀸 두 장과 7 한 장 아래에 지금 원페어라고 노란 글씨로 적혀 있어요',
+    title: '내 족보는 "지금:"에',
+    text: '족보 표시가 켜진 방에서는 내 카드 아래 "지금:"에 족보가 보여요. 순서는 [족보] 칸에 있어요. 모두 포기하면 남은 한 명이 가져가요.',
+  },
+];