@import"https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:wght@500;700&display=swap";.title-screen{position:relative;width:100%;max-width:400px;height:100svh;max-height:700px;margin:0 auto;overflow:hidden;background:url(/assets/bg.jpg) center / cover no-repeat;display:flex;align-items:center;justify-content:center;--pixel-font: "Press Start 2P", "Galmuri11", monospace}.title-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 50% 42%,#08122026,#0812208c 70%),linear-gradient(180deg,#08122040,#081220a6);pointer-events:none}.title-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:100%;padding:0 1.5rem;text-align:center}.game-title{display:flex;flex-direction:column;align-items:center;line-height:.88;font-family:Bebas Neue,Impact,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.35),0 8px 24px rgba(0,0,0,.45);animation:title-in .7s ease-out both}.game-title-bad{font-size:clamp(3.4rem,14vw,4.6rem);color:#f8fafc}.game-title-ball{font-size:clamp(3.4rem,14vw,4.6rem);color:#facc15}.game-title-hitter{font-size:clamp(3.4rem,14vw,4.6rem);color:#f8fafc}.game-tagline{margin-top:1rem;font-family:DM Sans,sans-serif;font-size:.9rem;font-weight:500;color:#ffffffc7;letter-spacing:.02em;animation:title-in .7s .12s ease-out both}.btn-play-ball{position:relative;margin-top:2.4rem;width:min(280px,82%);min-height:60px;padding:0 1.5rem;display:inline-flex;align-items:center;justify-content:center;border:3px solid #111827;border-radius:12px;background:radial-gradient(ellipse 75% 100% at 50% 40%,#fef08a,#facc15 55%,#f59e0b);font-family:var(--pixel-font);font-size:16px;letter-spacing:.02em;cursor:pointer;-webkit-tap-highlight-color:transparent;box-shadow:inset 0 0 12px #ffffff73,inset 0 -4px #d97706,inset 0 3px #fde68a,0 5px #111827,0 12px 22px #00000059;transition:transform .1s ease-out,box-shadow .1s ease-out;animation:title-btn-in .7s .22s ease-out both,play-glow 2.4s .9s ease-in-out infinite}@keyframes play-glow{0%,to{filter:drop-shadow(0 0 6px rgba(251,176,36,.35))}50%{filter:drop-shadow(0 0 14px rgba(249,145,22,.6))}}.btn-play-ball-text{background:linear-gradient(180deg,#5c1f08,#3b1204 45%,#0f0501);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(255,247,200,.55))}.btn-play-ball:after{content:"";position:absolute;top:4px;right:5px;bottom:6px;left:5px;border:1.5px dashed rgba(161,98,7,.45);border-radius:8px;pointer-events:none}@media (hover: hover){.btn-play-ball:not(:disabled):hover{transform:translateY(-2px);background:radial-gradient(ellipse 75% 100% at 50% 40%,#fef9c3,#fde047 55%,#fbbf24);box-shadow:inset 0 0 16px #fff9,inset 0 -4px #d97706,inset 0 3px #fef9c3,0 7px #111827,0 16px 28px #0006,0 0 18px #facc1573}.btn-ranking:hover{color:#facc15}}.btn-play-ball:not(:disabled):active{transform:translateY(5px);box-shadow:inset 0 0 12px #ffffff73,inset 0 -4px #d97706,inset 0 3px #fde68a,0 0 #111827,0 4px 10px #0000004d}.btn-play-ball:focus-visible{outline:3px solid #fde68a;outline-offset:3px}.btn-play-ball:disabled{opacity:.6;cursor:wait}.btn-ranking{margin-top:.75rem;min-height:44px;padding:0 16px;border:none;background:transparent;color:#ffffffa6;font-family:"Galmuri11",var(--pixel-font);font-size:13px;letter-spacing:.04em;text-shadow:0 1px 0 rgba(0,0,0,.6);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;cursor:pointer;transition:color .12s;animation:title-in .7s .32s ease-out both}@keyframes title-btn-in{0%{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}@media (prefers-reduced-motion: reduce){.btn-play-ball{animation:none}}@keyframes title-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.crowd{--u: calc(100cqh / 1120);--crowd-amp: 3;--crowd-dur: 1.4s;position:absolute;top:0;left:50%;width:calc(800 * var(--u));height:100cqh;transform:translate(-50%);z-index:1;pointer-events:none}.crowd-chunk{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));width:calc(var(--w) * var(--u));height:calc(var(--h) * var(--u));background:url(/assets/bg.jpg) no-repeat;background-size:calc(800 * var(--u)) 100cqh;background-position:calc(var(--x) * var(--u) * -1) calc(var(--y) * var(--u) * -1);image-rendering:pixelated;will-change:transform;animation:crowd-bob calc(var(--crowd-dur) * var(--j)) steps(1,end) infinite;animation-delay:calc(var(--crowd-dur) * var(--d) * -1)}.crowd-calm .crowd-chunk:not(.eager){animation:none}.crowd-warm{--crowd-amp: 4;--crowd-dur: .7s}.crowd-hype{--crowd-amp: 6;--crowd-dur: .42s}.crowd-fever{--crowd-amp: 9;--crowd-dur: .5s}.crowd-fever .crowd-chunk{animation-duration:var(--crowd-dur);animation-delay:calc(var(--crowd-dur) * (1 - var(--wave)) * -1)}.crowd.hush .crowd-chunk{animation:none}@keyframes crowd-bob{0%{transform:translateY(0)}50%{transform:translateY(calc(var(--crowd-amp) * var(--u) * -1))}}@media (prefers-reduced-motion: reduce){.crowd-chunk{animation:none!important}}.fielders{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none}.fielder{position:absolute;width:32px;height:36px;margin-left:-16px;transform-origin:bottom center;transition:translate .35s steps(4,end),opacity .3s}.fielder-body{width:100%;height:100%;transform-origin:bottom center;animation:fielder-sway 1.6s steps(1,end) infinite;animation-delay:var(--delay)}.fielder-sprite{display:block;width:100%;height:100%;object-fit:contain;object-position:bottom center;image-rendering:pixelated;clip-path:inset(0 0 12% 0);translate:0 12%;filter:drop-shadow(0 2px 0 rgba(0,0,0,.35));-webkit-user-select:none;user-select:none}@keyframes fielder-sway{0%{transform:translate(0)}50%{transform:translate(1px)}}.fielders-fever .fielder{transition:translate .9s steps(8,end),opacity .9s steps(4,end);opacity:0}.fielders-fever .fielder.side-left{translate:-45cqh 0}.fielders-fever .fielder.side-right{translate:45cqh 0}.fielders-fever .fielder-body{animation:fielder-run .2s steps(1,end) infinite}@keyframes fielder-run{0%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-3px) rotate(6deg)}}.fielders-out .fielder-body{animation:fielder-cheer .5s steps(1,end) 2}@keyframes fielder-cheer{0%{transform:translateY(0)}25%{transform:translateY(-6px)}50%{transform:translateY(-9px)}75%{transform:translateY(-4px)}}@media (prefers-reduced-motion: reduce){.fielder{transition:none}.fielder-body{animation:none!important}}.game-screen{position:relative;width:100%;max-width:400px;height:100svh;max-height:700px;margin:0 auto;overflow:hidden;container-type:size;--pixel-font: "Press Start 2P", "Galmuri11", monospace;--pixel-outline: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 2px 2px 0 #000, -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000;background:url(/assets/bg.jpg) center / cover no-repeat}.hud{position:absolute;top:0;left:0;right:0;z-index:30;display:flex;align-items:flex-start;justify-content:space-between;padding:8px 12px;background:#0000008c}.hud-left{display:flex;flex-direction:column;gap:3px}.hud-label{font-size:10px;color:#fff9}.outs-label{font-size:12px;font-weight:700;letter-spacing:.08em;color:#ffffffd9}.out-row{display:flex;gap:7px;margin-top:4px}.out-dot{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.45);background:transparent;box-shadow:inset 0 0 0 1px #0003;transition:background .12s,border-color .12s,box-shadow .12s,transform .12s}.out-dot.active{background:#ef4444;border-color:#fecaca;box-shadow:0 0 10px #ef4444d9,0 0 18px #ef444473;transform:scale(1.08)}.pause-btn{width:34px;height:34px;margin-top:2px;display:flex;align-items:center;justify-content:center;padding:0;border:2px solid rgba(255,255,255,.85);border-radius:6px;background:#00000073;box-shadow:0 3px #0009;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.pause-btn:active{transform:translateY(2px);box-shadow:0 1px #0009}.pause-icon{width:12px;height:14px;background:linear-gradient(#fff,#fff) left / 4px 100% no-repeat,linear-gradient(#fff,#fff) right / 4px 100% no-repeat}.center-combo{position:absolute;top:29%;left:0;right:0;z-index:32;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none}.center-combo:before{content:"";position:absolute;left:50%;top:50%;width:150px;height:84px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(0,0,0,.55),rgba(0,0,0,.3) 55%,transparent);z-index:-1}.center-label{font-family:var(--pixel-font);font-size:8px;letter-spacing:.1em;color:#ffffffe6;text-shadow:var(--pixel-outline)}.center-num{font-family:var(--pixel-font);line-height:1;color:#fff;font-size:24px;text-shadow:var(--pixel-outline),0 3px 0 rgba(0,0,0,.6);transition:color .2s,font-size .2s}.combo-num{display:inline-block;transform-origin:center;animation:combo-bump .22s ease-out}@keyframes combo-bump{0%{transform:scale(1.5)}to{transform:scale(1)}}.center-num.combo-lv-1{color:#facc15;font-size:24px;text-shadow:var(--pixel-outline),0 0 6px rgba(250,204,21,.6)}.center-num.combo-lv-2{color:#fb923c;font-size:32px;text-shadow:var(--pixel-outline),0 0 8px rgba(251,146,60,.8)}.center-num.combo-lv-3{color:#ef4444;font-size:32px;text-shadow:var(--pixel-outline),0 0 12px rgba(239,68,68,.9)}.center-num.combo-lv-4{color:#e879f9;font-size:32px;text-shadow:var(--pixel-outline),0 0 14px rgba(232,121,249,1),0 0 24px rgba(232,121,249,.6)}.center-num.combo-lv-5{font-size:40px;animation:combo-fire .6s steps(3) infinite}.fever-taps{top:45%;z-index:37}.fever-taps .center-label{color:#fde047;font-size:8px}.fever-taps .center-num{font-size:40px;color:#fde047;text-shadow:var(--pixel-outline),0 0 12px #f97316,0 0 22px rgba(239,68,68,.7)}.fever-taps .combo-num{animation-duration:.12s}@keyframes combo-fire{0%{color:#fde047;text-shadow:var(--pixel-outline),0 0 16px #f97316,0 0 28px #ef4444}50%{color:#f97316;text-shadow:var(--pixel-outline),0 0 20px #ef4444,0 0 32px #facc15}to{color:#fde047;text-shadow:var(--pixel-outline),0 0 16px #f97316,0 0 28px #ef4444}}.scoreboard{position:absolute;top:15.3cqh;left:50%;transform:translate(-50%);width:23.8cqh;height:7cqh;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8cqh;font-family:var(--pixel-font);pointer-events:none}.scoreboard-label{font-size:1.1cqh;color:#fbbf2499;letter-spacing:.15em}.scoreboard-num{font-size:2.6cqh;line-height:1;color:#fbbf24;text-shadow:0 0 4px rgba(251,191,36,.9),0 0 10px rgba(245,158,11,.6);animation:led-flash .25s ease-out}.scoreboard-num.long{font-size:2cqh}.score-pop{position:absolute;left:calc(100% - 1.5cqh);top:1.5cqh;font-size:2.2cqh;line-height:1;white-space:nowrap;color:#4ade80;text-shadow:var(--pixel-outline),0 0 8px rgba(74,222,128,.7);transform-origin:left center;transition:opacity .25s;animation:score-pop-out .35s ease-out forwards}.score-pop.fever{left:50%;top:calc(100% + .8cqh);transform-origin:center top;animation-name:fever-pop-out;animation-duration:.45s;font-size:3cqh;color:#fde047;text-shadow:var(--pixel-outline),0 0 10px #f97316,0 0 18px rgba(239,68,68,.7)}@keyframes fever-pop-out{0%{transform:translate(-50%,-60%) scale(.4)}60%{transform:translate(-50%,10%) scale(1.3)}to{transform:translate(-50%) scale(1)}}@keyframes score-pop-out{0%{transform:translate(-40%,30%) scale(.4)}60%{transform:translate(6%,-30%) scale(1.25)}to{transform:translateY(-20%) scale(1)}}@keyframes led-flash{0%{color:#fff;text-shadow:0 0 8px #fff,0 0 16px #fbbf24}to{color:#fbbf24}}.pitcher-area{position:absolute;top:37.5%;left:50%;transform:translate(-50%);z-index:20;text-align:center}.pitcher-sprite{width:76px;height:76px;object-fit:contain;object-position:bottom center;image-rendering:pixelated;display:block;transition:transform .15s;pointer-events:none;-webkit-user-select:none;user-select:none}.pitcher-sprite.throwing{transform:scale(1.25) rotate(-18deg)}.pitcher-sprite.sweat{scale:1.22;translate:0 4px;transform-origin:50% 86%}.pitcher-body{transform-origin:bottom center;transition:translate .3s steps(3,end),scale .3s steps(3,end);animation:breathe 1.2s steps(1,end) infinite}.scene-hype .pitcher-body{animation:tremble .12s steps(1,end) infinite}.scene-fever .pitcher-body{translate:0 -8px;scale:.85;animation:tremble-big .1s steps(1,end) infinite}.scene-out .pitcher-body{animation:taunt .6s steps(1,end) 2}.pitcher-taunt{position:absolute;bottom:calc(100% - 6px);left:50%;padding:5px 6px 4px;font-family:var(--pixel-font);font-size:11px;color:#111;background:#fff;border:2px solid #111;box-shadow:2px 2px #0006;white-space:nowrap;animation:taunt-pop 1.2s steps(1,end) forwards}@keyframes breathe{0%{transform:scaleY(1)}50%{transform:scaleY(1.03)}}@keyframes tremble{0%{transform:translate(0)}50%{transform:translate(1px)}}@keyframes tremble-big{0%{transform:translate(-2px)}50%{transform:translate(2px)}}@keyframes taunt{0%{transform:translateY(0) scaleX(1)}25%{transform:translateY(-8px) scaleX(-1)}50%{transform:translateY(0) scaleX(-1)}75%{transform:translateY(-8px) scaleX(1)}}@keyframes taunt-pop{0%{transform:translate(-50%,4px) scale(.6);opacity:1}10%{transform:translate(-50%) scale(1.15)}20%{transform:translate(-50%) scale(1)}85%{opacity:1}to{transform:translate(-50%) scale(1);opacity:0}}.ball-lane{position:absolute;top:13%;bottom:calc(25% + 48px);left:50%;transform:translate(-50%);width:54px;z-index:22}.ball-item-wrap{position:absolute;left:50%;opacity:var(--ball-opacity, 1);transform:translate(-50%) scale(var(--ball-scale, 1));transform-origin:center bottom;transition:bottom .16s ease,transform .2s ease-out,opacity .2s ease-out}.ball-lane .ball-item-wrap{animation:ball-spawn .24s ease-out backwards}@keyframes ball-spawn{0%{translate:var(--spawn-x) 0;scale:.5;opacity:0}}.ball-item-wrap.depth-0 .ball-item{filter:drop-shadow(0 0 3px rgba(255,255,255,.85)) drop-shadow(0 2px 4px rgba(0,0,0,.5))}.fly-layer{position:absolute;top:13%;bottom:calc(25% + 48px);left:50%;transform:translate(-50%);width:54px;z-index:33;pointer-events:none}.ball-item-wrap.fly-ball{transition:none}.fly-hit-left,.fly-hit-right{animation:fly-hit .5s forwards}.fly-hit-left.v0{--hit-x: -130px;--hit-y: -240px}.fly-hit-left.v1{--hit-x: -70px;--hit-y: -300px}.fly-hit-right.v0{--hit-x: 130px;--hit-y: -240px}.fly-hit-right.v1{--hit-x: 70px;--hit-y: -300px}.fly-hit-left.v0.homerun{--hit-x: -150px;--hit-y: -290px}.fly-hit-left.v1.homerun{--hit-x: -80px;--hit-y: -350px}.fly-hit-right.v0.homerun{--hit-x: 150px;--hit-y: -290px}.fly-hit-right.v1.homerun{--hit-x: 80px;--hit-y: -350px}.fly-hit-left.v0.single{--hit-x: -115px;--hit-y: -180px}.fly-hit-left.v1.single{--hit-x: -60px;--hit-y: -210px}.fly-hit-right.v0.single{--hit-x: 115px;--hit-y: -180px}.fly-hit-right.v1.single{--hit-x: 60px;--hit-y: -210px}.fly-hit-left.v0.foul{--hit-x: -230px;--hit-y: -200px}.fly-hit-left.v1.foul{--hit-x: -220px;--hit-y: -130px}.fly-hit-right.v0.foul{--hit-x: 230px;--hit-y: -200px}.fly-hit-right.v1.foul{--hit-x: 220px;--hit-y: -130px}.fly-ball.homerun .ball-item{filter:drop-shadow(0 0 5px #fde047) drop-shadow(0 0 12px #f97316)}.fly-miss-left{animation:fly-miss-left .3s ease-in forwards}.fly-miss-right{animation:fly-miss-right .3s ease-in forwards}.fly-take{animation:fly-take .3s ease-in forwards}@keyframes fly-hit{0%{transform:translate(-50%) scale(var(--ball-scale));opacity:1;filter:blur(0);animation-timing-function:cubic-bezier(.1,.7,.3,1)}80%{transform:translate(calc(-50% + var(--hit-x) * .92),var(--hit-y)) scale(.32);opacity:.75;filter:blur(.5px);animation-timing-function:ease-in}to{transform:translate(calc(-50% + var(--hit-x)),calc(var(--hit-y) + 16px)) scale(.26);opacity:0;filter:blur(1.5px)}}@keyframes fly-miss-left{0%{transform:translate(-50%) scale(var(--ball-scale));opacity:1}60%{opacity:1}to{transform:translate(calc(-50% + 22px),150px) scale(2);opacity:0}}@keyframes fly-miss-right{0%{transform:translate(-50%) scale(var(--ball-scale));opacity:1}60%{opacity:1}to{transform:translate(calc(-50% - 22px),150px) scale(2);opacity:0}}@keyframes fly-take{0%{transform:translate(-50%) scale(var(--ball-scale));opacity:1}60%{opacity:1}to{transform:translate(-50%,150px) scale(2);opacity:0}}@keyframes fly-fade{0%{transform:translate(-50%) scale(var(--ball-scale));opacity:1}to{transform:translate(-50%) scale(var(--ball-scale));opacity:0}}.ball-item,.hint-ball{display:flex;align-items:center;justify-content:center}.ball-item{width:48px;height:48px;border-radius:50%;font-size:12px;font-weight:700;color:#fff;border:2.5px solid rgba(255,255,255,.35);box-shadow:0 2px 8px #0006;letter-spacing:-.5px}.ball-item.has-img,.hint-ball.has-img{background:transparent;border:none;box-shadow:none}.ball-sprite{display:block;object-fit:contain;image-rendering:pixelated;pointer-events:none;-webkit-user-select:none;user-select:none}.ball-sprite.lane{width:48px;height:48px}.ball-sprite.lane.fever{width:64px;height:64px;margin:-8px;max-width:none}.ball-lane.fever .ball-item-wrap.depth-0 .ball-item{filter:drop-shadow(0 0 4px rgba(253,224,71,.9)) drop-shadow(0 0 10px rgba(250,204,21,.6))}.ball-sprite.hint{width:48px;height:48px}.hint-side{--hint-step: min(68px, 10cqh);position:absolute;top:50%;width:72px;height:0;z-index:25}.hint-side.left{left:3%}.hint-side.right{right:3%}.hint-item{position:absolute;left:0;right:0;top:calc(var(--hint-offset) * var(--hint-step));transform:translateY(-50%);transition:top .35s ease}.hint-item:before{content:"";position:absolute;left:50%;top:50%;width:96px;height:88px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(0,0,0,.45),rgba(0,0,0,.22) 55%,transparent);z-index:-1;pointer-events:none}.hint-pop{display:flex;flex-direction:column;align-items:center;gap:2px;animation:hint-pop .5s ease-out}@keyframes hint-pop{0%{transform:scale(0);filter:drop-shadow(0 0 0 transparent)}60%{transform:scale(1.25);filter:drop-shadow(0 0 10px #facc15)}to{transform:scale(1);filter:drop-shadow(0 0 0 transparent)}}.hint-ball{width:48px;height:48px;border-radius:50%;font-size:12px;font-weight:700;color:#fff;border:2px solid rgba(255,255,255,.45);box-shadow:0 2px 6px #0006}.hint-lbl{font-size:12px;font-weight:700;color:#fff;text-align:center;line-height:1.3;text-shadow:0 1px 2px rgba(0,0,0,.85),0 0 6px rgba(0,0,0,.55)}.timer-wrap{--timer-fill: linear-gradient(0deg, #15803d 0 35%, #4ade80 35% 100%);--timer-glow: rgba(74, 222, 128, .55);--timer-num: #bbf7d0;position:absolute;bottom:25%;left:10%;right:10%;z-index:25;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:8px;row-gap:4px;pointer-events:none}.timer-wrap.hr{--timer-fill: linear-gradient(0deg, #b45309 0 35%, #fde047 35% 100%);--timer-glow: rgba(253, 224, 71, .8);--timer-num: #fef9c3}.timer-wrap.warn{--timer-fill: linear-gradient(0deg, #a16207 0 35%, #facc15 35% 100%);--timer-glow: rgba(250, 204, 21, .55);--timer-num: #fef08a}.timer-wrap.danger{--timer-fill: linear-gradient(0deg, #b91c1c 0 35%, #ef4444 35% 100%);--timer-glow: rgba(239, 68, 68, .7);--timer-num: #fecaca}.timer-wrap.danger .timer-track{animation:gauge-glow-danger .3s steps(1,end) infinite}.timer-wrap.fever{--timer-fill: linear-gradient(90deg, #ef4444 0%, #f97316 50%, #fde047 100%);--timer-glow: #f97316;--timer-num: #fde047;z-index:37}.timer-track{position:relative;width:100%;height:12px;border:2px solid #111;background:#0000008c;box-shadow:0 0 0 1px #ffffff80,0 0 8px var(--timer-glow);overflow:hidden}.timer-wrap.fever .timer-track{height:16px;animation:gauge-glow .3s steps(1,end) infinite}.timer-bar{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--timer-fill);transform-origin:left center;will-change:transform}.timer-bar.power-ready{animation:power-ready-flash .16s steps(1,end) infinite}@keyframes power-ready-flash{0%{filter:brightness(1.4) saturate(1.3)}50%{filter:brightness(1)}}.power-half{position:absolute;top:-4px;bottom:-4px;width:3px;translate:-50% 0;background:#fff;box-shadow:0 0 0 1px #000,0 0 6px #fde047;z-index:1;pointer-events:none}.timer-track:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(90deg,transparent 0 10px,rgba(0,0,0,.35) 10px 12px);pointer-events:none}.timer-num{font-family:var(--pixel-font);font-size:12px;line-height:1;color:var(--timer-num);text-shadow:var(--pixel-outline)}.timer-wrap.fever .timer-num{font-size:16px}.timer-wrap .fever-sub,.timer-wrap .hit-label{grid-column:1 / -1;justify-self:center}.timer-bar-area{position:relative}.timer-zones i{position:absolute;bottom:calc(100% + 1px);width:8px;height:5px;margin-left:-4px;background:var(--zone-color);clip-path:polygon(0 0,100% 0,100% 40%,75% 40%,75% 70%,60% 70%,60% 100%,40% 100%,40% 70%,25% 70%,25% 40%,0 40%);filter:drop-shadow(0 1px 0 rgba(0,0,0,.7))}.timer-zones i.hr{--zone-color: #fde047}.timer-zones i.double{--zone-color: #4ade80}.timer-zones i.foul{--zone-color: #ef4444}.timer-hr-flash{position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;pointer-events:none;border:3px solid #fff;box-shadow:0 0 10px #fde047,0 0 20px #f97316cc,inset 0 0 8px #fde047e6;animation:timer-hr-flash .5s steps(5,end) forwards}@keyframes timer-hr-flash{0%{opacity:1;border-color:#fff}40%{opacity:1;border-color:#fde047}to{opacity:0;border-color:#fde047}}.hit-label{font-family:var(--pixel-font);font-size:16px;line-height:1;padding:3px 0 2px;color:#fff;text-shadow:var(--pixel-outline);white-space:nowrap;transition:opacity .2s;animation:hit-label-pop .2s ease-out}.hit-label.double{color:#67e8f9}.hit-label.single{color:#f0fdf4}.hit-label.foul{color:#fdba74}.hit-label.homerun{color:transparent;text-shadow:none;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(100deg,#f59e0b 0,#f59e0b 30%,#fde047 40%,#fff 47%,#fff 53%,#fde047 60%,#f59e0b 70%,#f59e0b);background-size:300% 100%;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(0 0 6px rgba(253,224,71,.9));animation:hit-label-pop .2s ease-out,fever-shine .9s steps(9,end) infinite}@keyframes hit-label-pop{0%{transform:scale(.5)}60%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes gauge-glow-danger{0%{box-shadow:0 0 0 1px #fecaca,0 0 10px #ef4444}50%{box-shadow:0 0 0 1px #ffffff80,0 0 4px #ef444480}}.btn-row{position:absolute;bottom:3%;left:0;right:0;display:flex;align-items:flex-end;justify-content:space-between;padding:0 6%;z-index:30}.batter-slot{position:relative;left:20px}.fever-gauge{position:absolute;bottom:6px;display:flex;flex-direction:column;align-items:center;gap:3px;pointer-events:none}.fever-gauge-label{font-family:var(--pixel-font);font-size:6px;color:#fde047;text-shadow:var(--pixel-outline)}.fever-gauge-track{position:relative;width:10px;height:96px;border:2px solid #111;background:#0000008c;box-shadow:0 0 0 1px #ffffff80;overflow:hidden}.fever-gauge-fill{position:absolute;top:0;right:0;bottom:0;left:0;transform:scaleY(0);transform-origin:bottom center;background:linear-gradient(0deg,#ef4444,#f97316,#fde047);transition:transform .15s linear;will-change:transform}.fever-gauge.near-full .fever-gauge-track{animation:gauge-glow .3s steps(1,end) infinite}.fever-gauge.power{right:calc(100% + 26px)}.fever-gauge.power .fever-gauge-label{font-size:8px}.fever-gauge.power .fever-gauge-track{width:14px;height:120px}.fever-gauge.melon{right:calc(100% + 4px)}.fever-gauge.melon .fever-gauge-fill{background:linear-gradient(0deg,#166534,#22c55e 30%,#f87171 70%,#ef4444)}.fever-gauge.melon.near-full .fever-gauge-track{animation:melon-gauge-glow .3s steps(1,end) infinite}.melon-gauge-icon{width:16px;height:16px;image-rendering:pixelated}@keyframes melon-gauge-glow{0%{box-shadow:0 0 0 1px #86efac,0 0 8px #22c55e}50%{box-shadow:0 0 0 1px #fff,0 0 4px #f87171}}@keyframes gauge-glow{0%{box-shadow:0 0 0 1px #fde047,0 0 8px #f97316}50%{box-shadow:0 0 0 1px #fff,0 0 4px #fde047}}.batter-slot.fever-active .fever-gauge.power{visibility:hidden}.batter-wrap{position:relative;z-index:0;transform-origin:bottom center;scale:1.15;transition:scale .3s steps(3,end),translate .2s steps(2,end),rotate .2s steps(2,end);animation:breathe 1.2s steps(1,end) infinite}.scene-hype .batter-wrap{scale:1.25}.scene-hype .batter-sprite{animation:aura-hype .5s steps(1,end) infinite}.scene-fever .batter-wrap{scale:1.4}.scene-fever .batter-sprite{animation:aura-fever .24s steps(1,end) infinite}.scene-out .batter-wrap{translate:0 4px;rotate:5deg;animation:none}.scene-out .batter-sprite{filter:grayscale(.7) brightness(.85)}@keyframes aura-hype{0%{filter:drop-shadow(0 0 2px #f97316) drop-shadow(0 0 4px rgba(249,115,22,.6))}50%{filter:drop-shadow(0 0 3px #fb923c) drop-shadow(0 0 7px rgba(249,115,22,.8))}}@keyframes aura-fever{0%{filter:drop-shadow(0 0 2px #fde047) drop-shadow(0 0 6px #f97316) drop-shadow(0 -4px 8px #ef4444)}50%{filter:drop-shadow(0 0 3px #facc15) drop-shadow(0 0 9px #ef4444) drop-shadow(0 -6px 10px #f97316)}}.swing-trail{position:absolute;left:50%;bottom:34%;width:120px;height:60px;margin-left:-60px;border:4px solid rgba(255,255,255,.85);border-bottom:none;border-radius:60px 60px 0 0;pointer-events:none;z-index:1}.scene-hype .swing-trail{border-color:#fb923c;filter:drop-shadow(0 0 3px rgba(249,115,22,.8))}.swing-trail.left{animation:trail-left .26s steps(4,end) forwards}.swing-trail.right{animation:trail-right .26s steps(4,end) forwards}.scene-fever .swing-trail{border-width:6px;border-color:#facc15;filter:drop-shadow(0 0 4px #f97316)}.swing-trail.power{scale:1.6;border-width:8px;border-color:#fff7cc;filter:drop-shadow(0 0 6px #facc15) drop-shadow(0 0 12px #f97316)}.swing-trail.power.left,.swing-trail.power.right{animation-duration:.4s}.batter-wrap.charging{rotate:-8deg;animation:charge-shake .08s steps(1,end) infinite}.batter-wrap.charging .batter-sprite{filter:drop-shadow(0 0 4px #fff7cc) drop-shadow(0 0 10px #facc15) drop-shadow(0 -4px 12px #f97316);animation:none}@keyframes charge-shake{0%{transform:translate(-1px)}50%{transform:translate(1px)}}@keyframes trail-left{0%{clip-path:inset(0 0 0 100%);opacity:1}50%{clip-path:inset(0 0 0 0);opacity:1}to{clip-path:inset(0 0 0 0);opacity:0}}@keyframes trail-right{0%{clip-path:inset(0 100% 0 0);opacity:1}50%{clip-path:inset(0 0 0 0);opacity:1}to{clip-path:inset(0 0 0 0);opacity:0}}.batter-sprite{width:88px;height:88px;object-fit:contain;object-position:bottom center;image-rendering:pixelated;pointer-events:none;-webkit-user-select:none;user-select:none;margin-bottom:2px}.dir-btn{--btn-face: #cbb68a;--btn-face-hi: #fffdf6;--btn-edge: #7a6443;--btn-shade: inset 0 -5px 0 rgba(122, 100, 67, .35), inset 0 3px 0 rgba(255, 255, 255, .9);--btn-rim: #3b2f23;--btn-arrow: #dc2626;--btn-depth: 6px;position:relative;z-index:1;width:76px;height:58px;margin-bottom:var(--btn-depth);touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:14px;border:3px solid var(--btn-rim);background:linear-gradient(180deg,rgba(255,255,255,.28) 0 38%,transparent 38%),linear-gradient(180deg,var(--btn-face-hi),var(--btn-face));cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:var(--btn-shade),0 var(--btn-depth) 0 var(--btn-edge),0 calc(var(--btn-depth) + 4px) 8px #00000073;transition:transform .06s,box-shadow .06s,filter .06s}.dir-btn:active,.dir-btn.pressed{transform:translateY(var(--btn-depth));box-shadow:var(--btn-shade),0 0 0 var(--btn-edge),0 0 14px var(--btn-arrow);filter:brightness(1.15)}.dir-arrow{display:block;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000);pointer-events:none}.dir-arrow:before{content:"";display:block;width:15px;height:27px;background:var(--btn-arrow);clip-path:polygon(0 0,20% 0,20% 11.1%,40% 11.1%,40% 22.2%,60% 22.2%,60% 33.3%,80% 33.3%,80% 44.4%,100% 44.4%,100% 55.6%,80% 55.6%,80% 66.7%,60% 66.7%,60% 77.8%,40% 77.8%,40% 88.9%,20% 88.9%,20% 100%,0 100%)}.dir-arrow.left{transform:scaleX(-1) translate(2px)}.dir-arrow.right{transform:translate(2px)}.scene-fever .dir-btn{--btn-face: #b45309;--btn-face-hi: #facc15;--btn-edge: #78350f;--btn-rim: #fff7cc;--btn-shade: 0 0 transparent;--btn-arrow: #ffffff}.scene-fever .dir-btn:not(.pressed):not(:active){animation:fever-btn-glow .6s steps(1,end) infinite}@keyframes fever-btn-glow{0%{filter:drop-shadow(0 0 2px #fde047)}50%{filter:drop-shadow(0 0 8px #facc15) drop-shadow(0 0 14px #f97316)}}.tap-badge{position:absolute;bottom:calc(100% + 12px);left:50%;translate:-50% 0;padding:4px 5px 3px;font-family:var(--pixel-font);font-size:11px;line-height:1;color:#fde047;background:#000000bf;border:2px solid #fde047;text-shadow:var(--pixel-outline);white-space:nowrap;pointer-events:none;animation:tap-badge-blink .4s steps(1,end) infinite}.tap-badge.right{animation-delay:-.2s}.tap-badge:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border:5px solid transparent;border-top-color:#fde047}@keyframes tap-badge-blink{0%{color:#fde047;border-color:#fde047;scale:1.15}50%{color:#fff;border-color:#fff;scale:1}}.scene-out .dir-btn{--btn-face: #3f3f46;--btn-face-hi: #71717a;--btn-edge: #18181b;--btn-rim: #a1a1aa;--btn-shade: 0 0 transparent;--btn-arrow: #e4e4e7}.result-pop{position:absolute;top:42%;left:50%;transform:translate(-50%);font-family:var(--pixel-font);font-size:18px;line-height:1.5;text-align:center;text-shadow:var(--pixel-outline),0 4px 8px rgba(0,0,0,.6);z-index:40;pointer-events:none;white-space:pre;transition:opacity .3s;animation:pop-in .25s ease-out}@keyframes pop-in{0%{transform:translate(-50%) scale(.4)}60%{transform:translate(-50%) scale(1.25)}to{transform:translate(-50%) scale(1)}}.result-pop.new,.result-pop.melon,.result-pop.bad{color:transparent;text-shadow:none;-webkit-background-clip:text;background-clip:text}.result-pop.new{background-image:linear-gradient(100deg,#c084fc 0,#c084fc 30%,#f0abfc 40%,#fff 47%,#fff 53%,#f0abfc 60%,#d946ef 70%,#d946ef);background-size:300% 100%;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(0 0 6px rgba(240,171,252,.9)) drop-shadow(0 0 14px rgba(192,38,211,.8));animation:pop-in .25s ease-out,fever-shine .9s steps(9,end) infinite}.result-pop.melon{background-image:linear-gradient(100deg,#22c55e 0,#22c55e 30%,#86efac 40%,#fff 47%,#fff 53%,#fca5a5 60%,#ef4444 70%,#ef4444);background-size:300% 100%;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(0 0 6px rgba(134,239,172,.9)) drop-shadow(0 0 14px rgba(22,163,74,.8));animation:pop-in .25s ease-out,fever-shine .9s steps(9,end) infinite}.result-pop.bad{font-size:22px;background-image:linear-gradient(180deg,#fca5a5,#ef4444,#991b1b 70%,#3f0a0a);filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(0 0 8px rgba(127,29,29,.9)) drop-shadow(0 6px 6px rgba(0,0,0,.85));animation:pop-in .25s ease-out,bad-sink .6s ease-in .25s forwards}@keyframes bad-sink{0%{transform:translate(-50%) translateY(0) scale(1)}to{transform:translate(-50%) translateY(6px) scale(.95)}}.fever-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:35;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(249,115,22,.32) 100%);animation:fever-border .36s steps(1,end) infinite}.fever-overlay:before{content:"";position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;background:repeating-conic-gradient(rgba(255,255,255,.16) 0deg 2deg,transparent 2deg 12deg);mask-image:radial-gradient(closest-side,transparent 30%,#000 60%);-webkit-mask-image:radial-gradient(closest-side,transparent 30%,#000 60%);animation:speedlines .3s steps(1,end) infinite}@keyframes fever-border{0%{box-shadow:inset 0 0 0 3px #fde047,inset 0 0 0 6px #f97316,inset 0 0 0 9px #ef4444b3}33.3%{box-shadow:inset 0 0 0 3px #f97316,inset 0 0 0 6px #ef4444,inset 0 0 0 9px #fde047b3}66.6%{box-shadow:inset 0 0 0 3px #ef4444,inset 0 0 0 6px #fde047,inset 0 0 0 9px #f97316b3}}@keyframes speedlines{0%{transform:rotate(0)}50%{transform:rotate(5deg)}}.game-screen.scene-out{animation:screen-shake .3s steps(1,end)}@keyframes screen-shake{0%{transform:translate(-4px)}20%{transform:translate(4px,-2px)}40%{transform:translate(-3px,2px)}60%{transform:translate(3px)}80%{transform:translate(-1px,1px)}to{transform:translate(0)}}.out-vignette{position:absolute;top:0;right:0;bottom:0;left:0;z-index:34;pointer-events:none;background:radial-gradient(ellipse at center,transparent 45%,rgba(239,68,68,.55) 100%);animation:out-vignette .45s ease-out forwards}@keyframes out-vignette{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.pitcher-body,.batter-wrap,.batter-sprite,.fever-overlay,.fever-overlay:before,.game-screen.scene-out,.fever-sub,.fever-gauge-track,.timer-track,.score-pop,.swing-trail,.batter-wrap.charging,.timer-bar.power-ready,.game-screen.grand-slam,.ball-lane .ball-item-wrap{animation:none!important}.swing-trail{display:none!important}.fly-ball{animation:fly-fade .15s ease-out forwards!important}.scene-fever .dir-btn,.tap-badge,.fever-title,.fever-title-text,.fever-title-text:before,.fever-title-text:after{animation:none!important}.result-pop.new,.result-pop.melon,.result-pop.bad{animation:pop-in .25s ease-out!important}.hit-label.homerun{animation:hit-label-pop .2s ease-out!important}.timer-hr-flash{animation:none!important;opacity:0}.fever-overlay{box-shadow:inset 0 0 0 4px #facc15}}.fever-ui{position:absolute;top:24%;left:0;right:0;z-index:36;text-align:center;pointer-events:none}.fever-title{display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--pixel-font);font-size:32px;line-height:1;animation:fever-title-pop .35s ease-out,fever-title-pulse .48s steps(1,end) .35s infinite}.fever-fire{font-size:26px}.fever-title-text{position:relative;color:transparent;background:linear-gradient(100deg,#f59e0b 0,#f59e0b 30%,#fde047 40%,#fff 47%,#fff 53%,#fde047 60%,#f59e0b 70%,#f59e0b);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(0 0 6px rgba(253,224,71,.9)) drop-shadow(0 0 14px rgba(249,115,22,.8));animation:fever-shine .9s steps(9,end) infinite}.fever-title-text:before,.fever-title-text:after{content:"✦";position:absolute;font-size:14px;color:#fff;-webkit-text-fill-color:#fff;text-shadow:0 0 6px #fde047;animation:fever-sparkle .6s steps(1,end) infinite}.fever-title-text:before{top:-12px;left:-6px}.fever-title-text:after{bottom:-10px;right:-8px;animation-delay:-.3s}.fever-title.grand-slam{white-space:nowrap;animation:grand-slam-in .4s ease-out,fever-title-pulse .3s steps(1,end) .4s infinite}.grand-slam .fever-title-text{background-image:linear-gradient(100deg,#dc2626 0,#dc2626 25%,#f97316,#fde047 45%,#fff,#fde047 55%,#f97316,#dc2626 75%,#dc2626);filter:drop-shadow(3px 0 0 #000) drop-shadow(-3px 0 0 #000) drop-shadow(0 3px 0 #000) drop-shadow(0 -3px 0 #000) drop-shadow(0 0 8px rgba(253,224,71,1)) drop-shadow(0 0 20px rgba(220,38,38,.9));animation-duration:.6s}@container (max-width: 360px){.fever-title.grand-slam{font-size:24px}}@keyframes grand-slam-in{0%{transform:scale(3);opacity:0}50%{transform:scale(.9);opacity:1}75%{transform:scale(1.1)}to{transform:scale(1)}}.game-screen.grand-slam{animation:screen-shake .35s steps(1,end)}@keyframes fever-title-pop{0%{transform:scale(.3)}60%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes fever-title-pulse{0%{transform:scale(1)}50%{transform:scale(1.07)}}@keyframes fever-shine{0%{background-position:100% 0}to{background-position:0 0}}@keyframes fever-sparkle{0%{opacity:1;transform:scale(1)}50%{opacity:.2;transform:scale(.5)}}.fever-sub{display:inline-block;padding:4px 7px 3px;font-family:var(--pixel-font);font-size:12px;line-height:1;color:#fff;background:#0000008c;border:2px solid #fde047;text-shadow:var(--pixel-outline);animation:tap-away-blink .4s steps(1,end) infinite}@keyframes tap-away-blink{0%{color:#fff;border-color:#fde047}50%{color:#fde047;border-color:#fff}}.fever-sub.melon{background:#14532dcc;border-color:#22c55e;animation-name:melon-tap-blink}@keyframes melon-tap-blink{0%{color:#fca5a5;border-color:#22c55e}50%{color:#fff;border-color:#f87171}}.game-screen.paused :not(.pause-overlay,.pause-overlay *){animation-play-state:paused!important}.pause-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:#0009;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.pause-title{font-family:var(--pixel-font);font-size:26px;color:#fde047;text-shadow:var(--pixel-outline),0 4px 10px rgba(0,0,0,.6)}.pause-menu{display:flex;flex-direction:column;gap:16px;width:230px}.pause-menu-btn{display:flex;align-items:center;justify-content:center;gap:10px;height:48px;margin-bottom:5px;padding:0 12px;font-family:var(--pixel-font);font-size:13px;color:#3b2f23;border:3px solid #3b2f23;border-radius:10px;background:linear-gradient(180deg,#fffdf6,#cbb68a);box-shadow:inset 0 -4px #7a644359,0 5px #7a6443,0 8px 8px #00000073;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.pause-menu-btn:active{transform:translateY(5px);box-shadow:inset 0 -4px #7a644359,0 0 #7a6443}.pause-menu-btn.primary{color:#b91c1c}.pause-sound-icon{width:16px;height:16px;background-color:currentColor;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}.result-screen{position:relative;width:100%;max-width:400px;height:100svh;max-height:700px;margin:0 auto;overflow:hidden;background:url(/assets/bg.jpg) center / cover no-repeat;display:flex;align-items:center;justify-content:center;font-family:DM Sans,sans-serif;--pixel-font: "Press Start 2P", "Galmuri11", monospace;--led: #fbbf24;--led-glow: 0 0 4px rgba(251, 191, 36, .9), 0 0 10px rgba(245, 158, 11, .6);--panel-bg: rgba(8, 14, 26, .82);--panel-border: rgba(255, 255, 255, .12)}.result-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 50% 40%,#08122059,#081220bf 70%),linear-gradient(180deg,#08122073,#081220cc);pointer-events:none}.result-content{position:relative;z-index:1;width:100%;max-height:100%;padding:16px 20px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.result-title{font-family:Bebas Neue,Impact,sans-serif;font-weight:400;font-size:clamp(2.6rem,11vw,3.2rem);line-height:.9;letter-spacing:.05em;text-transform:uppercase;color:#f8fafc;text-shadow:0 2px 0 rgba(0,0,0,.35),0 8px 24px rgba(0,0,0,.45);animation:result-in .6s ease-out both}.result-board{width:100%;padding:16px 14px 18px;border-radius:6px;background:radial-gradient(circle,rgba(251,191,36,.06) 1px,transparent 1.5px) 0 0 / 4px 4px,#0b0f14;border:3px solid #1f2937;box-shadow:inset 0 0 0 2px #000,inset 0 0 18px #000c,0 10px 24px #00000073;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--pixel-font);position:relative;animation:result-in .6s .08s ease-out both}.result-board:before{content:"";position:absolute;top:5px;right:5px;bottom:5px;left:5px;border:3px dotted rgba(251,191,36,.55);border-radius:3px;filter:drop-shadow(0 0 2px rgba(251,191,36,.7));pointer-events:none}.result-board-label{font-size:9px;letter-spacing:.2em;color:#fbbf2499}.result-board-num{font-size:30px;line-height:1;color:var(--led);text-shadow:var(--led-glow);font-variant-numeric:tabular-nums}.result-board-num.long{font-size:24px}.result-board-num.done{animation:led-final .5s ease-out,led-glow 3.6s .5s ease-in-out infinite}@keyframes led-glow{0%,to{color:#fcd34d;text-shadow:0 0 3px rgba(253,224,71,.9),0 0 8px rgba(250,204,21,.5)}50%{color:#fef3a0;text-shadow:0 0 2px rgba(255,255,255,.7),0 0 5px rgba(254,240,138,.85),0 0 12px rgba(250,204,21,.45)}}@keyframes led-final{0%{color:#fff;text-shadow:0 0 10px #fff,0 0 22px var(--led);transform:scale(1.12)}to{color:var(--led);transform:scale(1)}}.box-score{width:100%;border-radius:6px;background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:0 10px 24px #00000059;padding:4px 12px 6px;animation:result-in .6s .16s ease-out both}.box-score-head{display:flex;justify-content:space-between;padding:8px 0 7px;border-bottom:2px solid rgba(255,255,255,.18);font-family:var(--pixel-font);font-size:8px;letter-spacing:.15em;color:#fbbf24bf}.box-row{display:grid;grid-template-columns:1fr auto 88px;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.1);opacity:.28;transition:opacity .2s}.box-row:last-child{border-bottom:none}.box-row.lit{opacity:1}.box-label{display:flex;align-items:center;gap:6px;text-align:left;font-size:14px;font-weight:700;color:#f8fafc}.box-avg{display:inline-flex;align-items:baseline;gap:4px;padding:3px 6px 2px;border-radius:4px;background:#0b0f14;border:1px solid rgba(251,191,36,.45);font-family:var(--pixel-font);font-size:11px;font-weight:400;line-height:1;color:var(--led);text-shadow:var(--led-glow);font-variant-numeric:tabular-nums}.box-avg-label{font-size:7px;color:#fbbf24a6;text-shadow:none}.box-value{font-family:var(--pixel-font);font-size:11px;color:#f8fafc;text-align:right}.box-pts{font-family:var(--pixel-font);font-size:10px;color:#4ade80;text-align:right;visibility:hidden}.box-row.lit .box-pts{visibility:visible;animation:pts-pop .3s ease-out}@keyframes pts-pop{0%{transform:translate(-6px);opacity:0}to{transform:translate(0);opacity:1}}.result-grade{display:flex;align-items:center;justify-content:center;gap:14px;min-height:64px;visibility:hidden}.result-grade.show{visibility:visible}.grade-stamp{font-family:var(--pixel-font);font-size:34px;line-height:1;color:var(--grade-color);text-shadow:2px 0 0 #000,-2px 0 0 #000,0 2px 0 #000,0 -2px 0 #000,3px 3px 0 #000}.result-grade.show .grade-stamp{animation:stamp-in .45s cubic-bezier(.2,1.6,.4,1) both}.grade-stamp.grade-sss{font-size:30px}.result-grade.show .grade-stamp.grade-sss{animation:stamp-in .45s cubic-bezier(.2,1.6,.4,1) both,sss-glow 1.2s .45s ease-in-out infinite}@keyframes stamp-in{0%{transform:scale(2.6) rotate(-12deg);opacity:0}to{transform:scale(1) rotate(-6deg);opacity:1}}@keyframes sss-glow{0%,to{transform:rotate(-6deg);filter:drop-shadow(0 0 4px rgba(250,204,21,.6))}50%{transform:rotate(-6deg);filter:drop-shadow(0 0 14px rgba(250,204,21,1))}}.grade-info{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.result-grade.show .grade-info{animation:result-in .4s .2s ease-out both}.grade-title{font-family:Bebas Neue,Impact,sans-serif;font-size:24px;line-height:1;letter-spacing:.05em;color:#f8fafc;text-shadow:0 2px 0 rgba(0,0,0,.4)}.grade-balls{display:flex;gap:4px}.grade-ball{width:20px;height:20px;image-rendering:pixelated}.grade-ball.fallback{border-radius:50%;border:2px solid rgba(0,0,0,.4)}.grade-ball.locked{filter:grayscale(1) brightness(.35);opacity:.6}.result-best{min-height:36px;display:flex;align-items:center;justify-content:center;visibility:hidden}.result-best.show{visibility:visible;animation:result-in .4s .35s ease-out both}.best-board{position:relative;display:flex;align-items:center;gap:10px;padding:7px 14px 6px;border-radius:4px;background:radial-gradient(circle,rgba(251,191,36,.06) 1px,transparent 1.5px) 0 0 / 4px 4px,#0b0f14;border:2px solid #1f2937;box-shadow:inset 0 0 0 1px #000,inset 0 0 10px #000c,0 6px 14px #0006;align-self:flex-start;font-family:var(--pixel-font);transform-origin:50% -12px}.best-board:before,.best-board:after{content:"";position:absolute;top:-15px;width:3px;height:13px;background:linear-gradient(90deg,#374151,#1f2937)}.best-board:before{left:18%}.best-board:after{right:18%}.result-best.show .best-board{animation:best-swing .9s ease-out}@keyframes best-swing{0%{transform:rotate(4deg)}35%{transform:rotate(-3deg)}65%{transform:rotate(1.5deg)}to{transform:rotate(0)}}.best-board-label{font-size:8px;letter-spacing:.15em;color:#fbbf2473}.best-board-num{font-size:13px;line-height:1;color:#c98f1a;text-shadow:0 0 4px rgba(201,143,26,.45);font-variant-numeric:tabular-nums}.home-run{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px}.home-run-text{font-family:var(--pixel-font);font-size:16px;color:#facc15;text-shadow:2px 0 0 #000,-2px 0 0 #000,0 2px 0 #000,0 -2px 0 #000,0 0 12px rgba(250,204,21,.7);animation:home-run-blink .8s steps(2) infinite}@keyframes home-run-blink{0%{color:#facc15}to{color:#fff}}.home-run-ball{position:absolute;left:50%;top:50%;width:14px;height:14px;image-rendering:pixelated;pointer-events:none;animation:home-run-fly 1.1s .4s ease-out both}@keyframes home-run-fly{0%{transform:translate(-50%) scale(1.4);opacity:1}to{transform:translate(140px,-260px) scale(.3);opacity:0}}.result-actions{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:4px;animation:result-in .6s .24s ease-out both}.result-sub-actions{display:flex;align-items:center;justify-content:center;gap:12px}.btn-retry,.btn-share{position:relative;min-height:52px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border:3px solid #111827;border-radius:10px;font-family:"Galmuri14",var(--pixel-font);font-size:14px;font-weight:400;font-synthesis:none;letter-spacing:.04em;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .1s ease-out,box-shadow .1s ease-out,background-color .15s,color .15s}.btn-retry{width:min(100%,260px);min-height:56px;background:radial-gradient(ellipse 75% 100% at 50% 40%,#fef08a,#facc15 55%,#f59e0b);color:#111827;font-family:var(--pixel-font);font-size:16px;letter-spacing:.02em;box-shadow:inset 0 0 12px #ffffff73,inset 0 -4px #d97706,inset 0 3px #fde68a,0 5px #111827,0 12px 22px #00000059}.btn-retry{animation:retry-glow 2.4s ease-in-out infinite}@keyframes retry-glow{0%,to{filter:drop-shadow(0 0 6px rgba(251,176,36,.35))}50%{filter:drop-shadow(0 0 14px rgba(249,145,22,.6))}}.btn-retry-text{background:linear-gradient(180deg,#5c1f08,#3b1204 45%,#0f0501);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(255,247,200,.55))}.btn-retry:after{content:"";position:absolute;top:4px;right:5px;bottom:6px;left:5px;border:1.5px dashed rgba(161,98,7,.45);border-radius:6px;pointer-events:none}.btn-share{padding:0 22px;background-color:#0f172a;color:#fcd34d;box-shadow:inset 0 0 0 2px #1f2937,inset 0 3px 0 2px #ffffff0f,0 5px #111827,0 12px 22px #00000059}@media (hover: hover){.btn-retry:hover,.btn-share:hover{transform:translateY(-2px)}.btn-retry:hover{background:radial-gradient(ellipse 75% 100% at 50% 40%,#fef9c3,#fde047 55%,#fbbf24);box-shadow:inset 0 0 16px #fff9,inset 0 -4px #d97706,inset 0 3px #fef9c3,0 7px #111827,0 16px 28px #0006,0 0 18px #facc1573}.btn-share:hover{background-color:#1e293b;color:#fde68a;box-shadow:inset 0 0 0 2px #fbbf248c,inset 0 3px 0 2px #ffffff14,0 7px #111827,0 16px 28px #0006,0 0 16px #fbbf2440}}.btn-retry:active,.btn-share:active{transform:translateY(5px)}.btn-retry:active{box-shadow:inset 0 0 12px #ffffff73,inset 0 -4px #d97706,inset 0 3px #fde68a,0 0 #111827,0 4px 10px #0000004d}.btn-share:active{box-shadow:inset 0 0 0 2px #1f2937,0 0 #111827,0 4px 10px #0000004d}.btn-retry:focus-visible,.btn-share:focus-visible{outline:3px solid #fde68a;outline-offset:3px}.btn-home{min-height:44px;padding:0 16px;border:none;background:transparent;color:#ffffffa6;font-family:"Galmuri11",var(--pixel-font);font-size:13px;letter-spacing:.04em;text-shadow:0 1px 0 rgba(0,0,0,.6);cursor:pointer;transition:color .12s;animation:result-in .6s .32s ease-out both}.btn-home:before{content:"◀ ";font-size:9px;vertical-align:1px}@media (hover: hover){.btn-home:hover{color:var(--led)}}.result-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translate(-50%);padding:14px 24px;border:3px solid #111827;border-radius:999px;background:#facc15;color:#111827;font-size:16px;font-weight:700;white-space:nowrap;box-shadow:0 4px #111827,0 12px 32px #0000008c;pointer-events:none;animation:result-toast-in .32s cubic-bezier(.34,1.56,.64,1);z-index:100}@keyframes result-toast-in{0%{opacity:0;transform:translate(-50%,24px) scale(.8)}to{opacity:1;transform:translate(-50%) scale(1)}}@keyframes result-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.result-screen *,.result-screen *:before,.result-screen *:after{animation:none!important;transition:none!important}}.bgm-toggle-layer{position:fixed;top:0;left:50%;transform:translate(-50%);width:100%;max-width:400px;display:flex;justify-content:flex-end;gap:8px;padding:8px;z-index:100;pointer-events:none}.bgm-toggle{pointer-events:auto;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:#00000073;color:#fff;cursor:pointer}.bgm-toggle:active{transform:scale(.92)}.bgm-toggle-icon{width:16px;height:16px;background-color:currentColor;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}html,body,#root{width:100%;min-height:100vh;background:#0f172a;display:flex;justify-content:center;align-items:flex-start;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}