/* Hollow public portal, 2026-09-16. Shared compact artwork and layout.
   Administrative pages and authentication behaviour are intentionally untouched. */
:root { --portal-gap: 20px; }

/* Centre the primary links against the viewport, not the remaining auth space.
   fitHeader() checks symmetric side clearance before enabling this layout. */
.topPanel.is-wide .site-nav .menu {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%); width: max-content;
}
.topPanel.is-wide .site-nav { margin-left: auto; }
.topPanel .topPanel-wrapper { min-height: 68px; }

/* The actual artwork is separate from live copy, so neither can obscure the other. */
body .wrapper .site-hero {
  width: min(var(--max), calc(100% - 32px)); min-height: 0;
  margin: 20px auto 0; padding: 0; overflow: hidden;
  border: 1px solid rgba(209,168,95,.28); border-radius: 10px;
  background: #101218;
  box-shadow: 0 12px 36px rgba(0,0,0,.24);
}
body .wrapper .site-hero::before,
body .wrapper .site-hero::after { content: none; }
.portal-banner { display: block; width: 100%; height: 210px; overflow: hidden; }
.portal-banner img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
body .wrapper .site-hero .hero-content {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto; align-items: center; align-content: center;
  justify-items: stretch; width: 100%; max-width: none; min-height: 0;
  margin: 0; padding: 18px 24px; gap: 24px; text-align: left;
}
body .wrapper .site-hero .hero-copy {
  width: auto; max-width: none; margin: 0; padding: 0; align-self: center;
  text-align: left; background: none; border: 0; box-shadow: none; animation: none;
}
body .wrapper .site-hero .hero-tagline { margin: 0 0 12px; max-width: 64ch; font-size: 14px; line-height: 1.55; }
body .wrapper .site-hero .hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; margin: 0; }
body .wrapper .site-hero .hero-actions .button { min-height: 40px; padding: 9px 15px; font-size: 13px; line-height: 1.45; }
body .wrapper .site-hero .war-room {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: center; align-self: center; justify-self: stretch;
  gap: 10px 14px; width: auto; max-width: none; min-height: 0;
  margin: 0; padding: 0 0 0 24px; border: 0; border-left: 1px solid rgba(209,168,95,.2);
  border-radius: 0; background: none; box-shadow: none; animation: none; transform: none;
}
body .wrapper .site-hero .war-room::before,
body .wrapper .site-hero .war-room::after { content: none; }
body .wrapper .site-hero .war-room .status-pill { margin: 0; min-height: 30px; font-size: 12px; padding: 6px 8px; justify-content: center; text-align: center; }
body .wrapper .site-hero .war-room .metric { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin: 0; padding: 0; border: 0; }
body .wrapper .site-hero .war-room .metric span { font-size: 11px; line-height: 1.4; }
body .wrapper .site-hero .war-room .metric strong { font-size: 25px; line-height: 1.1; }
body .wrapper .site-hero .faction-balance { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(40px, 1fr) auto; align-items: center; gap: 10px; margin: 0; padding: 0; }
body .wrapper .site-hero .faction-balance > span,
body .wrapper .site-hero .faction-balance > strong { font-size: 11px; line-height: 1.4; margin: 0; }
body .wrapper .site-hero .balance-bar { height: 6px; margin: 0; }
body .wrapper .site-hero .status-updated { grid-column: 1 / -1; margin: 0; font-size: 10px; line-height: 1.4; }
.portal-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Public inner pages share one compact banner, title rail and spacing scale. */
body .wrapper .page-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto;
  align-items: center; gap: 0; min-height: 0; margin: 0 0 22px; padding: 0;
  border: 1px solid rgba(209,168,95,.28); border-radius: 10px;
  background: #101218; overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.2);
}
body .wrapper .page-hero::before {
  content: ''; display: block; position: relative; inset: auto; z-index: auto;
  grid-column: 1 / -1; width: 100%; height: 180px; min-height: 0;
  margin: 0; padding: 0; opacity: 1; transform: none; filter: none;
  background: var(--page-art) center / cover no-repeat; border-bottom: 1px solid rgba(209,168,95,.17);
  animation: none; pointer-events: none;
}
body .wrapper .page-hero::after { content: none; }
body .wrapper .page-hero__copy { width: 100%; max-width: none; padding: 16px 24px; margin: 0; }
body .wrapper .page-hero__copy :is(.eyebrow,.page-hero__eyebrow) { display: block; margin: 0 0 4px; font-size: 10px; line-height: 1.4; letter-spacing: .14em; }
body .wrapper .page-hero__copy h1 { max-width: none; margin: 0 0 6px; font-size: clamp(26px,2.4vw,34px); line-height: 1.15; }
body .wrapper .page-hero__copy > p:not(.eyebrow) { max-width: 78ch; margin: 0; font-size: 14px; line-height: 1.55; }
body .wrapper .page-hero > :is(.shop-login-card,.shop-balance-card) { grid-column: 2; grid-row: 2; align-self: center; margin: 14px 24px 14px 0; padding: 12px; max-width: 100%; }
body .wrapper .page-hero__sigil { display: none; }
.portal-utility-banner {
  width: min(var(--max), calc(100% - 32px)); height: 160px; margin: 20px auto 0;
  border: 1px solid rgba(209,168,95,.28); border-radius: 10px;
  background: var(--page-art) center / cover no-repeat;
}
body .wrapper :is(.home-page,.page-shell) { width: min(var(--max), calc(100% - 32px)); margin: 0 auto; padding: 22px 0 54px; top: auto; transform: none; }
body .wrapper .page-shell > .container { width: 100%; max-width: none; margin: 0; padding: 0; }
body .wrapper .page-shell > .container > .content { padding-inline: 0; }

