@media(max-width:768px){
  .app-shell{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
  .mobile-nav{
    grid-template-columns:repeat(3,minmax(0,1fr)) minmax(58px,1.28fr) repeat(3,minmax(0,1fr));
    align-items:end;
    min-height:64px;
    padding:8px 4px calc(6px + env(safe-area-inset-bottom));
  }
  .mobile-nav button{min-width:0;min-height:48px;padding:3px 1px;font-size:7.5px}
  .mobile-nav button span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mobile-nav button[data-mobile="menu"]{
    position:relative;
    z-index:1;
    width:58px;
    min-height:58px;
    justify-self:center;
    transform:translateY(-7px);
    border:1px solid rgba(70,244,255,.72);
    border-radius:16px;
    color:#e8fcff;
    background:linear-gradient(180deg,rgba(24,88,112,.98),rgba(5,30,42,.98));
    box-shadow:0 0 0 3px rgba(2,3,4,.94),0 0 24px rgba(56,189,248,.44),inset 0 1px rgba(255,255,255,.18);
    font-size:10px;
    font-weight:800;
  }
  .mobile-nav button[data-mobile="menu"]>span{font-size:9px;letter-spacing:.02em}
  .mobile-nav button[data-mobile="menu"]:focus-visible{outline:2px solid #fff;outline-offset:3px}
}
@media(max-width:390px){
  .mobile-nav{grid-template-columns:repeat(3,minmax(0,1fr)) minmax(54px,1.25fr) repeat(3,minmax(0,1fr));padding-right:2px;padding-left:2px}
  .mobile-nav button{font-size:7px}
  .mobile-nav button[data-mobile="menu"]{width:54px;min-height:56px}
}