/* The browser owns device safe-area insets (viewport-fit:auto). Keep one fixed 64px bar. */
.mobile-navigation{display:none}
@media(max-width:1040px){
  :root{--mobile-navigation-height:64px;--mobile-navigation-space:var(--mobile-navigation-height)}
  .page-public.has-mobile-navigation{padding-bottom:var(--mobile-navigation-space)}
  html:has(.has-mobile-navigation){scroll-padding-bottom:calc(var(--mobile-navigation-space) + 16px)}
  .mobile-navigation{
    position:fixed;inset:auto 0 0;z-index:1000;
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:53px;gap:4px;
    box-sizing:border-box;width:auto;height:var(--mobile-navigation-space);min-height:var(--mobile-navigation-space);max-height:var(--mobile-navigation-space);
    margin:0;padding:5px 8px;
    border:0;border-top:1px solid var(--border);border-radius:0;background:var(--paper);color:var(--muted);
    box-shadow:0 -4px 18px #172b1b0a;overflow:hidden;isolation:isolate;
  }
  .mobile-navigation>a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    width:100%;min-width:0;height:53px;min-height:53px;max-height:53px;margin:0;padding:4px 2px;box-sizing:border-box;
    color:var(--muted);background:transparent;border:0;border-radius:11px;text-decoration:none;font-size:11px;font-weight:400;line-height:16px;
    overflow:hidden;-webkit-tap-highlight-color:transparent;
  }
  .mobile-navigation>a>.icon{width:21px;height:21px;min-width:21px;min-height:21px;flex:0 0 21px;margin:0;stroke-width:1.7}
  .mobile-navigation>a>span{display:block;max-width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:16px}
  .mobile-navigation>a[aria-current]{background:var(--sage-pale);color:var(--sage-dark)}
  .mobile-navigation>a:focus-visible{outline:2px solid var(--clay-dark);outline-offset:-3px}
  @media(hover:hover){.mobile-navigation>a:hover{background:var(--sage-pale);color:var(--sage-dark)}}
}
