Revert "Replace House with Lexical"

app/assets/stylesheets/comments.css

@@ -1,7 +1,7 @@
 @layer components {
   .comments {
     --avatar-size: 2.33em;
-    --comment-padding-block: var(--block-space-half);
+    --comment-padding-block: var(--block-space);
     --comment-padding-inline: var(--inline-space-double);
     --comment-max: 70ch;
     --reaction-size: 2rem;
@@ -47,7 +47,7 @@
   }
 
   .comment__avatar {
-    margin: calc(var(--comment-padding-block) * 0.75) calc(var(--comment-padding-inline) * -0.75);
+    margin: calc(var(--comment-padding-block) * 0.5) calc(var(--comment-padding-inline) * -0.75);
     z-index: 0;
 
     .comment--mine_ & {
@@ -64,7 +64,7 @@
       text-align: center;
     }
 
-    * {
+    p {
       &:first-child {
         margin-block-start: 0;
       }
@@ -83,8 +83,6 @@
     border-radius: 0.2em;
     padding:
       var(--comment-padding-block)
-      var(--comment-padding-inline)
-      calc(var(--comment-padding-block) * 1.5)
       var(--comment-padding-inline);
     word-wrap: break-word;
   }
@@ -115,7 +113,7 @@
     line-height: 1.2;
     max-inline-size: var(--comment-max);
     text-align: center;
-
+    
 
     &::before {
       /* Make up space for lack of avatar */
@@ -135,4 +133,17 @@
       text-align: center !important;
     }
   }
+
+  .comment__input {
+    --input-border-size: 0;
+    --input-padding: 0;
+
+    min-block-size: calc(9lh + (2 * var(--comment-padding-block)));
+    min-inline-size: 100%;
+
+    @supports (field-sizing: content) {
+      field-sizing: content;
+      min-block-size: calc(9lh + (2 * var(--comment-padding-block)));
+    }
+  }
 }