[data-transition="tiles"] {
  --tile-color: var(--body-bg, #fff);
  position: relative;
  opacity: 0;
}

[data-transition="tiles"] .tiles {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

[data-transition="tiles"] .tiles > * {
  background-color: var(--tile-color);
	transition: background-color var(--body-bg-transition-duration) var(--body-bg-transition-easing);
  margin-inline-start: -1px;
  margin-top: -1px;
}

.tiles-on-top .tiles {
  z-index: 2;
}