fix(nav): pin publish toggle width on open

Use inline-block wrapper + fit-content so absolute dropdown cannot
inflate 发布 chip width on click/focus-within.

assets/css/frontend/nav/header-menu-buttons.css

@@ -85,8 +85,17 @@
 .navbar-but-cluster a.newadd-btns__toggle {
   flex: 0 0 auto !important;
   width: auto !important;
-  min-width: 0;
-  max-width: none;
+  min-width: 0 !important;
+  max-width: none !important;
+}
+
+/* Parent shell must not expand with absolute dropdown */
+.navbar-but-cluster .navbar-but {
+  position: relative;
+  overflow: visible;
+  width: auto !important;
+  max-width: fit-content;
+  flex: 0 0 auto !important;
 }
 
 .navbar-but-cluster .payvip-icon.but,
@@ -105,70 +114,94 @@
 
 /* Publish multi-type dropdown
  *
- * Hover bridge strategy (zibll parity):
- * - panel sits at top:100% (NO gap) so the mouse never leaves .hover-show
- * - transparent padding-top is the bridge into the menu
- * - solid white plate is painted by ::before below the bridge
- * - do NOT put solid background on the whole panel (that would fill the bridge)
+ * Wrapper MUST be inline-block (not flex): an absolute dropdown as a flex
+ * child can still inflate the parent's used width on open/focus-within.
+ * Size the wrapper strictly to the toggle chip; menu never contributes.
+ *
+ * Hover bridge (zibll parity):
+ * - panel at top:100% (no gap)
+ * - transparent padding-top = bridge
+ * - solid plate via ::before under the bridge
  */
+.navbar-but-cluster .navbar-but .newadd-btns.hover-show,
 .navbar-but-cluster .newadd-btns.hover-show,
 .newadd-btns.hover-show {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  align-self: center;
+  position: relative !important;
+  display: inline-block !important; /* not flex — isolates absolute menu width */
+  vertical-align: middle;
   z-index: 40;
   background: transparent !important;
   color: inherit !important;
   padding: 0 !important;
-  margin: 0;
+  margin: 0 !important;
   border: 0 !important;
   box-shadow: none !important;
-  width: auto !important;
-  min-width: 0;
-  max-width: none;
-  height: auto !important;
-  flex: 0 0 auto;
+  /* Shrink-wrap to toggle only; never grow with open menu */
+  width: fit-content !important;
+  max-width: fit-content !important;
+  min-width: 0 !important;
+  height: 34px !important;
+  max-height: 34px !important;
+  line-height: 0;
+  overflow: visible !important;
+  flex: 0 0 auto !important;
+  align-self: center;
   white-space: nowrap;
-  vertical-align: middle;
 }
 
-/* Toggle: fixed chip size — never stretch when menu opens */
+/* Toggle: fixed chip — click/focus must not change size */
+.navbar-but-cluster .newadd-btns > a.newadd-btns__toggle,
 .navbar-but-cluster a.newadd-btns__toggle,
 .navbar-but-cluster .newadd-btns__toggle.navbar-cta,
 a.newadd-btns__toggle.navbar-cta {
   display: inline-flex !important;
-  align-items: center;
-  justify-content: center;
-  gap: 6px;
+  align-items: center !important;
+  justify-content: center !important;
+  gap: 6px !important;
   height: 34px !important;
   min-height: 34px !important;
-  max-height: 34px;
+  max-height: 34px !important;
   padding: 0 14px !important;
+  margin: 0 !important;
   width: auto !important;
-  min-width: 0;
-  max-width: none;
+  min-width: 0 !important;
+  max-width: none !important;
   flex: 0 0 auto !important;
-  box-sizing: border-box;
-  white-space: nowrap;
+  box-sizing: border-box !important;
+  white-space: nowrap !important;
+  vertical-align: middle;
+  /* Prevent focus outline from looking like width growth */
+  outline-offset: 2px;
 }
 
+.navbar-but-cluster .newadd-btns > a.newadd-btns__toggle:focus,
+.navbar-but-cluster .newadd-btns > a.newadd-btns__toggle:focus-visible,
+.navbar-but-cluster .newadd-btns > a.newadd-btns__toggle:active,
+.navbar-but-cluster .newadd-btns.hover-show:focus-within > a.newadd-btns__toggle {
+  width: auto !important;
+  max-width: none !important;
+  padding: 0 14px !important;
+  height: 34px !important;
+}
+
+/* Menu is purely out-of-flow; fixed min width independent of toggle */
 .navbar-but-cluster .newadd-btns .drop-newadd,
 .navbar-but-cluster .newadd-btns .hover-show-con.drop-newadd,
 .newadd-btns .drop-newadd,
 .newadd-btns .hover-show-con.drop-newadd {
-  display: block;
-  position: absolute;
-  top: 100%;
-  right: 0;
-  left: auto;
-  float: none;
-  width: max-content;
-  min-width: 160px;
-  max-width: min(240px, 80vw);
-  margin: 0;
-  /* Transparent hover bridge — must stay part of the panel hit area */
-  padding: 10px 0 6px;
+  display: block !important;
+  position: absolute !important;
+  top: 100% !important;
+  right: 0 !important;
+  left: auto !important;
+  float: none !important;
+  /* Fixed width so open state never reads as "button got longer" */
+  width: 168px !important;
+  min-width: 168px !important;
+  max-width: min(168px, 80vw) !important;
+  margin: 0 !important;
+  /* Transparent hover bridge — part of the panel hit area */
+  padding: 10px 0 6px !important;
   background: transparent !important;
   border: 0 !important;
   box-shadow: none !important;
@@ -179,7 +212,9 @@ a.newadd-btns__toggle.navbar-cta {
   transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
   z-index: 1200;
   pointer-events: none;
-  box-sizing: border-box;
+  box-sizing: border-box !important;
+  /* Absolute: never affect parent inline-size */
+  inset-inline-end: 0;
 }
 
 /* Solid readable plate under the bridge */