/* The head bootstrap covers first paint; without JS all information stays visible. */
html.av-cards-pending body .post-1 .item-in:not(.av-card-reveal) > .post-info,
body .post-1 .item-in.av-card-reveal > .post-info {
    position: absolute; inset: auto 0 0; max-height: calc(100% - 40px);
    padding: 24px 16px 14px; overflow: auto; scrollbar-width: thin;
    pointer-events: auto; overscroll-behavior: contain;
    background: linear-gradient(180deg, transparent, rgba(15,17,25,.26) 45%, rgba(15,17,25,.62));
}
/* Extra text needs a little more contrast only while the details are open. */
body .post-1 .item-in.av-card-reveal.av-card-open > .post-info {
    background: linear-gradient(180deg, transparent, rgba(15,17,25,.42) 38%, rgba(15,17,25,.72));
}
html.av-cards-pending body .post-1 .item-in:not(.av-card-reveal) > .post-info h2,
body .post-1 .av-card-reveal .post-info h2 { font-weight: 500; font-size: 15px; }
html.av-cards-pending body .post-1 .item-in:not(.av-card-reveal) > .post-info > :not(h2) { display: none !important; }
body .post-1 .av-card-details[hidden] { display: none !important; }
body .post-1 .av-card-reveal .post-info > [hidden] { display: none !important; }
body .post-1 .av-card-details { overflow: hidden; display: flow-root; }
body .post-1 .av-card-reveal .post-pay-type { right: 58px; }
body .post-1 .av-card-reveal .post-pay-type > div { pointer-events: none; }
body .post-1 button.av-card-more {
    position: absolute; top: 10px; right: 10px; z-index: 4;
    min-width: 40px; min-height: 32px; padding: 4px 8px; margin: 0;
    font-size: 11px; line-height: 1.3; color: #fff; cursor: pointer;
    background: rgba(18,20,28,.6); border: 1px solid rgba(255,255,255,.3); border-radius: 16px;
}
@media (hover: hover) and (pointer: fine) {
    body .post-1 button.av-card-more { opacity: 0; }
    body .post-1 .av-card-reveal:hover button.av-card-more,
    body .post-1 .av-card-reveal:focus-within button.av-card-more { opacity: 1; }
}
@media (max-width: 768px) {
    html.av-cards-pending body .post-1 .item-in:not(.av-card-reveal) > .post-info,
    body .post-1 .item-in.av-card-reveal > .post-info { padding: 22px 10px 11px; }
    html.av-cards-pending body .post-1 .item-in:not(.av-card-reveal) > .post-info h2,
    body .post-1 .av-card-reveal .post-info h2 { font-size: 14px; }
    body .post-1 button.av-card-more { top: 6px; right: 6px; }
}