:root{--ink: #120a30;--gold: #ffd23a;--gold-d: #c8861a;--cyan: #5ae8f0;--pink: #ff4a9a;--green: #5fe068;--edge: #55639a;--glass: rgba(8, 12, 36, .8);--font: "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Meiryo", "Segoe UI", system-ui, sans-serif;--num: "Arial Rounded MT Bold", "Arial Black", "Segoe UI Black", Impact, "Helvetica Neue", sans-serif;--mono: Consolas, "SF Mono", Menlo, "Courier New", monospace}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}html,body{margin:0;height:100%;overflow:hidden;background:#0b0620;font-family:var(--font);font-weight:800;color:#fff;overscroll-behavior:none}#app{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;touch-action:none}#game{display:block;image-rendering:crisp-edges;image-rendering:pixelated}#ui{position:absolute;inset:0;pointer-events:none}.hidden{display:none!important}button{font-family:inherit;pointer-events:auto;cursor:pointer;color:inherit}.mono{font-family:var(--mono);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.5px}.num{font-family:var(--num)}.logo,h2,.btn,.stagename,.posbig,#count,#banner,.newbest{-webkit-text-stroke:6px var(--ink);paint-order:stroke fill}.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:calc(14px + env(safe-area-inset-top)) 16px calc(14px + env(safe-area-inset-bottom));text-align:center}.screen.dim{background:radial-gradient(#1e0e4699,#060316e0);pointer-events:auto;overflow-y:auto}#title{justify-content:space-between;background:linear-gradient(#08041e8c,#08041e0d 38%,#08041e99)}#title .center{display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:3vh}.topbar{width:100%;max-width:560px;display:flex;justify-content:space-between;align-items:center}.langs{display:flex;gap:8px}.chip{border:2px solid var(--edge);background:var(--glass);color:#cfd8ff;font-size:15px;padding:8px 14px;border-radius:10px;box-shadow:inset 0 2px #ffffff1f}.chip.on{background:linear-gradient(#fff08a,var(--gold));border-color:var(--ink);color:var(--ink)}.icon{width:44px;height:44px;display:grid;place-items:center;border:2px solid var(--edge);border-radius:12px;background:var(--glass);color:#e8eeff;padding:0;box-shadow:inset 0 2px #ffffff1f}.icon.sm{width:34px;height:34px;border-radius:8px}.icon svg{width:22px;height:22px}.icon.sm svg{width:18px;height:18px}.icon.off{color:#7a82a8}.icon:active,.chip:active{transform:translateY(2px)}.logo{margin:0;font-family:var(--num);font-style:italic;font-size:clamp(48px,13vw,100px);line-height:1.1;text-align:center;text-wrap:balance;letter-spacing:2px;color:#fff;-webkit-text-stroke:9px var(--ink);paint-order:stroke fill;text-shadow:0 4px 0 #ff3a9a;filter:drop-shadow(0 0 10px rgba(90,240,255,.9)) drop-shadow(0 6px 0 rgba(0,0,0,.5));transform:skew(-6deg)}.logo.ja{font-family:var(--font);font-weight:900;font-size:clamp(40px,11vw,80px);-webkit-text-stroke:12px var(--ink)}.tag,.hint,.stats{margin:0;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;font-weight:800}.tag{font-size:clamp(15px,3.8vw,21px)}.hint{font-size:14px;opacity:.95}.stats{font-size:12px;opacity:.75;padding-bottom:4px}.panel{background:var(--glass);border:2px solid var(--edge);border-radius:14px;box-shadow:0 6px #00000059,inset 0 2px #ffffff24,inset 0 0 24px #5ae8f014}.coursesel{display:flex;align-items:center;gap:12px;padding:12px 14px}.coursebox{min-width:190px;display:flex;flex-direction:column;align-items:center;gap:4px}.stagename{font-family:var(--num);font-size:28px;font-style:italic;color:#fff}.coursemeta{font-family:var(--mono);font-size:13px;letter-spacing:3px;color:var(--cyan)}.bestline{font-size:12px;color:#cfd8ff}.bestline b{color:var(--gold);font-size:15px;margin-left:6px}.arrow{width:40px;height:52px;border:2px solid var(--edge);border-radius:10px;background:#ffffff14;position:relative;padding:0}.arrow:after{content:"";position:absolute;top:50%;left:50%;border:9px solid transparent;transform:translate(-50%,-50%)}.arrow.left:after{border-right:12px solid #e8eeff;margin-left:-4px}.arrow.right:after{border-left:12px solid #e8eeff;margin-left:4px}.arrow.dis{opacity:.25;pointer-events:none}.starsrow{display:flex;gap:4px;height:24px;justify-content:center}.starsrow.big{height:58px;gap:8px}.star{width:24px;height:24px;fill:#3a3a64;stroke:var(--ink);stroke-width:1.4}.big .star{width:58px;height:58px}.star.on{fill:var(--gold)}.big .star.on{animation:starpop .5s cubic-bezier(.2,1.6,.4,1) both;animation-delay:calc(var(--i) * .22s + .4s)}.big .star:not(.on){opacity:.55}.btn{position:relative;overflow:hidden;min-width:200px;padding:12px 26px;border:4px solid var(--ink);border-radius:16px;background:linear-gradient(#fff08a 0,#ffd23a 48%,#ffb82e 52%,#ffc93a);color:#fff;font-weight:900;font-size:22px;letter-spacing:1px;box-shadow:0 6px 0 var(--gold-d),0 6px 0 4px var(--ink);margin-bottom:8px}.btn:after{content:"";position:absolute;left:8%;right:8%;top:6%;height:34%;border-radius:999px;background:#ffffff73;pointer-events:none}.btn:active{transform:translateY(4px);box-shadow:0 2px 0 var(--gold-d),0 2px 0 4px var(--ink)}.btn.big{font-size:30px;padding:16px 44px;min-width:250px}.btn.ghost{background:#ffffffeb;color:var(--ink);-webkit-text-stroke:0;box-shadow:0 4px #8a86b0,0 4px 0 4px var(--ink);font-size:16px;padding:8px 18px;min-width:140px}.btn.ghost:after{display:none}.btn.pulse{animation:pulse 1.1s ease-in-out infinite}#r-secondary,#p-restart{background:linear-gradient(#c8f6ff 0,#6ae8f0 48%,#3ad0e0 52%,#5ae0ec);box-shadow:0 6px #1a98a8,0 6px 0 4px var(--ink)}#hud{position:absolute;inset:0;pointer-events:none}#hud:before{content:"";position:absolute;inset:0 0 auto;height:120px;background:linear-gradient(#060318b3,#06031800)}.topstrip{position:absolute;top:env(safe-area-inset-top);left:0;right:0;display:flex;align-items:center;gap:18px;padding:8px 12px}.tcell{display:flex;align-items:baseline;gap:8px}.tcell .lab{font-family:var(--mono);font-size:11px;color:var(--cyan);letter-spacing:1px}.tcell b{font-size:19px;color:#fff;text-shadow:0 2px 0 var(--ink),0 0 8px rgba(255,255,255,.25)}.tcell.hi b{color:var(--gold)}.tcell.hi .lab{color:#ffe58a}.tcell.right{margin-left:auto}.tcell.right b{font-family:var(--mono);font-size:13px;letter-spacing:1.5px;color:#dfe6ff}.hud-btns{display:flex;gap:6px}.track{position:absolute;top:calc(env(safe-area-inset-top) + 50px);left:14px;right:14px;height:14px}.trackline{position:absolute;left:0;right:0;top:6px;height:3px;background:#ffffff59;border-radius:2px}#dots i{position:absolute;top:3px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#aab4e8;border:1px solid var(--ink)}#dots i.me{top:0;width:14px;height:14px;margin-left:-7px;background:var(--gold);box-shadow:0 0 8px var(--gold);z-index:2}.posbig{position:absolute;left:14px;top:calc(env(safe-area-inset-top) + 74px);display:flex;align-items:baseline;gap:2px;font-style:italic;line-height:1;color:#fff}.posbig b{font-size:64px}.posbig span{font-size:26px}.posbig i{font-size:22px;margin-left:4px;opacity:.85}.posbig[data-rank="1"]{color:#ffe45a}.posbig[data-rank="2"]{color:#e6ecff}.posbig[data-rank="3"]{color:#ffb070}.posbig.pop{animation:pop .25s ease-out}#count{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);font-family:var(--num);font-style:italic;font-size:clamp(90px,24vw,170px);color:#fff;-webkit-text-stroke:12px var(--ink);filter:drop-shadow(0 0 16px rgba(90,232,240,.8))}#count.go{color:var(--gold)}#count.tick{animation:tick .9s ease-out both}#banner{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%) scale(.5);font-family:var(--num);font-style:italic;font-size:clamp(34px,9vw,60px);color:var(--gold);white-space:nowrap;opacity:0}#banner.show{animation:banner 1.5s ease-out both}.cutin{--c1: #2a1a8a;--c2: #7a2fe0;--c3: #ff3a9a;position:absolute;left:0;right:0;top:14%;height:clamp(110px,22vh,190px);pointer-events:none;opacity:0;overflow:hidden}.cutin[data-kind=shock]{--c1: #6a0a1a;--c2: #d82a3a;--c3: #ff8a2a}.cutin[data-kind=grit]{--c1: #0a4a7a;--c2: #2a9ae0;--c3: #5af0ff}.cutin.show{animation:ci-all 1.4s linear both}.ci-band{position:absolute;inset:12% -10%;transform:skewY(-4deg);overflow:hidden;background:radial-gradient(ellipse at 50% 50%,#fff 0,var(--c3) 12%,transparent 55%),linear-gradient(90deg,var(--c1),var(--c2) 50%,var(--c1));border-top:3px solid #fff;border-bottom:3px solid #fff;box-shadow:0 0 22px var(--c2)}.ci-band:before{content:"";position:absolute;inset:-80%;background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,255,255,.55) 0 1.1deg,transparent 1.1deg 5.5deg);-webkit-mask-image:radial-gradient(circle,transparent 10%,#000 45%);mask-image:radial-gradient(circle,transparent 10%,#000 45%);animation:ci-rays .3s linear infinite}.ci-band:after{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,transparent,#fff,transparent),linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent),linear-gradient(90deg,transparent,#fff,transparent),linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent),linear-gradient(90deg,transparent,#fff,transparent);background-repeat:repeat-x;background-size:190px 3px,130px 2px,250px 3px,90px 2px,160px 4px;background-position:0 14%,0 32%,0 52%,0 70%,0 88%;animation:ci-streak .22s linear infinite}.ci-stage{position:absolute;top:0;bottom:0;left:50%;width:min(100%,480px);transform:translate(-50%)}.ci-face{position:absolute;left:2%;bottom:0;height:104%;width:auto;max-width:38%;object-fit:contain;filter:drop-shadow(0 0 8px rgba(0,0,0,.6));animation:ci-face 1.4s ease-out both}.ci-mach{position:absolute;right:2%;bottom:12%;height:46%;width:auto;filter:drop-shadow(0 0 10px rgba(255,255,255,.8));animation:ci-mach 1.4s cubic-bezier(.2,.7,.2,1) both}.ci-text{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) skew(-8deg);font-family:var(--font);font-weight:900;font-size:clamp(26px,7.4vw,50px);color:#fff;white-space:nowrap;-webkit-text-stroke:8px var(--ink);paint-order:stroke fill;animation:ci-text 1.4s ease-out both}@keyframes ci-all{0%{opacity:0;clip-path:inset(40% 0 40% 0)}10%{opacity:1;clip-path:inset(0 0 0 0)}82%{opacity:1}to{opacity:0}}@keyframes ci-rays{0%{transform:scale(1)}to{transform:scale(1.5)}}@keyframes ci-streak{0%{background-position:0 14%,0 32%,0 52%,0 70%,0 88%}to{background-position:-190px 14%,-130px 32%,-250px 52%,-90px 70%,-160px 88%}}@keyframes ci-face{0%{transform:translate(-60%)}14%{transform:translate(0)}to{transform:translate(4%)}}@keyframes ci-mach{0%{transform:translate(70%) scale(.8)}18%{transform:translate(0) scale(1)}to{transform:translate(-6%) scale(1.08)}}@keyframes ci-text{0%{transform:translate(-50%,-50%) skew(-8deg) scale(2.2);opacity:0}16%{transform:translate(-50%,-50%) skew(-8deg) scale(1);opacity:1}to{transform:translate(-50%,-50%) skew(-8deg) scale(1.1);opacity:1}}@media(prefers-reduced-motion:reduce){.ci-face,.ci-mach,.ci-text,.ci-band:before,.ci-band:after{animation:none}}.dock{position:absolute;left:0;right:0;bottom:0;display:flex;gap:4px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:linear-gradient(#06031800,#060318d9 40%)}.cell{flex:1 1 0;min-width:0;padding:5px 8px 6px;background:var(--glass);border:2px solid var(--edge);border-radius:6px;box-shadow:inset 0 2px #ffffff1f,inset 0 0 14px #5ae8f014;display:flex;flex-direction:column;gap:2px}.cell.wide{flex:2 1 0}.cell .lab{font-family:var(--mono);font-size:10px;letter-spacing:1px;color:var(--cyan)}.cell b{font-size:20px;line-height:1.1;color:#fff;white-space:nowrap}.cell b small{font-size:10px;color:#aab4e8}.gauge{height:5px;background:#ffffff26;border-radius:3px;overflow:hidden}#g-speed{height:100%;width:0;background:linear-gradient(90deg,#5ae8f0,#fff)}#g-speed.boost{background:linear-gradient(90deg,#fff45a,#ff8a2a)}.segs{display:flex;gap:2px;height:22px;align-items:stretch}.segs i{flex:1;background:#ffffff1a;border-radius:1px}.segs i.on{background:linear-gradient(#a0ffb0,#3fcf5a);box-shadow:0 0 4px #5fe06899}.segs i.on.pit{background:linear-gradient(#e8fff0,#7affb0)}.segs i.on.low{background:linear-gradient(#ffb0b0,#ff3a4a);animation:blink .5s steps(2) infinite}.cell.low .lab{color:#ff8a8a}h2{margin:0;font-family:var(--num);font-style:italic;font-size:clamp(36px,9vw,62px);color:var(--pink);animation:pop .4s ease-out}#result.win h2{color:var(--gold)}.reason{margin:0;max-width:320px;font-size:15px;min-height:20px;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill}.table{width:min(92vw,380px);padding:6px 10px}.trow{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:3px 6px;font-size:14px;border-radius:4px}.trow+.trow{border-top:1px solid rgba(255,255,255,.08)}.trow .rk{font-family:var(--num);color:#aab4e8;text-align:center}.trow .nm{text-align:left;letter-spacing:1px}.trow .tm{font-size:13px;color:#dfe6ff}.trow.me{background:linear-gradient(90deg,#ffd23a59,#ffd23a1a);color:var(--gold)}.trow.me .rk{color:var(--gold)}.rows{width:min(92vw,380px);padding:8px 18px}.rows div{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;font-size:14px;color:#cfd8ff}.rows div+div{border-top:1px dashed rgba(255,255,255,.18)}.rows b{font-size:20px;color:var(--gold)}.newbest{min-height:24px;font-family:var(--num);font-size:20px;color:var(--green);animation:pulse .9s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.06)}}@keyframes pop{0%{transform:scale(1.4)}to{transform:scale(1)}}@keyframes starpop{0%{transform:scale(0) rotate(-90deg)}to{transform:scale(1) rotate(0)}}@keyframes tick{0%{opacity:0;transform:translate(-50%,-50%) scale(2)}20%{opacity:1;transform:translate(-50%,-50%) scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-50%) scale(.85)}}@keyframes banner{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}15%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}25%{transform:translate(-50%,-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-70%) scale(1)}}@keyframes blink{50%{opacity:.35}}@media(max-width:480px){.dock{flex-wrap:wrap}.cell{flex:1 1 22%}.cell.wide{flex:1 1 44%}.tcell b{font-size:16px}.tcell.right{display:none}.topstrip{gap:10px}.hud-btns{margin-left:auto}}@media(max-height:520px){.screen{gap:6px}.btn.big{padding:10px 30px;font-size:24px}.logo,.posbig b{font-size:44px}}@media(prefers-reduced-motion:reduce){.logo,.btn.pulse,.newbest{animation:none}}.tcell .lab,.tcell b{white-space:nowrap}@media(max-width:480px){.tcell .lab{font-size:9px}.tcell{gap:4px}}.bottom{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:stretch;pointer-events:none}.bottom .dock{position:relative}.itemcol{display:flex;justify-content:center;align-items:center;gap:8px;padding:6px 8px 2px;min-height:62px;pointer-events:none}.slot{width:44px;height:44px;border-radius:50%;border:3px solid #3a4470;background:#080c24b3;color:#8a93b8;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;cursor:pointer;pointer-events:auto;touch-action:none;filter:grayscale(1);opacity:.7;transition:transform .15s,opacity .15s}.slot .ico{width:24px;height:24px;display:block}.slot .ico svg{width:100%;height:100%}.slot .key{font-family:var(--mono);font-size:9px;line-height:1;white-space:nowrap;display:none}.slot.on{filter:none;opacity:1;transform:scale(1.25);margin:0 8px;background:var(--glass);box-shadow:inset 0 2px #ffffff24,0 0 14px currentColor;animation:itemgot .45s cubic-bezier(.2,1.6,.4,1)}.slot.on .key{display:block;color:#fff;margin-top:1px}.slot.on .ico{width:26px;height:26px}.slot.on[data-kind=turbo]{color:#ffe23a;border-color:#ffe23a}.slot.on[data-kind=missile]{color:#ff6a5a;border-color:#ff6a5a}.slot.on[data-kind=mine]{color:#ffa63a;border-color:#ffa63a}.slot.on[data-kind=shield]{color:#5ae8f0;border-color:#5ae8f0}.slot.on[data-kind=giant]{color:#b377ff;border-color:#b377ff}.slot.on[data-kind=rocket]{color:#ff5aa0;border-color:#ff5aa0}.slot.on[data-kind=duck]{color:#ffe86a;border-color:#ffe86a}.slot.on[data-kind=disco]{color:#5fe068;border-color:#5fe068}.slot.guard{filter:none;opacity:1;color:#5ae8f0;border-color:#5ae8f0;outline:3px solid rgba(90,232,240,.55);outline-offset:3px}@keyframes itemgot{0%{transform:scale(.6) rotate(-25deg)}to{transform:scale(1.25) rotate(0)}}@media(max-width:480px){.itemcol{gap:5px;min-height:54px;padding:4px 6px 0}.slot{width:34px;height:34px;border-width:2px}.slot .ico{width:18px;height:18px}.slot.on{margin:0 6px;transform:scale(1.25)}.slot.on .ico{width:20px;height:20px}}@media(max-height:520px){.itemcol{min-height:48px}.slot{width:32px;height:32px}}.screen.dim{justify-content:flex-start}.screen.dim>:first-child{margin-top:auto}.screen.dim>:last-child{margin-bottom:auto}@media(max-height:560px)and (min-aspect-ratio:1/1){#result{display:grid;grid-template-columns:auto auto;justify-content:center;align-content:center;justify-items:center;column-gap:20px;row-gap:4px}#result>*{grid-column:2;margin:0}#result #r-table{grid-column:1;grid-row:1 / span 8;align-self:center;width:min(44vw,320px)}#result h2{font-size:26px}#result .starsrow.big{height:34px}#result .big .star{width:34px;height:34px}#result .reason{font-size:13px;min-height:0}#result .rows{width:min(44vw,300px);padding:4px 14px}#result .rows div{padding:2px 0}#result .newbest{min-height:0;font-size:16px}#result .btn{min-width:200px;padding:6px 20px;font-size:17px}#result .btn.big{padding:8px 24px;font-size:22px}#result .btn.ghost{min-width:140px;padding:4px 14px;font-size:13px}#result .trow{padding:1px 6px;font-size:12px}}
