/* V5.7: illustration is only a default. An owner's image stays untouched. */
.server-banner.banner-generated{height:106px;min-height:106px;isolation:isolate;border:1px solid #97784b;border-radius:4px;background:radial-gradient(ellipse at 70% 85%,hsl(var(--hue) 36% 30%),transparent 70%),linear-gradient(110deg,#121622,hsl(var(--hue) 35% 14%));box-shadow:inset 0 0 18px #0005;color:#f8e3ae}
.server-banner.banner-generated:after{z-index:2;inset:5px;border:1px solid #e1bc6b55;box-shadow:inset 0 0 0 2px #080d1640}
.banner-generated .banner-illustration{position:absolute;right:0;bottom:0;width:auto;height:100%;max-width:none;object-fit:contain;pointer-events:none;z-index:0;mask-image:linear-gradient(90deg,transparent,#000 18%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%)}
.banner-generated .banner-copy{width:72%;max-width:100%;padding:12px 26px;gap:5px;z-index:1;overflow:hidden;align-items:flex-start}
.banner-generated .banner-overline{font:700 8px/1.2 Arial,sans-serif;letter-spacing:3px;color:#dbc58f;text-shadow:0 1px 3px #000}
.banner-generated .banner-copy strong{font:700 34px/1.04 Georgia,'Times New Roman',serif;letter-spacing:1.4px;color:#fff0c1;text-shadow:0 2px 0 #654b2b,0 3px 8px #000;max-width:100%;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.banner-generated .banner-copy>.banner-flourish{display:flex;align-items:center;gap:8px;width:96px;max-width:100%;font-size:7px;line-height:1;color:#d5b871;margin:2px 0 0}
.banner-flourish:before,.banner-flourish:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#c4a166)}
.banner-flourish:after{transform:rotate(180deg)}
.banner-generated.banner-name-medium .banner-copy strong{font-size:25px;letter-spacing:.5px}
.banner-generated.banner-name-long .banner-copy strong{font-size:19px;letter-spacing:.2px}
.banner-theme-forest{--hue:165}.banner-theme-dawn{--hue:30}.banner-theme-moon{--hue:268}
.server-banner.banner-hero.banner-generated{height:156px;min-height:156px}
.banner-hero.banner-generated .banner-copy strong{font-size:40px}
.banner-hero.banner-name-medium .banner-copy strong{font-size:29px}
.banner-hero.banner-name-long .banner-copy strong{font-size:23px}

/* No canvas, crop, decoration or text overlay on a supplied PNG/GIF/JPG/WebP. */
.server-banner.banner-image{height:auto;min-height:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.server-banner.banner-image:after{display:none}
.banner-image>.banner-upload{position:static;display:block;width:auto;height:auto;max-width:100%;max-height:180px;object-fit:contain;margin:0 auto;background:transparent;z-index:auto}
.banner-image>.banner-upload[hidden],.banner-recovery[hidden]{display:none!important}
.banner-recovery{position:relative}
.banner-error-label{display:block;margin-top:5px;font-size:10px;line-height:1.4;color:var(--muted);text-align:center}

@media(max-width:540px){
  .server-banner.banner-generated{height:96px;min-height:96px}
  .banner-generated .banner-illustration{height:100%;opacity:.87;mask-image:linear-gradient(90deg,transparent,#000 55%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 55%)}
  .banner-generated .banner-copy{width:76%;padding:11px 15px;gap:6px}
  .banner-generated .banner-overline{font-size:6px;letter-spacing:1.8px}
  .banner-generated .banner-copy strong{font-size:24px;letter-spacing:.6px}
  .banner-generated.banner-name-medium .banner-copy strong{font-size:18px}
  .banner-generated.banner-name-long .banner-copy strong{font-size:14px;-webkit-line-clamp:3}
  .banner-generated .banner-copy>.banner-flourish{width:64px;font-size:6px}
  .server-banner.banner-hero.banner-generated{height:120px;min-height:120px}
}

/* V5.9: ad artwork inherits its slot; server banners keep the styles above. */
.ad-placement .server-banner.banner-generated,.ad-slot .server-banner.banner-generated,.ad-slot .server-banner.banner-image{width:100%;height:auto;min-height:0;aspect-ratio:var(--ad-ratio);margin:0;overflow:hidden}
.ad-slot .banner-image>.banner-upload{width:100%;height:100%;aspect-ratio:var(--ad-ratio);max-height:none;object-fit:contain}
.ad-slot .banner-recovery{width:100%;height:100%}
.ad-slot .banner-error-label{position:absolute;bottom:5%;left:5%;right:5%;margin:0;z-index:4;color:#fff;text-shadow:0 1px 3px #000}
.ad-placement .banner-generated .banner-copy,.ad-slot .banner-generated .banner-copy{position:absolute;inset:0;width:74%;height:auto;padding:1.1111cqw 2.5cqw;gap:.4167cqw;justify-content:center;align-items:flex-start;overflow:visible}
.ad-placement .banner-generated .banner-overline,.ad-slot .banner-generated .banner-overline{font-size:.9722cqw;line-height:1.2;letter-spacing:.2778cqw;flex:none}
.ad-placement .banner-generated .banner-copy strong,.ad-slot .banner-generated .banner-copy strong{font-size:3.8889cqw;line-height:1.04;letter-spacing:.0833cqw;max-width:100%;min-height:0;writing-mode:horizontal-tb;display:block;overflow:visible;overflow-wrap:anywhere;-webkit-line-clamp:unset;flex:none}
.ad-placement .banner-name-medium .banner-copy strong,.ad-slot .banner-name-medium .banner-copy strong{font-size:2.7778cqw;letter-spacing:.0278cqw}
.ad-placement .banner-name-long .banner-copy strong,.ad-slot .banner-name-long .banner-copy strong{font-size:1.9444cqw;letter-spacing:0}
.ad-placement .banner-generated .banner-copy>.banner-flourish,.ad-slot .banner-generated .banner-copy>.banner-flourish{width:11.1111cqw;max-width:100%;font-size:.6944cqw;line-height:1;gap:1.1111cqw;margin:0;flex:none}
.ad-placement .banner-generated .banner-illustration,.ad-slot .banner-generated .banner-illustration{opacity:1;mask-image:linear-gradient(90deg,transparent,#000 18%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%)}

.feature-ad--invitation .banner-generated{border-color:#b79a61;background:radial-gradient(ellipse at 68% 80%,#3f6656,transparent 68%),linear-gradient(110deg,#111f21,#254b43)}
.feature-ad--invitation .ad-cta{top:auto;bottom:1.6667cqw;right:2.5cqw;transform:none;z-index:3;padding:.9722cqw 1.6667cqw;border:1px solid #e7ce8e;background:linear-gradient(#71552bea,#3d2a1ef5);box-shadow:0 2px 5px #0006;color:#fff0c5;font-size:clamp(8px,1.5278cqw,11px);max-width:none;text-shadow:0 1px 1px #000}
.feature-ad--invitation:hover .ad-cta{background:#74552c}

.ad-placement--side .banner-generated .banner-illustration{width:100%;height:52.1739%;object-fit:cover;object-position:87% center;mask-image:linear-gradient(transparent,#000 25%);-webkit-mask-image:linear-gradient(transparent,#000 25%)}
.ad-placement--side .banner-generated .banner-copy{width:100%;padding:15cqw 8.3333cqw;justify-content:flex-start;gap:8.3333cqw}
.ad-placement--side .banner-generated .banner-copy strong{font-size:16.6667cqw;line-height:1.2;letter-spacing:0}
.ad-placement--side .banner-name-medium .banner-copy strong{font-size:13.3333cqw}
.ad-placement--side .banner-name-long .banner-copy strong{font-size:10.8333cqw}
.ad-placement--side .banner-generated .banner-overline{font-size:4.5833cqw;letter-spacing:.6667cqw;line-height:1.8}
.ad-placement--side .banner-generated .banner-copy>.banner-flourish{width:50cqw;font-size:4.5833cqw;gap:6.6667cqw}
.ad-placement--vacant .ad-vacancy-cta{position:absolute;left:8.3333cqw;right:8.3333cqw;bottom:13.3333cqw;z-index:3;padding:6.6667cqw 4.1667cqw;border:1px solid #e2c884;border-radius:3px;background:linear-gradient(#71552bf2,#3d2a1ef7);color:#fff0c5;text-shadow:0 1px 1px #000;font-size:8.3333cqw;font-weight:700;line-height:1.4;text-align:center}
.ad-placement--vacant a:hover .ad-vacancy-cta{background:#74552c}
.ad-placement--vacant .banner-generated .banner-copy strong{font-size:13.3333cqw;overflow-wrap:normal;word-break:normal}

.ad-placement--vote .banner-generated .banner-copy{width:80%;padding:6.875cqw 5.625cqw;gap:2.5cqw}
.ad-placement--vote .banner-generated .banner-copy strong{font-size:8.4375cqw}
.ad-placement--vote .banner-name-medium .banner-copy strong{font-size:6.5625cqw}
.ad-placement--vote .banner-name-long .banner-copy strong{font-size:5cqw}
.ad-placement--vote .banner-generated .banner-overline{font-size:2.1875cqw;letter-spacing:.625cqw}
.ad-placement--vote .banner-generated .banner-copy>.banner-flourish{width:25cqw;font-size:1.5625cqw;gap:2.5cqw}
