diff --git a/dev/hiccup/src/dev/hiccup.clj b/dev/hiccup/src/dev/hiccup.clj
index dc91409..37914f0 100644
--- a/dev/hiccup/src/dev/hiccup.clj
+++ b/dev/hiccup/src/dev/hiccup.clj
@@ -76,9 +76,10 @@
 ;; ── Accordion ───────────────────────────────────────────────────────
 (defn accordion-demo []
   (section "Accordion"
-    (accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
-    (accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
-    (accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")))
+    [:div {:class "accordion-group"}
+     (accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
+     (accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
+     (accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")]))
 
 ;; ── Table ───────────────────────────────────────────────────────────
 (defn table-demo []
diff --git a/dev/replicant/src/dev/replicant.cljs b/dev/replicant/src/dev/replicant.cljs
index 20d11f9..394017a 100644
--- a/dev/replicant/src/dev/replicant.cljs
+++ b/dev/replicant/src/dev/replicant.cljs
@@ -77,9 +77,10 @@
 ;; ── Accordion ───────────────────────────────────────────────────────
 (defn accordion-demo []
   (section "Accordion"
-    (accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
-    (accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
-    (accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")))
+    [:div {:class ["accordion-group"]}
+     (accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
+     (accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
+     (accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")]))
 
 ;; ── Table ───────────────────────────────────────────────────────────
 (defn table-demo []
diff --git a/dev/squint/src/dev/squint.cljs b/dev/squint/src/dev/squint.cljs
index 4c4868f..0593bd5 100644
--- a/dev/squint/src/dev/squint.cljs
+++ b/dev/squint/src/dev/squint.cljs
@@ -85,9 +85,10 @@
 ;; ── Accordion ───────────────────────────────────────────────────────
 (defn accordion-demo []
   (section "Accordion"
-    (accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
-    (accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
-    (accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")))
+    [:div {:class "accordion-group"}
+     (accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
+     (accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
+     (accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")]))
 
 ;; ── Table ───────────────────────────────────────────────────────────
 (defn table-demo []
diff --git a/src/ui/accordion.cljc b/src/ui/accordion.cljc
index 3d615b4..0987d97 100644
--- a/src/ui/accordion.cljc
+++ b/src/ui/accordion.cljc
@@ -25,27 +25,24 @@
                      class (str " " class))
            base-attrs (cond-> (merge {:class classes} attrs)
                         open (assoc :open true))]
-       (into [:details base-attrs
-              [:summary {:class "accordion-trigger"} title]
-              [:div {:class "accordion-content"}]]
-             children))
+       [:details base-attrs
+        [:summary {:class "accordion-trigger"} title]
+        (into [:div {:class "accordion-content"}] children)])
 
      :cljs
      (let [cls (accordion-class-list {})
            classes (cond-> cls class (conj class))
            base-attrs (cond-> (merge {:class classes} attrs)
                         open (assoc :open true))]
-       (into [:details base-attrs
-              [:summary {:class ["accordion-trigger"]} title]
-              [:div {:class ["accordion-content"]}]]
-             children))
+       [:details base-attrs
+        [:summary {:class ["accordion-trigger"]} title]
+        (into [:div {:class ["accordion-content"]}] children)])
 
      :clj
      (let [classes (cond-> (accordion-classes {})
                      class (str " " class))
            base-attrs (cond-> (merge {:class classes} attrs)
                         open (assoc :open true))]
-       (into [:details base-attrs
-              [:summary {:class "accordion-trigger"} title]
-              [:div {:class "accordion-content"}]]
-             children))))
+       [:details base-attrs
+        [:summary {:class "accordion-trigger"} title]
+        (into [:div {:class "accordion-content"}] children)])))
diff --git a/src/ui/accordion.css b/src/ui/accordion.css
index 46daf0a..269a2d9 100644
--- a/src/ui/accordion.css
+++ b/src/ui/accordion.css
@@ -1,3 +1,8 @@
+.accordion-group {
+  display: flex;
+  flex-direction: column;
+}
+
 .accordion {
   border: var(--border-0);
   border-radius: var(--radius-md);
@@ -67,4 +72,6 @@
 
 .accordion-content {
   padding: var(--size-4);
+  font-size: var(--font-sm);
+  color: var(--fg-1);
 }
diff --git a/src/ui/card.css b/src/ui/card.css
index dc30409..3bafeb0 100644
--- a/src/ui/card.css
+++ b/src/ui/card.css
@@ -35,13 +35,17 @@
 .card-body {
 }
 
+.card-body > *:first-child { margin-top: 0; }
+.card-body > *:last-child { margin-bottom: 0; }
+
 .card-footer {
   display: flex;
   justify-content: flex-end;
   gap: var(--size-2);
 }
 
-.card-footer .btn {
+.card-footer .btn,
+.dialog-footer .btn {
   padding: var(--size-2) var(--size-4);
   font-size: var(--font-base);
   line-height: var(--size-5);
diff --git a/src/ui/dialog.css b/src/ui/dialog.css
index 451264f..7106a96 100644
--- a/src/ui/dialog.css
+++ b/src/ui/dialog.css
@@ -17,6 +17,8 @@
 .dialog[open] {
   display: flex;
   flex-direction: column;
+  gap: var(--size-3);
+  padding: var(--size-6);
 }
 
 .dialog::backdrop {
@@ -28,8 +30,6 @@
   display: flex;
   flex-direction: column;
   gap: var(--size-1);
-  padding: var(--size-6);
-  padding-bottom: 0;
 }
 
 .dialog-header h1,
@@ -48,14 +48,14 @@
 }
 
 .dialog-body {
-  padding: var(--size-6);
   overflow-y: auto;
 }
 
+.dialog-body > *:first-child { margin-top: 0; }
+.dialog-body > *:last-child { margin-bottom: 0; }
+
 .dialog-footer {
   display: flex;
   justify-content: flex-end;
   gap: var(--size-2);
-  padding: var(--size-6);
-  padding-top: 0;
 }