Haxxor!

styles/Home.module.css

@@ -0,0 +1,7 @@
+.container {
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    margin: 0;
+    padding: 10px;
+}

styles/REPL/REPLHistory.module.css

@@ -1,10 +1,12 @@
 .container {
-    height: 70vh;
     overflow: auto;
     display: flex;
     flex-direction: column-reverse;
+    flex-grow: 2;
+    font-size: 1.25rem;
+    font-family: "CascadiaCode", monospace;
 }
 
 .line {
-    border-bottom: 1px solid #000;
+    padding: 3px 0;
 }

styles/REPL/REPLInput.module.css

@@ -1,18 +1,36 @@
 .wrapper > input, .wrapper > span {
+    padding: .125rem 0;
     font-size: 1.25rem;
-    font-family: "CascadiaCode";
-    padding: .125rem .25rem;
-    width: calc(100% - 1rem);
+    font-family: "CascadiaCode", monospace;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    color: var(--repl-color);
 }
 
 .wrapper {
     position: relative;
-    border: 2px solid #000;
+    flex-grow: 2;
+    display: block;
+}
+
+.wrapperwrapper {
+    display: flex;
+    width: 100%;
+    flex-direction: row;
+    flex-wrap: nowrap;
+}
+
+.inputstart {
+    padding: .125rem 0;
+    font-size: 1.25rem;
+    font-family: "CascadiaCode", monospace;
 }
 
 .in, .in:focus {
     border: 0;
     outline-width: 0;
+    background: transparent;
 }
 
 .completionWrapper {
@@ -34,5 +52,5 @@
 }
 
 .completion {
-    color: #ccc
+    color: var(--repl-color-hint);
 }

styles/globals.css

@@ -5,4 +5,13 @@
 
 * {
   box-sizing: border-box;
+  --repl-color: #188a18;
+  --repl-color-hint: #092909;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  color: var(--repl-color);
+  background: #000;
 }