/* Scenic motion stays behind the controls and the foreground party. */
.welcome-forest-life{position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none;contain:strict}
.welcome-forest-life *{pointer-events:none}
.welcome-mist{position:absolute;left:-15%;width:105%;height:22%;border-radius:50%;background:radial-gradient(ellipse, #c8d7be22, #b3cbb313 35%, transparent 70%);animation:welcome-mist-drift var(--drift) ease-in-out infinite alternate;animation-delay:var(--delay);opacity:0}
.welcome-mist:nth-child(1){top:42%}
.welcome-mist:nth-child(2){top:61%;left:5%;width:100%;height:18%}
.welcome-mist:nth-child(3){top:76%;left:-25%;height:16%}
.welcome-firefly{position:absolute;left:var(--left);top:var(--top);width:3px;height:3px;border-radius:50%;background:#ffe7a3;box-shadow:0 0 5px 2px #ebce7555;animation:welcome-firefly-wander var(--drift) ease-in-out infinite alternate,welcome-firefly-glow var(--glow) ease-in-out infinite;animation-delay:var(--delay),var(--delay)}
.welcome-firefly::after{content:"";position:absolute;inset:-8px;border-radius:50%;background:radial-gradient(circle,#f5d68533,transparent 70%);animation:welcome-firefly-glow var(--glow) ease-in-out infinite;animation-delay:var(--delay)}
.welcome-leaf{position:absolute;top:-4%;left:var(--left);width:var(--size);height:var(--size);color:var(--leaf-color);opacity:0;animation:welcome-leaf-fall var(--drift) linear infinite;animation-delay:var(--delay)}
.welcome-leaf svg{display:block;width:100%;height:100%}
.welcome-screen[data-forest-motion] .welcome-backdrop{transform:translate(calc(var(--forest-x,0px)*.45),calc(var(--forest-y,0px)*.45)) scale(1.035);transition:transform 1.2s ease-out}
.welcome-screen[data-forest-motion] .welcome-title-art{transform:translate(calc(var(--forest-x,0px)*.2),calc(var(--forest-y,0px)*.2));transition:transform 1.2s ease-out}
.welcome-screen[data-forest-motion] .welcome-gnomes{transform:translate(var(--forest-x,0px),var(--forest-y,0px));transition:transform 1.2s ease-out}
.welcome-screen[data-forest-motion="paused"] .welcome-forest-life *{animation-play-state:paused}
.welcome-screen[data-forest-motion="paused"] .welcome-firefly::after{animation-play-state:paused}
.welcome-screen[data-forest-motion="reduced"] .welcome-forest-life{display:none}
.welcome-screen[data-forest-motion="reduced"] :is(.welcome-backdrop,.welcome-title-art,.welcome-gnomes){transform:none;transition:none}
@keyframes welcome-mist-drift{0%{transform:translate(-5%,1%);opacity:.25}45%{opacity:.8}100%{transform:translate(9%,-8%);opacity:.4}}
@keyframes welcome-firefly-wander{0%{transform:translate(0,0)}35%{transform:translate(var(--wander-x),-12px)}70%{transform:translate(calc(var(--wander-x)*.35),var(--wander-y))}100%{transform:translate(calc(var(--wander-x)*-.6),-24px)}}
@keyframes welcome-firefly-glow{0%,100%{opacity:.06}23%{opacity:.3}42%{opacity:.85}58%{opacity:.4}76%{opacity:.12}}
@keyframes welcome-leaf-fall{0%{transform:translate(0,0) rotate(-35deg);opacity:0}7%{opacity:.65}25%{transform:translate(24px,28dvh) rotate(65deg)}50%{transform:translate(-16px,55dvh) rotate(155deg);opacity:.5}75%{transform:translate(32px,83dvh) rotate(245deg);opacity:.6}94%{opacity:0}100%{transform:translate(10px,112dvh) rotate(325deg);opacity:0}}
@media(any-pointer:coarse){.welcome-screen[data-forest-motion] :is(.welcome-backdrop,.welcome-title-art,.welcome-gnomes){transform:none;transition:none}}
@media(max-width:600px){.welcome-firefly:nth-of-type(n+12),.welcome-leaf:nth-last-child(-n+2){display:none}}
@media(prefers-reduced-motion:reduce){.welcome-forest-life{display:none}.welcome-screen[data-forest-motion] :is(.welcome-backdrop,.welcome-title-art,.welcome-gnomes){transform:none;transition:none}}
