:root {
  --presentation-font-scale: 1;
  --presentation-bg: #111318;
  --presentation-fg: #f8f4ea;
  --presentation-accent: #d6b675;
  --presentation-panel: rgba(17, 19, 24, .92);
  --presentation-line: rgba(255, 255, 255, .16);
}

body.presentation-host[data-presentation-theme="light"] {
  --presentation-bg: #f7f1e5;
  --presentation-fg: #29241e;
  --presentation-accent: #78551f;
  --presentation-panel: rgba(247, 241, 229, .94);
  --presentation-line: rgba(41, 36, 30, .2);
}
body.presentation-host[data-presentation-theme="blue"] {
  --presentation-bg: #071827;
  --presentation-fg: #f2f7fb;
  --presentation-accent: #85c6ef;
  --presentation-panel: rgba(7, 24, 39, .94);
  --presentation-line: rgba(133, 198, 239, .24);
}
body.presentation-host[data-presentation-theme="sepia"] {
  --presentation-bg: #e9dcc4;
  --presentation-fg: #33281c;
  --presentation-accent: #7c4b24;
  --presentation-panel: rgba(233, 220, 196, .95);
  --presentation-line: rgba(51, 40, 28, .2);
}

body.presentation-host {
  width: 100vw;
  height: 100vh;
  margin: 0;
  overflow: hidden;
  background: var(--presentation-bg) !important;
  color: var(--presentation-fg) !important;
}
body.presentation-host #top_horizontal_bar,
body.presentation-host #topbartogglebtn,
body.presentation-host #bottomleft_btns,
body.presentation-host #app_settings {
  display: none !important;
}
body.presentation-host #pagemaster {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  background: var(--presentation-bg) !important;
}
body.presentation-host #main {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--presentation-bg) !important;
  color: var(--presentation-fg) !important;
}
body.presentation-host #ppp {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  padding: clamp(3.5rem, 8vh, 7rem) clamp(4rem, 9vw, 10rem) clamp(5rem, 11vh, 8rem)!important;
  padding: clamp(2.5rem, 5vh, 4rem) clamp(4rem, 6vw, 8rem) clamp(2rem, 9vh, 5rem)!important;
  overflow: auto;
}
body.presentation-host .presentation-host-slide {
  width: min(1500px, 100%);
  max-height: 100%;
  text-align: center;
  animation: presentation-slide-in .2s ease-out;
}
body.presentation-host .presentation-host-reference {
  margin-bottom: clamp(1.2rem, 3.5vh, 2.8rem);
  color: var(--presentation-accent);
  font: 600 clamp(1.2rem, 2.5vw, 2.4rem)/1.2 system-ui, sans-serif;
  letter-spacing: .035em;
}
body.presentation-host .presentation-vmultiple {
  display: flex !important;
  /* flex-direction: column; */
  gap: clamp(1.1rem, 2.8vh, 2.5rem);
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
body.presentation-host .presentation-vmultiple > .verse {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit;
  background: transparent !important;
  border: 0 !important;
  text-align: center !important;
  line-height: 1.2 !important;
}
body#homepage.presentation-host #main #ppp .presentation-vmultiple > .verse.presentation-main-translation {
  order: -1;
  font-size: calc(clamp(2rem, 5.4vw, 5.4rem) * var(--presentation-font-scale)) !important;
  max-width: 100% !important;
  font-weight: inherit !important;
}
body#homepage.presentation-host #main #ppp .presentation-vmultiple > .verse.presentation-supporting-translation {
  padding-top: clamp(.7rem, 1.5vh, 1.2rem) !important;
  border-top: 1px solid var(--presentation-line) !important;
  font-size: calc(clamp(1rem, 2vw, 2.2rem) * var(--presentation-font-scale)) !important;
  max-width: 100% !important;
  font-weight: inherit !important;
  opacity: .82;
}
body.presentation-host .presentation-vmultiple > .verse::before {
  content: attr(data-presentation-version);
  display: block;
  width: max-content;
  margin: 0 auto .45rem;
  color: var(--presentation-accent) !important;
  font: 700 clamp(.72rem, 1.15vw, 1.05rem)/1 system-ui, sans-serif !important;
  letter-spacing: .1em;
  text-transform: uppercase;
}
/* Disable the reader's whole-verse/whole-row hover treatment in Presentation Mode. */
body#homepage.presentation-host #main #ppp .presentation-vmultiple:hover,
body#homepage.presentation-host #main #ppp .presentation-vmultiple:hover > .verse,
body#homepage.presentation-host #main #ppp .presentation-vmultiple > .verse:hover,
body#homepage.presentation-host #main #ppp .presentation-vmultiple > .verse.hovered_version {
  color: inherit !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border-color: transparent !important;
}
body#homepage.presentation-host #main #ppp .presentation-vmultiple > .verse:hover hr::before {
  background: transparent !important;
}
body.presentation-host .presentation-vmultiple code {
  display: none !important;
}
body.presentation-host .presentation-vmultiple [strnum],
body.presentation-host .presentation-vmultiple .translated {
  cursor: pointer;
}

