[bug]: Unloaded states have inconsistent style

[zetlen]

We have:

• hand-coded HTML behind a <noscript> tag for no-JS browsers
• simple placeholder text while the initial bundles load
• a nice loading indicator
• a static "not found" page

To Reproduce
Steps to reproduce the behavior:

1. Open Chrome dev tools.
2. Enter Mobile Emulation Mode.
3. Drop down the "No throttling" menu and select "Fast 3G" (or equivalent).
4. Visit venia.magento.com

Expected behavior
A smooth loading experience.

Screenshots

First Homepage Paint

App data loading for all screens

Page not found, loading

Page not found, loaded

JS Disabled

These states are wildly inconsistent with one another! They need to be brought in line.

Additional context
Related to #46, where we talk about our offline solutions in general.
We may have some future way of compiling certain React components down into static templates, or extracting critical CSS. However we fix this, it'll be a first pass.

Possible solutions
Add some minimal inlined CSS to visually match the in-app loading indicator. Replace the "Loading" text in the template with a styled version.

Rebuild the js-unavailable partial to reuse this style, to keep page size low.

Please complete the following device information:

• iPhone SE in screenshots
• PWA Studio Version: 2.1.0

Please let us know what packages this bug is in regards to:

• venia-concept
• pwa-buildpack
• peregrine
• pwa-devdocs
• upward-js
• upward-spec