/* Play gestures must not become iOS selection, image dragging or callouts. */
.game-view,.game-view *,button,button *,.brand img,.loading img{
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
}
.game-view img,.brand img,.loading img{-webkit-user-drag:none}
.game-view{height:100dvh;min-height:0;overscroll-behavior:none}
#world,.joystick,#passage-go{touch-action:none}
.reader-section,.original-text,.translation-text{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}
.touch-controls{left:max(24px,env(safe-area-inset-left));bottom:max(48px,calc(env(safe-area-inset-bottom) + 28px));display:block;z-index:8}
.joystick{position:relative;width:112px;height:112px;cursor:grab;border-radius:50%;border:1px solid #e4d0a55c;background:radial-gradient(circle,#d5bd8420 0 39%,#102b307c 40% 66%,#d7bf7f24 67% 68%,#10262caa 69%);box-shadow:inset 0 0 20px #07171e75,0 5px 20px #0002;outline-offset:6px}
.joystick-track{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-around;font:24px var(--serif);color:#e4d5ad8c;pointer-events:none}
.joystick-track i{width:27px}
.joystick-thumb{position:absolute;left:50%;top:50%;width:42px;height:42px;border-radius:50%;border:1px solid #f2dfaaa1;background:radial-gradient(circle at 35% 30%,#e1c791,#9a8159);box-shadow:0 3px 12px #0007;transform:translate(calc(-50% + var(--stick-x,0px)),calc(-50% + var(--stick-y,0px)));pointer-events:none;transition:transform .12s ease-out}
.joystick.active{cursor:grabbing;border-color:#eadbb6ba}
.joystick.active .joystick-thumb{transition:none}
.game-header{padding-left:max(17px,env(safe-area-inset-left));padding-right:max(17px,env(safe-area-inset-right));padding-top:max(9px,env(safe-area-inset-top))}
.game-bottom{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}
.interact-button{right:max(24px,env(safe-area-inset-right));bottom:max(55px,calc(env(safe-area-inset-bottom) + 30px))}
@media(max-width:700px) and (orientation:portrait){.passage-controls,.wood-controls{bottom:205px}.world-caption{bottom:190px}}
@media(max-height:480px) and (orientation:landscape){
  .touch-controls{left:max(20px,env(safe-area-inset-left));bottom:max(35px,env(safe-area-inset-bottom))}
  .joystick{width:90px;height:90px}.joystick-thumb{width:34px;height:34px}
  .objective-card{left:max(17px,env(safe-area-inset-left))}
  .passage-controls,.wood-controls{width:min(470px,calc(100% - 256px));max-width:none;bottom:36px;padding:10px 12px}
  .passage-controls>p{font-size:14px}.passage-controls small{font-size:10px}
}
