/* Gallery retains its original dark controls within the light portfolio. */
.gallery{
 color-scheme:dark;background:#000;color:#fff;
 --bg:#000;--fg:#fff;--muted:#6e6e73;--description-color:#6e6e73;
 --control-surface:rgba(70,72,70,.9);--control-hover:rgba(90,92,90,.96);--button-ink:#fff;
}
.gallery::backdrop{background:#000}
@keyframes gallery-backdrop-in{from{background:rgba(0,0,0,0)}to{background:#000}}
@keyframes gallery-backdrop-out{from{background:#000}to{background:rgba(0,0,0,0)}}
.gallery .gallery-project{color:#fff}
.gallery .gallery-caption,.gallery .gallery-caption p,.gallery .gallery-count{color:#6e6e73}
.gallery .gallery-media{background:#000}
.gallery .gallery-progress>span{background:#fff}
.gallery .gallery-thumb{background:#191919;border-color:#333}
.gallery .gallery-thumb.selected{border-color:#fff}
.gallery .fill-control:not(.gallery-cursor),
.gallery:not(.keyboard-navigation) .lightbox-close{color:#fff}
.gallery .fill-control:not(.gallery-cursor)::before{background:#fff}
.gallery .fill-control:not(.gallery-cursor).pointer-hover:hover,
.gallery .fill-control:not(.gallery-cursor):focus-visible{color:#080808}
.gallery .gallery-cursor{background:#fff;color:#080808}
.gallery .gallery-cursor.is-pressed{background:var(--control-surface);color:#fff}
.gallery :focus-visible{outline-color:#fff}
/* 25% page dimming; the 20px top gap and rounded panel edge sit over 80% black. */
.project-details::backdrop{
 background:linear-gradient(to bottom,rgba(0,0,0,.8) 0 32px,rgba(0,0,0,.25) 32px 100%);
}