Reduce size of generated CSS

Big culprit is lots of media query duplication. EG in Twenty Fifteen, these are the media query dupe counts in output CSS:
1. @media screen and (min-width: 46.25em) 22x
2. @media screen and (min-width: 55em) 23x
3. @media screen and (min-width: 59.6875em) 26x
4. @media screen and (min-width: 68.75em) 23x
5. @media screen and (min-width: 77.5em) 25x
6. @media screen and (min-width: 38.75em) 1x
7. @media screen and (min-width: 46.25em) 22x
8. @media screen and (min-width: 55em) 23x
9. @media screen and (min-width: 59.6875em) 26x
10. @media screen and (min-width: 68.75em) 23x
11. @media screen and (min-width: 77.5em) 25x

O_o

Now, this annotation is coming through the legacy filter and is obviously a product of the annotation generator that is in current use. Way too many rules.

But, it might be worthwhile to explore:
1. Grouping all styles under particular media queries
2. Maybe also figure out a way to combine selectors that have the same value under the same selector. (Eg tons of fonts have the output of `font-style:normal;font-weight:400` - we could probably combo those)
3. Maybe don't output a CSS property when the set value will have the same value as what's in the annotation.

Start by locating the legacy filter and the annotation generator that produce the Twenty Fifteen output CSS, then compare its repeated media-query blocks. Explore grouping rules and combining equivalent declarations; done means the generated CSS has fewer duplicates while preserving the theme's styles.

Written by the indexing model from the issue text.