.oops-effect{position:fixed;margin:0;transform:translate(-50%,-50%);pointer-events:none;z-index:8;isolation:isolate}
.oops-flight{position:absolute;width:65%;height:65%;left:17.5%;top:8%;animation:candy-flight .85s ease-in both;filter:drop-shadow(0 6px 3px #8166ad30)}
.oops-bomb{width:100%;height:100%;object-fit:contain}.oops-trail{position:absolute;right:65%;top:10%;color:#ffce42;font-size:24px;white-space:nowrap;text-shadow:0 2px white;animation:candy-trail .65s both}
.oops-puff{position:absolute;inset:0;display:grid;place-items:center;animation:candy-pop 1.05s .8s both}.oops-puff img{position:absolute;width:100%;height:100%;object-fit:contain}.oops-puff strong{position:relative;font:1000 var(--burst-type,48px)/1.1 'Microsoft YaHei',sans-serif;color:#ec8630;-webkit-text-stroke:1px #fff6cb;text-shadow:0 3px 0 #b96726;transform:rotate(-12deg)}
.oops-loss{position:absolute;top:88%;left:0;width:100%;text-align:center;font-size:clamp(18px,2.5vw,30px);font-weight:900;color:#b47738;text-shadow:0 2px #fff;background:#fff9e8ed;border:2px solid #f5d597;border-radius:20px;padding:7px 3px;animation:candy-loss 1.2s 1.1s both}.oops-loss small{display:block;font-size:14px;color:#597e70;margin-top:2px}
.oops-orbit{position:absolute;top:4%;left:0;width:100%;text-align:center;color:#ffc73f;font-size:clamp(22px,3vw,40px);text-shadow:0 2px #fff;animation:candy-orbit 1s 1.3s both}
.oops-wiggle{transform-origin:50% 75%;animation:candy-recoil 1.3s .7s both}
@keyframes candy-flight{0%{opacity:0;transform:translate(var(--throw-x),-85%) rotate(-65deg) scale(.4)}15%{opacity:1}58%{transform:translate(0,-10%) rotate(12deg) scale(1)}72%{transform:translate(0,-10%) rotate(-9deg) scale(1.18)}90%{opacity:1;transform:translate(0,-10%) rotate(9deg) scale(1.3)}100%{opacity:0;transform:scale(.5)}}
@keyframes candy-trail{0%{opacity:0;transform:scale(.5)}35%{opacity:1}100%{opacity:0;transform:translateY(-30px) scale(1.2)}}
@keyframes candy-pop{0%{opacity:0;transform:scale(.2) rotate(-15deg)}15%{opacity:1;transform:scale(1.07) rotate(4deg)}35%,65%{opacity:1;transform:scale(1) rotate(0)}100%{opacity:0;transform:translateY(-8%) scale(1.02)}}
@keyframes candy-recoil{0%{transform:scale(1)}12%{transform:scale(.87,1.04)}28%{transform:translateY(10px) rotate(-11deg) scale(1.04,.9)}44%{transform:translateY(-9px) rotate(10deg)}60%{transform:rotate(-7deg)}78%{transform:rotate(4deg)}100%{transform:scale(1)}}
@keyframes candy-loss{0%{opacity:0;transform:translateY(10px) scale(.7)}20%,75%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-12px)}}
@keyframes candy-orbit{0%{opacity:0;transform:translateX(-8%) rotate(-8deg)}25%,75%{opacity:1}50%{transform:translateX(8%) rotate(8deg)}100%{opacity:0;transform:translateX(-8%) rotate(-8deg)}}
.oops-still .oops-flight,.oops-still .oops-orbit{display:none}.oops-still .oops-puff,.oops-still .oops-loss{animation:none;opacity:1}
@media(prefers-reduced-motion:reduce){.oops-wiggle{animation:none}}
.pause-announcement{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:10px;width:min(350px,85vw);padding:26px 30px;background:#fffcf2f5;border:3px solid #fff;border-radius:32px;box-shadow:0 12px 50px #28577d35,0 5px 0 #b5d9e7;color:#28577d;text-align:center;animation:pause-notice 1.4s ease both}
.pause-announcement strong{font-size:clamp(30px,4vw,42px);line-height:1.2;font-weight:900}.pause-announcement>span:last-child{font-size:16px;color:#56758a}.pause-announcement-icon{display:grid;place-items:center;width:64px;height:64px;background:#d9edfa;border-radius:22px;font-size:38px;font-weight:900}.pause-announcement.is-playing .pause-announcement-icon{background:#d9f3df;color:#378466;font-size:30px}
@keyframes pause-notice{0%{opacity:0;transform:translate(-50%,-45%) scale(.94)}12%,78%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-54%) scale(.98)}}
body.reduced .pause-announcement{animation:none}
@media(prefers-reduced-motion:reduce){.pause-announcement{animation:none}}
.correct-announcement{width:min(420px,86vw);padding:22px 28px;background:linear-gradient(135deg,#fffce6,#ebfbe8);border:3px solid #fff1a9;box-shadow:0 9px 0 #dfbd6640,0 18px 60px #426b3930;animation:pause-notice 1.8s ease both;gap:7px}.correct-announcement strong{font-size:clamp(38px,5vw,60px);color:#378665;text-shadow:0 3px #fff}.correct-stars{font-size:34px;color:#edb33c;letter-spacing:12px}.correct-score{font-size:36px;color:#bd791c}.correct-announcement>span:last-child{font-size:19px;color:#547865}
@media(max-height:650px){.correct-announcement{padding:14px 22px;gap:3px}.correct-announcement strong{font-size:40px}.correct-stars{font-size:24px}.correct-score{font-size:30px}}
.round-countdown{position:fixed;z-index:12;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(190px,29vw,300px);height:clamp(190px,29vw,300px);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;border-radius:50%;background:radial-gradient(circle,#fffef5 35%,#fff4cfe8 68%,#ffffff88);box-shadow:0 12px 50px #487f9b25;border:4px solid #fff8dc;isolation:isolate}
.round-countdown strong{font-family:system-ui,sans-serif;font-size:clamp(100px,17vw,190px);font-weight:1000;line-height:.95;color:#f5ad35;-webkit-text-stroke:3px #fff;text-shadow:0 7px 0 #d99132,0 12px 18px #ce9e5140;animation:countdown-bounce .55s cubic-bezier(.2,.8,.3,1) both}
.round-countdown>span{font-size:clamp(18px,2.3vw,26px);font-weight:800;letter-spacing:4px;color:#527d91;margin-top:18px}.countdown-ring{position:absolute;inset:-12px;border:5px solid #ffd877;border-right-color:#9bdfd1;border-left-color:#9bdfd1;border-radius:50%;z-index:-1;animation:countdown-ring 1s ease-out both}
.countdown-go{width:auto;max-width:90vw;height:auto;padding:20px 38px;border-radius:32px;font-size:clamp(32px,5vw,60px);font-weight:1000;color:#348775;white-space:nowrap;background:#effff1f5;animation:countdown-start .65s ease both}
@keyframes countdown-bounce{0%{opacity:0;transform:scale(.45) rotate(-10deg)}55%{opacity:1;transform:scale(1.16) rotate(3deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes countdown-ring{0%{opacity:.9;transform:scale(.86) rotate(0)}100%{opacity:0;transform:scale(1.25) rotate(35deg)}}
@keyframes countdown-start{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}20%,65%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.04)}}
@media(prefers-reduced-motion:reduce){.round-countdown,.round-countdown strong,.countdown-ring{animation:none}.countdown-ring{display:none}}
body.reduced .countdown-ring{display:none}
