/*
 * Native-height iPhone / Home Screen polish.
 * Safari tabs keep 100dvh (respecting its address bar). Installed iOS web apps
 * measure the visible WebKit viewport in JS to avoid clipping below iOS chrome.
 * Do not make body position:fixed: text inputs and the inner scroller need to
 * keep their own normal keyboard handling.
 */
.bn-brand-art{
 display:block;
 object-fit:contain;
 flex:0 0 auto;
 border-radius:9px;
}
.app-wordmark .bn-brand-art-header{
 width:29px;
 height:29px;
 border-radius:8px;
 filter:drop-shadow(0 1px 3px rgba(0,0,0,.15));
}
.copy .bn-brand-art-desktop{width:40px;height:40px;border-radius:11px}
.bp-welcome-symbol{
 display:flex;
 justify-content:center;
 align-items:center;
 min-height:58px;
 margin-bottom:10px;
}
.bp-welcome-symbol .bn-brand-art-welcome{
 width:58px;
 height:58px;
 border-radius:14px;
 box-shadow:0 6px 24px rgba(0,0,0,.14);
}
@media(max-width:760px){
 html{background-color:var(--bn-page,#151617)}
 .overall,
 .phone-outer{
  height:var(--bn-mobile-shell-height,100dvh)!important;
  min-height:0!important;
  max-height:none!important;
 }
 .phone{
  height:100%!important;
  min-height:0!important;
 }
 .phone .bottom{
  bottom:0!important;
 }
 .app-wordmark{align-items:center}
 /* The installed PWA must not clip its content at the shorter visual viewport.
    Both html/body and the phone frame share the compensated physical height. */
 html[data-bn-standalone="true"],
 html[data-bn-standalone="true"] body{
  height:var(--bn-mobile-shell-height,100dvh)!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden;
 }
 html[data-bn-standalone="true"] .overall,
 html[data-bn-standalone="true"] .phone-outer{
  height:var(--bn-mobile-shell-height,100dvh)!important;
 }
}
@media(max-width:760px) and (display-mode:standalone){
 /* Avoid an outer wrapper that clips the footer at the short viewport. */
 html,body{height:var(--bn-mobile-shell-height,100dvh)!important;min-height:0!important;overflow:hidden}
 .overall,.phone-outer{height:var(--bn-mobile-shell-height,100dvh)!important}
 .phone .bottom{bottom:0!important}
}
@media(max-width:350px){
 .app-wordmark .bn-brand-art-header{width:25px;height:25px;border-radius:7px}
 .bp-welcome-symbol .bn-brand-art-welcome{width:52px;height:52px}
}
