/* Hyper Ring touch controls: opt-in only through mobile UA + touch + coarse primary pointer. */
#game .hyper-mobile,#mobileFullscreen{display:none!important}
.mobile-game #game .hyper-mobile{display:block!important;position:absolute;inset:0;z-index:35;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}
.mobile-game #mobileFullscreen{display:inline-flex!important;align-items:center;gap:5px;color:#d4fff1;border-color:#9fffe6aa}
#mobileFullscreen svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.hyper-directions{--pad:clamp(148px,39vh,224px);position:absolute;left:max(14px,env(safe-area-inset-left));bottom:max(15px,env(safe-area-inset-bottom));width:var(--pad);height:var(--pad);border:2px solid #a0ffe9bf;border-radius:50%;box-shadow:0 0 0 5px #88ffe333,inset 0 0 20px #54ffd229,0 0 14px #45e4c255;pointer-events:auto;background:#052e3226}
#game .hyper-mobile button{padding:0;min-width:0;touch-action:none;-webkit-touch-callout:none;color:#dcfff5;background:#073c3e70;border:1px solid #a7ffebba;box-shadow:inset 0 0 13px #66ffd52b,0 0 9px #7bffe535;pointer-events:auto;transition:background .08s,box-shadow .08s;user-select:none}
#game .hyper-mobile .ring-dir{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);border-radius:50%;margin:0;overflow:hidden}
.ring-dir.up{clip-path:polygon(50% 48%,0 0,100% 0)}.ring-dir.right{clip-path:polygon(52% 50%,100% 0,100% 100%)}.ring-dir.down{clip-path:polygon(50% 52%,100% 100%,0 100%)}.ring-dir.left{clip-path:polygon(48% 50%,0 100%,0 0)}
.ring-dir span{position:absolute;font-size:clamp(21px,5vh,30px);line-height:1;transform:translate(-50%,-50%)}.ring-dir.up span{left:50%;top:19%}.ring-dir.right span{left:81%;top:50%}.ring-dir.down span{left:50%;top:81%}.ring-dir.left span{left:19%;top:50%}
.ring-center{position:absolute;left:35%;top:35%;width:30%;height:30%;display:grid;place-items:center;border:1px solid #b7ffe4bb;border-radius:50%;background:#07504ba6;box-shadow:0 0 12px #77ffdc4d;pointer-events:none;color:#99ffe0;font-size:30px}
.hyper-actions{--actions:clamp(198px,53vh,286px);position:absolute;width:var(--actions);height:calc(var(--actions)*.86);right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));pointer-events:none}
#game .hyper-mobile .ring-action{position:absolute;width:34%;height:auto;aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;margin:0}
.ring-action svg{width:39%;height:39%;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.ring-action span{font-size:clamp(8px,2vh,11px);font-weight:700;letter-spacing:.3px;pointer-events:none}
#game .hyper-mobile .attack{right:0;bottom:0;width:46%;box-shadow:0 0 0 4px #a0ffdd33,0 0 15px #71ffce55,inset 0 0 12px #8effcd33}.attack svg{width:43%;height:43%}#game .hyper-mobile .jump{right:0;top:0;width:38%}#game .hyper-mobile .interact{left:12%;top:4%;width:32%}#game .hyper-mobile .dash{left:0;bottom:3%;width:35%}
#game .hyper-mobile .pressed{background:#249b8da8;box-shadow:inset 0 0 20px #c0fff688,0 0 18px #8bffe6b3}#game .hyper-mobile button:disabled{opacity:.3;filter:saturate(.3)}
.rotate-hint{display:none}.mobile-game #game{height:100vh;height:100dvh;touch-action:none}.mobile-game #world{touch-action:none}.mobile-game .game-hud{inset:max(8px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) auto max(10px,env(safe-area-inset-left));gap:8px;z-index:40}.mobile-game .playercard{min-width:145px;padding:5px;gap:6px}.mobile-game .playercard img{width:30px;height:30px}.mobile-game .playercard strong{font-size:10px}.mobile-game .playercard small{font-size:5px;margin:3px 0}.mobile-game .playercard>span{display:none}.mobile-game .energy{width:80px}.mobile-game .hudbuttons{max-width:260px;gap:4px}.mobile-game .hudbuttons button{padding:6px 7px;font-size:8px}.mobile-game .hudbuttons kbd{display:none}.mobile-game .regioncard,.mobile-game .game-bottom,.mobile-game .quest,.mobile-game #lessonTeaser{display:none}.mobile-game #interaction{bottom:50%;max-width:65%;white-space:normal;text-align:center;font-size:10px;padding:8px 12px}.mobile-game #toast{z-index:45;max-width:70%;font-size:10px;padding:9px 12px}.mobile-game #chatlog{bottom:auto!important;top:70px!important;max-width:42%;font-size:9px}.mobile-game #learningHUD,.mobile-game #halloweenHUD{top:70px;right:10px;max-width:210px;font-size:10px;padding:8px}.mobile-game .skyport-shuttle{display:none}.mobile-game #game.cinematic .hyper-mobile{display:none!important}
@media(orientation:portrait){.mobile-game .hyper-directions{--pad:154px}.mobile-game .hyper-actions{--actions:188px}.mobile-game .rotate-hint{display:block;position:absolute;bottom:215px;left:50%;transform:translateX(-50%);font-size:10px;white-space:nowrap;color:#caffeb;background:#052b2a99;padding:5px 9px;border-radius:5px}.mobile-game .hudbuttons{max-width:175px}.mobile-game #interaction{bottom:38%}}
@media(max-height:340px) and (orientation:landscape){.mobile-game .hyper-directions{--pad:130px}.mobile-game .hyper-actions{--actions:176px}.mobile-game #learningHUD,.mobile-game #halloweenHUD{max-width:170px;font-size:8px}.mobile-game .hudbuttons button{padding:4px 6px}}

.mobile-game #eliosHUD{display:none!important}.mobile-game #chatlog{display:none!important}.mobile-game #game:has(#chatForm:not([hidden])) #chatlog{display:block!important;max-height:80px;overflow:auto;top:70px!important}.mobile-game #halloweenHUD{font-size:9px!important;max-width:185px!important;line-height:1.4!important;padding:7px!important}.mobile-game #handsOnBadge{font-size:7px!important;padding:2px 6px!important;bottom:2px!important;left:50%!important;transform:translateX(-50%);white-space:nowrap;max-width:90%;overflow:hidden;text-overflow:ellipsis}.mobile-game #interaction kbd{font-size:9px}
@media(orientation:portrait){.mobile-game .hyper-directions{--pad:clamp(120px,37vw,154px)}.mobile-game .hyper-actions{--actions:clamp(148px,45vw,188px)}}
@media(orientation:portrait) and (max-width:380px){.mobile-game .playercard{min-width:126px}.mobile-game .hudbuttons{max-width:154px}.mobile-game .playercard strong{font-size:9px}.mobile-game .hudbuttons button{padding:5px;font-size:7px}}

.mobile-game #photoBtn{display:none!important}

/* Drawn Hyper Ring chevrons: no font glyphs or emoji rendering. */
.ring-dir span{display:grid;place-items:center;width:clamp(27px,6vh,37px);height:clamp(27px,6vh,37px);pointer-events:none}
.ring-dir .direction-icon{display:block;width:100%;height:100%;fill:currentColor;stroke:none;filter:drop-shadow(0 0 4px #9fffe780);pointer-events:none}
.ring-dir.right .direction-icon{transform:rotate(90deg)}.ring-dir.down .direction-icon{transform:rotate(180deg)}.ring-dir.left .direction-icon{transform:rotate(270deg)}
.ring-center svg{width:64%;height:64%;fill:currentColor;pointer-events:none;filter:drop-shadow(0 0 4px #8effd980)}.ring-center .center-inlay{fill:#105c55}

/* Desktop-first notice */
.desktop-notice{display:none}.mobile-game #selection .desktop-notice{display:block;padding:12px 14px;margin:12px 0;border:1px solid #c9aa6c88;border-radius:9px;background:#302b20;color:#f7e9c8;text-align:left}.desktop-notice strong{display:block;font-size:13px;line-height:1.4}.desktop-notice p{margin:5px 0 0;font-size:12px;line-height:1.55;color:#e5d7ba}
