/* Oloropa O4 public header recenter rescue
   Fixes package/story/destination public headers drifting right when older
   scroll-state rules overwrite translateX(-50%) with translateY(0). */
:root{
  --ol-o4-header-top:clamp(10px,1.25vw,18px);
  --ol-o4-header-width:min(1210px,calc(100vw - 34px));
  --ol-o4-header-radius:999px;
}
html,body{width:100%;max-width:100%;overflow-x:hidden!important;}
body[data-ol-o4-header-rescue="active"]{overflow-x:hidden!important;}
body[data-ol-o4-header-rescue="active"] .p11-shell,
body[data-ol-o4-header-rescue="active"] main,
body[data-ol-o4-header-rescue="active"] .pd-shell,
body[data-ol-o4-header-rescue="active"] .pk4-shell,
body[data-ol-o4-header-rescue="active"] .story-shell,
body[data-ol-o4-header-rescue="active"] .ol14-main,
body[data-ol-o4-header-rescue="active"] .p13-shell{
  max-width:100vw!important;
  overflow-x:clip!important;
}
body[data-ol-o4-header-rescue="active"] header.ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"] .ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"] header.ol-cc-header,
body[data-ol-o4-header-rescue="active"] .ol-cc-header{
  position:fixed!important;
  inset-inline:auto!important;
  left:50%!important;
  right:auto!important;
  top:var(--ol-o4-header-top)!important;
  width:var(--ol-o4-header-width)!important;
  max-width:var(--ol-o4-header-width)!important;
  margin:0!important;
  transform:translate3d(-50%,var(--ol-o4-header-y,0),0)!important;
  translate:none!important;
  z-index:2147483000!important;
  box-sizing:border-box!important;
  transform-origin:center top!important;
  overflow:visible!important;
  contain:none!important;
}
/* These older public-refactor rules were the actual drift cause: they set
   transform:translateY(0) while left:50% remains active, leaving the header
   starting at the viewport midpoint. Re-apply the X-centering for each state. */
body[data-ol-o4-header-rescue="active"].ol-p1-scroll-up header.ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"].ol-p1-scroll-up .ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"] body.ol-p1-scroll-up .ol-cc-header[data-ol-phase1-header="command-bar"],
body[data-ol-o4-header-rescue="active"] .ol-cc-header[data-ol-phase1-header="command-bar"].is-compact,
body[data-ol-o4-header-rescue="active"] .ol-cc-header[data-ol-phase1-header="command-bar"].is-scrolled,
body[data-ol-o4-header-rescue="active"] .ol-cc-header.is-compact,
body[data-ol-o4-header-rescue="active"] .ol-cc-header.is-scrolled{
  transform:translate3d(-50%,var(--ol-o4-header-y,0),0)!important;
}
body[data-ol-o4-header-rescue="active"].ol-p1-scroll-down:not(.ol-p1-drawer-open) header.ol-cc-header[data-oloropa-concierge-header].ol-p1-can-hide,
body[data-ol-o4-header-rescue="active"].ol-p1-scroll-down:not(.ol-p1-drawer-open) .ol-cc-header[data-oloropa-concierge-header].ol-p1-can-hide{
  --ol-o4-header-y:-124%;
  transform:translate3d(-50%,var(--ol-o4-header-y),0)!important;
}
body[data-ol-o4-header-rescue="active"].ol-p1-scroll-up header.ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"].ol-p1-scroll-up .ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"]:not(.ol-p1-scroll-down) header.ol-cc-header[data-oloropa-concierge-header],
body[data-ol-o4-header-rescue="active"]:not(.ol-p1-scroll-down) .ol-cc-header[data-oloropa-concierge-header]{
  --ol-o4-header-y:0;
  transform:translate3d(-50%,0,0)!important;
}
body[data-ol-o4-header-rescue="active"] .ol-cc-header .ol-cc-nav{
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
}
body[data-ol-o4-header-rescue="active"] .ol-cc-header .ol-cc-actions{
  min-width:max-content!important;
  flex:0 0 auto!important;
}
@media (min-width:1321px){
  body[data-ol-o4-header-rescue="active"] header.ol-cc-header[data-oloropa-concierge-header],
  body[data-ol-o4-header-rescue="active"] .ol-cc-header[data-oloropa-concierge-header],
  body[data-ol-o4-header-rescue="active"] header.ol-cc-header,
  body[data-ol-o4-header-rescue="active"] .ol-cc-header{
    grid-template-columns:minmax(255px,.85fr) minmax(0,auto) minmax(220px,max-content)!important;
    gap:clamp(10px,1.1vw,16px)!important;
  }
}
@media (max-width:1320px){
  :root{--ol-o4-header-width:min(980px,calc(100vw - 22px));}
  body[data-ol-o4-header-rescue="active"] .ol-cc-header .ol-cc-nav{display:none!important;}
  body[data-ol-o4-header-rescue="active"] .ol-cc-header .ol-cc-menu-button{display:inline-flex!important;}
  body[data-ol-o4-header-rescue="active"] header.ol-cc-header[data-oloropa-concierge-header],
  body[data-ol-o4-header-rescue="active"] .ol-cc-header[data-oloropa-concierge-header],
  body[data-ol-o4-header-rescue="active"] header.ol-cc-header,
  body[data-ol-o4-header-rescue="active"] .ol-cc-header{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
}
@media (max-width:760px){
  :root{--ol-o4-header-top:10px;--ol-o4-header-width:calc(100vw - 18px);--ol-o4-header-radius:26px;}
  body[data-ol-o4-header-rescue="active"] header.ol-cc-header[data-oloropa-concierge-header],
  body[data-ol-o4-header-rescue="active"] .ol-cc-header[data-oloropa-concierge-header],
  body[data-ol-o4-header-rescue="active"] header.ol-cc-header,
  body[data-ol-o4-header-rescue="active"] .ol-cc-header{
    border-radius:var(--ol-o4-header-radius)!important;
    padding:8px 9px!important;
  }
  body[data-ol-o4-header-rescue="active"] .ol-cc-header .ol-cc-cta{display:none!important;}
}
@supports not (overflow:clip){
  body[data-ol-o4-header-rescue="active"] .p11-shell,
  body[data-ol-o4-header-rescue="active"] main{overflow-x:hidden!important;}
}