Normalize some of the single instance interface

This is a first draft at unifying the look so it's easier to compare.

I broke the controls positioning 😭 help me @iseeulde, you're my only hope!

shared/index.css

@@ -1,18 +1,32 @@
+/**
+ * Basic
+ */
+
+html,
+body {
+	margin: 0;
+	padding: 0;
+	height: 100%;
+}
+
+* {
+	box-sizing: border-box;
+}
+
 body {
-	background: #f3f6f8;
-	color: #2f4452;
-	font-family: "Noto Serif", Georgia, "Times New Roman", Times, serif;
-	font-size: 1.25em;
-	line-height: 1.5;
-	margin: 1em;
+	font: 13px/1.8 -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
+	max-width: 720px;
+	margin: 60px auto;
+	color: #12181e;
 }
 
+/**
+ * Editor Basics
+ */
+
 #editor {
-	background: #fff;
-	margin: 5em auto;
 	outline: none;
-	padding: 5em;
-	width: 37.5em;
+	padding-bottom: 100px;
 }
 
 #editor .text-align-left {
@@ -41,6 +55,52 @@ body {
 	height: auto;
 }
 
+#editor svg {
+	fill: currentColor;
+}
+
+
+/**
+ * Editor Basic Blocks
+ */
+
+#editor p,
+#editor blockquote,
+#editor h1,
+#editor h2,
+#editor h3,
+#editor h4,
+#editor h5,
+#editor h6,
+#editor img {
+	font-family: "Noto Serif", serif;
+	margin: 30px 0;
+	position: relative;
+	box-shadow: inset 0px 0px 0px 0px #e0e5e9;
+	transition: all .2s ease;
+	padding: 0 6px; 
+}
+
+#editor h2 {
+	font-weight: 900;
+	font-size: 28px;
+}
+
+#editor p {
+	font-size: 16px;
+	min-height: 3.4em;
+}
+
+#editor blockquote {
+	font-size: 20px;
+	border-left: 4px solid black;
+	font-style: italic;
+}
+
+#editor section:focus {
+	outline: none;
+}
+
 #editor figure {
 	clear: both;
 	float: none;
@@ -88,7 +148,6 @@ body {
 }
 
 #editor figcaption {
-	font-size: 0.8em;
 	margin-top: 0.5em;
 }
 
@@ -108,7 +167,7 @@ body {
 }
 
 #editor hr:before {
-	content: '\2767';
+	content: '· · ·';
 	display: block;
 	text-align: center;
 }