diff --git a/src/lib/settings/categories/AppearanceSettings.svelte b/src/lib/settings/categories/AppearanceSettings.svelte
index a06ba5e..68acfac 100644
--- a/src/lib/settings/categories/AppearanceSettings.svelte
+++ b/src/lib/settings/categories/AppearanceSettings.svelte
@@ -102,12 +102,11 @@
   function closeDropdowns() { themeOpen = false; uiFontOpen = false; termFontOpen = false; }
 </script>
 
+<svelte:document onpointerdown={(e) => {
+    if (!(e.target as HTMLElement)?.closest('.dropdown')) closeDropdowns();
+  }} />
 <svelte:window onkeydown={(e) => { if (e.key === 'Escape') closeDropdowns(); }} />
 
-{#if themeOpen || uiFontOpen || termFontOpen}
-  <div class="backdrop" onclick={closeDropdowns}></div>
-{/if}
-
 <div class="appearance">
   <h3>Theme</h3>
   <div class="field" id="setting-theme">
@@ -192,7 +191,6 @@
 </div>
 
 <style>
-  .backdrop { position: fixed; inset: 0; z-index: 40; }
   .appearance { display: flex; flex-direction: column; gap: 0.75rem; }
   h3 { font-size: 0.75rem; font-weight: 600; color: var(--ctp-subtext0); text-transform: uppercase; letter-spacing: 0.05em; margin: 0.5rem 0 0.125rem; }
   .field { position: relative; }