ADDED   fabulist.scss
Index: fabulist.scss
==================================================================
--- fabulist.scss
+++ fabulist.scss
@@ -0,0 +1,89 @@
+body {
+	background: #370017;
+	color: #FFE1ED;
+	max-width: 35em;
+	padding: 1em;
+	margin: auto;
+	font-family: Alegreya, Junicode, GaramondNo8, "Garamond Premier Pro", "Adobe Garamond", Garamond, serif;
+	font-size: 15pt;
+}
+$widget-accent:#610028;
+%widget {
+	font-family: Alegreya, Junicode, GaramondNo8, "Garamond Premier Pro", "Adobe Garamond", Garamond, serif;
+	font-size: 14pt;
+	border: 1px inset darken($widget-accent,8);
+	background: $widget-accent;
+	color: white;
+	padding: 0.3em;
+	flex-grow: 2;
+	text-shadow: 0 0 10px #E84B8C;
+	box-sizing: border-box;
+	&:focus {
+		outline: none;
+		background: lighten($widget-accent,5);
+	}
+}
+textarea { @extend %widget; }
+input {
+	@extend %widget;
+	&[type=submit] {
+		position: absolute;
+		flex-grow: 0;
+		width: 30%;
+		right: 0;
+		top: 1em;
+		text-shadow: 0 0 10px #E84B8C;
+		border: 1px solid black;
+		&:hover {
+			background-color: #E31E6F;
+			color: black;
+		}
+		&:active {
+			background-color: darken($widget-accent,9);
+			color: lighten($widget-accent,60);
+			padding-bottom: calc(0.3em - 2px);
+			padding-top: calc(0.3em + 2px);
+		}
+	}
+}
+code {
+	font-family: Inconsolata, Monaco, monocode;
+	padding: 0.2em 0.3em;
+	background: #740C38;
+	border: 1px solid #260010;
+}
+textarea {
+	height: 6em;
+}
+form {
+	> div {
+		position: relative;
+		display: flex;
+		width: 100%;
+		align-items: center;
+	}
+	label {
+		margin-right: 0.5em;
+		margin-bottom: 0.5em;
+		margin-top: 0.5em;
+		font-weight: bold;
+	}
+}
+a[href] {
+	$a-color: #FF2E84;
+	color: $a-color;
+	text-decoration-color: darken($a-color,30);
+	&:hover {
+		color: lighten($a-color,40);
+		text-decoration-color: lighten($a-color,20);
+	}
+}
+h1 {
+	font-weight: 100;
+	margin-bottom: 0.0em;
+	border-bottom: 1px solid #FF7AB1;
+	a[href] {
+		color: #FF7AB1;
+		text-decoration: none;
+	}
+}