.stage { max-width: 460px; }
.goal { display: flex; justify-content: center; align-items: baseline; gap: 10px; color: var(--muted); font-size: .9rem; margin: 2px 0 12px; }
.goal b { font-family: var(--mono); font-weight: 400; font-size: 1.3rem; }
.board { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; padding: 4px; }
.tile {
  aspect-ratio: 1; border: 0; border-radius: 14px; cursor: pointer;
  font: 400 clamp(1.25rem, 5.6vw, 1.8rem) var(--mono); color: var(--ink);
  box-shadow: inset 0 -5px 0 rgba(0,0,0,.25), inset 0 3px 0 rgba(255,255,255,.22);
  transition: transform .12s, filter .2s;
}
.tile:hover { filter: brightness(1.08); }
.tile:active { transform: scale(.92); }
.tile.hl { outline: 2px solid var(--gold-l); outline-offset: 2px; }
.tile.drop { animation: drop .25s ease-out; }
.tile.grow { animation: grow .32s ease-out; }
@keyframes drop { from { transform: translateY(-28px); opacity: .3; } }
@keyframes grow { 40% { transform: scale(1.2); } }