/* ==========================================================================
   APP SHELL — makes the single HTML file behave as an installed app
   (Sep 2026). Nothing here changes how the site looks in a normal browser
   tab: every rule is gated on the app actually running standalone.
   ========================================================================== */

/* Launched from the home screen: give the fixed nav the notch back. --nav-h
   drives both the nav's own height and every page's top padding, so raising
   it here keeps the two in step. */
html[data-hu-app="standalone"]{ --nav-h: calc(68px + env(safe-area-inset-top, 0px)); }
html[data-hu-app="standalone"] #mainNav{ padding-top: env(safe-area-inset-top, 0px); }
html[data-hu-app="standalone"] .hu-app-bottomnav{
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
html[data-hu-app="standalone"] body{
  padding-bottom: env(safe-area-inset-bottom, 0px);
  overscroll-behavior-y: none;          /* no rubber-band on a home-screen app */
}

/* the install invitation */
.hu-app-chip{
  position:fixed; z-index:99998; left:50%; transform:translateX(-50%);
  bottom:calc(18px + env(safe-area-inset-bottom, 0px));
  display:none; align-items:center; gap:12px;
  max-width:min(440px, calc(100vw - 32px));
  padding:12px 12px 12px 16px; border-radius:50px;
  background:#243447; color:#fff;
  box-shadow:0 14px 34px rgba(36,52,71,.34);
  font-family:'Nunito',system-ui,sans-serif; font-size:.92rem; line-height:1.35;
}
.hu-app-chip.is-on{ display:flex; }
.hu-app-chip img{ width:34px; height:34px; border-radius:10px; flex:0 0 auto; }
.hu-app-chip b{ display:block; font-weight:700; }
.hu-app-chip span{ display:block; font-size:.8rem; opacity:.82; }
.hu-app-chip button{
  min-height:44px; padding:11px 18px; border:0; border-radius:50px; cursor:pointer;
  font:inherit; font-weight:800; font-size:.88rem;
  background:#fff !important; color:#243447 !important; white-space:nowrap;
}
.hu-app-chip .hu-app-x{
  min-width:44px; min-height:44px; padding:0; background:transparent !important;
  color:#fff !important; font-size:1rem; font-weight:400;
}
@media (max-width:560px){
  .hu-app-chip{ left:12px; right:12px; transform:none; max-width:none; border-radius:20px; }
}

/* the iOS "add to home screen" explainer */
.hu-app-ov{
  position:fixed; inset:0; z-index:99999; background:rgba(36,52,71,.45);
  display:none; align-items:center; justify-content:center; padding:20px;
}
.hu-app-ov.is-on{ display:flex; }
.hu-app-box{
  width:100%; max-width:440px; max-height:calc(100dvh - 48px); overflow-y:auto;
  background:#FBF8F2; border-radius:22px; padding:22px;
  font-family:'Nunito',system-ui,sans-serif; color:#243447;
  box-shadow:0 24px 60px rgba(36,52,71,.32);
}
.hu-app-box h2{
  font-family:'Playfair Display',Georgia,serif; font-size:1.4rem; font-weight:700;
  margin:0 0 8px; color:#243447 !important;
}
.hu-app-box ol{ margin:14px 0 0; padding-left:20px; }
.hu-app-box li{ margin-bottom:10px; line-height:1.55; }
.hu-app-box p{ margin:0; line-height:1.6; }
.hu-app-box .hu-app-note{ font-size:.82rem; color:#5A6B7D; margin-top:14px !important; }
.hu-app-box .hu-app-done{
  margin-top:18px; width:100%; min-height:48px; border:0; border-radius:14px;
  cursor:pointer; font:inherit; font-weight:800;
  background:#5F7350 !important; color:#fff !important;
}