/* A small illustrated puppet, with independently moving joints and audio-driven mouth. */
.guide-character.articulated{width:182px;height:218px}
.monkey-character.articulated{width:157px;height:192px}
.guide-character.articulated button,.guide-character.articulated.walking button,.guide-character.articulated.talking button{animation:none;transform:none;overflow:visible}
.puppet{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.puppet-facing{transform-origin:200px 250px;transition:transform .15s}
.facing-left .puppet-facing{transform:scaleX(-1)}
.puppet-lift{transform-origin:200px 460px}
.puppet g{transform-box:view-box}
.rig-torso{animation:puppet-breathe 4s ease-in-out infinite}
.rig-head{animation:puppet-look 7s ease-in-out infinite}
.rig-arm{animation:arm-rest 5s ease-in-out infinite}
.arm-right{animation-delay:-2s}
.rig-tail{animation:tail-swish 4s ease-in-out infinite}
.rig-blink{opacity:0;animation:puppet-blink 5.6s linear infinite}
.monkey-character .rig-blink{animation-delay:-2.3s}
.rig-mouth{--mouth-open:0;opacity:clamp(0,calc(var(--mouth-open)*8),1);transform:scaleY(calc(.16 + var(--mouth-open)*.84));transition:transform 45ms linear,opacity 45ms linear}
.walking .rig-leg{animation:leg-step .56s ease-in-out infinite}
.walking .leg-right{animation-delay:-.28s}
.walking .rig-arm{animation:arm-stride .56s ease-in-out infinite}
.walking .arm-left{animation-delay:-.28s}
.walking .rig-head{animation:head-step .28s ease-in-out infinite}
.walking .puppet-lift{animation:body-step .28s ease-in-out infinite}
.walking .rig-tail{animation:tail-trot .56s ease-in-out infinite}
.talking:not(.walking) .rig-head{animation:head-speak 2.4s ease-in-out infinite}
.talking:not(.walking) .arm-right{animation:arm-explain 2.8s ease-in-out infinite}
.gesture-wave:not(.walking) .arm-left{animation:arm-wave 2.6s ease-in-out 1}
.arm-wave-front{display:none}
.arm-swing-left,.arm-swing-right{display:none}
.swing-vine{position:absolute;inset:0;width:100%;height:100%;z-index:9;pointer-events:none;overflow:hidden}
.swing-vine path{fill:none;stroke-linecap:round}
.swing-vine .vine-shadow{stroke:#203f2870;stroke-width:11}
.swing-vine .vine-stem{stroke:#657c3e;stroke-width:7}
.swing-vine .vine-highlight{stroke:#c3ca77;stroke-width:2;stroke-dasharray:4 13}
.swing-vine .vine-leaves path{fill:#71945a;stroke:#d0d994;stroke-width:1.5}
.monkey-character.swinging .puppet-lift{animation:none;transform-origin:200px 55px;transform:rotate(var(--swing-lean,0deg))}
.monkey-character.swinging .rig-torso,.monkey-character.swinging .rig-head{animation:none}
.monkey-character.swinging .arm-left,.monkey-character.swinging .arm-right{visibility:hidden}
.monkey-character.swinging .arm-swing-left{display:block;animation:none;transform:rotate(-160deg)}
.monkey-character.swinging .arm-swing-right{display:block;animation:none;transform:rotate(160deg)}
.monkey-character.swinging .leg-left{animation:swing-legs .9s ease-in-out infinite}
.monkey-character.swinging .leg-right{animation:swing-legs .9s ease-in-out -.45s infinite reverse}
.monkey-character.swinging .rig-tail{animation:swing-tail 1.2s ease-in-out infinite}
.monkey-character.swinging .koala-name{opacity:.7}
.monkey-character.gesture-land .puppet-lift{animation:monkey-land .42s ease-out 1}
@keyframes swing-legs{0%,100%{transform:rotate(-25deg) translateY(-12px)}50%{transform:rotate(-12deg) translateY(-7px)}}
@keyframes swing-tail{0%,100%{transform:rotate(-23deg)}50%{transform:rotate(24deg)}}
@keyframes monkey-land{0%{transform:scale(1.09,.88)}60%{transform:scale(.98,1.04)}100%{transform:scale(1)}}
.gesture-wave:not(.walking) .arm-wave-front{display:block}
.gesture-wave:not(.walking) .arm-left:not(.arm-wave-front){visibility:hidden}
.gesture-welcome:not(.walking) .arm-left{animation:arm-welcome 1.7s ease-in-out 1}
.gesture-welcome:not(.walking) .arm-right{animation:arm-welcome-right 1.7s ease-in-out 1}
.gesture-celebrate:not(.walking) .puppet-lift{animation:puppet-hop .8s ease-in-out 2}
.gesture-celebrate:not(.walking) .arm-left{animation:arm-welcome 1.7s ease-in-out 1}
.gesture-celebrate:not(.walking) .arm-right{animation:arm-welcome-right 1.7s ease-in-out 1}
.articulated .koala-name{bottom:-12px;font-size:10px;padding:4px 11px;letter-spacing:.7px}
@keyframes puppet-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.02,1.025)}}
@keyframes puppet-look{0%,24%,100%{transform:rotate(0)}36%,52%{transform:rotate(-4deg)}70%,86%{transform:rotate(3deg)}}
@keyframes arm-rest{0%,100%{transform:rotate(0)}50%{transform:rotate(4deg)}}
@keyframes tail-swish{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(9deg)}}
@keyframes puppet-blink{0%,43%,47%,72%,76%,100%{opacity:0}44%,46%,73%,75%{opacity:1}}
@keyframes leg-step{0%,100%{transform:rotate(-14deg) translateY(-7px)}50%{transform:rotate(15deg) translateY(0)}}
@keyframes arm-stride{0%,100%{transform:rotate(-20deg)}50%{transform:rotate(22deg)}}
@keyframes head-step{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}
@keyframes body-step{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes tail-trot{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(14deg)}}
@keyframes head-speak{0%,100%{transform:rotate(-2deg)}40%{transform:rotate(3deg) translateY(-2px)}70%{transform:rotate(0)}}
@keyframes arm-explain{0%,100%{transform:rotate(-3deg)}35%,60%{transform:rotate(-27deg)}}
@keyframes arm-wave{0%,100%{transform:rotate(0)}18%{transform:rotate(125deg)}30%,54%,78%{transform:rotate(148deg)}42%,66%,88%{transform:rotate(115deg)}}
@keyframes arm-welcome{0%,100%{transform:rotate(0)}25%,70%{transform:rotate(45deg)}}
@keyframes arm-welcome-right{0%,100%{transform:rotate(0)}25%,70%{transform:rotate(-45deg)}}
@keyframes puppet-hop{0%,100%{transform:translateY(0) scale(1)}15%{transform:translateY(3px) scale(1.04,.96)}48%{transform:translateY(-30px) scale(.98,1.02)}80%{transform:translateY(1px) scale(1.02,.98)}}
@media(max-width:680px){.guide-character.articulated{width:161px;height:198px}.monkey-character.articulated{width:145px;height:178px}.articulated .koala-name{font-size:9px;bottom:-10px}.character-bubble{z-index:2;bottom:calc(100% - 22px)}.world-spot.active{visibility:hidden}.world-mobile-nav button.active{background:#f3d98d;border-color:#fff6d0}}
.calm .rig-mouth{opacity:0;transform:none}.calm .rig-blink{opacity:0}
@media(prefers-reduced-motion:reduce){.puppet *{animation:none!important;transition:none!important}.rig-blink,.rig-mouth{opacity:0}}
