/* A growing flower garden, behind the entrance controls. */
#introScreen.simple-entrance{padding-bottom:145px}
.intro-garden{position:absolute;inset:auto 0 0;height:260px;z-index:-1;pointer-events:none;overflow:hidden;opacity:.87;contain:layout paint}
.intro-garden svg{display:block;width:100%;height:100%;overflow:visible}
.garden-grow{transform-origin:0 0;animation:gardenGrow 2.6s cubic-bezier(.2,.65,.25,1) var(--delay) both}
.garden-sway{transform-origin:0 0;animation:gardenSway var(--speed) ease-in-out calc(var(--delay) + 2.6s) infinite alternate}
.garden-bloom{transform-origin:0 0;animation:gardenBloom 1.3s cubic-bezier(.2,.7,.3,1.15) calc(var(--delay) + 1.6s) both}
.garden-grass{transform-origin:0 0;animation:gardenGrow 2.4s ease-out var(--delay) both}
#introScreen.motion-paused .intro-garden *,#introScreen:not(.active) .intro-garden *,#introScreen.garden-inactive .intro-garden *{animation-play-state:paused!important}
@keyframes gardenGrow{from{transform:scaleY(.01);opacity:0}to{transform:scaleY(1);opacity:1}}
@keyframes gardenBloom{from{transform:scale(.02) rotate(-24deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}
@keyframes gardenSway{from{transform:rotate(-1.6deg)}to{transform:rotate(1.6deg)}}
@media(max-width:899px){#introScreen.simple-entrance{padding-bottom:155px}.intro-garden{height:170px;opacity:.75}}
@media(prefers-reduced-motion:reduce){.intro-garden *{animation:none!important}}