.runner-game{min-height:calc(100vh - 92px);padding:18px clamp(16px,4vw,60px) 40px}.runner-world{height:680px;position:relative;overflow:hidden;border:8px solid #ffffff24;border-radius:40px;background:radial-gradient(circle at 72% 23%,#ffdf7b 0 3%,#ffdf7b44 4% 10%,transparent 22%),linear-gradient(180deg,#182f6b 0%,#4b65ad 49%,#9e76ba 71%,#f69a8c 100%);box-shadow:var(--shadow);isolation:isolate}.runner-world:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffff0b 36% 42%,transparent 43%);pointer-events:none}.runner-sky{position:absolute;inset:0;color:#fff8b0;font-size:25px}.runner-sky span{position:absolute;animation:twinkle 1.8s ease-in-out infinite}.runner-sky span:nth-child(1){left:12%;top:18%}.runner-sky span:nth-child(2){left:78%;top:30%;animation-delay:.5s}.runner-sky span:nth-child(3){left:55%;top:13%;animation-delay:1s}.runner-mission{position:absolute;z-index:5;top:24px;left:50%;transform:translateX(-50%);width:min(630px,75%);text-align:center;color:white;text-shadow:0 3px 12px #071536}.runner-mission .eyebrow{color:#9ff8e8}.runner-mission h1{font-size:clamp(30px,4.7vw,50px)}.runner-mission h1 b{display:inline-grid;place-items:center;width:60px;height:60px;background:var(--yellow);color:var(--navy);border-radius:18px;text-shadow:none;box-shadow:0 7px 0 #d89900}.runner-mission p{margin:10px 0;color:#ecf2ff;font-weight:800}.runner-status{position:absolute;z-index:7;top:20px;left:20px;display:flex;flex-direction:column;gap:8px}.runner-status span{background:#091c49c4;border:1px solid #ffffff35;color:white;padding:8px 12px;border-radius:14px;font-weight:900;backdrop-filter:blur(8px)}#runnerHearts{color:#ff91a0;letter-spacing:3px}.count-beacon{position:absolute;z-index:7;right:22px;top:22px;width:78px;height:78px;border-radius:24px;background:#091c49d9;border:2px solid #ffffff44;display:grid;place-content:center;text-align:center;color:white;box-shadow:var(--soft)}.count-beacon strong{font:700 34px Fredoka;color:var(--yellow);line-height:1}.count-beacon small{font-size:11px;font-weight:900}.runner-lane{position:absolute;z-index:3;left:0;right:0;bottom:86px;height:320px}.runner-ground{position:absolute;left:0;right:0;bottom:0;height:76px;background:linear-gradient(#294d77,#102b51);border-top:8px solid #b3e1de;box-shadow:0 -8px 0 #ffffff17}.runner-ground:after{content:"";position:absolute;inset:22px 0 0;background:repeating-linear-gradient(90deg,transparent 0 70px,#ffffff17 72px 76px)}.runner-pip{position:absolute;z-index:5;left:13%;bottom:48px;width:180px;height:210px;transition:filter .2s;transform-origin:bottom center}.runner-pip img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 14px #071a3b66)}.runner-pip.jumping{animation:pip-jump .68s cubic-bezier(.2,.6,.35,1)}.runner-obstacle{position:absolute;z-index:4;left:105%;bottom:59px;width:90px;height:90px;display:grid;place-items:center;font-size:72px;filter:drop-shadow(0 12px 7px #071b3c77)}.runner-obstacle.bonked{animation:bonk .4s ease-out}.runner-callout{position:absolute;z-index:7;bottom:104px;left:50%;transform:translateX(-50%);background:white;color:var(--navy);padding:12px 22px;border-radius:18px;font-weight:900;box-shadow:var(--soft);white-space:nowrap}.jump-button{position:absolute;z-index:8;bottom:18px;left:50%;transform:translateX(-50%);height:70px;min-width:210px;border:0;border-radius:24px;background:var(--yellow);color:var(--navy);font:800 22px Fredoka;box-shadow:0 8px 0 #c98700,0 15px 30px #06142b55;cursor:pointer;touch-action:manipulation}.jump-button:active{transform:translate(-50%,6px);box-shadow:0 2px 0 #c98700}.jump-button span{font-size:30px}.runner-quiz h2{font-size:20px;margin:0 0 10px}.runner-finish{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:white;padding:25px}.runner-finish>img{width:220px;height:220px;object-fit:contain;filter:drop-shadow(0 20px 18px #071a3e)}.runner-finish h1{font-size:clamp(44px,7vw,76px)}.runner-finish>p{font-size:19px;margin:12px}.runner-finish .reward-row{z-index:2}
@keyframes pip-jump{0%,100%{transform:translateY(0) rotate(0)}42%{transform:translateY(-170px) rotate(-8deg)}67%{transform:translateY(-130px) rotate(5deg)}}@keyframes bonk{40%{transform:rotate(22deg) scale(1.2)}100%{transform:rotate(0) scale(1)}}@keyframes twinkle{50%{opacity:.25;transform:scale(.7)}}
@media(max-width:650px){.runner-world{height:650px;border-radius:28px}.runner-mission{width:76%;top:64px}.runner-mission h1{font-size:29px}.runner-mission h1 b{width:45px;height:45px;border-radius:14px}.runner-mission p{font-size:13px}.runner-status{top:10px;left:10px}.runner-status span{font-size:11px;padding:6px 8px}.count-beacon{right:10px;top:10px;width:60px;height:60px;border-radius:18px}.count-beacon strong{font-size:26px}.runner-lane{height:290px}.runner-pip{left:5%;width:135px;height:175px}.runner-obstacle{width:65px;height:65px;font-size:55px}.runner-callout{bottom:98px;font-size:12px;padding:10px 12px}.runner-quiz h2{font-size:15px}.runner-quiz .number-btn{width:48px;height:48px;font-size:22px}.jump-button{height:65px;min-width:190px}.runner-finish>img{width:180px;height:180px}}
.runner-pip.jumping{animation-duration:.9s}.runner-obstacle.ready{animation:jump-cue .65s ease-in-out infinite}.runner-obstacle.ready:after{content:"JUMP!";position:absolute;top:-35px;left:50%;transform:translateX(-50%);background:var(--yellow);color:var(--navy);font:800 12px Fredoka;padding:5px 9px;border-radius:10px;box-shadow:0 4px 0 #c98700}.runner-world{cursor:pointer}.runner-world:has(.runner-obstacle.ready) .jump-button{animation:button-cue .65s ease-in-out infinite}@keyframes jump-cue{50%{filter:drop-shadow(0 0 22px #fff7a3);transform:scale(1.13)}}@keyframes button-cue{50%{box-shadow:0 8px 0 #c98700,0 0 35px #fff38a;transform:translateX(-50%) scale(1.05)}}
.timing-zone{position:absolute;z-index:4;left:18%;bottom:151px;width:15%;height:130px;border-left:3px dashed #fff8a0;border-right:3px dashed #fff8a0;color:#fff7ad;font-size:10px;font-weight:900;letter-spacing:.08em;text-align:center;padding-top:5px;opacity:.55;pointer-events:none}.runner-obstacle.cleared{filter:drop-shadow(0 0 24px #89ffdd)}.runner-pip.hit{animation:pip-hit .65s ease-out forwards}.crash-mark{position:absolute;font-size:85px;top:22%;right:28%;animation:crash-spin 1s ease-in-out infinite}.game-over{background:radial-gradient(circle at 50% 25%,#e66f83 0,transparent 32%),linear-gradient(180deg,#172754,#563665 70%,#a95767)}.game-over>img{filter:grayscale(.12) drop-shadow(0 20px 18px #071a3e)}.endless-track span{width:100%!important;background:repeating-linear-gradient(90deg,var(--teal) 0 18px,#ffffff55 18px 26px)!important;animation:track-run 1s linear infinite}@keyframes pip-hit{35%{transform:translateX(-22px) rotate(-18deg)}100%{transform:translateX(-35px) rotate(-9deg);filter:grayscale(.25)}}@keyframes crash-spin{50%{transform:scale(1.25) rotate(25deg)}}@keyframes track-run{to{background-position:26px 0}}