/* BrowseRP house creatives on community pages only. Paid campaign artwork and
   the shared advert controls keep their existing rendering and behavior. */
:root body #server-detail-v3 .server-house-ad-v12 {
  --house-accent: #72dcea;
  --house-glow: #126a83;
}
:root body #server-detail-v3 .server-house-ad-v12[data-house-theme="frontier"] {
  --house-accent: #ffbd83;
  --house-glow: #a64a35;
}
:root body #server-detail-v3 .server-house-ad-v12[data-house-theme="worlds"] {
  --house-accent: #c5bbff;
  --house-glow: #6249a1;
}
:root body #server-detail-v3 .server-house-ad-v12 .side-ad-stage-v3 {
  isolation: isolate;
  min-height: clamp(350px, 50cqi, 440px);
  border-radius: 20px;
  background: #102434;
  box-shadow: inset 0 0 0 1px #ffffff25, 0 16px 45px #03091344;
}
:root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .side-ad-shade-v3 {
  background: linear-gradient(90deg, #061421ee 0%, #071927bc 38%, #07192718 85%),
    linear-gradient(0deg, #06142188, transparent 56%);
}
:root body #server-detail-v3 .server-house-brand-v12 {
  display: none;
  position: absolute;
  z-index: 2;
  top: 24px;
  left: 30px;
  width: 154px;
  max-width: 44%;
  height: auto;
  filter: drop-shadow(0 2px 7px #06142199);
}
:root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .server-house-brand-v12 { display: block; }
:root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .side-ad-copy-v3 {
  max-width: 360px;
  margin-right: auto;
  padding-block: 74px 30px;
}
:root body #server-detail-v3 .server-house-ad-v12 .side-ad-copy-v3 strong {
  max-width: 17ch;
  font-size: clamp(24px, 2.3vw, 32px);
  line-height: 1.12;
}
:root body #server-detail-v3 .server-house-ad-v12 .side-ad-copy-v3 span {
  font-size: 15px;
  line-height: 1.55;
}
:root body #server-detail-v3 .server-house-ad-v12 .side-ad-copy-v3 a {
  width: fit-content;
  color: var(--house-accent);
  border-bottom-color: var(--house-accent);
  font-weight: 800;
}
/* A browser may block /assets/adverts/. The house message then remains a
   designed, theme-specific branded panel without trying another image URL. */
:root body #server-detail-v3 .server-house-ad-v12.artwork-unavailable .side-ad-stage-v3 {
  min-height: 340px;
  background: radial-gradient(circle at 85% 8%, var(--house-glow), transparent 54%),
    linear-gradient(135deg, #182b3b, #101b2b 65%, #0a1724);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--house-accent) 35%, transparent);
}
:root body #server-detail-v3 .server-house-ad-v12.artwork-unavailable .side-ad-image-notice-v3 {
  position: relative;
  z-index: 1;
}
:root body #server-detail-v3 .server-house-ad-v12.artwork-unavailable .side-ad-image-notice-v3 img { width: 160px; }
:root body #server-detail-v3 .server-house-ad-v12.artwork-unavailable .side-ad-copy-v3 :is(strong, span) { color: #fff; }
:root body #server-detail-v3 .server-house-ad-v12.artwork-unavailable .side-ad-copy-v3 a { color: var(--house-accent); }

@container (max-width: 480px) {
  :root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .side-ad-stage-v3 {
    min-height: max(410px, 120cqi);
  }
  :root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .side-ad-image-v3 {
    height: 100%;
    object-fit: cover;
    object-position: 68% center;
  }
  :root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .side-ad-shade-v3 {
    background: linear-gradient(180deg, #06142122 12%, #06142188 47%, #061421f2 100%);
  }
  :root body #server-detail-v3 .server-house-ad-v12 .server-house-brand-v12 { top: 18px; left: 18px; width: 140px; }
  :root body #server-detail-v3 .server-house-ad-v12:not(.artwork-unavailable) .side-ad-copy-v3 {
    align-self: end;
    max-width: none;
    padding: 115px 6px 4px;
  }
  :root body #server-detail-v3 .server-house-ad-v12 .side-ad-copy-v3 strong { font-size: 25px; }
}
