/* DnD HUB — shared chrome for the full-screen public sections. */

/* Page headers must never render as rectangular panels. Keep only ornaments. */
.hub-section-page-head{
  background:transparent!important;
  border-top:0!important;
  border-left:0!important;
  border-right:0!important;
  outline:0!important;
  box-shadow:none!important;
}
#hubModal.shop-route-page:has(#shopRoot) #hubModalClose{
  display:none!important;
}

#hubRacesPage .hub-races-page-head,
#hubAdventuresPage .hub-adventures-page-head,
.hub-classes-native-head,
body:not(.hub-public-home) #squadsView>.section-title{
  position:relative!important;
  min-height:108px!important;
  margin:0 0 18px!important;
  padding:22px max(18px,5vw) 20px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  grid-template-rows:1fr!important;
  align-items:center!important;
  border:0!important;
  border-bottom:1px solid rgba(173,129,51,.62)!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
}

#hubRacesPage .hub-races-page-head::after,
#hubAdventuresPage .hub-adventures-page-head::after,
.hub-classes-native-head::after,
body:not(.hub-public-home) #squadsView>.section-title::after{
  content:''!important;
  position:absolute!important;
  left:34px!important;
  right:34px!important;
  bottom:-1px!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(173,129,51,.72) 16%,rgba(225,181,87,.92) 50%,rgba(173,129,51,.72) 84%,transparent)!important;
}

#hubRacesPage .hub-races-page-head::before,
#hubAdventuresPage .hub-adventures-page-head::before,
.hub-classes-native-head::before,
body:not(.hub-public-home) #squadsView>.section-title::before{
  content:'◆'!important;
  position:absolute!important;
  left:50%!important;
  bottom:-9px!important;
  z-index:2!important;
  transform:translateX(-50%) scaleX(.78)!important;
  color:#d9aa4c!important;
  font:17px/1 Georgia,serif!important;
  text-shadow:0 2px 8px #000,0 0 12px rgba(217,170,76,.35)!important;
}

#hubRacesPage .hub-races-page-head h1,
#hubAdventuresPage .hub-adventures-page-title,
.hub-classes-native-head h2,
body:not(.hub-public-home) #squadsView>.section-title h1{
  grid-column:2!important;
  grid-row:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:20px!important;
  min-width:0!important;
  margin:0!important;
  color:#e7bf66!important;
  font:700 clamp(27px,2.15vw,34px)/1.08 Georgia,serif!important;
  letter-spacing:.105em!important;
  text-transform:uppercase!important;
  text-align:center!important;
  text-shadow:0 2px 2px #000,0 5px 18px rgba(0,0,0,.78),0 0 20px rgba(199,148,50,.10)!important;
}

#hubRacesPage .hub-races-page-head h1::before,
#hubRacesPage .hub-races-page-head h1::after,
#hubAdventuresPage .hub-adventures-page-title::before,
#hubAdventuresPage .hub-adventures-page-title::after,
.hub-classes-native-head h2::before,
.hub-classes-native-head h2::after,
body:not(.hub-public-home) #squadsView>.section-title h1::before,
body:not(.hub-public-home) #squadsView>.section-title h1::after{
  content:''!important;
  flex:1 1 100px!important;
  max-width:170px!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,#a87b2c)!important;
}

#hubRacesPage .hub-races-page-head h1::after,
#hubAdventuresPage .hub-adventures-page-title::after,
.hub-classes-native-head h2::after,
body:not(.hub-public-home) #squadsView>.section-title h1::after{
  background:linear-gradient(90deg,#a87b2c,transparent)!important;
}

#hubAdventuresPage .hub-adventures-page-heading{grid-column:2!important}
#hubAdventuresPage .hub-adventures-page-kicker{display:none!important}
body:not(.hub-public-home) #squadsView>.section-title>.spacer{display:none!important}
body:not(.hub-public-home) #squadsView>.section-title #newSquad{
  grid-column:3!important;
  grid-row:1!important;
  justify-self:end!important;
}
#hubRacesPage .hub-race-picker-title{
  margin:0 0 10px!important;
  color:#a88a55!important;
  font:400 12px/1.4 Georgia,serif!important;
  letter-spacing:.22em!important;
  text-align:center!important;
  text-transform:uppercase!important;
}

@media(max-width:700px){
  body:not(.hub-public-home)>main.wrap:has(>#hubRacesPage:not(.hidden)),
  body:not(.hub-public-home)>main.wrap:has(>#hubAdventuresPage:not(.hidden)),
  body:not(.hub-public-home)>main.wrap:has(>#classesView:not(.hidden)),
  body:not(.hub-public-home)>main.wrap:has(>#squadsView:not(.hidden)){
    padding:78px 10px 22px!important;
  }
  #hubRacesPage .hub-races-page-head,
  #hubAdventuresPage .hub-adventures-page-head,
  .hub-classes-native-head,
  body:not(.hub-public-home) #squadsView>.section-title{
    min-height:84px!important;
    margin-bottom:14px!important;
    padding:14px 12px 15px!important;
  }
  #hubRacesPage .hub-races-page-head::after,
  #hubAdventuresPage .hub-adventures-page-head::after,
  .hub-classes-native-head::after,
  body:not(.hub-public-home) #squadsView>.section-title::after{
    left:18px!important;
    right:18px!important;
  }
  #hubRacesPage .hub-races-page-head h1,
  #hubAdventuresPage .hub-adventures-page-title,
  .hub-classes-native-head h2,
  body:not(.hub-public-home) #squadsView>.section-title h1{
    gap:10px!important;
    font-size:20px!important;
    letter-spacing:.07em!important;
  }
  #hubRacesPage .hub-races-page-head h1::before,
  #hubRacesPage .hub-races-page-head h1::after,
  #hubAdventuresPage .hub-adventures-page-title::before,
  #hubAdventuresPage .hub-adventures-page-title::after,
  .hub-classes-native-head h2::before,
  .hub-classes-native-head h2::after,
  body:not(.hub-public-home) #squadsView>.section-title h1::before,
  body:not(.hub-public-home) #squadsView>.section-title h1::after{
    max-width:42px!important;
  }
  body:not(.hub-public-home) #squadsView>.section-title #newSquad{
    grid-column:1 / -1!important;
    grid-row:2!important;
    justify-self:center!important;
    margin-top:8px!important;
  }
  body:not(.hub-public-home) #squadsView>.section-title{
    min-height:128px!important;
    grid-template-rows:auto auto!important;
  }
}