@xihan-ui/styles 1.0.0-alpha.3 → 1.1.0

package/css/layout.css

@@ -40,9 +40,9 @@
     display: flex;
     grid-area: header;
     align-items: center;
-    gap: var(--xh-space-3);
+    gap: var(--xh-layout-header-gap, var(--xh-space-3));
     block-size: var(--xh-_layout-header-h);
-    padding-inline: var(--xh-space-4);
+    padding-inline: var(--xh-layout-header-px, var(--xh-space-4));
     background: var(--xh-layout-header-bg, var(--xh-bg-surface));
   }
 
@@ -51,7 +51,7 @@
     grid-area: sider;
     inline-size: var(--xh-_layout-sider-w);
     overflow: hidden;
-    padding: var(--xh-space-3);
+    padding: var(--xh-layout-sider-padding, var(--xh-space-3));
     background: var(--xh-layout-sider-bg, var(--xh-bg-subtle));
     transition: inline-size var(--xh-motion-duration-enter) var(--xh-motion-ease-enter);
   }
@@ -66,12 +66,12 @@
     grid-area: content;
     /* 内容列已是 minmax(0, 1fr)，这里再声明一次，宽表格与长串文本才撑不破列 */
     min-inline-size: 0;
-    padding: var(--xh-space-4);
+    padding: var(--xh-layout-content-padding, var(--xh-space-4));
   }
 
   [data-scope='layout'][data-part='footer'] {
     grid-area: footer;
-    padding: var(--xh-space-3) var(--xh-space-4);
+    padding: var(--xh-layout-footer-padding, var(--xh-space-3) var(--xh-space-4));
     background: var(--xh-layout-footer-bg, var(--xh-bg-surface));
     color: var(--xh-fg-muted);
     font-size: var(--xh-text-secondary-size);
@@ -82,9 +82,9 @@
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    gap: var(--xh-control-gap-sm);
+    gap: var(--xh-layout-sider-trigger-gap, var(--xh-control-gap-sm));
     block-size: var(--xh-control-h-sm);
-    padding-inline: var(--xh-control-px-sm);
+    padding-inline: var(--xh-layout-sider-trigger-px, var(--xh-control-px-sm));
     border: 0;
     border-radius: var(--xh-layout-sider-trigger-radius, var(--xh-shape-control));
     background: var(--xh-layout-sider-trigger-bg, transparent);
@@ -167,4 +167,12 @@
     max-block-size: calc(var(--xh-layout-scrollport-h, 100dvh) - var(--xh-_layout-sider-offset));
     overflow-y: auto;
   }
+
+  /* 声明过任何 display 就盖掉了 UA 的 [hidden]{display:none}，收起态得自己还回去。
+     写在文件末尾：兜底必须排在该部件所有 display 声明之后 */
+  [data-scope='layout'][data-part='root'][hidden],
+  [data-scope='layout'][data-part='header'][hidden],
+  [data-scope='layout'][data-part='sider-trigger'][hidden] {
+    display: none;
+  }
 }

package/css/list.css

@@ -8,7 +8,7 @@
     /* 一个尺寸档只换这几个私有槽，条目与两行文字都从根上继承它们，
        换档不必给每个部件各写一条选择器 */
     --xh-_list-item-py: var(--xh-list-item-py-md);
-    --xh-_list-item-px: var(--xh-space-4);
+    --xh-_list-item-px: var(--xh-list-item-px-md);
     --xh-_list-item-gap: var(--xh-space-3);
     --xh-_list-title-size: var(--xh-control-font-md);
     --xh-_list-description-size: var(--xh-control-caption-md);
