.mascot-container{z-index:9999;pointer-events:auto;cursor:pointer;will-change:transform;width:70px;height:70px;position:absolute;top:0;left:0}.mascot-sprite{width:70px;height:70px;image-rendering:pixelated;background-image:url(/sprites/character.png);background-repeat:no-repeat;background-size:280px 280px;transition:transform .2s ease-out}.mascot-container:hover .mascot-sprite{transform:scale(1.1)}.mascot-container.idle .mascot-sprite{animation:3s ease-in-out infinite mascot-float}@keyframes mascot-float{0%{transform:translateY(0)}50%{transform:translateY(-5px)}to{transform:translateY(0)}}.mascot-container.idle:hover .mascot-sprite{animation:3s ease-in-out infinite mascot-float;transform:scale(1.1)}.speech-bubble{color:#000;pointer-events:none;opacity:0;visibility:hidden;white-space:normal;text-align:center;word-wrap:break-word;width:max-content;max-width:250px;image-rendering:pixelated;background:#fff;border:4px solid #000;border-radius:0;padding:10px 16px;font-family:Courier New,Courier,monospace;font-size:14px;font-weight:700;transition:opacity .3s,visibility .3s;position:absolute;bottom:100%;left:50%;transform:translate(-50%)translateY(-10px);box-shadow:4px 4px #0003}.speech-bubble.visible{opacity:1;visibility:visible}.speech-bubble:after{content:"";border:10px solid #0000;border-top-color:#000;margin-left:-10px;position:absolute;top:100%;left:50%}.speech-bubble:before{content:"";z-index:1;border:6px solid #0000;border-top-color:#fff;margin-top:-4px;margin-left:-4px;position:absolute;top:100%;left:50%}@media (max-width:768px){.mascot-sprite{transform-origin:50%;transform:scale(.65)}.mascot-container:hover .mascot-sprite,.mascot-container.idle:hover .mascot-sprite{transform:scale(.75)}.speech-bubble{max-width:180px;padding:8px 12px;font-size:12px;bottom:80%}}