.lpc-global-media-viewer{
    position:fixed;
    inset:0;
    z-index:2147482600;
    display:block;
    width:100vw;
    height:100dvh;
    max-width:none;
    max-height:none;
    margin:0;
    padding:0;
    overflow:hidden;
    border:0;
    background:#031214;
    color:#fff;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s ease,visibility .2s ease;
}
.lpc-global-media-viewer::backdrop{background:#031214}
.lpc-global-media-viewer.is-open{opacity:1;visibility:visible;pointer-events:auto}
.lpc-global-media-viewer .lpc-global-media-backdrop{display:none}
.lpc-global-media-dialog,
.lpc-global-media-dialog *,
.lpc-global-media-dialog *::before,
.lpc-global-media-dialog *::after{box-sizing:border-box}

/* One media geometry for photos and video. The foreground is never cropped; any
 * unused space is filled by a blurred version of the active photo/poster. */
.lpc-global-media-dialog{
    --lpc-gallery-rail:clamp(340px,27vw,430px);
    position:absolute;
    inset:0;
    z-index:1;
    display:block;
    width:100%;
    height:100%;
    max-width:100vw;
    max-height:100dvh;
    min-width:0;
    min-height:0;
    overflow:hidden;
    overscroll-behavior:none;
    contain:layout paint;
    box-sizing:border-box;
    border:0;
    border-radius:0;
    background:#031214;
    box-shadow:none;
    outline:0;
    isolation:isolate;
}
.lpc-global-media-dialog::after{
    content:"";
    position:absolute;
    inset:auto 0 0;
    z-index:3;
    height:min(40dvh,400px);
    pointer-events:none;
    background:linear-gradient(180deg,rgba(1,12,14,0) 0%,rgba(1,12,14,.34) 34%,rgba(1,12,14,.86) 100%);
}
.lpc-global-media-stage{
    position:absolute;
    inset:0;
    z-index:0;
    width:100%;
    height:100%;
    max-width:100%;
    max-height:100%;
    min-width:0;
    min-height:0;
    overflow:hidden;
    contain:layout paint;
    box-sizing:border-box;
    background:#031214;
}
.lpc-global-media-backdrop-image{
    position:absolute;
    inset:-42px;
    z-index:0;
    background-color:#031214;
    background-image:var(--lpc-gallery-backdrop-image,none);
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
    filter:blur(34px) saturate(.9);
    transform:scale(1.08);
    opacity:.48;
    pointer-events:none;
}
.lpc-global-media-stage::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(180deg,rgba(0,9,11,.2),rgba(0,9,11,.05) 45%,rgba(0,9,11,.25));
    pointer-events:none;
}
.lpc-global-media-surface{
    position:absolute;
    inset:0;
    z-index:2;
    display:grid;
    place-items:center;
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
    min-width:0;
    min-height:0;
    overflow:hidden;
    padding:0;
    box-sizing:border-box;
    transition:right .18s ease,bottom .18s ease;
}
.lpc-global-media-viewer.has-post .lpc-global-media-surface{bottom:78px}
.lpc-global-media-surface>img,
.lpc-global-media-surface>video{
    display:block;
    width:100%;
    height:100%;
    min-width:0;
    min-height:0;
    max-width:100%;
    max-height:100%;
    border:0;
    border-radius:0;
    box-shadow:none;
    object-fit:contain;
    object-position:center center;
    background:transparent;
}
.lpc-global-media-surface>video{
    z-index:2;
    background:rgba(0,0,0,.16);
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
}
.lpc-global-media-surface>[hidden]{display:none}

