.pf-avatar{display:inline-block;width:100%;max-width:150px;vertical-align:bottom;line-height:0;isolation:isolate}
.pf-avatar svg{display:block;width:100%;height:auto;overflow:visible}
.pf-avatar__figure,.pf-avatar__head,.pf-avatar__paw,.pf-avatar__sign,.pf-avatar__sparks{transform-box:fill-box;transform-origin:50% 85%}
.pf-avatar--ready .pf-avatar__sign{animation:pf-avatar-sign .32s cubic-bezier(.2,.9,.25,1.2) both}
.pf-avatar--reaction-1 .pf-avatar__head{animation:pf-avatar-nod .65s ease-in-out 2}
.pf-avatar--reaction-2 .pf-avatar__figure{animation:pf-avatar-sway .6s ease-in-out 3}
.pf-avatar--reaction-3 .pf-avatar__paw--left{animation:pf-avatar-clap-left .28s ease-in-out 5}
.pf-avatar--reaction-3 .pf-avatar__paw--right{animation:pf-avatar-clap-right .28s ease-in-out 5}
.pf-avatar--reaction-4 .pf-avatar__figure{animation:pf-avatar-hop .62s cubic-bezier(.2,.65,.3,1) 2}
.pf-avatar--reaction-4 .pf-avatar__paw--left{transform:rotate(-35deg)}
.pf-avatar--reaction-4 .pf-avatar__paw--right{transform:rotate(35deg)}
.pf-avatar--reaction-5 .pf-avatar__figure{animation:pf-avatar-cheer .58s ease-in-out 3}
.pf-avatar--reaction-5 .pf-avatar__paw--left{transform:translate(-5px,-34px) rotate(-20deg)}
.pf-avatar--reaction-5 .pf-avatar__paw--right{transform:translate(5px,-34px) rotate(20deg)}
.pf-avatar--reaction-5 .pf-avatar__sparks{animation:pf-avatar-spark .72s ease-out 2}
@keyframes pf-avatar-sign{from{opacity:0;transform:translateY(8px) scale(.85)}to{opacity:1;transform:none}}
@keyframes pf-avatar-nod{0%,100%{transform:rotate(0)}50%{transform:translateY(3px) rotate(7deg)}}
@keyframes pf-avatar-sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes pf-avatar-clap-left{0%,100%{transform:translateX(0) rotate(-12deg)}50%{transform:translateX(22px) rotate(-35deg)}}
@keyframes pf-avatar-clap-right{0%,100%{transform:translateX(0) rotate(12deg)}50%{transform:translateX(-22px) rotate(35deg)}}
@keyframes pf-avatar-hop{0%,100%{transform:translateY(0) scale(1)}20%{transform:translateY(2px) scale(1.04,.94)}55%{transform:translateY(-13px) scale(.97,1.03)}}
@keyframes pf-avatar-cheer{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-9px) rotate(5deg)}}
@keyframes pf-avatar-spark{0%{opacity:0;transform:scale(.65)}40%{opacity:1}100%{opacity:.5;transform:scale(1.1)}}
@media(prefers-reduced-motion:reduce){.pf-avatar__figure,.pf-avatar__head,.pf-avatar__paw,.pf-avatar__sign,.pf-avatar__sparks{animation:none!important}.pf-avatar--reaction-4 .pf-avatar__figure,.pf-avatar--reaction-5 .pf-avatar__figure{transform:none}}
