body.world{overflow:hidden;height:100vh;height:100dvh;padding:0;overscroll-behavior:none}
body.world::after{z-index:2}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0;touch-action:none;outline:none}
.hud{position:fixed;top:calc(.5rem + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:20;display:flex;flex-direction:column;align-items:center;gap:.2rem;font-size:.68rem;color:var(--dim);text-align:center;pointer-events:none;max-width:calc(100vw - 9rem)}
.hud a{pointer-events:auto;color:var(--signal);text-decoration:none;letter-spacing:.1em}
.demo{color:#000;background:#ffcc00;padding:.1rem .5rem;font-weight:700;letter-spacing:.1em}
.wpanel{position:fixed;top:calc(.5rem + env(safe-area-inset-top));left:calc(.5rem + env(safe-area-inset-left));z-index:30;width:min(300px,calc(100vw - 1rem));pointer-events:none}
.wpanel>*{pointer-events:auto}
.ptoggle{background:rgba(8,12,11,.9);border:1px solid var(--signal);color:var(--signal);padding:.55rem .8rem;border-radius:var(--r);cursor:pointer;font-size:.75rem;letter-spacing:.1em;min-height:44px}
.pbody{margin-top:.4rem;background:rgba(8,12,11,.92);border:1px solid var(--line);border-radius:var(--r);max-height:min(48vh,420px);display:flex;flex-direction:column}
.pbody[hidden]{display:none}
.ptabs{display:flex;flex-wrap:wrap;gap:.3rem;padding:.5rem;border-bottom:1px solid var(--line)}
.ptabs button{background:transparent;border:1px solid var(--line);color:var(--text);font-size:.66rem;padding:.35rem .5rem;border-radius:99px;cursor:pointer;min-height:32px}
.ptabs button[aria-selected=true]{background:var(--signal);color:#000;border-color:var(--signal)}
.ptracks{list-style:none;overflow:auto;padding:.3rem .5rem}
.ptracks li button{width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);color:var(--text);padding:.5rem .2rem;font-size:.72rem;cursor:pointer;min-height:40px}
.ptracks li button:disabled{color:var(--dim);cursor:not-allowed}
.ptracks li button.cur{color:var(--signal)}
.stick{position:fixed;z-index:25;width:92px;height:92px;border-radius:50%;border:1px solid rgba(0,255,157,.45);background:rgba(0,255,157,.06);display:none;touch-action:none;user-select:none;-webkit-user-select:none;bottom:calc(var(--player-h) + 1.2rem + env(safe-area-inset-bottom))}
.stick.left{left:calc(1rem + env(safe-area-inset-left))}.stick.right{right:calc(1rem + env(safe-area-inset-right))}
.stick .knob{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:rgba(0,255,157,.35);border:1px solid var(--signal);pointer-events:none}
.stick span{position:absolute;bottom:-1.2rem;left:0;right:0;text-align:center;font-size:.6rem;color:var(--dim);pointer-events:none}
body.touch .stick{display:block}
/* keep the YouTube mini-player (>=200x200, visible) out of the joysticks' way */
body.world .ytbox{top:calc(3.6rem + env(safe-area-inset-top));right:calc(.5rem + env(safe-area-inset-right));bottom:auto}
body.world .queue{bottom:calc(var(--player-h) + 1rem + env(safe-area-inset-bottom));right:.5rem}
body.world .player{z-index:40}
body.world footer{display:none}
@media (max-width:640px){body.world .ytbox{top:auto;bottom:calc(var(--player-h) + 150px + env(safe-area-inset-bottom));right:50%;transform:translateX(50%)}
.hud{left:auto;right:.5rem;transform:none;align-items:flex-end;max-width:55vw}.hud #hint{display:none}}
@media (max-width:640px){.pbody{max-height:calc(100dvh - 520px - env(safe-area-inset-bottom));min-height:140px}}
@media (max-width:640px){body.world .ytbox{bottom:calc(var(--player-h) + 120px + env(safe-area-inset-bottom))}}
/* Phase 1: minimap, approach card, credits */
#minimap{position:fixed;z-index:22;top:calc(.5rem + env(safe-area-inset-top));right:calc(.5rem + env(safe-area-inset-right));width:150px;height:150px;pointer-events:none;border-radius:4px;opacity:.92}
@media (min-width:641px){body.world.yt-on .ytbox{top:calc(150px + 1rem + env(safe-area-inset-top))}}
.wcard{position:fixed;left:0;top:0;z-index:21;pointer-events:none;background:rgba(3,12,9,.88);border:1px solid var(--signal);box-shadow:0 0 18px rgba(0,255,157,.35);padding:.45rem .7rem;border-radius:4px;display:flex;flex-direction:column;gap:.15rem;text-align:center;max-width:260px;font-size:.75rem;letter-spacing:.06em;animation:wglitch 3s infinite steps(1)}
.wcard[hidden]{display:none}.wcard b{font-size:.85rem}.wcard small{color:var(--text)}
@keyframes wglitch{0%,96%{clip-path:none}97%{clip-path:inset(20% 0 40% 0);transform-origin:center}98%{clip-path:inset(60% 0 5% 0)}}
.wcredits{position:fixed;z-index:5;left:.5rem;bottom:calc(var(--player-h) + .3rem + env(safe-area-inset-bottom));font-size:.55rem;color:var(--dim)}.wcredits a{color:var(--dim)}
body.touch .wcredits{font-size:.5rem;opacity:.8}
@media (max-width:640px){#minimap{width:96px;height:96px;top:calc(5.6rem + env(safe-area-inset-top))}.hud{max-width:calc(100vw - 7rem)}}
@media (prefers-reduced-motion:reduce){.wcard{animation:none}}
/* v32 jump map overlay */
#minimap{touch-action:manipulation}
#minimap:hover{box-shadow:0 0 12px rgba(0,255,157,.6)}
.wmap{position:fixed;inset:0;z-index:1000;background:#010605;touch-action:none;overscroll-behavior:contain;font-family:ui-monospace,monospace;color:#00ff9d;user-select:none;-webkit-user-select:none}
.wmap[hidden]{display:none}
.wmap-cv{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}
.wmap-top{position:absolute;left:0;right:0;top:0;padding:calc(.6rem + env(safe-area-inset-top)) 5rem .6rem 1rem;background:linear-gradient(#010605ee,#01060500);pointer-events:none;display:flex;flex-direction:column;gap:.2rem}
.wmap-title{font-size:.95rem;letter-spacing:.12em;text-shadow:0 0 8px #00ff9d}.wmap-hint{font-size:.7rem;color:#9dffd2;opacity:.8}
.wmap-close{position:absolute;top:calc(.6rem + env(safe-area-inset-top));right:calc(.6rem + env(safe-area-inset-right));width:56px;height:56px;border-radius:50%;border:2px solid #00ff9d;background:rgba(0,0,0,.75);color:#fff;font-size:28px;line-height:1;cursor:pointer;box-shadow:0 0 14px rgba(0,255,157,.55);z-index:2;display:grid;place-items:center;touch-action:manipulation}
.wmap-close:hover,.wmap-close:focus-visible{background:#00ff9d;color:#000;outline:none}
.wmap-jumps{position:absolute;left:0;right:0;bottom:0;display:flex;gap:.45rem;overflow-x:auto;padding:.6rem .8rem calc(.7rem + env(safe-area-inset-bottom));background:linear-gradient(#01060500,#010605f0 35%);touch-action:pan-x;scrollbar-width:thin}
.wmap-jumps button{flex:0 0 auto;min-height:44px;min-width:44px;padding:.5rem .9rem;border:1px solid #00ff9d;border-radius:6px;background:rgba(0,20,14,.85);color:#b9ffe0;font:600 .8rem ui-monospace,monospace;cursor:pointer;white-space:nowrap;touch-action:manipulation}
.wmap-jumps button:hover,.wmap-jumps button:focus-visible{background:#ffc84a;border-color:#ffc84a;color:#000;outline:none}
.wmap-credit{position:absolute;right:.6rem;bottom:calc(4.4rem + env(safe-area-inset-bottom));font-size:.6rem;color:#7fbfa5;pointer-events:none}
@media (min-width:900px){.wmap-jumps{left:auto;top:6rem;bottom:2rem;width:230px;flex-direction:column;overflow-y:auto;background:linear-gradient(90deg,#01060500,#010605e8 20%);touch-action:pan-y}.wmap-credit{bottom:.5rem;right:250px}}
.wfade{position:fixed;inset:0;z-index:1001;pointer-events:none;opacity:0;background:repeating-linear-gradient(0deg,rgba(0,255,157,.18) 0 2px,rgba(0,0,0,.92) 2px 5px)}
.wfade.on{animation:wglitch .55s steps(6) forwards}
@keyframes wglitch{0%{opacity:0;transform:translateX(0)}20%{opacity:1;transform:translateX(-8px)}45%{opacity:1;transform:translateX(6px) skewX(4deg)}70%{opacity:.7;transform:translateX(-3px)}100%{opacity:0;transform:none}}
@media (prefers-reduced-motion:reduce){.wfade.on{animation:wfade .4s forwards}@keyframes wfade{0%,100%{opacity:0}40%{opacity:1}}}
/* v73: day/night + weather chip sit BELOW the minimap so a plain minimap click always opens the jump map */
#wxhud{top:calc(env(safe-area-inset-top) + 10.5rem)!important}
@media (max-width:640px){#wxhud{top:calc(env(safe-area-inset-top) + 12.2rem)!important}}
/* v75: hint strip reads at a glance (M for jump map) */
#hint{font-size:.9rem;color:#e8fff4;background:rgba(0,14,10,.88)!important;border:1px solid #00ff9d88}
#hint b{color:#00ff9d}

/* v79 jumping overlay */
.wjump{position:fixed;left:50%;top:22%;transform:translate(-50%,-8px);z-index:2147483000;display:flex;align-items:center;gap:12px;padding:16px 30px;border:2px solid #00ff9d;border-radius:12px;background:#05080d;color:#fff;font:800 22px/1 system-ui,sans-serif;letter-spacing:.14em;box-shadow:0 0 0 4px rgba(0,0,0,.6),0 0 28px rgba(0,255,157,.55);pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s,transform .15s,visibility 0s .15s}
.wjump.on{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .1s,transform .1s}
.wjump-sp{width:18px;height:18px;border:3px solid rgba(0,255,157,.3);border-top-color:#00ff9d;border-radius:50%;animation:wjsp .7s linear infinite}
@keyframes wjsp{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.wjump-sp{animation:none}}

/* v113: CSS3D stage under transparent WebGL canvas */
body.viper-stage-on #scene{background:transparent!important}
#v87stage-css3d{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}