/* Flip tiles for score digits (split-flap.js): a two-tone panel with a centre seam; each change drops the tile in. */
.flap {
  display: inline-block; position: relative; min-width: .74em; padding: 0 .1em; text-align: center; line-height: 1.18;
  font-variant-numeric: tabular-nums; border-radius: .14em; transform-origin: 50% 0;
  background: linear-gradient(180deg, #f5f8fc 0 49.5%, #e7edf5 50.5% 100%);
  box-shadow: inset 0 0 0 1px #d5dfea, 0 1px 2px #1b2b4012;
}
.flap::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: #c3cfdd; opacity: .8; }
.flap + .flap { margin-left: .08em; }
.flap.is-flip { animation: flap-drop .14s ease-out; }
@keyframes flap-drop { from { transform: perspective(160px) rotateX(-80deg); filter: brightness(.8); } }
.big-score .flap { border-radius: .1em; padding: 0 .12em; }
