.project-gallery {margin:1.5rem 0 0;max-width:850px;border:1px solid #434348;background:#161618}
.gallery-slides {display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:thin}
.project-gallery.is-ready .gallery-slides {scrollbar-width:none}
.gallery-slides picture {flex:0 0 100%;min-width:0;scroll-snap-align:start}
.gallery-slides img {width:100%;height:auto;display:block}
.project-gallery figcaption {display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:6px clamp(12px,2vw,22px);border-top:1px solid #454548}
.project-gallery h2 {font-size:clamp(.97rem,2vw,1.12rem);letter-spacing:0;line-height:1.3;margin:0}
.gallery-tools,.gallery-thumbs {display:flex;align-items:center;gap:4px}
.project-gallery [hidden] {display:none}
.gallery-tools output {min-width:3.4em;text-align:center;color:#ddd;font:0.8rem monospace}
.project-gallery button {cursor:pointer;color:#eee;background:transparent;border:1px solid transparent}
.gallery-arrow {width:44px;height:44px;display:grid;place-items:center}
.gallery-arrow svg {width:20px;fill:none;stroke:currentColor;stroke-width:1.6}
.gallery-arrow:hover {background:#333}
.gallery-thumbs {padding:0 clamp(12px,2vw,22px) 14px;gap:8px}
.gallery-thumbs button {padding:3px;min-height:44px}
.gallery-thumbs img {display:block;width:62px;height:auto;opacity:.65}
.gallery-thumbs [aria-current=true] {border-color:#eee}
.gallery-thumbs [aria-current=true] img,.gallery-thumbs button:hover img {opacity:1}
.project-gallery :focus-visible {outline:2px solid white;outline-offset:-3px}