Hidden conditional fields using only html and css in a form

[jenovs]

What does the "~" (tilde/squiggle/twiddle) CSS selector mean?

In short: ~ matches all .conditional elements after #foo:not(:checked).
Solution would be to wrap groups in e.g. <div>