.promotion-placement { width: 100%; max-width: 970px; margin: 24px auto 32px; }
.promotion-disclosure { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; color: #9caeae; font-size: 9px; font-weight: 600; letter-spacing: 2px; }
.promotion-disclosure::after { content: ''; height: 1px; flex: 1; background: linear-gradient(90deg, #43504d, transparent); }
.promotion-visual { position: relative; isolation: isolate; display: flex; align-items: center; width: 100%; min-height: 180px; overflow: hidden; border: 1px solid #89734a; border-radius: 2px; background: #0a1519; color: #f4e9ca; text-decoration: none; }
.promotion-visual::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #071114e8 0%, #071114c7 35%, #0711142b 72%, #07111415); }
.promotion-visual::after { content: ''; position: absolute; inset: 5px; border: 1px solid #d4b56638; pointer-events: none; }
.promotion-visual:hover { border-color: #d1b16e; color: #fff5d7; }
.promotion-visual:focus-visible { outline: 3px solid var(--gold-light, #e6cf98); outline-offset: 4px; }
.promotion-scene { position: absolute; inset: 0; z-index: -2; display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% 53%; }
.promotion-content { display: flex; align-items: center; gap: 26px; width: 100%; padding: 26px 38px; }
.promotion-server-logo { display: block; flex: 0 0 96px; width: 96px; height: 96px; object-fit: contain; filter: drop-shadow(0 3px 10px #0008); }
.promotion-identity { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; max-width: 650px; }
.promotion-kicker { color: #e4d3a8; font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: 2px; text-transform: uppercase; }
.promotion-identity strong { display: block; margin: 3px 0 12px; font: 600 clamp(24px, 3vw, 40px)/1.1 var(--heading); text-shadow: 0 2px 6px #000b; overflow-wrap: anywhere; }
.promotion-cta { display: inline-flex; align-items: center; gap: 18px; padding: 7px 12px; border: 1px solid #bca064; background: #c1a363; color: #111b1d; font-size: 11px; font-weight: 800; line-height: 1.4; }
.promotion-visual-custom { display: block; min-height: 0; }
.promotion-visual-custom::before, .promotion-visual-custom::after { display: none; }
.promotion-uploaded-art { display: block; width: 100%; height: auto; }
.promotion-demo { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.promotion-artwork-preview { margin: 12px 0; padding: 8px; background: #080e11; border: 1px solid var(--border); }
.promotion-artwork-preview img { display: block; width: 100%; height: auto; }
.promotion-artwork-preview [hidden] { display: none; }
.promotion-artwork-preview figcaption { margin-top: 7px; color: var(--muted); font-size: 11px; }
.promotion-artwork-note { font-size: 12px; color: var(--muted); }
@media(max-width:600px) {
    .promotion-placement { margin-block: 18px 24px; }
    .promotion-visual:not(.promotion-visual-custom) { min-height: 154px; }
    .promotion-content { padding: 22px 20px; gap: 15px; }
    .promotion-server-logo { flex-basis: 64px; width: 64px; height: 64px; }
    .promotion-kicker { font-size: 9px; letter-spacing: 1px; }
    .promotion-identity strong { font-size: 26px; margin-block: 6px 12px; }
    .promotion-visual::before { background: linear-gradient(90deg, #071114e8, #0711148a); }
}
@media(max-width:360px) {
    .promotion-content { padding: 20px 16px; gap: 12px; }
    .promotion-server-logo { flex-basis: 48px; width: 48px; height: 48px; }
    .promotion-identity strong { font-size: 23px; }
}