/* Isolated gallery layout: stable height, bounded scrolling and top-layer preview. */
#legacyGallery .screenshots-carousel { display:block; padding:0; overflow:hidden; }
#carouselWrapper { display:flex; justify-content:flex-start; gap:24px; width:100%; overflow-x:auto; overflow-y:hidden; padding:8px 0; transform:none !important; transition:none; scrollbar-width:none; scroll-snap-type:x mandatory; }
#carouselWrapper::-webkit-scrollbar { display:none; }
#carouselWrapper .screenshot-card { box-sizing:border-box; flex:0 0 calc((100% - 72px)/4); width:auto; height:180px; scroll-snap-align:start; }
#carouselWrapper .screenshot-card[hidden] { display:none; }
#carouselWrapper .screenshot-card::before, #carouselWrapper .screenshot-title { pointer-events:none; }
#carouselWrapper .screenshot-card:focus-visible { outline:2px solid #fff; outline-offset:-3px; }
#legacyGallery .carousel-btn.prev { left:8px; }
#legacyGallery .carousel-btn.next { right:8px; }
#carouselIndicators { flex-wrap:wrap; min-height:12px; }
#lightboxModal { position:fixed; inset:0; margin:auto; padding:56px 16px 16px; border:0; box-sizing:border-box; width:96vw; height:94vh; max-width:1600px; max-height:94vh; background:#101010; opacity:1; pointer-events:auto; border-radius:12px; }
#lightboxModal:not([open]) { display:none; }
#lightboxModal[open] { display:flex; align-items:center; justify-content:center; }
#lightboxModal::backdrop { background:rgba(0,0,0,.85); }
#lightboxImage { width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain; }
#closeLightbox { position:absolute; top:8px; right:16px; background:transparent; border:0; color:white; font-size:32px; cursor:pointer; }
@media(max-width:992px) { #carouselWrapper .screenshot-card { flex-basis:calc((100% - 48px)/3); } }
@media(max-width:768px) { #carouselWrapper .screenshot-card { flex-basis:calc((100% - 24px)/2); } }
@media(max-width:576px) { #carouselWrapper .screenshot-card { flex-basis:100%; } }

#lightboxModal .lightbox-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:2; display:flex; align-items:center; justify-content:center; width:44px; height:52px; padding:0; border:1px solid #ffffff55; border-radius:8px; background:rgba(0,0,0,.7); color:#fff; font-size:28px; cursor:pointer; }
#lightboxModal .lightbox-prev { left:12px; }
#lightboxModal .lightbox-next { right:12px; }
#lightboxModal .lightbox-nav:hover { background:rgba(0,0,0,.95); }
#lightboxModal .lightbox-nav:focus-visible { outline:2px solid #fff; outline-offset:2px; }
