/* Yamkage JuicyAds: dedicated premium ad placements */
.yf-ad-wrap{box-sizing:border-box;max-width:100%;margin:22px auto;padding:12px 14px 15px;border:1px solid rgba(139,113,218,.25);border-radius:18px;background:var(--card,#131c2d);box-shadow:0 9px 30px rgba(10,12,30,.08);text-align:center;overflow:hidden}
.yf-ad-caption{display:block;font-size:10px;letter-spacing:.13em;text-transform:uppercase;opacity:.65;margin-bottom:9px;color:var(--muted,#8e9bb1)}
.yf-ad-slot{display:flex;justify-content:center;align-items:center;margin:auto;max-width:100%;overflow:hidden}
.yf-ad-slot-908{width:908px;height:258px}.yf-ad-slot-300{width:300px;height:250px}.yf-ad-slot-mobile{width:300px;height:100px}
.yf-ad-leaderboard{width:min(958px,calc(100% - 32px))}.yf-ad-sidebar{width:100%;margin:16px auto}.yf-ad-mobile{display:none}
@media(max-width:767px){.yf-ad-leaderboard,.yf-ad-sidebar{display:none!important}.yf-ad-mobile{display:block;width:min(340px,calc(100% - 24px));margin:20px auto}.yf-ad-wrap{padding:10px 9px 13px}}
@media(min-width:768px) and (max-width:1050px){.yf-ad-sidebar{display:none!important}}
@media(prefers-color-scheme:light){.yf-ad-wrap{background:var(--card,#fff)}}

/* Keep the 908px billboard within its card; switch to mobile slot on narrow screens. */
@media (min-width:768px) and (max-width:989px){.yf-ad-leaderboard{display:none!important}.yf-ad-mobile{display:block;width:min(340px,calc(100% - 24px));margin:20px auto}}

/* Billboard: align outer frame with main site content, retain native 908x258 creative */
body .yf-ad-wrap.yf-ad-leaderboard{box-sizing:border-box!important;width:min(1500px,calc(100% - 40px))!important;max-width:1500px!important;min-height:308px!important;margin:24px auto!important;padding:16px 20px 20px!important;display:flex;flex-direction:column;align-items:center;justify-content:center}
body .yf-ad-leaderboard .yf-ad-slot-908{width:908px;max-width:100%;height:258px;flex:0 0 258px}
@media(max-width:989px){body .yf-ad-wrap.yf-ad-leaderboard{display:none!important}}
@media(min-width:990px) and (max-width:1050px){body .yf-ad-wrap.yf-ad-leaderboard{width:calc(100% - 32px)!important;padding-inline:10px!important}}

/* Gallery advertising after the first twelve artworks; never above the artwork. */
.yf-gallery-ad-break{grid-column:1/-1;display:flex;justify-content:center;align-items:center;padding:12px 0 18px;min-width:0}
.yf-gallery-ad-break .yf-ad-gallery{width:min(344px,100%);margin:0 auto;padding:12px 14px 15px}
.yf-ad-sidebar{margin-top:18px}
@media(max-width:767px){.yf-gallery-ad-break{display:none!important}}

/* Hide empty sidebar ad cards without blocking filled ad placements. */
.yf-ad-sidebar.yf-ad-unfilled{display:none!important}
.yf-ad-sidebar.yf-ad-filled{display:block}


/* Generic slots from yf_ad(): 468x60 banner and standalone 300x250 show on desktop only; phones get the 300x100 */
.yf-ad-wrap.yf-ad-banner468{display:none}
@media (min-width:990px){.yf-ad-wrap.yf-ad-banner468{display:flex;flex-direction:column;align-items:center;gap:6px;width:min(500px,calc(100% - 32px));margin:22px auto;padding:9px 0 10px;box-sizing:border-box}.yf-ad-slot-468{width:468px;height:60px}}
.yf-ad-wrap.yf-ad-banner468 .yf-ad-caption{margin:0}
.yf-ad-wrap.yf-ad-profile{margin:6px auto 18px}
main>.yf-ad-wrap.yf-ad-gallery,section>.yf-ad-wrap.yf-ad-gallery{width:min(344px,100%);margin:22px auto}
@media (max-width:989px){main>.yf-ad-wrap.yf-ad-gallery{display:none!important}}

/* ===== 728x90 leaderboard on the artwork page, between the artwork details and Conversations ===== */
.yf-ad-leader{display:none}
@media (min-width:900px){
.yf-ad-wrap.yf-ad-leader{display:block;width:auto;max-width:none;margin:24px 0;padding:14px 18px 18px;text-align:center;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:0 14px 34px -30px rgba(10,14,40,.7)}
.yf-ad-leader .yf-ad-slot-728{width:728px;max-width:100%;min-height:90px;margin:0 auto;overflow:hidden;border-radius:10px}
}
@media (min-width:701px){.yf-ad-wrap.yf-ad-art-mobile{display:none!important}}

@media (min-width:900px){.yf-ad-wrap.yf-ad-leader{border-radius:22px;background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 5%,var(--panel)),var(--panel) 70%)}.yf-ad-leader .yf-ad-caption{display:block;margin:0 0 10px}.yf-ad-leader .yf-ad-slot-728{min-height:90px}}

/* ===== Wide 728x90 card that matches the page width (Notifications, Leaderboards) ===== */
@media (min-width:900px){.yf-ad-wrap.yf-ad-leader.yf-ad-wide{margin:0 0 20px;box-sizing:border-box;width:100%}}
.yf-ad-leader.yf-ad-wide+.yf-ad-wrap.yf-ad-wide-mobile{margin:0 auto 18px}
@media (min-width:701px){.yf-ad-wrap.yf-ad-wide-mobile{display:none!important}}
@media (min-width:701px) and (max-width:899px){.yf-ad-wrap.yf-ad-wide-mobile{display:block!important;width:min(340px,100%);margin:0 auto 18px}}
@media (min-width:900px){.yf-ad-wrap.yf-ad-leader.yf-ad-fr{margin:0 0 22px}}

/* ===== Phones: ad card as wide as the content cards, theme colours, and empty slots collapse ===== */
@media (max-width:700px){.yf-ad-wrap.yf-ad-mobile{width:auto!important;max-width:none!important;margin:0 0 16px!important;box-sizing:border-box;background:var(--panel)!important;border:1px solid var(--line)!important}}
.yf-ad-wrap.yf-ad-unfilled,.yf-ad-wrap.yf-ad-blocked{display:none!important}
@media (min-width:900px){.yf-ad-wrap.yf-ad-leader.yf-ad-studio{margin:26px 0 22px}}

/* For You: wide ad inside the feed, across the whole row */
.yf-feed-wide-break{grid-column:1/-1;min-width:0;width:100%}
.yf-feed-wide-break>.yf-ad-wrap{margin:6px 0 10px!important}
@media (min-width:900px){.yf-feed-wide-break>.yf-ad-wrap.yf-ad-leader{display:block!important;width:100%!important;box-sizing:border-box}}
/* End-of-feed ad: 468x60 in a full-width card on desktop, 300x250 on phones */
.yf-ad-wrap.yf-ad-end-wide{display:block;width:100%;box-sizing:border-box;margin:22px 0 6px;padding:12px 14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--panel);text-align:center}
.yf-ad-wrap.yf-ad-end-wide .yf-ad-slot-468{width:468px;max-width:100%;min-height:60px;margin:0 auto}
.yf-ad-wrap.yf-ad-end-mobile{display:none}
@media (max-width:700px){.yf-ad-wrap.yf-ad-end-wide{display:none!important}.yf-ad-wrap.yf-ad-end-mobile{display:block!important;width:auto;margin:18px 0 6px;padding:12px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}.yf-ad-end-mobile .yf-ad-slot-300{width:300px;max-width:100%;margin:0 auto}}
/* 908x258 zone: full-width card, only where it fits; phones/tablets get the 300x250 instead */
.yf-ad-wrap.yf-ad-big{display:none}
@media (min-width:1000px){.yf-ad-wrap.yf-ad-big.yf-ad-end-big{display:block;width:100%;box-sizing:border-box;margin:22px 0 6px;padding:12px 14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--panel);text-align:center}.yf-ad-big .yf-ad-slot-900{width:908px;max-width:100%;min-height:258px;margin:0 auto;overflow:hidden;border-radius:10px}}
@media (min-width:701px) and (max-width:999px){.yf-ad-wrap.yf-ad-end-mobile{display:block!important;width:auto;margin:18px 0 6px;padding:12px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}.yf-ad-end-mobile .yf-ad-slot-300{width:300px;max-width:100%;margin:0 auto}}
/* Top ad placed inside the page container, right above the title card */
.yf-ad-wrap.yf-ad-top{grid-column:1/-1;box-sizing:border-box}
@media (min-width:900px){.yf-ad-wrap.yf-ad-leader.yf-ad-top{width:100%;max-width:none;margin:0 0 20px}}
