.catch-board {
  width: min(100%, 560px);
  aspect-ratio: 1.45;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background:
    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px),
    radial-gradient(circle at 50% 10%, rgba(56, 189, 248, 0.12), transparent 45%),
    #050514;
  background-size: 32px 32px, 32px 32px, auto, auto;
}
.catch-tile {
  position: absolute;
  width: 56px;
  height: 56px;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35), inset 0 2px 2px rgba(255,255,255,0.25);
  animation: pop 0.18s ease-out;
}
.catch-tile::after {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,0.22);
}
@keyframes pop {
  from { transform: scale(0.7); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}