.stage-root{color:var(--navy);font-family:var(--font-thai), system-ui, sans-serif;background:radial-gradient(at 50% 40%,#2a1640 0%,#120a1e 70%);position:fixed;top:0;bottom:0;left:0;right:0;overflow:hidden}.stage-root .stage-world{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.stage-root .stage-world canvas{width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}.stage-root .stage-canvas{image-rendering:pixelated}.stage-root .stage-labels{pointer-events:none}.stage-root .stage-pos{--neo:var(--coral);--neo-hi:var(--hud-hi);--neo-lo:var(--coral-dark);z-index:24;pointer-events:none;max-width:640px;margin:0 auto;display:grid;position:absolute;top:10px;left:410px;right:410px}.stage-root .stage-pos.gold{--neo:var(--gold);--neo-hi:#fff3c4;--neo-lo:#c58f12}.stage-root .stage-pos-tab{background:var(--neo);color:#fff;font-family:var(--font-pixel), monospace;text-shadow:2px 2px 0 var(--neo-lo);box-shadow:0 0 0 3px var(--hud-edge), 0 0 0 5px var(--neo-hi), 0 4px 0 5px var(--neo-lo);box-shadow:0 0 0 3px var(--hud-edge), 0 0 0 5px var(--neo-hi), 0 4px 0 5px var(--neo-lo), 0 0 22px 5px color-mix(in srgb, var(--neo) 55%, transparent);justify-self:start;align-items:center;gap:12px;margin-left:56px;padding:10px 14px 9px;font-size:13px;display:flex}.stage-root .stage-pos-tab b{font-weight:400;animation:2.4s step-end infinite stage-flick}.stage-root .stage-pips{gap:3px;display:flex}.stage-root .stage-pips i{background:var(--hud-edge);width:9px;height:9px;box-shadow:inset 0 0 0 1px #fff7}.stage-root .stage-pips i.on{background:var(--gold);box-shadow:0 0 0 1px #fff3c4}.stage-root .stage-pips i.now{animation:.8s step-end infinite stage-blink}.stage-root .stage-pips i.final:not(.on){box-shadow:inset 0 0 0 1px var(--gold)}.stage-root .stage-pos-row{align-items:stretch;margin-top:14px;display:flex}.stage-root .stage-pos-face{z-index:2;background:var(--cream);width:50px;height:50px;box-shadow:0 0 0 4px var(--neo), 0 0 0 6px var(--hud-edge);box-shadow:0 0 0 4px var(--neo), 0 0 0 6px var(--hud-edge), 0 0 0 9px color-mix(in srgb, var(--neo) 40%, transparent), 0 0 24px 6px color-mix(in srgb, var(--neo) 50%, transparent);flex:none;place-items:center;margin:-4px 0;display:grid}.stage-root .stage-pos-face canvas{width:40px;height:40px;image-rendering:pixelated}.stage-root .stage-pos-bar{background:var(--hud-track);background:repeating-linear-gradient(90deg, transparent 0 calc(10% - 2px), color-mix(in srgb, var(--neo) 30%, transparent) calc(10% - 2px) 10%), var(--hud-track);height:42px;box-shadow:0 0 0 4px var(--neo), 0 0 0 6px var(--hud-edge), inset 0 0 0 3px var(--hud-edge);box-shadow:0 0 0 4px var(--neo), 0 0 0 6px var(--hud-edge), 0 0 0 9px color-mix(in srgb, var(--neo) 45%, transparent), 0 0 0 12px color-mix(in srgb, var(--neo) 18%, transparent), 0 0 30px 8px color-mix(in srgb, var(--neo) 40%, transparent), inset 0 0 0 3px var(--hud-edge);flex:1;margin:0 12px 0 16px;position:relative}.stage-root .stage-pos-clip{position:absolute;top:3px;bottom:3px;left:3px;right:3px;overflow:hidden}.stage-root .stage-pos-fill{background:linear-gradient(#fff 0 3px, transparent 3px), linear-gradient(var(--neo-hi) 3px 9px, transparent 9px), repeating-linear-gradient(115deg, var(--neo) 0 10px, color-mix(in srgb, var(--neo) 65%, #fff) 10px 20px);box-shadow:inset 0 -7px 0 var(--neo-lo);background-size:100% 100%,100% 100%,40px 100%;transition:width .6s steps(12,end);animation:1s steps(8,end) infinite stage-flow;position:absolute;top:0;bottom:0;left:0}.stage-root .stage-pos.gold .stage-pos-fill{background-image:linear-gradient(#fff 0,#fff 3px,#0000 3px),linear-gradient(#fff3c4 3px,#fff3c4 9px,#0000 9px),repeating-linear-gradient(115deg,#ffd23f 0,#ffd23f 10px,#ffe27a 10px,#ffe27a 20px)}.stage-root .stage-pos-tip{width:8px;box-shadow:0 0 0 2px var(--neo-hi);background:#fff;transition:left .6s steps(12,end);animation:.5s step-end infinite stage-blink;position:absolute;top:0;bottom:0}.stage-root .stage-pos-chase{pointer-events:none;background:repeating-linear-gradient(90deg, var(--gold) 0 6px, transparent 6px 16px);background-size:16px 3px;height:3px;animation:.6s steps(4,end) infinite stage-chase;position:absolute;top:-18px;left:-4px;right:-4px}.stage-root .stage-pos-chase.b{background-image:repeating-linear-gradient(90deg, var(--neo-hi) 0 6px, transparent 6px 16px);animation-direction:reverse;top:auto;bottom:-18px}.stage-root .stage-pos-nums,.stage-root .stage-pos-sub,.stage-root .stage-pos-ends{font-family:var(--font-pixel), var(--font-thai-fit), var(--font-thai), monospace;color:var(--gold);text-shadow:1px 1px 0 var(--hud-edge), -1px 0 0 var(--hud-edge), 0 -1px 0 var(--hud-edge), 1px 0 0 var(--hud-edge), 0 1px 0 var(--hud-edge);font-size:9px}.stage-root .stage-pos-nums{z-index:3;color:#fff;text-shadow:2px 2px 0 var(--hud-edge), -2px 0 0 var(--hud-edge), 0 -2px 0 var(--hud-edge), 2px 0 0 var(--hud-edge), 0 2px 0 var(--hud-edge);justify-content:space-between;gap:8px;padding:0 12px;font-size:13px;display:flex;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.stage-root .stage-pos-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px;display:flex}.stage-root .stage-pos-sub{color:var(--neo-hi);text-align:right;margin:0 4px 4px 0}.stage-root .stage-pos-ends{color:var(--neo-hi);justify-content:space-between;margin:22px 12px 0 82px;font-size:8px;display:flex}.stage-root .stage-pos-fallback{display:none}.stage-root .stage-col-extra{display:block}@keyframes stage-flow{to{background-position:0 0,0 0,40px 0}}@keyframes stage-chase{to{background-position:16px 0}}@keyframes stage-blink{50%{opacity:0}}@keyframes stage-flick{0%,92%{opacity:1}93%,96%{opacity:.35}97%,to{opacity:1}}@media (prefers-reduced-motion:reduce){.stage-root .stage-pos *{animation:none!important}}.stage-root .stage-route-box{top:80px}.stage-root .stage-route-box .pxl-card{min-width:210px}.stage-root .stage-route{gap:2px;padding:4px 0 2px;display:grid}.stage-root .stage-route .r{justify-content:space-between;gap:10px;padding:2px 4px;font-size:11px;display:flex}.stage-root .stage-route .r b{font-family:var(--font-pixel), monospace;font-size:8px}.stage-root .stage-route .r.done{color:var(--navy-soft)}.stage-root .stage-route .r.done b:after{content:" ✓";color:#2f9e6b}.stage-root .stage-route .r.now{background:var(--gold)}.stage-root .stage-route .r.final b{color:var(--coral-dark)}.stage-root .stage-tray{max-width:calc(100vw - 1rem);bottom:0;left:50%;transform:translate(-50%)}.stage-root .stage-tray[data-open=false]{bottom:-180px}.stage-root .stage-grip{transition:bottom .45s cubic-bezier(.2,.9,.3,1);position:absolute;left:50%}.stage-root .item-art canvas{width:39px;height:41px;image-rendering:pixelated}.stage-root .item-left{color:#2f9e6b}.stage-root .stage-toast{z-index:40;white-space:nowrap;pointer-events:none;font-family:var(--font-pixel), monospace;background:var(--gold);color:var(--navy);box-shadow:0 0 0 4px var(--navy), 6px 6px 0 4px #00000059;padding:10px 16px;font-size:max(12px,min(2.2vw,22px));animation:1.7s steps(8,end) forwards stage-pop;position:absolute;top:150px;left:50%;transform:translate(-50%)}@keyframes stage-pop{0%{opacity:0;transform:translate(-50%,-30px)}12%{opacity:1;transform:translate(-50%)}80%{opacity:1}to{opacity:0}}.stage-root .stage-bit{z-index:39;pointer-events:none;width:8px;height:8px;animation:2s steps(16,end) forwards stage-fall;position:absolute;top:-10px}@keyframes stage-fall{to{transform:translateY(110vh)}}.stage-root .stage-overlay{z-index:50;background:#0a0512b3;place-items:center;padding:16px;display:grid;position:absolute;top:0;bottom:0;left:0;right:0}.stage-root .stage-overlay-card{gap:10px;width:min(680px,100%);max-height:calc(100vh - 32px);padding:14px;display:grid;overflow:auto}.stage-root .stage-all-canvas{width:100%;image-rendering:pixelated;background:#1a0f2a}.stage-root .stage-victory{text-align:center;background:var(--cream);max-width:540px;box-shadow:0 0 0 4px var(--navy), 0 0 0 8px var(--gold), 10px 10px 0 8px #00000059;gap:8px;padding:18px 22px;animation:.5s steps(5,end) stage-rise;display:grid}@keyframes stage-rise{0%{opacity:0;transform:translateY(30px)}}.stage-root .stage-victory .big{font-family:var(--font-pixel), monospace;color:var(--coral-dark);font-size:max(16px,min(3.4vw,28px));line-height:1.35}.stage-root .stage-victory p{margin:0}.stage-root .stage-victory .stats{flex-wrap:wrap;justify-content:center;gap:22px;display:flex}.stage-root .stage-victory .stats b{font-family:var(--font-pixel), monospace;margin-top:6px;font-size:14px;display:block}@media (max-width:1230px){.stage-root .stage-pos{right:16px}}@media (min-width:901px) and (max-width:1230px){.stage-root .stage-route-box{top:138px}}@media (max-width:900px){.stage-root .stage-col-extra{display:none}.stage-root .stage-pos-fallback{display:block}.stage-root .stage-pos{top:108px;left:12px;right:12px}}@media (max-width:700px){.stage-root .stage-total{top:54px}.stage-root .stage-total .pxl-pill{padding-inline-start:.5rem;padding-inline-end:.5rem;font-size:.5rem}.stage-root .stage-route-box{top:54px}.stage-root .stage-route-box .pxl-card{min-width:150px}.stage-root .stage-pos{top:100px}.stage-root .item-slot{width:76px}.stage-root .stage-pos-ends{display:none}.stage-root .stage-pos-tab{box-shadow:0 0 0 2px var(--hud-edge), 0 0 0 4px var(--neo-hi), 0 3px 0 4px var(--neo-lo);gap:8px;margin-left:36px;padding:6px 9px 5px;font-size:8px}.stage-root .stage-pips i{width:6px;height:6px}.stage-root .stage-pos-sub{margin:0 2px 4px 0;padding:0;font-size:7px}.stage-root .stage-pos-row{margin-top:10px}.stage-root .stage-pos-face{width:34px;height:34px;box-shadow:0 0 0 3px var(--neo), 0 0 0 5px var(--hud-edge);margin:-3px 0}.stage-root .stage-pos-face canvas{width:28px;height:28px}.stage-root .stage-pos-bar{height:24px;box-shadow:0 0 0 3px var(--neo), 0 0 0 5px var(--hud-edge), 0 0 0 7px color-mix(in srgb, var(--neo) 35%, transparent), inset 0 0 0 2px var(--hud-edge);margin:0 8px 0 12px}.stage-root .stage-pos-clip{top:2px;bottom:2px;left:2px;right:2px}.stage-root .stage-pos-fill{box-shadow:inset 0 -4px 0 var(--neo-lo)}.stage-root .stage-pos-tip{width:5px}.stage-root .stage-pos-chase{height:2px;top:-11px}.stage-root .stage-pos-chase.b{top:auto;bottom:-11px}.stage-root .stage-pos-nums{padding:0 8px;font-size:8px}.stage-root .stage-bottom{grid-template-columns:repeat(6,1fr);align-items:stretch;gap:8px;padding-bottom:58px;display:grid}.stage-root .stage-bottom>div,.stage-root .stage-bottom>div>div:not(.pxl-card),.stage-root .stage-bottom-right>div,.stage-root .stage-bottom-right>div>span{display:contents}.stage-root .stage-bottom .pxl-card{grid-column:1/-1;width:auto}.stage-root .stage-bottom .pxl-btn,.stage-root .stage-bottom .pxl-pill{box-sizing:border-box;text-align:center;white-space:nowrap;grid-column:span 2;justify-content:center;width:100%}.stage-root .stage-bottom .stage-wide{grid-column:span 3}.stage-root .stage-bottom .pxl-btn-sm{padding:.3rem .5rem;font-size:.6rem}.stage-root .stage-bottom .pxl-pill{font-size:.5rem}.stage-root .stage-bottom-right{align-items:flex-start;width:100%}.stage-root .stage-bottom-right>div{justify-content:flex-start!important}.stage-root .stage-total .pxl-pill{box-shadow:2px 2px 0 0 var(--navy);padding:.2rem .5rem;font-size:.45rem}.stage-root .pxl-btn.shop-cta{padding:.35rem .65rem;font-size:.5rem}.stage-root .stage-bottom-right span.pxl-btn.pointer-events-none{display:none}.stage-root .stage-roombar{top:calc(50% + 29vw + 8px);bottom:auto!important}}@media (prefers-reduced-motion:reduce){.stage-root .stage-toast,.stage-root .stage-bit,.stage-root .stage-victory{animation-duration:10ms}}.stage-root{--drop-banner-top:165px;--drop-card-top:132px}@media (max-width:1230px){.stage-root{--drop-banner-top:230px;--drop-card-top:190px}}@media (max-width:700px){.stage-root{--drop-banner-top:215px;--drop-card-top:150px}}
