html > body > main > menu[role=toolbar] > label {

  &[for=navigateBack] {
    display: none;
    position: absolute;
    left: calc( 50% - 10px );
    &::before {
      content: var( --icon-arrow-narrow-left );
    }
  }

  &[for=navigateForward] {
    display: none;
    position: absolute;
    left: calc( 50% + 10px );
    &::before {
      content: var( --icon-arrow-narrow-right );
    }
  }
}


@media 
  (display-mode: fullscreen),
  (display-mode: standalone),
  (display-mode: minimal-ui),
  (display-mode: window-controls-overlay)
 {
  html > body > main > menu[role=toolbar] > label {

    &[for=navigateBack],
    &[for=navigateForward] {
      display:inline;
    }
  }
}