diff --git a/docs/src/_includes/partials/kitchen-sink/dropdown-menu.njk b/docs/src/_includes/partials/kitchen-sink/dropdown-menu.njk
index 40dcda9..4d38a6a 100644
--- a/docs/src/_includes/partials/kitchen-sink/dropdown-menu.njk
+++ b/docs/src/_includes/partials/kitchen-sink/dropdown-menu.njk
@@ -258,7 +258,8 @@
       {% call dropdown_menu(
         id="dropdown-checkboxes",
         trigger=trigger,
-        trigger_attrs={"class": "btn-icon-ghost rounded-full size-8"}
+        trigger_attrs={"class": "btn-icon-ghost rounded-full size-8"},
+        content_attrs={"data-align": "end"}
       ) %}
         {{ profile_menu | safe }}
       {% endcall %}
diff --git a/docs/src/_includes/partials/kitchen-sink/skeleton.njk b/docs/src/_includes/partials/kitchen-sink/skeleton.njk
index c356627..9066885 100644
--- a/docs/src/_includes/partials/kitchen-sink/skeleton.njk
+++ b/docs/src/_includes/partials/kitchen-sink/skeleton.njk
@@ -15,7 +15,7 @@
         </div>
       </div>
       
-      <div class="flex gap-4 w-full">
+      <div class="flex max-sm:flex-col gap-4 w-full">
         <div class="card w-full @md:w-auto @md:min-w-sm">
           <header>
             <div class="bg-accent animate-pulse rounded-md h-4 w-2/3"></div>
diff --git a/docs/src/assets/styles.css b/docs/src/assets/styles.css
index a4be3d1..47f948b 100644
--- a/docs/src/assets/styles.css
+++ b/docs/src/assets/styles.css
@@ -1218,6 +1218,16 @@
       background-color: var(--color-green-50);
     }
   }
+  .max-sm\:flex-col {
+    @media (width < 40rem) {
+      flex-direction: column;
+    }
+  }
+  .sm\:flex {
+    @media (width >= 40rem) {
+      display: flex;
+    }
+  }
   .sm\:max-w-\[425px\] {
     @media (width >= 40rem) {
       max-width: 425px;
@@ -1654,6 +1664,7 @@
   --chevron-down-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="oklch(0.556 0 0)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down-icon lucide-chevron-down"><path d="m6 9 6 6 6-6"/></svg>');
   --chevron-down-icon-50: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="oklch(0.556 0 0 / 0.5)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down-icon lucide-chevron-down"><path d="m6 9 6 6 6-6"/></svg>');
   --check-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="oklch(0.556 0 0)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check-icon lucide-check"><path d="M20 6 9 17l-5-5"/></svg>');
+  color-scheme: light dark;
 }
 .dark {
   --background: oklch(0.145 0 0);
diff --git a/src/css/basecoat.css b/src/css/basecoat.css
index f9f6099..d2a1cc5 100644
--- a/src/css/basecoat.css
+++ b/src/css/basecoat.css
@@ -42,6 +42,7 @@
   --chevron-down-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="oklch(0.556 0 0)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down-icon lucide-chevron-down"><path d="m6 9 6 6 6-6"/></svg>'); /* --muted-foreground */
   --chevron-down-icon-50: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="oklch(0.556 0 0 / 0.5)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down-icon lucide-chevron-down"><path d="m6 9 6 6 6-6"/></svg>'); /* --muted-foreground + 50% opacity */
   --check-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="oklch(0.556 0 0)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check-icon lucide-check"><path d="M20 6 9 17l-5-5"/></svg>'); /* --muted-foreground */
+  color-scheme: light dark;
 }
 
 .dark {