.companion{position:absolute;width:80px;height:80px;bottom:20px;right:20px;cursor:pointer;transition:all .5s ease;z-index:10}.companion-svg{width:100%;height:100%;overflow:visible}.companion-body-circle{transition:fill .6s ease}.companion-glow-circle{transition:opacity .5s ease}.eyes-idle{opacity:1;transition:opacity .3s ease}.eyes-curious,.eyes-happy,.eyes-quiet,.eyes-resonate,.eyes-guide{opacity:0;transition:opacity .3s ease}.mouth-idle{opacity:1;transition:opacity .3s ease}.mouth-curious,.mouth-happy,.mouth-quiet,.mouth-resonate,.mouth-guide{opacity:0;transition:opacity .3s ease}.companion.idle .eyes-idle,.companion.idle .mouth-idle{opacity:1}.companion.idle .companion-body-circle{fill:url(#companion-body-grad)}.companion.idle .companion-svg{animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.companion.curious .eyes-idle{opacity:0}.companion.curious .eyes-curious{opacity:1}.companion.curious .mouth-idle{opacity:0}.companion.curious .mouth-curious{opacity:1}.companion.curious .companion-svg{animation:curious 1s ease-in-out infinite}@keyframes curious{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}.companion.resonate .eyes-idle{opacity:0}.companion.resonate .eyes-resonate{opacity:1}.companion.resonate .mouth-idle{opacity:0}.companion.resonate .mouth-resonate{opacity:1}.companion.resonate .companion-body-circle{fill:url(#companion-body-resonate)}.companion.resonate .companion-svg{animation:resonate-float 2.5s ease-in-out infinite}@keyframes resonate-float{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.03)}}.companion.happy .eyes-idle{opacity:0}.companion.happy .eyes-happy{opacity:1}.companion.happy .mouth-idle{opacity:0}.companion.happy .mouth-happy{opacity:1}.companion.happy .companion-svg{animation:happy-bounce .8s ease-in-out}.companion.happy .companion-glow-circle{opacity:.6}.companion.happy .companion-body-circle{filter:brightness(1.2)}@keyframes happy-bounce{0%{transform:scale(1)}30%{transform:scale(1.15)}60%{transform:scale(.95)}to{transform:scale(1)}}.companion.happy:after{content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;border-radius:50%;transform:translate(-50%,-50%);animation:sparkle 1s ease-out;pointer-events:none}@keyframes sparkle{0%{box-shadow:0 0 #ffd700cc,8px -8px #ffd70099,-8px -8px #ffd70099,8px 8px #ffd70099,-8px 8px #ffd70099}to{box-shadow:0 0 #ffd70000,20px -20px #ffd70000,-20px -20px #ffd70000,20px 20px #ffd70000,-20px 20px #ffd70000}}.companion.quiet .eyes-idle{opacity:0}.companion.quiet .eyes-quiet{opacity:1}.companion.quiet .mouth-idle{opacity:0}.companion.quiet .mouth-quiet{opacity:1}.companion.quiet .companion-body-circle{fill:url(#companion-body-quiet)}.companion.quiet .companion-glow-circle{opacity:.15}.companion.quiet .companion-svg{animation:breathe 3s ease-in-out infinite}@keyframes breathe{0%,to{transform:scale(1);opacity:.85}50%{transform:scale(1.05);opacity:1}}.companion.guide .eyes-idle{opacity:0}.companion.guide .eyes-guide{opacity:1}.companion.guide .mouth-idle{opacity:0}.companion.guide .mouth-guide{opacity:1}.companion.guide .companion-svg{animation:guide-drift 2s ease-in-out infinite}@keyframes guide-drift{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(-12px) rotate(-3deg)}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;user-select:none;-webkit-user-select:none;background-color:#fff8e7}#root{min-height:100vh}@media (min-width: 768px){#root{max-width:960px;margin:0 auto}}button:active{transform:scale(.95)}