/* touch controls (stick + buttons) and small screens; loaded last so these rules win */
#touch{position:fixed;inset:0;pointer-events:none}
#stick{position:absolute;left:calc(20px + env(safe-area-inset-left,0px));bottom:calc(120px + env(safe-area-inset-bottom,0px));width:130px;height:130px;border-radius:50%;border:3px solid var(--steel-lo);background:rgba(13,26,12,.45);pointer-events:auto}
#knob{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;border-radius:50%}
#tbtns{position:absolute;right:calc(14px + env(safe-area-inset-right,0px));bottom:calc(120px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:repeat(3,64px);gap:10px;pointer-events:auto}
#tbtns div{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--f-head);font-size:10px;color:var(--ink)}
#tbtns div.on{filter:brightness(1.4)}
body.touchmode #tbtns{bottom:calc(212px + env(safe-area-inset-bottom,0px))} /* above the radar */
@media (max-width:760px),(max-height:520px){
  #hTop{padding-left:150px;padding-right:200px;font-size:11px}#hXp{flex-basis:120px}
  #hMid{gap:16px;font-size:11px;top:calc(32px + env(safe-area-inset-top,0px))}
  #wPanel{transform:scale(.62);transform-origin:0 0}
  #wbar{padding:5px 16px;border-image-width:0 18px}#hud{--slot:clamp(26px,calc((100vw - 420px) / 9),40px)}#radar{width:124px;height:124px}.slot .a{font-size:9px}
  #gauge{transform:scale(.62);transform-origin:100% 0}
  #log{height:58px;font-size:10px;left:4px;width:calc(50vw - var(--slot) * 4.5 - 48px)}
  body.touchmode #stick,body.touchmode #tbtns{bottom:calc(80px + env(safe-area-inset-bottom,0px))}
  body.touchmode #tbtns{bottom:calc(136px + env(safe-area-inset-bottom,0px))}
  body.touchmode #stick{left:calc(76px + env(safe-area-inset-left,0px))}
  .key{min-width:40px;height:40px;font-size:15px}.key.w{min-width:100px}.key.c{min-width:60px}.arrows{grid-template-columns:repeat(3,40px)}
  .kgrid{gap:8px 12px}#ctrlHelp{padding:16px}#ctrlHelp h3{font-size:18px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}