Everything starts grayed out:
Clicking anything causes the popup to disappear.
Works fine on meta, though.
I have pushed a fix for this to our dev server. The change will be live after our next production build.
The bug seems to be caused by the following CSS rule:
Why is this rule a problem? It's because any element with a
while the semitransparent box used to "gray out" the rest of the page is located outside it.
Thus, it doesn't really matter if the popup div has a z-index of 10, 100, 1000 or 1000000; as long as it's located inside the header in the DOM, and as long as the header has a z-index value of 2 (and thus defines a new stacking context), the popup also behaves as if its z-index was 2 with respect to everything outside the header.
The proper way to fix this would be to change the popup-generating code to make sure that both the popup itself and the gray background behind it are injected into the same place in the DOM, and thus into the same stacking context.
In the mean time, however, a quick and dirty fix would be to just remove the
Edit: Ah, wait, I do see an issue: the small paperclip / oval thingies on the top right corner of the page need the z-index boost to render on top of the content area. Fortunately, this is easy enough to fix with the following CSS rules:
Ps. Since Stéphane Martin's fix doesn't seem to have gone live yet, I've gone ahead and included the two CSS rules above in the SOUP v1.10 release. Just to be safe, they're currently only applied to workplace.SE; if you find any other SE sites affected by this bug, please let me (and the SE devs!) know.