/* 小窝本地重构游戏 · 第二批（打地鼠 / 节奏黑白块 / 表情捕捉 / 跳跃冒险 / 配对记忆 / 迷宫逃脱）
 * 复用 native/common.css 的 .native-game-* 视觉令牌，这里只放各游戏专属布局。 */

/* 打地鼠 */
.whackamole .whack-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  width: min(100%, 300px);
  margin: 8px auto 0;
}
.whackamole .whack-cell {
  aspect-ratio: 1;
  border: 1px solid var(--game-line);
  border-radius: 14px;
  background: var(--game-surface);
  font-size: clamp(28px, 9vw, 48px);
  cursor: pointer;
  transition: transform .12s ease, background .12s ease;
}
.whackamole .whack-cell.is-up {
  background: var(--game-surface-strong);
  transform: scale(1.05);
}

/* 节奏黑白块（行模型） */
.pianotiles .ptiles-board {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 5px;
  width: min(100%, 300px);
  height: 232px;
  margin: 10px auto 0;
  padding: 6px;
  background: rgba(0,0,0,.22);
  border: 1px solid var(--game-line);
  border-radius: 12px;
  overflow: hidden;
}
.pianotiles .ptiles-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  height: 52px;
  flex: 0 0 auto;
}
.pianotiles .ptiles-cell {
  border-radius: 8px;
  background: #2b2f3a;
  cursor: pointer;
  transition: transform .08s ease, background .15s ease;
}
.pianotiles .ptiles-cell.is-dark {
  background: linear-gradient(180deg, #34e0f0, #0ea5b7);
  box-shadow: 0 0 12px rgba(34,211,238,.55);
}
.pianotiles .ptiles-cell.is-hit {
  background: #1f9d57 !important;
  box-shadow: none;
  cursor: default;
}
.pianotiles .ptiles-cell:active { transform: scale(.96); }

/* 表情捕捉 */
.emojicatcher .emoji-field {
  position: relative;
  height: 260px;
  width: min(100%, 320px);
  margin: 8px auto 0;
  border: 1px solid var(--game-line);
  border-radius: 12px;
  background: var(--game-surface);
  overflow: hidden;
}
.emojicatcher .emoji-item {
  position: absolute;
  top: -12%;
  font-size: 30px;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  animation: emoji-fall 1.6s linear forwards;
}
@keyframes emoji-fall { from { top: -12%; } to { top: 100%; } }

/* 跳跃冒险 */
.jumpgame .jump-stage {
  position: relative;
  height: 220px;
  width: min(100%, 360px);
  margin: 8px auto 0;
  border: 1px solid var(--game-line);
  border-radius: 12px;
  background: var(--game-surface);
  overflow: hidden;
}
.jumpgame .jump-runner {
  position: absolute;
  left: 10%;
  bottom: 0;
  font-size: 34px;
  transition: bottom .12s ease;
}
.jumpgame .jump-runner.is-jump { bottom: 42%; }
.jumpgame .jump-obstacle {
  position: absolute;
  bottom: 0;
  font-size: 30px;
}

/* 配对记忆 */
.matchpairs .pairs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  width: min(100%, 320px);
  margin: 8px auto 0;
}
.matchpairs .pairs-card {
  aspect-ratio: 1;
  border: 1px solid var(--game-line);
  border-radius: 12px;
  background: var(--game-surface);
  font-size: clamp(22px, 7vw, 36px);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  transition: background .12s ease;
}
.matchpairs .pairs-card.is-open { color: var(--text); background: var(--game-surface-strong); }
.matchpairs .pairs-card.is-done { color: var(--text); background: var(--game-accent); opacity: .7; cursor: default; }

/* 迷宫逃脱 */
.maze .maze-grid {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 2px;
  width: min(100%, 320px);
  margin: 8px auto 0;
}
.maze .maze-cell {
  aspect-ratio: 1;
  border-radius: 3px;
  background: var(--game-surface);
}
.maze .maze-cell.is-wall { background: #5b6678; }
.maze .maze-cell.is-player { background: var(--game-accent); }
.maze .maze-cell.is-end { background: #34d399; }
