/* Reserve the maximum inset once; move the menu as the visible Android inset changes. */
@layer teamiloMobileChrome {
  html[data-tm-system-edges] #app nav.bottom {
    --tm-menu-bottom-max: env(safe-area-max-inset-bottom, env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
    bottom: calc(env(safe-area-inset-bottom, 0px) - var(--tm-menu-bottom-max)) !important;
    padding-bottom: max(18px, calc(8px + var(--tm-menu-bottom-max))) !important;
  }
  html[data-tm-system-edges] body {
    padding-block-start: env(safe-area-inset-top, 0px) !important;
  }
  /* The area exposed below the buttons belongs to the same painted surface.
     Inherit the live menu colour even when the entire design sheet is replaced. */
  html[data-tm-system-edges] #app nav.bottom::after {
    content: "" !important;
    display: block !important;
    position: fixed !important;
    inset: auto 0 0 !important;
    height: max(env(safe-area-inset-bottom, 0px), var(--tm-menu-web-gap, 0px)) !important;
    background-color: inherit !important;
    pointer-events: none !important;
    border: 0 !important;
  }
}