/* Only the three device illustrations in the homepage inventory section. */
#media .media-device-stage{position:relative;width:100%;min-width:0;height:calc(190px * var(--media-scale,1));margin:12px 0 28px;align-self:center;justify-self:center;flex-shrink:0}
#media .media-device-stage .mini-device{position:absolute;left:50%;top:50%;right:auto;bottom:auto;flex:none;max-width:none;min-width:0;margin:0!important;transform:translate(-50%,-50%) scale(var(--media-scale,1));transform-origin:center;transition:transform .4s}
#media .web .media-device-stage .mini-device{width:224px;height:140px;aspect-ratio:16 / 10}
#media .mobile .media-device-stage .mini-device{width:96px;height:180px;aspect-ratio:8 / 15}
#media .tv .media-device-stage .mini-device{width:224px;height:126px;aspect-ratio:16 / 9}
#media .tv .media-device-stage .mini-device::after{left:50%;transform:translateX(-50%)}
#media .media-card:hover .media-device-stage .mini-device{transform:translate(-50%,calc(-50% - 4px)) scale(var(--media-scale,1))}
@media(prefers-reduced-motion:reduce){#media .media-device-stage .mini-device{transition:none}#media .media-card:hover .media-device-stage .mini-device{transform:translate(-50%,-50%) scale(var(--media-scale,1))}}

/* Align the three caption groups to the top of their shared row. */
@media(min-width:761px){#media .media-card>div:not(.media-device-stage){margin-top:0}}