.lpc-global-media-head{
    position:absolute;
    inset:0 0 auto;
    z-index:60;
    min-height:90px;
    padding:0;
    color:#fff;
    background:linear-gradient(180deg,rgba(1,12,14,.42),rgba(1,12,14,0));
    border:0;
    pointer-events:none;
}
.lpc-global-media-head>div:first-child{
    position:absolute;
    top:max(24px,env(safe-area-inset-top));
    left:50%;
    transform:translateX(-50%);
    min-width:0;
}
.lpc-global-media-head strong{display:none}
.lpc-global-media-head small{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:58px;
    height:34px;
    padding:0 13px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:999px;
    color:#f7fbf7;
    background:rgba(8,38,39,.8);
    box-shadow:0 8px 24px rgba(0,0,0,.16);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    font-size:12px;
    font-weight:750;
    line-height:1;
    white-space:nowrap;
}
.lpc-global-media-actions{
    position:absolute;
    top:max(22px,env(safe-area-inset-top));
    right:max(22px,env(safe-area-inset-right));
    display:flex;
    align-items:center;
    gap:8px;
    pointer-events:auto;
}
.lpc-global-media-viewer .lpc-global-media-actions>a,
.lpc-global-media-viewer .lpc-global-media-actions>button{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    margin:0;
    padding:0;
    border:1px solid rgba(255,255,255,.2);
    border-radius:50%;
    background:rgba(247,241,216,.96);
    color:#0a3434;
    box-shadow:0 8px 24px rgba(0,0,0,.15);
    font:inherit;
    text-decoration:none;
    cursor:pointer;
    transition:background-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.lpc-global-media-viewer .lpc-global-media-actions>[data-lpc-global-media-original]{display:none}
.lpc-global-media-viewer .lpc-global-media-actions>[data-lpc-global-media-fullscreen]{display:grid}
.lpc-global-media-actions svg{width:19px;height:19px;display:block}
.lpc-global-media-viewer .lpc-global-media-actions>button:hover,
.lpc-global-media-viewer .lpc-global-media-actions>button:focus-visible{
    background:#f8b861;
    color:#082c2d;
    outline:0;
    transform:translateY(-1px);
    box-shadow:0 10px 28px rgba(0,0,0,.22);
}

.lpc-global-media-loading{
    position:absolute;
    inset:0;
    z-index:52;
    display:grid;
    place-items:center;
    opacity:0;
    pointer-events:none;
    transition:opacity .14s ease;
}
.lpc-global-media-loading.is-visible{opacity:1}
.lpc-global-media-loading span{width:36px;height:36px;border:3px solid rgba(255,255,255,.24);border-top-color:#f8b861;border-radius:50%;animation:lpcMediaSpin .8s linear infinite}
@keyframes lpcMediaSpin{to{transform:rotate(360deg)}}

/* Navigation always sits above secondary panels. When a right rail opens, Next
 * moves beside the rail instead of disappearing behind it. */
.lpc-global-media-viewer .lpc-global-media-nav{
    position:absolute;
    top:50%;
    z-index:66;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    margin:0;
    padding:0;
    transform:translateY(-50%);
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    background:rgba(247,241,216,.96);
    color:#0a3434;
    box-shadow:0 8px 24px rgba(0,0,0,.18);
    font:inherit;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    transition:right .18s ease,top .18s ease,background-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.lpc-global-media-nav.is-prev{left:max(22px,env(safe-area-inset-left))}
.lpc-global-media-nav.is-next{right:max(22px,env(safe-area-inset-right))}
.lpc-global-media-viewer:has(.lpc-post-card.is-comments-open) .lpc-global-media-nav.is-next,
.lpc-global-media-viewer.is-rich-panel-open .lpc-global-media-nav.is-next{right:calc(var(--lpc-gallery-rail) + 44px)}
.lpc-global-media-nav svg{width:22px;height:22px;display:block}
.lpc-global-media-nav:hover,.lpc-global-media-nav:focus-visible{background:#f8b861;color:#082c2d;box-shadow:0 10px 28px rgba(0,0,0,.24);outline:0}
.lpc-global-media-nav:focus-visible{box-shadow:0 0 0 3px rgba(248,184,97,.28),0 10px 28px rgba(0,0,0,.24)}
.lpc-global-media-nav:active{transform:translateY(-50%) scale(.94)}
.lpc-global-media-nav[hidden]{display:none}

.lpc-global-media-thumbs{
    position:absolute;
    top:52px;
    left:22px;
    z-index:55;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    max-width:min(420px,calc(100vw - 112px));
    max-height:76px;
    min-height:0;
    padding:8px;
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-inline:contain;
    border:1px solid rgba(255,255,255,.1);
    border-radius:17px;
    background:rgba(8,38,39,.84);
    box-shadow:0 14px 36px rgba(0,0,0,.18);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    scrollbar-width:none;
}
.lpc-global-media-thumbs::-webkit-scrollbar{display:none}
.lpc-global-media-thumbs[hidden]{display:none}
.lpc-global-media-viewer .lpc-global-media-thumbs button{
    position:relative;
    flex:0 0 74px;
    width:74px;
    height:58px;
    margin:0;
    padding:0;
    overflow:hidden;
    border:2px solid transparent;
    border-radius:10px;
    background:#082829;
    color:#fff;
    cursor:pointer;
    transition:border-color .16s ease,transform .16s ease,background-color .16s ease;
}
.lpc-global-media-viewer .lpc-global-media-thumbs button:hover,
.lpc-global-media-viewer .lpc-global-media-thumbs button:focus-visible{border-color:rgba(248,184,97,.8);outline:0;transform:translateY(-1px)}
.lpc-global-media-viewer .lpc-global-media-thumbs button.is-active{border-color:#f4efd9;background:rgba(244,239,217,.14)}
.lpc-global-media-thumbs img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:8px;display:block;background:#082829}
.lpc-global-media-viewer .lpc-global-media-thumbs button>span{position:absolute;inset:auto 5px 5px auto;display:grid;place-items:center;width:23px;height:23px;border-radius:999px;background:rgba(7,31,32,.86);color:#fff}
.lpc-global-media-viewer .lpc-global-media-thumbs button>span svg{width:11px;height:11px}
.lpc-global-media-video-thumb{position:static!important;inset:auto!important;display:grid!important;place-items:center;width:100%!important;height:100%!important;border-radius:8px!important;background:#082829!important;color:#fff!important}
.lpc-global-media-video-thumb svg{width:23px;height:23px}

html.lpc-media-modal-open{overflow:hidden;overscroll-behavior:none}
.lpc-media-open-wrap{position:relative;display:block;min-width:0;overflow:hidden}
.lpc-media-expand{
    position:absolute;
    top:8px;
    right:8px;
    z-index:2;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    padding:0;
    border:1px solid rgba(255,255,255,.24);
    border-radius:10px;
    background:rgba(7,20,43,.78);
    color:#fff;
    cursor:pointer;
    opacity:.86;
    transition:opacity .16s ease,background .16s ease,color .16s ease;
}
.lpc-media-open-wrap:hover .lpc-media-expand,.lpc-media-expand:focus-visible{opacity:1;background:#f8b861;color:#0e2d7b;outline:0}
.lpc-media-expand svg{width:17px;height:17px}

@media (max-width:900px){
    .lpc-global-media-dialog{--lpc-gallery-rail:min(100%,520px)}
    .lpc-global-media-viewer.has-post .lpc-global-media-surface{bottom:64px}
    .lpc-global-media-head{min-height:70px}
    .lpc-global-media-head>div:first-child{top:14px}
    .lpc-global-media-head small{height:31px;min-width:50px;padding:0 10px;font-size:11.5px}
    .lpc-global-media-actions{top:max(12px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right))}
    .lpc-global-media-viewer .lpc-global-media-actions>a,
    .lpc-global-media-viewer .lpc-global-media-actions>button{width:40px;height:40px;min-width:40px;min-height:40px}
    .lpc-global-media-thumbs{top:56px;left:max(10px,env(safe-area-inset-left));max-width:calc(100vw - 20px - env(safe-area-inset-left) - env(safe-area-inset-right));max-height:60px;padding:6px;gap:6px;border-radius:14px}
    .lpc-global-media-viewer .lpc-global-media-thumbs button{flex-basis:56px;width:56px;height:46px;border-radius:9px}
    .lpc-global-media-viewer .lpc-global-media-nav{width:42px;height:42px}
    .lpc-global-media-nav.is-prev{left:9px}
    .lpc-global-media-nav.is-next{right:9px}
    .lpc-global-media-viewer:has(.lpc-post-card.is-comments-open) .lpc-global-media-nav,
    .lpc-global-media-viewer.is-rich-panel-open .lpc-global-media-nav{top:28%}
    .lpc-global-media-viewer:has(.lpc-post-card.is-comments-open) .lpc-global-media-nav.is-next,
    .lpc-global-media-viewer.is-rich-panel-open .lpc-global-media-nav.is-next{right:9px}
    .lpc-global-media-nav svg{width:19px;height:19px}
}
@media (max-width:560px){
    .lpc-global-media-viewer.has-post .lpc-global-media-surface{bottom:58px}
    .lpc-global-media-backdrop-image{inset:-28px;filter:blur(26px) saturate(.94);opacity:.62}
    .lpc-global-media-head>div:first-child{top:12px}
    .lpc-global-media-actions{top:max(10px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right))}
    .lpc-global-media-thumbs{top:52px}
    .lpc-global-media-viewer .lpc-global-media-nav{width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){
    .lpc-global-media-viewer,
    .lpc-global-media-viewer .lpc-global-media-actions>button,
    .lpc-global-media-nav,
    .lpc-global-media-viewer .lpc-global-media-thumbs button{transition:none}
    .lpc-global-media-loading span{animation-duration:1.4s}
}
