
.vlpa-post-ads {
    --vlpa-gap: clamp(18px, 2vw, 34px);
    pointer-events: none;
}

.vlpa-ad-rail {
    position: fixed;
    top: var(--vlpa-top-offset, 120px);
    z-index: 35;
    width: max-content;
    max-width: 1200px;
    display: grid;
    gap: 16px;
    max-height: calc(100vh - 160px);
    overflow-y: auto;
    scrollbar-width: thin;
    pointer-events: auto;
}

.vlpa-ad-rail--left,
.vlpa-ad-rail--right {
    left: 0;
    right: auto;
}

.vlpa-ad-card {
    width: min(var(--vlpa-card-width, 871px), var(--vlpa-available-width, 871px));
    max-width: min(1200px, calc(100vw - 24px));
    overflow: hidden;
    border: 1px solid rgba(229, 9, 34, .30);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(15, 17, 21, .98), rgba(5, 6, 8, .99));
    color: #fff;
    box-shadow: 0 8px 30px rgba(0,0,0,.32), 0 0 18px rgba(229,9,34,.08);
}

.vlpa-ad-label {
    padding: 8px 10px 0;
    color: #a8acb4;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.vlpa-ad-image-link {
    display: block;
}

.vlpa-ad-image {
    display: block;
    width: 100%;
    width: 100%;
    aspect-ratio: 871 / 1307;
    height: auto;
    max-height: var(--vlpa-image-height, 1307px);
    object-fit: cover;
    background: #090a0d;
}

.vlpa-ad-body {
    padding: 13px;
}

.vlpa-ad-body h3 {
    margin: 0 0 11px;
    color: #fff;
    font-size: 17px;
    line-height: 1.05;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.vlpa-ad-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 38px;
    padding: 9px 11px;
    border: 1px solid #e50922;
    border-radius: 5px;
    background: #e50922;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-decoration: none;
    text-transform: uppercase;
    transition: filter .16s ease, transform .16s ease, box-shadow .16s ease;
}

.vlpa-ad-button:hover,
.vlpa-ad-button:focus-visible {
    color: #fff;
    filter: brightness(1.12);
    transform: translateY(-1px);
    box-shadow: 0 0 18px rgba(229,9,34,.38);
    outline: none;
}

/* Floating rails are positioned beside the actual article by JavaScript.
   If the viewport cannot fit the requested panel size beside the article,
   the rail is automatically hidden to avoid covering the content. */

/* Side ad panels are intentionally desktop-only. */
@media (max-width: 1179px) {
    .vlpa-post-ads {
        display: none !important;
    }
}


/* v1.2.0 - 871x1307 default creative and reliable vertical offset */
.vlpa-ad-rail {
    top: var(--vlpa-top-offset, 120px) !important;
    max-height: calc(100vh - var(--vlpa-top-offset, 120px) - 16px);
}

.vlpa-ad-card {
    --vlpa-card-width: 871px;
    --vlpa-image-height: 1307px;
}

.vlpa-ad-image {
    aspect-ratio: 871 / 1307;
}

/* The rail is allowed to shrink when there isn't room for a full 871px card.
   It never overlaps the article. */
.vlpa-ad-rail.is-scaled .vlpa-ad-card {
    width: var(--vlpa-available-width);
}
