
.gallery-page { padding-top:90px; max-width:1600px; }
.gallery-head { padding-bottom:84px; }
.gallery-head .eyebrow { color:#888; margin-bottom:44px; }
.gallery-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:28px; }
.gallery-heading h1 { font:400 64px/1.2 "Songti SC","Noto Serif SC",serif; letter-spacing:4px; margin:0; }
.gallery-heading h1 span { display:block; font-size:20px; letter-spacing:2px; color:#aaa; margin-top:18px; }
.gallery-note { color:#777; font-size:10px; letter-spacing:1.5px; line-height:2.2; text-align:right; }
.gallery-intro { color:#999; font-size:14px; line-height:2; margin:32px 0; }
.collection-nav { display:flex; gap:40px; margin-top:40px; }
.collection-nav a { display:flex; gap:55px; padding-bottom:14px; border-bottom:1px solid #444; font-size:12px; }
.collection-nav span { color:#777; font-size:10px; }
.collection { scroll-margin-top:32px; padding-bottom:130px; }
.collection-head { display:flex; justify-content:space-between; align-items:end; gap:20px; border-top:1px solid #333; padding:32px 0 48px; }
.collection-head .eyebrow { color:#777; font-size:10px; margin-bottom:16px; }
.collection-head h2 { font:400 32px/1.3 "Songti SC",serif; margin:0; }
.collection-head > p { font-size:12px; color:#888; margin:0; }
.art-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:70px 34px; align-items:start; }
.artwork { margin:0; min-width:0; grid-column:span 2; }
.artwork.landscape { grid-column:span 3; }
.artwork.opening { grid-column:1/-1; margin-bottom:24px; }
.art-link { display:block; background:#090909; cursor:zoom-in; }
.art-link img { display:block; width:100%; height:auto; object-fit:contain; }
.artwork figcaption { display:flex; justify-content:space-between; gap:8px; color:#777; font-size:9px; letter-spacing:1.6px; padding-top:16px; line-height:1.7; }
.gallery-end { border-top:1px solid #333; padding:44px 0 20px; }
.gallery-end p { color:#999; font:400 24px/1.8 "Songti SC",serif; margin:0 0 40px; }
.gallery-end a { font-size:12px; color:#aaa; display:inline-block; margin:0 32px 12px 0; }
.gallery-page a:focus-visible,.lightbox button:focus-visible { outline:2px solid #ddd; outline-offset:6px; }
.lightbox { border:0; background:#030303; color:#ddd; width:100vw; max-width:none; height:100dvh; max-height:none; padding:24px 36px; margin:0; }
.lightbox[open] { display:flex; flex-direction:column; }
.lightbox::backdrop { background:rgba(0,0,0,.97); }
.viewer-bar,.viewer-controls { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-shrink:0; }
.viewer-bar p,.viewer-controls p { font-size:11px; letter-spacing:1.5px; color:#aaa; }
.lightbox button { border:0; background:none; color:#ccc; font:inherit; font-size:12px; padding:14px; cursor:pointer; }
.viewer-stage { flex:1; min-height:0; display:flex; align-items:center; justify-content:center; padding:20px 0; }
.viewer-stage img { width:100%; height:100%; object-fit:contain; }
body.viewing { overflow:hidden; }
@media(max-width:800px) { .gallery-page { padding-top:130px; } .gallery-heading { display:block; } .gallery-heading h1 { font-size:46px; } .gallery-heading h1 span { font-size:17px; } .gallery-note { text-align:left; margin-top:24px; } .collection-head { align-items:start; flex-direction:column; padding-bottom:32px; } .art-grid { gap:44px 22px; } .collection { padding-bottom:80px; } .gallery-head { padding-bottom:55px; } }
@media(max-width:640px) { .art-grid { grid-template-columns:1fr; gap:44px; } .artwork,.artwork.landscape,.artwork.opening { grid-column:1; margin-bottom:0; } .artwork.portrait { width:85%; justify-self:center; } .collection-nav { gap:28px; } .collection-nav a { gap:28px; } .lightbox { padding:14px 10px; } .viewer-bar { gap:10px; } .viewer-bar p { font-size:10px; } .gallery-end p { font-size:21px; } }
