/*
  Shared phone shell for the static Nifftly pages.

  This file intentionally loads after each page's inline styles. It gives the
  browser and the Capacitor WebView the same minimum breathing room even when a
  safe-area inset transiently reports as zero during navigation.
*/
@media (max-width:820px){
  html{overflow-x:clip;-webkit-text-size-adjust:100%}
  body{min-width:0;overflow-x:clip}

  /* Header shapes used by the legal, pricing, and contact pages. */
  body > header:not(#top),
  body > header.wrap:not(#top){
    box-sizing:border-box;
    height:auto;
    min-height:max(72px,calc(52px + env(safe-area-inset-top)));
    padding-top:max(28px,calc(12px + env(safe-area-inset-top)));
    padding-right:max(20px,env(safe-area-inset-right));
    padding-bottom:10px;
    padding-left:max(20px,env(safe-area-inset-left));
  }

  /* The How it works header owns its inner .wrap rather than the header. */
  body > header#top{min-height:max(72px,calc(52px + env(safe-area-inset-top)));}
  body > header#top > .wrap{
    min-height:44px;
    padding-top:max(28px,calc(12px + env(safe-area-inset-top)));
    padding-right:max(20px,env(safe-area-inset-right));
    padding-bottom:10px;
    padding-left:max(20px,env(safe-area-inset-left));
  }

  /* Never make a small phone choose between a logo and an off-screen menu. */
  .topnav,
  nav.nav,
  .nav-links{
    min-width:0;
    flex-wrap:wrap;
    justify-content:flex-end;
    column-gap:12px;
    row-gap:6px;
  }
  .topnav a,
  nav.nav a,
  .nav-links a{margin-left:0!important;white-space:nowrap}

  /* Static page content and footers need the same side and home-indicator room. */
  .wrap{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));}
  main,.auth-main{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));}
  .nf-footer{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));padding-bottom:max(24px,calc(16px + env(safe-area-inset-bottom)));}
}