/* VII Creation · House chrome
   Active fixed-navigation, opening-boundary and compact context rules. */

/* Opening-boundary rules for the fixed House chrome.
   Sports: glass begins when Chapter I reaches the fixed chrome.
   Community: glass begins on the first real scroll movement.
   Studio: glass begins when Studio Index follows the opening surface. */
body:is([data-view="sports"],[data-view="community"],[data-view="studio"]):not(.vii-nav-past-opening):not(.hall-open) .house-nav {
  background:transparent !important;
  border-bottom-color:transparent !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .house-nav {
  transition:background .52s ease,border-color .52s ease,box-shadow .52s ease,-webkit-backdrop-filter .52s ease,backdrop-filter .52s ease !important;
}

/* Sports and Community use the same contained context row as the approved Studio chrome.
   The location trail is physically part of the fixed House bar, never a floating line below it. */
body:is([data-view="sports"],[data-view="community"]) {
  --nav-context-h:1.55rem;
  --header-h:calc(var(--nav-main-h) + var(--nav-context-h) + var(--safe-t));
}
body:is([data-view="sports"],[data-view="community"]) .house-nav {
  height:calc(var(--nav-main-h) + var(--nav-context-h) + var(--safe-t)) !important;
  grid-template-rows:var(--nav-main-h) var(--nav-context-h) !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
body:is([data-view="sports"],[data-view="community"]) .location-trail {
  position:static !important;
  grid-column:1 / -1 !important;
  grid-row:2 !important;
  align-self:center !important;
  justify-self:start !important;
  width:100% !important;
  height:var(--nav-context-h) !important;
  min-height:0 !important;
  padding:0 0 .12rem !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  color:rgba(247,244,238,.82) !important;
}
body:is([data-view="sports"],[data-view="community"]) .location-trail button,
body:is([data-view="sports"],[data-view="community"]) .location-trail a,
body:is([data-view="sports"],[data-view="community"]) .location-trail__segment,
body:is([data-view="sports"],[data-view="community"]) .location-trail [aria-current="page"] {
  color:rgba(247,244,238,.86) !important;
}

/* When Central Hall is open the bar remains Midnight Navy, so the context trail stays light. */
body:is([data-view="sports"],[data-view="community"]).hall-open .location-trail,
body:is([data-view="sports"],[data-view="community"]).hall-open .location-trail button,
body:is([data-view="sports"],[data-view="community"]).hall-open .location-trail a,
body:is([data-view="sports"],[data-view="community"]).hall-open .location-trail__segment,
body:is([data-view="sports"],[data-view="community"]).hall-open .location-trail [aria-current="page"] {
  color:rgba(247,244,238,.92) !important;
}

@media (max-width:640px){
  body:is([data-view="sports"],[data-view="community"]){--nav-context-h:1.55rem;}
  body:is([data-view="sports"],[data-view="community"]) .location-trail{
    padding-bottom:0 !important;
  }
}

/* Match Sports and Community chrome spacing to the approved Studio dimensions. */
@media (min-width: 721px) {
  body:is([data-view="sports"],[data-view="community"]) {
    --nav-main-h: 5rem;
    --nav-context-h: 0rem;
    --header-h: calc(var(--nav-main-h) + var(--safe-t));
  }
  body:is([data-view="sports"],[data-view="community"]) .house-nav {
    height: var(--header-h) !important;
    grid-template-rows: var(--nav-main-h) 0rem !important;
    overflow: visible !important;
  }
  body:is([data-view="sports"],[data-view="community"]) .location-trail {
    height: auto !important;
    min-height: 0 !important;
    align-self: center !important;
    padding: 0 0 .72rem !important;
  }
}

@media (max-width: 720px) {
  body:is([data-view="sports"],[data-view="community"]) {
    --nav-main-h: 4.35rem;
    --nav-context-h: 1.8rem;
    --header-h: 4.85rem;
  }
  body:is([data-view="sports"],[data-view="community"]) .house-nav {
    height: var(--header-h) !important;
    grid-template-rows: var(--nav-main-h) var(--nav-context-h) !important;
    overflow: visible !important;
  }
  body:is([data-view="sports"],[data-view="community"]) .location-trail {
    height: var(--nav-context-h) !important;
    min-height: 0 !important;
    align-self: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}
@media (min-width: 721px) {
  body:is([data-view="sports"],[data-view="community"]) .location-trail {
    line-height: 1.55 !important;
  }
}
@media (max-width: 720px) {
  body:is([data-view="sports"],[data-view="community"]) .location-trail {
    line-height: 1.6 !important;
  }
}

/* Preserve Studio parity across tablet breakpoints. */
@media (min-width: 821px) and (max-width: 900px) {
  body:is([data-view="sports"],[data-view="community"]) {
    --nav-main-h: 4.8rem;
    --nav-context-h: 0rem;
    --header-h: calc(var(--nav-main-h) + var(--safe-t));
  }
  body:is([data-view="sports"],[data-view="community"]) .house-nav {
    height: var(--header-h) !important;
    grid-template-rows: var(--nav-main-h) 0rem !important;
  }
}

@media (min-width: 721px) and (max-width: 820px) {
  body:is([data-view="sports"],[data-view="community"]) {
    --nav-main-h: 4.35rem;
    --nav-context-h: 1.8rem;
    --header-h: calc(var(--nav-main-h) + var(--nav-context-h) + var(--safe-t));
  }
  body:is([data-view="sports"],[data-view="community"]) .house-nav {
    height: var(--header-h) !important;
    grid-template-rows: var(--nav-main-h) var(--nav-context-h) !important;
  }
  body:is([data-view="sports"],[data-view="community"]) .location-trail {
    height: var(--nav-context-h) !important;
    padding: 0 0 .35rem !important;
    line-height: 1.55 !important;
  }
}

/* House chrome parity and compact context containment. */

/* FAQ / About desktop optical centering.
   The glyph and right action need a tiny optical drop to sit visually level with the menu mark. */
@media (min-width: 901px) {
  body:is([data-view="about"],[data-view="faq"]) .house-seal,
  body:is([data-view="about"],[data-view="faq"]) .house-nav__right {
    align-self: center !important;
    transform: translateY(.16rem);
  }
}

/* Phone + tablet: keep the public-room/service bar compact while containing the context trail
   inside the same Midnight Navy glass surface. */
@media (max-width: 900px), (pointer: coarse) and (max-width: 1024px) {
  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) {
    --nav-main-h: 5rem;
    --nav-context-h: 0rem;
    --header-h: calc(5rem + var(--safe-t));
  }

  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .house-nav {
    height: var(--header-h) !important;
    grid-template-rows: 1fr !important;
    align-items: center !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) :is(.hall-trigger,.house-seal,.house-nav__right) {
    grid-row: 1 !important;
    align-self: center !important;
  }

  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail {
    position: absolute !important;
    z-index: 2 !important;
    left: calc(var(--pad) + var(--safe-l)) !important;
    right: calc(var(--pad) + var(--safe-r)) !important;
    top: auto !important;
    bottom: calc(.28rem + var(--safe-b)) !important;
    grid-row: auto !important;
    grid-column: auto !important;
    width: calc(100% - var(--pad) - var(--pad) - var(--safe-l) - var(--safe-r)) !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-self: stretch !important;
    gap: .42rem !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    line-height: 1.05 !important;
  }

  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail > button,
  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail a,
  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail__segment,
  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail__segment:last-child,
  body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail__segment:last-child > :last-child {
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    line-height: inherit !important;
  }
}

/* Eligible touch devices use a 1200 CSS-pixel desktop composition in landscape.
   Keep House chrome physically compact and keep the whole context trail on one line. */
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) {
  --nav-main-h: 5rem !important;
  --nav-context-h: 0rem !important;
  --header-h: calc(5rem + var(--safe-t)) !important;
}
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .house-nav {
  height: var(--header-h) !important;
  grid-template-rows: 1fr !important;
  align-items: center !important;
  overflow: hidden !important;
}
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) :is(.hall-trigger,.house-seal,.house-nav__right) {
  grid-row: 1 !important;
  align-self: center !important;
}
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail {
  position: absolute !important;
  left: calc(var(--pad) + var(--safe-l)) !important;
  right: calc(var(--pad) + var(--safe-r)) !important;
  top: auto !important;
  bottom: calc(.28rem + var(--safe-b)) !important;
  width: calc(100% - var(--pad) - var(--pad) - var(--safe-l) - var(--safe-r)) !important;
  max-width: none !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-self: stretch !important;
  gap: .42rem !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  line-height: 1.05 !important;
}
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail > button,
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail a,
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail__segment,
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail__segment:last-child,
html.vii-touch-landscape-desktop body:is([data-view="sports"],[data-view="community"],[data-view="studio"]) .location-trail__segment:last-child > :last-child {
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
  line-height: inherit !important;
}

