/* Keep every interactive surface inside the device safe area, including standalone iOS. */
:root{--nw-safe-top:env(safe-area-inset-top,0px);--nw-safe-right:env(safe-area-inset-right,0px);--nw-safe-bottom:env(safe-area-inset-bottom,0px);--nw-safe-left:env(safe-area-inset-left,0px)}
#baant-app{padding-top:var(--nw-safe-top);--nw-dialog-height:calc(var(--nw-visible-height,100dvh) - var(--nw-safe-top) - var(--nw-safe-bottom) - 16px);--nw-dialog-width:calc(var(--nw-visible-width,100vw) - var(--nw-safe-left) - var(--nw-safe-right) - 16px)}
#baant-app .nw-header{top:var(--nw-safe-top);padding-top:6px;padding-left:calc(10px + var(--nw-safe-left));padding-right:calc(10px + var(--nw-safe-right))}
#baant-app .nw-season-banner{padding-left:calc(16px + var(--nw-safe-left));padding-right:calc(16px + var(--nw-safe-right))}
#baant-app .nw-shell{padding-left:max(12px,var(--nw-safe-left));padding-right:max(12px,var(--nw-safe-right))}
#baant-app .nw-footer{padding-bottom:calc(18px + var(--nw-safe-bottom));padding-left:calc(16px + var(--nw-safe-left));padding-right:calc(16px + var(--nw-safe-right))}
#baant-app dialog.nw-dialog,#baant-app dialog.nw-choice-picker,#baant-app dialog.nw-social{
 position:fixed;inset:calc(var(--nw-visible-top,0px) + var(--nw-safe-top) + 8px) calc(var(--nw-visible-right,0px) + var(--nw-safe-right) + 8px) calc(var(--nw-visible-bottom,0px) + var(--nw-safe-bottom) + 8px) calc(var(--nw-visible-left,0px) + var(--nw-safe-left) + 8px)!important;
 margin:auto!important;max-height:var(--nw-dialog-height)!important;max-width:var(--nw-dialog-width)!important;min-height:0!important;min-width:0;box-sizing:border-box;overscroll-behavior:contain;
}
#baant-app .nw-dialog .nw-dialog-head{flex-shrink:0}
#baant-app .nw-dialog :is(input,textarea,select){scroll-margin-block:60px}
#baant-app .nw-dialog :is(.nw-dialog-head button,[data-do=close-dialog]){min-width:44px;min-height:44px}
#baant-app #nw-arena{--nw-edge-top:calc(var(--nw-safe-top) + 8px);--nw-edge-left:calc(var(--nw-safe-left) + 12px);--nw-edge-right:calc(var(--nw-safe-right) + 12px);--nw-edge-bottom:calc(var(--nw-safe-bottom) + 12px)}
#baant-app #nw-arena .nw-hud-top{inset:var(--nw-edge-top) var(--nw-edge-right) auto var(--nw-edge-left)}
#baant-app #nw-arena .nw-team-hud{top:calc(var(--nw-edge-top) + 41px);left:var(--nw-edge-left)}
#baant-app #nw-arena .nw-joystick{left:var(--nw-edge-left);bottom:var(--nw-edge-bottom)}
#baant-app #nw-arena .nw-action-pad{right:var(--nw-edge-right);bottom:var(--nw-edge-bottom)}
#baant-app #nw-arena .nw-team-communication{left:var(--nw-edge-left);bottom:calc(var(--nw-edge-bottom) + 104px)}
#baant-app #nw-arena .nw-survival-status{top:calc(var(--nw-edge-top) + 33px)}
#baant-app #nw-arena #nw-chat-feed{left:var(--nw-edge-left);top:calc(var(--nw-edge-top) + max(86px,calc(45px + var(--nw-team-rows,1)*24px)));max-height:max(24px,min(80px,calc(var(--nw-screen-height,100dvh) - var(--nw-safe-top) - var(--nw-safe-bottom) - 270px)))}
#baant-app #nw-arena>.nw-chat{
 left:var(--nw-edge-left)!important;right:auto!important;bottom:var(--nw-edge-bottom)!important;
 width:min(320px,calc(100% - var(--nw-edge-left) - var(--nw-edge-right)))!important;
 max-height:calc(var(--nw-screen-height,100dvh) - var(--nw-edge-top) - var(--nw-edge-bottom))!important;overflow:auto!important;overscroll-behavior:contain;
}
#baant-app #nw-arena>.nw-chat:has([data-chat-tab=text][aria-selected=true]){bottom:calc(var(--nw-edge-bottom) + 158px)!important;max-height:calc(var(--nw-screen-height,100dvh) - var(--nw-edge-top) - var(--nw-edge-bottom) - 158px)!important;overflow:auto!important}
#baant-app #nw-arena.is-typing>.nw-chat:has([data-chat-tab=text][aria-selected=true]),#baant-app #nw-arena.is-typing>.nw-chat{bottom:var(--nw-edge-bottom)!important;max-height:calc(var(--nw-screen-height,100dvh) - var(--nw-edge-top) - var(--nw-edge-bottom))!important}
#baant-app #nw-arena>.nw-chat :is(.nw-chat-tabs,.nw-chat-text-pane,#nw-chat-form){flex-shrink:0}
#baant-app #nw-arena .nw-screen-message{box-sizing:border-box;padding:calc(var(--nw-safe-top) + 16px) calc(var(--nw-safe-right) + 16px) calc(var(--nw-safe-bottom) + 16px) calc(var(--nw-safe-left) + 16px)!important;overflow:auto;overscroll-behavior:contain}
#baant-app #nw-arena .nw-screen-message>*{flex-shrink:0}
#baant-app #nw-toast{bottom:calc(var(--nw-safe-bottom) + 16px);max-width:var(--nw-dialog-width)}
@media(max-height:500px) and (orientation:landscape){
 #baant-app #nw-arena>.nw-chat:has([data-chat-tab=text][aria-selected=true]){bottom:calc(var(--nw-edge-bottom) + 158px)!important}
 #baant-app #nw-arena.is-typing>.nw-chat:has([data-chat-tab=text][aria-selected=true]){bottom:var(--nw-edge-bottom)!important}
 #baant-app #nw-arena>.nw-chat .nw-quick-chat{display:none}
 #baant-app #nw-training-intro h2{font-size:19px;margin:4px 0}#baant-app #nw-training-intro p{font-size:11px;line-height:1.35;margin:3px 0}
}
/* The keyboard may leave very little height. Scroll content, never crop the close action. */
@media(max-height:300px){#baant-app #nw-launch[open]{overflow:auto;display:block}#baant-app #nw-launch .nw-launch-grid{min-height:150px}#baant-app #nw-launch .nw-launch-actions{margin-top:8px}}

/* Keep close controls visible while a long settings form scrolls. */
#baant-app :is(#nw-settings,#nw-wardrobe,#nw-account,#nw-lobby,#nw-name-dialog)>.nw-dialog-head{position:sticky;top:0;z-index:5;background:#10151d;padding-block:6px}
html.nw-keyboard-open #baant-app #nw-launch[open]{display:block;overflow:auto}
html.nw-keyboard-open #baant-app #nw-launch .nw-dialog-head{position:sticky;top:0;z-index:5;background:#10151d}
html.nw-keyboard-open #baant-app #nw-launch .nw-launch-grid{min-height:250px;margin-top:8px}
html.nw-keyboard-open #baant-app #nw-launch .nw-launch-actions{margin-top:8px}
#baant-app .nw-mobile-dock{bottom:var(--nw-safe-bottom);left:var(--nw-safe-left);right:var(--nw-safe-right)}
