/* Public browser keeps its full scrolling website. Installed mode alone partitions screens. */
html:has(body.app-shell:not(.installed-app)) { height: auto; overflow: visible; overscroll-behavior: auto; }
body.app-shell:not(.installed-app) { position: static; display: block; height: auto; min-height: 100vh; overflow: visible; padding-top: 0; }
body.app-shell:not(.installed-app) > .app-scroll { overflow: visible; padding-bottom: 0; }
body.installed-app { background: #0C1D35; color: #0C1D35; }
body.installed-app > .app-scroll { background: #F3F0E8; padding-bottom: 0; scroll-behavior: auto; }
body.installed-app > :is(.bottom-nav, .mobile-nav, .app-bottom-nav) { display: none !important; }
body.installed-app [hidden] { display: none !important; }
body.installed-app .installed-navigation {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); flex: 0 0 auto;
  background: #0C1D35; border-top: 1px solid #294B7A; width: 100%; box-sizing: border-box;
  padding: 6px max(6px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-left, 0px));
  z-index: 50;
}
.installed-navigation a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; min-height: 52px; border-radius: 10px; padding: 4px 2px; color: #F3F0E8; text-decoration: none; font: 600 .75rem/1.25 system-ui, sans-serif; text-align: center; }
.installed-navigation a[aria-current="page"] { background: #294B7A; color: #F1E1BA; box-shadow: inset 0 -3px #D5AA49; }
.installed-navigation a:focus-visible { outline: 3px solid #D5AA49; outline-offset: -3px; }
.installed-nav-icon { font-size: 1.5rem; line-height: 1; height: 26px; }
body.installed-app .app-header .desktop-nav { display: none; }
body.installed-app .app-header { padding-block: 12px; }
body.installed-app main:focus { outline: none; }
body.installed-app :is(input, textarea, select) { font-size: max(16px, 1em); scroll-margin-block: 24px; }
body.installed-app.installed-keyboard .installed-navigation { display: none; }
body.installed-app[data-app-page="home"] main { min-height: 55vh; }
@media (prefers-reduced-motion: reduce) { body.installed-app *, body.installed-app *::before, body.installed-app *::after { scroll-behavior: auto !important; } }
@media (orientation: landscape) and (max-height: 500px) { .installed-navigation a { min-height: 40px; flex-direction: row; gap: 5px; } }
@media print {
  body.installed-app { position: static; height: auto; display: block; overflow: visible; }
  body.installed-app > .app-scroll { overflow: visible; }
  body.installed-app .installed-navigation { display: none; }
  body.installed-app[data-app-page="home"] main > [hidden], body.installed-app[data-app-page="home"] footer[hidden] { display: block !important; }
}

body.installed-app > :is(.toast, #portal-status:not(:empty), .pwa-update-notice) { bottom: calc(var(--installed-nav-height, 70px) + 16px); }
.installed-public-content { width: 100%; min-height: 55vh; margin: 0; padding: 0; }
.installed-public-content:focus { outline: none; }
.installed-public-content > .icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
/* Home-screen brand values: readable at phone widths without changing logo artwork. */
.app-shell .brand-wordmark{min-width:0}
.app-shell .brand-wordmark>span{flex-wrap:wrap;row-gap:5px}
.app-shell .brand-wordmark>span>small{flex-basis:100%;font-size:clamp(10px,2.5vw,12px);line-height:1.35;letter-spacing:.035em;white-space:normal}
.app-shell .spirit-strip{font-family:BHCDisplay,Arial,sans-serif;font-weight:800;font-style:italic;font-size:clamp(16px,4.3vw,26px);line-height:1.25;letter-spacing:.02em;gap:clamp(7px,2vw,16px);flex-wrap:wrap;white-space:normal;padding:18px 12px;text-align:center}