/* Natural-height homepage rows; no old negative overlap or 590px news minimum. */
body .wrapper .home-grid { display: grid; grid-template-columns: minmax(250px,.72fr) minmax(0,1.75fr); gap: var(--portal-gap); grid-auto-flow: row; align-items: stretch; }
body .wrapper .home-grid .news-panel { grid-column: 1 / -1; min-height: 0; height: auto; padding: 22px 24px; background: #101218; }
body .wrapper .home-grid .panel-title { display: block; margin-bottom: 12px; }
body .wrapper .home-grid .panel-title .eyebrow { margin: 0 0 6px; }
body .wrapper .home-grid .panel-title h2 { margin: 0; }
body .wrapper .home-grid .home-side-stack { grid-column: 1; display: block; min-height: 0; }
body .wrapper .home-grid .grb-panel { height: 100%; min-height: 0; }
body .wrapper .home-grid .boss-preview { grid-column: 2; min-height: 0; }
body .wrapper .home-grid .feature-strip { grid-column: 1 / -1; }
body .wrapper .home-grid .tab-panel.is-active { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 14px; }
body .wrapper .home-grid .news-row { min-height: 0; margin: 0; padding: 14px 0 0; border-top: 1px solid rgba(209,168,95,.2); }
body .wrapper .home-grid .news-row h3 { font-size: 22px; margin: 6px 0 8px; line-height: 1.25; }
body .wrapper .home-grid .news-row p { font-size: 14px; line-height: 1.65; }
body .wrapper .home-grid .boss-preview-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-top: 14px; }
body .wrapper .home-grid .boss-tile { padding: 12px; background: #151820; border: 1px solid rgba(209,168,95,.14); border-radius: 6px; }
body .wrapper .home-grid .boss-tile strong { font-size: 17px; line-height: 1.25; }
body .wrapper .home-grid .boss-tile span,
body .wrapper .home-grid .boss-tile b { font-size: 11px; line-height: 1.5; }
body .wrapper .home-grid .boss-tile time { font-size: 20px; }
body .wrapper .home-grid .feature-strip__items { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
body .wrapper .home-grid .feature-strip__items img { height: 105px; width: 100%; object-fit: cover; }
body .wrapper .home-grid .feature-strip__items a { min-height: 0; }
body .wrapper .home-grid .feature-strip__items span { padding: 10px 12px; font-size: 15px; }
body .wrapper .panel { border-radius: 8px; }
body .wrapper .realm-ribbon { margin: 0 auto 36px; gap: 16px; }
body .wrapper .realm-card { min-height: 0; padding: 22px; }
body .wrapper .site-footer { padding-top: 30px; padding-bottom: 30px; }

/* Boss controls and summaries wrap instead of pinching neighbouring cards. */
body .wrapper .boss-page-header { flex-wrap: wrap; gap: 14px; }
body .wrapper .boss-controls { display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,.4fr); gap: 12px; }
body .wrapper .boss-controls :is(input,select) { width: 100%; max-width: 100%; min-width: 0; }
body .wrapper .boss-card-header { flex-wrap: wrap; gap: 10px; }
body .wrapper .boss-identity { min-width: 0; }
body .wrapper .boss-title { overflow-wrap: anywhere; }
body .wrapper .boss-status { max-width: 100%; white-space: normal; }
body .wrapper .boss-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
body .wrapper .ranking-hero { min-height: 0; padding: 20px 24px; }
body .wrapper .ranking-board__header { padding-block: 18px; }

@media (max-width: 1060px) {
  body .wrapper .site-hero .hero-content { grid-template-columns: 1fr; gap: 16px; }
  body .wrapper .site-hero .hero-copy { display: flex; align-items: center; gap: 18px; }
  body .wrapper .site-hero .hero-tagline { flex: 1 1 50%; margin: 0; }
  body .wrapper .site-hero .war-room { padding: 14px 0 0; border-left: 0; border-top: 1px solid rgba(209,168,95,.2); grid-template-columns: repeat(3,minmax(0,1fr)); }
  body .wrapper .home-grid { grid-template-columns: 1fr; }
  body .wrapper .home-grid :is(.home-side-stack,.boss-preview) { grid-column: 1; }
  body .wrapper .home-grid .grb-panel { height: auto; }
}
@media (max-width: 700px) {
  body .wrapper :is(.site-hero,.home-page,.page-shell,.portal-utility-banner) { width: calc(100% - 24px); }
  body .wrapper .site-hero { margin-top: 12px; }
  .portal-banner { height: 120px; }
  body .wrapper .site-hero .hero-content { padding: 16px; }
  body .wrapper .site-hero .hero-copy { display: block; }
  body .wrapper .site-hero .hero-tagline { margin-bottom: 12px; }
  body .wrapper .site-hero .hero-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  body .wrapper .site-hero .hero-actions .button { padding-inline: 8px; font-size: 12px; }
  body .wrapper .site-hero .war-room { gap: 10px; }
  body .wrapper .site-hero .faction-balance { gap: 6px; }
  body .wrapper .site-hero .faction-balance > :is(span,strong) { font-size: 10px; }
  body .wrapper .page-hero { grid-template-columns: minmax(0,1fr); margin-bottom: 18px; }
  body .wrapper .page-hero::before { height: 112px; }
  body .wrapper .page-hero__copy { padding: 14px 16px; }
  body .wrapper .page-hero__copy h1 { font-size: 27px; }
  body .wrapper .page-hero > :is(.shop-login-card,.shop-balance-card) { grid-column: 1; grid-row: auto; justify-self: stretch; margin: 0 16px 16px; }
  body .wrapper :is(.home-page,.page-shell) { padding: 18px 0 36px; }
  .portal-utility-banner { height: 112px; margin-top: 12px; }
  body .wrapper .home-grid { gap: 16px; }
  body .wrapper .home-grid .news-panel { padding: 18px 16px; }
  body .wrapper .home-grid .tab-panel.is-active { grid-template-columns: 1fr; gap: 12px; }
  body .wrapper .home-grid .boss-preview-grid,
  body .wrapper .home-grid .feature-strip__items { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body .wrapper .home-grid .feature-strip__items img { height: 85px; }
  body .wrapper .boss-controls { grid-template-columns: minmax(0,1fr); }
  body .wrapper .boss-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body .wrapper .ranking-hero { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .portal-banner, .page-hero, .site-hero { animation: none; transition: none; }
}

/* Rendered QA corrections: neutralise the old, more-specific compact-hero rules. */
body .wrapper .page-shell .page-hero {
  min-height: 0; height: auto; padding: 0; align-content: start;
  grid-template-rows: max-content auto; grid-auto-rows: max-content;
}
body .wrapper .page-hero::before { height: 160px; }
body .wrapper .page-hero__copy :is(.eyebrow,.page-hero__eyebrow) { display: none; }
body .wrapper .site-hero .hero-tagline {
  width: 100%; max-width: 64ch; padding: 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; text-align: left;
}
body .wrapper .site-hero .hero-tagline::before,
body .wrapper .site-hero .hero-tagline::after { content: none; }
body .wrapper .site-hero .hero-actions { max-width: 100%; }
body .wrapper .site-hero .war-room .status-pill { grid-column: auto; justify-self: stretch; white-space: normal; }
body .wrapper .site-hero .war-room .metric { min-height: 0; }
body .wrapper .page-hero > :is(.shop-login-card,.shop-balance-card) {
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
  justify-content: space-between; width: auto; min-width: 0; gap: 8px 12px;
  padding: 10px 12px; border-radius: 6px;
}
@media (max-width: 700px) {
  body .wrapper .page-hero::before { height: 100px; }
  body .wrapper .page-hero__copy { padding: 12px 16px; }
  body .wrapper .page-hero__copy h1 { font-size: 25px; }
  body .wrapper .page-hero__copy > p:not(.eyebrow) { font-size: 13px; line-height: 1.5; }
  body .wrapper .page-hero > :is(.shop-login-card,.shop-balance-card) { max-width: calc(100% - 32px); }
  body .wrapper .site-hero .hero-tagline { max-width: 100%; font-size: 13px; }
  body .wrapper .site-hero .war-room .status-pill { font-size: 10px; padding: 5px; }
}

/* Screenshot review: protect the logotype on each artwork and remove empty rows. */
body .wrapper .page-hero[style*="hollow-bosses-20260916"]::before { background-position: center 85%; }
body .wrapper .page-hero[style*="hollow-community-20260916"]::before,
body .wrapper .portal-utility-banner { background-position: center top; }
body.is-motion-ready .wrapper [data-reveal] { opacity: 1; transform: none; }
body .wrapper .home-grid { grid-template-rows: none; grid-template-areas: none; }
body .wrapper .home-grid .panel h2 { font-size: clamp(27px,2.5vw,34px); line-height: 1.15; }
body .wrapper .home-grid .news-panel { position: relative; }
body .wrapper .home-grid .news-panel .panel-title { padding-right: 250px; margin-bottom: 20px; }
body .wrapper .home-grid .news-panel .tab-controls { position: absolute; right: 24px; top: 24px; gap: 8px; }
body .wrapper .home-grid .tab-panel.is-active { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: stretch; gap: 16px; }
body .wrapper .home-grid #home-panel-events.is-active { grid-template-columns: repeat(2,minmax(0,1fr)); }
body .wrapper .home-grid .news-row {
  display: flex; flex-direction: column; grid-row: auto; grid-column: auto;
  gap: 0; margin: 0; padding: 16px; min-height: 0;
  border: 1px solid rgba(209,168,95,.17); border-radius: 6px;
  background: #14171e; align-self: stretch;
}
body .wrapper .home-grid .news-row--featured { border-color: rgba(209,168,95,.35); background: linear-gradient(125deg,rgba(209,168,95,.1),#14171e); }
body .wrapper .home-grid .news-row time { display: block; padding: 0; margin: 0 0 9px; font-size: 11px; }
body .wrapper .home-grid .news-row h3 { margin: 0 0 12px; font-size: 20px; line-height: 1.25; }
body .wrapper .home-grid .news-row p { margin: 0; font-size: 13px; line-height: 1.6; }
@media (max-width: 1060px) {
  body .wrapper .home-grid .news-panel .panel-title { padding-right: 0; margin-bottom: 14px; }
  body .wrapper .home-grid .news-panel .tab-controls { position: static; justify-content: flex-start; }
  body .wrapper .home-grid .tab-panel.is-active,
  body .wrapper .home-grid #home-panel-events.is-active { grid-template-columns: minmax(0,1fr); }
}

/* Align the four highlights; remove the legacy stagger and tall empty image panels. */
body .wrapper .home-grid .feature-strip__items { align-items: stretch; min-height: 0; height: auto; grid-auto-rows: auto; }
body .wrapper .home-grid .feature-strip__items > a {
  display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start;
  height: auto; min-height: 0; aspect-ratio: auto; padding: 0;
  transform: none; margin: 0; overflow: hidden;
}
body .wrapper .home-grid .feature-strip__items > a::before,
body .wrapper .home-grid .feature-strip__items > a::after { content: none; }
body .wrapper .home-grid .feature-strip__items img {
  position: static; inset: auto; height: 105px; min-height: 105px; max-height: 105px;
  width: 100%; transform: none; object-fit: cover; opacity: 1;
}
body .wrapper .home-grid .feature-strip__items span {
  position: static; inset: auto; display: block; flex: 1; width: 100%;
  padding: 12px; background: #11141a; line-height: 1.4;
}
body .wrapper .home-grid :is(.grb-panel,.boss-preview) { padding: 20px; }
body .wrapper .home-grid .grb-panel h2 { margin-bottom: 16px; }
body .wrapper .home-grid .grb-panel .stat-line {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 0; margin: 0; gap: 10px;
}
body .wrapper .home-grid .grb-panel .stat-line span { font-size: 11px; line-height: 1.5; }
body .wrapper .home-grid .grb-panel .stat-line strong { font-size: 18px; line-height: 1.4; text-align: right; white-space: nowrap; }
body .wrapper .home-grid .grb-panel > p:last-child { margin: 12px 0 0; font-size: 13px; line-height: 1.6; }
@media (max-width: 700px) {
  body .wrapper .home-grid .feature-strip__items img { height: 85px; min-height: 85px; max-height: 85px; }
}
