/* A normal layout row below a separate scrolling content area. */
@media(max-width:760px){
 :root{--market-mobile-nav-height:calc(64px + env(safe-area-inset-bottom,0px))}
 html.market-app-shell{height:100%;overflow:hidden}
 html.market-app-shell body{height:100%;max-height:100%;min-height:0;overflow:hidden;display:flex;flex-direction:column}
 html.market-app-shell #app{flex:1 1 0%;min-height:0;width:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;scroll-padding-bottom:16px;-webkit-overflow-scrolling:touch}
 html.market-app-shell body>.mobile-nav{
  position:relative!important;inset:auto!important;top:auto!important;bottom:auto!important;
  left:auto!important;right:auto!important;transform:none!important;transition:none!important;
  flex:0 0 var(--market-mobile-nav-height);height:var(--market-mobile-nav-height);width:100%;margin:0;
  box-sizing:border-box;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;
  padding:6px 7px calc(6px + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--stroke);background:#fff;z-index:40;
 }
 .mobile-nav button{min-width:0;min-height:48px;align-content:center;justify-items:center}
 html.market-input-active .mobile-nav{visibility:hidden;pointer-events:none}
 /* The bar now reserves its own row and does not cover the content footer. */
 html.market-app-shell .main{padding-bottom:30px}
 html.market-app-shell .footer{padding-bottom:28px}
}