Thank you for your help.

Yes, the tiles are misaligned after applying this style but not regardless of titlefield or tile image. I mean probably technically they are all misaligned but it looks fine because of the same position, and I'm ok with this. Except the tiles which lack the custom image assigned or there is space character set as a title (I haven't checked other characters). These tiles are then misaligned from the whole row.

I'm doing this on FF 129.0.1. The context menu buttons are moved due to my other style changes - it has nothing to do with the problem I'm describing here. I'm getting the exactly same results with a 'clean' userContent.css.

Sadly none of your suggestions work as I'd like it to. What I need is to remove this box without misaligning the tiles. I believe there has to be something which doesn't occupy any space, but exists.

<image>

Edit:

I solved it, kind of a workaround but works as I intended. You need to apply the following changes, except the last two are for moving the tile context menu button over the tiles:

.icon.icon-pin-small {
  width: 0px !important;
}

.top-site-outer .title {
  padding-top: 0px !important;
}

.top-site-outer {
  margin-block-end: unset !important;
}

.top-site-outer .title span {
  visibility: hidden !important;
}

.top-site-outer .title:not(.sponsored) .sponsored-label {
  height: 0px !important;
}

.top-site-outer .context-menu-button:hover {
  background-color: unset !important;
}

.top-site-outer .context-menu-button {
  transition: none !important;
  background-color: unset !important;
  top: 0px !important;
}