/* Central Hall breathing room on Studio, About and FAQ without changing the drawer design. */
@media (max-width: 720px) and (orientation: portrait) {
  body:is([data-view="studio"], [data-view="about"], [data-view="faq"])
  .hall--drawer .nav-drawer__grid {
    row-gap: clamp(3.05rem, 8.4vw, 3.7rem) !important;
  }
  body:is([data-view="studio"], [data-view="about"], [data-view="faq"])
  .hall--drawer .nav-drawer__section + .nav-drawer__section {
    margin-top: 0 !important;
  }
}

@media (min-width: 721px) and (max-width: 1180px) and (orientation: portrait) {
  body:is([data-view="studio"], [data-view="about"], [data-view="faq"])
  .hall--drawer .nav-drawer__grid {
    row-gap: clamp(3.2rem, 5.8vh, 4.35rem) !important;
  }
  body:is([data-view="studio"], [data-view="about"], [data-view="faq"])
  .hall--drawer .nav-drawer__section + .nav-drawer__section {
    margin-top: 0 !important;
  }
}

/* RP137.13 · safe-area roof only.
   Do not alter House chrome geometry or breadcrumb positioning. The approved RP137.11
   header layout remains intact. Once the dark fixed chrome is active, extend an opaque
   Midnight Navy roof above the bar so scrolled content can never reappear in the iOS/
   Android status-bar area. */
