Elements in Grid should change spanning dependend on attribute; does not work in Firefox

I want create some kind of tiled interface.
The tiles are li elements in a normal css grid, placed in one column, each tile contains a details element.
If the details element is expanded, this tile should span two columns.

This Minimum example works on Chrome, but not really in Firefox.
The view changes only after some events i don’t know (Toggling the Developers Window for example)
Yes, i enabled the experimental :has selector in firefox, this is not the problem.
(Tested in both Normal and Developer Preview versions of the browsers.)

Any recommendations how to get this working in Firefox?
Has this any relationgs with the incomplete support for :has or is it something seperate?