.roulette-wheel {
  width: 146px;
  height: 146px;
  border: 6px solid #ebc37a;
  border-radius: 50%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  place-items: center;
  color: #ffe9b4;
  font-size: 26px;
  font-weight: 800;
  background: conic-gradient(#4b8763 0 25%, #235846 25% 50%,
    #4b8763 50% 75%, #235846 75%);
  box-shadow: 0 0 0 5px #21583e, 0 15px 25px #06191088;
  animation: spin-wheel 1.1s cubic-bezier(.1, .65, .18, 1) both;
}
.dice-pair { display: flex; gap: 18px; margin: 5px 0; }
.dice-pair span {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  border: 4px solid #d3c1a2;
  border-radius: 13px;
  background: #f8f3e5;
  color: #bc533c;
  font-size: 36px;
  font-weight: 900;
  box-shadow: 4px 7px 0 #a5a48f;
  animation: dice-drop .65s cubic-bezier(.2, .7, .3, 1.2) both;
}
.dice-pair span:nth-child(2) { animation-delay: .12s; }
.discard-grid .tile:last-child { animation: tile-enter .28s ease-out both; }
.result-overlay > strong { animation: win-pop .55s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes spin-wheel {
  from { transform: rotate(0); }
  to { transform: rotate(1050deg); }
}
@keyframes dice-drop {
  from { transform: translateY(-65px) rotate(-55deg) scale(.6); opacity: 0; }
  to { transform: translateY(0) rotate(0) scale(1); opacity: 1; }
}
@keyframes tile-enter {
  from { transform: translateY(-14px) scale(1.15); opacity: .2; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}
@keyframes win-pop {
  from { transform: scale(.5); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .roulette-wheel, .dice-pair span, .discard-grid .tile:last-child,
  .result-overlay > strong, .warning-toast { animation: none; }
}