/* Keep the complete current product captures visible in every preview. */
.cinema-frame .cinema-frame-head,
.detail-frame .window-bar,
.detail-dashboard-link {
  background: #111111;
  border-color: #303030;
}
.cinema-frame, .cinema-screen { background: #111111; }
.cinema-screen img[src*="/20260916/"],
.screen-button img[src*="/20260916/"] {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
  display: block;
}
.preview-canvas #previewImage {
  width: 1280px;
  max-width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
}
/* Present Case-me's actual panels without the baked-in marketing surround.
   Keep the original blue hero artwork and detail-section background. */
.product-slide[data-product="subsana"] .cinema-frame,
#subsana .detail-frame {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.product-slide[data-product="subsana"] .cinema-frame-head,
#subsana .window-bar { display: none; }
button[data-preview="subsana"],
.preview-canvas:has(#previewImage[src*="subsana-"]) {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
  max-height: none;
  padding: 0;
  background: transparent;
  aspect-ratio: 1100 / 482;
  --capture-width: 116.363636%;
  --capture-left: -8.181818%;
  --capture-top: -31.120332%;
}
button[data-preview="subsana"][data-detail],
.preview-canvas:has(#previewImage[src*="subsana-detail"]) {
  aspect-ratio: 968 / 520;
  --capture-width: 132.231405%;
  --capture-left: -16.115702%;
  --capture-top: -25.192308%;
}
button[data-preview="subsana"] img[src*="/20260916/"],
.preview-canvas #previewImage[src*="subsana-"] {
  position: absolute;
  width: var(--capture-width);
  max-width: none;
  height: auto;
  aspect-ratio: 16 / 9;
  left: var(--capture-left);
  top: var(--capture-top);
}
@media (max-width:600px) {
  .detail-results .screen-button>img[src*="/20260916/"] { display:none; }
}
/* New focused Case-me workspace is already framed at its final dimensions. */
#previewDialog:has(#previewImage[src*="subsana-case-workspace"]) {
  width: min(1200px, 94vw, calc((100dvh - 160px) * 16 / 9));
}
button[data-preview="subsana"][data-preview-src*="subsana-case-workspace"],
.preview-canvas:has(#previewImage[src*="subsana-case-workspace"]) {
  aspect-ratio: 16 / 9;
}
button[data-preview-src*="subsana-case-workspace"] img,
.preview-canvas #previewImage[src*="subsana-case-workspace"] {
  position: static;
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
}

/* Supplied Survey-me CX Overview: preserve the entire dashboard without cropping. */
.cinema-screen img[src*="percibe-cx-overview"],
.screen-button img[src*="percibe-cx-overview"],
.preview-canvas #previewImage[src*="percibe-cx-overview"] {
 width:100%;max-width:100%;height:auto;aspect-ratio:1770/808;object-fit:contain;display:block;
}
#previewDialog:has(#previewImage[src*="percibe-cx-overview"]){width:min(1600px,94vw,calc((100dvh - 200px) * 1770 / 808));}