/* Phone controls use input capability, with layout independent of orientation. */
.edge-control,.phone-preferences,.phone-instructions{display:none}
#navigation-menu{width:min(480px,94vw);max-height:90dvh;border-radius:10px;padding:20px}
#navigation-menu .menu-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
#navigation-menu .menu-heading{position:sticky;top:-20px;background:#142b30;z-index:2;padding:10px 0}
#navigation-menu h1{margin:0;font:30px Georgia}
#navigation-menu nav{display:grid;gap:12px}
#navigation-menu nav>button,#navigation-menu .phone-preferences>button{width:100%;text-align:left;min-height:46px}
#navigation-menu #directory{position:static}
#navigation-menu .menu-check{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.4}
#navigation-menu input[type=checkbox]{width:20px;height:20px;flex:none}
#navigation-menu select{width:100%;min-height:44px;background:#102328;color:#f7e6c2;border:1px solid #71877f;border-radius:4px;padding:10px;font:inherit}
#navigation-menu details{border-top:1px solid #48605d;padding-top:12px;line-height:1.6;font-size:14px}
#navigation-menu summary{cursor:pointer;padding:6px 0}
body[data-input="touch"]{--stick-size:87px;--knob-size:31.5px}
body[data-input="touch"] .world-nav{display:flex;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}
body[data-input="touch"] #open-atlas,body[data-input="touch"] .thumb-tools{display:none}
body[data-input="touch"] .move-cluster,body[data-input="touch"] .thumb-stick,body[data-input="touch"] .control-caption{display:flex}
body[data-input="touch"] .move-cluster,body[data-input="touch"] .action-cluster{bottom:calc(16px + env(safe-area-inset-bottom));gap:5px}
body[data-input="touch"] .move-cluster{left:calc(12px + env(safe-area-inset-left))}
body[data-input="touch"] .action-cluster{right:calc(12px + env(safe-area-inset-right))}
body[data-input="touch"] .thumb-stick{width:var(--stick-size);height:var(--stick-size);opacity:.7}
body[data-input="touch"] .thumb-stick.active{opacity:1}
body[data-input="touch"] .stick-knob{width:var(--knob-size);height:var(--knob-size);left:calc(50% - var(--knob-size)/2);top:calc(50% - var(--knob-size)/2)}
body[data-input="touch"] .control-caption{font-size:9px;opacity:.7}
body[data-input="touch"] #visit{width:132px;min-height:44px;font-size:11px;padding:9px}
body[data-input="touch"] #visit:disabled{display:none}
body[data-input="touch"] .control-help{display:none}
body[data-input="touch"] aside{left:calc(12px + env(safe-area-inset-left));bottom:calc(133px + env(safe-area-inset-bottom))}
body[data-input="touch"] #exit-shop{left:calc(12px + env(safe-area-inset-left));bottom:calc(178px + env(safe-area-inset-bottom));max-width:155px;font-size:11px}
body[data-input="touch"] #object-hint{top:calc(78px + env(safe-area-inset-top));bottom:auto;width:240px;font-size:11px}
body[data-input="touch"] .phone-preferences{display:grid;gap:12px}
body[data-input="touch"] .desktop-instructions{display:none}
body[data-input="touch"] .phone-instructions{display:block}
body[data-input="touch"].controls-docked .move-cluster,body[data-input="touch"].controls-docked .thumb-stick,body[data-input="touch"].controls-docked .control-caption{display:none}
body[data-input="touch"].controls-docked .edge-control{display:block;position:fixed;bottom:calc(34px + env(safe-area-inset-bottom));width:44px;min-height:62px;padding:8px 3px;font-size:10px;background:#183438a6;z-index:4;border-color:#a6b39688}
#restore-move{left:env(safe-area-inset-left);border-radius:0 8px 8px 0}
#restore-look{right:env(safe-area-inset-right);border-radius:8px 0 0 8px}
body[data-input="touch"].controls-docked .action-cluster{right:calc(58px + env(safe-area-inset-right));bottom:calc(34px + env(safe-area-inset-bottom))}
body[data-input="touch"].controls-docked #object-hint{display:none}
body[data-input="touch"].controls-docked aside{left:calc(56px + env(safe-area-inset-left));bottom:calc(10px + env(safe-area-inset-bottom))}
body[data-input="touch"].controls-docked #exit-shop{left:calc(56px + env(safe-area-inset-left));bottom:calc(42px + env(safe-area-inset-bottom));max-width:132px}
.in-window .edge-control{visibility:hidden}
@media(orientation:landscape){body[data-input="touch"]{--stick-size:82.5px}body[data-input="touch"] #object-hint{top:calc(56px + env(safe-area-inset-top))}body[data-input="touch"] aside{bottom:calc(125px + env(safe-area-inset-bottom))}body[data-input="touch"] #exit-shop{bottom:calc(162px + env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:no-preference){.thumb-stick{transition:opacity .2s}}