/* Portrait galleries occupy the same 4:5 frame as a single listing image. */
#vp-portal .ai-portrait-gallery {
  position:relative;
  width:100%;
  aspect-ratio:4 / 5;
  min-width:0;
  overflow:hidden;
  border-radius:6px;
  background:var(--vp-surface,#211f20);
}
#vp-portal .ai-portrait-gallery__viewport {
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  touch-action:pan-y;
}
#vp-portal .ai-portrait-gallery__slide {
  position:absolute;
  inset:0;
  display:block;
  min-width:0;
  margin:0;
  padding:0;
  width:100%;
  height:100%;
  background:var(--vp-surface,#211f20);
}
#vp-portal .ai-portrait-gallery__slide[hidden] {display:none!important;}
#vp-portal .ai-portrait-gallery__slide img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:var(--ai-gallery-object-position,50% 30%);
}
#vp-portal .ai-portrait-gallery__controls {
  position:absolute;
  inset:50% 0 auto;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
}
#vp-portal .ai-portrait-gallery__controls > button {
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  min-width:44px;
  height:44px;
  padding:0;
  border:0;
  border-radius:5px;
  color:var(--vp-text,#f5f2f0);
  background:transparent;
  font:inherit;
  line-height:1;
  pointer-events:auto;
}
#vp-portal .ai-portrait-gallery__controls > button { cursor:pointer; }
#vp-portal .ai-portrait-gallery__controls > button > span {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  color:inherit;
  background:#17171699;
  line-height:0;
}
#vp-portal .ai-portrait-gallery__controls button:disabled { visibility:hidden; cursor:default; }
#vp-portal .ai-portrait-gallery .ai-portrait-gallery__controls > button:is(:hover,:focus,:focus-visible,:active) {
  color:var(--vp-text,#f5f2f0);
  background:transparent;
  border:0;
  outline:0;
  box-shadow:none;
}
#vp-portal .ai-portrait-gallery .ai-portrait-gallery__controls > button:is(:hover,:focus,:active) > span {
  color:var(--vp-text,#f5f2f0);
  border:0;
}
#vp-portal .ai-portrait-gallery .ai-portrait-gallery__controls > button:focus-visible > span {
  outline:1px solid #fff;
  outline-offset:2px;
}
#vp-portal .ai-portrait-gallery__viewport:focus-visible {outline:1px solid #fff;outline-offset:-2px;}
#vp-portal .ai-portrait-gallery__slide:focus-visible {outline:1px solid #fff;outline-offset:-2px;}
#vp-portal .ai-portrait-gallery__controls svg {display:block;flex:none;width:16px;height:16px;}
#vp-portal .ai-portrait-gallery__controls [data-ai-gallery-prev] svg {transform:translateX(-1px);}
#vp-portal .ai-portrait-gallery__controls [data-ai-gallery-next] svg {transform:translateX(1px);}
@media(prefers-reduced-motion:no-preference) {
  #vp-portal .ai-portrait-gallery__slide:not([hidden]) {animation:ai-portrait-enter .18s ease-out;}
}
@keyframes ai-portrait-enter {from {opacity:.65;} to {opacity:1;}}

/* Touch galleries use the same native finger-driven scrolling as home cards. */
#vp-portal .ai-portrait-gallery[data-ai-swipe="native"] .ai-portrait-gallery__viewport{display:flex;overflow-x:auto;overflow-y:hidden;touch-action:pan-x pan-y;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
#vp-portal .ai-portrait-gallery[data-ai-swipe="native"] .ai-portrait-gallery__viewport::-webkit-scrollbar{display:none}
#vp-portal .ai-portrait-gallery[data-ai-swipe="native"] .ai-portrait-gallery__slide{position:relative;inset:auto;flex:0 0 100%;width:100%;height:100%;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always;animation:none}
