Change card CSS for readability

src/Card.svelte

@@ -28,6 +28,7 @@
     display: flex;
     justify-content: space-between;
     border-bottom: 2px solid black;
+    padding: 0 4pt;
   }
   .name, .type {
     font-family: serif;
@@ -35,8 +36,7 @@
     font-weight: bold;
   }
   .tags {
-    margin: 1pt 1pt 0pt 1pt;
-    padding: 0;
+    padding: 1pt 4pt;
     display: flex;
     flex-wrap: wrap;
   }
@@ -59,7 +59,10 @@
     background-color: #54166e;
   }
   .content {
-    margin: 1pt;
+    margin-top: 1pt;
+  }
+  .content div {
+    padding: 0 4pt;
   }
   :global(section.content p) {
     padding-bottom: 2pt;
@@ -94,12 +97,12 @@
     {/each}
   </section>
   <section class="content">
-    <p class="attributes">
+    <div class="attributes">
       {@html pf_filter(DOMPurify.sanitize(attributes))}
-    </p>
-    <p class="description">
+    </div>
+    <div class="description">
       {@html pf_filter(DOMPurify.sanitize(description))}
-    </p>
+    </div>
   </section>
 </div>