@@ -30,7 +30,7 @@
   /* —— 尺寸 —— */
   [data-scope='list'][data-part='root'][data-size='sm'] {
     --xh-_list-item-py: var(--xh-list-item-py-sm);
-    --xh-_list-item-px: var(--xh-space-3);
+    --xh-_list-item-px: var(--xh-list-item-px-sm);
     --xh-_list-item-gap: var(--xh-space-2);
     --xh-_list-title-size: var(--xh-control-font-sm);
     --xh-_list-description-size: var(--xh-control-caption-sm);
@@ -38,7 +38,7 @@
 
   [data-scope='list'][data-part='root'][data-size='lg'] {
     --xh-_list-item-py: var(--xh-list-item-py-lg);
-    --xh-_list-item-px: var(--xh-space-5);
+    --xh-_list-item-px: var(--xh-list-item-px-lg);
     --xh-_list-item-gap: var(--xh-space-4);
     --xh-_list-title-size: var(--xh-control-font-lg);
   }
@@ -66,11 +66,11 @@
   [data-scope='list'][data-part='root'][data-split]
     > [data-scope='list'][data-part='item']
     + [data-scope='list'][data-part='item'] {
-    border-block-start: var(--xh-stroke-thin) solid var(--xh-list-border, var(--xh-border-subtle));
+    border-block-start: var(--xh-stroke-thin) solid var(--xh-list-divider, var(--xh-border-subtle));
   }
 
   [data-scope='list'][data-part='root'][data-hoverable] > [data-scope='list'][data-part='item'] {
-    transition: background-color var(--xh-motion-duration-micro) var(--xh-motion-ease-enter);
+    transition: background var(--xh-motion-duration-micro) var(--xh-motion-ease-enter);
   }
 
   /* 悬停换底色：只在能用指针的设备上生效，触摸端不留一个按不掉的悬停态 */
@@ -119,4 +119,13 @@
     gap: var(--xh-list-action-gap, var(--xh-space-2));
     margin-inline-start: auto;
   }
+
+  /* 声明过任何 display 就盖掉了 UA 的 [hidden]{display:none}，收起态得自己还回去。
+     写在文件末尾：兜底必须排在该部件所有 display 声明之后 */
+  [data-scope='list'][data-part='item'][hidden],
+  [data-scope='list'][data-part='item-media'][hidden],
+  [data-scope='list'][data-part='item-content'][hidden],
+  [data-scope='list'][data-part='item-action'][hidden] {
+    display: none;
+  }
 }

package/css/listbox.css

