@originkit/avatars 0.1.0 → 0.2.0

package/react/styles.js

@@ -0,0 +1 @@
+export const css = ".AuraAvatar_root{position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.AuraAvatar_tile{position:absolute;inset:0;overflow:hidden;border-radius:22.22%;isolation:isolate;transform:translateZ(0)}.AuraAvatar_colour{position:absolute;inset:-30%;width:160%;height:160%}.AuraAvatar_grain{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:overlay;pointer-events:none}.AuraAvatar_face{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.BubbleAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:100%;aspect-ratio:1;cursor:pointer}.BubbleAvatar_jelly{position:absolute;inset:0;transition:scale .25s ease;will-change:transform}.BubbleAvatar_layer{position:absolute;inset:0;width:100%;height:100%;overflow:visible;will-change:transform}.BubbleAvatar_eyes{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * 1px));transition:transform .14s ease-out}.BubbleAvatar_eyes>g>g:not([data-mouth]){transform-box:fill-box;transform-origin:center;animation:BubbleAvatar_blink 4.8s var(--blink-delay) infinite}.BubbleAvatar_root[data-selected=true] .BubbleAvatar_jelly{animation:BubbleAvatar_float 5.5s ease-in-out infinite}@media(hover:hover)and (prefers-reduced-motion:no-preference){.BubbleAvatar_root[data-animated=true]:hover .BubbleAvatar_jelly{scale:1.04}}.BubbleAvatar_root[data-tapped=true][data-effect=squish] .BubbleAvatar_jelly{animation:BubbleAvatar_squish .8s cubic-bezier(.3,1.5,.5,1)}.BubbleAvatar_root[data-tapped=true][data-effect=wiggle] .BubbleAvatar_jelly{animation:BubbleAvatar_wiggle .8s ease-in-out}.BubbleAvatar_root[data-tapped=true][data-effect=bounce] .BubbleAvatar_jelly{animation:BubbleAvatar_bounce .8s cubic-bezier(.3,.7,.4,1)}@keyframes BubbleAvatar_blink{0%,94%,to{scale:1 1}97%{scale:1 .08}}@keyframes BubbleAvatar_float{0%,to{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-2.5%) rotate(1.2deg)}}@keyframes BubbleAvatar_squish{30%{transform:scale(1.14,.86)}60%{transform:scale(.92,1.1)}}@keyframes BubbleAvatar_wiggle{20%{transform:rotate(-9deg)}45%{transform:rotate(8deg)}70%{transform:rotate(-4deg)}}@keyframes BubbleAvatar_bounce{35%{transform:translateY(-13%) scale(.96,1.05)}70%{transform:translateY(2%) scale(1.06,.95)}}@media(prefers-reduced-motion:reduce){.BubbleAvatar_root .BubbleAvatar_jelly,.BubbleAvatar_eyes>g>g:not([data-mouth]){animation:none!important}}.KittyAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.KittyAvatar_sprite{display:block;width:100%;height:100%}.KittyAvatar_head{transform:translate(calc(var(--look-x) * .35px),calc(var(--look-y) * .35px));transition:transform .18s ease-out}.KittyAvatar_eyes [data-pupil]{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * .7px));transition:transform .14s ease-out}.KittyAvatar_eyes [data-widen]{transform-box:fill-box;transform-origin:center;transition:scale .25s cubic-bezier(.3,1.6,.5,1)}.KittyAvatar_eyes [data-blink]{transform-box:fill-box;transform-origin:50% 100%;animation:KittyAvatar_blink 5s var(--blink-delay) infinite}.KittyAvatar_ear{transform-box:fill-box;transform-origin:50% 100%}@media(hover:hover)and (prefers-reduced-motion:no-preference){.KittyAvatar_root[data-animated=true]:hover .KittyAvatar_ear{animation:KittyAvatar_twitch .5s ease-in-out}.KittyAvatar_root[data-animated=true]:hover .KittyAvatar_right{animation-delay:.12s}.KittyAvatar_root[data-animated=true]:hover .KittyAvatar_eyes [data-widen]{scale:1.1}}@keyframes KittyAvatar_blink{0%,95%,to{scale:1 1}97.5%{scale:1 .1}}@keyframes KittyAvatar_twitch{30%{rotate:-12deg}60%{rotate:6deg}}@media(prefers-reduced-motion:reduce){.KittyAvatar_eyes [data-blink],.KittyAvatar_ear{animation:none!important}}.CritterAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.CritterAvatar_sprite{display:block;width:100%;height:100%}.CritterAvatar_face,.CritterAvatar_brows,.CritterAvatar_mouth,.CritterAvatar_root .lids,.CritterAvatar_root .lid,.CritterAvatar_root .pupil{transform-box:fill-box;transform-origin:center}.CritterAvatar_root .pupil{translate:calc(var(--look-x) * var(--reach) * 1px) calc(var(--look-y) * var(--reach) * .8px);transition:translate .25s cubic-bezier(.25,.9,.3,1)}.CritterAvatar_root .lid{transform-origin:top;transform:scaleY(var(--lid))}.CritterAvatar_root .lids{transform-origin:top;transition:transform .3s cubic-bezier(.3,1.3,.5,1)}.CritterAvatar_brows,.CritterAvatar_mouth{transition:translate .3s cubic-bezier(.3,1.4,.5,1),scale .3s cubic-bezier(.3,1.4,.5,1)}.CritterAvatar_root[data-animated=true] .lid{animation:CritterAvatar_blink var(--period) var(--delay) infinite}.CritterAvatar_root[data-animated=true] .CritterAvatar_eye[data-side=right] .lid{animation-delay:calc(var(--delay) + .05s)}@media(hover:hover)and (prefers-reduced-motion:no-preference){.CritterAvatar_root[data-animated=true]:hover .lids{transform:scaleY(.62)}.CritterAvatar_root[data-animated=true]:hover .CritterAvatar_brows{translate:0 -1.6px}.CritterAvatar_root[data-animated=true]:hover .CritterAvatar_mouth{scale:1.05}}.CritterAvatar_root[data-tapped=true] .CritterAvatar_face{animation:CritterAvatar_pop .6s cubic-bezier(.3,.7,.4,1)}.CritterAvatar_root[data-tapped=true] .lid{animation:CritterAvatar_flutter .6s ease-in-out!important}@keyframes CritterAvatar_blink{0%,93%,to{transform:scaleY(var(--lid))}95.5%{transform:scaleY(1)}}@keyframes CritterAvatar_flutter{15%,55%{transform:scaleY(1)}35%,80%{transform:scaleY(var(--lid))}}@keyframes CritterAvatar_pop{30%{scale:1.06}60%{scale:.98}}@media(prefers-reduced-motion:reduce){.CritterAvatar_root .lid,.CritterAvatar_root .CritterAvatar_face{animation:none!important}}.DoodleAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.DoodleAvatar_sprite{display:block;width:100%;height:100%}.DoodleAvatar_look{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * 1px));transition:transform .16s ease-out}.DoodleAvatar_eyes,.DoodleAvatar_mouth{transform-box:fill-box;transform-origin:center;transition:scale .25s cubic-bezier(.3,1.6,.5,1),translate .25s cubic-bezier(.3,1.6,.5,1)}.DoodleAvatar_eyes>g{transform-box:fill-box;transform-origin:center;animation:DoodleAvatar_blink 4.6s var(--blink-delay) infinite}@media(hover:hover)and (prefers-reduced-motion:no-preference){.DoodleAvatar_root[data-animated=true]:hover .DoodleAvatar_eyes{scale:1.14;translate:0 -1.5px}.DoodleAvatar_root[data-animated=true]:hover .DoodleAvatar_mouth{animation:DoodleAvatar_wiggle .6s ease-in-out}}@keyframes DoodleAvatar_blink{0%,94%,to{scale:1 1}97%{scale:1 .1}}@keyframes DoodleAvatar_wiggle{25%{rotate:-9deg}50%{rotate:7deg}75%{rotate:-3deg}}@media(prefers-reduced-motion:reduce){.DoodleAvatar_eyes>g,.DoodleAvatar_mouth{animation:none!important}}.FaceAvatar_root{--look-x: 0;--look-y: 0;--ease: .16s cubic-bezier(.2, .7, .3, 1);position:relative;width:84%;aspect-ratio:1;margin:8% auto;cursor:pointer;animation:FaceAvatar_arrive .45s cubic-bezier(.3,1.5,.5,1) both}.FaceAvatar_tile{position:relative;width:100%;height:100%;overflow:hidden;border-radius:24%}.FaceAvatar_tile svg{display:block;width:100%;height:100%}.FaceAvatar_eyes,.FaceAvatar_eyebrows,.FaceAvatar_mouth,.FaceAvatar_glasses{transition:transform var(--ease)}.FaceAvatar_eyes{transform:translate(calc(var(--look-x) * 8px),calc(var(--look-y) * 6px))}.FaceAvatar_eyes [data-pupils]{transform:translate(calc(var(--look-x) * 20px),calc(var(--look-y) * 15px));transition:transform var(--ease)}.FaceAvatar_eyebrows{transform:translate(calc(var(--look-x) * 11px),calc(var(--look-y) * 8px))}.FaceAvatar_mouth{transform:translate(calc(var(--look-x) * 7px),calc(var(--look-y) * 5px))}.FaceAvatar_glasses{transform:translate(calc(var(--look-x) * 15px),calc(var(--look-y) * 11px))}.FaceAvatar_blink{transform-box:fill-box;transform-origin:center;animation:FaceAvatar_blink 4.8s var(--blink-delay) infinite}.FaceAvatar_mouthRest,.FaceAvatar_mouthHover,.FaceAvatar_mouthTap{transition:opacity .14s linear}.FaceAvatar_mouthHover,.FaceAvatar_mouthTap{opacity:0}@media(hover:hover)and (prefers-reduced-motion:no-preference){.FaceAvatar_root[data-animated=true]:hover .FaceAvatar_eyebrows{transform:translate(calc(var(--look-x) * 11px),calc(var(--look-y) * 8px - 14px))}.FaceAvatar_root[data-animated=true]:hover .FaceAvatar_mouthRest{opacity:0}.FaceAvatar_root[data-animated=true]:hover .FaceAvatar_mouthHover{opacity:1}}.FaceAvatar_tapped .FaceAvatar_tile{animation:FaceAvatar_squash .6s cubic-bezier(.3,1.5,.5,1)}.FaceAvatar_tapped .FaceAvatar_mouthRest,.FaceAvatar_tapped .FaceAvatar_mouthHover{opacity:0!important}.FaceAvatar_tapped .FaceAvatar_mouthTap{opacity:1}.FaceAvatar_tapped .FaceAvatar_eyebrows{transform:translate(calc(var(--look-x) * 11px),calc(var(--look-y) * 8px - 20px))}.FaceAvatar_sweep{position:absolute;inset:-20% auto -20% -60%;width:40%;background:linear-gradient(100deg,transparent,rgb(255 255 255 / .75),transparent);rotate:14deg;animation:FaceAvatar_sweep .75s ease-out both}.FaceAvatar_burst{position:absolute;inset:0;z-index:2;pointer-events:none;container-type:inline-size}.FaceAvatar_burst span{position:absolute;top:50%;left:50%;font-size:13cqw;line-height:1;animation:FaceAvatar_fly 1.1s var(--wait) cubic-bezier(.15,.7,.3,1) both}.FaceAvatar_confetti span{color:hsl(var(--hue) 90% 65%);font-size:8cqw}.FaceAvatar_hearts span{color:#ff4f8b}.FaceAvatar_stars span{color:#ffd23f}.FaceAvatar_shine span{color:#fff}.FaceAvatar_snooze span{--x: .35 !important;color:#bcd2ff;font-weight:700;animation:FaceAvatar_drift 1.2s var(--wait) ease-out both}.FaceAvatar_storm span{color:#5fb4ff;font-size:6cqw;animation:FaceAvatar_rain 1s var(--wait) ease-in both}@keyframes FaceAvatar_arrive{0%{opacity:0;transform:scale(.75)}}@keyframes FaceAvatar_blink{0%,92%,97%,to{transform:scaleY(1)}94.5%{transform:scaleY(.08)}}@keyframes FaceAvatar_squash{0%{scale:1}25%{scale:1.14 .86}55%{scale:.94 1.08}to{scale:1}}@keyframes FaceAvatar_sweep{to{left:130%}}@keyframes FaceAvatar_fly{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}25%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--x) * 90cqw),calc(-50% + var(--y) * 90cqw)) rotate(var(--spin)) scale(1.1)}}@keyframes FaceAvatar_drift{0%{opacity:0;transform:translate(10cqw,-10cqw) scale(.5)}30%{opacity:1}to{opacity:0;transform:translate(calc(25cqw + var(--y) * 22cqw),calc(-62cqw + var(--y) * -14cqw)) scale(1.4)}}@keyframes FaceAvatar_rain{0%{opacity:0;transform:translate(calc(var(--x) * 48cqw),-68cqw) scale(.7,1.5)}20%{opacity:1}to{opacity:0;transform:translate(calc(var(--x) * 48cqw),62cqw) scale(.7,1.5)}}@media(prefers-reduced-motion:reduce){.FaceAvatar_root,.FaceAvatar_tapped .FaceAvatar_tile,.FaceAvatar_blink,.FaceAvatar_burst span,.FaceAvatar_sweep{animation:none}.FaceAvatar_burst,.FaceAvatar_sweep{display:none}}.GlanceAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.GlanceAvatar_sprite{display:block;width:100%;height:100%}.GlanceAvatar_eyes,.GlanceAvatar_lean,.GlanceAvatar_lid{transform-box:fill-box;transform-origin:center}.GlanceAvatar_eyes{translate:calc(var(--look-x) * 4.2px) calc(var(--look-y) * 3.2px);transition:translate .32s cubic-bezier(.25,.9,.3,1),scale .3s cubic-bezier(.3,1.6,.5,1)}.GlanceAvatar_lean{transition:scale .32s cubic-bezier(.25,.9,.3,1)}.GlanceAvatar_lean[data-side=left]{scale:calc(1 - var(--look-x) * .07) 1}.GlanceAvatar_lean[data-side=right]{scale:calc(1 + var(--look-x) * .07) 1}.GlanceAvatar_root[data-animated=true] .GlanceAvatar_lid{animation:GlanceAvatar_blink var(--period) var(--delay) infinite}.GlanceAvatar_root[data-animated=true][data-twice=true] .GlanceAvatar_lid{animation-name:GlanceAvatar_blink-twice}.GlanceAvatar_root[data-animated=true] .GlanceAvatar_lean[data-side=right] .GlanceAvatar_lid{animation-delay:calc(var(--delay) + .05s)}@media(hover:hover)and (prefers-reduced-motion:no-preference){.GlanceAvatar_root[data-animated=true]:hover .GlanceAvatar_eyes{scale:1.12}}.GlanceAvatar_root[data-tapped=true] .GlanceAvatar_eyes{animation:GlanceAvatar_pop .7s cubic-bezier(.3,.7,.4,1)}.GlanceAvatar_root[data-tapped=true] .GlanceAvatar_lid{animation:GlanceAvatar_flutter .7s ease-in-out!important}@keyframes GlanceAvatar_blink{0%,92%,to{scale:1 1}94.5%{scale:1.08 .06}97%{scale:.97 1.06}}@keyframes GlanceAvatar_blink-twice{0%,88%,to{scale:1 1}90%{scale:1.08 .06}92%{scale:.98 1.04}94.5%{scale:1.08 .06}97%{scale:.97 1.06}}@keyframes GlanceAvatar_pop{30%{scale:1.28}60%{scale:.94}}@keyframes GlanceAvatar_flutter{15%,55%{scale:1.08 .06}35%,75%{scale:1 1}}@media(prefers-reduced-motion:reduce){.GlanceAvatar_root .GlanceAvatar_lid,.GlanceAvatar_root .GlanceAvatar_eyes{animation:none!important}}.GlyphAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.GlyphAvatar_sprite{display:block;width:100%;height:100%}.GlyphAvatar_ink{transform-origin:50px 50px;transition:scale .2s ease}.GlyphAvatar_eyes{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * 1px));transition:transform .12s ease-out}.GlyphAvatar_root[data-pixel=true] .GlyphAvatar_eyes{transition:none}.GlyphAvatar_eyes>*{transform-box:fill-box;transform-origin:center;animation:GlyphAvatar_blink 4.6s var(--blink-delay) infinite}.GlyphAvatar_root[data-selected=true][data-effect=spin] .GlyphAvatar_ink{animation:GlyphAvatar_turn 30s linear infinite}.GlyphAvatar_root[data-selected=true][data-effect=pop] .GlyphAvatar_ink{animation:GlyphAvatar_breathe 3.2s ease-in-out infinite}.GlyphAvatar_root[data-selected=true][data-effect=drop] .GlyphAvatar_ink{animation:GlyphAvatar_sway 3.6s ease-in-out infinite}.GlyphAvatar_root[data-selected=true][data-effect=hop] .GlyphAvatar_ink{animation:GlyphAvatar_bob 2.4s steps(1) infinite}@media(hover:hover)and (prefers-reduced-motion:no-preference){.GlyphAvatar_root[data-animated=true]:hover .GlyphAvatar_ink{scale:1.07}}@keyframes GlyphAvatar_blink{0%,94%,to{scale:1 1}97%{scale:1 .08}}@keyframes GlyphAvatar_turn{to{rotate:360deg}}@keyframes GlyphAvatar_breathe{50%{scale:1.05}}@keyframes GlyphAvatar_sway{0%,to{rotate:-4deg}50%{rotate:4deg}}@keyframes GlyphAvatar_bob{50%{translate:0 -2.5px}}@media(prefers-reduced-motion:reduce){.GlyphAvatar_root .GlyphAvatar_ink,.GlyphAvatar_eyes>*{animation:none!important}}.GrinAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.GrinAvatar_sprite{display:block;width:100%;height:100%}.GrinAvatar_eyes,.GrinAvatar_mouth,.GrinAvatar_root .eye,.GrinAvatar_root .pupil{transform-box:fill-box;transform-origin:center}.GrinAvatar_root .pupil{translate:calc(var(--look-x) * var(--reach) * 1px) calc(var(--look-y) * var(--reach) * 1px);transition:translate .22s cubic-bezier(.25,.9,.3,1)}.GrinAvatar_eyes,.GrinAvatar_mouth{transition:scale .3s cubic-bezier(.3,1.5,.5,1)}.GrinAvatar_root[data-animated=true] .eye{animation:GrinAvatar_blink var(--period) var(--delay) infinite}.GrinAvatar_root[data-animated=true] .eye[data-eye=\"1\"]{animation-delay:calc(var(--delay) + .05s)}@media(hover:hover)and (prefers-reduced-motion:no-preference){.GrinAvatar_root[data-animated=true]:hover .GrinAvatar_mouth{scale:1.07 1.1}.GrinAvatar_root[data-animated=true]:hover .GrinAvatar_eyes{scale:1.06}}.GrinAvatar_root[data-tapped=true] .GrinAvatar_mouth{animation:GrinAvatar_chomp .65s cubic-bezier(.3,.7,.4,1)}.GrinAvatar_root[data-tapped=true] .GrinAvatar_eyes{animation:GrinAvatar_pop .65s cubic-bezier(.3,.7,.4,1)}@keyframes GrinAvatar_blink{0%,93%,to{scale:1 1}95.5%{scale:1.06 .08}97.5%{scale:.98 1.05}}@keyframes GrinAvatar_chomp{15%,55%{scale:1.04 .55}35%,75%{scale:1 1.08}}@keyframes GrinAvatar_pop{30%{scale:1.18}60%{scale:.96}}@media(prefers-reduced-motion:reduce){.GrinAvatar_root .eye,.GrinAvatar_root .GrinAvatar_eyes,.GrinAvatar_root .GrinAvatar_mouth{animation:none!important}}.KnitAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.KnitAvatar_layer{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;user-select:none}.KnitAvatar_root .pupil,.KnitAvatar_root .lids,.KnitAvatar_root .lid,.KnitAvatar_root .pompom{transform-box:fill-box;transform-origin:center}.KnitAvatar_root .pupil{translate:calc(var(--look-x) * 1.6px) calc(var(--look-y) * 1px);transition:translate .25s cubic-bezier(.25,.9,.3,1)}.KnitAvatar_root .lid{transform-origin:top;transform:scaleY(var(--lid))}.KnitAvatar_root .lids{transform-origin:top;transition:transform .3s cubic-bezier(.3,1.3,.5,1)}.KnitAvatar_root[data-animated=true] .lid{animation:KnitAvatar_blink var(--period) var(--delay) infinite}.KnitAvatar_root[data-animated=true] .eye[data-eye=\"1\"] .lid{animation-delay:calc(var(--delay) + .05s)}@media(hover:hover)and (prefers-reduced-motion:no-preference){.KnitAvatar_root[data-animated=true]:hover .lids{transform:scaleY(.7)}}.KnitAvatar_root[data-tapped=true] .lid{animation:KnitAvatar_flutter .7s ease-in-out!important}.KnitAvatar_root[data-tapped=true] .pompom{transform-origin:bottom;animation:KnitAvatar_bounce .7s cubic-bezier(.3,.7,.4,1)}@keyframes KnitAvatar_blink{0%,93%,to{transform:scaleY(var(--lid))}95.5%{transform:scaleY(1)}}@keyframes KnitAvatar_flutter{15%,55%{transform:scaleY(1)}35%,80%{transform:scaleY(var(--lid))}}@keyframes KnitAvatar_bounce{30%{transform:translateY(-3px) scale(1.08,.92)}60%{transform:translateY(.5px) scale(.96,1.05)}}@media(prefers-reduced-motion:reduce){.KnitAvatar_root .lid,.KnitAvatar_root .pompom{animation:none!important}}.PeekAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.PeekAvatar_sprite{display:block;width:100%;height:100%}.PeekAvatar_creature{transition:transform .28s cubic-bezier(.3,1.4,.5,1)}.PeekAvatar_rings{transform-origin:var(--origin);transition:transform .4s ease}.PeekAvatar_face [data-iris]{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * 1px));transition:transform .12s ease-out}.PeekAvatar_face [data-eye]{transform-box:fill-box;transform-origin:center;animation:PeekAvatar_blink 4.6s var(--blink-delay) infinite}.PeekAvatar_face [data-brow]{transition:transform .2s ease}.PeekAvatar_root[data-selected=true] .PeekAvatar_rings{animation:PeekAvatar_breathe 4s ease-in-out infinite}@media(hover:hover)and (prefers-reduced-motion:no-preference){.PeekAvatar_root[data-animated=true]:hover .PeekAvatar_creature{transform:translate(var(--into-x),var(--into-y))}.PeekAvatar_root[data-animated=true]:hover .PeekAvatar_face [data-brow]{transform:translateY(-1.4px)}}.PeekAvatar_root[data-tapped=true][data-effect=peek] .PeekAvatar_creature{animation:PeekAvatar_peek .8s cubic-bezier(.3,1.3,.5,1)}.PeekAvatar_root[data-tapped=true][data-effect=wobble] .PeekAvatar_creature{animation:PeekAvatar_wobble .75s ease-in-out}.PeekAvatar_root[data-tapped=true][data-effect=pop] .PeekAvatar_face [data-eye]{animation:PeekAvatar_widen .7s cubic-bezier(.3,1.6,.5,1)}.PeekAvatar_root[data-tapped=true] .PeekAvatar_rings{animation:PeekAvatar_ripple .85s ease-out}@keyframes PeekAvatar_blink{0%,94%,to{scale:1 1}97%{scale:1 .08}}@keyframes PeekAvatar_breathe{50%{transform:scale(1.025)}}@keyframes PeekAvatar_ripple{40%{transform:scale(1.09)}}@keyframes PeekAvatar_peek{35%{transform:translate(calc(var(--into-x) * 1.9),calc(var(--into-y) * 1.9))}65%{transform:translate(calc(var(--into-x) * -.5),calc(var(--into-y) * -.5))}}@keyframes PeekAvatar_wobble{25%{transform:translate(-3px)}50%{transform:translate(3px)}75%{transform:translate(-1.5px)}}@keyframes PeekAvatar_widen{35%{scale:1.3}}@media(prefers-reduced-motion:reduce){.PeekAvatar_creature,.PeekAvatar_rings,.PeekAvatar_face [data-eye]{animation:none!important}}.PixelAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer;animation:PixelAvatar_arrive .32s steps(4) both}.PixelAvatar_sprite{display:block;width:100%;height:100%;overflow:visible}.PixelAvatar_face{transform:translate(calc(var(--look-x) * 1px))}.PixelAvatar_eyes,.PixelAvatar_glasses{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * 1px))}.PixelAvatar_glasses{transform:translate(calc(var(--look-x) * 1px))}.PixelAvatar_open{animation:PixelAvatar_open 4.4s var(--blink-delay) step-end infinite}.PixelAvatar_wide,.PixelAvatar_mouthHover{opacity:0}.PixelAvatar_shut{opacity:0;animation:PixelAvatar_shut 4.4s var(--blink-delay) step-end infinite}@media(hover:hover)and (prefers-reduced-motion:no-preference){.PixelAvatar_root[data-animated=true]:hover .PixelAvatar_person{transform:translateY(-1px)}.PixelAvatar_root[data-animated=true]:hover .PixelAvatar_open,.PixelAvatar_root[data-animated=true]:hover .PixelAvatar_shut{opacity:0;animation:none}.PixelAvatar_root[data-animated=true]:hover .PixelAvatar_wide{opacity:1}.PixelAvatar_root[data-animated=true]:hover .PixelAvatar_mouthRest{opacity:0}.PixelAvatar_root[data-animated=true]:hover .PixelAvatar_mouthHover{opacity:1}}@keyframes PixelAvatar_arrive{0%{opacity:0;transform:translateY(6%)}to{opacity:1;transform:none}}@keyframes PixelAvatar_open{0%,97%{opacity:1}93%{opacity:0}}@keyframes PixelAvatar_shut{0%,97%{opacity:0}93%{opacity:1}}@media(prefers-reduced-motion:reduce){.PixelAvatar_root,.PixelAvatar_open,.PixelAvatar_shut{animation:none}}.ShapeAvatar_root{--look-x: 0;--look-y: 0;position:relative;width:86%;aspect-ratio:1;margin:7% auto;cursor:pointer}.ShapeAvatar_sprite{display:block;width:100%;height:100%}.ShapeAvatar_eyes,.ShapeAvatar_mouth{transform-box:fill-box;transform-origin:center;transition:transform .14s ease-out,scale .25s cubic-bezier(.3,1.6,.5,1)}.ShapeAvatar_eyes{transform:translate(calc(var(--look-x) * 1px),calc(var(--look-y) * 1px))}.ShapeAvatar_mouth{transform:translate(calc(var(--look-x) * .5px),calc(var(--look-y) * .5px))}.ShapeAvatar_eyes>g>g,.ShapeAvatar_mouth>g>g{transform-box:fill-box;transform-origin:center}.ShapeAvatar_eyes>g>g{animation:ShapeAvatar_blink 4.6s var(--blink-delay) infinite}@media(hover:hover)and (prefers-reduced-motion:no-preference){.ShapeAvatar_root[data-animated=true]:hover .ShapeAvatar_eyes{scale:1.1}.ShapeAvatar_root[data-animated=true]:hover .ShapeAvatar_mouth{scale:1.12 1.18}}.ShapeAvatar_root[data-tapped=true] .ShapeAvatar_eyes>g>g,.ShapeAvatar_root[data-tapped=true] .ShapeAvatar_mouth>g>g{animation:ShapeAvatar_hop .5s cubic-bezier(.3,.7,.4,1) backwards}.ShapeAvatar_root[data-tapped=true] .ShapeAvatar_eyes>g:nth-child(2)>g{animation-delay:.08s}.ShapeAvatar_root[data-tapped=true] .ShapeAvatar_mouth>g>g{animation-delay:.16s}@keyframes ShapeAvatar_blink{0%,94%,to{scale:1 1}97%{scale:1 .1}}@keyframes ShapeAvatar_hop{25%{scale:1.15 .85}55%{translate:0 -6px;scale:.92 1.1}85%{scale:1.06 .95}}@media(prefers-reduced-motion:reduce){.ShapeAvatar_root .ShapeAvatar_eyes>g>g,.ShapeAvatar_root .ShapeAvatar_mouth>g>g{animation:none!important}}\n";