/* A touch-local HUD: no idle joystick, solid centre or screen-blocking hit area. */
#mobile-navigation{position:absolute;width:116px;height:116px;transform:translate(-50%,-50%);z-index:7;pointer-events:none;user-select:none;-webkit-user-select:none;color:#ffd06c;filter:drop-shadow(0 0 5px #eea62c55)}
#mobile-navigation[hidden]{display:none}
.mobile-touch-ring{position:relative;width:100%;height:100%;--dx:0px;--dy:0px;border-radius:50%;background:radial-gradient(circle,transparent 0 28%,#ffc65105 30% 58%,transparent 60%);animation:touch-ring-in .14s ease-out}
.touch-ring-orbit{position:absolute;inset:4px;border:1px solid #efb742a6;border-radius:50%;box-shadow:0 0 12px #ecae2426,inset 0 0 12px #ecae241c}
.touch-ring-orbit:before,.touch-ring-orbit:after{content:"";position:absolute;inset:6px;border:2px solid transparent;border-top-color:#ffd16e;border-bottom-color:#ffd16e;border-radius:50%;transform:rotate(35deg)}
.touch-ring-orbit:after{inset:17px;border-width:1px;border-top-color:#efb33c66;border-bottom-color:#efb33c66;transform:rotate(-30deg)}
.touch-ring-scale{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from 0deg,#ffc761bb 0deg 1deg,transparent 1deg 15deg);mask:radial-gradient(circle,transparent 67%,#000 68% 70%,transparent 71%);-webkit-mask:radial-gradient(circle,transparent 67%,#000 68% 70%,transparent 71%)}
.touch-ring-axis{position:absolute;opacity:.5}.touch-ring-axis.horizontal{left:13px;right:13px;top:57px;height:1px;background:linear-gradient(90deg,#ffc45c 0 18%,transparent 18% 82%,#ffc45c 82%)}.touch-ring-axis.vertical{top:13px;bottom:13px;left:57px;width:1px;background:linear-gradient(#ffc45c 0 18%,transparent 18% 82%,#ffc45c 82%)}
.touch-ring-tip{position:absolute;width:6px;height:6px;border-top:1.5px solid #ffdb91;border-left:1.5px solid #ffdb91}.touch-ring-tip.up{left:55px;top:0;transform:rotate(45deg)}.touch-ring-tip.right{right:0;top:55px;transform:rotate(135deg)}.touch-ring-tip.down{left:55px;bottom:0;transform:rotate(225deg)}.touch-ring-tip.left{left:0;top:55px;transform:rotate(-45deg)}
.touch-ring-vector{position:absolute;inset:40px;border:1px solid #ffd8886b;border-radius:50%;transform:translate(var(--dx),var(--dy));background:transparent;clip-path:polygon(0 0,35% 0,35% 18%,65% 18%,65% 0,100% 0,100% 100%,65% 100%,65% 82%,35% 82%,35% 100%,0 100%)}
.mobile-touch-ring.moving .touch-ring-vector{border-color:#ffe3a2;box-shadow:0 0 8px #ecad3044}.mobile-touch-ring.moving .touch-ring-orbit{border-color:#ffd888}
@keyframes touch-ring-in{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.mobile-touch-ring{animation:none}}

.mobile-nav-hint{display:none}@media(hover:none) and (pointer:coarse){.desktop-nav-hint{display:none}.mobile-nav-hint{display:inline}}