*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;overflow:hidden;background:#d8e8cf;color:#3d3439;font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
button{font:inherit;color:inherit}

#field{position:fixed;inset:0;overflow:hidden;isolation:isolate;background:url(meadow.svg) 0 0/320px 260px,radial-gradient(ellipse at 50% 38%,#f1f6df 0,#dbe9cf 68%,#cbdfc3 100%)}

.mo{position:absolute;top:0;left:0;padding:0;border:0;background:none;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;will-change:transform;outline:none}
.mo.held{cursor:grabbing}
.mo:focus-visible .hopper{outline:3px dashed #6b5a92;outline-offset:2px;border-radius:42%}
.shadow{position:absolute;left:20%;bottom:-3%;width:60%;height:9%;border-radius:50%;background:#5f7f6448;transform-origin:50% 50%}
.hopper{position:absolute;inset:0;display:block}
.mo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}

/* While gliding, a sprite with a second picture swaps to it. */
.mo .fly,.has-glide.gliding .sit{visibility:hidden}
.gliding .fly{visibility:visible}
.lucky{filter:drop-shadow(0 0 10px #fff3a8) drop-shadow(0 0 3px #fff)}
.lucky img{transform:scale(1.18);transform-origin:50% 100%;transition:transform .3s}

#confetti{position:fixed;inset:0;z-index:3;pointer-events:none;overflow:hidden}
#confetti i{position:absolute;top:-6vh;width:12px;height:12px;border-radius:50%;animation:drift var(--time) linear infinite}
#confetti i.petal{width:10px;height:15px;border-radius:80% 0}
#confetti i.star{width:16px;height:16px;border-radius:0;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
@keyframes drift{to{transform:translate(var(--sway),112vh) rotate(var(--spin))}}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

@media (prefers-reduced-motion:reduce){
  .lucky img{transition:none}
  #confetti i{animation:none;top:var(--rest)}
}