.capture-gallery{--main-max:26.25rem;--gallery-gap:.375rem;--gallery-line-width:2px;--gallery-line-color:hsl(var(--primary));--thumb-by-height:calc((var(--main-max) - var(--gallery-gap))/2);--thumb-by-width:calc((100cqi - var(--main-max) - 3*var(--gallery-gap))/3);--thumb-size:min(var(--thumb-by-height),var(--thumb-by-width));width:100%;container-type:inline-size}.capture-layout{display:block}.capture-main{aspect-ratio:1;border-radius:.75rem;inline-size:min(100%,420px);overflow:hidden}.capture-main img{object-fit:cover;block-size:100%;inline-size:100%}.capture-thumbnails{--mobile-thumb:clamp(4.5rem,22cqi,6rem);gap:var(--gallery-gap);scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-block-start:var(--gallery-gap);display:flex;overflow:auto hidden}.capture-thumbnails::-webkit-scrollbar{display:none}.capture-thumbnail{flex:0 0 var(--mobile-thumb);inline-size:var(--mobile-thumb);block-size:var(--mobile-thumb);border:var(--gallery-line-width)solid var(--gallery-line-color);scroll-snap-align:start;border-radius:.5rem;overflow:hidden}.capture-thumbnail img{object-fit:cover;block-size:100%;inline-size:100%}button.capture-thumbnail{border-style:dashed;border-color:hsl(var(--primary)/.4);background-color:hsl(var(--secondary));cursor:pointer}button.capture-thumbnail:hover{border-color:hsl(var(--primary));background-color:hsl(var(--primary)/.05)}@container (min-width:52.875rem){.capture-layout{grid-template-columns:min(100%,var(--main-max))max-content;gap:var(--gallery-gap);justify-content:start;align-items:start;display:grid}.capture-thumbnails{grid-template-columns:repeat(3,var(--thumb-size));grid-template-rows:repeat(2,var(--thumb-size));gap:var(--gallery-gap);inline-size:calc(3*var(--thumb-size) + 2*var(--gallery-gap));block-size:calc(2*var(--thumb-size) + var(--gallery-gap));background:0 0;border:none;margin-block-start:0;display:grid;overflow:hidden}.capture-thumbnail{flex:unset;inline-size:var(--thumb-size);block-size:var(--thumb-size);aspect-ratio:1;background-color:hsl(var(--secondary));scroll-snap-align:unset;border-radius:.5rem;border:var(--gallery-line-width)solid var(--gallery-line-color)!important}.capture-thumbnails>button.capture-thumbnail{box-shadow:none;border-style:dashed!important;border-color:hsl(var(--primary)/.4)!important}.capture-thumbnails>button.capture-thumbnail:hover{background-color:hsl(var(--primary)/.05);border-color:hsl(var(--primary))!important}}
