mobile support! readme!! branding!!!

public/styles/main.css

@@ -13,12 +13,12 @@ body {
 }
 
 main {
-	margin: 1rem;
+	margin: 1rem 1rem 0 1rem;
 	border: 1px solid var(--colour);
 }
 
 pre#content {
-	height: calc(100vh - 66px);
+	height: calc(100vh - 5rem);
 	margin: 0;
 	padding: 1rem;
 	overflow-x: hidden;
@@ -46,6 +46,37 @@ div#carat {
 	}
 }
 
+footer {
+	height: 18px;
+	padding: .5em 2em;
+	display: flex;
+	gap: 1em;
+	align-items: center;
+}
+
+footer ul {
+	width: 100%;
+	margin: 0;
+	padding: 0;
+	display: flex;
+	justify-content: space-between;
+}
+
+footer li {
+	list-style: none;
+	opacity: .5;
+}
+
+footer li:hover {
+	text-shadow: 0 0 1em, 0 0 3em;
+	opacity: 1;
+}
+
+footer a {
+	color: var(--colour);
+	text-decoration: none;
+}
+
 div#overlay {
 	position: fixed;
 	top: 0;
@@ -69,3 +100,15 @@ div#overlay {
 		opacity: .6;
 	}
 }
+
+#mobile-input {
+	position: absolute;
+	top: 1.2em;
+	left: 1.2em;
+	width: calc(100vw - 3em);
+	height: calc(100vh - 3.9em);
+	opacity: 0;
+	user-select: none;
+	pointer-events: none;
+}
+