/* Only scene internals. Layout and surrounding product surfaces belong to the app. */
.game-scene {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  pointer-events: none;
  user-select: none;
  isolation: isolate;
}
.game-scene .game-scene__table,
.game-scene .game-scene__trophy,
.game-scene .game-scene__card-front {
  filter: drop-shadow(0 8px 8px rgb(5 15 27 / .12));
}
.game-scene[data-motion="on"] .game-scene__stage,
.game-scene[data-motion="on"] .game-scene__table {
  animation: game-scene-settle .85s cubic-bezier(.2,.7,.2,1) both;
}
.game-scene[data-motion="on"] .game-scene__host-left,
.game-scene[data-motion="on"] .game-scene__host-right {
  animation: game-scene-arrive .8s cubic-bezier(.18,.75,.25,1) .12s both;
}
.game-scene[data-motion="on"] .game-scene__host-right { animation-delay: .22s; }
.game-scene[data-motion="on"] .game-scene__card-left,
.game-scene[data-motion="on"] .game-scene__card-right,
.game-scene[data-motion="on"] .game-scene__card-back,
.game-scene[data-motion="on"] .game-scene__card-front {
  animation: game-scene-card-deal .9s cubic-bezier(.18,.75,.25,1) .18s both;
}
.game-scene[data-motion="on"] .game-scene__card-right { animation-delay: .3s; }
.game-scene[data-motion="on"] .game-scene__card-back { animation-delay: .4s; }
.game-scene[data-motion="on"] .game-scene__card-front { animation-delay: .48s; }
.game-scene[data-motion="on"] .game-scene__die,
.game-scene[data-motion="on"] .game-scene__coins,
.game-scene[data-motion="on"] .game-scene__mascot {
  animation: game-scene-pop .85s cubic-bezier(.16,.8,.22,1.12) .45s both;
  transform-origin: 480px 540px;
}
.game-scene[data-motion="on"] .game-scene__coins { animation-delay: .56s; }
.game-scene[data-motion="on"] .game-scene__mascot { animation-delay: .66s; }
.game-scene[data-motion="on"] .game-scene__trophy {
  animation: game-scene-award 1s cubic-bezier(.16,.8,.22,1.1) .35s both;
  transform-origin: 480px 300px;
}
.game-scene--lobby[data-motion="on"] .game-scene__wave,
.game-scene--results[data-motion="on"] .game-scene__wave {
  transform-origin: 746px 303px;
  animation: game-scene-wave 1.7s ease-in-out 1.05s 2;
}
.game-scene--lobby[data-motion="on"] .game-scene__spark,
.game-scene--results[data-motion="on"] .game-scene__spark {
  transform-box: fill-box;
  transform-origin: center;
  animation: game-scene-twinkle 3.1s ease-in-out 1s 3;
}
.game-scene[data-motion="on"] .game-scene__spark--1 { animation-delay: 1.55s; }
.game-scene[data-motion="on"] .game-scene__spark--2 { animation-delay: 2.1s; }
.game-scene--results[data-motion="on"] .game-scene__rays {
  animation: game-scene-rays 1.15s ease-out .35s both;
  transform-origin: 480px 273px;
}
/* Board rerenders must never restart entrances or motion beside active play. */
.game-scene--board * { animation: none !important; }
/* Root may use either the function's motion:false or its existing preference hook. */
.game-scene[data-motion="off"] *,
[data-celebrations="false"] .game-scene *,
[data-celebrations="off"] .game-scene * {
  animation: none !important;
}
body:has(dialog[open]) .game-scene * { animation-play-state: paused !important; }
@keyframes game-scene-settle {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes game-scene-arrive {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes game-scene-card-deal {
  from { opacity: 0; transform: translate(13px,18px) rotate(2deg); }
  to { opacity: 1; transform: translate(0,0) rotate(0); }
}
@keyframes game-scene-pop {
  from { opacity: 0; transform: translateY(14px) scale(.93); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes game-scene-award {
  from { opacity: 0; transform: translateY(14px) scale(.9); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes game-scene-wave {
  0%,100% { transform: rotate(0); }
  25%,65% { transform: rotate(5deg); }
  45%,82% { transform: rotate(-3deg); }
}
@keyframes game-scene-twinkle {
  0%,100% { opacity: .85; transform: scale(1); }
  45% { opacity: .35; transform: scale(.77); }
  67% { opacity: 1; transform: scale(1.12); }
}
@keyframes game-scene-rays {
  from { opacity: 0; transform: rotate(-9deg) scale(.9); }
  to { opacity: 1; transform: rotate(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .game-scene * { animation: none !important; transition: none !important; }
}