.gallery[open]{margin-bottom:3rem}.gallery h3{margin-bottom:1.5rem}.photos{display:grid;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr))}.photos:has(figure:hover) figure:not(:hover){opacity:.7;filter:grayscale(100%)}.photos picture,.photos .photo-copyright{grid-area:1/1}.photo{--shadow-off: 3px;--shadow: #000a;aspect-ratio:5/3;rotate:calc(var(--rotation)*1deg);transition:all .5s}.photo:hover,.photo:focus{rotate:0deg;scale:1.2;z-index:1}.photo img{aspect-ratio:5/3;object-fit:cover;box-shadow:var(--shadow-off) var(--shadow-off) calc(2*var(--shadow-off)) var(--shadow)}.unbutton{appearance:none;background-color:rgba(0,0,0,0);border:none}.photo-copyright{position:absolute;bottom:-2em;place-self:end;color:#fff;font-size:.8em;text-shadow:0 0 3px rgba(0,0,0,.8666666667)}dialog{--shadow-off: 6px;--shadow: #000d;padding:0;border:0;overflow:visible}dialog::backdrop{background-color:rgba(0,0,0,.8666666667)}dialog figure{display:grid;margin:0}dialog img,dialog figcaption{grid-area:1/1}dialog img{box-shadow:var(--shadow-off) var(--shadow-off) calc(2*var(--shadow-off)) var(--shadow)}dialog .unbutton{position:absolute;top:0;right:0;padding:0;translate:0 -100%;color:#fff}
