/* Keep the reading guide below the existing header, with room for readable labels. */
.facility-jump.reading-guide {
  position: sticky;
  top: var(--oazo-header-height, 102px);
  z-index: 8;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  padding: 12px 2px;
  background: #fff;
  border-bottom: 1px solid var(--facility-line, #d0dbea);
  box-shadow: 0 6px 12px #00000008;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-padding-inline: 8px;
  scrollbar-width: thin;
}
.facility-jump.reading-guide a {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  line-height: 1.6;
  padding: 9px 16px;
  font-size: 18px;
}
.facility-jump.reading-guide a[aria-current="location"] {
  background: var(--facility-accent, #123c87) !important;
  color: #fff !important;
  border-color: var(--facility-accent, #123c87) !important;
  box-shadow: inset 0 -3px 0 #ffffff55;
}
.reading-guide-slot { display: none; }
.reading-guide-slot.is-occupied { display: block; margin: 30px 0 0; }
/* Align the desktop row with its eventual position inside the header. */
@media (min-width: 801px) {
  main .facility-jump.reading-guide {
    margin-left: var(--oazo-guide-inset, 0px);
    width: var(--oazo-guide-width, auto);
  }
  header.reading-guide-header { column-gap: 18px; }
  header.reading-guide-header > .brand { flex: 0 0 auto; }
  header.reading-guide-header > .menu { margin-left: 0; }
  header .facility-jump.reading-guide.is-docked {
    position: static;
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: 8px 2px;
    background: transparent;
    border: 0;
    box-shadow: none;
    gap: 8px;
    scrollbar-color: #ffffff80 transparent;
  }
  header .facility-jump.reading-guide.is-docked a {
    --action-color: #fff;
    background: transparent !important;
    color: #fff !important;
    border-color: #ffffffaa !important;
    padding: 7px 13px;
  }
  header .facility-jump.reading-guide.is-docked a:is(:hover,:focus-visible),
  header .facility-jump.reading-guide.is-docked a[aria-current="location"] {
    background: #fff !important;
    color: var(--facility-accent, #123c87) !important;
    border-color: #fff !important;
    box-shadow: none;
  }
  header .facility-jump.reading-guide.is-docked a:focus-visible {
    outline-color: #fff;
    outline-offset: 2px;
  }
}
/* Apply the fixed UI offset once, rather than adding root padding and section margins. */
html.oazo-reading-page {
  scroll-padding-top: calc(var(--oazo-header-height, 102px) + var(--oazo-guide-height, 74px));
}
body.oazo-reading-guide main section[id] {
  scroll-margin-top: 0;
}
/* A destination heading receives reading focus without a decorative focus box. */
body.oazo-reading-guide .detail-block > h2.reading-destination:focus {
  outline: none;
}
@media (max-width: 800px) {
  main .facility-jump.reading-guide { gap: 8px; padding-block: 9px; }
  main .facility-jump.reading-guide a { padding: 8px 14px; }
}
@media print {
  main .facility-jump.reading-guide { position: static; flex-wrap: wrap; overflow: visible; box-shadow: none; }
  .reading-guide-slot { display: none !important; }
}
