/* Prevent long presses from selecting controls, while keeping reading text selectable. */
button,button *,#joystick,#knob,.bottom-ui{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.control-icon{display:none;width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.game-control .control-label{pointer-events:none}
/* One icon-based control layout for mouse, touch and keyboard. */
#worldApp{--stick-size:164px;--thumb-size:68px;--action-size:72px;--control-gap:12px}
#worldApp,#view{min-height:0}
.bottom-ui{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));gap:18px}
.movement{width:var(--stick-size);flex:none}
.dpad{display:block;width:var(--stick-size);height:var(--stick-size)}
.dpad [data-move]{display:none}
#joystick{width:100%;height:100%;border:3px solid #fbf4e4c9;background:radial-gradient(circle,#24495899 0 43%,#17394c80 44% 68%,#fbf4e422 69%);box-shadow:inset 0 3px 16px #102c4840,0 4px 14px #102c4826}
#knob{width:var(--thumb-size);height:var(--thumb-size);border:5px solid #fff6df;box-shadow:0 5px 0 #9b742a66,0 6px 14px #102c4855;background:radial-gradient(circle at 35% 30%,#ffe3a1,var(--gold) 70%)}
.look{display:grid;grid-template-columns:repeat(2,var(--action-size));gap:var(--control-gap);width:auto;min-width:0;flex:none;align-items:end}
.look .action-buttons{display:contents}
#view[data-travel=walk] #jetpackToggle{grid-column:2;grid-row:1}
#view[data-travel=walk] #runToggle{grid-column:1;grid-row:2}
#view[data-travel=walk] #jump{grid-column:2;grid-row:2}
#view[data-rover-riding=true] #runToggle{grid-column:2;grid-row:2}
.look #landRover{grid-column:2}
#view[data-travel=jetpack] #ascendRover{grid-column:1;grid-row:1}
#view[data-travel=jetpack] #descendRover{grid-column:2;grid-row:1}
#view[data-travel=jetpack] #runToggle{grid-column:1;grid-row:2}
#view[data-travel=jetpack] #landRover{grid-column:2;grid-row:2}
.bottom-ui .game-control{display:inline-grid;place-items:center;width:var(--action-size);height:var(--action-size);min-width:var(--action-size);min-height:var(--action-size);padding:0;margin:0;border-radius:22px;border-width:2px;touch-action:none;box-shadow:0 4px 0 #19374740}
.bottom-ui #ascendRover,.bottom-ui #descendRover{touch-action:none}
.bottom-ui .game-control .control-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.bottom-ui .control-icon{display:block;width:36px;height:36px}
.bottom-ui .game-control[aria-pressed=true],.bottom-ui .game-control.pressed{background:var(--gold);border-color:#95651d;box-shadow:inset 0 2px 3px #9b742a33}
.bottom-ui .game-control[aria-disabled=true]{opacity:.6}
.bottom-ui .interaction{position:absolute;left:0;right:0;bottom:calc(var(--stick-size) + 20px);display:flex;flex-direction:row;justify-content:center;gap:12px;padding:0;pointer-events:none}
.interaction .game-control{pointer-events:auto}
#controlsHint{display:none}
.bottom-ui>#resume{position:absolute;left:50%;bottom:0;transform:translateX(-50%);pointer-events:auto}
.bottom-ui>#resume:active{transform:translate(-50%,2px)}
@media(max-width:420px) and (orientation:portrait){.bottom-ui>#resume{bottom:calc(var(--action-size) + 18px)}}
#view[data-travel=flight] .interaction,#view[data-travel=drive] .interaction,#view[data-travel=jetpack] .interaction{bottom:calc(var(--stick-size) + 20px)}
@media(max-width:600px){
  #worldApp{--stick-size:148px;--thumb-size:64px;--action-size:66px;--control-gap:10px}
  .bottom-ui{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}
  .bottom-ui .game-control{border-radius:20px}
}
@media(max-width:360px){#worldApp{--stick-size:128px;--thumb-size:56px;--action-size:60px;--control-gap:8px}}
@media(max-height:570px) and (orientation:landscape){
  #worldApp{--stick-size:132px;--thumb-size:58px;--action-size:60px;--control-gap:8px}
  .bottom-ui{bottom:max(12px,env(safe-area-inset-bottom))}
  .bottom-ui .interaction{position:static;flex:1;width:auto;align-self:flex-end;pointer-events:none}
  .bottom-ui .game-control{border-radius:18px}
  .bottom-ui .control-icon{width:31px;height:31px}
  .speaking .expedition-hud{visibility:hidden}
}

/* Phone actions form a thumb cluster. The stick keeps its own pointer area. */
@media(max-width:600px),(max-width:1000px) and (max-height:570px) and (orientation:landscape){
  .bottom-ui{--action-rows:1}
  .bottom-ui .look{position:relative}
  #view .look #runToggle{grid-column:1;grid-row:1}
  #view .look #jump{grid-column:2;grid-row:1}
  #view[data-rover-riding=true] .look #runToggle{grid-column:2}
  #view[data-travel=jetpack] .bottom-ui{--action-rows:2}
  #view[data-travel=jetpack] .look #ascendRover{grid-column:1;grid-row:1}
  #view[data-travel=jetpack] .look #descendRover{grid-column:2;grid-row:1}
  #view[data-travel=jetpack] .look #runToggle{grid-column:1;grid-row:2}
  #view[data-travel=jetpack] .look #landRover{grid-column:2;grid-row:2}
  #view .look #jetpackToggle{position:absolute;right:0;bottom:calc(2 * (var(--action-size) + var(--control-gap)));margin:0}
  #view .bottom-ui .interaction{position:absolute;left:auto;right:calc(var(--action-size) + var(--control-gap));bottom:calc(var(--action-rows) * (var(--action-size) + var(--control-gap)));width:var(--action-size);display:flex;flex:none;flex-direction:column-reverse;gap:var(--control-gap);align-items:center;padding:0}
  #view .interaction .game-control{flex:none;width:var(--action-size);min-width:var(--action-size);margin:0;padding:0}
  #view .bottom-ui>#resume{left:auto;right:0;bottom:calc(var(--action-rows) * (var(--action-size) + var(--control-gap)));transform:none}
  #view .bottom-ui>#resume:active{transform:translateY(2px)}
}
