Fix dropdown menu hover gap with invisible bridge element

The 8px gap between the trigger and the dropdown caused the mouse to
lose :hover when crossing it. Replace the gap with an invisible
::before pseudo-element that bridges the space, keeping the dropdown
open while the cursor moves to it.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: congwang-mk

_layouts/default.html

@@ -141,16 +141,25 @@
     .site-nav-dropdown-menu {
         display: none;
         position: absolute;
-        top: calc(100% + 8px);
+        top: 100%;
         left: 0;
         min-width: 260px;
         background: #1e293b;
         border: 1px solid rgba(255,255,255,0.08);
         border-radius: 6px;
         box-shadow: 0 16px 48px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3);
         padding: 4px;
+        padding-top: 12px;
         z-index: 1000;
     }
+    .site-nav-dropdown-menu::before {
+        content: '';
+        position: absolute;
+        top: -8px;
+        left: 0;
+        right: 0;
+        height: 8px;
+    }
     .site-nav-dropdown:hover .site-nav-dropdown-menu {
         display: block;
     }