/* ManualeReef v332 — site-wide fixed/sticky header and uniform Back to Top.
   Applied after v327 layout. This only styles navigation and the new single button.
   The header's original place in normal flow is kept by its JS-managed slot. */

html body header.mr3-header.unified-site-header.mr-nav-v327.mr-v332-sticky-header,
html body header.mr-v332-sticky-header.mr-nav-v327,
html body header.sr-header.mr-v332-sticky-header{
  position:fixed!important;
  top:0!important;
  left:var(--mr-v332-header-x,0px)!important;
  width:var(--mr-v332-header-width,100%)!important;
  max-width:100vw!important;
  z-index:9400!important;
  overflow:visible!important;
  will-change:auto!important;
  -webkit-transform:none!important;
  transform:none!important;
  margin-top:0!important;
  margin-bottom:0!important;
}
html body .mr-v332-header-slot{
  display:block!important;
  position:relative!important;
  height:var(--mr-v332-header-height,76px)!important;
  min-height:var(--mr-v332-header-height,76px)!important;
  flex:0 0 auto!important;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html body .mr-v332-header-slot::before,
html body .mr-v332-header-slot::after{display:none!important}

/* Hide old back-to-top variants rather than deleting legacy JS and breaking
   scripts that still reference their historical IDs. */
html body .atlas-backtop,
html body button.back-to-top,
html body a.back-to-top,
html body #backToTop,
html body #scrollToTop{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Screenshot-approved look: dark navy, thin white border, arrow + clear label. */
html body .mr-backtop-v332{
  box-sizing:border-box!important;
  position:fixed!important;
  right:calc(18px + env(safe-area-inset-right,0px))!important;
  bottom:calc(87px + env(safe-area-inset-bottom,0px))!important;
  z-index:9300!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  gap:9px!important;
  min-width:0!important;
  width:auto!important;height:auto!important;
  min-height:44px!important;
  padding:11px 16px!important;
  margin:0!important;
  border:2px solid #ffffff!important;
  border-radius:999px!important;
  background:#07304e!important;
  color:#ffffff!important;
  font:700 13px/1.2 system-ui,-apple-system,"Segoe UI",Arial,sans-serif!important;
  text-transform:none!important;
  white-space:nowrap!important;
  box-shadow:0 3px 0 #0d789d,0 8px 24px rgba(0,28,49,.35)!important;
  cursor:pointer!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translate3d(0,12px,0)!important;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
}
html body .mr-backtop-v332.mr-backtop-visible{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateZ(0)!important;
}
html body .mr-backtop-v332 .mr-backtop-arrow{
  display:inline-block!important;
  color:#ffffff!important;
  font-size:19px!important;
  line-height:1!important;
  font-weight:800!important;
}
html body .mr-backtop-v332 .mr-backtop-label{
  display:inline-block!important;
  color:#ffffff!important;
  font-size:13px!important;
  line-height:1.2!important;
  letter-spacing:0!important;
}
html body .mr-backtop-v332:hover{background:#0d536f!important}
html body .mr-backtop-v332:focus-visible{
  outline:3px solid #eab94f!important;
  outline-offset:3px!important;
}
html body:has(.mr3-nav.mr-mobile-open) .mr-backtop-v332{
  visibility:hidden!important;
  pointer-events:none!important;
}
@media(max-width:767px){
  html body .mr-backtop-v332{
    right:calc(14px + env(safe-area-inset-right,0px))!important;
    bottom:calc(98px + env(safe-area-inset-bottom,0px))!important;
    min-height:43px!important;
    padding:10px 13px!important;
    gap:7px!important;
  }
  html body .mr-backtop-v332 .mr-backtop-label{font-size:12px!important}
}
@media(prefers-reduced-motion:reduce){
  html body .mr-backtop-v332{transition:none!important}
}

/* v334 — Atlas breadcrumb, readable and responsive across species templates. */
html body .invert-crumb,
html body .coral-crumb,
html body .atlas-species-page .crumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  column-gap:.4em;
  row-gap:.3em;
  overflow-wrap:anywhere;
  line-height:1.5;
}
html body .invert-crumb a,
html body .coral-crumb,
html body .atlas-species-page .crumb a{
  color:#ffffff;
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:#e8bf5b;
}
html body .invert-crumb a:hover,
html body .coral-crumb,
html body .atlas-species-page .crumb a:hover{color:#ffd87c;}
html body .invert-crumb a:focus-visible,
html body .coral-crumb,
html body .atlas-species-page .crumb a:focus-visible{
  outline:2px solid #ffd87c;
  outline-offset:3px;
}
@media(max-width:640px){
  html body .invert-crumb,html body .coral-crumb,
html body .atlas-species-page .crumb{font-size:.875rem;}
}
