.history-scroll{--photo-size:80px;--photo-gap:8px;margin-top:48px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#738561 #e7e5dc;padding-top:8px;padding-bottom:16px}
.history-scroll:focus-visible{outline:2px solid #738561;outline-offset:4px}
.history-timeline{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));width:calc(11 * var(--photo-size) + 10 * var(--photo-gap));list-style:none;margin:0;padding:0}
.history-milestone{box-sizing:border-box;position:relative;min-width:0;padding:24px 16px 0 0;border-top:1px solid #73856166}
.history-milestone::before{content:"";position:absolute;left:0;top:-5px;width:9px;height:9px;background:#738561;border-radius:50%}
.history-milestone:last-child{padding-right:8px}
.history-milestone time{display:block;margin-bottom:8px;color:#738561;font-size:14px;line-height:1.6;font-weight:600}
.history-chapter{min-width:0}
.history-chapter h3{margin:0 0 16px;height:72px;max-width:230px;font-family:Manrope,sans-serif;font-size:16px;line-height:1.5;font-weight:500}
.history-photos{display:flex;flex-wrap:nowrap;gap:var(--photo-gap);width:max-content;align-items:start}
.history-photo{display:block;flex:0 0 var(--photo-size);width:var(--photo-size);height:var(--photo-size);overflow:hidden;background:#ecebe4;cursor:zoom-in}
.history-photo img{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:cover;transition:transform .25s ease}
.history-photo:hover img{transform:scale(1.025)}
.history-photo:focus-visible{outline:2px solid #738561;outline-offset:4px}
body.history-image-open{overflow:hidden}
#history-lightbox{position:fixed;inset:0;margin:auto;padding:64px 24px 24px;width:min(1100px,94vw);max-width:94vw;max-height:94dvh;overflow:auto;border:0;border-radius:0;background:#f7f5ef;color:#282c26;box-shadow:0 16px 64px #0004}
#history-lightbox::backdrop{background:#111d}
#history-lightbox>img{display:block;max-width:100%;width:auto;height:auto;max-height:calc(94dvh - 160px);margin:0 auto;object-fit:contain}
.history-lightbox-close{position:absolute;right:24px;top:16px;min-height:40px;padding:8px 0;border:0;background:none;color:inherit;font:500 16px Manrope,sans-serif;cursor:pointer}
.history-lightbox-caption{margin:16px auto 0;text-align:center;font-size:14px;line-height:1.6;max-width:65ch}
@media(max-width:600px){
 .history-scroll{--photo-size:72px}
 #history-lightbox{padding:64px 16px 16px}
}
@media(min-width:1051px){
 .history-timeline{width:100%}
 .history-photos{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));width:100%}
 .history-photo{width:100%;height:auto;aspect-ratio:1}
}
@media(prefers-reduced-motion:reduce){.history-photo img{transition:none}}

/* Reuse the homepage's interactive tabletop gallery below the timeline. */
.history-page .event-memories{overflow:hidden;overflow:clip}
.history-page .memories-heading{text-align:left}
.history-page .memories-heading h2{margin:0 0 24px}
.history-page .memories-heading p{margin:0;max-width:65ch}
@media(min-width:761px){
 .history-page .memories-heading{margin-inline:32px}
 .history-page .polaroid-table{margin-top:32px}
}
@media(min-width:761px) and (max-width:1100px){
 .history-page .memories-heading{margin-inline:0}
}
@media(max-width:760px){
 .history-page .event-memories{height:100svh;max-height:100svh;padding-block:24px;box-sizing:border-box}
 .history-page .event-memories>.container{display:flex;flex-direction:column;height:100%;min-height:0}
 .history-page .memories-heading{flex:none}
 .history-page .memories-heading h2{margin-bottom:8px}
 .history-page .polaroid-table{flex:1;min-height:0;aspect-ratio:auto;height:auto;width:calc(100% + 32px);max-width:none;margin:16px -16px 0}
 .history-page .collage-controls{flex:none;margin-top:16px}
 .history-page .collage-status{flex:none;margin-top:8px}
 .history-page .event-polaroid::after{height:20px}
 .history-page .event-polaroid.is-front{left:clamp(24%,var(--x),76%)}
}

/* Selected history Polaroids: another 20% larger than the prior 1.664 scale. */
.history-page .event-polaroid.is-front{transform:translate(-50%,calc(-50% - 8px)) rotate(0deg) scale(1.9968);left:clamp(216px,var(--x),calc(100% - 216px));top:clamp(216px,var(--y),calc(100% - 216px))}
@media(max-width:760px){
 .history-page .event-polaroid.is-front{left:clamp(36%,var(--x),64%);top:clamp(36%,var(--y),64%);transform:translate(-50%,calc(-50% - 4px)) rotate(0deg) scale(1.9968)}
}