.apply-guide{--walk:2.4s;position:absolute;right:22px;bottom:14px;width:96px;padding:0;z-index:2;display:flex;flex-direction:column;align-items:center}
.has-guide .dialog-scroll{padding-bottom:150px}
.guide-figure{width:96px;height:120px;overflow:visible}
.guide-figure g{transform-box:view-box}
.guide-shadow{fill:#23483222}
.guide-bubble{position:relative;margin-bottom:6px;padding:9px 13px;background:#fffdf0;border:2px solid var(--green);border-radius:14px;color:var(--green);font-size:13px;font-weight:800;white-space:nowrap;box-shadow:0 6px 18px #2348321f}
.guide-bubble:after{content:'';position:absolute;top:100%;left:50%;margin-left:-7px;border:7px solid transparent;border-top-color:var(--green)}
.apply-guide:hover .guide-bubble{background:var(--green);color:#fffdf0}
.guide-leg-l{transform-origin:52px 106px}.guide-leg-r{transform-origin:68px 106px}
.guide-arm-l{transform-origin:36px 76px}
.guide-arm-raise,.guide-arm-swing,.guide-arm-wave{transform-origin:84px 76px}

/* Walk in from the left edge, then stop, raise the arm, speak and wave. */
.guide-enter{animation:guide-walk var(--walk) cubic-bezier(.3,.1,.4,1) backwards}
.guide-enter .guide-body{animation:guide-step .3s ease-in-out 8,guide-hop 3.2s ease-in-out calc(var(--walk) + 1.6s) infinite}
.guide-enter .guide-leg-l{animation:guide-leg .6s ease-in-out 4}
.guide-enter .guide-leg-r{animation:guide-leg .6s ease-in-out -.3s 4}
.guide-enter .guide-arm-l{animation:guide-arm .6s ease-in-out -.3s 4}
.guide-enter .guide-arm-raise{animation:guide-raise .35s cubic-bezier(.3,.8,.3,1.2) var(--walk) backwards}
.guide-enter .guide-arm-swing{animation:guide-arm .6s ease-in-out 4}
.guide-enter .guide-arm-wave{animation:guide-wave .9s ease-in-out calc(var(--walk) + .35s) infinite}
.guide-enter .guide-bubble{animation:guide-bubble .45s cubic-bezier(.2,.8,.25,1.3) calc(var(--walk) + .15s) backwards,guide-bob 2.4s ease-in-out calc(var(--walk) + .6s) infinite}
.guide-flash a{animation:guide-flash 1.2s ease-out}

@keyframes guide-walk{from{translate:var(--walk-from) 0}}
@keyframes guide-step{50%{translate:0 -4px}}
@keyframes guide-leg{25%{rotate:22deg}75%{rotate:-22deg}}
@keyframes guide-arm{25%{rotate:-18deg}75%{rotate:18deg}}
@keyframes guide-raise{from{rotate:170deg}}
@keyframes guide-bubble{from{opacity:0;scale:.3;translate:0 12px}}
@keyframes guide-bob{50%{translate:0 -4px}}
@keyframes guide-wave{0%,100%{rotate:-8deg}50%{rotate:22deg}}
@keyframes guide-hop{0%,70%,100%{translate:0 0}78%{translate:0 -10px}86%{translate:0 0}90%{translate:0 -4px}}
@keyframes guide-flash{30%{box-shadow:0 0 0 8px #ffd23faa}100%{box-shadow:0 0 0 0 #ffd23f00}}

@media(max-width:760px){.apply-guide{right:12px;bottom:10px;width:76px}.guide-figure{width:76px;height:95px}.guide-bubble{font-size:11px;padding:7px 10px}.has-guide .dialog-scroll{padding-bottom:130px}}
@media(prefers-reduced-motion:reduce){.apply-guide,.apply-guide *,.guide-flash a{animation:none!important}}