@@ -34,6 +34,7 @@
   [data-scope='listbox'][data-part='content'] {
     display: flex;
     flex-direction: column;
+    gap: var(--xh-listbox-content-gap, var(--xh-list-option-gap));
     max-block-size: var(--xh-listbox-content-max-h, var(--xh-viewport-h-md));
     padding-block: var(--xh-listbox-content-py, var(--xh-space-1));
     padding-inline: var(--xh-listbox-content-px, var(--xh-space-1));
@@ -66,6 +67,7 @@
   [data-scope='listbox'][data-part='item-group'] {
     display: flex;
     flex-direction: column;
+    gap: var(--xh-listbox-item-group-gap, var(--xh-list-option-gap));
   }
 
   [data-scope='listbox'][data-part='item-group'][hidden] {
@@ -74,7 +76,7 @@
 
   /* 组间留白只加在后继分组上：首组顶上已经有 content 的内边距，再加一层会显得头重 */
   [data-scope='listbox'][data-part='item-group'] + [data-scope='listbox'][data-part='item-group'] {
-    margin-block-start: var(--xh-listbox-group-gap, var(--xh-space-2));
+    margin-block-start: var(--xh-listbox-group-gap, var(--xh-space-1_5));
   }
 
   /* 分组标题不是选项、进不了导航，画成小号次要文字，
@@ -168,7 +170,7 @@
     align-items: center;
     justify-content: center;
     inline-size: var(--xh-listbox-item-indicator-size, var(--xh-control-indicator-size));
-    color: var(--xh-listbox-item-indicator-fg, var(--xh-bg-brand));
+    color: var(--xh-listbox-item-indicator-fg, var(--xh-fg-brand));
     visibility: hidden;
   }
 

package/css/loading-bar.css

@@ -31,8 +31,9 @@
     display: none;
   }
 
-  /* 冲到 100 之后进入淡出：机器会在淡出窗口走完之前一直停在 finishing，
-     这段过渡才有时间跑完；窗口与时长两处默认值都是 200ms，改一处记得对齐另一处 */
+  /* 冲到 100 之后进入淡出：机器会在淡出窗口走完之前一直停在 finishing，这段过渡才有时间跑完。
+     窗口（machine 的 LOADING_BAR_FADE_DURATION，200ms）比过渡本身（motion-duration-exit，120ms）
+     宽出一截是有意的余量；两者不是同一个数，改窗口时只要保证它仍不短于过渡 */
   [data-scope='loading-bar'][data-part='root'][data-state='finishing'] {
     opacity: 0;
   }
@@ -50,8 +51,8 @@
    * 进度段。宽度那条轴（inline-size）由连接层写进内联样式，这里绝不重复写。
    * 背景色同理：给了 color 就走内联，盖过下面这条。
    *
-   * 语气取柔和档 --xh-_tone-soft（500）而不是 --xh-_tone（600）：600 是给实心底与
-   * 文字用的强调档，压在这么一条细带上偏重。槽位由 root 上的 data-tone 声明，继承下来。
+   * 语气取装饰档 --xh-_tone-soft：那一档压在画布上够 3:1，细带才看得出来。
+   * 槽位由 root 上的 data-tone 声明，继承下来。
    * 没写 data-tone 时该槽没被声明，退回原来的品牌色。
    */
   [data-scope='loading-bar'][data-part='range'] {

package/css/log.css

@@ -28,14 +28,18 @@
      flex-basis 取 auto，连接层写的按行数高度才算数，同时外层给了高度时还能撑满；
      min-block-size: 0 让它在弹性父级里能被压缩从而真的溢出；
      两个轴都 auto：长行不折，横向也要能滚；
-     overscroll-behavior: contain 阻止滚动量传给页面；
-     scrollbar-gutter: stable 避免滚动条出现与消失时推动文字。 */
+     overscroll-behavior: contain 阻止滚动量传给页面。 */
   [data-scope='log'][data-part='viewport'] {
     flex: 1 1 auto;
     min-block-size: 0;
     block-size: calc(var(--xh-_log-line-h) * var(--xh-log-rows, 16));
     overflow: auto;
     overscroll-behavior: contain;
+  }
+
+  /* 还在用原生滚动条的视口留一条空道，滚动条出现与消失时不推动文字。
+     带 data-xh-scrollbar 的容器已经把原生条藏成零宽，这条空道对它没有布局作用，排除掉 */
+  [data-scope='log'][data-part='viewport']:not([data-xh-scrollbar]) {
     scrollbar-gutter: stable;
   }
 

package/css/masonry.css

@@ -42,22 +42,22 @@
   /* —— 间距档位 —— */
   /* 每一档指向一个间距令牌，列之间与列内项之间吃同一份间距 */
   [data-scope='masonry'][data-part='root'][data-gap='xs'] {
-    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-space-1));
+    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-layout-gap-xs));
   }
 
   [data-scope='masonry'][data-part='root'][data-gap='sm'] {
-    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-space-2));
+    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-layout-gap-sm));
   }
 
   [data-scope='masonry'][data-part='root'][data-gap='md'] {
-    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-space-3));
+    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-layout-gap-md));
   }
 
   [data-scope='masonry'][data-part='root'][data-gap='lg'] {
-    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-space-4));
+    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-layout-gap-lg));
   }
 
   [data-scope='masonry'][data-part='root'][data-gap='xl'] {
-    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-space-6));
+    --xh-_masonry-gap: var(--xh-masonry-gap, var(--xh-layout-gap-xl));
   }
 }

package/css/mention.css

@@ -37,6 +37,9 @@
        引擎没算（尚未落位 / 无引擎）时不额外限高 */
     --xh-_mention-available-h: 100vh;
 
+    /* 候选列表的自绘条浮在内容之上：轨道不上底色，实色轨道会在列表右缘糊一条竖灰带 */
+    --xh-scrollbar-track-bg: transparent;
+
     position: fixed;
     z-index: var(--xh-mention-layer, var(--xh-layer-popover));
     /* 空壳不吃指针，交互只发生在 content 上 */
@@ -53,9 +56,11 @@
     /* 尺寸档只换这五个私有槽，输入框与候选都从这两处继承它们，换档不必给每个部件各写一条选择器 */
     --xh-_mention-h: var(--xh-control-h-md);
     --xh-_mention-px: var(--xh-control-px-md);
+    --xh-_mention-item-py: var(--xh-list-option-py-md);
+    --xh-_mention-item-px: var(--xh-control-px-md);
     --xh-_mention-py: var(--xh-field-py);
     --xh-_mention-gap: var(--xh-control-gap-md);
-    --xh-_mention-font-size: var(--xh-text-body-size);
+    --xh-_mention-font-size: var(--xh-control-font-md);
 
     /* 形态档只换这三个槽：缺省即 outline（描边 + 画布底） */
     --xh-_mention-input-bg: var(--xh-bg-canvas);
