/* Give device photos the full available width without stretching the image. */
.plan-card-info,.plan-additions .plan-card-info{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 10px;padding:0 0 13px}
.plan-card-photo,.plan-additions .plan-card-photo{grid-column:1/-1;width:100%;height:auto;aspect-ratio:16/10;border-radius:0;object-fit:cover;object-position:center}
.plan-card-info>span:not(.plan-card-photo){margin-left:15px}
.plan-card-info>.icon{margin-right:15px}
.plan-card-info strong{font-size:17px}
.plan-card-photo.no-photo,.plan-additions .plan-card-photo.no-photo{height:86px;aspect-ratio:auto}

.single-view .exercise-photo{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center}
.single-view .photo-training,.single-view .photo-equipment{aspect-ratio:16/10}
.connected-exercise-photo{position:relative;width:100%;height:auto;aspect-ratio:16/10}
.connected-exercise-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}

/* A device detail can use more space than a short settings dialog. */
#sheet:has(.detail-photo){width:min(760px,calc(100vw - 40px));max-width:none;padding:24px}
#sheet .detail-photo{width:100%;height:auto;aspect-ratio:16/10;max-height:55dvh;object-fit:cover;object-position:center}
@media(max-width:700px){
  .exercise-photo{width:100%;height:auto;aspect-ratio:16/10}
  .photo-training,.photo-equipment{aspect-ratio:16/10}
  #sheet:has(.detail-photo){width:100%;max-width:100%;max-height:calc(100dvh - 12px);margin:auto 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));border-inline:0;border-bottom:0;border-radius:22px 22px 0 0}
  #sheet .detail-photo{width:calc(100% + 32px);max-width:none;margin-inline:-16px;border-radius:0;max-height:50dvh}
}