body.presentation-host #presentationHostControls {
  position: fixed;
  z-index: 2147483000;
  left: 50%;
  bottom: .8rem;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: .38rem;
  max-width: calc(100vw - 1rem);
  padding: .42rem;
  border: 1px solid var(--presentation-line);
  border-radius: .72rem;
  background: var(--presentation-panel);
  color: var(--presentation-fg);
  box-shadow: 0 .6rem 2rem rgba(0,0,0,.2);
  backdrop-filter: blur(14px);
  opacity: .16;
  transition: opacity .16s ease;
}
body.presentation-host #presentationHostControls:hover,
body.presentation-host #presentationHostControls:focus-within {opacity: 1;}
body.presentation-host #presentationHostControls button,
body.presentation-host #presentationHostControls select,
body.presentation-host #presentationHostControls input {
  min-height: 2.3rem;
  padding: .4rem .65rem;
  border: 1px solid var(--presentation-line);
  border-radius: .42rem;
  background: var(--presentation-bg);
  color: var(--presentation-fg);
  font: 600 .84rem system-ui, sans-serif;
}
body.presentation-host #presentationHostControls button {cursor: pointer;}
body.presentation-host #presentationHostControls button:disabled {opacity: .3; cursor: default;}
body.presentation-host #presentationHostControls label {
  display: flex;
  align-items: center;
  gap: .3rem;
  white-space: nowrap;
  font: 600 .78rem system-ui, sans-serif;
}
body.presentation-host #presentationHostControls select {max-width: 7rem;}
body.presentation-host #presentationReferenceJump {width: 8.5rem;}
body.presentation-host #presentationHostPosition {min-width: 3.8rem; text-align: center; font: .8rem system-ui, sans-serif;}

body.presentation-host .presentation-edge-navigation {
  position: fixed;
  z-index: 2147482900;
  top: 50%;
  display: grid;
  place-items: center;
  width: clamp(2.8rem, 5vw, 4.5rem);
  height: clamp(5rem, 16vh, 9rem);
  padding: 0;
  transform: translateY(-50%);
  border: 1px solid var(--presentation-line);
  border-radius: .65rem;
  background: var(--presentation-panel);
  color: var(--presentation-fg);
  font: 300 clamp(3rem, 6vw, 6rem)/1 system-ui, sans-serif;
  cursor: pointer;
  opacity: .38;
  transition: opacity .15s ease, background-color .15s ease;
}
body.presentation-host .presentation-edge-navigation:hover,
body.presentation-host .presentation-edge-navigation:focus-visible {opacity: 1; outline: none;}
body.presentation-host .presentation-edge-navigation:disabled {visibility: hidden;}
body.presentation-host #presentationEdgePrevious {left: .5rem;}
body.presentation-host #presentationEdgeNext {right: .5rem;}
body.presentation-host:has(#context_menu.fillscreen) .presentation-edge-navigation {display:none;}

/* Preserve the menu's own layout; only keep it above presentation controls. */
body.presentation-host #context_menu:not(.displaynone) {
  z-index: 2147483600 !important;
}

body.presentation-host #singleverse_compare_menu:not(.displaynone) {
  position: fixed !important;
  inset: 8vh 8vw !important;
  z-index: 2147483550 !important;
  width: 84vw !important;
  max-height: 84vh !important;
  overflow: auto !important;
  background: var(--presentation-panel) !important;
  color: var(--presentation-fg) !important;
  font-size: calc(clamp(1rem, 1.55vw, 1.5rem) * var(--presentation-font-scale));
}

/* Windows launched by the full menu remain real app windows, presented full-size. */
body.presentation-host #refnav,
body.presentation-host #refnav_col2 {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483500 !important;
  width: 100vw !important;
  height: 100vh !important;
  pointer-events: none;
}
body.presentation-host #refnav_col2 > div:not(.displaynone) {
  position: fixed !important;
  inset: 4vh 4vw !important;
  display: block !important;
  width: 92vw !important;
  height: 92vh !important;
  max-width: none !important;
  max-height: none !important;
  padding: clamp(.8rem, 2vw, 1.6rem) !important;
  overflow: auto !important;
  border: 1px solid var(--presentation-line) !important;
  border-radius: 1rem;
  background: var(--presentation-panel) !important;
  color: var(--presentation-fg) !important;
  box-shadow: 0 1.5rem 5rem rgba(0,0,0,.55);
  pointer-events: auto;
  transform: none !important;
  font-size: calc(clamp(1rem, 1.55vw, 1.5rem) * var(--presentation-font-scale));
}

:is([data-presentation-theme="dark"], [data-presentation-theme="blue"]) .presentation-vmultiple span.translated:not(.win2_noteholder blockquote .verse:not(.verse:hover) span.translated) {
  color: #ffe5da;
  word-wrap: break-word;
}

@keyframes presentation-slide-in {
  from {opacity: 0; transform: translateY(.6rem);}
  to {opacity: 1; transform: translateY(0);}
}
@media (max-width: 720px) {
  body.presentation-host #ppp {padding: 3.5rem 3rem 7rem !important;}
  body.presentation-host #presentationHostControls {width: calc(100% - 1rem); justify-content: center; flex-wrap: wrap; opacity: .72;}
  body.presentation-host #refnav_col2 > div:not(.displaynone) {inset: 1vh 1vw !important; width: 98vw !important; height: 98vh !important;}
}
@media (prefers-reduced-motion: reduce) {
  body.presentation-host *, body.presentation-host *::before, body.presentation-host *::after {animation: none !important; transition: none !important;}
}
