.arcade-scene {
  --arcade-ink: #172c28;
  position: relative;
  width: 100%;
  isolation: isolate;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.arcade-scene__svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  shape-rendering: crispEdges;
}

.arcade-scene__svg text {
  font-family: "Courier New", ui-monospace, monospace;
  font-weight: 800;
  text-rendering: geometricPrecision;
  shape-rendering: auto;
}

.arcade-scene__marquee { font-size: 19px; letter-spacing: 1.3px; fill: #172c28; }
.arcade-scene__screen-label { font-size: 11px; letter-spacing: 2px; fill: #9ce5c0; }
.arcade-scene__character-label { font-size: 12px; letter-spacing: 2.3px; fill: #fff5d8; }
.arcade-scene__small-label { font-size: 8px; letter-spacing: .7px; fill: #49625b; }
.arcade-scene__serial { font-size: 7px; letter-spacing: 1px; fill: #172c28; }
.arcade-scene__footnote { font-size: 10px; letter-spacing: 2.1px; fill: #49625b; }
.arcade-scene__world-sign { font-size: 15px; letter-spacing: 1.6px; fill: #fff2d0; }
.arcade-scene__shelf-label { font-size: 10px; letter-spacing: 1.1px; fill: #a7e3c4; }

.arcade-scene__launch,
.arcade-scene__cartridge-button {
  position: absolute;
  z-index: 2;
  appearance: none;
  -webkit-appearance: none;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  color: #172c28;
}

.arcade-scene__launch { left: 41.1%; top: 20.6%; width: 21.7%; height: 66%; }
.arcade-scene__cartridge-button { left: 55.3%; top: 7.1%; width: 6.2%; height: 16%; }
.arcade-scene__launch:hover,
.arcade-scene__cartridge-button:hover { background: transparent; }
.arcade-scene__launch:focus-visible,
.arcade-scene__cartridge-button:focus-visible { outline: 3px solid #315eff; outline-offset: 8px; }
.arcade-scene__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.arcade-scene__mascot { display: none; }
.arcade-scene[data-arcade-character="cat"] [data-mascot="cat"],
.arcade-scene[data-arcade-character="blob"] [data-mascot="blob"],
.arcade-scene[data-arcade-character="frog"] [data-mascot="frog"] { display: block; }
.arcade-scene__floor-mascot { display: none; }
.arcade-scene[data-arcade-character="cat"] [data-left-mascot="frog"],
.arcade-scene[data-arcade-character="cat"] [data-right-mascot="blob"],
.arcade-scene[data-arcade-character="blob"] [data-left-mascot="cat"],
.arcade-scene[data-arcade-character="blob"] [data-right-mascot="frog"],
.arcade-scene[data-arcade-character="frog"] [data-left-mascot="cat"],
.arcade-scene[data-arcade-character="frog"] [data-right-mascot="blob"] { display: block; }
.arcade-scene__mascot-motion { animation: arcade-pixel-bounce 3.2s steps(1, end) infinite; }
.arcade-scene[data-arcade-character="blob"] .arcade-scene__mascot-motion { animation-duration: 2.6s; }
.arcade-scene[data-arcade-character="frog"] .arcade-scene__mascot-motion { animation-duration: 4.2s; }
.arcade-scene__cartridge { animation: arcade-cartridge-float 4.2s steps(3, end) infinite; }
.arcade-scene__spark { animation: arcade-star-blink 5s steps(1, end) infinite; }
.arcade-scene__spark--b { animation-delay: -2s; }
.arcade-scene__spark--c { animation-delay: -3.4s; }
.arcade-scene__screen-spark { animation: arcade-screen-twinkle 3.2s steps(1, end) infinite; }
.arcade-scene__screen-spark--other { animation-delay: -1.6s; }
.arcade-scene__ready-light { animation: arcade-ready-pulse 3.2s steps(1, end) infinite; }
.arcade-scene__friend-motion { animation: arcade-friend-bounce 4.8s steps(1, end) infinite; }
.arcade-scene__friend-motion--other { animation-delay: -2.4s; }
.arcade-scene__cloud { animation: arcade-cloud-drift 16s steps(4, end) infinite; }
.arcade-scene__cloud--other { animation-duration: 20s; animation-delay: -10s; }
.arcade-scene__bulb { animation: arcade-ready-pulse 5.5s steps(1, end) infinite; }
.arcade-scene[data-paused="true"] *,
.arcade-scene[data-paused="true"] *::before,
.arcade-scene[data-paused="true"] *::after { animation-play-state: paused !important; }

@keyframes arcade-pixel-bounce {
  0%, 54%, 100% { transform: translateY(0); }
  55%, 65% { transform: translateY(-6px); }
  66%, 74% { transform: translateY(-3px); }
}
@keyframes arcade-cartridge-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
@keyframes arcade-star-blink {
  0%, 80%, 100% { opacity: 1; }
  81%, 87% { opacity: .25; }
}
@keyframes arcade-screen-twinkle {
  0%, 70%, 100% { opacity: .7; }
  71%, 80% { opacity: .2; }
  81%, 92% { opacity: 1; }
}
@keyframes arcade-ready-pulse {
  0%, 66%, 100% { opacity: 1; }
  67%, 83% { opacity: .3; }
}
@keyframes arcade-friend-bounce {
  0%, 62%, 100% { transform: translateY(0); }
  63%, 72% { transform: translateY(-4px); }
}
@keyframes arcade-cloud-drift {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(16px); }
}
@media (prefers-reduced-motion: reduce) {
  .arcade-scene *,
  .arcade-scene *::before,
  .arcade-scene *::after { animation: none !important; }
}
