[hidden]{display:none!important}.preserve{white-space:pre-line;overflow-wrap:anywhere}.album-cover{display:block;cursor:pointer}.album-cover span{opacity:1}.album-card figcaption{display:flex;justify-content:space-between;gap:15px}.album-card figcaption p{font-size:13px;color:var(--muted)}.album-card .text-link{white-space:nowrap;align-self:flex-start}.empty-cover{height:100%;display:grid;place-items:center;background:#e4e9df;font:30px Georgia,serif}.album-photos{grid-template-columns:repeat(2,minmax(0,1fr))}.album-photos figure:nth-child(2){padding-top:0}.album-photos .photo{height:480px}.album-heading{margin:40px 0}.filter{padding:10px 20px;border:1px solid var(--line);font-size:14px}.filter.active{background:var(--accent);color:white}.filters{flex-wrap:wrap}.notice{margin:24px 5vw;padding:18px;border:1px solid #abbca3;background:#eff5e9;color:#294020;line-height:1.6}.notice.error{background:#fff1f1;border-color:#d49b9b;color:#812525}.auth{max-width:530px;margin:70px auto;padding:0 25px}.auth h2{font-size:42px}.auth p{color:var(--muted)}.auth form{margin-top:30px}.about-photo{width:100%;max-height:500px;object-fit:cover}.contact-links{display:flex;flex-direction:column;gap:20px;margin:35px 0}.contact-links a{text-decoration:underline;overflow-wrap:anywhere}.calendar-arrow{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);font-size:24px}.day{display:grid;place-items:center}.day.ask{background:#f6f3ec;color:#65542e}.legend .ask{background:#eadfc7}.trap{display:none}.empty{color:var(--muted)}input[type=checkbox]{width:18px;height:18px}.check{flex-direction:row;align-items:center}.lightbox-bottom .caption{line-height:1.7}.hero-copy h1{overflow-wrap:anywhere}.brand{max-width:100%;overflow-wrap:anywhere}@media(max-width:760px){.album-photos{grid-template-columns:1fr}.album-photos .photo{height:420px}.album-card figcaption{flex-wrap:wrap}.hero-image{height:430px}.auth{margin:45px auto}}

/* Show entire album photographs without cropping or hover zoom. */
.album-cover,
.album-photos .photo {
    background: #f3f4f1;
}
.album-cover img,
.album-photos .photo img {
    object-fit: contain;
    object-position: center;
    transform: none;
}

/* Responsive photo grid: two on phones, up to five on wide displays. */
.gallery.album-photos {grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px;align-items:start}
.album-photos figure {min-width:0}
.album-photos .photo {width:100%;height:auto;aspect-ratio:3/4}
.album-photos figcaption {overflow-wrap:anywhere}
.album-photos figcaption h3 {font-size:clamp(15px,1.5vw,22px)}
@media(min-width:768px){.gallery.album-photos{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px}}
@media(min-width:1100px){.gallery.album-photos{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 20px}}
@media(min-width:1600px){.gallery.album-photos{grid-template-columns:repeat(5,minmax(0,1fr));gap:32px 24px}}

/* Keep the viewer and its controls stable across image aspect ratios. */
dialog.lightbox {
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    margin: auto;
    width: min(1100px, 95vw);
    height: 92vh;
    height: 92dvh;
    max-width: 95vw;
    max-height: none;
    padding: 48px 24px 16px;
    overflow: hidden;
}
dialog.lightbox[open] {
    display: grid;
    grid-template-rows: minmax(0, 1fr) 64px;
    gap: 12px;
}
dialog.lightbox > img {
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
    margin: 0;
}
.lightbox .lightbox-bottom {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 0;
    min-width: 0;
    min-height: 0;
}
.lightbox-bottom .caption {
    max-height: 100%;
    overflow: auto;
    overflow-wrap: anywhere;
}
.lightbox .close {width:44px;height:44px;top:2px;right:4px}
.lightbox-bottom button {min-height:44px}
@media(max-width:760px) {
    dialog.lightbox {width:96vw;max-width:96vw;height:94vh;height:94dvh;padding:46px 10px 10px}
    .lightbox .lightbox-bottom {gap:8px}
    .lightbox-bottom button {padding:10px 8px}
}
