@keyframes float { 0%,100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes feedback { 0% { opacity: 0; scale: .82; } 12% { opacity: 1; scale: 1.06; } 78% { opacity: 1; scale: 1; } 100% { opacity: 0; scale: .98; translate: 0 -8px; } }
@keyframes story-cue { 0% { opacity: .45; transform: translateY(-3px); filter: brightness(1); } 24% { opacity: 1; transform: translateY(0); filter: brightness(1.5); box-shadow: 0 0 18px rgba(85,233,255,.3); } 100% { opacity: 1; transform: translateY(0); filter: brightness(1); box-shadow: none; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes readyPulse { 50% { box-shadow: 0 0 26px rgba(85,233,255,.45); } }
@media (min-width: 700px) {
  body { display: grid; place-items: center; padding: 22px; }
  .app-shell { min-height: min(860px, calc(100dvh - 44px)); height: min(860px, calc(100dvh - 44px)); border: 1px solid rgba(255,255,255,.13); border-radius: 30px; }
  .screen { min-height: 100%; height: 100%; overflow-y: auto; }
  #game-canvas { height: 100%; }
}

@media (max-height: 710px) {
  .keyboard-hint { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  .game-screen[data-flow-near="1"] .combo-chip { animation: none !important; }
  .feedback.show { animation: none !important; opacity: 1; }
  .prompt-kicker span.is-story-cue { animation: none !important; }
  .prompt-card { transform: none !important; }
  .prompt-card > * { transition: opacity .1s linear !important; transform: none !important; }
  .prompt-card.is-outgoing > * { opacity: .78; }
  .prompt-card.is-incoming > * { opacity: 0; }
  .prompt-card.is-arriving > * { animation: none !important; opacity: 1; }
  .formal-countdown strong { animation: none !important; }
}