/* HẠO NAM AI V2.1.3 — restore the original locked mobile BottomNav geometry.
   Scope: viewport, safe-area, BottomNav position only. Keep V2.1.2 colors/materials untouched. */
@media (max-width:767px){
  html{
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
    background:#040811!important;
  }
  body{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
    background:#040811!important;
  }
  .app{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    box-shadow:none!important;
    background:
      radial-gradient(70% 42% at -10% -8%,rgba(10,132,255,.16),transparent 64%),
      radial-gradient(64% 42% at 110% 2%,rgba(191,90,242,.12),transparent 66%),
      radial-gradient(78% 36% at -8% 112%,rgba(10,132,255,.13),transparent 67%),
      radial-gradient(74% 36% at 108% 112%,rgba(191,90,242,.11),transparent 69%),
      linear-gradient(180deg,#081421 0%,#040811 35%,#05060c 100%)!important;
  }
  body::before,body::after{display:none!important}
  .screen{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;
    padding-bottom:calc(92px + env(safe-area-inset-bottom))!important;
    scroll-padding-bottom:calc(92px + env(safe-area-inset-bottom))!important;
    background:transparent!important;
  }
  .detail{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:calc(96px + env(safe-area-inset-bottom))!important;
  }
  .tabwrap{
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:auto!important;
    bottom:max(4px,calc(env(safe-area-inset-bottom) - 2px))!important;
    height:64px!important;
    margin:0!important;
    padding:0 clamp(8px,3.5vw,14px)!important;
    z-index:80!important;
    pointer-events:none!important;
    background:transparent!important;
    transform:none!important;
  }
  .tabwrap::before,.tabwrap::after{content:none!important;display:none!important}
}

/* Home-screen PWA: use the same proven full-screen viewport as the original locked BottomNav. */
@media (display-mode:standalone) and (max-width:767px){
  html,body,.app{
    height:100vh!important;
    min-height:100vh!important;
    max-height:100vh!important;
  }
  .tabwrap{bottom:max(4px,calc(env(safe-area-inset-bottom) - 2px))!important}
}