/* Local cover for the on-demand Tower Rush demo. */
.demo-player {
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 14px;
  background: #233749;
}
.demo-player:has(.demo-launch)::before {
  content: "";
  position: absolute;
  inset: -6px;
  z-index: -1;
  background: linear-gradient(#15263340, #16253873), var(--demo-cover, url('/images/tower-rush-demo-desktop.webp')) center / cover;
  filter: blur(4px);
}
.demo-launch { padding: 15px 36px; font-size: 18px; box-shadow: 0 4px 0 #a56c06; }
.demo-launch:focus-visible { outline: 3px solid white; outline-offset: 5px; }
.demo-player iframe { width: 100%; height: 100%; border: 0; display: block; }
.demo-player.mobile-session { aspect-ratio: 427 / 816; width: min(100%, 427px, 47svh); margin-inline: auto; }
@media (max-width: 767px), (pointer: coarse) and (max-width: 1024px) {
  .demo-player:not(.desktop-session) { --demo-cover: url('/images/tower-rush-mobile-gameplay.webp'); aspect-ratio: 427 / 816; width: min(100%, 427px, 47svh); margin-inline: auto; }
}

.demo-player::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  padding: 4px;
  border-radius: inherit;
  background: repeating-linear-gradient(135deg, #ffc928 0 7px, #29251d 7px 14px);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  pointer-events: none;
}