/* Simple gallery lightbox styles */
.gallery-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:2000;opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
.gallery-lightbox.open{opacity:1;visibility:visible}
.gallery-lightbox .gb-inner{position:relative;max-width:1100px;width:94%;max-height:88vh;display:flex;align-items:center;justify-content:center}
.gallery-lightbox img{max-width:100%;max-height:88vh;object-fit:contain;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.6)}
.gallery-lightbox .gb-close{position:absolute;top:8px;right:8px;background:transparent;border:0;color:#fff;font-size:22px;padding:8px;cursor:pointer}
.gallery-lightbox .gb-prev,.gallery-lightbox .gb-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.35);border:0;color:#fff;padding:12px;border-radius:6px;cursor:pointer}
.gallery-lightbox .gb-prev{left:10px}
.gallery-lightbox .gb-next{right:10px}
.gallery-lightbox .gb-caption{position:absolute;left:0;right:0;bottom:-8px;color:#ddd;text-align:center;padding:8px 12px;font-size:14px}
@media(max-width:640px){.gallery-lightbox .gb-prev,.gallery-lightbox .gb-next{display:none}.gallery-lightbox img{max-height:70vh}}

.library-gallery{
	/* constrain to 70% width of the viewport and center */
	width:70%;
	max-width:1100px;
	margin:28px auto;
	padding-left:12px;
	padding-right:12px;
	display:flex;
	flex-direction:column;
	align-items:center; /* center children horizontally */
}
.library-gallery h2{color:#fff;margin:0 0 14px;font-size:28px;font-weight:700;text-align:center;line-height:1.15;width:100%}
.library-gallery{font-size:1.05rem}
.library-gallery .gallery-caption{color:#dcdcdc;font-size:0.95rem;text-align:center;margin-top:8px}
.library-gallery .gallery-container{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:stretch;width:100%}
.library-gallery .gallery-item{overflow:hidden;border-radius:8px;background:rgba(255,255,255,0.02)}
.library-gallery .gallery-item img{display:block;width:100%;height:220px;object-fit:cover;transition:transform .28s ease}
.library-gallery .gallery-item:hover img{transform:scale(1.04)}

@media(max-width:900px){
	.library-gallery .gallery-container{grid-template-columns:repeat(2,1fr)}
	.library-gallery .gallery-item img{height:180px}
}

@media(max-width:480px){
	.library-gallery .gallery-container{grid-template-columns:repeat(1,1fr)}
	.library-gallery .gallery-item img{height:160px}
}

/* thumbnail entrance animation (staggered) */
.library-gallery .gallery-item{opacity:0;transform:translateY(18px);transition:opacity .58s cubic-bezier(.2,.9,.2,1),transform .58s cubic-bezier(.2,.9,.2,1)}
.library-gallery .gallery-item.show{opacity:1;transform:none}

/* lightbox open animation */
.gallery-lightbox.open{animation:galleryOpen .22s ease both}
@keyframes galleryOpen{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}

/* subtle caption fade */
.gallery-lightbox .gb-caption{opacity:0;transform:translateY(6px);transition:opacity .28s ease,transform .28s ease}
.gallery-lightbox.open .gb-caption{opacity:1;transform:none}

/* ensure focused thumbnail is clearly visible */
.library-gallery .gallery-item:focus-within{outline:2px solid rgba(255,209,102,0.12);outline-offset:4px}

/* Final polish: container background, rounded card look, caption overlay on hover */
.library-gallery{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:28px;border-radius:12px;box-shadow:0 12px 30px rgba(8,18,35,0.45)}
.library-gallery h2{margin-bottom:18px;letter-spacing:0.2px}
.library-gallery .gallery-item{position:relative;overflow:hidden}
.library-gallery .gallery-item::after{content:attr(data-caption);position:absolute;left:12px;right:12px;bottom:12px;display:block;padding:8px 10px;background:linear-gradient(180deg,rgba(0,0,0,0.0),rgba(0,0,0,0.55));color:#fff;font-size:0.95rem;border-radius:6px;opacity:0;transform:translateY(6px);transition:opacity .22s ease,transform .22s ease;pointer-events:none;text-align:center}
.library-gallery .gallery-item:hover::after,.library-gallery .gallery-item.show::after,.library-gallery .gallery-item:focus-within::after{opacity:1;transform:none}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
	.library-gallery .gallery-item,.library-gallery .gallery-item.show{transition:none;transform:none;opacity:1}
	.gallery-lightbox.open{animation:none}
}
