/* Demo stages for the site: a 1920x1080 stand-in for game footage, the live widget on top. Not part of the widgets. */
html, body { margin: 0; width: 1920px; height: 1080px; overflow: hidden; }
.stage { position: relative; width: 1920px; height: 1080px; overflow: hidden; }
.stage iframe { position: absolute; border: 0; background: transparent; transform-origin: 0 0; }
.stage::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 90% at 50% 50%, #0000 60%, #0006 100%); }
/* daytime farm game */
.stage.chat { background:
  radial-gradient(30% 22% at 22% 18%, #fffbe8cc, #0000 70%),
  radial-gradient(14% 6% at 60% 16%, #ffffffd0 0 60%, #0000 62%), radial-gradient(10% 5% at 66% 13%, #ffffffd0 0 60%, #0000 62%),
  radial-gradient(9% 4% at 30% 26%, #ffffffb0 0 60%, #0000 62%),
  radial-gradient(70% 30% at 20% 72%, #7fbf5a 0 60%, #0000 61%), radial-gradient(80% 34% at 85% 78%, #6aae4b 0 60%, #0000 61%),
  repeating-linear-gradient(170deg, #ffffff10 0 18px, #0000 18px 44px),
  linear-gradient(180deg, #8fd0ff 0, #c9ecff 46%, #a6d97c 46.2%, #5c9a3e 100%); }
.stage.chat .deco { position: absolute; border-radius: 50%; background: #3f7a2c; box-shadow: inset -20px -16px 0 #33652a; }
/* night dungeon / shooter */
.stage.alerts { background:
  radial-gradient(22% 30% at 76% 58%, #ff8a3a66, #0000 70%), radial-gradient(16% 22% at 76% 60%, #ffcf7a55, #0000 70%),
  radial-gradient(40% 50% at 18% 85%, #3050ff33, #0000 70%),
  repeating-linear-gradient(90deg, #ffffff05 0 3px, #0000 3px 120px), repeating-linear-gradient(0deg, #ffffff05 0 3px, #0000 3px 90px),
  linear-gradient(180deg, #14111c 0, #2a1f30 55%, #0b0a10 100%); }
.stage.alerts .deco { position: absolute; background: #0a090e; }
/* dusk exploration game */
.stage.goal { background:
  radial-gradient(18% 18% at 70% 62%, #ffd38a, #ffb26b55 40%, #0000 70%),
  radial-gradient(90% 30% at 30% 88%, #2b3a4a 0 60%, #0000 61%), radial-gradient(80% 26% at 90% 92%, #23303e 0 60%, #0000 61%),
  linear-gradient(180deg, #3b3a6a 0, #8a6a8e 42%, #f2a98a 62%, #4a5160 62.4%, #1f2732 100%); }
.stage.goal .deco { position: absolute; background: #1a222c; }
