.hero-mascot{width:270px;animation:hero-greeting-enter .7s .45s both}
.hero-mascot .hero-moonka{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 16px 22px #0004)}
html:not(.js) .hero-mascot svg.hero-moonka{display:none}
.hero-wave-hand{transform-box:view-box;transform-origin:282px 713px;animation:hero-hand-wave 7.8s 1.1s ease-in-out infinite}
[data-theme="light"] .hero-mascot .hero-moonka{filter:drop-shadow(0 14px 20px #63478026)}
@keyframes hero-greeting-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes hero-hand-wave{0%,5%,35%,100%{transform:rotate(0deg)}11%,23%{transform:rotate(-12deg)}17%,29%{transform:rotate(8deg)}}
@media(prefers-reduced-motion:reduce){.hero-mascot,.hero-wave-hand{animation:none!important;transform:none!important}}
.no-motion .hero-wave-hand{animation:none!important;transform:none!important}
@media(max-width:740px){.hero-mascot{left:calc(50% + 17px);top:120px;width:150px}.hero-mascot .speech{left:-7px}}
@media(max-width:360px){.hero-mascot{left:calc(50% + 25px);width:126px}.hero-mascot .speech{left:-15px}}