:root { --contest-height: calc(44px + env(safe-area-inset-top)); }
#game { top: var(--contest-height); height: calc(100vh - var(--contest-height)); height: calc(100dvh - var(--contest-height)); }
.contest-banner {
  position: absolute; inset: 0 0 auto; z-index: 6; height: var(--contest-height);
  display: flex; align-items: center; padding-top: env(safe-area-inset-top);
  padding-right: env(safe-area-inset-right); padding-left: env(safe-area-inset-left);
  border-bottom: 1px solid var(--arc-line); background: var(--arc-deep); color: var(--arc-fog);
  font: 600 12px/18px ArcMontserrat, sans-serif;
}
.contest-marquee { flex: 1; min-width: 0; overflow: hidden; }
.contest-track { display: flex; width: max-content; min-width: 200%; animation: contest-scroll 32s linear infinite; }
.contest-copy { display: flex; flex: 1 0 auto; align-items: center; justify-content: space-around; gap: 32px; padding: 0 16px; white-space: nowrap; }
.contest-prize { color: var(--arc-mint); }
.contest-invitation { color: var(--arc-muted); }
.contest-separator { color: var(--arc-mint); font-size: 14px; }
@keyframes contest-scroll { to { transform: translateX(-50%); } }
.contest-marquee:hover .contest-track,
.contest-banner.is-motion-paused .contest-track { animation-play-state: paused; }
.contest-motion {
  display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 43px;
  padding: 0; border: 0; background: transparent; color: var(--arc-muted);
}
.contest-motion:hover { color: var(--arc-fog); }
.contest-motion svg { width: 14px; height: 14px; fill: currentColor; }
.contest-motion .contest-play-icon, .contest-motion[aria-pressed=true] .contest-pause-icon { display: none; }
.contest-motion[aria-pressed=true] .contest-play-icon { display: block; }
.contest-banner button:focus-visible { outline: 2px solid var(--arc-mint); outline-offset: -4px; }
@media (max-width: 620px) {
  .contest-banner { font-size: 11px; }
  .contest-copy { gap: 24px; }
}
@media (max-height: 450px) and (min-width: 621px) {
  .is-ready .card { padding: 20px 32px; }
  .is-ready .card > .brand-lockup { margin-bottom: 12px; }
  .is-ready .card > .brand-lockup .logo-pixel { width: 128px; }
  .is-ready .card h2 { font-size: 28px; line-height: 34px; margin: 8px 0 10px; }
  .is-ready #overlay-message { font-size: 11px; line-height: 20px; }
  .is-ready .silver-button { min-height: 48px; }
  .is-ready .demo { margin-top: 12px !important; }
  .is-ready .outside-controls, .is-ready .key-controls { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .contest-track { width: auto; min-width: 100%; animation: none; }
  .contest-copy { padding: 0 16px; white-space: normal; }
  .contest-copy + .contest-copy, .contest-invitation, .contest-separator, .contest-motion { display: none; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 620px) {
  :root { --contest-height: calc(56px + env(safe-area-inset-top)); }
}