@@ -80,6 +85,8 @@
   [data-scope='mention']:is([data-part='root'], [data-part='positioner'])[data-size='sm'] {
     --xh-_mention-h: var(--xh-control-h-sm);
     --xh-_mention-px: var(--xh-control-px-sm);
+    --xh-_mention-item-py: var(--xh-list-option-py-sm);
+    --xh-_mention-item-px: var(--xh-control-px-sm);
     --xh-_mention-py: var(--xh-space-1);
     --xh-_mention-gap: var(--xh-control-gap-sm);
     --xh-_mention-font-size: var(--xh-control-font-sm);
@@ -88,6 +95,8 @@
   [data-scope='mention']:is([data-part='root'], [data-part='positioner'])[data-size='lg'] {
     --xh-_mention-h: var(--xh-control-h-lg);
     --xh-_mention-px: var(--xh-control-px-lg);
+    --xh-_mention-item-py: var(--xh-list-option-py-lg);
+    --xh-_mention-item-px: var(--xh-control-px-lg);
     --xh-_mention-py: var(--xh-space-3);
     --xh-_mention-gap: var(--xh-control-gap-lg);
     --xh-_mention-font-size: var(--xh-control-font-lg);
@@ -187,6 +196,7 @@
   [data-scope='mention'][data-part='content'] {
     display: flex;
     flex-direction: column;
+    gap: var(--xh-mention-content-gap, var(--xh-list-option-gap));
     min-inline-size: var(--xh-mention-content-min-w, var(--xh-overlay-min-w));
     max-inline-size: var(--xh-mention-content-max-w, var(--xh-overlay-max-w));
     max-block-size: min(var(--xh-mention-content-max-h, var(--xh-overlay-max-h)), var(--xh-_mention-available-h));
@@ -233,8 +243,8 @@
     display: flex;
     align-items: center;
     gap: var(--xh-mention-item-gap, var(--xh-_mention-gap));
-    padding-block: var(--xh-mention-item-py, var(--xh-space-1_5));
-    padding-inline: var(--xh-mention-item-px, var(--xh-control-px-md));
+    padding-block: var(--xh-mention-item-py, var(--xh-_mention-item-py));
+    padding-inline: var(--xh-mention-item-px, var(--xh-_mention-item-px));
     border-radius: var(--xh-mention-item-radius, var(--xh-shape-control));
     color: var(--xh-mention-item-fg, var(--xh-fg-default));
     font-size: var(--xh-mention-item-font-size, var(--xh-_mention-font-size));

package/css/menu.css

@@ -37,6 +37,9 @@
        引擎没算（尚未落位 / 无引擎）时不额外限高 */
     --xh-_menu-available-h: 100vh;
 
+    /* 条目列表的自绘条浮在内容之上：轨道不上底色，实色轨道会在菜单右缘糊一条竖灰带 */
+    --xh-scrollbar-track-bg: transparent;
+
     position: fixed;
     z-index: var(--xh-menu-layer, var(--xh-layer-popover));
     /* 空壳不吃指针，交互只发生在 content 上 */
@@ -67,10 +70,10 @@
 
     /* 尺寸档只换这四个私有槽，条目从 content 继承它们，换档不必给每个部件各写一条选择器。
        菜单没有 root 部件（浮层树的最外层就是 content），三轴属性都落在这里 */
-    --xh-_menu-item-py: var(--xh-space-1_5);
+    --xh-_menu-item-py: var(--xh-list-option-py-md);
     --xh-_menu-item-px: var(--xh-control-px-md);
     --xh-_menu-item-gap: var(--xh-control-gap-md);
-    --xh-_menu-font-size: var(--xh-text-body-size);
+    --xh-_menu-font-size: var(--xh-control-font-md);
 
     /* 打开子菜单的触发条目走品牌淡底强档，随语气换色相；没写 data-tone 时退回品牌淡底。
        悬停与键盘焦点恒中性灰轻档、不接语气槽——两档同色相的话打开路径就认不出来了 */
@@ -78,6 +81,7 @@
 
     display: flex;
     flex-direction: column;
+    gap: var(--xh-menu-content-gap, var(--xh-list-option-gap));
     min-inline-size: var(--xh-menu-min-w, var(--xh-overlay-menu-min-w));
     max-inline-size: var(--xh-menu-max-w, var(--xh-overlay-max-w));
     /* 两道上限取更小的那道：自己的高度上限，以及落定那一侧真正剩下的空间。
@@ -120,14 +124,14 @@
   /* 缺省档写在 content 的基础规则里。条目高度由 padding 撑出来：
      纵向走 space 档、行内内缩走 control-px 档（随密度轴），换档各挪一级 */
   [data-scope='menu'][data-part='content'][data-size='sm'] {
-    --xh-_menu-item-py: var(--xh-space-1);
+    --xh-_menu-item-py: var(--xh-list-option-py-sm);
     --xh-_menu-item-px: var(--xh-control-px-sm);
     --xh-_menu-item-gap: var(--xh-control-gap-sm);
     --xh-_menu-font-size: var(--xh-control-font-sm);
   }
 
   [data-scope='menu'][data-part='content'][data-size='lg'] {
-    --xh-_menu-item-py: var(--xh-space-2);
+    --xh-_menu-item-py: var(--xh-list-option-py-lg);
     --xh-_menu-item-px: var(--xh-control-px-lg);
     --xh-_menu-item-gap: var(--xh-control-gap-lg);
     --xh-_menu-font-size: var(--xh-control-font-lg);
@@ -200,6 +204,7 @@
   [data-scope='menu'][data-part='group'] {
     display: flex;
     flex-direction: column;
+    gap: var(--xh-menu-group-gap, var(--xh-list-option-gap));
   }
 
   [data-scope='menu'][data-part='group'][hidden] {
@@ -225,7 +230,7 @@
 
   [data-scope='menu'][data-part='separator'] {
     block-size: var(--xh-menu-separator-thickness, var(--xh-stroke-thin));
-    margin-block: var(--xh-menu-separator-my, var(--xh-space-1));
+    margin-block: var(--xh-menu-separator-my, var(--xh-space-0_5));
     background: var(--xh-menu-separator-color, var(--xh-border-default));
   }
 
@@ -241,4 +246,10 @@
     background: var(--xh-menu-bg, var(--xh-bg-surface));
     border: var(--xh-stroke-thin) solid var(--xh-menu-border, var(--xh-border-default));
   }
+
+  /* 声明过任何 display 就盖掉了 UA 的 [hidden]{display:none}，收起态得自己还回去。
+     写在文件末尾：兜底必须排在该部件所有 display 声明之后 */
+  [data-scope='menu'][data-part='item'][hidden] {
+    display: none;
+  }
 }

package/css/menubar.css

@@ -19,6 +19,12 @@
     color: var(--xh-menubar-root-fg, var(--xh-fg-default));
   }
 
+  /* 浮层被搬到 portal 落点，继承不到 root 上的槽：这把尺在被搬走的那一侧再声明一次，
+     关闭钮与条目里作者塞的图标才和皮肤画的兜底字形一样大 */
+  [data-scope='menubar'][data-part='content'] {
+    --xh-icon-size: var(--xh-menubar-icon-size, var(--xh-glyph-size-text));
+  }
+
   [data-scope='menubar'][data-part='root'][hidden] {
     display: none;
   }
@@ -111,10 +117,10 @@
   [data-scope='menubar']:is([data-part='root'], [data-part='positioner']) {
     --xh-_menubar-trigger-py: var(--xh-space-1);
     --xh-_menubar-trigger-px: var(--xh-control-px-md);
-    --xh-_menubar-item-py: var(--xh-space-1_5);
+    --xh-_menubar-item-py: var(--xh-list-option-py-md);
     --xh-_menubar-item-px: var(--xh-control-px-md);
     --xh-_menubar-item-gap: var(--xh-control-gap-md);
-    --xh-_menubar-font-size: var(--xh-text-body-size);
+    --xh-_menubar-font-size: var(--xh-control-font-md);
 
     /* 展开着的那张菜单的 trigger 走品牌淡底强档，随语气换色相；没写 data-tone 时退回品牌淡底。
        悬停与键盘焦点恒中性灰轻档、不接语气槽——两档同色相的话哪张开着就认不出来了。
@@ -128,7 +134,7 @@
   [data-scope='menubar'][data-size='sm']:is([data-part='root'], [data-part='positioner']) {
     --xh-_menubar-trigger-py: var(--xh-space-0_5);
     --xh-_menubar-trigger-px: var(--xh-control-px-sm);
-    --xh-_menubar-item-py: var(--xh-space-1);
+    --xh-_menubar-item-py: var(--xh-list-option-py-sm);
     --xh-_menubar-item-px: var(--xh-control-px-sm);
     --xh-_menubar-item-gap: var(--xh-control-gap-sm);
     --xh-_menubar-font-size: var(--xh-control-font-sm);
@@ -137,7 +143,7 @@
   [data-scope='menubar'][data-size='lg']:is([data-part='root'], [data-part='positioner']) {
     --xh-_menubar-trigger-py: var(--xh-space-2);
     --xh-_menubar-trigger-px: var(--xh-control-px-lg);
-    --xh-_menubar-item-py: var(--xh-space-2);
+    --xh-_menubar-item-py: var(--xh-list-option-py-lg);
     --xh-_menubar-item-px: var(--xh-control-px-lg);
     --xh-_menubar-item-gap: var(--xh-control-gap-lg);
     --xh-_menubar-font-size: var(--xh-control-font-lg);
@@ -146,6 +152,7 @@
   [data-scope='menubar'][data-part='content'] {
     display: flex;
     flex-direction: column;
+    gap: var(--xh-menubar-content-gap, var(--xh-list-option-gap));
     min-inline-size: var(--xh-menubar-min-w, var(--xh-overlay-menu-min-w));
     max-inline-size: var(--xh-menubar-max-w, var(--xh-overlay-max-w));
     /* 两道上限取更小的那道：自己的高度上限，以及落定那一侧真正剩下的空间。
@@ -195,6 +202,7 @@
   [data-scope='menubar'][data-part='group'] {
     display: flex;
     flex-direction: column;
+    gap: var(--xh-menubar-group-gap, var(--xh-list-option-gap));
   }
 
   [data-scope='menubar'][data-part='group'][hidden] {
@@ -306,7 +314,7 @@
     align-items: center;
     justify-content: center;
     inline-size: var(--xh-menubar-item-indicator-size, var(--xh-control-indicator-size));
-    color: var(--xh-menubar-item-indicator-fg, var(--xh-fg-brand));
+    color: var(--xh-menubar-item-indicator-fg, var(--xh-_tone, var(--xh-fg-brand)));
   }
 
   [data-scope='menubar'][data-part='item-indicator'][hidden] {
@@ -321,7 +329,7 @@
      不给 display，因此 UA 的 [hidden]{display:none} 自己就压得住 */
   [data-scope='menubar'][data-part='separator'] {
     block-size: var(--xh-menubar-separator-thickness, var(--xh-stroke-thin));
-    margin-block: var(--xh-menubar-separator-my, var(--xh-space-1));
+    margin-block: var(--xh-menubar-separator-my, var(--xh-space-0_5));
     background: var(--xh-menubar-separator-color, var(--xh-border-default));
   }
 

package/css/navigation-menu.css

@@ -37,13 +37,13 @@
     /* 尺寸档只换这五个私有槽，trigger 与面板里的链接都从 root 继承它们，
        换档不必给每个部件各写一条选择器。面板与共享外壳都是 root 的后代，一并继承。
        trigger 写的是 font: inherit，字号跟着 root 这一档走，不另立槽 */
-    --xh-_navigation-menu-font-size: var(--xh-text-label-size);
+    --xh-_navigation-menu-font-size: var(--xh-control-font-md);
     --xh-_navigation-menu-trigger-h: var(--xh-control-h-md);
     --xh-_navigation-menu-trigger-px: var(--xh-control-px-md);
     --xh-_navigation-menu-trigger-gap: var(--xh-control-gap-md);
     --xh-_navigation-menu-link-py: var(--xh-space-1_5);
     --xh-_navigation-menu-link-px: var(--xh-control-px-md);
-    --xh-_navigation-menu-link-font-size: var(--xh-text-body-size);
+    --xh-_navigation-menu-link-font-size: var(--xh-control-font-md);
 
     /* 悬停与键盘锚点恒中性灰轻档、不接语气槽——两档同色相的话打开路径就认不出来了 */
     --xh-_navigation-menu-highlight-bg: var(--xh-bg-subtle);