Confused by css subdirectory

Hi,
I am working on upgrading and refreshing a theme from 1.x to 2. I'm confused by the myriad of files in the css subdir of my subtheme, and not sure where to put my modifications. Some items, like body{}, are overridden if defined in layout-*.css by pages.css, for example. Others, like header{}, are inherited. This makes it unclear where to put such modifications.

Since the subtheme.css file has been deprecated, it would be valuable to provide some additional guidance on how the devs envision modifications occurring. I can't tell if I ought to be defining all my page regions in layout-*.css and removing the overrides in pages.css, or doing it in pages-backgrounds, or in pages.css itself.