diff --git a/src/app/components/SearchOverlay.tsx b/src/app/components/SearchOverlay.tsx
index 83d59ea..b8172a7 100644
--- a/src/app/components/SearchOverlay.tsx
+++ b/src/app/components/SearchOverlay.tsx
@@ -87,7 +87,7 @@ export default function SearchOverlay({ config, setConfig, onClose }: SearchOver
         initial={{ opacity: 0 }}
         animate={{ opacity: 1 }}
         exit={{ opacity: 0 }}
-        className="fixed inset-0 z-50 backdrop-blur-md bg-black/30 flex items-center justify-center"
+        className="fixed inset-0 z-50 backdrop-blur-md bg-black/40 flex items-center justify-center"
         onClick={onClose}
       >
         <motion.div
@@ -95,7 +95,7 @@ export default function SearchOverlay({ config, setConfig, onClose }: SearchOver
           animate={{ y: 0, opacity: 1 }}
           exit={{ y: -50, opacity: 0 }}
           transition={{ type: 'spring', damping: 25, stiffness: 300 }}
-          className="w-full h-full max-w-2xl sm:rounded-xl bg-white shadow-2xl overflow-auto flex flex-col justify-center mx-0 sm:mx-auto my-0 sm:my-20 p-0 sm:p-0"
+          className="w-full h-full max-w-2xl sm:rounded-xl bg-white/50 shadow-2xl overflow-auto flex flex-col justify-center mx-0 sm:mx-auto my-0 sm:my-20 p-0 sm:p-0"
           style={{ maxHeight: '100dvh' }}
           onClick={(e) => e.stopPropagation()}
         >
@@ -121,10 +121,10 @@ export default function SearchOverlay({ config, setConfig, onClose }: SearchOver
                 <button
                   onClick={handleSearch}
                   disabled={isSearching}
-                  className="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 flex items-center gap-2"
+                  className="p-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 flex items-center justify-center"
+                  aria-label="Search"
                 >
                   <Search className="w-5 h-5" />
-                  Search
                 </button>
               </div>
             </div>