/* Animated honey jar: shared by the mini app and the website. The SVG itself is heroJar() in index.html. */
.hj{overflow:visible}
.hj *{transform-box:view-box}
.hj-lid{transform-origin:16px 19px;animation:hjLid 8s ease-in-out infinite}
.hj-well{transform-origin:40px 21px;transform:scaleY(0);animation:hjWell 8s ease-in-out infinite}
.hj-flow,.hj-flow-hi{transform-origin:57.6px 19px;transform:scaleY(0);animation:hjFlow 8s ease-in-out infinite}
.hj-drop{opacity:0;transform-origin:57.6px 55px;animation:hjDrop 8s linear infinite}
.hj-glow{opacity:0;animation:hjGlow 8s ease-in-out infinite}
.hj-shine{animation:hjShine 8s ease-in-out infinite}
.hj-puddle{transform-origin:57.6px 102px;transform:scale(0);animation:hjPuddle 8s ease-out infinite}
.hj-bee{animation:hjBee 8s ease-in-out infinite;opacity:0}
.hj-bee-in{animation:hjBob .5s ease-in-out infinite alternate}
.hj-wing{transform-origin:-1px -3px;animation:hjWing .08s linear infinite alternate}
@keyframes hjLid{0%,14%{transform:none}22%{transform:translate(-2px,-14px) rotate(-24deg)}26%{transform:translate(-2px,-12px) rotate(-20deg)}
  62%{transform:translate(-2px,-12px) rotate(-20deg)}70%{transform:none}73%{transform:translateY(-2px)}76%,100%{transform:none}}
@keyframes hjWell{0%,20%{transform:scaleY(0)}30%,60%{transform:scaleY(1)}68%,100%{transform:scaleY(0)}}
@keyframes hjFlow{0%,26%{transform:scaleY(0);opacity:1}46%,72%{transform:scaleY(1);opacity:1}84%,100%{transform:scaleY(1);opacity:0}}
@keyframes hjDrop{0%,45%{opacity:0;transform:none}48%{opacity:1;transform:scale(1.15,.9)}
  50%{opacity:1;transform:none}58%{opacity:1;transform:translateY(12px) scale(.95,1.1)}
  60%{opacity:1;transform:translateY(16px) scale(.9,1.2)}65%{opacity:0;transform:translateY(46px) scale(.8,1.3)}100%{opacity:0;transform:translateY(46px)}}
@keyframes hjGlow{0%,48%{opacity:0}54%{opacity:.6}58%{opacity:.45}66%,100%{opacity:0}}
@keyframes hjShine{0%,70%{transform:skewX(-18deg) translateX(0)}82%,100%{transform:skewX(-18deg) translateX(90px)}}
@keyframes hjPuddle{0%,63%{transform:scale(0)}68%{transform:scale(1.1)}76%{transform:scale(1)}92%,100%{transform:scale(0)}}
@keyframes hjBee{0%,24%{opacity:0;transform:translate(96px,-10px)}30%{opacity:1;transform:translate(70px,-18px)}
  40%{transform:translate(52px,-6px)}48%{transform:translate(64px,-20px)}56%{opacity:1;transform:translate(40px,-14px)}
  66%{opacity:0;transform:translate(-14px,-24px)}100%{opacity:0;transform:translate(-14px,-24px)}}
@keyframes hjBob{from{transform:translateY(-1px)}to{transform:translateY(1.5px)}}
@keyframes hjWing{from{transform:scaleY(1)}to{transform:scaleY(.35)}}
@media (prefers-reduced-motion:reduce){.hj *{animation:none!important}.hj-bee,.hj-drop,.hj-glow{opacity:0}}