.focus-scene-wrap{contain:inline-size;background:#0d0b12;width:100%;min-width:0;max-width:100%;position:relative;overflow:hidden}.focus-scene{width:var(--scene-w);height:var(--scene-h);transform-origin:0 0;transform:scale(var(--scene-scale,1));image-rendering:pixelated;image-rendering:crisp-edges;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.focus-scene img,.focus-scene .layer{max-width:none;image-rendering:pixelated;image-rendering:crisp-edges;pointer-events:none;display:block;position:absolute}.focus-scene .poster{width:var(--scene-w);height:var(--scene-h);z-index:50;top:0;left:0}.focus-scene.ready .poster{display:none}.focus-scene:not(.ready) .layer{visibility:hidden}.focus-scene .sky{z-index:1}.focus-scene .clouds{z-index:2;left:var(--win-x);top:var(--cloud-y);width:var(--win-w);height:var(--cloud-h);overflow:hidden}.focus-scene .clouds .strip{height:var(--cloud-h);width:calc(var(--cloud-tile-w) * 2);background-repeat:repeat-x;background-size:var(--cloud-tile-w) var(--cloud-h);will-change:transform;animation:cloudDrift var(--cloud-period) steps(var(--cloud-steps)) infinite;top:0;left:0}@keyframes cloudDrift{0%{transform:translate(0)}to{transform:translateX(calc(var(--cloud-tile-w) * -1))}}.focus-scene .bg{z-index:3;width:var(--scene-w);height:var(--scene-h);top:0;left:0}.focus-scene .char-body{z-index:4;left:var(--body-x);top:var(--body-y);width:var(--body-w);height:var(--body-h);transform-origin:bottom;will-change:transform;animation:bodyBounce var(--body-period) ease-in-out infinite}.focus-scene .char-body>img.body{top:0;left:0}@keyframes bodyBounce{0%,to{transform:scaleY(1)}50%{transform:scaleY(var(--body-scale-y))}}.focus-scene .sprite{overflow:hidden}.focus-scene .sprite>img{will-change:transform;top:0;left:0}.focus-scene .char-hair{left:var(--hair-x);top:var(--hair-y);width:var(--hair-fw);height:var(--hair-fh)}.focus-scene .char-eyes{left:var(--eyes-x);top:var(--eyes-y);width:var(--eyes-fw);height:var(--eyes-fh)}.focus-scene .char-hands{left:var(--hands-x);top:var(--hands-y);width:var(--hands-fw);height:var(--hands-fh)}.focus-scene .char-hair>img{animation:hairSway var(--hair-period) step-end infinite}@keyframes hairSway{0%{transform:translate(0)}14.3%{transform:translateX(calc(var(--hair-fw) * -2))}28.6%{transform:translateX(calc(var(--hair-fw) * -1))}42.9%{transform:translateX(calc(var(--hair-fw) * -2))}57.1%{transform:translate(0)}71.4%{transform:translateX(calc(var(--hair-fw) * -3))}85.7%{transform:translateX(calc(var(--hair-fw) * -4))}to{transform:translateX(calc(var(--hair-fw) * -3))}}.focus-scene.annoyed .char-hair>img{transform:translateX(calc(var(--hair-fw) * -1 * var(--hair-angry-index)));animation:none}.focus-scene .char-hands>img{animation:handsType var(--hands-period) steps(var(--hands-frames), end) infinite}@keyframes handsType{0%{transform:translate(0)}to{transform:translateX(calc(var(--hands-fw) * -1 * var(--hands-frames)))}}.focus-scene .char-eyes>img{transform:translateX(calc(var(--eyes-fw) * -1 * var(--eye-frame,0)))}.focus-scene .fg{z-index:5;left:var(--occ-x);top:var(--occ-y)}.focus-scene .hit-area{z-index:6;left:var(--body-x);top:calc(var(--body-y) - 30px);width:var(--body-w);height:calc(var(--body-h) + 30px);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;margin:0;padding:0;position:absolute}.focus-scene .hit-area:focus-visible{outline-offset:-2px;outline:2px solid #ffd27a}.focus-scene.glare .char-hands>img,.focus-scene.annoyed .char-hands>img,.focus-scene.glare .char-body,.focus-scene.thinking .char-hands>img,.focus-scene.thinking .char-body{animation-play-state:paused}.focus-scene.annoyed .char-body{animation:.12s steps(2,end) infinite bodyShake}@keyframes bodyShake{0%{transform:translate(-1px)}to{transform:translate(1px)}}.focus-scene.paused *{animation-play-state:paused!important}@media (prefers-reduced-motion:reduce){.focus-scene .clouds .strip,.focus-scene .char-body,.focus-scene .char-hair>img,.focus-scene .char-hands>img{animation:none!important}}.focus-scene.sleeping .char-body{animation:sleepBreathe calc(var(--body-period) * 3) ease-in-out infinite}@keyframes sleepBreathe{0%,to{transform:translateY(0)scaleY(1)}50%{transform:translateY(2px) scaleY(calc(var(--body-scale-y) + .02))}}.focus-scene.sleeping .char-hair>img{animation-duration:calc(var(--hair-period) * 2.2)}.focus-scene.sleeping .char-hands>img{animation-play-state:paused}
