diff --git a/assets/sass/components/_global.scss b/assets/sass/components/_global.scss
index 22ef8489..a482710e 100644
--- a/assets/sass/components/_global.scss
+++ b/assets/sass/components/_global.scss
@@ -36,19 +36,17 @@ main {
 
   @include colors() {
     background-color: c(background-inner);
+    color: c(text);
   }
 }
 
+// this is what's extended by different layouts (in ../pages)
 div.layout {
   max-width: $max-width;
   margin: 0 auto;
   padding-left: 1.5em;
   padding-right: 1.5em;
   display: block; // https://stackoverflow.com/questions/28794718/max-width-not-working-for-ie-11
-
-  @include colors() {
-    color: c(text);
-  }
 }
 
 /*! Credit for cool link underlines: https://www.dannyguo.com/blog/animated-multiline-link-underlines-with-css/ */
@@ -100,24 +98,6 @@ hr {
   }
 }
 
-// button reset
-button {
-  border: 0;
-  margin: 0;
-  padding: 0;
-  overflow: visible;
-  background: transparent;
-
-  // inherit font & color from ancestor
-  color: inherit;
-  font: inherit;
-  line-height: normal;
-
-  // corrects inability to style clickable `input` types on iOS
-  // stylelint-disable-next-line plugin/no-unsupported-browser-features
-  appearance: none;
-}
-
 // make SVG twemojis relative to surrounding text
 // https://github.com/twitter/twemoji#inline-styles
 img.emoji {
@@ -132,7 +112,8 @@ img.emoji {
   // have cursor act like it's hovering a regular unicode emoji, especially since twemojis can still be copied/pasted
   cursor: text;
 }
-// manually unset cursor when emoji's in a link, otherwise it'll keep text cursor set above
+
+// need to manually unset text cursor above when emoji's within a link
 a img.emoji {
   cursor: inherit;
 }
@@ -143,13 +124,8 @@ a img.emoji {
     // Safari iOS menu bar reappears below 44px:
     // https://www.eventbrite.com/engineering/mobile-safari-why/
     padding-bottom: 45px !important;
+
     // Allows you to scroll below the viewport; default value is visible
     overflow-y: scroll;
-
-    // Fix weird font size behavior on iOS Safari: https://github.com/jakejarvis/jarv.is/issues/18
-    // https://stackoverflow.com/questions/3226001/some-font-sizes-rendered-larger-on-safari-iphone
-    // https://www.456bereastreet.com/archive/201011/beware_of_-webkit-text-size-adjustnone/
-    // stylelint-disable-next-line plugin/no-unsupported-browser-features
-    text-size-adjust: 100%;
   }
 }
diff --git a/assets/sass/components/_header.scss b/assets/sass/components/_header.scss
index 3849c7aa..cf3bfde7 100644
--- a/assets/sass/components/_header.scss
+++ b/assets/sass/components/_header.scss
@@ -112,8 +112,15 @@ header {
 
       // Dark mode toggle
       button.dark-mode-toggle {
+        // native button reset
+        border: 0;
+        padding: 0;
+
+        // prepare for lightbulb symbol depending on active theme (set in components/_global)
+        background-color: transparent;
         background-repeat: no-repeat;
         background-size: 100% 100%;
+
         height: 1.5em;
         width: 1em;
         margin-left: 1.7em;
diff --git a/assets/sass/pages/_home.scss b/assets/sass/pages/_home.scss
index 9e344a59..0564dc64 100644
--- a/assets/sass/pages/_home.scss
+++ b/assets/sass/pages/_home.scss
@@ -31,10 +31,7 @@ div#layout--home {
 
   sup {
     letter-spacing: normal;
-    line-height: 0;
     position: relative;
-    top: -0.5em;
-    vertical-align: baseline; // required for same position in chrome vs. firefox
 
     &#key {
       font-family: $webfont-mono;