I got a reply asking why this is, which either got deleted or isn't showing up for some reason. The reason is, before nesting, you know based on context whether something is a selector or a declaration. Top level / inside a media query, it's a selector. Inside a selector, it's a declaration.
With nesting, but without the prefixed @nest, you have backtrack after arbitrarily many tokens if you see a & and need to switch from parsing a declaration to parsing a selector.
E.g.:
div {
div:hover div /* 4kb of div */ & { }
}
Note that the colon makes it a valid-looking declaration (property `div` and value `hover div...`), until you read all the way up to the &.
Yeah, it's all quite simple when thinking for a bit on a clear head. For some reason I didn't realize at first that the whole ‘:hover’ problem only pops up when nesting is introduced.
