/*
  House Navigation — shared system
  Single authoritative stylesheet for House navigation, breadcrumbs, menu trigger,
  dropdown panel, link alignment, focus/hover states, and mobile behavior.

  Boundary:
  - room-shell.css owns the House Frame, page atmosphere, brand block, room stage, and footer.
  - house-navigation.css alone owns the shared navigation system.
  - Page-specific room styles must not redefine .house-navigation, .house-crumbs, .house-menu,
    .house-menu__trigger, or .house-menu__panel.
*/

.house-navigation {
  position: relative;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(1rem, 2vw, 2rem);
  min-width: 0;
  padding-top: 0.35rem;
  font: 700 0.62rem/1.4 var(--house-ui, Arial, Helvetica, sans-serif);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  pointer-events: auto;
}

.chamber-shell > header .house-navigation,
.portal-header .house-navigation {
  position: fixed;
  top: clamp(1.25rem, 3vw, 2.6rem);
  right: clamp(1rem, 4vw, 3.9rem);
  max-width: calc(100vw - 2rem);
}

.house-crumbs {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem 0.65rem;
  color: var(--house-faint, rgba(238, 232, 220, 0.46));
}

.house-crumbs a,
.house-menu__panel a {
  color: inherit;
  text-decoration: none;
}

.house-crumbs a:hover,
.house-crumbs a:focus-visible {
  color: var(--house-gold, #d7b96f);
}

.house-crumbs [aria-current="page"] {
  color: var(--house-gold-bright, #f0d596);
}

.house-menu {
  position: relative;
  pointer-events: auto;
}

.house-menu summary,
.house-menu__trigger {
  color: var(--house-gold, #d7b96f);
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}

.house-menu summary::-webkit-details-marker,
.house-menu__trigger::-webkit-details-marker {
  display: none;
}

.house-menu summary::after,
.house-menu__trigger::after {
  content: " +";
}

.house-menu[open] summary::after,
.house-menu[open] .house-menu__trigger::after {
  content: " −";
}

.house-menu__panel {
  position: absolute;
  top: 100%;
  right: 0;
  width: max-content;
  max-width: calc(100vw - 2rem);
  padding: 0.75rem 0.9375rem;
  border: 0;
  background: rgba(2, 3, 7, 0.20);
  box-shadow: none;
  text-align: right;
}

.house-menu__panel a {
  display: block;
  padding: 0.58rem 0;
  border-bottom: 0;
  color: var(--house-ivory-muted, rgba(238, 232, 220, 0.7));
  text-align: right;
  white-space: nowrap;
}

.house-menu__panel a:hover,
.house-menu__panel a:focus-visible {
  color: var(--house-gold-bright, #f0d596);
}

.house-frame__brand:focus-visible,
.house-crumbs a:focus-visible,
.house-menu summary:focus-visible,
.house-menu__trigger:focus-visible,
.house-menu__panel a:focus-visible {
  outline: 1px solid var(--house-gold, #d7b96f);
  outline-offset: 0.35rem;
}

@media (max-width: 640px) {
  .house-navigation {
    gap: 0.75rem;
    padding-top: 0.1rem;
  }

  .house-crumbs {
    display: none;
  }

  .chamber-shell > header .house-navigation,
  .portal-header .house-navigation {
    top: 1.15rem;
    right: 1rem;
  }

  .house-menu__panel {
    position: absolute;
    top: 100%;
    right: 0;
  }
}


@media print {
  .house-navigation {
    display: none;
  }
}
