add: socket

app/public/style.css

@@ -140,6 +140,11 @@ nav.sticky {
     width: 100%;
 }
 
+.container.small {
+    margin: 0 auto;
+    max-width: 42ch;
+}
+
 .content_container {
     margin: 0 auto var(--pad-2);
     width: 100%;
@@ -327,7 +332,9 @@ video {
 }
 
 /* input */
-input {
+input,
+textarea,
+select {
     --h: 36px;
     padding: var(--pad-2) calc(var(--pad-3) * 1.5);
     background: var(--color-raised);
@@ -341,6 +348,7 @@ input {
     height: var(--h);
     line-height: var(--h);
     border-left: solid 0px transparent;
+    width: 100%;
 }
 
 input:not([type="checkbox"]):focus {
@@ -354,7 +362,9 @@ input[data-invalid] {
     border-left: inset 5px var(--color-red);
 }
 
-input.surface {
+input.surface,
+textarea.surface,
+select.surface {
     background: var(--color-surface);
 }
 
@@ -563,6 +573,7 @@ img {
     --size: 18px;
     width: var(--size);
     height: var(--size);
+    border-radius: var(--radius);
     aspect-ratio: 1 / 1;
 }