/* Keep iOS status/home-indicator safe areas outside the app's visible controls. */
:root{
  --extrait-safe-top:env(safe-area-inset-top,0px);
  --extrait-safe-bottom:env(safe-area-inset-bottom,0px);
}
#app{
  box-sizing:border-box;
  padding-top:var(--extrait-safe-top)!important;
  padding-bottom:var(--extrait-safe-bottom)!important;
}
/* The shell already reserves the status bar; do not count it twice here. */
#main-header.app-header{
  padding-top:14px!important;
  padding-bottom:13px!important;
}
/* The capsule stays compact; the home-indicator space belongs below it. */
#main-nav.bottom-nav{
  box-sizing:border-box!important;
  height:70px!important;
  min-height:70px!important;
  max-height:70px!important;
  flex:0 0 70px!important;
  align-items:stretch;
  padding:6px 5px!important;
  margin:8px 14px 12px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
#main-nav .nav-btn{
  box-sizing:border-box;
  height:100%;
  min-height:0!important;
  padding:4px 1px!important;
  justify-content:center;
  gap:5px;
  font-size:8.5px!important;
  line-height:1.2;
  letter-spacing:.25px!important;
  white-space:nowrap;
}
#main-nav .nav-btn .nav-ico{
  display:grid;
  place-items:center;
  width:26px;
  height:25px;
  font-size:22px!important;
  line-height:1;
}
#main-nav .nav-btn[data-nav="calc"]{font-size:7.6px!important;letter-spacing:0!important}
/* Search belongs to the scrollable catalogue introduction, directly before arrivals. */
#page-home > .scroll > .home-srch{padding:7px 9px 4px!important}
.exn-drawer{
  padding-top:calc(29px + var(--extrait-safe-top));
  padding-bottom:calc(29px + var(--extrait-safe-bottom));
}
@media(max-width:349px){
  #main-nav.bottom-nav{margin-inline:10px!important;padding-inline:3px!important}
  #main-nav .nav-btn{font-size:7.8px!important;letter-spacing:.1px!important}
  #main-nav .nav-btn[data-nav="calc"]{font-size:7px!important}
}
#page-home > .scroll > .home-srch{position:relative!important;top:auto!important;order:initial!important}