/* Scoped to touch input / phone-sized screens. Desktop rules are preserved. */
.touch-only{display:none!important}
body.touch-ui .touch-only{display:inline-flex!important;align-items:center;justify-content:center}
body.touch-ui .home-hub{padding:12px max(12px,env(safe-area-inset-right)) 24px max(12px,env(safe-area-inset-left))}
body.touch-ui .hh-header{position:sticky;top:0;z-index:30;background:#0d1c2ef5;backdrop-filter:blur(14px);padding:10px 0;gap:8px}
body.touch-ui .hh-header nav{margin-left:auto;gap:4px}
body.touch-ui .hh-header nav button{font-size:14px;min-height:44px;padding:8px 12px}
body.touch-ui .hh-profile{display:none}
body.touch-ui .hh-layout{display:flex;flex-direction:column;gap:18px}
body.touch-ui .hh-main{order:0}body.touch-ui .hh-standings-slot{order:1}
body.touch-ui .hh-welcome{margin:16px 2px}body.touch-ui .hh-orbit-note{display:none}
body.touch-ui .hh-panel-head{padding:9px 12px;gap:8px;flex-wrap:wrap}
body.touch-ui .hh-panel-head>div{flex:1;gap:7px}
body.touch-ui .hh-panel-head button{min-height:44px;font-size:14px}
body.touch-ui .hh-panel-head #hhExpand span{display:inline}
body.touch-ui .hh-panel-head .touch-modes{display:none!important}
body.touch-ui.home-lobby-expanded .hh-panel-head .touch-modes{display:inline-flex!important}
body.touch-ui .home-hub #starport{height:clamp(440px,65svh,620px);min-height:0}
body.touch-ui.home-lobby-expanded .home-hub #starport{height:100%;min-height:0}
body.touch-ui.home-lobby-expanded .hh-panel-head{padding-top:max(8px,env(safe-area-inset-top))}
body.touch-ui.home-lobby-expanded .hh-crew{padding-bottom:max(8px,env(safe-area-inset-bottom))}
body.touch-ui .home-hub #starport .sp-park-hud{top:12px;left:12px;width:110px}
body.touch-ui .home-hub #starport:has(#spChatPeek:not([hidden])) .sp-park-hud{top:12px;left:12px}
body.touch-ui .home-hub #starport .sp-park-hud :is(h2,p,small,.sp-eyebrow){display:none}
body.touch-ui .home-hub #starport .sp-hunt{font-size:12px;line-height:1.5;margin:0;max-width:95px;padding:7px 9px;border-radius:12px;background:#0d2538c9}
body.touch-ui .home-hub #starport .sp-header{display:none}
body.touch-ui #starport #spChatPeek{top:12px;right:12px;width:196px;max-width:calc(100% - 132px);padding:9px 11px;border-radius:13px}
body.touch-ui #starport .sp-peek-head{font-size:13px;gap:5px}
body.touch-ui #starport .sp-peek-head>span{font-size:12px;padding:2px 5px}
body.touch-ui #starport .sp-peek-message{-webkit-line-clamp:1;font-size:12px;margin-top:4px}
body.touch-ui #starport .sp-peek-open{display:none}
body.touch-ui .home-hub #starport .sp-joystick.sp-analog{width:96px;height:96px;left:14px;bottom:88px}
body.touch-ui .home-hub #starport .sp-stick-thumb{width:42px;height:42px}
body.touch-ui .home-hub #starport .sp-pad-hint{top:-22px;font-size:12px}
body.touch-ui .home-hub #starport .sp-interact,body.touch-ui .home-hub #starport #spExitLook{position:absolute;left:auto;right:14px;bottom:104px;transform:none;width:auto;max-width:calc(100% - 142px);min-height:48px;padding:12px 16px;border:1px solid #c8ffec;border-radius:16px;background:#bdeedc;color:#123944;font-size:15px;font-weight:900;line-height:1.35;z-index:8;box-shadow:0 4px 20px #0004;white-space:normal}
body.touch-ui #starport #spExitLook[hidden]{display:none!important}
body.touch-ui .home-hub #starport .sp-tools{left:12px;right:12px;bottom:12px;display:flex;gap:7px;justify-content:space-between}
body.touch-ui .home-hub #starport .sp-tools>button{flex:1;min-height:52px;height:auto;padding:9px 6px;font-size:13px;line-height:1.25}
body.touch-ui .home-hub #starport .sp-tools>button span{display:inline;font-size:18px;margin-right:4px}
body.touch-ui .home-hub #starport .sp-tools>.sp-golden-smash{flex:none;width:160px;min-height:46px;font-size:12px;padding:10px 8px;bottom:calc(100% + 8px)}
body.touch-ui .home-hub #starport .sp-roam-bar{display:none}
body.touch-ui .home-hub #starport .sp-route{top:88px;left:12px;right:12px;transform:none;max-width:none;padding:7px 9px;font-size:13px;min-height:44px}
body.touch-ui #starport .sp-route button{width:44px;height:44px;flex-shrink:0}
body.touch-ui #starport .sp-place-label{font-size:12px;padding:5px 9px;max-width:150px;white-space:normal;text-align:center}
body.touch-ui #starport .sp-bubble{font-size:13px;max-width:165px;padding:8px 10px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* Deliberately opened sheets stay within the visible viewport, including the keyboard. */
body.touch-ui .home-hub #starport .sp-popover,body.touch-ui .home-hub #starport #spChat{position:fixed;inset:auto 12px max(12px,env(safe-area-inset-bottom)) auto;width:min(420px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(var(--touch-visible-height,100dvh) - 28px);height:auto;box-sizing:border-box;padding:14px;border-radius:20px;z-index:90;overflow-y:auto;overscroll-behavior:contain;box-shadow:0 10px 70px #0009}
body.touch-ui .home-hub #starport #spChat{max-height:min(620px,calc(var(--touch-visible-height,100dvh) - 28px))}
body.touch-ui .home-hub #starport #spParkMap{max-height:min(540px,calc(var(--touch-visible-height,100dvh) - 28px))}
body.touch-ui .home-hub #starport .sp-popover,body.touch-ui .home-hub #starport #spChat{bottom:max(12px,env(safe-area-inset-bottom),calc(var(--touch-keyboard-inset,0px) + 12px))}
body.touch-ui .home-hub #starport .sp-panel-title{position:sticky;top:-14px;z-index:2;background:#112437;padding:10px 0;margin-top:-4px;border-bottom:1px solid #7498ad42}
body.touch-ui .home-hub #starport .sp-panel-title>button,body.touch-ui #starport #spChat .sp-panel-title>button{min-width:44px;width:44px;height:44px;font-size:20px}
body.touch-ui #starport:has(.sp-popover:not([hidden])) :is(.sp-joystick,#spInteract,#spExitLook,#spChatPeek,.sp-route){visibility:hidden;pointer-events:none}
body.touch-ui #starport.sp-looking :is(#spInteract,.sp-park-hud,.sp-people,.sp-labels,#spChatPeek){visibility:hidden;pointer-events:none}
body.touch-ui #starport.sp-flying :is(#spExitLook,#spChatPeek){display:none!important}
body.touch-ui .sp-map-list{grid-template-columns:1fr 1fr}
body.touch-ui .sp-map-list button{min-height:48px;font-size:14px}
body.touch-ui .sp-map-pin{width:44px;height:44px;min-width:44px;min-height:44px}
body.touch-ui #spMenu{max-height:var(--touch-visible-height,100dvh)}
body.touch-ui :is(#spMenu,#spSettings,#spCommunity,.qe-panel){scroll-padding-top:64px;overscroll-behavior:contain}
body.touch-ui :is(#spSettings,#spCommunity,.qe-panel){max-height:calc(var(--touch-visible-height,100dvh) - 28px);box-sizing:border-box;overflow-y:auto}
body.touch-ui.starport-navigation:not(.in-starport) .topbar{position:sticky;top:0;z-index:30;background:#101f34f5;backdrop-filter:blur(14px);padding:8px 0}
body.touch-ui .sp-global-navigation{position:static}
body.touch-ui :is(input:not([type=checkbox]):not([type=radio]),textarea,select){font-size:16px}
/* The existing expedition joystick also works on larger touch tablets. */
body.touch-ui .qe-controls,body.touch-ui .qe-interact kbd{display:none}
body.touch-ui .qe-touch{display:flex;position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:18px;right:18px;align-items:flex-end;justify-content:space-between;pointer-events:none}
body.touch-ui .qe-stick{pointer-events:auto;touch-action:none;width:96px;height:96px;border:1px solid #b6e6dc66;border-radius:50%;background:#173349aa;display:grid;place-items:center;position:relative}
body.touch-ui .qe-stick i{width:42px;height:42px;background:#9ee3d599;border:1px solid #b9f8eb;border-radius:50%}
body.touch-ui .qe-stick span{position:absolute;bottom:8px;font-size:11px;color:#d6f7ed}
body.touch-ui .qe-touch-actions{pointer-events:auto;display:flex;gap:8px}
body.touch-ui .qe-interact{bottom:145px;max-width:calc(100% - 28px);white-space:normal}
body.touch-ui .qe-tools{bottom:84px;right:18px}
body.touch-ui .qe:has(.qe-panel[open]) .qe-touch{visibility:hidden}
@media(max-height:500px){body.touch-ui.home-lobby-expanded .hh-crew{display:none}body.touch-ui .home-hub #starport .sp-joystick.sp-analog{width:82px;height:82px;bottom:72px}body.touch-ui .home-hub #starport .sp-tools>button{min-height:44px}body.touch-ui .home-hub #starport .sp-interact,body.touch-ui .home-hub #starport #spExitLook{bottom:76px}body.touch-ui .qe{min-height:100dvh}}
@media(max-width:400px){body.touch-ui .hh-panel-head h2{font-size:14px}body.touch-ui .hh-panel-head #hhExpand{font-size:12px}body.touch-ui #starport .sp-peek-head>span{max-width:62px;overflow:hidden;text-overflow:ellipsis}body.touch-ui .sp-map-list{grid-template-columns:1fr}}