html {
  scrollbar-gutter: stable;
}

.homeNav,
.readerHeader,
.lookupDock,
.searchDock {
  position: relative !important;
  top: auto !important;
}

.readerPage > .crumb.chapterCrumbFixed {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  margin: 5px auto 0 !important;
}

.readerPage > .scripture {
  margin-top: 5px !important;
}

.chapterFrameTopBorder {
  display: block !important;
  position: absolute !important;
}

/* Logo frame */
.homeNav,
.readerHeader {
  width: 100%;
}

/* Hide the homepage source directory only until the script moves it into its top frame. */
main > .library#books {
  display: none;
}

/* Search frame */
.lookupDock .searchArea,
.searchDock > .searchArea,
.searchDock > .searchForm {
  width: min(850px, calc(100% - 44px));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

/* Directory frame */
.lookupDock > .lookupToolsFrame,
.searchDock > .lookupToolsFrame {
  width: min(856px, calc(100% - 44px)) !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.lookupToolsFrame > .lookupTools,
.lookupToolsFrame > .bookListPanel {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.lookupToolsFrame .bookListButton {
  translate: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (min-width: 651px) {
  .searchPage .searchPageResults { padding-left: 22px; }
  .searchPage .searchResultsLayout {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    grid-template-columns: 180px minmax(0, 1fr) !important;
    gap: 8px;
  }
}

@media (max-width: 650px) {
  .lookupDock .searchArea,
  .searchDock > .searchArea,
  .searchDock > .searchForm,
  .lookupDock > .lookupToolsFrame,
  .searchDock > .lookupToolsFrame {
    width: calc(100% - 30px) !important;
  }
}

/* Keep all page content on the same responsive 1080px alignment frame. */
:root {
  --site-content-gutter: max(5vw, calc((100% - 1080px) / 2));
}

.homeNav,
.readerHeader,
.homeFooter,
.homeGuide,
.aboutText {
  padding-left: var(--site-content-gutter);
  padding-right: var(--site-content-gutter);
}

.homeNav > .scriptControls,
.readerHeader > .scriptControls {
  display: flex;
  align-items: center;
  width: 50px;
  gap: 0;
}

.homeNav > .scriptControls > button,
.readerHeader > .scriptControls > button {
  min-width: 25px;
  padding-left: 4px;
  padding-right: 4px;
}

/* Shared book-directory hover and current states. */
.megaBookList .bookChoice:hover,
.megaBookList .bookChoice.active,
.megaBookList .bookChoice.active:hover {
  color: #b43b32;
  border-left-color: #b43b32;
}

.bookChapters nav a:hover,
.bookChapters nav a:hover span,
.bookChapters nav a.current,
.bookChapters nav a.current span,
.bookChapters nav a.current b {
  color: #b43b32;
}

/* Keep the shared book directory at 540px on normal-height viewports. */
.bookListPanel.open {
  height: 540px !important;
}

@media (max-height: 749px) {
  .bookListPanel.open {
    height: max(300px, 65vh) !important;
  }
}