.avatar:has(>.face){box-shadow:none;color:#0000;background:0 0;overflow:visible}.empty>.avatar{margin-bottom:12px}.face{--lx:0;--ly:0;--ink:#201a15;pointer-events:none;position:absolute;inset:0}.face-body{background:radial-gradient(circle at 30% 24%, color-mix(in oklab, var(--pig) 45%, white) 0, transparent 42%), linear-gradient(175deg, color-mix(in oklab, var(--pig) 80%, white), var(--pig) 55%, color-mix(in oklab, var(--pig) 82%, black));width:94%;height:92%;box-shadow:inset 0 calc(var(--s) * -.06) calc(var(--s) * .1) #00000029, inset 0 0 0 .5px #00000024;transform-origin:50% 100%;border-radius:47% 53% 50% 50%/55% 50% 50% 45%;transition:filter .4s,rotate .3s cubic-bezier(.2,.7,.1,1);animation:3.8s ease-in-out infinite face-breathe;position:absolute;bottom:2%;left:50%;translate:-50%}.face[data-shape=dome] .face-body{border-radius:50% 50% 40% 40%/66% 66% 34% 34%}.face[data-shape=bean] .face-body{border-radius:50%/56% 56% 44% 44%;width:100%;height:80%}.face[data-shape=tall] .face-body{border-radius:50%/44%;width:78%;height:96%}.face[data-extra=sprout] .face-body:before{content:"";left:47%;top:calc(var(--s) * -.075);width:calc(var(--s) * .17);height:calc(var(--s) * .11);background:color-mix(in oklab, var(--pig) 40%, #4f7d2c);transform-origin:0 100%;border-radius:0 100%;animation:4.6s ease-in-out infinite face-sway;position:absolute;rotate:-24deg}.face[data-extra=antenna] .face-body:before{content:"";left:50%;top:calc(var(--s) * -.17);width:calc(var(--s) * .13);height:calc(var(--s) * .22);background:radial-gradient(circle at 50% calc(var(--s) * .055), color-mix(in oklab, var(--pig) 50%, white) 0 calc(var(--s) * .05), transparent calc(var(--s) * .056)), linear-gradient(color-mix(in oklab, var(--pig) 70%, black), color-mix(in oklab, var(--pig) 70%, black)) 50% 100% / max(1px, calc(var(--s) * .022)) 62% no-repeat;transform-origin:50% 100%;animation:4.6s ease-in-out infinite face-sway;position:absolute;translate:-50%}.face[data-extra=freckles] .face-look:after{content:"";height:calc(var(--s) * .09);--fr:radial-gradient(circle, #5a2d1980 0 calc(var(--s) * .017 + .3px), transparent calc(var(--s) * .022 + .6px));background:var(--fr) 0 0 / 14% 50% no-repeat, var(--fr) 14% 100% / 14% 50% no-repeat, var(--fr) 28% 0 / 14% 50% no-repeat, var(--fr) 72% 0 / 14% 50% no-repeat, var(--fr) 86% 100% / 14% 50% no-repeat, var(--fr) 100% 0 / 14% 50% no-repeat;position:absolute;top:50%;left:17%;right:17%}.face[data-extra=cheeks] .face-look:after{content:"";background:radial-gradient(closest-side,#ff968c6b,#0000) 0/30% 100% no-repeat,radial-gradient(closest-side,#ff968c6b,#0000) 100%/30% 100% no-repeat;height:16%;position:absolute;top:50%;left:14%;right:14%}.face-look{translate:calc(var(--lx) * var(--s) * .09) calc(var(--ly) * var(--s) * .07);transition:translate .3s cubic-bezier(.2,.7,.1,1);position:absolute;inset:0}.face-eyes{gap:calc(var(--s) * .17);animation:face-glance 12s ease-in-out infinite var(--glance-at);display:flex;position:absolute;top:40%;left:50%;translate:-50% -50%}.face[data-looking] .face-eyes{animation:none}.face-eyes i{width:calc(var(--s) * .115);height:calc(var(--s) * .17);background:radial-gradient(circle at 34% 28%, #fff 0 14%, var(--ink) 20%);transform-origin:50% 60%;animation:face-blink var(--blink) infinite var(--blink-at);border-radius:50%;transition:height .22s,width .22s,rotate .22s,translate .22s,border-radius .22s;display:block}.face[data-eyes=round] .face-eyes i{width:calc(var(--s) * .135);height:calc(var(--s) * .135)}.face[data-eyes=wide] .face-eyes{gap:calc(var(--s) * .24)}.face[data-eyes=wide] .face-eyes i{width:calc(var(--s) * .125);height:calc(var(--s) * .15)}.face[data-eyes=bead] .face-eyes{gap:calc(var(--s) * .15);top:42%}.face[data-eyes=bead] .face-eyes i{width:calc(var(--s) * .095);height:calc(var(--s) * .115)}.face-mouth{width:calc(var(--s) * .15);height:calc(var(--s) * .07);background:var(--ink);opacity:0;border-radius:0 0 99px 99px;transition:opacity .18s,scale .22s;position:absolute;top:58%;left:50%;translate:-50%;scale:.3}.face[data-still] .face-body,.face[data-still] .face-eyes,.face[data-still] .face-body:before{animation:none}.face[data-mood=listening] .face-body{animation:none;rotate:7deg}.face[data-mood=listening] .face-look{translate:calc(var(--s) * .07) calc(var(--s) * .035)}.face[data-mood=listening] .face-eyes{animation:none}.face[data-mood=listening][data-beat="0"] .face-body{animation:.24s ease-out face-nod-a}.face[data-mood=listening][data-beat="1"] .face-body{animation:.24s ease-out face-nod-b}.face[data-mood=thinking] .face-body{animation:2.2s ease-in-out infinite face-knead}.face[data-mood=thinking] .face-look{translate:calc(var(--s) * -.06) calc(var(--s) * -.075)}.face[data-mood=thinking] .face-eyes{animation:none}.face[data-mood=searching] .face-eyes{animation:.9s ease-in-out infinite alternate face-scan}.face[data-mood=searching] .face-body{animation:1.8s ease-in-out infinite face-breathe}.face[data-mood=reading] .face-look{translate:0 calc(var(--s) * .04)}.face[data-mood=reading] .face-eyes{animation:2.4s linear infinite face-read}.face[data-mood=reading] .face-eyes i{height:calc(var(--s) * .09)}.face[data-mood=writing] .face-body{animation:.42s ease-in-out infinite alternate face-bob}.face[data-mood=writing] .face-look{translate:0 calc(var(--s) * .045)}.face[data-mood=writing] .face-eyes{animation:none}.face[data-mood=writing] .face-mouth{opacity:1;animation:.3s ease-in-out infinite alternate face-talk}.face[data-mood=asking] .face-body{animation:1.5s ease-in-out infinite face-ask}.face[data-mood=asking] .face-look{translate:0}.face[data-mood=asking] .face-eyes{animation:none}.face[data-mood=asking] .face-eyes i{height:calc(var(--s) * .2);width:calc(var(--s) * .13)}.face[data-mood=remembering] .face-eyes,.face[data-mood=happy] .face-eyes{animation:none}.face[data-mood=remembering] .face-eyes i,.face[data-mood=happy] .face-eyes i{height:calc(var(--s) * .07);border-top:calc(var(--s) * .045) solid var(--ink);background:0 0;border-radius:50% 50% 0 0;animation:none}.face[data-mood=remembering] .face-body{animation:.9s ease-in-out infinite face-nod-a}.face[data-mood=remembering]:after,.face[data-mood=happy]:after{content:"";border:calc(var(--s) * .022) solid color-mix(in oklab, var(--pig) 55%, transparent);border-radius:50%;width:104%;height:24%;animation:1.1s ease-out infinite face-ripple;position:absolute;bottom:-2%;left:50%;translate:-50%}.face[data-mood=happy]:after{animation-iteration-count:1}.face[data-mood=happy] .face-body{animation:.62s cubic-bezier(.3,.7,.4,1.4) 2 face-hop}.face[data-mood=happy] .face-mouth{opacity:1;scale:1}.face[data-mood=sad] .face-body{filter:saturate(.45)brightness(.95);animation:none;scale:1.05 .88}.face[data-mood=sad] .face-look{translate:0 calc(var(--s) * .07)}.face[data-mood=sad] .face-eyes{animation:none}.face[data-mood=sad] .face-eyes i{height:calc(var(--s) * .1)}.face[data-mood=sad] .face-eyes i:first-child{rotate:-22deg}.face[data-mood=sad] .face-eyes i:last-child{rotate:22deg}.face[data-mood=surprised] .face-body{animation:.45s ease-out face-jolt}.face[data-mood=surprised] .face-eyes{animation:none}.face[data-mood=surprised] .face-eyes i{width:calc(var(--s) * .15);height:calc(var(--s) * .15)}.face[data-mood=surprised] .face-mouth{opacity:1;width:calc(var(--s) * .08);height:calc(var(--s) * .09);border-radius:50%;scale:1}.face[data-mood=asleep] .face-body{filter:saturate(.7);animation-duration:6s}.face[data-mood=asleep] .face-eyes{animation:none}.face[data-mood=asleep] .face-eyes i{height:calc(var(--s) * .035);background:var(--ink);translate:0 calc(var(--s) * .04);border-radius:99px;animation:none}.face[data-mood=attention] .face-body{animation:2.6s cubic-bezier(.3,.7,.4,1.2) infinite face-call}.face[data-mood=attention] .face-look{translate:0}@keyframes face-breathe{50%{scale:.985 1.035}}@keyframes face-blink{0%,94%,to{scale:1}96%{scale:1 .08}}@keyframes face-glance{0%,36%,to{translate:-50% -50%}40%,50%{translate:-64% -50%}54%,78%{translate:-50% -50%}82%,90%{translate:-38% -62%}}@keyframes face-sway{50%{rotate:-6deg}}@keyframes face-nod-a{40%{translate:-50% calc(var(--s) * .04);scale:1.03 .96}}@keyframes face-nod-b{40%{translate:-50% calc(var(--s) * .04);scale:1.03 .96}}@keyframes face-knead{0%,to{border-radius:47% 53% 50% 50%/55% 50% 50% 45%;scale:1}33%{border-radius:55% 45% 46% 54%/48% 58% 42% 52%;scale:1.03 .98}66%{border-radius:44% 56% 54% 46%/58% 46% 54% 42%;scale:.98 1.03}}@keyframes face-scan{0%{translate:-66% -50%}to{translate:-34% -50%}}@keyframes face-read{0%{translate:-66% -56%}30%{translate:-34% -56%}34%{translate:-66% -46%}64%{translate:-34% -46%}68%{translate:-66% -36%}98%,to{translate:-34% -36%}}@keyframes face-bob{0%{translate:-50%;scale:1}to{translate:-50% calc(var(--s) * -.04);scale:.98 1.03}}@keyframes face-talk{0%{scale:.7 .35}to{scale:.85 1}}@keyframes face-ask{50%{scale:1.04 1.05;translate:-50% calc(var(--s) * -.02)}}@keyframes face-ripple{0%{opacity:1;scale:.5}to{opacity:0;scale:1.15}}@keyframes face-hop{0%{translate:-50%;scale:1}20%{translate:-50%;scale:1.12 .86}50%{translate:-50% calc(var(--s) * -.28);scale:.92 1.1}80%{translate:-50%;scale:1.1 .9}to{translate:-50%;scale:1}}@keyframes face-call{0%{translate:-50%;scale:1}6%{scale:1.1 .88}14%{translate:-50% calc(var(--s) * -.22);scale:.94 1.08}22%{translate:-50%;scale:1.06 .94}28%,to{translate:-50%;scale:1}}@keyframes face-jolt{0%{scale:1}25%{scale:.86 1.14;translate:-50% calc(var(--s) * -.06)}60%{scale:1.06 .94}to{translate:-50%;scale:1}}@media (prefers-reduced-motion:reduce){.face *,.face:before,.face:after,.face :before,.face :after{transition:none!important;animation:none!important}}
