/* LastBro 454 – video preview behavior adapted from admin.zip.
   Only video presentation lives here. The feed stays Sketchy and the card has no
   artificial top spacer. Custom LastBro tokens are supported through data-lb. */

:is(.lb-video-poster-card,[data-lb~="lb-video-poster-card"],[data-lb-state~="lb-video-poster-card"]){
    appearance:none!important;
    -webkit-appearance:none!important;
    position:relative!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0 auto!important;
    overflow:hidden!important;
    border:2px solid #333333!important;
    border-radius:12px!important;
    background:#333333 url('/assets/video-default.jpg') center/cover no-repeat!important;
    color:inherit!important;
    line-height:0!important;
    box-shadow:none!important;
    cursor:pointer!important;
    aspect-ratio:var(--lb-video-aspect,16 / 9)!important;
}

:is([data-lb~="post-content"],[data-lb-state~="post-content"]) :is(.lb-video-poster-card,[data-lb~="lb-video-poster-card"],[data-lb-state~="lb-video-poster-card"]),
:is([data-lb~="post-content"],[data-lb-state~="post-content"]) video[data-lb-video-thumbnail]{
    display:block!important;
    width:min(100%,560px)!important;
    max-width:min(100%,560px)!important;
    margin:.35rem auto 0!important;
}

:is(.lb-video-poster-image,[data-lb~="lb-video-poster-image"],[data-lb-state~="lb-video-poster-image"]){
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    margin:0!important;
    border:0!important;
    border-radius:inherit!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#333333!important;
    opacity:1!important;
    filter:none!important;
    image-rendering:auto!important;
}

:is(.lb-video-poster-live-frame,[data-lb~="lb-video-poster-live-frame"],[data-lb-state~="lb-video-poster-live-frame"]){
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    margin:0!important;
    border:0!important;
    border-radius:inherit!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#333333!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
}

:is([data-lb-state~="is-live-frame-ready"],.is-live-frame-ready) :is(.lb-video-poster-live-frame,[data-lb~="lb-video-poster-live-frame"],[data-lb-state~="lb-video-poster-live-frame"]){
    opacity:1!important;
    visibility:visible!important;
}
:is([data-lb-state~="is-live-frame-ready"],.is-live-frame-ready):not([data-lb-state~="is-poster-ready"]):not(.is-poster-ready) :is(.lb-video-poster-image,[data-lb~="lb-video-poster-image"],[data-lb-state~="lb-video-poster-image"]){
    opacity:0!important;
    visibility:hidden!important;
}
:is([data-lb-state~="is-poster-ready"],.is-poster-ready) :is(.lb-video-poster-live-frame,[data-lb~="lb-video-poster-live-frame"],[data-lb-state~="lb-video-poster-live-frame"]){
    opacity:0!important;
    visibility:hidden!important;
}

:is(.lb-video-poster-backdrop,[data-lb~="lb-video-poster-backdrop"],[data-lb-state~="lb-video-poster-backdrop"]){
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    display:block!important;
    background:#333333 url('/assets/video-default.jpg') center/cover no-repeat!important;
    pointer-events:none!important;
}
:is([data-lb-state~="is-poster-ready"],.is-poster-ready) :is(.lb-video-poster-backdrop,[data-lb~="lb-video-poster-backdrop"],[data-lb-state~="lb-video-poster-backdrop"]),
:is([data-lb-state~="is-live-frame-ready"],.is-live-frame-ready) :is(.lb-video-poster-backdrop,[data-lb~="lb-video-poster-backdrop"],[data-lb-state~="lb-video-poster-backdrop"]){
    display:none!important;
}

:is(.lb-video-poster-play,[data-lb~="lb-video-poster-play"],[data-lb-state~="lb-video-poster-play"]){
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    z-index:4!important;
    display:block!important;
    width:60px!important;
    height:60px!important;
    transform:translate(-50%,-50%)!important;
    border:2px solid #ffffff!important;
    border-radius:50%!important;
    background:rgba(51, 51, 51,.48)!important;
    box-shadow:0 .35rem 1rem rgba(51, 51, 51,.35)!important;
    pointer-events:none!important;
}
:is(.lb-video-poster-play,[data-lb~="lb-video-poster-play"],[data-lb-state~="lb-video-poster-play"])::before{
    content:""!important;
    position:absolute!important;
    left:23px!important;
    top:17px!important;
    width:0!important;
    height:0!important;
    border-top:12px solid transparent!important;
    border-bottom:12px solid transparent!important;
    border-left:18px solid #ffffff!important;
}
:is(.lb-video-poster-play,[data-lb~="lb-video-poster-play"],[data-lb-state~="lb-video-poster-play"])::after{
    content:none!important;
}

:is(.lb-video-poster-fallback-label,[data-lb~="lb-video-poster-fallback-label"],[data-lb-state~="lb-video-poster-fallback-label"]){
    display:none!important;
    visibility:hidden!important;
}

:is([data-lb-state~="is-loading"],.is-loading) :is(.lb-video-poster-play,[data-lb~="lb-video-poster-play"],[data-lb-state~="lb-video-poster-play"]){
    opacity:.72!important;
}

@media (max-width:640px){
    :is([data-lb~="post-content"],[data-lb-state~="post-content"]) :is(.lb-video-poster-card,[data-lb~="lb-video-poster-card"],[data-lb-state~="lb-video-poster-card"]),
    :is([data-lb~="post-content"],[data-lb-state~="post-content"]) video[data-lb-video-thumbnail]{
        width:100%!important;
        max-width:100%!important;
        margin-top:.25rem!important;
    }
    :is(.lb-video-poster-play,[data-lb~="lb-video-poster-play"],[data-lb-state~="lb-video-poster-play"]){
        width:50px!important;
        height:50px!important;
    }
    :is(.lb-video-poster-play,[data-lb~="lb-video-poster-play"],[data-lb-state~="lb-video-poster-play"])::before{
        left:19px!important;
        top:14px!important;
        border-top-width:10px!important;
        border-bottom-width:10px!important;
        border-left-width:16px!important;
    }
}

@media (prefers-reduced-motion:reduce){
    :is(.lb-video-poster-card,[data-lb~="lb-video-poster-card"],[data-lb-state~="lb-video-poster-card"]){animation:none!important;}
}