.outfit-motion{position:relative;display:block;width:100%;background:#292c28;overflow:hidden;isolation:isolate}
.outfit-motion video{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;background:#292c28;cursor:pointer}
.outfit-motion .motion-toggle{position:absolute;z-index:2;left:12px;bottom:12px;padding:10px 14px;border:1px solid #f4f1e5;background:#161914e8;color:#fff;font:500 13px Arial,sans-serif;line-height:1.3;border-radius:3px;cursor:pointer;min-height:40px}
.card-link>.motion-toggle-card{position:static;width:100%;margin-top:12px;border-color:#d3dc98;background:transparent;color:#d3dc98;text-align:left}
.outfit-motion .motion-toggle:focus-visible{outline:3px solid #d3dc98;outline-offset:3px}
.outfit-motion .motion-caption{position:absolute;z-index:2;bottom:62px;left:8%;right:8%;margin:0;padding:7px 10px;text-align:center;background:#161914df;color:white;font:14px/1.4 Arial,sans-serif;pointer-events:none}
.detail-photo .outfit-motion video{height:min(82dvh,900px);max-height:82dvh;aspect-ratio:auto;object-fit:contain}
.detail-photo:has(.outfit-motion){position:sticky;top:0;align-self:start}
@media(max-width:650px){.detail-photo .outfit-motion video{height:65dvh;max-height:65dvh}.outfit-motion .motion-caption{font-size:12px}.outfit-motion .motion-toggle{left:8px;bottom:8px;padding:8px 10px}}

.outfit-motion .motion-still{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:1;background:#292c28}.outfit-motion video{visibility:hidden}.outfit-motion.is-playing video{visibility:visible}.outfit-motion.is-playing .motion-still{visibility:hidden}


/* PHONE CAST GRID (Oct 14 2026) - phones only; desktop/laptop unchanged */
@media (max-width: 620px) {
  .cast-row-wrap { overflow: visible !important; }
  .cast-row-wrap > button, .cast-row-wrap .cast-arrow, .cast-row-wrap [class*="arrow"], .cast-row-wrap [class*="hint"] { display: none !important; }
  #featuredModels {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-flow: row dense !important;
    gap: 0.9rem 0.5rem !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  #featuredModels > .model-card { flex: none !important; width: auto !important; min-width: 0 !important; scroll-snap-align: none !important; }
  /* tile: whole body, name underneath */
  #featuredModels > .model-card .cast-head { display: none !important; }
  #featuredModels > .model-card .model-media { display: block !important; aspect-ratio: 1 / 2 !important; border-radius: 4px; }
  #featuredModels > .model-card .model-media img,
  #featuredModels > .model-card .model-media video { object-fit: cover !important; object-position: center top !important; }
  #featuredModels > .model-card .model-info { padding: 0.35rem 0 0 !important; gap: 0 !important; }
  #featuredModels > .model-card .model-info figcaption {
    position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important;
    font-size: 0.78rem !important; letter-spacing: 0.12em !important; text-transform: uppercase; text-align: center; flex-basis: 100%;
  }
  #featuredModels > .model-card .model-info a.model-looks-link { display: none !important; }
  /* tapped person: opens full width, whole body, video with sound, shop button */
  #featuredModels > .model-card[data-state="sound"],
  #featuredModels > .model-card[data-state="ended"] { grid-column: 1 / -1; }
  #featuredModels > .model-card[data-state="sound"] .model-media,
  #featuredModels > .model-card[data-state="ended"] .model-media { aspect-ratio: auto !important; height: calc(100svh - 240px) !important; }
  #featuredModels > .model-card[data-state="sound"] .model-media img,
  #featuredModels > .model-card[data-state="sound"] .model-media video,
  #featuredModels > .model-card[data-state="ended"] .model-media img,
  #featuredModels > .model-card[data-state="ended"] .model-media video { object-fit: contain !important; object-position: center center !important; }
  #featuredModels > .model-card[data-state="sound"] .model-info figcaption,
  #featuredModels > .model-card[data-state="ended"] .model-info figcaption { font-size: 1.2rem !important; padding: 0.3rem 0 0.5rem; }
  #featuredModels > .model-card[data-state="sound"] .model-info a.model-looks-link,
  #featuredModels > .model-card[data-state="ended"] .model-info a.model-looks-link { display: block !important; }
}

/* PHONE: show all 24 cast (Oct 15 2026) - second dozen uses the same 3-across grid, "See all" toggle hidden */
@media (max-width: 620px) {
  .more-models > summary { display: none !important; }
  #remainingModels {
    display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-auto-flow: row dense !important;
    gap: 0.9rem 0.5rem !important; padding: 0 !important; margin: 0.9rem 0 0 !important; overflow: visible !important;
  }
  #remainingModels > .model-card { flex: none !important; width: auto !important; min-width: 0 !important; }
  #remainingModels > .model-card .cast-head { display: none !important; }
  #remainingModels > .model-card .model-media { display: block !important; aspect-ratio: 1 / 2 !important; border-radius: 4px; }
  #remainingModels > .model-card .model-media img,
  #remainingModels > .model-card .model-media video { object-fit: cover !important; object-position: center top !important; }
  #remainingModels > .model-card .model-info { padding: 0.35rem 0 0 !important; gap: 0 !important; }
  #remainingModels > .model-card .model-info figcaption {
    position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important;
    font-size: 0.78rem !important; letter-spacing: 0.12em !important; text-transform: uppercase; text-align: center; flex-basis: 100%;
  }
  #remainingModels > .model-card .model-info a.model-looks-link { display: none !important; }
  #remainingModels > .model-card[data-state="sound"], #remainingModels > .model-card[data-state="ended"] { grid-column: 1 / -1; }
  #remainingModels > .model-card[data-state="sound"] .model-media, #remainingModels > .model-card[data-state="ended"] .model-media { aspect-ratio: auto !important; height: calc(100svh - 240px) !important; }
  #remainingModels > .model-card[data-state="sound"] .model-media img, #remainingModels > .model-card[data-state="sound"] .model-media video,
  #remainingModels > .model-card[data-state="ended"] .model-media img, #remainingModels > .model-card[data-state="ended"] .model-media video { object-fit: contain !important; object-position: center center !important; }
  #remainingModels > .model-card[data-state="sound"] .model-info figcaption, #remainingModels > .model-card[data-state="ended"] .model-info figcaption { font-size: 1.2rem !important; padding: 0.3rem 0 0.5rem; }
  #remainingModels > .model-card[data-state="sound"] .model-info a.model-looks-link, #remainingModels > .model-card[data-state="ended"] .model-info a.model-looks-link { display: block !important; }
}