@font-face{font-family:Passero;src:url('assets/PasseroOne-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:light;--blue:#31afc4;--green:#c5e24d;--field:#f9f7f4;--scale:1}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--blue);font-family:-apple-system,BlinkMacSystemFont,'PingFang HK','PingFang SC',sans-serif;overscroll-behavior-y:none}
.viewport{position:relative;width:min(100%,402px);height:calc(874px * var(--scale));margin:0 auto;overflow:hidden}
.artboard{position:relative;width:402px;height:874px;transform:scale(var(--scale));transform-origin:top left}
.title{margin:0;font-size:30px;font-weight:600;line-height:42px}
.title-text{position:absolute;left:199px;top:83px;white-space:nowrap}
.collection{position:absolute;left:85px;top:80px;display:flex;gap:6px;height:45px}
.collection>span{display:flex;align-items:center;justify-content:center;width:30px;height:45px;border-bottom:4px solid var(--green);font-family:Passero,sans-serif;font-size:34px;font-weight:400;line-height:1}
.collection img{width:27px;height:25px}
.playfield{position:absolute;left:16px;top:177px;width:374px;height:366px;isolation:isolate}
.field-texture{position:absolute;left:-4px;top:-4px;width:382px;height:374px;z-index:-1;pointer-events:none}
.prize{position:absolute;display:flex;align-items:center;justify-content:center;font-family:Passero,sans-serif;font-size:48px;line-height:1.2;color:var(--blue);transform-origin:center;user-select:none;pointer-events:none}
.prize img{display:block;width:32.346px;height:29px}
.pendulum{position:absolute;top:0;left:0;width:0;height:0;transform-origin:0 0;will-change:transform;pointer-events:none}
.rope{position:absolute;top:0;left:-.8px;width:1.6px;background:var(--blue);transform-origin:top center}
.claw{position:absolute;left:-30px;top:-3px;width:80px;height:111px;overflow:hidden}
.claw>img{position:absolute;left:-22.16%;top:-43.51%;width:159.05%;height:250.76%;max-width:none;mix-blend-mode:multiply}
.held{position:absolute;left:5px;top:0;width:0;height:0}
.held .prize{left:0!important;top:0!important;transform:translate(-50%,-50%) rotate(0deg)!important}
.controls{position:absolute;left:0;top:611px;width:402px;height:80px}
.controls,.controls *{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.controls button>*{pointer-events:none}
.controls img{pointer-events:none;-webkit-user-drag:none}
button{font:inherit;cursor:pointer;border:0;-webkit-tap-highlight-color:transparent;touch-action:none;user-select:none;-webkit-user-select:none}
button:focus-visible{outline:2px solid var(--blue);outline-offset:7px}
.direction{position:absolute;top:0;width:80px;height:80px;border-radius:11px;background:#f8fde3;padding:0}
.left{left:60px}.right{left:261px}
.arrow-frame{position:absolute;left:9px;top:9px;width:61px;height:61px;transform:rotate(-90deg)}
.right .arrow-frame{left:7px;transform:rotate(90deg)}
.arrow-frame img{position:absolute;left:8.21%;top:3.28%;width:83.58%;height:75%}
.direction:active,.direction.is-pressed{background:#eff5d5}
.direction:active .arrow-frame,.direction.is-pressed .arrow-frame{translate:-2px 0}
.right:active .arrow-frame,.right.is-pressed .arrow-frame{translate:2px 0}
.grab{position:absolute;left:161px;top:0;width:79px;height:80px;background:transparent;padding:0}
.stick-base{position:absolute;left:0;top:54px;width:79px;height:26px;border-radius:11px;background:#eff5d5}
.stick-shaft{position:absolute;left:33px;top:14px;width:14px;height:56px;background:var(--green);transform-origin:50% 100%;transition:transform .16s ease}
.stick-ball{position:absolute;left:14px;top:2px;width:52px;height:52px;transition:transform .16s ease}
.grab:active .stick-ball,.grab.is-working .stick-ball{transform:translateY(7px)}
.grab:active .stick-shaft,.grab.is-working .stick-shaft{transform:scaleY(.88)}
.direction:disabled{cursor:default}
.status{position:absolute;top:563px;left:24px;width:354px;margin:0;text-align:center;font-size:14px;line-height:20px;pointer-events:none}
.reset{position:absolute;top:751px;left:156px;width:90px;height:36px;background:transparent;color:var(--blue);font-size:14px;opacity:0;pointer-events:none}
.reset:focus-visible,.reset.is-visible{opacity:1;pointer-events:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(prefers-reduced-motion:reduce){.stick-shaft,.stick-ball{transition:none}}