.controls{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem 2rem}.controls-label{display:block;margin-bottom:.375rem;color:var(--muted);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}.controls [role=group]{margin-bottom:.375rem;width:auto}.controls small{display:block;color:var(--muted)}.toggle{display:inline-flex;align-items:center;gap:.625rem;color:var(--color);text-decoration:none}.toggle:before{flex-shrink:0;transition:background-color .15s,background-position .15s;border-radius:1rem;background:var(--input-border) radial-gradient(circle,#fff .5rem,transparent .5625rem) no-repeat left .125rem center / 1.25rem 1.25rem;width:2.5rem;height:1.5rem;content:""}.toggle[aria-checked=true]:before{background-color:var(--primary);background-position:right .125rem center}.toggle:hover{color:var(--heading)}.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,300px));justify-content:center;align-items:start;gap:2rem 1.5rem}.gallery figure{margin:0}.blur-up{display:block;border-radius:.5rem;background-size:cover;width:100%}.placeholder-only{aspect-ratio:var(--ratio);border-radius:.5rem;background-size:cover}.original{position:relative;margin-top:.75rem;border-radius:.375rem;overflow:hidden}.original img{display:block;width:100%}.crop-frame{position:absolute;transition:left .3s,top .3s;box-shadow:0 0 0 100vmax #0009;border:2px solid var(--primary);border-radius:.25rem}.gallery figcaption{padding:.75rem 0 0}.gallery figcaption p{margin:0 0 .375rem;color:var(--heading);font-size:.9375rem}.gallery figcaption small{color:var(--muted)}
