body.project-gallery-open{overflow:hidden}project-gallery{--gallery-ink:#302d27;--gallery-paper:#f6f3ec;--gallery-olive:#68745a;display:block}.project-gallery{color:var(--gallery-ink);border:2px solid var(--gallery-ink);box-shadow:7px 7px 0 var(--gallery-ink);background:#eeebe3;margin:0 7px 7px 0;padding:clamp(16px,2.2vw,28px)}.project-gallery-heading{justify-content:space-between;align-items:end;gap:18px;padding-bottom:18px;display:flex}.project-gallery-kicker{letter-spacing:.04em;text-transform:uppercase;font:11px/1.3 monospace}.project-gallery-heading h2{letter-spacing:-.04em;margin:8px 0 0;font-size:clamp(21px,2.5vw,32px)}.project-gallery-controls{align-items:center;gap:7px;display:flex}.project-gallery-count{font-variant-numeric:tabular-nums;text-align:right;min-width:54px;margin-right:6px;font:11px monospace}.project-gallery-button{border:2px solid var(--gallery-ink);background:var(--gallery-paper);width:42px;height:42px;color:var(--gallery-ink);box-shadow:3px 3px 0 var(--gallery-ink);cursor:pointer;border-radius:0;place-items:center;padding:0;display:grid}.project-gallery-button:hover{background:#dce1cd}.project-gallery-button:focus-visible,.project-gallery-track:focus-visible,.project-gallery-item:focus-visible{outline:3px solid var(--gallery-olive);outline-offset:4px}.project-gallery-track{overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-color:#68745a #dcd6ca;scrollbar-width:thin;grid-auto-columns:calc(20% - 9.6px);grid-auto-flow:column;gap:12px;padding:2px 2px 12px;display:grid;overflow-x:auto}.project-gallery-item{scroll-snap-align:start;min-width:0;color:inherit;background:#f8f5ee;border:1px solid #302d2770;display:block}.project-gallery-image{aspect-ratio:4/3;background:#dcd6ca;display:block;position:relative;overflow:hidden}.project-gallery-play{border:1px solid var(--gallery-ink);color:var(--gallery-ink);background:#f6f3ecef;align-items:center;gap:5px;padding:4px 6px;font:11px monospace;display:flex;position:absolute;bottom:8px;left:8px}.project-gallery-play svg{width:17px;height:17px}.project-gallery-image img{object-fit:cover;width:100%;height:100%;transition:transform .18s}.project-gallery-item[data-kind=video] .project-gallery-image img{object-fit:contain}.project-gallery-item:hover img{transform:scale(1.035)}.project-gallery-item-label{background:#dce1cd;border-bottom:1px solid #302d2770;padding:9px 12px;font:12px/1.3 monospace;display:block}project-gallery[data-gallery-variant=history] .project-gallery-track{grid-auto-columns:calc(50% - 8px);gap:16px}project-gallery[data-gallery-variant=history] .project-gallery-image{aspect-ratio:2.2;background:#fff}project-gallery[data-gallery-variant=history] .project-gallery-image img{object-fit:contain}project-gallery[data-gallery-variant=history] .project-gallery-item:hover img{transform:none}.project-gallery-hint{color:#6b6357;margin:10px 0 0;font-size:11px}.project-gallery-dialog{width:100%;max-width:none;height:100dvh;max-height:none;color:var(--gallery-ink);background:#f0ede5;border:0;margin:0;padding:clamp(14px,3vw,36px)}.project-gallery-dialog[open]{flex-direction:column;gap:14px;display:flex}.project-gallery-dialog::backdrop{background:#302d27db}.project-viewer-top,.project-viewer-bottom{flex:none;justify-content:space-between;align-items:center;gap:18px;font:12px monospace;display:flex}.project-viewer-image{flex:1;justify-content:center;min-height:0;display:flex}.project-viewer-image img{object-fit:contain;width:100%;height:100%}.project-viewer-image video{object-fit:contain;width:100%;max-width:100%;height:100%;max-height:100%}.project-viewer-image [hidden]{display:none}.project-viewer-bottom{justify-content:flex-end}.project-viewer-bottom>div{gap:8px;display:flex}@media (width<=1000px){.project-gallery-track{grid-auto-columns:calc(33.3333% - 8px)}}@media (width<=680px){.project-gallery{padding:14px}.project-gallery-heading{align-items:start}.project-gallery-heading h2{font-size:21px}.project-gallery-kicker{font-size:9px}.project-gallery-count{display:none}.project-gallery-button{width:38px;height:38px}.project-gallery-track{grid-auto-columns:72%}project-gallery[data-gallery-variant=history] .project-gallery-track{grid-auto-columns:90%}}@media (prefers-reduced-motion:reduce){.project-gallery-track{scroll-behavior:auto}.project-gallery-image img{transition:none}}
