/* The archive uses the site's paper, ink and type. Artwork is always uncropped. */
.fsg-head { padding-block: clamp(1.75rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.5rem); }
.fsg-head .fsg-eyebrow { font: 500 .75rem/1.5 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); margin-bottom: 1.5rem; }
.fsg-head h1 { font: 400 clamp(3.5rem, 8vw, 8.25rem)/.98 var(--font-text); letter-spacing: -.045em; max-width: 11ch; margin: 0; text-wrap: balance; }
.fsg-head .fsg-intro { max-width: 34ch; color: var(--c-ink-2); font-size: var(--step-0); margin-top: 1rem; }
.fsg-head .fsg-back { display: inline-flex; align-items: center; min-height: 44px; font: 500 .85rem/1.4 var(--font-ui); margin-top: .5rem; }
.fs-gallery { padding-bottom: clamp(4rem, 7vw, 7rem); }
.fsg-filters { display: flex; align-items: center; gap: .5rem; padding: .9rem .2rem; border-top: 2px solid var(--c-ink); border-bottom: 1px solid var(--c-hairline); overflow-x: auto; scrollbar-width: thin; }
.fsg-filters a { display: inline-flex; gap: .65rem; align-items: center; flex: none; min-height: 44px; padding: .5rem 1rem; border: 1px solid transparent; border-radius: 99px; text-decoration: none; font: 500 .9rem/1 var(--font-ui); color: var(--c-ink); }
.fsg-filters a span { font: .7rem/1 var(--font-mono); opacity: .75; }
.fsg-filters a[aria-current] { background: var(--c-ink); color: var(--c-paper); }
.fsg-filters a:hover { border-color: var(--c-border); }
.fsg-index { display: flex; justify-content: space-between; gap: 1rem; margin: 1rem 0 1.5rem; font: 400 .7rem/1.6 var(--font-mono); color: var(--c-muted); text-transform: uppercase; letter-spacing: .04em; }
.fsg-index p { margin: 0; }
.fsg-wall { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(2.5rem, 5vw, 5rem) clamp(1.5rem, 3vw, 3.5rem); align-items: start; }
.fsg-wall .fsg-work { margin: 0; min-width: 0; display: block; width: 100%; }
.fsg-work .art-preview-link { display: block; position: relative; background: var(--c-paper-2); overflow: visible; }
.fsg-work .art-preview-link img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; filter: none; }
.fsg-open { position: absolute; bottom: .65rem; right: .65rem; display: grid; place-items: center; width: 36px; height: 36px; background: var(--c-paper); color: var(--c-ink); border: 1px solid var(--c-hairline); border-radius: 50%; font: 1.25rem/1 var(--font-ui); opacity: 0; transition: opacity 180ms; }
.fsg-work a:is(:hover,:focus-visible) .fsg-open { opacity: 1; }
.fsg-work figcaption { display: flex; flex-direction: column; gap: .4rem; padding-top: .9rem; border: 0; }
.fsg-date { display: flex; justify-content: space-between; gap: 1rem; color: var(--c-muted); font: 400 .68rem/1.5 var(--font-mono); }
.fsg-work .t { font: 500 1rem/1.4 var(--font-ui); color: var(--c-ink); }
.fsg-work .art-meta { font: 400 .9rem/1.5 var(--font-text); color: var(--c-ink-2); }
.fsg-work .art-source-link { align-self: start; display: inline-flex; align-items: center; min-height: 44px; font: 500 .75rem/1.5 var(--font-ui); }
.fsg-empty { padding-block: 3rem; }
.fsg-paging { display: flex; justify-content: center; gap: .6rem; border-top: 1px solid var(--c-hairline); padding-top: 2rem; }
.fsg-paging a { display: grid; place-items: center; min-width: 44px; min-height: 44px; border: 1px solid var(--c-border); border-radius: 50%; font-family: var(--font-ui); text-decoration: none; }
.fsg-paging a[aria-current] { color: var(--c-paper); background: var(--c-ink); }
@media (min-width: 40em) { .fsg-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64em) { .fsg-head { display: grid; grid-template-columns: 3fr 2fr; column-gap: 4rem; align-items: end; } .fsg-head .fsg-eyebrow { grid-column: 1 / -1; } .fsg-head .fsg-intro { margin: 0 0 .25rem; } .fsg-head .fsg-back { grid-column: 2; margin-top: .5rem; } }
@media (min-width: 70em) { .fsg-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .fsg-open { transition: none; } }
@media (hover: none) { .fsg-open { opacity: 1; } }

@keyframes fsg-reveal {
  from { opacity: .35; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    html.m-js .fsg-wall .fsg-work {
      animation: fsg-reveal linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 30%;
    }
    html.m-js .fsg-wall .fsg-work:focus-within {
      animation: none;
      opacity: 1;
      transform: none;
    }
  }
}

body:has(.fs-gallery) .lb-stage { overflow: hidden; }
body:has(.fs-gallery) .lb-stage img { width: 100%; height: 100%; min-height: 0; min-width: 0; object-fit: contain; }
.fsg-head .fsg-back a { display: inline-flex; align-items: center; min-height: 44px; }
