/* Zombart ambient motion, scroll-driven zombies and focused fullscreen player */
.undead-figure { position:absolute; width:clamp(168px,24vw,345px); max-width:42%;
  bottom:-22px; opacity:0; z-index:1; pointer-events:none; will-change:transform,opacity;
  transition:transform 1800ms cubic-bezier(.14,.72,.15,1),opacity 1450ms ease;
  filter:drop-shadow(0 0 22px rgba(110,20,14,.28)); }
.undead-figure img { display:block; width:100%; height:auto; opacity:.88;
  animation:undead-sway 6s ease-in-out infinite alternate; transform-origin:50% 90%; }
.undead-left {left:max(-52px,calc((100% - 1250px)/2 - 125px)); transform:translateX(-120%) rotate(-8deg) scale(.91)}
.undead-right {right:max(-48px,calc((100% - 1250px)/2 - 125px)); transform:translateX(120%) rotate(8deg) scale(.91)}
.haunted-section {position:relative; isolation:isolate; overflow:hidden}
.haunted-section > .wrap, .haunted-section > .content,.haunted-section > .surface {position:relative;z-index:2}
.haunted-section.is-in-view > .undead-figure {opacity:.73; transform:translateX(0) rotate(0deg) scale(1)}
.haunted-section.is-in-view > .undead-right {transition-delay:180ms}
.intro.haunted-section {background:radial-gradient(ellipse at 8% 80%,#36131066,transparent 42%),radial-gradient(ellipse at 94% 20%,#46181150,transparent 35%)}
.intro .undead-figure {bottom:18px;opacity:0;width:clamp(170px,23vw,320px)}
.intro.is-in-view .undead-figure {opacity:.56}
.bar.haunted-section .undead-figure {bottom:-92px;width:clamp(150px,20vw,280px)}
.bar.is-in-view .undead-figure {opacity:.56}
.page-heading .undead-figure {bottom:-165px;width:clamp(170px,21vw,275px)}
.page-heading.is-in-view .undead-figure {opacity:.42}
.content.haunted-section .undead-figure {bottom:-160px;width:clamp(190px,26vw,370px)}
.content.is-in-view .undead-figure {opacity:.42}
@keyframes undead-sway {from{transform:rotate(-2deg) translateY(3px)}to{transform:rotate(2deg) translateY(-8px)}}
html.motion-enabled .reveal-on-scroll {opacity:0;transform:translateY(28px);transition:opacity 850ms ease,transform 950ms cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
html.motion-enabled .reveal-on-scroll.is-revealed {opacity:1;transform:none}
#zombart-embers {position:fixed;inset:0;width:100%;height:100%;z-index:55;pointer-events:none;opacity:.76;mix-blend-mode:screen;transition:opacity .5s ease}
body.game-in-view #zombart-embers{opacity:.24}
/* The iframe ITSELF enters fullscreen. Give it a viewport-sized canvas and
   remove desktop thumbnail scaling so Phaser's focused window gets keys. */
#zombart-game:fullscreen {position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;transform:none!important;border:0!important;background:#000!important;}
#zombart-game:-webkit-full-screen {position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;transform:none!important;background:#000!important;}
#zombart-game{outline-offset:5px}
@media(max-width:850px){.undead-figure{width:200px;max-width:31%;}.intro.is-in-view .undead-figure{opacity:.33}.bar.is-in-view .undead-figure{opacity:.30}.intro .undead-left{left:-70px}.intro .undead-right{right:-70px}}
@media(max-width:560px){.undead-figure{max-width:29%}.page-heading .undead-figure{bottom:-115px}.content.is-in-view .undead-figure{opacity:.22}.intro .undead-figure{bottom:45px}.intro.is-in-view .undead-figure{opacity:.20}.bar .undead-figure{bottom:-50px}}
@media(prefers-reduced-motion:reduce){
 .undead-figure,.undead-figure img{animation:none!important;transition:none!important;will-change:auto!important}
 .haunted-section > .undead-figure {opacity:.28; transform:none!important}
 html.motion-enabled .reveal-on-scroll{opacity:1;transform:none;transition:none}
 #zombart-embers{display:none!important}
}