/* Mobile app shell: content scrolls, navigation stays in the last viewport row. */
[hidden]{display:none!important}
@media screen and (max-width:800px){
 body.authenticated{height:100vh;height:100dvh;min-height:0!important;overflow:hidden;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;padding-bottom:0!important}
 body.authenticated>header{grid-row:1;position:relative;top:auto}
 body.authenticated>#notice{grid-row:2;min-width:0}
 body.authenticated>main{grid-row:3;min-height:0;width:100%;max-width:600px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;margin:0 auto!important;padding-top:14px;padding-bottom:20px}
 body.authenticated>#mobileCheckout{grid-row:4;position:relative!important;inset:auto!important;padding:12px 20px 17px}
 body.authenticated>#bottomNav{grid-row:5;position:relative!important;inset:auto!important;z-index:30;box-sizing:border-box;width:100%;height:calc(78px + env(safe-area-inset-bottom,0px));padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px));background:#fff;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-around;margin:0}
 body.authenticated>footer{display:none}
}

/* Installed iPhone apps need the full viewport; dvh can omit the safe area. */
@media screen and (max-width:800px) and (display-mode:standalone){body.authenticated{height:100vh!important}}
@media screen and (max-width:800px){html{background:#fff}body.authenticated{overscroll-behavior:none}body.authenticated>#bottomNav{flex-shrink:0}}