/* Ten owner-selected photographs; all cropping and layering is done in CSS. */
.doughnut-gallery{width:100%;max-width:480px;margin:34px 0 0}
.doughnut-gallery.doughnut-gallery--compact{width:86.691667%;max-width:439.42272px;margin-left:auto;margin-right:auto}
.doughnut-collage{position:relative;width:100%;aspect-ratio:100/var(--height);isolation:isolate}
.doughnut-bubble{position:absolute;left:calc(var(--x)*1%);top:calc(var(--y)*100%/var(--height));width:calc(var(--d)*1%);aspect-ratio:1;border-radius:50%;overflow:hidden;background:#fbf9f4;z-index:var(--layer,1)}
.doughnut-bubble::after{content:"";position:absolute;inset:0;border:1.25px solid #fbf9f4;border-radius:inherit;pointer-events:none;z-index:2}
.doughnut-bubble img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--focus-x) var(--focus-y);transform:scale(var(--zoom));transform-origin:var(--origin-x) var(--origin-y)}
@media(max-width:620px){.doughnut-gallery{margin-top:28px}}

/* Keep the desktop row at its approved nine-photo dimensions. The visible
   ten-photo composition is centred independently inside that stable frame. */
@media(min-width:901px){
  .doughnut-gallery-frame{position:relative;width:88%;max-width:422.4px;aspect-ratio:100/103;margin:34px auto 0}
  .doughnut-gallery-frame>.doughnut-gallery--compact{position:absolute;left:50%;top:6.359223%;width:104.03%;max-width:none;margin:0;transform:translateX(-50%)}
}
