fix(css): resolve mobile navbar jumping from specificity and transition conflicts

- Replace transition: all with explicit transform, opacity, visibility to avoid layout jitter
- Hide hover-bridge pseudo-element on mobile where position: static makes it unnecessary
- Raise aria-expanded selector specificity to always win over hover-disable rule on mobile

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

Author: appleboy

internal/templates/static/css/components/navbar.css

@@ -206,7 +206,9 @@
     transform: translateY(-100%);
     opacity: 0;
     visibility: hidden;
-    transition: all var(--transition-base);
+    transition: transform var(--transition-base),
+               opacity var(--transition-base),
+               visibility var(--transition-base);
   }
 
   .navbar-menu.active {
@@ -461,6 +463,11 @@
     width: 100%;
   }
 
+  /* Hide the hover-bridge pseudo-element on mobile (no function when position: static) */
+  .navbar-dropdown-menu::before {
+    display: none;
+  }
+
   .navbar-dropdown-menu {
     position: static;
     box-shadow: none;
@@ -482,13 +489,6 @@
       max-height var(--transition-base);
   }
 
-  .navbar-dropdown-trigger[aria-expanded="true"] + .navbar-dropdown-menu {
-    opacity: 1;
-    visibility: visible;
-    max-height: 300px;
-    pointer-events: auto;
-  }
-
   /* Disable hover-open on mobile */
   .navbar-dropdown:hover .navbar-dropdown-menu {
     opacity: 0;
@@ -498,6 +498,14 @@
     pointer-events: none;
   }
 
+  /* JS-driven open state must always win on mobile (specificity 0-4-0 beats hover's 0-3-0) */
+  .navbar-dropdown .navbar-dropdown-trigger[aria-expanded="true"] + .navbar-dropdown-menu {
+    opacity: 1;
+    visibility: visible;
+    max-height: 300px;
+    pointer-events: auto;
+  }
+
   .navbar-dropdown-item {
     padding: var(--space-2) var(--space-4);
     border-radius: 0;