.photo-album{--photo-height:clamp(100px,20svh,180px);position:fixed;bottom:0;left:0;width:100%;height:calc(var(--photo-height) * 1.2);z-index:2;transform:translateY(0);transition:transform .55s ease,opacity .4s ease;overflow:hidden}
body.open .photo-album{transform:translateY(0)}
body.section-open .photo-album{transform:translateY(100%);opacity:0;pointer-events:none;visibility:hidden}
.photo-scroll{height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;touch-action:pan-x;overscroll-behavior-x:contain}
.photo-scroll::-webkit-scrollbar{display:none}.photo-scroll:active{cursor:grabbing}
.photo-track{display:flex;gap:14px;width:max-content;height:100%}.photo-set{display:flex;align-items:flex-end;gap:14px;height:100%;flex-shrink:0}
.photo-set img{display:block;height:var(--photo-height);transform:translateY(50%);transform-origin:center bottom;transition:transform .3s ease;position:relative;width:auto;flex-shrink:0;object-fit:contain;user-select:none;-webkit-user-drag:none}
.photo-scroll:focus-visible{outline:2px solid #aaa;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.photo-album{transition:none}}
/* Fade the moving photos into the page at both edges. */
.photo-album{-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%)}

@media(hover:hover) and (pointer:fine){.photo-set img:hover{transform:translateY(-4%) scale(1.06);z-index:1}}
@media(prefers-reduced-motion:reduce){.photo-set img{transition:none}}
.photo-viewer{border:0;padding:24px;background:transparent;color:white;max-width:95vw;max-height:95svh;overflow:visible}
.photo-viewer::backdrop{background:rgb(0 0 0 / .88)}
.photo-viewer[open]{display:flex;flex-direction:column;align-items:center;gap:18px;animation:photo-open .25s ease}
.photo-viewer img{display:block;max-width:88vw;max-height:76svh;width:auto;height:auto;object-fit:contain;user-select:auto;-webkit-user-select:auto}
.photo-close{display:grid;place-items:center;width:48px;height:48px;padding:8px;border:0;background:none;color:white;cursor:pointer}
.photo-close svg{width:30px;height:30px}.photo-close:focus-visible{outline:2px solid white;outline-offset:4px}
@keyframes photo-open{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.photo-viewer[open]{animation:none}}

.photo-set img.touch-preview{transform:translateY(-4%) scale(1.06);z-index:1}

@media(pointer:coarse){.photo-set img.mobile-center{transform:translateY(-4%) scale(1.06);z-index:1}}

@media(pointer:coarse){.photo-set img.mobile-near{transform:translateY(14%) scale(1.035);z-index:1}.photo-set img.mobile-far{transform:translateY(32%) scale(1.015);z-index:1}}