.answer {
  font-size: clamp(16px, 4vw, 26px);
  overflow-wrap: anywhere;
}

.answer:disabled,
.memory-card:disabled,
.number-tile:disabled,
.tap-tile:disabled {
  cursor: default;
}

.number-board,
.tap-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.number-tile,
.tap-tile {
  min-height: 78px;
  border: 2px solid #e8e1f5;
  border-radius: 18px;
  background: #fff;
  color: #49337d;
  font-size: 31px;
  font-weight: 900;
  box-shadow: 0 5px 0 #ded4ef;
  transition: transform .15s, opacity .2s, background .2s;
}

.number-tile:active,
.tap-tile:active {
  transform: translateY(4px);
  box-shadow: 0 1px 0 #ded4ef;
}

.number-tile.popped {
  opacity: .25;
  transform: scale(.75);
  background: #dff8ea;
}

.number-tile.wrong,
.tap-tile.wrong {
  background: #ffe3e5;
  animation: game-shake .25s;
}

.tap-tile.found {
  background: #fff3b8;
  border-color: #ffd65c;
  transform: scale(1.08);
}

.activity-card[hidden] {
  display: none;
}

@keyframes game-shake {
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

@media (max-width: 560px) {
  .game-body { padding: 22px 16px; }
  .number-board, .tap-board { gap: 8px; }
  .number-tile, .tap-tile { min-height: 62px; font-size: 25px; }
}