body:is([data-view="sports"],[data-view="community"],[data-view="studio"]).vii-nav-past-opening .house-nav::after,
body:is([data-view="sports"],[data-view="community"],[data-view="studio"]).hall-open .house-nav::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: max(var(--safe-t), 3.5rem);
  background: #06071a;
  pointer-events: none;
  z-index: 0;
}
/* RP137.18 · mobile breadcrumb / hamburger axis lock.
   Desktop geometry is untouched. On phone portrait, align the breadcrumb text with
   the visible left edge of the hamburger bars, not with the broader navigation hit
   target. On eligible touch-landscape layouts, use the same House editorial axis and
   give the trail the full header width so the current room (including About VII / FAQ)
   cannot be clipped after the slash. */
@media (max-width: 720px) and (orientation: portrait) {
  body:not([data-view="threshold"]) .location-trail {
    left: calc(var(--vii-phone-x) + var(--safe-l) + .515rem) !important;
    right: calc(var(--vii-phone-x) + var(--safe-r)) !important;
  }

  body:is([data-view="about"],[data-view="faq"]) .location-trail {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    padding-left: .515rem !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }
}

html.vii-touch-landscape-desktop body:not([data-view="threshold"]) .location-trail {
  position: absolute !important;
  z-index: 2 !important;
  left: calc(var(--house-editorial-axis) + var(--safe-l)) !important;
  right: calc(var(--house-editorial-axis) + var(--safe-r)) !important;
  top: auto !important;
  bottom: calc(.28rem + var(--safe-b)) !important;
  grid-row: auto !important;
  grid-column: auto !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  padding-inline: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]):not(.vii-house-nav-dark) .location-trail,
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]):not(.vii-house-nav-dark) .location-trail button,
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]):not(.vii-house-nav-dark) .location-trail a,
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]):not(.vii-house-nav-dark) .location-trail__segment,
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]):not(.vii-house-nav-dark) .location-trail [aria-current="page"] {
  color: rgba(17,18,20,.84) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* RP137.19 · touch-landscape breadcrumb vertical seat + portrait safe-area closure.
   Preserve the approved horizontal breadcrumb axis exactly as RP137.18.
   On touch-landscape, safe-area-inset-bottom belongs to the device home-indicator edge,
   not to the top House chrome, so it must not lift the breadcrumb away from the divider.
   On portrait Sports / Community / Studio, seal only the top safe-area strip above the
   fixed House bar so scrolled page copy cannot reappear behind the iOS status area. */
html.vii-touch-landscape-desktop body:not([data-view="threshold"]) .location-trail {
  bottom: .28rem !important;
}

@media (max-width: 900px) and (orientation: portrait) {
  body:is([data-view="sports"],[data-view="community"],[data-view="studio"])::before {
    content: "";
    position: fixed;
    z-index: 101;
    top: 0;
    left: 0;
    right: 0;
    height: max(var(--safe-t), 3.5rem);
    background: #06071a;
    pointer-events: none;
  }
}

/* RP137.20 · final light-trail contrast on touch-landscape.
   Keep the approved breadcrumb geometry untouched. About VII and FAQ use the ecru
   House chrome in this orientation, so the current segment must remain dark even if
   an inherited scroll-state class would otherwise turn only that segment light. */
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]) .location-trail [aria-current="page"],
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]) .location-trail__segment:last-child,
html.vii-touch-landscape-desktop body:is([data-view="about"],[data-view="faq"]) .location-trail__segment:last-child > * {
  color: rgba(17,18,20,.84) !important;
  opacity: 1 !important;
  visibility: visible !important;
}
