:root,.day{--a1:#cfe9e1;--a2:#dcd6f3;--a3:#cfe2f1;--aura:.55;--c1:#fff;--c2:#e3e8f4;--fly:#cfe2f1}.morning{--a1:#f7dccd;--a2:#d6eee3;--a3:#f6dde6;--aura:.55;--c1:#fff;--c2:#f3e6e0;--fly:#f7dccd}.evening{--a1:#efd3e0;--a2:#d9d0f3;--a3:#cfdcf3;--aura:.55;--c1:#fff;--c2:#e6def3;--fly:#efd3e0}.night{--a1:#3f7f70;--a2:#5a4f9e;--a3:#3d5f94;--aura:.35;--c1:#fbfaff;--c2:#cfcaf4;--fly:#e8f6ff}.stage{aspect-ratio:6/5;width:min(360px,90vw);position:relative}.aura{filter:blur(48px);opacity:var(--aura);pointer-events:none;border-radius:50%;transition:background-color 2s,opacity 2s;position:absolute}.a1{background:var(--a1);width:78%;height:93%;animation:16s ease-in-out infinite alternate drift1;top:5%;left:-8%}.a2{background:var(--a2);width:83%;height:100%;animation:19s ease-in-out infinite alternate drift2;top:-5%;left:39%}.a3{background:var(--a3);width:56%;height:67%;opacity:calc(var(--aura) * .75);animation:13s ease-in-out infinite alternate-reverse drift1;top:50%;left:31%}.cloud{width:84%;position:absolute;top:4%;left:8%;overflow:visible}.stop1{stop-color:var(--c1);transition:stop-color 2s}.stop2{stop-color:var(--c2);transition:stop-color 2s}.body{transform-box:fill-box;transform-origin:50% 90%;filter:drop-shadow(0 0 28px var(--glow));animation:9s cubic-bezier(.45,0,.55,1) infinite float}.cheek{fill:#ffb3c8;opacity:.55}.line{fill:none;stroke:#2b2f45;stroke-width:4px;stroke-linecap:round}.smile{stroke-width:3.5px}.closed{opacity:0}.open{transform-box:fill-box;transform-origin:50%}.day .open{animation:5.5s infinite blink}.morning .open{animation:9s ease-in-out infinite drowsy}.morning .closed{animation:9s ease-in-out infinite drowsy-lid}.evening .open{animation:8s ease-in-out infinite slow-blink}.night .closed{opacity:1;animation:14s ease-in-out infinite sleep}.night .open{opacity:0;animation:14s ease-in-out infinite wake}.fly{background:var(--fly);width:6px;height:6px;box-shadow:0 0 10px 3px var(--glow);opacity:0;border-radius:50%;animation:8s ease-in-out infinite fly;position:absolute}.day .fly,.morning .fly{box-shadow:none}@keyframes drift1{0%{transform:translate(0)scale(1)}to{transform:translate(11%,-8%)scale(1.15)}}@keyframes drift2{0%{transform:translate(0)scale(1.1)}to{transform:translate(-14%,10%)scale(.9)}}@keyframes float{0%,to{transform:translateY(0)rotate(-1deg)scale(1)}50%{transform:translateY(-16px)rotate(1deg)scale(1.03,1.04)}}@keyframes blink{0%,90%,94%,to{transform:scaleY(1)}92%{transform:scaleY(.08)}}@keyframes drowsy{0%,8%{opacity:0;transform:scaleY(.1)}16%,52%{opacity:1;transform:scaleY(1)}58%,70%{opacity:1;transform:scaleY(.45)}76%{opacity:0;transform:scaleY(.1)}84%{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(.1)}}@keyframes drowsy-lid{0%,8%{opacity:1}14%,72%{opacity:0}76%{opacity:1}82%,96%{opacity:0}to{opacity:1}}@keyframes slow-blink{0%,70%,86%,to{transform:scaleY(1)}76%,80%{transform:scaleY(.08)}}@keyframes sleep{0%,64%{opacity:1}67%,90%{opacity:0}93%,to{opacity:1}}@keyframes wake{0%,64%{opacity:0;transform:scaleY(.1)}68%{opacity:1;transform:scaleY(1)}76%{transform:scaleY(1)}77.5%{transform:scaleY(.1)}79%,87%{opacity:1;transform:scaleY(1)}91%,to{opacity:0;transform:scaleY(.1)}}@keyframes fly{0%{opacity:0;transform:translate(0)scale(.5)}20%{opacity:1}50%{transform:translate(12px,-60px)scale(1)}80%{opacity:.8}to{opacity:0;transform:translate(-8px,-130px)scale(.6)}}.stage.awake .open{opacity:1;transform:none;animation:none!important}.stage.awake .closed{opacity:0;animation:none!important}.look{transform:translate(var(--lx,0px), var(--ly,0px));transition:transform .35s cubic-bezier(.2,.8,.2,1)}.cheek{transition:opacity .6s}.stage.awake .cheek{opacity:.9}.stage.awake .smile{transform-box:fill-box;transform-origin:50% 0;transition:transform .4s cubic-bezier(.3,1.6,.4,1);transform:scale(1.25)}.smile{transition:transform .6s}.stage.hop .cloud{transform-origin:50% 95%;animation:.8s cubic-bezier(.3,1.5,.4,1) hop}@keyframes hop{0%{transform:none}22%{transform:scale(1.08,.9)}48%{transform:translateY(-16px)scale(.96,1.06)}72%{transform:scale(1.03,.97)}to{transform:none}}@media (prefers-reduced-motion:reduce){.aura,.body,.fly,.open,.closed,.stage.hop .cloud{animation:none!important}.look{transition:none}.fly{display:none}}