.gallery-page { padding-top:64px; padding-bottom:100px; }
.gallery-intro { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:50px; }
.gallery-intro h1 { font-size:clamp(64px,8.5vw,155px); font-weight:400; line-height:1; letter-spacing:-.065em; margin:20px 0 0; }
.gallery-intro h1>span { font-size:16px; color:var(--muted); letter-spacing:0; vertical-align:top; display:inline-block; margin:14px 0 0 18px; }
.gallery-intro>p { font-size:var(--type-reading,16px); line-height:1.9; }
.gallery-toolbar { border-top:1px solid var(--line); padding:22px 0 32px; display:flex; align-items:baseline; justify-content:space-between; gap:20px; }
.gallery-filters { display:flex; gap:24px; flex-wrap:wrap; }
.gallery-filters button { font:inherit; font-size:var(--type-control,14px); background:transparent; border:0; padding:4px 0; color:var(--muted); cursor:pointer; }
.gallery-filters button[aria-pressed=true] { color:var(--ink); box-shadow:0 1px var(--ink); }
.gallery-filters button>span { font-size:12px; margin-left:6px; vertical-align:super; }
.gallery-status { color:var(--muted); font-size:var(--type-meta,13px); white-space:nowrap; }
.photo-index { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:36px 22px; }
.photo-index-item { display:block; min-width:0; }
.photo-index-item[hidden] { display:none; }
.photo-index-image { position:relative; aspect-ratio:4/3; background:#e8e8e1; overflow:hidden; }
.photo-index-image>img { width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.photo-index-image>span { position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:32px; height:32px; color:var(--paper); background:#172018b3; border-radius:50%; }
.photo-index-caption { padding-top:12px; }
.photo-index-caption>span { font-size:var(--type-label,11px); color:var(--muted); }
.photo-index-caption h2 { margin:3px 0 0; font-size:var(--type-compact,15px); font-weight:400; line-height:1.45; letter-spacing:-.02em; overflow-wrap:anywhere; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .photo-index-item:hover img { transform:scale(1.035); } }
.gallery-viewer { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; padding:24px clamp(20px,4vw,80px); border:0; background:#131a16; color:var(--paper); overflow-y:auto; }
.gallery-viewer::backdrop { background:#131a16; }
.gallery-viewer button { color:inherit; font:inherit; border:0; background:transparent; cursor:pointer; }
.gallery-viewer :focus-visible { outline:2px solid #a5b2ff; outline-offset:5px; }
.gallery-viewer-top { display:flex; align-items:center; justify-content:space-between; font-size:16px; padding-bottom:18px; }
.gallery-viewer-top>span>span { color:#a8afa8; margin-left:24px; }
.gallery-viewer-top button { padding:10px 0 10px 20px; }
.gallery-viewer-stage { max-width:1680px; margin:0 auto; display:grid; grid-template-columns:minmax(100px,1fr) minmax(0,5fr) minmax(100px,1fr); align-items:center; gap:clamp(24px,3vw,60px); }
.gallery-current { min-width:0; margin:0; }
.gallery-image-link { display:block; position:relative; text-align:center; }
.gallery-image-link>img { display:block; width:100%; height:55dvh; object-fit:contain; }
.gallery-image-link>img.is-cropped { height:auto; max-height:55dvh; aspect-ratio:3/2; object-fit:cover; object-position:var(--crop-position); }
.gallery-image-link>span { position:absolute; bottom:12px; right:12px; font-size:13px; background:#131a16c9; padding:7px 12px; }
.gallery-current figcaption { padding-top:18px; }
.gallery-photo-meta { display:flex; justify-content:space-between; color:#b9c0b8; font-size:13px; }
.gallery-current h2 { font-size:clamp(22px,2vw,32px); font-weight:400; letter-spacing:-.025em; line-height:1.3; margin:12px 0 4px; }
.gallery-current p { font-size:15px; line-height:1.65; margin:4px 0; color:#c8cec5; }
.gallery-current p[hidden] { display:none; }
.gallery-project-link { display:flex; justify-content:space-between; align-items:center; border-top:1px solid #51594e; padding-top:13px; margin-top:17px; font-size:16px; }
.gallery-project-link span { font-size:24px; }
.gallery-neighbor { min-width:0; padding:0; text-align:left; align-self:center; }
.gallery-neighbor>span:first-child { display:block; font-size:13px; margin-bottom:12px; color:#b9c0b8; }
.gallery-neighbor>img { width:100%; aspect-ratio:4/3; object-fit:cover; opacity:.7; transition:opacity .3s; }
.gallery-neighbor:hover>img,.gallery-neighbor:focus-visible>img { opacity:1; }
.gallery-neighbor>span:last-child { display:block; font-size:14px; line-height:1.5; margin-top:9px; overflow-wrap:anywhere; }
.gallery-next { text-align:right; }
#gallery-photo-help { margin:22px 0 0; text-align:center; font-size:12px; color:#a8afa8; }
@media(max-width:1200px) { .photo-index { grid-template-columns:repeat(3,minmax(0,1fr)); } .gallery-filters { gap:18px; } .gallery-viewer-stage { gap:24px; grid-template-columns:minmax(90px,1fr) minmax(0,5fr) minmax(90px,1fr); } }
@media(max-width:800px) {
  .gallery-page { padding-top:30px; padding-bottom:55px; }
  .gallery-intro { align-items:flex-start; flex-direction:column; gap:22px; margin-bottom:28px; }
  .gallery-intro h1 { font-size:76px; margin-top:14px; }
  .gallery-intro>p { font-size:14px; }
  .gallery-toolbar { flex-direction:column; gap:16px; padding:17px 0 24px; }
  .gallery-filters { gap:10px 20px; }
  .gallery-filters button { font-size:14px; }
  .gallery-filters button>span { font-size:10px; }
  .photo-index { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px 12px; }
  .photo-index-caption h2 { font-size:14px; }
  .photo-index-caption>span { font-size:10px; }
  .photo-index-image>span { width:25px; height:25px; right:7px; bottom:7px; }
  .gallery-viewer { padding:12px 20px 22px; }
  .gallery-viewer-top { font-size:14px; padding-bottom:10px; }
  .gallery-viewer-stage { grid-template-columns:1fr 1fr; gap:20px; align-items:start; }
  .gallery-current { grid-column:1/-1; grid-row:1; }
  .gallery-image-link>img { height:38dvh; }
  .gallery-image-link>img.is-cropped { max-height:38dvh; }
  .gallery-current figcaption { padding-top:14px; }
  .gallery-current h2 { font-size:22px; }
  .gallery-current p { font-size:13px; }
  .gallery-photo-meta { font-size:11px; }
  .gallery-project-link { font-size:14px; margin-top:12px; padding-top:8px; }
  .gallery-neighbor { display:grid; grid-template-columns:64px minmax(0,1fr); gap:5px 10px; text-align:left; align-items:center; }
  .gallery-neighbor>img { grid-column:1; grid-row:1/3; height:58px; aspect-ratio:auto; }
  .gallery-neighbor>span:first-child { margin:0; grid-column:2; font-size:12px; }
  .gallery-neighbor>span:last-child { grid-column:2; margin:0; font-size:11px; line-height:1.4; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
  #gallery-photo-help { font-size:10px; margin-top:18px; }
}

/* Category sections and complete project sets. */
.gallery-toolbar { display:block; padding:22px 0; margin-bottom:10px; }
.gallery-filter-row { display:flex; align-items:baseline; justify-content:space-between; gap:20px; }
.gallery-project-control { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:22px; max-width:680px; margin-top:22px; }
.gallery-project-control>span { font-family:var(--jp); font-size:var(--type-meta,12px); color:var(--muted); }
.gallery-project-control select { width:100%; min-width:0; background:transparent; color:var(--ink); border:0; border-bottom:1px solid var(--line); border-radius:0; font:inherit; font-size:var(--type-control,15px); padding:8px 28px 8px 0; }
.gallery-category[hidden],.gallery-project[hidden],.gallery-neighbor[hidden] { display:none; }
.gallery-category { padding-top:28px; }
.gallery-category+.gallery-category { margin-top:50px; }
.gallery-category-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; border-top:1px solid var(--ink); padding:27px 0 38px; }
.gallery-category-heading h2 { font-size:clamp(36px,4vw,70px); font-weight:400; letter-spacing:-.045em; line-height:1.1; margin:12px 0; }
.gallery-category-heading p { font-family:var(--jp); font-size:var(--type-compact,14px); color:var(--muted); line-height:1.8; }
.gallery-category-heading>span { font-size:var(--type-meta,12px); white-space:nowrap; color:var(--muted); }
.gallery-project { padding:28px 0 44px; border-top:1px solid var(--line); }
.gallery-project-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:25px; }
.gallery-project-heading>div { min-width:0; }
.gallery-project-heading h3 { font-size:clamp(24px,2.3vw,38px); font-weight:400; letter-spacing:-.03em; line-height:1.35; margin:10px 0 5px; overflow-wrap:anywhere; }
.gallery-project-heading p { font-family:var(--jp); font-size:var(--type-meta,13px); line-height:1.7; color:var(--muted); }
.gallery-project-meta { flex-shrink:0; display:flex; gap:22px; align-items:center; font-size:var(--type-meta,13px); }
.gallery-project-meta>span { color:var(--muted); }
.gallery-project-meta>a { border-bottom:1px solid var(--line); padding-bottom:4px; }
.photo-index-caption { display:flex; gap:16px; align-items:baseline; }
.photo-index-caption>span { white-space:nowrap; font-variant-numeric:tabular-nums; }
.photo-index-caption>p { font-family:var(--jp); font-size:var(--type-meta,12px); color:var(--muted); line-height:1.65; }
.gallery-current { grid-column:2; }
.gallery-viewer-stage.is-single { grid-template-columns:minmax(0,1fr); max-width:1120px; }
.gallery-viewer-stage.is-single .gallery-current { grid-column:1; }
@media(min-width:801px) { .gallery-toolbar { position:sticky; top:0; z-index:10; background:var(--paper); border-bottom:1px solid var(--line); } }
@media(max-width:1100px) { .gallery-filter-row { align-items:flex-start; flex-direction:column; gap:15px; } .gallery-project-heading { align-items:flex-start; flex-direction:column; gap:18px; } }
@media(max-width:800px) {
  .gallery-toolbar { padding-top:17px; margin-bottom:0; }
  .gallery-project-control { gap:12px; grid-template-columns:minmax(0,1fr); margin-top:17px; }
  .gallery-project-control select { font-size:16px; }
  .gallery-category { padding-top:20px; }
  .gallery-category+.gallery-category { margin-top:20px; }
  .gallery-category-heading { flex-direction:column; align-items:flex-start; gap:16px; padding:22px 0 27px; }
  .gallery-category-heading h2 { font-size:38px; }
  .gallery-category-heading p { font-size:13px; }
  .gallery-category-heading>span { font-size:12px; }
  .gallery-project { padding:23px 0 28px; }
  .gallery-project-heading { gap:13px; margin-bottom:20px; }
  .gallery-project-heading h3 { font-size:24px; }
  .gallery-project-heading p { font-size:12px; }
  .gallery-project-meta { font-size:12px; gap:20px; flex-wrap:wrap; }
  .photo-index-caption { flex-direction:column; gap:4px; padding-top:9px; }
  .photo-index-caption>p { font-size:11px; }
  .gallery-current { grid-column:1/-1; }
}

/* Keep the visual index compact enough to reach the photographs quickly. */
.gallery-page { padding-top:40px; }
.gallery-intro { margin-bottom:28px; }
.gallery-intro h1 { font-size:clamp(64px,5.5vw,104px); margin-top:14px; }
.gallery-toolbar { padding:17px 0; }
.gallery-project-control { margin-top:16px; }
.gallery-category-heading { padding:22px 0; }
@media(min-width:801px) {
  .gallery-category-heading>div { display:flex; align-items:baseline; flex-wrap:wrap; gap:12px 24px; }
  .gallery-category-heading h2 { font-size:44px; margin:0; }
  .gallery-category-heading p { font-size:var(--type-meta,14px); }
}
@media(max-width:800px) { .gallery-page { padding-top:30px; } .gallery-intro h1 { font-size:76px; } }