/* =========================================================
   AD SIMULATOR — decorative "sponsor" banners
   All creatives are fictional placeholder brands (no real
   trademarks/logos). Every ad click returns to this site —
   nothing here ever navigates off-domain.
   ========================================================= */

.adsim-slot {
    position: fixed;
    z-index: 60;
    opacity: 0;
    pointer-events: none;
    transition: opacity .6s ease, transform .6s cubic-bezier(.25,.8,.25,1);
}
.adsim-slot.adsim-visible {
    opacity: 1;
    pointer-events: auto;
}

/* ---- fixed viewport slots ---- */
#adsim-top      { top: 8px;  left: 50%; transform: translate(-50%, -20px); }
#adsim-top.adsim-visible      { transform: translate(-50%, 0); }

#adsim-left     { bottom: 90px; left: 12px; transform: translateX(-30px); }
#adsim-left.adsim-visible     { transform: translateX(0); }

#adsim-right    { bottom: 90px; right: 12px; transform: translateX(30px); }
#adsim-right.adsim-visible    { transform: translateX(0); }

#adsim-mobile   { bottom: 0; left: 0; right: 0; transform: translateY(30px); }
#adsim-mobile.adsim-visible   { transform: translateY(0); }

@media (max-width: 900px) {
    #adsim-left, #adsim-right { display: none; }
}
@media (min-width: 901px) {
    #adsim-mobile { display: none; }
}

/* ---- in-content slots (sit inline inside the page flow) ---- */
.adsim-incontent {
    display: flex;
    justify-content: center;
    margin: 34px auto;
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .6s ease, transform .6s ease;
    min-height: 40px;
}
.adsim-incontent.adsim-visible { opacity: 1; transform: translateY(0); }

/* ---- the ad card itself ---- */
.adsim-card {
    position: relative;
    display: block;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(0,0,0,0.45);
    border: 1px solid rgba(255,255,255,0.08);
    background: #111;
    cursor: pointer;
}
.adsim-card svg { display: block; width: 100%; height: 100%; }

.adsim-badge {
    position: absolute;
    top: 6px;
    left: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    letter-spacing: .06em;
    color: rgba(255,255,255,0.85);
    background: rgba(0,0,0,0.45);
    padding: 2px 6px;
    border-radius: 4px;
    pointer-events: none;
    text-transform: uppercase;
}

.adsim-close {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(0,0,0,0.55);
    color: #fff;
    border: none;
    font-size: 11px;
    line-height: 18px;
    text-align: center;
    cursor: pointer;
    z-index: 2;
}
.adsim-close:hover { background: rgba(0,0,0,0.85); }

/* subtle "loading next ad" shimmer while a slot is empty */
.adsim-slot:not(.adsim-visible) .adsim-card,
.adsim-incontent:not(.adsim-visible) .adsim-card { visibility: hidden; }