.recommendation-block-layout{display:grid;gap:24px;align-items:start}
.recommendation-block-media{min-width:0;display:grid;gap:16px}
.recommendation-block-media:empty,.recommendation-block-media[hidden]{display:none}
.recommendation-block-text{min-width:0}
body.index2-page .recommendation-block-media .recommendation-rank-image{margin-bottom:0}
.recommendation-block-layout--two-top .recommendation-block-media{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:761px){
 .recommendation-block-layout:is(.recommendation-block-layout--left,.recommendation-block-layout--right):has(.recommendation-rank-image){display:flow-root}
 .recommendation-block-layout--left:has(.recommendation-rank-image) .recommendation-block-media{float:left;width:calc(50% - 12px);margin:0 24px 16px 0}
 .recommendation-block-layout--right:has(.recommendation-rank-image) .recommendation-block-media{float:right;width:calc(50% - 12px);margin:0 0 16px 24px}
}
@media(max-width:760px){.recommendation-block-layout--two-top .recommendation-block-media{grid-template-columns:1fr}}
/* On a phone the photo determines its height; the desktop square must not leave an empty panel. */
@media(max-width:760px){body.index2-page.page-recommendation-detail .recommendation-block-media .recommendation-rank-image{aspect-ratio:auto;height:auto;min-height:0}body.index2-page.page-recommendation-detail .recommendation-block-media .recommendation-rank-image picture{display:block;width:100%;height:auto}body.index2-page.page-recommendation-detail .recommendation-block-media .recommendation-rank-image img{height:auto;width:100%;display:block}}