/* K 段第二批五款小游戏（10-20，kidsKit.js + kidsMissing / kidsSays / kidsBingo / kidsPeek / kidsBoard）。
   整屏规则沿用 style.css 的 body.kgame-mode；尺寸用 vh 的 clamp，手机到一体机一套。
   点击区一律大（学前孩子点不准、点时常带一点拖），没有倒计时条。 */
.kgame-mode .screen.kg2 {
  flex: 1 1 auto; height: auto; min-height: 0; border-radius: 22px;
  display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.screen.kg2 { min-height: 100%; padding: 12px; box-sizing: border-box; display: flex; flex-direction: column; overflow-x: hidden; user-select: none; -webkit-user-select: none; }
.kg2-missing { background: linear-gradient(180deg, #eff6ff, #dbeafe 60%, #bfdbfe); }
.kg2-says { background: linear-gradient(180deg, #fff7ed, #ffedd5 60%, #fed7aa); }
.kg2-bingo { background: linear-gradient(180deg, #f0fdf4, #dcfce7 60%, #bbf7d0); }
.kg2-peek { background: linear-gradient(180deg, #faf5ff, #ede9fe 60%, #ddd6fe); }
.kg2-board { background: linear-gradient(180deg, #f8fafc, #e2e8f0 60%, #cbd5e1); }

.kg2-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 2px 6px; }
.kg2-top-r { display: flex; gap: 8px; }
.kg2-btn {
  width: clamp(44px, 6vh, 64px); height: clamp(44px, 6vh, 64px); border: 0; border-radius: 999px; background: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: clamp(20px, 3vh, 30px); box-shadow: 0 4px 10px rgba(0,0,0,.08); color: #334155;
}
.kg2-stars, .kg2-done-stars { flex: 1; text-align: center; font-size: clamp(16px, 2.4vh, 26px); letter-spacing: 2px; }
.kg2-stage { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(8px, 1.6vh, 20px); }
.kg2-bubble {
  background: #fff; border-radius: 18px; padding: clamp(6px, 1.2vh, 14px) clamp(14px, 2.4vh, 28px); font-size: clamp(22px, 4.2vh, 50px);
  font-weight: 800; color: #1e3a8a; box-shadow: 0 6px 16px rgba(0,0,0,.08); max-width: 94%; text-align: center; line-height: 1.2;
}
.kg2-row { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(8px, 1.6vw, 24px); }
.kg2-card {
  position: relative; width: clamp(88px, 19vh, 220px); aspect-ratio: 1 / 1.12; border: 6px solid #fff; border-radius: 24px; background: #fff;
  padding: 6px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  box-shadow: 0 10px 22px rgba(0,0,0,.12); cursor: pointer; transition: transform .2s, box-shadow .2s, opacity .3s; font: inherit; color: inherit;
}
.kg2-img { width: 100%; flex: 1; min-height: 0; object-fit: contain; border-radius: 16px; pointer-events: none; }
.kg2-pic { font-size: clamp(44px, 9vh, 110px); line-height: 1; }
.kg2-en { font-style: normal; font-size: clamp(12px, 2vh, 24px); font-weight: 800; color: #1e3a8a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.kg2-card.no, .kb-cell.no, .ks-z.no { animation: kg2Shake .4s; }
.kg2-card.hint, .kb-cell.hint { border-color: #facc15; box-shadow: 0 0 0 10px rgba(250,204,21,.45); animation: kg2Pulse 1s infinite; }
.kg2-card.lit { transform: translateY(-10px) scale(1.06); border-color: #60a5fa; }
.kg2-acts { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: clamp(8px, 1.4vh, 18px) 0 4px; }
.kg2-choices { padding: clamp(8px, 1.4vh, 18px) 0 4px; }
.kg2-say { font-size: clamp(20px, 3.4vh, 40px); font-weight: 800; color: #1e293b; text-align: center; }
.kg2-tip { font-size: clamp(13px, 2vh, 22px); color: #475569; min-height: 1.2em; text-align: center; }
.kg2-mic {
  width: clamp(78px, 11vh, 120px); height: clamp(78px, 11vh, 120px); border: 0; border-radius: 999px; font-size: clamp(34px, 5vh, 56px); color: #fff; cursor: pointer;
  background: linear-gradient(180deg, #58c963, #3db54a); box-shadow: 0 10px 22px rgba(40,140,60,.3);
}
.kg2-mic.rec { background: linear-gradient(180deg, #ffb35c, #f5821f); animation: kg2Pulse 1s infinite; }
.kg2-done { flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(12px, 2.4vh, 28px); }
.kg2-done-hero { font-size: clamp(80px, 16vh, 180px); line-height: 1; animation: kg2Bounce 1.2s ease-in-out infinite; }
.kg2-done-big { font-size: clamp(56px, 10vh, 112px); line-height: 1; }
.kg2-done-acts { display: flex; gap: 28px; }
.kg2-done-btn {
  width: clamp(72px, 11vh, 120px); height: clamp(72px, 11vh, 120px); border: 0; border-radius: 999px; background: #fff; cursor: pointer;
  font-size: clamp(30px, 5vh, 52px); box-shadow: 0 8px 20px rgba(0,0,0,.12);
}
@keyframes kg2Shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-10px); } 75% { transform: translateX(10px); } }
@keyframes kg2Pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@keyframes kg2Bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes kg2Pop { 0% { transform: scale(.3); opacity: 0; } 70% { transform: scale(1.12); opacity: 1; } 100% { transform: scale(1); } }

/* 🙈 少了谁 */
.kg2-table .kg2-card { cursor: default; }
.kg2-table.n5 .kg2-card { width: clamp(76px, 16vh, 190px); }
.kg2-card.empty { background: rgba(255,255,255,.45); border-style: dashed; border-color: #93c5fd; box-shadow: none; }
.kg2-q { font-size: clamp(48px, 9vh, 110px); font-weight: 900; color: #3b82f6; }
.kg2-shadow { position: absolute; font-size: clamp(44px, 9vh, 110px); opacity: .18; filter: grayscale(1); }
.kg2-card.back { animation: kg2Pop .5s ease; border-color: #34d399; }
.kg2-night {
  position: absolute; inset: 0; border-radius: 22px; background: radial-gradient(circle at 50% 30%, #1e3a8a, #0b1026 75%);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: #fde68a; animation: kg2Pop .4s ease;
}
.kg2-night span { font-size: clamp(80px, 16vh, 180px); }
.kg2-night b { font-size: clamp(24px, 4.4vh, 52px); }

/* 🫡 小鲲说 */
.ks-play { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 4vw, 60px); flex-wrap: wrap; }
.ks-kid { position: relative; width: clamp(220px, 46vh, 460px); aspect-ratio: 1 / 1; }
.ks-img { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 28px; user-select: none; -webkit-user-drag: none; pointer-events: none; }
/* 点区按 says-kid.webp 里五官的位置（百分比），换图要重量 */
.ks-z { border: 0; padding: 0; cursor: pointer; position: absolute; border-radius: 999px; background: transparent; transition: transform .15s, background .15s; touch-action: manipulation; }
.ks-z:hover { background: rgba(250,204,21,.18); }
.ks-z:active { transform: scale(.92); }
.ks-z.hint { animation: kg2Pulse 1s infinite; box-shadow: 0 0 0 8px rgba(250,204,21,.7); }
.ks-hair { left: 20%; top: 8%; width: 60%; height: 32%; border-radius: 50% 50% 30% 30%; }
.ks-ear { top: 48%; width: 11%; height: 16%; }
.ks-ear.l { left: 16%; } .ks-ear.r { left: 73%; }
.ks-eye { top: 46.5%; width: 13%; height: 13%; }
.ks-eye.l { left: 30.5%; } .ks-eye.r { left: 55.5%; }
.ks-nose { left: 45%; top: 53.5%; width: 10%; height: 6.5%; }
.ks-mouth { left: 42%; top: 60.5%; width: 16%; height: 8%; }
.ks-do { width: clamp(120px, 24vh, 260px); border-color: #fb923c; }
.ks-trick { color: #9a3412; }
.ks-lead { cursor: default; width: clamp(120px, 22vh, 240px); }
.ks-lead .kg2-en { white-space: normal; text-align: center; font-size: clamp(11px, 1.7vh, 20px); }
.ks-kun-do { font-size: clamp(60px, 12vh, 140px); display: inline-block; animation: kg2Bounce .8s ease-in-out infinite; }

/* 🎱 图片宾果 */
.kb-grid { display: grid; gap: clamp(6px, 1.2vh, 14px); width: min(92vw, 62vh); }
.kb-grid.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(80vw, 52vh); }
.kb-grid.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kb-cell {
  position: relative; aspect-ratio: 1 / 1; border: 5px solid #fff; border-radius: 20px; background: #fff; padding: 4px; box-sizing: border-box; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: 0 6px 14px rgba(0,0,0,.1); font: inherit;
}
.kb-cell .kg2-pic { font-size: clamp(34px, 7vh, 84px); }
.kb-cell.on { background: #dcfce7; border-color: #22c55e; }
.kb-cell.free { background: #fef9c3; border-color: #facc15; cursor: default; }
.kb-stamp { position: absolute; right: 6%; top: 4%; font-size: clamp(22px, 4vh, 44px); color: #16a34a; animation: kg2Pop .35s ease; }
.kb-shout {
  border: 0; border-radius: 999px; padding: clamp(12px, 2vh, 22px) clamp(28px, 5vh, 56px); font-size: clamp(26px, 4.8vh, 56px); font-weight: 900; color: #fff; cursor: pointer;
  background: linear-gradient(180deg, #f472b6, #db2777); box-shadow: 0 10px 22px rgba(219,39,119,.35); animation: kg2Pulse 1s infinite;
}
.kb-shout.rec { background: linear-gradient(180deg, #ffb35c, #f5821f); }
.kb-party { position: absolute; z-index: 3; top: 40%; font-size: clamp(36px, 7vh, 84px); font-weight: 900; color: #db2777; background: #fff; border-radius: 24px; padding: 8px 24px; box-shadow: 0 10px 30px rgba(0,0,0,.18); animation: kg2Pop .4s ease; }
.kb-pick { width: clamp(120px, 22vh, 240px); }
.kb-pick .kg2-en { font-size: clamp(14px, 2.2vh, 24px); }
.kb-big { width: clamp(180px, 42vh, 460px); cursor: default; }
.kb-big .kg2-pic { font-size: clamp(100px, 22vh, 260px); }
.kb-big .kg2-en { font-size: clamp(24px, 5vh, 56px); }
.kb-history { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; font-size: clamp(22px, 4vh, 44px); opacity: .8; }
.kb-next { background: linear-gradient(180deg, #38bdf8, #0284c7); }
.kb-print { background: #fff; overflow: auto; }
.kb-pcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; padding: 8px; }
.kb-pcard { border: 2px dashed #94a3b8; border-radius: 14px; padding: 10px; break-inside: avoid; page-break-inside: avoid; }
.kb-ptitle { font-weight: 800; text-align: center; margin-bottom: 6px; color: #0f172a; }
.kb-pcard .kb-grid { width: 100%; }
.kb-pcard .kb-cell { box-shadow: none; border: 2px solid #cbd5e1; cursor: default; }
.kb-pcard .kb-cell .kg2-pic { font-size: 44px; }
.kb-pcard .kg2-en { font-size: 12px; white-space: normal; overflow: visible; text-align: center; line-height: 1.1; word-break: break-word; }
@media print {
  body * { visibility: hidden; }
  .kb-print, .kb-print * { visibility: visible; }
  .kb-print { position: absolute; left: 0; top: 0; width: 100%; }
  .kb-noprint { display: none !important; }
  .kb-pcards { grid-template-columns: repeat(2, 1fr); }
}

/* 🔦 一点点揭开 */
.kp-frame { position: relative; width: min(84vw, 50vh); aspect-ratio: 1 / 1; border-radius: 26px; overflow: hidden; background: #fff; box-shadow: 0 12px 28px rgba(76,29,149,.18); touch-action: none; }
.kp-under { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 8%; box-sizing: border-box; }
.kp-under .kg2-img { width: 100%; height: 100%; }
.kp-pic { font-size: clamp(120px, 30vh, 320px); }
.kp-tiles { position: absolute; inset: 0; display: grid; gap: 3px; }
.kp-tiles.s2 { grid-template-columns: repeat(2, 1fr); } .kp-tiles.s3 { grid-template-columns: repeat(3, 1fr); } .kp-tiles.s4 { grid-template-columns: repeat(4, 1fr); }
.kp-tile {
  border: 0; margin: 0; cursor: pointer; touch-action: none; transition: opacity .35s, transform .35s;
  background: linear-gradient(135deg, #a78bfa, #7c3aed); box-shadow: inset 0 0 0 3px rgba(255,255,255,.35);
}
.kp-tile:nth-child(odd) { background: linear-gradient(135deg, #c4b5fd, #8b5cf6); }
.kp-tile.on { opacity: 0; transform: scale(.6) rotate(8deg); pointer-events: none; }

/* 👻 幽灵蜘蛛棋 */
.kd-board { position: relative; width: min(94vw, 60vh); aspect-ratio: 1 / 1; }
.kd-cell {
  position: absolute; width: 17%; aspect-ratio: 1 / 1; transform: translate(-50%, -50%); border-radius: 18px; background: #fff; border: 4px solid #fff;
  display: flex; align-items: center; justify-content: center; padding: 3px; box-sizing: border-box; box-shadow: 0 6px 14px rgba(0,0,0,.12); transition: box-shadow .2s;
}
.kd-cell .kg2-pic { font-size: clamp(26px, 5.4vh, 60px); }
.kd-cell.home { background: #fef3c7; border-color: #f59e0b; }
.kd-cell.lit { border-color: #f59e0b; box-shadow: 0 0 0 8px rgba(245,158,11,.4); }
.kd-fx { position: absolute; left: -12%; bottom: -12%; font-style: normal; font-size: clamp(18px, 3.2vh, 36px); }
.kd-tok { position: absolute; top: -26%; font-size: clamp(22px, 4.4vh, 48px); transition: all .3s; filter: drop-shadow(0 3px 3px rgba(0,0,0,.25)); }
.kd-tok.t0 { left: -6%; } .kd-tok.t1 { right: -6%; }
.kd-tok.now { animation: kg2Bounce .9s ease-in-out infinite; }
.kd-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 8px; }
.kd-who { font-size: clamp(36px, 7vh, 80px); }
.kd-die {
  width: clamp(90px, 15vh, 160px); height: clamp(90px, 15vh, 160px); border: 0; border-radius: 28px; background: #fff; cursor: pointer;
  font-size: clamp(54px, 9vh, 100px); box-shadow: 0 10px 22px rgba(0,0,0,.15); animation: kg2Pulse 1.2s infinite;
}
.kd-mid { font-size: clamp(64px, 11vh, 120px); line-height: 1; animation: kg2Pop .35s ease; }
.kd-mid.big { font-size: clamp(90px, 16vh, 180px); }

/* 主题课页小游戏入口的插画图标（图没下来时 emoji 还在底下） */
.kth-game-ic.pic { position: relative; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 12px; overflow: hidden; }
.kth-game-ic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }