Tune body text for readability

[rmccue]

Issue Description

Follow-on from #569

This switched to the system font stack to avoid including a web font. The specific font switched to, on macOS systems, is SF Pro (specifically SF Pro Display I believe).

(As a side note, Proxima Nova is still both loaded onto the page via Typekit, and used in the body font-family rule.

SF Pro is a great font for UI, but it's not fantastic for body text at large sizes. Our regular body text is 18px, which is much larger than the designed use cases for SF Pro Display. As such, the font doesn't have great readability; the visual weight of the text is now much higher than previously, and the antialiasing looks a little off. (The visual weight is noticeable in the side-by-side screenshot on #569)

Currently, the font weight on .App is set to 400. Removing this to move to the default (300) per #453 improves the readability a bit, but SF Pro still looks a bit weird at this size. If we want to stick to the SF family, SF Pro Text is a much more legible alternative font at these sizes.

Alternatively, and probably a better long-term solution, is to lower the text size. 18px is one of those choices inherited from the pattern library, and I think is probably just straight up too big given the width of the content columns. This would increase the information density in both posts, and importantly, comments. Adjusting the root text size has a bunch of flow-on effects due to rem sizing though, so it'll need some other changes.

18px, 400 SF Pro Display	16px, 300 SF Pro Text

Steps to reproduce:

Only reproducible on macOS, as SF Pro only exists there.

Expected Result:

[kadamwhite]

Thanks for the issue. Clarity and historical context for whoever picks this up: the switch to the system font stack was specifically to increase font weight with the goal of increased readability. We've had a lot of complaints about the Proxima Nova font being illegibly light. Cc @CoreyBenefiel for further context if needed -- the goal here should be to find a good compromise for the aliasing issue (and possibly to clean up the vestiges of proxima nova entirely), rather than to revert to a font weight closer to the earlier style.

[kadamwhite]

(Should have stated in the above that I'm very much in favor of reducing the text size to 16)

[rmccue]

Yeah, I think there's a middle ground. Proxima Nova had problems due to a conflict between locally-installed fonts having different weights available in the file, compared to the version in Typekit, which I think is why #453 was a problem; I think the optical weight was also inconsistent across these.

Switching to a system font corrects this to some degree (although SF does get updated with macOS system updates). Downsizing, even while reducing the weight, is still optically darker than Proxima Nova:

Proxima Nova 18px 400	SF Pro 16px 300	SF Pro 16px 400

(Proxima Nova at 300 is way too light, but also was only being displayed at 300 if you had Proxima Nova installed locally. Note: I haven't adjusted any other metrics here aside from font family, size, and weight.)

[rmccue]

Sidenote: the font is inconsistent in the edit field too: