Use a @supports query for logo image-rendering

Unfortunately, right now Chrome only supports "pixelated", and Firefox
only supports "crisp-edges", so this should give the best result across
browsers.

tildes/scss/modules/_site-header.scss

@@ -26,7 +26,14 @@
 .site-header-logo {
   background-image: url(/favicon-32x32.png);
   background-repeat: no-repeat;
+
+  // keep the logo pixelated - "pixelated" is best but Firefox only supports
+  // "crisp-edges" as of Firefox 68
+  image-rendering: pixelated;
+  @supports not (image-rendering: pixelated) {
     image-rendering: crisp-edges;
+  }
+
   padding-left: 40px;
   padding-right: 8px;
   line-height: 32px;