diff --git a/src/routes/map/[slug]/+page.svelte b/src/routes/map/[slug]/+page.svelte
index bc52529..ba77bd6 100644
--- a/src/routes/map/[slug]/+page.svelte
+++ b/src/routes/map/[slug]/+page.svelte
@@ -80,20 +80,26 @@
 		</div>
 
 		<div class="quick-actions">
-			<button class="icon-btn" on:click={() => (reversed = !reversed)}>
+			<button class="icon-btn" onclick={() => (reversed = !reversed)}>
 				⇄ {reversed ? 'UP' : 'DN'}
 			</button>
-			<button class="icon-btn" on:click={() => (showFilters = !showFilters)}> Settings </button>
+			<button class="icon-btn" onclick={() => (showFilters = !showFilters)}> Settings </button>
 		</div>
 	</header>
 
 	{#if showFilters}
-		<div class="backdrop" on:click={() => (showFilters = false)}></div>
+		<div 
+    class="backdrop" 
+    role="button"
+    tabindex="0"
+    onclick={() => (showFilters = false)}
+    onkeydown={(e) => (e.key === 'Enter' || e.key === ' ') && (showFilters = false)}
+></div>
 
 		<div class="filter-drawer" transition:slide>
 			<div class="drawer-header">
 				<h3>Visibility Filters</h3>
-				<button class="close-icon" on:click={() => (showFilters = false)} aria-label="Close">
+				<button class="close-icon" onclick={() => (showFilters = false)} aria-label="Close">
 					<svg
 						viewBox="0 0 24 24"
 						width="20"
@@ -113,7 +119,7 @@
 						<button
 							class="filter-chip"
 							class:active={visibleTypes[type]}
-							on:click={() => toggleFilter(type)}
+							onclick={() => toggleFilter(type)}
 						>
 							{formatLabel(type)}
 						</button>