weifuwu 0.70.0 → 0.71.0

package/dist/components/style.css

@@ -46,6 +46,7 @@
   --wf-dark-bg-hover: rgba(255, 255, 255, 0.06);      /* 暗色 hover 反白 */
   --wf-dark-surface-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
   --wf-dark-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
+  --wf-dark-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.3);
   --wf-dark-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
   --wf-dark-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
   --wf-dark-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
@@ -82,6 +83,7 @@
 
   /* ── 阴影 ── */
   --wf-shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
+  --wf-shadow-inset: inset 0 1px 2px rgba(0,0,0,0.04);  /* 内阴影：凹槽/轨道深度（Switch/ThemeSwitch） */
   --wf-shadow: 0 1px 3px rgba(0,0,0,0.08);
   --wf-shadow-md: 0 4px 12px rgba(0,0,0,0.1);
   --wf-shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1);
@@ -222,6 +224,7 @@
 
   /* ── 浮层遮罩（Modal/Drawer overlay，暗色经 --wf-dark-overlay 映射） ── */
   --wf-overlay: rgba(0, 0, 0, 0.4);
+  --wf-overlay-blur: 4px;  /* 遮罩毛玻璃（弹层现代质感，不支持 backdrop-filter 的环境自动降级为纯色） */
 
   /* ── 表单控件 ── */
   --wf-accent-color: var(--wf-color-primary);
@@ -307,6 +310,7 @@
   --wf-shadow: var(--wf-dark-shadow);
   --wf-shadow-md: var(--wf-dark-shadow-md);
   --wf-shadow-lg: var(--wf-dark-shadow-lg);
+  --wf-shadow-inset: var(--wf-dark-shadow-inset);
 
   --wf-color-primary-text: var(--wf-dark-brand-500);
   --wf-color-success-text: var(--wf-dark-green-500);
@@ -357,6 +361,7 @@
     --wf-shadow: var(--wf-dark-shadow);
     --wf-shadow-md: var(--wf-dark-shadow-md);
     --wf-shadow-lg: var(--wf-dark-shadow-lg);
+    --wf-shadow-inset: var(--wf-dark-shadow-inset);
 
     --wf-color-primary-text: var(--wf-dark-brand-500);
     --wf-color-success-text: var(--wf-dark-green-500);
@@ -377,6 +382,36 @@
   box-sizing: border-box;
 }
 
+/* 选区色：primary 调（文字反白，与品牌一致） */
+::selection {
+  background: var(--wf-color-primary-bg);
+  color: var(--wf-color-primary-text);
+}
+
+/* 主题滚动条（全局——所有滚动区一致；Firefox thin + WebKit 样式） */
+* {
+  scrollbar-width: thin;
+  scrollbar-color: var(--wf-color-border-dark) transparent;
+}
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+::-webkit-scrollbar-thumb {
+  background: var(--wf-color-border-dark);
+  border-radius: var(--wf-radius-sm);
+  border: 2px solid transparent;
+  background-clip: padding-box;
+}
+::-webkit-scrollbar-thumb:hover {
+  background: var(--wf-color-text-secondary);
+  background-clip: padding-box;
+  border: 2px solid transparent;
+}
+
 :root {
   /* 原生控件/滚动条跟随主题；暗色激活时在 _dark.css 中切为 dark */
   color-scheme: light;
@@ -447,11 +482,20 @@ button {
   padding: var(--wf-control-pad-y) var(--wf-space-md);
   min-height: var(--wf-control-height);
   cursor: pointer;
+  transition: border-color var(--wf-dur-fast) var(--wf-ease-out),
+              color var(--wf-dur-fast) var(--wf-ease-out),
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out),
+              background-color var(--wf-dur-fast) var(--wf-ease-out),
+              filter var(--wf-dur-fast) var(--wf-ease-out);
 }
 button:hover {
   border-color: var(--wf-color-primary);
   color: var(--wf-color-primary-text);
 }
+button:active:not(:disabled),
+[role="button"]:active {
+  filter: brightness(0.95); /* 按压反馈：不偏移布局，适用任意宽度（block/inline） */
+}
 
 /* 键盘焦点：button 与 [tabindex] 统一 focus ring（仅键盘触发，鼠标点击不闪） */
 button:focus-visible,
@@ -460,6 +504,15 @@ button:focus-visible,
   box-shadow: var(--wf-focus-ring);
 }
 
+[role="button"] {
+  cursor: pointer;
+  transition: background-color var(--wf-dur-fast) var(--wf-ease-out),
+              border-color var(--wf-dur-fast) var(--wf-ease-out),
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out),
+              color var(--wf-dur-fast) var(--wf-ease-out),
+              filter var(--wf-dur-fast) var(--wf-ease-out);
+}
+
 /* 触屏设备（coarse pointer）：交互目标提升到 44px（Apple HIG / WCAG 2.5.8） */
 @media (pointer: coarse) {
   button,
@@ -571,10 +624,13 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* stack — 纵向堆叠 */
+/* stack — 纵向堆叠（L3：gap 默认值 :where() 零优先级——wf-gap-* 等覆盖工具
+   靠优先级获胜，不再依赖 import 顺序） */
 .wf-stack {
   display: flex;
   flex-direction: column;
+}
+:where(.wf-stack) {
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 @media (min-width: 640px) { .wf-stack\@sm { flex-direction: row; align-items: var(--wf-align, center); } }
@@ -585,6 +641,8 @@ body.wf-dragging {
 .wf-stack-reverse {
   display: flex;
   flex-direction: column-reverse;
+}
+:where(.wf-stack-reverse) {
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 @media (min-width: 640px) { .wf-stack-reverse\@sm { flex-direction: row-reverse; align-items: var(--wf-align, center); } }
@@ -593,10 +651,13 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* row — 横向排列 */
+/* row — 横向排列（L3：gap/align 默认值 :where() 零优先级——wf-gap-*、wf-top 等
+   覆盖工具靠优先级获胜，不再依赖 import 顺序） */
 .wf-row {
   display: flex;
   flex-wrap: wrap;
+}
+:where(.wf-row) {
   gap: var(--wf-gap, var(--wf-gap-md));
   align-items: var(--wf-align, center);
 }
@@ -609,6 +670,8 @@ body.wf-dragging {
   display: flex;
   flex-direction: row-reverse;
   flex-wrap: wrap;
+}
+:where(.wf-row-reverse) {
   gap: var(--wf-gap, var(--wf-gap-md));
   align-items: var(--wf-align, center);
 }
@@ -618,10 +681,12 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* split — 两端展开 */
+/* split — 两端展开（L3：align/gap 默认值 :where() 零优先级） */
 .wf-split {
   display: flex;
   justify-content: space-between;
+}
+:where(.wf-split) {
   align-items: var(--wf-align, center);
   gap: var(--wf-gap, var(--wf-gap-md));
 }
@@ -641,10 +706,12 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* between — 两端对齐（行内垂直居中） */
+/* between — 两端对齐（行内垂直居中；L3：align/gap 默认值 :where() 零优先级） */
 .wf-between {
   display: flex;
   justify-content: space-between;
+}
+:where(.wf-between) {
   align-items: var(--wf-align, center);
   gap: var(--wf-gap, var(--wf-gap-md));
 }
@@ -654,57 +721,69 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* right — 靠右对齐 */
+/* right — 靠右对齐（L3：align/gap 默认值 :where() 零优先级） */
 .wf-right {
   display: flex;
   justify-content: flex-end;
+}
+:where(.wf-right) {
   align-items: var(--wf-align, center);
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 }
 
 @layer layout {
-/* top — 顶部对齐 */
+/* top — 顶部对齐（L3：gap 默认值 :where() 零优先级；align-items 是身份属性） */
 .wf-top {
   display: flex;
   align-items: flex-start;
+}
+:where(.wf-top) {
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 }
 
 @layer layout {
-/* bottom — 底部对齐 */
+/* bottom — 底部对齐（L3：gap 默认值 :where() 零优先级；align-items 是身份属性） */
 .wf-bottom {
   display: flex;
   align-items: flex-end;
+}
+:where(.wf-bottom) {
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 }
 
 @layer layout {
-/* stretch — 拉伸对齐 */
+/* stretch — 拉伸对齐（L3：gap 默认值 :where() 零优先级；align-items 是身份属性） */
 .wf-stretch {
   display: flex;
   align-items: stretch;
+}
+:where(.wf-stretch) {
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 }
 
 @layer layout {
-/* around — 均匀环绕分布 */
+/* around — 均匀环绕分布（L3：align/gap 默认值 :where() 零优先级） */
 .wf-around {
   display: flex;
   justify-content: space-around;
+}
+:where(.wf-around) {
   align-items: var(--wf-align, center);
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 }
 
 @layer layout {
-/* evenly — 均匀分布 */
+/* evenly — 均匀分布（L3：align/gap 默认值 :where() 零优先级） */
 .wf-evenly {
   display: flex;
   justify-content: space-evenly;
+}
+:where(.wf-evenly) {
   align-items: var(--wf-align, center);
   gap: var(--wf-gap, var(--wf-gap-md));
 }
@@ -720,7 +799,9 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* fixed — 固定不伸缩 */
+/* flex-none — 固定不伸缩（推荐名；wf-fixed 为兼容别名——易与 position:fixed 混淆，
+   position:fixed 请用 wf-pin） */
+.wf-flex-none,
 .wf-fixed {
   flex: none;
 }
@@ -881,19 +962,24 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* grid — 二维网格 */
+/* grid — 二维网格（L3：gap 默认值 :where() 零优先级） */
 .wf-grid {
   display: grid;
   grid-template-columns: var(--wf-cols, repeat(auto-fill, minmax(280px, 1fr)));
+}
+:where(.wf-grid) {
   gap: var(--wf-gap, var(--wf-gap-lg));
 }
 }
 
 @layer layout {
-/* cluster — 换行簇 */
+/* cluster — 换行簇（L3：justify/align/gap 默认值 :where() 零优先级——
+   wf-right 等分布工具叠加时靠优先级获胜） */
 .wf-cluster {
   display: flex;
   flex-wrap: wrap;
+}
+:where(.wf-cluster) {
   gap: var(--wf-gap, var(--wf-gap-sm));
   justify-content: var(--wf-justify, center);
   align-items: var(--wf-align, center);
@@ -901,7 +987,7 @@ body.wf-dragging {
 }
 
 @layer layout {
-/* scroll — 可滚动容器 */
+/* scroll — 可滚动容器（全局滚动条样式见 _base.css；此类仅标记语义 + overflow） */
 .wf-scroll {
   overflow: auto;
 }
@@ -963,6 +1049,19 @@ body.wf-dragging {
 }
 }
 
+@layer utilities {
+/* flex — 弹性盒 display 工具（补全 display 族：block/inline/inline-block/contents/hidden/flex）
+ * 核心场景：响应式显隐的 flex 容器——`wf-hidden wf-flex@lg`（窄隐宽显且保持 flex 布局）。
+ * 不可用 wf-block@lg 替代：block 会覆盖 wf-stack 的 display:flex，
+ * 致 flex-direction/gap/mt-auto 全部静默失效（layouts-demo 侧栏 mt-auto 实测踩坑）。 */
+.wf-flex {
+  display: flex;
+}
+@media (min-width: 640px) { .wf-flex\@sm { display: flex; } }
+@media (min-width: 768px) { .wf-flex\@md { display: flex; } }
+@media (min-width: 1024px) { .wf-flex\@lg { display: flex; } }
+}
+
 @layer layout {
 /* container — 内容宽度约束居中 */
 /* width: 100% 必须：margin: 0 auto 在 flex 父中阻止 stretch（宽度=内容）
@@ -992,10 +1091,13 @@ body.wf-dragging {
 
 @layer layout {
 /* nowrap — 不换行（只管 flex-wrap——不定义 align-items，避免与
-   wf-stretch 等对齐工具叠加冲突：双份 CSS 下 nowrap 后置曾覆盖 stretch） */
+   wf-stretch 等对齐工具叠加冲突：双份 CSS 下 nowrap 后置曾覆盖 stretch；
+   L3：gap 默认值 :where() 零优先级） */
 .wf-nowrap {
   display: flex;
   flex-wrap: nowrap;
+}
+:where(.wf-nowrap) {
   gap: var(--wf-gap, var(--wf-gap-md));
 }
 }
@@ -1038,6 +1140,20 @@ body.wf-dragging {
 .wf-py-xl { padding-top: var(--wf-space-xl); padding-bottom: var(--wf-space-xl); }
 .wf-py-2xl { padding-top: var(--wf-space-2xl); padding-bottom: var(--wf-space-2xl); }
 
+/* ── padding: 单侧顶/底（幽灵类防线抓出 wf-pt-md/wf-pb-md 误用——补全家族） ── */
+.wf-pt-xs { padding-top: var(--wf-space-xs); }
+.wf-pt-sm { padding-top: var(--wf-space-sm); }
+.wf-pt-md { padding-top: var(--wf-space-md); }
+.wf-pt-lg { padding-top: var(--wf-space-lg); }
+.wf-pt-xl { padding-top: var(--wf-space-xl); }
+.wf-pt-2xl { padding-top: var(--wf-space-2xl); }
+.wf-pb-xs { padding-bottom: var(--wf-space-xs); }
+.wf-pb-sm { padding-bottom: var(--wf-space-sm); }
+.wf-pb-md { padding-bottom: var(--wf-space-md); }
+.wf-pb-lg { padding-bottom: var(--wf-space-lg); }
+.wf-pb-xl { padding-bottom: var(--wf-space-xl); }
+.wf-pb-2xl { padding-bottom: var(--wf-space-2xl); }
+
 /* ── margin：重置 ── */
 .wf-m-0 { margin: 0; }
 .wf-p-0 { padding: 0; }
@@ -1067,6 +1183,8 @@ body.wf-dragging {
 /* ── margin: auto（居中） ── */
 .wf-mx-auto { margin-left: auto; margin-right: auto; }
 .wf-my-auto { margin-top: auto; margin-bottom: auto; }
+.wf-mt-auto { margin-top: auto; }  /* flex 列推底（侧栏 footer——曾写不存在类静默失效） */
+.wf-mb-auto { margin-bottom: auto; }
 
 /* ── gap：直接设置 gap 属性（不设 --wf-gap 变量——变量会继承污染子孙：
    壳 root wf-gap-none 曾让 KPI grid 的 gap: var(--wf-gap) = 0 卡无间距） ── */
@@ -1534,6 +1652,15 @@ body.wf-dragging {
   background: var(--wf-color-bg-tertiary);
 }
 
+.wf-accordion-arrow {
+  transition: transform var(--wf-dur-base) var(--wf-ease-out);
+  color: var(--wf-color-text-secondary);
+  flex-shrink: 0;
+}
+.wf-accordion-item--open .wf-accordion-arrow {
+  transform: rotate(180deg);
+}
+
 .wf-accordion-summary:focus-visible {
   outline: none;
   box-shadow: var(--wf-focus-ring);
@@ -1565,9 +1692,9 @@ body.wf-dragging {
 .wf-aichat {
   display: flex;
   flex-direction: column;
-  gap: var(--wf-gap-sm, 8px);
+  gap: var(--wf-gap-sm);
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 14px);
+  font-size: var(--wf-font-size-sm);
   line-height: var(--wf-line-height);
   color: var(--wf-color-text);
 }
@@ -1576,24 +1703,24 @@ body.wf-dragging {
   overflow-y: auto;
   display: flex;
   flex-direction: column;
-  gap: var(--wf-gap-sm, 8px);
-  padding: var(--wf-space-sm, 8px);
+  gap: var(--wf-gap-sm);
+  padding: var(--wf-space-sm);
   border: 1px solid var(--wf-color-border);
   border-radius: var(--wf-radius);
   background: var(--wf-color-bg);
 }
 
 .wf-aichat-empty {
-  margin: var(--wf-space-lg, 16px) 0;
+  margin: var(--wf-space-lg) 0;
   text-align: center;
   color: var(--wf-color-text-secondary);
-  font-size: var(--wf-font-size-sm, 14px);
+  font-size: var(--wf-font-size-sm);
 }
 
 .wf-aichat-msg {
   display: flex;
   flex-direction: column;
-  gap: var(--wf-gap-xs, 4px);
+  gap: var(--wf-gap-xs);
 }
 
 .wf-aichat-tools,
@@ -1604,9 +1731,9 @@ body.wf-dragging {
 .wf-aichat-bubble {
   display: inline-block;
   max-width: 85%;
-  padding: var(--wf-space-sm, 8px) var(--wf-space-md, 12px);
+  padding: var(--wf-space-sm) var(--wf-space-md);
   border-radius: var(--wf-radius);
-  font-size: var(--wf-font-size-sm, 14px);
+  font-size: var(--wf-font-size-sm);
   white-space: pre-wrap;
   word-break: break-word;
 }
@@ -1630,38 +1757,38 @@ body.wf-dragging {
 }
 
 .wf-aichat-status {
-  font-size: var(--wf-font-size-xs, 12px);
+  font-size: var(--wf-font-size-xs);
   color: var(--wf-color-info-text);
 }
 
 .wf-aichat-usage {
-  font-size: var(--wf-font-size-xs, 12px);
+  font-size: var(--wf-font-size-xs);
   color: var(--wf-color-text-secondary);
 }
 
 .wf-aichat-error {
-  font-size: var(--wf-font-size-xs, 12px);
+  font-size: var(--wf-font-size-xs);
   color: var(--wf-color-error-text);
   background: var(--wf-color-error-bg);
   border-radius: var(--wf-radius);
-  padding: var(--wf-space-sm, 8px);
+  padding: var(--wf-space-sm);
 }
 
 .wf-aichat-inputbar {
   display: flex;
-  gap: var(--wf-gap-sm, 8px);
+  gap: var(--wf-gap-sm);
   align-items: center;
 }
 
 .wf-aichat-input {
   flex: 1;
   min-width: 0;
-  height: var(--wf-control-height, 36px);
-  padding: var(--wf-control-pad-y, 6px) var(--wf-space-md, 12px);
+  height: var(--wf-control-height);
+  padding: var(--wf-control-pad-y) var(--wf-space-md);
   border: 1px solid var(--wf-color-border);
   border-radius: var(--wf-radius);
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 14px);
+  font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
   background: var(--wf-color-bg);
 }
@@ -1678,7 +1805,7 @@ body.wf-dragging {
   align-items: flex-start;
   gap: var(--wf-gap-sm);
   padding: var(--wf-space) var(--wf-space-md);
-  border-radius: var(--wf-alert-radius, var(--wf-radius));
+  border-radius: var(--wf-alert-radius,  var(--wf-radius));
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
   line-height: var(--wf-line-height);
@@ -1719,36 +1846,36 @@ body.wf-dragging {
 .wf-alertgroup {
   display: flex;
   flex-direction: column;
-  gap: 6px;
+  gap: var(--wf-space-sm);
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 13px);
+  font-size: var(--wf-font-size-sm);
 }
 
 .wf-alertgroup-summary {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 10px 16px;
-  border: var(--wf-border-width, 1px) solid var(--wf-color-border);
-  border-radius: var(--wf-surface-radius, 8px);
-  background: var(--wf-color-bg-secondary, #fff);
-  color: var(--wf-color-primary, #1668dc);
+  padding: var(--wf-space-sm) 16px;
+  border: var(--wf-border-width) solid var(--wf-color-border);
+  border-radius: var(--wf-surface-radius);
+  background: var(--wf-color-bg-secondary);
+  color: var(--wf-color-primary-text);
   cursor: pointer;
   font-family: var(--wf-font-sans);
-  transition: background var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: background var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-alertgroup-summary:hover {
-  background: var(--wf-color-bg-hover, rgba(0, 0, 0, 0.04));
+  background: var(--wf-color-bg-hover);
 }
 
 .wf-alertgroup-item {
   display: flex;
   align-items: center;
-  gap: 10px;
-  padding: 10px 16px;
-  border-radius: var(--wf-surface-radius, 8px);
-  background: var(--wf-color-bg-secondary, #fff);
+  gap: var(--wf-space-sm);
+  padding: var(--wf-space-sm) 16px;
+  border-radius: var(--wf-surface-radius);
+  background: var(--wf-color-bg-secondary);
   border-left: 3px solid var(--wf-color-info);
 }
 
@@ -1762,7 +1889,7 @@ body.wf-dragging {
 }
 
 .wf-alertgroup-time {
-  color: var(--wf-color-text-tertiary, #999);
+  color: var(--wf-color-text-tertiary);
   font-size: 12px;
 }
 
@@ -1777,19 +1904,19 @@ body.wf-dragging {
   padding: 0;
   border: none;
   background: transparent;
-  color: var(--wf-color-text-tertiary, #999);
+  color: var(--wf-color-text-tertiary);
   cursor: pointer;
   border-radius: 4px;
 }
 
 .wf-alertgroup-close:hover {
-  background: var(--wf-color-bg-hover, rgba(0, 0, 0, 0.04));
+  background: var(--wf-color-bg-hover);
   color: var(--wf-color-text);
 }
 
 /* weifuwu/components — Anchor（锚点导航） */
 
-.wf-anchor-nav-nav {
+.wf-anchor-nav {
   display: flex;
   flex-direction: column;
   gap: 2px;
@@ -1797,7 +1924,7 @@ body.wf-dragging {
   font-size: var(--wf-font-size-sm);
 }
 
-.wf-anchor-nav-nav-link {
+.wf-anchor-link {
   display: block;
   padding: var(--wf-space-xs) var(--wf-space-sm);
   border-left: 2px solid transparent;
@@ -1810,19 +1937,19 @@ body.wf-dragging {
               border-color var(--wf-dur-fast) var(--wf-ease-out);
 }
 
-.wf-anchor-nav-nav-link:hover {
+.wf-anchor-link:hover {
   background: var(--wf-color-bg-secondary);
   color: var(--wf-color-text);
 }
 
-.wf-anchor-nav-nav-link--active {
+.wf-anchor-link--active {
   color: var(--wf-color-primary-text);
   border-left-color: var(--wf-color-primary);
   font-weight: var(--wf-font-weight-semibold);
   background: var(--wf-color-primary-bg);
 }
 
-.wf-anchor-nav-nav-link:focus-visible {
+.wf-anchor-link:focus-visible {
   outline: none;
   box-shadow: var(--wf-focus-ring);
 }
@@ -1895,20 +2022,37 @@ body.wf-dragging {
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
   color: var(--wf-color-text);
+  transition: border-color var(--wf-dur-fast) var(--wf-ease-out),
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out);
+}
+.wf-approval-note-input:hover {
+  border-color: var(--wf-color-primary);
+}
+.wf-approval-note-input:focus {
+  outline: none;
+  border-color: var(--wf-color-primary);
+  box-shadow: var(--wf-focus-ring);
+}
+.wf-approval-note-input::placeholder {
+  color: var(--wf-color-text-tertiary);
 }
 
 .wf-approval-status {
   margin-top: var(--wf-gap-xs);
   font-size: var(--wf-font-size-xs);
+  font-weight: var(--wf-font-weight-medium);
   color: var(--wf-color-text-secondary);
 }
+.wf-approval-status--approved { color: var(--wf-color-success-text); }
+.wf-approval-status--rejected { color: var(--wf-color-error-text); }
+.wf-approval-status--timeout { color: var(--wf-color-text-tertiary); }
 
 /* weifuwu/components — AspectRatio */
 
 .wf-aspect-ratio {
   position: relative;
   width: 100%;
-  aspect-ratio: var(--wf-aspect-ratio, 16 / 9);
+  aspect-ratio: var(--wf-aspect-ratio,  16 / 9);
   overflow: hidden;
 }
 
@@ -1934,15 +2078,15 @@ body.wf-dragging {
 
 .wf-autocomplete-dropdown {
   position: fixed;
-  z-index: var(--wf-z-popover, 120);
+  z-index: var(--wf-z-popover);
   max-height: 280px;
   overflow-y: auto;
-  border-radius: var(--wf-surface-radius, 8px);
-  background: var(--wf-surface-bg, #fff);
-  box-shadow: var(--wf-surface-shadow, 0 4px 16px rgba(0, 0, 0, 0.12));
-  border: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  border-radius: var(--wf-surface-radius);
+  background: var(--wf-surface-bg);
+  box-shadow: var(--wf-surface-shadow);
+  border: var(--wf-border-width) solid var(--wf-color-border-light);
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 13px);
+  font-size: var(--wf-font-size-sm);
 }
 
 .wf-autocomplete-option {
@@ -1952,16 +2096,16 @@ body.wf-dragging {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  transition: background var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: background var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-autocomplete-option:hover,
 .wf-autocomplete-option--active {
-  background: var(--wf-color-bg-hover, rgba(0, 0, 0, 0.04));
+  background: var(--wf-color-bg-hover);
 }
 
 .wf-autocomplete-option--active {
-  color: var(--wf-color-primary, #1668dc);
+  color: var(--wf-color-primary-text);
 }
 
 /* weifuwu/components — Avatar */
@@ -2030,7 +2174,7 @@ body.wf-dragging {
   background: var(--wf-color-bg-secondary);
   color: var(--wf-color-text-secondary);
   cursor: pointer;
-  box-shadow: var(--wf-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.1));
+  box-shadow: var(--wf-shadow-sm);
   transition: opacity var(--wf-dur-base) var(--wf-ease-out),
               transform var(--wf-dur-base) var(--wf-ease-out),
               background var(--wf-dur-fast) var(--wf-ease-out);
@@ -2058,7 +2202,7 @@ body.wf-dragging {
   display: inline-flex;
   align-items: center;
   padding: 2px var(--wf-space-sm);
-  border-radius: var(--wf-badge-radius, 10px);
+  border-radius: var(--wf-badge-radius,  10px);
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-xs);
   font-weight: var(--wf-font-weight-medium);
@@ -2088,6 +2232,20 @@ body.wf-dragging {
 .wf-badge-dot--danger { background: var(--wf-color-error); }
 .wf-badge-dot--info { background: var(--wf-color-info); }
 
+/* 数值角标（count 模式）：圆形，最小宽度保证 2 位数居中 */
+.wf-badge--count {
+  min-width: 18px;
+  height: 18px;
+  padding: 0 var(--wf-space-xs);
+  border-radius: var(--wf-radius-xl);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: var(--wf-font-size-xs);
+  font-weight: var(--wf-font-weight-semibold);
+  line-height: 1;
+}
+
 /* weifuwu/components — Breadcrumb */
 
 .wf-breadcrumb {
@@ -2136,10 +2294,10 @@ body.wf-dragging {
   font-weight: var(--wf-font-weight-medium);
   padding: var(--wf-btn-pad-y, var(--wf-control-pad-y)) var(--wf-btn-pad-x, var(--wf-space-md));
   min-height: var(--wf-control-height);
-  border-radius: var(--wf-btn-radius, var(--wf-radius));
+  border-radius: var(--wf-btn-radius,  var(--wf-radius));
   border: var(--wf-border-width) solid transparent;
   cursor: pointer;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   line-height: 1;
   white-space: nowrap;
   user-select: none;
@@ -2199,7 +2357,7 @@ body.wf-dragging {
   /* flex 容器中宽度稳定：grid 1fr 列在内容驱动宽度下会被事件 nowrap 撑宽/
     无事件塌缩——固定 min-width 防塌缩（定制 Token，默认 280px = 7 列 × 40px） */
   width: 100%;
-  min-width: var(--wf-calendar-min-width, 280px);
+  min-width: var(--wf-calendar-min-width,  280px);
 }
 
 .wf-calendar-header {
@@ -2227,7 +2385,7 @@ body.wf-dragging {
   justify-content: center;
   border: none;
   background: none;
-  padding: 3px var(--wf-space-sm);
+  padding: var(--wf-space-xs) var(--wf-space-sm);
   border-radius: var(--wf-radius-sm);
   font-size: var(--wf-font-size-xs);
   color: var(--wf-color-text-secondary);
@@ -2307,7 +2465,7 @@ body.wf-dragging {
   margin-top: 2px;
   font-size: var(--wf-font-size-xs);
   color: var(--wf-color-text);
-  background: var(--wf-color-primary-bg, var(--wf-color-primary-bg));
+  background: var(--wf-color-primary-bg);
   color: var(--wf-color-primary-text);
   border-radius: var(--wf-radius-sm);
   padding: 1px 4px;
@@ -2333,13 +2491,13 @@ body.wf-dragging {
 /* weifuwu/components — Card */
 
 .wf-card {
-  border-radius: var(--wf-card-radius, var(--wf-surface-radius));
+  border-radius: var(--wf-card-radius,  var(--wf-surface-radius));
   background: var(--wf-surface-bg);
   font-family: var(--wf-font-sans);
 }
 
 .wf-card--default {
-  box-shadow: var(--wf-card-shadow, var(--wf-surface-shadow));
+  box-shadow: var(--wf-card-shadow,  var(--wf-surface-shadow));
 }
 
 .wf-card--outlined {
@@ -2405,7 +2563,7 @@ body.wf-dragging {
   background: var(--wf-color-bg-secondary);
   color: var(--wf-color-text-secondary);
   cursor: pointer;
-  box-shadow: var(--wf-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.1));
+  box-shadow: var(--wf-shadow-sm);
   transition: background var(--wf-dur-fast) var(--wf-ease-out),
               color var(--wf-dur-fast) var(--wf-ease-out);
 }
@@ -2504,7 +2662,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius);
   background: var(--wf-color-bg);
   color: var(--wf-color-text);
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   font-size: var(--wf-font-size-base);
   font-family: var(--wf-font-sans);
   cursor: pointer;
@@ -2575,7 +2733,7 @@ body.wf-dragging {
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: var(--wf-space-xs);
 }
 
@@ -2583,7 +2741,7 @@ body.wf-dragging {
   display: flex;
   flex-direction: column;
   gap: 1px;
-  min-width: var(--wf-cascader-col-width, 120px);
+  min-width: var(--wf-cascader-col-width,  120px);
   max-height: 240px;
   overflow-y: auto;
 }
@@ -2601,7 +2759,7 @@ body.wf-dragging {
   text-align: left;
   border: none;
   background: none;
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   border-radius: var(--wf-radius-sm);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
@@ -2637,6 +2795,42 @@ body.wf-dragging {
   color: var(--wf-color-text-tertiary);
 }
 
+.wf-cascader-search {
+  width: 100%;
+  box-sizing: border-box;
+  margin-bottom: var(--wf-gap-xs);
+  min-height: var(--wf-field-height);
+  padding: var(--wf-control-pad-y) var(--wf-space-sm);
+  font-size: var(--wf-font-size-sm);
+}
+.wf-cascader-search-results {
+  max-height: 240px;
+  overflow-y: auto;
+  min-width: var(--wf-cascader-search-min-width, 180px);
+}
+.wf-cascader-search-item {
+  display: block;
+  width: 100%;
+  padding: var(--wf-control-pad-y) var(--wf-space-sm);
+  border: none;
+  background: none;
+  font-family: inherit;
+  font-size: var(--wf-font-size-sm);
+  color: var(--wf-color-text);
+  text-align: left;
+  cursor: pointer;
+  border-radius: var(--wf-radius-sm);
+}
+.wf-cascader-search-item:hover {
+  background: var(--wf-color-bg-hover);
+}
+.wf-cascader-empty {
+  padding: var(--wf-space-md);
+  color: var(--wf-color-text-secondary);
+  font-size: var(--wf-font-size-sm);
+  text-align: center;
+}
+
 /* weifuwu/components — Chart */
 
 .wf-chart {
@@ -2733,7 +2927,7 @@ body.wf-dragging {
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   background: var(--wf-color-bg);
 }
 
@@ -2824,7 +3018,7 @@ body.wf-dragging {
 .wf-codeblock-lang {
   display: inline-flex;
   align-items: center;
-  gap: 6px;
+  gap: var(--wf-space-sm);
 }
 
 .wf-codeblock-dot {
@@ -2970,20 +3164,31 @@ body.wf-dragging {
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
-  padding: 4px var(--wf-space-sm);
+  padding: var(--wf-space-xs) var(--wf-space-sm);
   transition: border-color var(--wf-dur-fast) var(--wf-ease-out),
-              box-shadow var(--wf-dur-fast) var(--wf-ease-out);
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out),
+              transform var(--wf-dur-fast) var(--wf-ease-out);
 }
 
 .wf-color-picker-trigger:hover {
   border-color: var(--wf-color-primary);
 }
 
+.wf-color-picker-trigger:active {
+  transform: scale(0.98);
+}
+
 .wf-color-picker-trigger:focus-visible {
   outline: none;
   box-shadow: var(--wf-focus-ring);
 }
 
+.wf-color-picker-trigger--disabled {
+  opacity: var(--wf-opacity-disabled);
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
 .wf-color-picker-swatch {
   display: inline-block;
   width: 16px;
@@ -2998,8 +3203,8 @@ body.wf-dragging {
   font-size: var(--wf-font-size-xs);
 }
 
-.wf-color-picker-trigger--sm { padding: 2px var(--wf-space-sm); font-size: var(--wf-font-size-xs); }
-.wf-color-picker-trigger--lg { padding: 6px var(--wf-space-md); font-size: var(--wf-font-size-base); }
+.wf-color-picker-trigger--sm { padding: 2px var(--wf-space-sm); font-size: var(--wf-font-size-xs); min-height: 28px; }
+.wf-color-picker-trigger--lg { padding: var(--wf-space-sm) var(--wf-space-md); font-size: var(--wf-font-size-base); min-height: 40px; }
 
 /* 弹层面板 */
 .wf-color-picker-panel {
@@ -3014,22 +3219,43 @@ body.wf-dragging {
 }
 
 .wf-color-picker-grid .wf-color-picker-swatch {
+  position: relative;
   width: 22px;
   height: 22px;
+  min-width: 22px;
+  max-width: 22px;
+  min-height: 22px;
+  max-height: 22px;
   padding: 0;
   border: none;
+  border-radius: var(--wf-radius-sm);
   cursor: pointer;
   box-shadow: 0 0 0 1px var(--wf-color-border);
-  transition: transform var(--wf-dur-fast) var(--wf-ease-out);
+  transition: transform var(--wf-dur-fast) var(--wf-ease-out),
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out);
 }
 
 .wf-color-picker-grid .wf-color-picker-swatch:hover {
   transform: scale(1.15);
 }
 
+.wf-color-picker-grid .wf-color-picker-swatch:active {
+  transform: scale(0.92);
+}
+
 .wf-color-picker-grid .wf-color-picker-swatch:focus-visible {
   outline: none;
-  box-shadow: var(--wf-focus-ring);
+  box-shadow: 0 0 0 2px var(--wf-color-primary);
+}
+
+/* 选中态：勾选图标（mix-blend 反相——任意底色恒可见，省逐色亮度计算） */
+.wf-color-picker-check {
+  position: absolute;
+  inset: 0;
+  margin: auto;
+  color: var(--wf-color-on-brand);
+  mix-blend-mode: difference; /* 白对底反相 → 浅底显黑、深底显白，对比恒 ≥ 4.5 */
+  pointer-events: none;
 }
 
 .wf-color-picker-grid .wf-color-picker-swatch--sel {
@@ -3042,11 +3268,13 @@ body.wf-dragging {
   box-sizing: border-box;
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius-sm);
-  padding: 4px var(--wf-space-sm);
+  padding: var(--wf-space-xs) var(--wf-space-sm);
   font-family: var(--wf-font-mono);
   font-size: var(--wf-font-size-xs);
   color: var(--wf-color-text);
   background: var(--wf-color-bg);
+  transition: border-color var(--wf-dur-fast) var(--wf-ease-out),
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out);
 }
 
 .wf-color-picker-input:focus {
@@ -3073,7 +3301,7 @@ body.wf-dragging {
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 16px 48px rgba(0, 0, 0, 0.2));
+  box-shadow: var(--wf-shadow-lg);
   overflow: hidden;
   font-family: var(--wf-font-sans);
   animation: wf-command-in var(--wf-dur-base) var(--wf-ease-out);
@@ -3147,7 +3375,7 @@ body.wf-dragging {
   color: var(--wf-color-text-tertiary);
   background: var(--wf-color-bg-tertiary);
   border-radius: var(--wf-radius-sm);
-  padding: 1px 6px;
+  padding: 1px var(--wf-space-sm);
   font-family: var(--wf-font-sans);
 }
 
@@ -3163,11 +3391,11 @@ body.wf-dragging {
 .wf-context-menu {
   position: fixed;
   z-index: var(--wf-z-popover);
-  min-width: var(--wf-context-menu-min-width, 160px);
+  min-width: var(--wf-context-menu-min-width,  160px);
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: var(--wf-space-xs);
   font-family: var(--wf-font-sans);
   display: flex;
@@ -3183,7 +3411,7 @@ body.wf-dragging {
   text-align: left;
   border: none;
   background: none;
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   border-radius: var(--wf-radius-sm);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
@@ -3250,8 +3478,8 @@ body.wf-dragging {
 }
 
 /* variants */
-.wf-copy-btn--ghost { background: none; padding: 4px var(--wf-space-sm); }
-.wf-copy-btn--secondary { background: var(--wf-color-bg-secondary); padding: 4px var(--wf-space-sm); }
+.wf-copy-btn--ghost { padding: 4px var(--wf-space-sm); }
+.wf-copy-btn--secondary { padding: 4px var(--wf-space-sm); }
 .wf-copy-btn--default {
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
@@ -3259,8 +3487,8 @@ body.wf-dragging {
 }
 
 /* sizes */
-.wf-copy-btn--sm { font-size: var(--wf-font-size-xs); padding: 2px var(--wf-space-xs); }
-.wf-copy-btn--lg { font-size: var(--wf-font-size-base); padding: 6px var(--wf-space-md); }
+.wf-copy-btn--sm { padding: 2px var(--wf-space-xs); }
+.wf-copy-btn--lg { padding: var(--wf-space-sm) var(--wf-space-md); }
 
 /* weifuwu/components — DatePicker */
 
@@ -3312,7 +3540,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius-md);
   box-shadow: var(--wf-shadow-md);
   padding: var(--wf-space);
-  min-width: var(--wf-datepicker-width, 260px);
+  min-width: var(--wf-datepicker-width,  260px);
   user-select: none;
   /* 面板族统一入场：wf-panel-in（scale+fade，Token 驱动） */
   animation: wf-panel-in var(--wf-dur-fast) var(--wf-ease-out);
@@ -3431,7 +3659,7 @@ body.wf-dragging {
 }
 
 .wf-datepicker-range-panel {
-  min-width: var(--wf-datepicker-time-width, 240px);
+  min-width: var(--wf-datepicker-time-width,  240px);
 }
 
 /* ── 时间选择 ── */
@@ -3444,7 +3672,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius-md);
   box-shadow: var(--wf-shadow-md);
   padding: var(--wf-space);
-  min-width: var(--wf-datepicker-range-width, 200px);
+  min-width: var(--wf-datepicker-range-width,  200px);
   user-select: none;
   animation: wf-panel-in var(--wf-dur-fast) var(--wf-ease-out);
   transform-origin: top center;
@@ -3638,7 +3866,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius-md);
   overflow: hidden;
   background: var(--wf-color-bg);
-  font-family: var(--wf-font-mono, 'SFMono-Regular', Consolas, monospace);
+  font-family: var(--wf-font-mono);
   font-size: 13px;
   line-height: 1.6;
   min-width: 0;
@@ -3690,13 +3918,13 @@ body.wf-dragging {
 }
 
 .wf-diffview-row--add {
-  background: var(--wf-color-success-bg, rgba(0, 128, 0, 0.08));
+  background: var(--wf-color-success-bg);
 }
 .wf-diffview-row--add .wf-diffview-sign {
   color: var(--wf-color-success-text);
 }
 .wf-diffview-row--remove {
-  background: var(--wf-color-error-bg, rgba(255, 0, 0, 0.06));
+  background: var(--wf-color-error-bg);
 }
 .wf-diffview-row--remove .wf-diffview-sign {
   color: var(--wf-color-error-text);
@@ -3714,7 +3942,7 @@ body.wf-dragging {
   color: var(--wf-color-text-secondary);
   font-size: 12px;
   cursor: pointer;
-  background: var(--wf-color-bg-subtle, var(--wf-color-fill));
+  background: var(--wf-color-bg-subtle);
   user-select: none;
   min-height: 28px;
 }
@@ -3792,6 +4020,8 @@ body.wf-dragging {
   position: absolute;
   inset: 0;
   background: var(--wf-overlay);
+  backdrop-filter: blur(var(--wf-overlay-blur));
+  -webkit-backdrop-filter: blur(var(--wf-overlay-blur));
 }
 
 .wf-drawer--enter .wf-drawer-overlay {
@@ -3816,11 +4046,11 @@ body.wf-dragging {
   position: relative;
   display: flex;
   flex-direction: column;
-  width: var(--wf-drawer-width, 360px);
+  width: var(--wf-drawer-width,  360px);
   max-width: 100vw;
   height: 100%;
   background: var(--wf-color-bg);
-  box-shadow: var(--wf-shadow-lg, 0 4px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
 }
 
 .wf-drawer--enter .wf-drawer-panel {
@@ -3872,7 +4102,7 @@ body.wf-dragging {
   align-items: center;
   justify-content: space-between;
   padding: var(--wf-space-md);
-  border-bottom: var(--wf-border-width, 1px) solid var(--wf-color-border);
+  border-bottom: var(--wf-border-width) solid var(--wf-color-border);
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-lg);
   font-weight: var(--wf-font-weight-semibold);
@@ -3909,7 +4139,7 @@ body.wf-dragging {
   justify-content: flex-end;
   gap: var(--wf-gap-sm);
   padding: var(--wf-space-md);
-  border-top: var(--wf-border-width, 1px) solid var(--wf-color-border);
+  border-top: var(--wf-border-width) solid var(--wf-color-border);
 }
 
 /* 移动端适配（P2）：小屏抽屉全宽（底部安全区） */
@@ -3928,7 +4158,7 @@ body.wf-dragging {
 
 .wf-dropdown-menu {
   position: fixed;
-  min-width: var(--wf-dropdown-min-width, 140px);
+  min-width: var(--wf-dropdown-min-width,  140px);
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
@@ -4001,7 +4231,7 @@ body.wf-dragging {
 .wf-editor--disabled {
   opacity: var(--wf-opacity-disabled);
   cursor: not-allowed;
-  background: var(--wf-color-bg-secondary, #f9fafb);
+  background: var(--wf-color-bg-secondary);
 }
 
 /* ── 工具栏 ────────────────────────────────────────── */
@@ -4012,7 +4242,7 @@ body.wf-dragging {
   gap: 2px;
   padding: var(--wf-space-xs) var(--wf-space-sm);
   border-bottom: var(--wf-border-width) solid var(--wf-color-border);
-  background: var(--wf-color-bg-secondary, #f9fafb);
+  background: var(--wf-color-bg-secondary);
   flex-wrap: wrap;
   user-select: none;
 }
@@ -4025,17 +4255,17 @@ body.wf-dragging {
   height: 32px;
   padding: 0 var(--wf-space-xs);
   border: none;
-  border-radius: var(--wf-radius-sm, 4px);
+  border-radius: var(--wf-radius-sm);
   background: transparent;
   color: var(--wf-color-text);
   font-size: var(--wf-font-size-sm);
-  font-weight: var(--wf-font-weight-semibold, 600);
+  font-weight: var(--wf-font-weight-semibold);
   cursor: pointer;
   transition: background 0.15s;
 }
 
 .wf-editor-tb-btn:hover {
-  background: var(--wf-color-bg-tertiary, #e5e7eb);
+  background: var(--wf-color-bg-tertiary);
 }
 
 .wf-editor-tb-btn--active {
@@ -4044,7 +4274,7 @@ body.wf-dragging {
 }
 
 .wf-editor-tb-btn--active:hover {
-  background: var(--wf-color-primary-bg, #bae6fd);
+  background: var(--wf-color-primary-bg);
 }
 
 .wf-editor-tb-btn--link {
@@ -4084,22 +4314,22 @@ body.wf-dragging {
 
 /* 编辑区内部元素样式 */
 .wf-editor-content h1 {
-  font-size: var(--wf-font-size-2xl, 1.5rem);
-  font-weight: var(--wf-font-weight-bold, 700);
+  font-size: var(--wf-font-size-2xl);
+  font-weight: var(--wf-font-weight-bold);
   margin: 0.5em 0 0.25em;
   line-height: 1.3;
 }
 
 .wf-editor-content h2 {
-  font-size: var(--wf-font-size-xl, 1.25rem);
-  font-weight: var(--wf-font-weight-bold, 700);
+  font-size: var(--wf-font-size-xl);
+  font-weight: var(--wf-font-weight-bold);
   margin: 0.5em 0 0.25em;
   line-height: 1.3;
 }
 
 .wf-editor-content h3 {
-  font-size: var(--wf-font-size-lg, 1.125rem);
-  font-weight: var(--wf-font-weight-semibold, 600);
+  font-size: var(--wf-font-size-lg);
+  font-weight: var(--wf-font-weight-semibold);
   margin: 0.4em 0 0.2em;
   line-height: 1.3;
 }
@@ -4123,7 +4353,7 @@ body.wf-dragging {
   margin: 0.5em 0;
   padding: var(--wf-space-xs) var(--wf-space);
   border-left: 3px solid var(--wf-color-primary);
-  background: var(--wf-color-bg-secondary, #f9fafb);
+  background: var(--wf-color-bg-secondary);
   color: var(--wf-color-text-secondary);
   font-style: italic;
 }
@@ -4151,11 +4381,11 @@ body.wf-dragging {
   padding: var(--wf-control-pad-y) var(--wf-space);
   border: none;
   outline: none;
-  font-family: var(--wf-font-mono, 'SF Mono', 'Fira Code', 'Consolas', monospace);
+  font-family: var(--wf-font-mono);
   font-size: var(--wf-font-size-sm);
   line-height: 1.6;
   color: var(--wf-color-text);
-  background: var(--wf-color-bg-secondary, #f9fafb);
+  background: var(--wf-color-bg-secondary);
   resize: vertical;
   tab-size: 2;
 }
@@ -4192,7 +4422,7 @@ body.wf-dragging {
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  gap: 6px;
+  gap: var(--wf-space-xs);
   padding: var(--wf-space-lg) var(--wf-space);
   cursor: pointer;
   text-align: center;
@@ -4219,7 +4449,7 @@ body.wf-dragging {
 .wf-editor-content img {
   max-width: 100%;
   height: auto;
-  border-radius: var(--wf-radius-sm, 4px);
+  border-radius: var(--wf-radius-sm);
   margin: 0.5em 0;
 }
 
@@ -4241,7 +4471,7 @@ body.wf-dragging {
 }
 
 .wf-editor-table tbody tr:nth-child(even) {
-  background: var(--wf-color-bg-secondary, #f9fafb);
+  background: var(--wf-color-bg-secondary);
 }
 
 /* ── 表格选择网格 ──────────────────────────────────── */
@@ -4253,7 +4483,7 @@ body.wf-dragging {
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
   padding: var(--wf-space-sm);
-  box-shadow: var(--wf-shadow-lg, 0 4px 12px rgba(0,0,0,0.12));
+  box-shadow: var(--wf-shadow-lg);
   /* 定位在工具栏下方 */
 }
 
@@ -4280,7 +4510,7 @@ body.wf-dragging {
 
 .wf-editor-table-grid-cell:hover,
 .wf-editor-table-grid-cell--active {
-  background: var(--wf-color-primary-bg, #e0f2fe);
+  background: var(--wf-color-primary-bg);
   border-color: var(--wf-color-primary);
 }
 
@@ -4402,7 +4632,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius);
   background: var(--wf-color-bg-secondary);
   cursor: pointer;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   min-height: 120px;
 }
 
@@ -4527,7 +4757,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius-sm);
   color: var(--wf-color-text-tertiary);
   cursor: pointer;
-  line-height: 0; padding: 0; flex-shrink: 0;
+ padding: 0; flex-shrink: 0;
 }
 
 .wf-upload-item-remove:hover {
@@ -4556,7 +4786,7 @@ body.wf-dragging {
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 6px;
+  gap: var(--wf-space-xs);
   width: 44px;
   height: 44px;
   min-width: 44px;
@@ -4565,23 +4795,23 @@ body.wf-dragging {
   border: none;
   border-radius: 50%;
   background: var(--wf-color-primary);
-  color: var(--wf-color-on-brand, #fff);
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+  color: var(--wf-color-on-brand);
+  box-shadow: var(--wf-shadow-lg);
   cursor: pointer;
-  z-index: var(--wf-z-sticky, 40);
+  z-index: var(--wf-z-sticky);
   font-family: var(--wf-font-sans);
   font-size: 16px;
-  transition: transform var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease),
-              background var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: transform var(--wf-dur-fast) var(--wf-ease-standard),
+              background var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-float-btn:hover {
   transform: scale(1.05);
-  background: var(--wf-color-primary, #1668dc);
+  background: var(--wf-color-primary);
 }
 
 .wf-float-btn--disabled {
-  background: var(--wf-color-text-disabled, #bfbfbf);
+  background: var(--wf-color-text-disabled);
   cursor: not-allowed;
   opacity: 0.7;
 }
@@ -4597,10 +4827,10 @@ body.wf-dragging {
   right: -4px;
   min-width: 18px;
   height: 18px;
-  padding: 0 5px;
+  padding: 0 var(--wf-space-xs);
   border-radius: 50%;
   background: var(--wf-color-error);
-  color: var(--wf-color-on-brand, #fff);
+  color: var(--wf-color-on-brand);
   font-size: 11px;
   line-height: 18px;
   text-align: center;
@@ -4609,7 +4839,7 @@ body.wf-dragging {
 /* ── 组模式 ── */
 .wf-float-group {
   position: fixed;
-  z-index: var(--wf-z-sticky, 40);
+  z-index: var(--wf-z-sticky);
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -4624,11 +4854,11 @@ body.wf-dragging {
 .wf-float-group-items {
   display: flex;
   flex-direction: column;
-  gap: 10px;
+  gap: var(--wf-space-sm);
 }
 
 .wf-float-group-item {
-  animation: wf-float-item-in var(--wf-dur-md, 0.2s) var(--wf-ease-standard, ease);
+  animation: wf-float-item-in var(--wf-dur-md) var(--wf-ease-standard);
 }
 
 @keyframes wf-float-item-in {
@@ -4648,16 +4878,16 @@ body.wf-dragging {
   border: none;
   border-radius: 50%;
   background: var(--wf-color-primary);
-  color: var(--wf-color-on-brand, #fff);
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+  color: var(--wf-color-on-brand);
+  box-shadow: var(--wf-shadow-lg);
   cursor: pointer;
-  font-size: var(--wf-font-size-xl, 20px);
+  font-size: var(--wf-font-size-xl);
   font-family: var(--wf-font-sans);
 }
 
 .wf-float-group-icon {
   display: inline-block;
-  transition: transform var(--wf-dur-md, 0.2s) var(--wf-ease-standard, ease);
+  transition: transform var(--wf-dur-md) var(--wf-ease-standard);
 }
 
 .wf-float-group-icon.is-open {
@@ -4667,7 +4897,7 @@ body.wf-dragging {
 /* 组内子项：不 fixed（由 group 容器排列） */
 .wf-float-btn--static {
   position: static;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  box-shadow: var(--wf-shadow-md);
 }
 
 /* weifuwu/components — Form */
@@ -4720,7 +4950,7 @@ body.wf-dragging {
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: var(--wf-space-md);
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
@@ -4815,11 +5045,11 @@ body.wf-dragging {
   align-items: center;
   justify-content: center;
   min-height: 100px;
-  background: var(--wf-color-bg-secondary, #f9fafb);
-  border-radius: var(--wf-radius-md, 8px);
-  border: 1px dashed var(--wf-color-border, #e5e7eb);
-  color: var(--wf-color-text-tertiary, #9ca3af);
-  font-size: var(--wf-font-size-sm, 13px);
+  background: var(--wf-color-bg-secondary);
+  border-radius: var(--wf-radius-md);
+  border: 1px dashed var(--wf-color-border);
+  color: var(--wf-color-text-tertiary);
+  font-size: var(--wf-font-size-sm);
 }
 
 .wf-inview-placeholder::after {
@@ -4855,17 +5085,23 @@ body.wf-dragging {
 .wf-input {
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
-  min-height: var(--wf-field-height, var(--wf-control-height));
+  min-height: var(--wf-field-height);
   padding: var(--wf-control-pad-y) var(--wf-space);
   border: var(--wf-border-width) solid var(--wf-color-border);
-  border-radius: var(--wf-field-radius, var(--wf-radius));
+  border-radius: var(--wf-field-radius);
   background: var(--wf-color-bg);
   color: var(--wf-color-text);
   outline: none;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-dur-fast) var(--wf-ease-out),
+              box-shadow var(--wf-dur-fast) var(--wf-ease-out),
+              background-color var(--wf-dur-fast) var(--wf-ease-out);
   width: 100%;
 }
 
+.wf-input:hover:not(:disabled) {
+  border-color: var(--wf-color-border-dark);
+}
+
 .wf-input:focus {
   border-color: var(--wf-color-primary);
   box-shadow: var(--wf-focus-ring);
@@ -4953,7 +5189,7 @@ body.wf-dragging {
   cursor: pointer;
   padding: 0;
   line-height: 1;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
 }
 
 .wf-input-number-step:hover {
@@ -4999,7 +5235,7 @@ body.wf-dragging {
   box-shadow: 0 0 0 2px var(--wf-color-primary-bg);
 }
 
-.wf-inputnumber--err { border-color: var(--wf-color-error-text); }
+.wf-inputnumber--err { border-color: var(--wf-color-error); box-shadow: 0 0 0 2px var(--wf-color-error-bg); }
 .wf-inputnumber--disabled { opacity: 0.6; }
 
 .wf-inputnumber-input {
@@ -5030,7 +5266,7 @@ body.wf-dragging {
   border: none;
   cursor: pointer;
   color: var(--wf-color-text-secondary);
-  padding: 2px 6px;
+  padding: 2px var(--wf-space-sm);
   min-height: 18px;
 }
 .wf-inputnumber-btn:hover { background: var(--wf-color-bg-secondary); color: var(--wf-color-text); }
@@ -5108,7 +5344,7 @@ body.wf-dragging {
   background: none;
   color: var(--wf-color-text-tertiary);
   cursor: pointer;
-  line-height: 0; padding: 0; flex-shrink: 0;
+ padding: 0; flex-shrink: 0;
 }
 
 .wf-json-toggle:hover {
@@ -5142,7 +5378,7 @@ body.wf-dragging {
   background: none;
   color: var(--wf-color-text-tertiary);
   cursor: pointer;
-  line-height: 0; padding: 0; flex-shrink: 0;
+ padding: 0; flex-shrink: 0;
   opacity: 0;
 }
 
@@ -5207,7 +5443,7 @@ body.wf-dragging {
   flex: 1 1 220px;
   min-width: var(--wf-kanban-col-min-width);
   max-width: var(--wf-kanban-col-max-width);
-  background: var(--wf-color-bg-subtle, var(--wf-color-fill));
+  background: var(--wf-color-bg-subtle);
   border-radius: var(--wf-radius-md);
   border: 1px solid var(--wf-color-border);
   display: flex;
@@ -5223,7 +5459,7 @@ body.wf-dragging {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 10px 12px;
+  padding: var(--wf-space-sm) 12px;
   font-weight: 600;
   font-size: 13px;
 }
@@ -5247,7 +5483,7 @@ body.wf-dragging {
   background: var(--wf-color-bg);
   border: 1px solid var(--wf-color-border);
   border-radius: var(--wf-radius-sm);
-  padding: 10px 12px;
+  padding: var(--wf-space-sm) 12px;
   cursor: grab;
   display: flex;
   align-items: center;
@@ -5276,9 +5512,9 @@ body.wf-dragging {
 .wf-kanban-tag {
   font-size: 11px;
   color: var(--wf-color-primary-text);
-  background: var(--wf-color-primary-bg, rgba(79, 110, 247, 0.12));
+  background: var(--wf-color-primary-bg);
   border-radius: var(--wf-radius-xs);
-  padding: 1px 6px;
+  padding: 1px var(--wf-space-sm);
   flex-shrink: 0;
 }
 
@@ -5307,7 +5543,7 @@ body.wf-dragging {
   display: flex;
   width: 100%;
   min-height: 100%;
-  background: var(--wf-color-bg, #f5f5f5);
+  background: var(--wf-color-bg);
   color: var(--wf-color-text);
   font-family: var(--wf-font-sans);
 }
@@ -5327,13 +5563,13 @@ body.wf-dragging {
   flex-shrink: 0;
   height: 100vh;
   overflow: hidden;
-  background: var(--wf-color-bg-secondary, #fff);
-  border-right: var(--wf-border-width, 1px) solid var(--wf-color-border);
-  transition: width var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  background: var(--wf-color-bg-secondary);
+  border-right: var(--wf-border-width) solid var(--wf-color-border);
+  transition: width var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-layout-sider--collapsed {
-  border-right: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  border-right: var(--wf-border-width) solid var(--wf-color-border-light);
 }
 
 .wf-layout-sider-body {
@@ -5351,21 +5587,21 @@ body.wf-dragging {
   height: 40px;
   flex-shrink: 0;
   border: none;
-  border-top: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  border-top: var(--wf-border-width) solid var(--wf-color-border-light);
   background: transparent;
   color: var(--wf-color-text-secondary);
   cursor: pointer;
   font-size: 12px;
-  transition: background var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: background var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-layout-sider-trigger:hover {
-  background: var(--wf-color-bg-hover, rgba(0, 0, 0, 0.04));
+  background: var(--wf-color-bg-hover);
 }
 
 .wf-layout-sider-trigger-icon {
   display: inline-block;
-  transition: transform var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: transform var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-layout-sider-trigger-icon.is-collapsed {
@@ -5376,12 +5612,12 @@ body.wf-dragging {
 .wf-layout-header {
   display: flex;
   align-items: center;
-  gap: var(--wf-gap-md, 16px);
-  height: var(--wf-layout-header-height, 56px);
-  padding: 0 var(--wf-space-md, 16px);
+  gap: var(--wf-gap-md);
+  height: var(--wf-layout-header-height);
+  padding: 0 var(--wf-space-md);
   flex-shrink: 0;
-  background: var(--wf-color-bg-secondary, #fff);
-  border-bottom: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  background: var(--wf-color-bg-secondary);
+  border-bottom: var(--wf-border-width) solid var(--wf-color-border-light);
 }
 
 /* ── 主内容区 ── */
@@ -5389,18 +5625,18 @@ body.wf-dragging {
   flex: 1;
   min-height: 0;
   overflow: auto;
-  padding: var(--wf-space-md, 16px);
+  padding: var(--wf-space-md);
 }
 
 /* ── 底部栏 ── */
 .wf-layout-footer {
-  padding: var(--wf-space-md, 16px);
+  padding: var(--wf-space-md);
   flex-shrink: 0;
   text-align: center;
   color: var(--wf-color-text-secondary);
-  font-size: var(--wf-font-size-sm, 13px);
-  background: var(--wf-color-bg-secondary, #fff);
-  border-top: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  font-size: var(--wf-font-size-sm);
+  background: var(--wf-color-bg-secondary);
+  border-top: var(--wf-border-width) solid var(--wf-color-border-light);
 }
 
 /* weifuwu/components — Link 文字链接 */
@@ -5411,15 +5647,15 @@ body.wf-dragging {
   gap: 4px;
   text-decoration: underline;
   text-underline-offset: 3px;
-  color: var(--wf-color-primary, #1668dc);
+  color: var(--wf-color-primary-text);
   cursor: pointer;
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 13px);
-  transition: color var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  font-size: var(--wf-font-size-sm);
+  transition: color var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-link:hover {
-  color: var(--wf-color-primary, #1668dc);
+  color: var(--wf-color-primary-text);
 }
 
 .wf-link--default {
@@ -5430,14 +5666,14 @@ body.wf-dragging {
 }
 
 .wf-link--danger {
-  color: var(--wf-color-error-text, #cf1322);
+  color: var(--wf-color-error-text);
 }
 .wf-link--danger:hover {
-  color: var(--wf-color-error-text, #a8071a);
+  color: var(--wf-color-error-text);
 }
 
 .wf-link--muted {
-  color: var(--wf-color-text-tertiary, #999);
+  color: var(--wf-color-text-tertiary);
   text-decoration: none;
 }
 .wf-link--muted:hover {
@@ -5449,7 +5685,7 @@ body.wf-dragging {
 }
 
 .wf-link--disabled {
-  color: var(--wf-color-text-disabled, #bfbfbf);
+  color: var(--wf-color-text-disabled);
   cursor: not-allowed;
   text-decoration: none;
   pointer-events: none;
@@ -5560,7 +5796,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius-sm);
   color: var(--wf-color-text-secondary);
   cursor: pointer;
-  line-height: 0; padding: 0; flex-shrink: 0;
+ padding: 0; flex-shrink: 0;
 }
 
 .wf-log-copy:hover {
@@ -5686,6 +5922,54 @@ body.wf-dragging {
   margin: var(--wf-space-md) 0;
 }
 
+/* GFM 删除线 */
+.wf-md-del {
+  text-decoration: line-through;
+  color: var(--wf-color-text-secondary);
+}
+
+/* GFM 任务列表 */
+.wf-md-task-list {
+  list-style: none;
+  padding-left: var(--wf-space-xs);
+}
+.wf-md-task {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--wf-gap-xs);
+}
+.wf-md-task-check {
+  margin-top: 4px;
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
+  accent-color: var(--wf-color-primary);
+  cursor: default;
+}
+
+/* GFM 表格 */
+.wf-md-table-wrap {
+  overflow-x: auto;
+  margin: var(--wf-space-sm) 0;
+}
+.wf-md-table {
+  border-collapse: collapse;
+  width: 100%;
+  font-size: var(--wf-font-size-sm);
+}
+.wf-md-th,
+.wf-md-td {
+  border: var(--wf-border-width) solid var(--wf-color-border);
+  padding: var(--wf-space-xs) var(--wf-space-sm);
+}
+.wf-md-th {
+  background: var(--wf-color-bg-secondary);
+  font-weight: var(--wf-font-weight-semibold);
+}
+.wf-md-tr:nth-child(even) .wf-md-td {
+  background: var(--wf-color-bg-secondary);
+}
+
 /* weifuwu/components — Mentions */
 
 .wf-mentions {
@@ -5700,7 +5984,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius);
   background: var(--wf-color-bg);
   color: var(--wf-color-text);
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-base);
   line-height: 1.5;
@@ -5720,19 +6004,19 @@ body.wf-dragging {
   cursor: not-allowed;
 }
 
-.wf-mentions-input--sm { font-size: var(--wf-font-size-sm); padding: 4px var(--wf-space-sm); }
-.wf-mentions-input--lg { font-size: var(--wf-font-size-lg); padding: 8px var(--wf-space-md); }
+.wf-mentions-input--sm { padding: 4px var(--wf-space-sm); }
+.wf-mentions-input--lg { padding: 8px var(--wf-space-md); }
 
 .wf-mentions-panel {
   position: fixed;
   z-index: var(--wf-z-popover);
-  min-width: var(--wf-mentions-min-width, 160px);
+  min-width: var(--wf-mentions-min-width,  160px);
   max-height: 220px;
   overflow-y: auto;
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: var(--wf-space-xs);
   display: flex;
   flex-direction: column;
@@ -5745,7 +6029,7 @@ body.wf-dragging {
   text-align: left;
   border: none;
   background: none;
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   border-radius: var(--wf-radius-sm);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
@@ -5916,6 +6200,32 @@ body.wf-dragging {
   outline-offset: -2px;
 }
 
+/* 折叠态子菜单浮层（roadmap DO：折叠时图标点击弹出） */
+.wf-menu-submenu--collapsed {
+  position: relative;
+}
+.wf-menu-submenu-title--collapsed {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: var(--wf-space) 0;
+}
+.wf-menu-popup {
+  min-width: var(--wf-menu-popup-min-width, 160px);
+  background: var(--wf-color-bg);
+  border: var(--wf-border-width) solid var(--wf-color-border);
+  border-radius: var(--wf-radius-md);
+  box-shadow: var(--wf-shadow-lg);
+  padding: var(--wf-space-xs);
+  z-index: var(--wf-z-popover);
+  animation: wf-menu-popup-in var(--wf-dur-fast) var(--wf-ease-out);
+}
+@keyframes wf-menu-popup-in {
+  from { opacity: 0; transform: translateY(-4px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
 /* weifuwu/components — Menubar */
 
 .wf-menubar {
@@ -5960,11 +6270,11 @@ body.wf-dragging {
 .wf-menubar-panel {
   position: fixed;
   z-index: var(--wf-z-popover);
-  min-width: var(--wf-menubar-min-width, 160px);
+  min-width: var(--wf-menubar-min-width,  160px);
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: var(--wf-space-xs);
   display: flex;
   flex-direction: column;
@@ -5980,7 +6290,7 @@ body.wf-dragging {
   text-align: left;
   border: none;
   background: none;
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   border-radius: var(--wf-radius-sm);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
@@ -6012,7 +6322,7 @@ body.wf-dragging {
   color: var(--wf-color-text-tertiary);
   background: var(--wf-color-bg-tertiary);
   border-radius: var(--wf-radius-sm);
-  padding: 1px 6px;
+  padding: 1px var(--wf-space-sm);
   font-family: var(--wf-font-sans);
 }
 
@@ -6027,12 +6337,13 @@ body.wf-dragging {
 .wf-bubble--streaming {
   border-right: 3px solid var(--wf-color-primary);
   border-right-color: var(--wf-color-primary);
-  animation: wf-bubble-blink var(--wf-dur-fast) var(--wf-ease-in-out) infinite;
+  /* 1s 光标式平缓闪烁（≤1Hz，远低于 3Hz 光敏阈值）；reduced-motion 下基线降为 0.01ms */
+  animation: wf-bubble-blink 1.1s var(--wf-ease-in-out) infinite;
 }
 
 @keyframes wf-bubble-blink {
   0%, 100% { border-right-color: var(--wf-color-primary); }
-  50% { border-right-color: transparent; }
+  50% { border-right-color: var(--wf-color-primary-bg); }
 }
 
 .wf-bubble-body {
@@ -6058,41 +6369,63 @@ body.wf-dragging {
   z-index: var(--wf-z-modal);
 }
 
-.wf-modal--enter {
-  animation: wf-modal-fadein var(--wf-dur-base) var(--wf-ease-out);
+.wf-modal--enter .wf-modal-overlay {
+  animation: wf-modal-overlay-fadein var(--wf-dur-base) var(--wf-ease-out);
 }
 
-.wf-modal--exit {
-  animation: wf-modal-fadeout var(--wf-dur-base) var(--wf-ease-in) forwards;
+.wf-modal--exit .wf-modal-overlay {
+  animation: wf-modal-overlay-fadeout var(--wf-dur-base) var(--wf-ease-in) forwards;
 }
 
-@keyframes wf-modal-fadein {
+@keyframes wf-modal-overlay-fadein {
   from { opacity: 0; }
   to   { opacity: 1; }
 }
 
-@keyframes wf-modal-fadeout {
+@keyframes wf-modal-overlay-fadeout {
   from { opacity: 1; }
   to   { opacity: 0; }
 }
 
+/* 内容独立动画（不随遮罩 opacity，避免父级 opacity 过渡延迟 backdrop-filter） */
+.wf-modal--enter .wf-modal-content {
+  animation: wf-modal-pop var(--wf-dur-base) var(--wf-ease-out);
+}
+
+.wf-modal--exit .wf-modal-content {
+  animation: wf-modal-unpop var(--wf-dur-base) var(--wf-ease-in) forwards;
+}
+
+@keyframes wf-modal-pop {
+  from { opacity: 0; transform: scale(0.96); }
+  to   { opacity: 1; transform: scale(1); }
+}
+
+@keyframes wf-modal-unpop {
+  from { opacity: 1; transform: scale(1); }
+  to   { opacity: 0; transform: scale(0.96); }
+}
+
 .wf-modal-overlay {
   position: fixed;
   inset: 0;
   background: var(--wf-overlay);
+  backdrop-filter: blur(var(--wf-overlay-blur));
+  -webkit-backdrop-filter: blur(var(--wf-overlay-blur));
   z-index: -1;
 }
 
 .wf-modal-content {
   background: var(--wf-color-bg);
-  border-radius: var(--wf-modal-radius, var(--wf-radius-md));
-  box-shadow: var(--wf-modal-shadow, var(--wf-shadow-lg));
-  min-width: var(--wf-modal-width, 400px);
+  border-radius: var(--wf-modal-radius,  var(--wf-radius-md));
+  box-shadow: var(--wf-modal-shadow,  var(--wf-shadow-lg));
+  min-width: var(--wf-modal-width,  400px);
   max-width: 90vw;
   max-height: 80vh;
   display: flex;
   flex-direction: column;
   z-index: 1;
+  transform-origin: center;
 }
 
 .wf-modal-header {
@@ -6135,7 +6468,7 @@ body.wf-dragging {
 /* ── 移动端适配（P2）：min-width 视口 clamp（修 375px 屏 400px 溢出）+ 小屏 bottom-sheet ── */
 
 .wf-modal-content {
-  min-width: min(var(--wf-modal-width, 400px), calc(100vw - 32px));
+  min-width: min(var(--wf-modal-width,  400px), calc(100vw - 32px));
 }
 
 @media (max-width: 639px) {
@@ -6157,11 +6490,11 @@ body.wf-dragging {
   display: flex;
   align-items: center;
   gap: 2px;
-  padding: 0 var(--wf-space-md, 16px);
-  background: var(--wf-color-bg-secondary, #fff);
-  border-bottom: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  padding: 0 var(--wf-space-md);
+  background: var(--wf-color-bg-secondary);
+  border-bottom: var(--wf-border-width) solid var(--wf-color-border-light);
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 13px);
+  font-size: var(--wf-font-size-sm);
   min-height: 48px;
 }
 
@@ -6169,27 +6502,27 @@ body.wf-dragging {
   position: relative;
   display: inline-flex;
   align-items: center;
-  gap: 6px;
-  padding: 8px 14px;
-  border-radius: var(--wf-surface-radius, 8px);
+  gap: var(--wf-space-sm);
+  padding: 8px var(--wf-space-md);
+  border-radius: var(--wf-surface-radius);
   color: var(--wf-color-text-secondary);
   cursor: pointer;
-  transition: background var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease),
-              color var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: background var(--wf-dur-fast) var(--wf-ease-standard),
+              color var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-navmenu-item:hover {
-  background: var(--wf-color-bg-hover, rgba(0, 0, 0, 0.04));
+  background: var(--wf-color-bg-hover);
   color: var(--wf-color-text);
 }
 
 .wf-navmenu-item--active {
-  color: var(--wf-color-primary, #1668dc);
+  color: var(--wf-color-primary-text);
   font-weight: 600;
 }
 
 .wf-navmenu-item--disabled {
-  color: var(--wf-color-text-disabled, #bfbfbf);
+  color: var(--wf-color-text-disabled);
   cursor: not-allowed;
 }
 
@@ -6203,14 +6536,14 @@ body.wf-dragging {
   position: absolute;
   top: calc(100% + 6px);
   left: 0;
-  min-width: var(--wf-navmenu-min-width, 160px);
-  padding: 6px;
-  border-radius: var(--wf-surface-radius, 8px);
-  background: var(--wf-surface-bg, #fff);
-  box-shadow: var(--wf-surface-shadow, 0 4px 16px rgba(0, 0, 0, 0.12));
-  border: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
-  z-index: var(--wf-z-dropdown, 120);
-  animation: wf-navmenu-in var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  min-width: var(--wf-navmenu-min-width);
+  padding: var(--wf-space-sm);
+  border-radius: var(--wf-surface-radius);
+  background: var(--wf-surface-bg);
+  box-shadow: var(--wf-surface-shadow);
+  border: var(--wf-border-width) solid var(--wf-color-border-light);
+  z-index: var(--wf-z-dropdown);
+  animation: wf-navmenu-in var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 @keyframes wf-navmenu-in {
@@ -6225,36 +6558,36 @@ body.wf-dragging {
   justify-content: space-between;
   gap: 12px;
   padding: 8px 12px;
-  border-radius: var(--wf-radius, 6px);
+  border-radius: var(--wf-radius);
   color: var(--wf-color-text);
   cursor: pointer;
   white-space: nowrap;
-  transition: background var(--wf-dur-fast, 0.15s) var(--wf-ease-standard, ease);
+  transition: background var(--wf-dur-fast) var(--wf-ease-standard);
 }
 
 .wf-navmenu-sub-item:hover {
-  background: var(--wf-color-bg-hover, rgba(0, 0, 0, 0.04));
+  background: var(--wf-color-bg-hover);
 }
 
 .wf-navmenu-sub-item--disabled {
-  color: var(--wf-color-text-disabled, #bfbfbf);
+  color: var(--wf-color-text-disabled);
   cursor: not-allowed;
 }
 
 .wf-navmenu-sub-arrow {
-  color: var(--wf-color-text-tertiary, #999);
+  color: var(--wf-color-text-tertiary);
 }
 
 .wf-navmenu-sub-nested {
   position: absolute;
   top: -6px;
   left: calc(100% + 4px);
-  min-width: var(--wf-navmenu-min-width, 160px);
-  padding: 6px;
-  border-radius: var(--wf-surface-radius, 8px);
-  background: var(--wf-surface-bg, #fff);
-  box-shadow: var(--wf-surface-shadow, 0 4px 16px rgba(0, 0, 0, 0.12));
-  border: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  min-width: var(--wf-navmenu-min-width);
+  padding: var(--wf-space-sm);
+  border-radius: var(--wf-surface-radius);
+  background: var(--wf-surface-bg);
+  box-shadow: var(--wf-surface-shadow);
+  border: var(--wf-border-width) solid var(--wf-color-border-light);
 }
 
 /* weifuwu/components — Notification */
@@ -6281,7 +6614,7 @@ body.wf-dragging {
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-left-width: 3px;
   border-radius: var(--wf-radius);
-  box-shadow: var(--wf-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: var(--wf-space) var(--wf-space-md);
   pointer-events: auto;
   font-family: var(--wf-font-sans);
@@ -6429,7 +6762,7 @@ body.wf-dragging {
   cursor: pointer;
   font-family: inherit;
   font-size: inherit;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
 }
 
 .wf-page-btn:hover:not(:disabled):not(.wf-page-btn--active) {
@@ -6492,7 +6825,7 @@ body.wf-dragging {
   border: none;
   cursor: pointer;
   color: var(--wf-color-text-tertiary);
-  padding: 6px;
+  padding: var(--wf-space-sm);
   border-radius: var(--wf-radius-xs);
 }
 .wf-password-eye:hover { color: var(--wf-color-text-secondary); }
@@ -6559,7 +6892,7 @@ body.wf-dragging {
 .wf-pipeline-node {
   position: absolute;
   transform: translate(-50%, -50%);
-  padding: 8px 14px;
+  padding: 8px var(--wf-space-md);
   min-width: 72px;
   max-width: 120px;
   text-align: center;
@@ -6572,23 +6905,23 @@ body.wf-dragging {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  box-shadow: var(--wf-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.08));
+  box-shadow: var(--wf-shadow-sm);
 }
 
 .wf-pipeline-node--success {
   border-color: var(--wf-color-success-text);
   color: var(--wf-color-success-text);
-  background: var(--wf-color-success-bg, rgba(20, 83, 45, 0.06));
+  background: var(--wf-color-success-bg);
 }
 .wf-pipeline-node--running {
   border-color: var(--wf-color-primary);
   color: var(--wf-color-primary-text);
-  background: var(--wf-color-primary-bg, rgba(79, 110, 247, 0.08));
+  background: var(--wf-color-primary-bg);
 }
 .wf-pipeline-node--error {
   border-color: var(--wf-color-error-text);
   color: var(--wf-color-error-text);
-  background: var(--wf-color-error-bg, rgba(255, 0, 0, 0.06));
+  background: var(--wf-color-error-bg);
 }
 .wf-pipeline-node--pending {
   border-color: var(--wf-color-border);
@@ -6614,15 +6947,15 @@ body.wf-dragging {
 
 .wf-popconfirm {
   position: fixed;
-  z-index: var(--wf-z-popover, 120);
-  min-width: var(--wf-popconfirm-min-width, 180px);
-  padding: var(--wf-space-sm, 12px);
-  border-radius: var(--wf-surface-radius, 8px);
-  background: var(--wf-surface-bg, #fff);
-  box-shadow: var(--wf-surface-shadow, 0 4px 16px rgba(0, 0, 0, 0.12));
-  border: var(--wf-border-width, 1px) solid var(--wf-color-border-light);
+  z-index: var(--wf-z-popover);
+  min-width: var(--wf-popconfirm-min-width,  180px);
+  padding: var(--wf-space-sm);
+  border-radius: var(--wf-surface-radius);
+  background: var(--wf-surface-bg);
+  box-shadow: var(--wf-surface-shadow);
+  border: var(--wf-border-width) solid var(--wf-color-border-light);
   font-family: var(--wf-font-sans);
-  font-size: var(--wf-font-size-sm, 13px);
+  font-size: var(--wf-font-size-sm);
 }
 
 .wf-popconfirm--bottom { transform: translateX(-50%); }
@@ -6631,11 +6964,11 @@ body.wf-dragging {
 .wf-popconfirm--right { transform: translateY(-50%); }
 
 .wf-popconfirm--enter {
-  animation: wf-popconfirm-in var(--wf-dur-md, 0.2s) var(--wf-ease-standard, ease);
+  animation: wf-popconfirm-in var(--wf-dur-md) var(--wf-ease-standard);
 }
 
 .wf-popconfirm--exit {
-  animation: wf-popconfirm-out var(--wf-dur-md, 0.2s) var(--wf-ease-standard, ease) forwards;
+  animation: wf-popconfirm-out var(--wf-dur-md) var(--wf-ease-standard) forwards;
 }
 
 /* 入场/退场只 fade（opacity）——transform 由定位类独占：
@@ -6654,8 +6987,8 @@ body.wf-dragging {
 .wf-popconfirm-title {
   display: flex;
   align-items: flex-start;
-  gap: var(--wf-gap-xs, 8px);
-  margin-bottom: var(--wf-space-xs, 8px);
+  gap: var(--wf-gap-xs);
+  margin-bottom: var(--wf-space-xs);
   color: var(--wf-color-text);
   line-height: 1.5;
 }
@@ -6664,14 +6997,14 @@ body.wf-dragging {
   display: inline-flex;
   flex-shrink: 0;
   margin-top: 2px;
-  color: var(--wf-color-warning-text, #ad6800);
+  color: var(--wf-color-warning-text);
 }
 
 .wf-popconfirm-actions {
   display: flex;
   justify-content: flex-end;
-  gap: var(--wf-gap-xs, 8px);
-  margin-top: var(--wf-space-xs, 8px);
+  gap: var(--wf-gap-xs);
+  margin-top: var(--wf-space-xs);
 }
 
 /* weifuwu/components — Popover */
@@ -6691,10 +7024,10 @@ body.wf-dragging {
   z-index: var(--wf-z-popover);
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
-  border-radius: var(--wf-popover-radius, var(--wf-radius-md));
+  border-radius: var(--wf-popover-radius,  var(--wf-radius-md));
   box-shadow: var(--wf-shadow-md);
   padding: var(--wf-space);
-  min-width: var(--wf-popover-width, 160px);
+  min-width: var(--wf-popover-width,  160px);
   max-width: 320px;
 }
 
@@ -6785,6 +7118,26 @@ body.wf-dragging {
   text-align: right;
 }
 
+/* 尺寸 */
+.wf-progress--sm { height: 4px; }
+.wf-progress--md { height: 8px; }
+.wf-progress--lg { height: 12px; }
+
+/* 状态色 */
+.wf-progress-fill--success { background: var(--wf-color-success-text); }
+.wf-progress-fill--error { background: var(--wf-color-error-text); }
+.wf-progress-fill--warning { background: var(--wf-color-warning-text); }
+
+/* indeterminate：不确定态（动画扫动） */
+.wf-progress--indeterminate .wf-progress-fill {
+  width: 40%;
+  animation: wf-progress-indeterminate 1.4s var(--wf-ease-in-out) infinite;
+}
+@keyframes wf-progress-indeterminate {
+  0% { transform: translateX(-100%); }
+  100% { transform: translateX(350%); }
+}
+
 /* weifuwu/components — RadioGroup */
 
 .wf-radio-group {
@@ -6824,7 +7177,7 @@ body.wf-dragging {
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   background: var(--wf-color-bg);
 }
 
@@ -6903,6 +7256,43 @@ body.wf-dragging {
 .wf-rate--md { font-size: var(--wf-font-size-xl); }
 .wf-rate--lg { font-size: var(--wf-font-size-2xl); }
 
+/* 半星：1em 容器，底层空星轮廓 + 上层满星裁剪左半（0.5em 精确） */
+.wf-rate-star-half {
+  position: relative;
+  display: inline-block;
+  width: 1em;
+  height: 1em;
+}
+.wf-rate-star-half-bg,
+.wf-rate-star-half-fg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  display: inline-flex;
+  align-items: center;
+}
+.wf-rate-star-half-bg {
+  width: 100%;
+  color: var(--wf-color-text-tertiary);
+}
+.wf-rate-star-half-fg {
+  width: 50%;
+  overflow: hidden;
+  color: var(--wf-color-warning-text);
+}
+.wf-rate-star-half-fg .wf-rate-star-icon {
+  width: 1em;
+  height: 1em;
+  flex-shrink: 0;
+  fill: currentColor;
+}
+.wf-rate-star-half-bg .wf-rate-star-icon {
+  width: 1em;
+  height: 1em;
+  flex-shrink: 0;
+}
+
 /* weifuwu/components — Resizable */
 
 .wf-resizable {
@@ -7026,7 +7416,7 @@ body.wf-dragging {
 }
 
 .wf-scrollbar::-webkit-scrollbar-thumb:hover {
-  background: var(--wf-color-text-tertiary, #999);
+  background: var(--wf-color-text-tertiary);
 }
 
 /* weifuwu/components — SearchInput */
@@ -7039,7 +7429,7 @@ body.wf-dragging {
   border: var(--wf-border-width) solid var(--wf-color-border);
   border-radius: var(--wf-radius);
   background: var(--wf-color-bg);
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
 }
 
 .wf-search:focus-within {
@@ -7174,14 +7564,14 @@ body.wf-dragging {
 .wf-select {
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
-  min-height: var(--wf-field-height, var(--wf-control-height));
+  min-height: var(--wf-field-height);
   padding: var(--wf-control-pad-y) var(--wf-space);
   border: var(--wf-border-width) solid var(--wf-color-border);
-  border-radius: var(--wf-field-radius, var(--wf-radius));
+  border-radius: var(--wf-field-radius);
   background: var(--wf-color-bg);
   color: var(--wf-color-text);
   outline: none;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   width: 100%;
   cursor: pointer;
   appearance: auto;
@@ -7199,6 +7589,7 @@ body.wf-dragging {
 
 .wf-select--err .wf-select {
   border-color: var(--wf-color-error);
+  box-shadow: 0 0 0 2px var(--wf-color-error-bg);
 }
 
 /* ── searchable select ── */
@@ -7209,10 +7600,10 @@ body.wf-dragging {
 
 .wf-select-search-trigger {
   border: var(--wf-border-width) solid var(--wf-color-border);
-  border-radius: var(--wf-field-radius, var(--wf-radius));
+  border-radius: var(--wf-field-radius);
   background: var(--wf-color-bg);
   cursor: pointer;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
 }
 .wf-select-search-trigger:focus-within {
   border-color: var(--wf-color-primary);
@@ -7230,6 +7621,7 @@ body.wf-dragging {
 }
 .wf-select--err .wf-select-search-trigger {
   border-color: var(--wf-color-error);
+  box-shadow: 0 0 0 2px var(--wf-color-error-bg);
 }
 
 .wf-select-search-input {
@@ -7240,7 +7632,7 @@ body.wf-dragging {
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
-  min-height: var(--wf-field-height, var(--wf-control-height));
+  min-height: var(--wf-field-height);
   padding: var(--wf-control-pad-y) var(--wf-space);
   cursor: pointer;
   box-sizing: border-box;
@@ -7251,10 +7643,10 @@ body.wf-dragging {
 
 .wf-select-search-menu {
   /* portal 定位（usePopup 接管）——absolute 会被父容器 overflow 裁剪 */
-  min-width: var(--wf-select-menu-min-width, 200px);
+  min-width: var(--wf-select-menu-min-width);
   background: var(--wf-color-bg);
   border: var(--wf-border-width) solid var(--wf-color-border);
-  border-radius: var(--wf-field-radius, var(--wf-radius));
+  border-radius: var(--wf-field-radius);
   box-shadow: var(--wf-shadow-md);
   max-height: 240px;
   overflow-y: auto;
@@ -7343,12 +7735,12 @@ body.wf-dragging {
 .wf-skeleton {
   display: inline-block;
   height: 1em;
-  border-radius: var(--wf-radius-sm, 4px);
+  border-radius: var(--wf-radius-sm);
   background: linear-gradient(
     90deg,
-    var(--wf-color-border, #e5e7eb) 25%,
-    var(--wf-color-bg-hover, #f3f4f6) 50%,
-    var(--wf-color-border, #e5e7eb) 75%
+    var(--wf-color-border) 25%,
+    var(--wf-color-bg-hover) 50%,
+    var(--wf-color-border) 75%
   );
   background-size: 200% 100%;
   animation: wf-skeleton-shimmer 1.5s ease-in-out infinite;
@@ -7375,13 +7767,13 @@ body.wf-dragging {
 }
 
 .wf-skeleton--rect {
-  border-radius: var(--wf-radius, 8px);
+  border-radius: var(--wf-radius);
   width: 100%;
   height: 120px;
 }
 
 .wf-skeleton--image {
-  border-radius: var(--wf-radius, 8px);
+  border-radius: var(--wf-radius);
   width: 100%;
   aspect-ratio: 16 / 9;
   height: auto;
@@ -7405,12 +7797,12 @@ body.wf-dragging {
 .wf-skeleton-table {
   display: flex;
   flex-direction: column;
-  gap: var(--wf-gap-sm, 8px);
+  gap: var(--wf-gap-sm);
 }
 
 .wf-skeleton-row {
   display: flex;
-  gap: var(--wf-gap-md, 12px);
+  gap: var(--wf-gap-md);
   align-items: center;
 }
 
@@ -7450,7 +7842,7 @@ body.wf-dragging {
   background: var(--wf-color-primary);
   cursor: pointer;
   border: 2px solid var(--wf-color-on-brand);
-  box-shadow: var(--wf-slider-thumb-shadow, 0 1px 3px rgba(0,0,0,0.2));
+  box-shadow: var(--wf-slider-thumb-shadow, var(--wf-shadow-sm));
 }
 
 /* Firefox 同款 thumb（跨浏览器一致） */
@@ -7461,7 +7853,7 @@ body.wf-dragging {
   background: var(--wf-color-primary);
   cursor: pointer;
   border: 2px solid var(--wf-color-on-brand);
-  box-shadow: var(--wf-slider-thumb-shadow, 0 1px 3px rgba(0,0,0,0.2));
+  box-shadow: var(--wf-slider-thumb-shadow, var(--wf-shadow-sm));
 }
 
 .wf-slider-input::-moz-range-track {
@@ -7495,7 +7887,7 @@ body.wf-dragging {
 }
 
 .wf-space-split {
-  color: var(--wf-color-text-tertiary, #999);
+  color: var(--wf-color-text-tertiary);
 }
 
 .wf-sparkline {
@@ -7653,7 +8045,7 @@ body.wf-dragging {
   width: 36px;
   height: 20px;
   background: var(--wf-color-border-dark);
-  border-radius: var(--wf-switch-radius, 10px);
+  border-radius: var(--wf-switch-radius,  10px);
   transition: background var(--wf-transition);
   flex-shrink: 0;
 }
@@ -7668,7 +8060,7 @@ body.wf-dragging {
   background: var(--wf-color-on-brand);
   border-radius: 50%;
   transition: transform var(--wf-transition);
-  box-shadow: var(--wf-switch-knob-shadow, 0 1px 2px rgba(0,0,0,0.15));
+  box-shadow: var(--wf-switch-knob-shadow, var(--wf-shadow-sm));
 }
 
 .wf-switch-input:checked + .wf-switch-track {
@@ -7727,6 +8119,7 @@ body.wf-dragging {
   border-bottom: var(--wf-border-width) solid var(--wf-color-border);
   color: var(--wf-color-text);
   font-size: var(--wf-font-size-base);
+  transition: background-color var(--wf-dur-fast) var(--wf-ease-out);
 }
 
 .wf-table-th--sortable {
@@ -7780,6 +8173,20 @@ body.wf-dragging {
   display: flex;
   gap: 0;
   border-bottom: var(--wf-border-width) solid var(--wf-color-border);
+  position: relative;
+}
+
+/* 滑动指示器（ink bar）：绝对定位 + transform 过渡 */
+.wf-tab-ink {
+  position: absolute;
+  bottom: -1px;
+  left: 0;
+  height: 2px;
+  background: var(--wf-color-primary);
+  transition: transform var(--wf-dur-base) var(--wf-ease-out),
+              width var(--wf-dur-base) var(--wf-ease-out);
+  pointer-events: none;
+  z-index: 1;
 }
 
 .wf-tab {
@@ -7793,7 +8200,7 @@ body.wf-dragging {
   cursor: pointer;
   border-bottom: 2px solid transparent;
   margin-bottom: -1px;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   white-space: nowrap;
 }
 
@@ -7803,7 +8210,6 @@ body.wf-dragging {
 
 .wf-tab--active {
   color: var(--wf-color-primary-text);
-  border-bottom-color: var(--wf-color-primary);
 }
 
 /* 激活指示平滑滑动（下边框） */
@@ -7831,7 +8237,7 @@ body.wf-dragging {
   align-items: center;
   gap: var(--wf-gap-xs);
   padding: 2px var(--wf-space-sm);
-  border-radius: var(--wf-tag-radius, var(--wf-radius-sm));
+  border-radius: var(--wf-tag-radius,  var(--wf-radius-sm));
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-xs);
   line-height: 1.5;
@@ -7886,7 +8292,7 @@ body.wf-dragging {
   box-shadow: 0 0 0 2px var(--wf-color-primary-bg);
 }
 
-.wf-tags--err { border-color: var(--wf-color-error-text); }
+.wf-tags--err { border-color: var(--wf-color-error); box-shadow: 0 0 0 2px var(--wf-color-error-bg); }
 .wf-tags--disabled { opacity: 0.6; cursor: not-allowed; }
 
 .wf-tags-tag {
@@ -7947,14 +8353,14 @@ body.wf-dragging {
 .wf-textarea {
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
-  min-height: var(--wf-field-height, var(--wf-control-height));
+  min-height: var(--wf-field-height);
   padding: var(--wf-control-pad-y) var(--wf-space);
   border: var(--wf-border-width) solid var(--wf-color-border);
-  border-radius: var(--wf-field-radius, var(--wf-radius));
+  border-radius: var(--wf-field-radius);
   background: var(--wf-color-bg);
   color: var(--wf-color-text);
   outline: none;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
   width: 100%;
   resize: vertical;
   line-height: var(--wf-line-height);
@@ -7989,6 +8395,7 @@ body.wf-dragging {
 
 .wf-textarea--err .wf-textarea {
   border-color: var(--wf-color-error);
+  box-shadow: 0 0 0 2px var(--wf-color-error-bg);
 }
 
 /* weifuwu/components — ThemeSwitch 主题切换器 */
@@ -8002,7 +8409,7 @@ body.wf-dragging {
   border-radius: var(--wf-radius-md);
   background: var(--wf-color-bg-secondary);
   font-family: var(--wf-font-sans);
-  box-shadow: var(--wf-theme-switch-inset, inset 0 1px 2px rgba(0, 0, 0, 0.04));
+  box-shadow: var(--wf-theme-switch-inset, var(--wf-shadow-inset));
 }
 
 .wf-theme-seg {
@@ -8020,7 +8427,7 @@ body.wf-dragging {
   cursor: pointer;
   white-space: nowrap;
   user-select: none;
-  transition: all var(--wf-transition);
+  transition: border-color var(--wf-transition), box-shadow var(--wf-transition), background-color var(--wf-transition), color var(--wf-transition);
 }
 
 .wf-theme-seg:hover {
@@ -8140,6 +8547,44 @@ body.wf-dragging {
 .wf-timeline-item--alt-left { align-self: flex-start; text-align: right; }
 .wf-timeline-item--alt-right { align-self: flex-end; margin-left: 50%; }
 
+/* 横向模式（horizontal）：节点水平排列，连接线水平 */
+.wf-timeline--h {
+  display: flex;
+  gap: 0;
+  overflow-x: auto;
+}
+.wf-timeline-item--h {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex: 1;
+  min-width: var(--wf-timeline-h-min-width, 120px);
+  padding: 0 var(--wf-space-xs);
+  padding-bottom: 0;
+  text-align: center;
+}
+/* 水平连接线（除最后一项） */
+.wf-timeline-item--h:not(:last-child)::before {
+  content: '';
+  position: absolute;
+  top: 10px;
+  left: calc(50% + 11px);
+  right: calc(-50% + 11px);
+  height: 2px;
+  width: auto;
+  background: var(--wf-color-border);
+}
+.wf-timeline-item--h .wf-timeline-node {
+  margin-top: 0;
+}
+.wf-timeline-item--h .wf-timeline-head {
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
+  margin-top: var(--wf-space-xs);
+}
+
 /* weifuwu/components — Toast */
 
 .wf-toast-container {
@@ -8163,11 +8608,11 @@ body.wf-dragging {
   align-items: center;
   gap: var(--wf-gap-sm);
   padding: var(--wf-space) var(--wf-space-md);
-  border-radius: var(--wf-toast-radius, var(--wf-radius));
+  border-radius: var(--wf-toast-radius,  var(--wf-radius));
   box-shadow: var(--wf-shadow-md);
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-sm);
-  min-width: var(--wf-toast-width, 260px);
+  min-width: var(--wf-toast-width,  260px);
   max-width: 400px;
   cursor: pointer;
   pointer-events: auto;
@@ -8294,9 +8739,9 @@ body.wf-dragging {
 }
 
 /* 尺寸 */
-.wf-toggle--sm { font-size: var(--wf-font-size-sm); padding: 2px var(--wf-space-sm); }
-.wf-toggle--md { font-size: var(--wf-font-size-base); padding: 4px var(--wf-space); }
-.wf-toggle--lg { font-size: var(--wf-font-size-lg); padding: 6px var(--wf-space-md); }
+.wf-toggle--sm { padding: 2px var(--wf-space-sm); }
+.wf-toggle--md { padding: 4px var(--wf-space); }
+.wf-toggle--lg { padding: var(--wf-space-sm) var(--wf-space-md); }
 
 /* 组：紧邻连接，选中项圆角过渡 */
 .wf-toggle-group {
@@ -8394,7 +8839,7 @@ body.wf-dragging {
   font-family: var(--wf-font-sans);
   font-size: var(--wf-font-size-xs);
   padding: var(--wf-space-xs) var(--wf-space-sm);
-  border-radius: var(--wf-tooltip-radius, var(--wf-radius-sm));
+  border-radius: var(--wf-tooltip-radius,  var(--wf-radius-sm));
   box-shadow: var(--wf-shadow-md); /* 与其他弹层一致的层次阴影 */
   white-space: nowrap;
   pointer-events: none;
@@ -8492,7 +8937,7 @@ body.wf-dragging {
   box-shadow: 0 0 0 9999px var(--wf-overlay), 0 0 0 2px var(--wf-color-primary);
   z-index: 1;
   pointer-events: none;
-  transition: all var(--wf-dur-fast) var(--wf-ease-out);
+  transition: border-color var(--wf-dur-fast) var(--wf-ease-out), box-shadow var(--wf-dur-fast) var(--wf-ease-out), background-color var(--wf-dur-fast) var(--wf-ease-out), color var(--wf-dur-fast) var(--wf-ease-out);
 }
 
 .wf-tour-bubble {
@@ -8503,7 +8948,7 @@ body.wf-dragging {
   background: var(--wf-color-bg);
   border: 1px solid var(--wf-color-border);
   border-radius: var(--wf-radius-md);
-  box-shadow: var(--wf-shadow-lg, 0 12px 32px rgba(0, 0, 0, 0.12));
+  box-shadow: var(--wf-shadow-lg);
   padding: 16px;
   display: flex;
   flex-direction: column;
@@ -8541,7 +8986,7 @@ body.wf-dragging {
 
 .wf-tour-btn {
   min-height: 32px;
-  padding: 0 14px;
+  padding: 0 var(--wf-space-md);
   border-radius: var(--wf-radius-sm);
   border: 1px solid var(--wf-color-border);
   background: var(--wf-color-bg);
@@ -8608,7 +9053,7 @@ body.wf-dragging {
   text-align: left;
   border: none;
   background: none;
-  padding: 6px var(--wf-space);
+  padding: var(--wf-space-sm) var(--wf-space);
   border-radius: var(--wf-radius-sm);
   font-size: var(--wf-font-size-sm);
   color: var(--wf-color-text);
@@ -8702,6 +9147,15 @@ body.wf-dragging {
   }
 }
 
+.wf-transfer-search {
+  width: 100%;
+  box-sizing: border-box;
+  margin-bottom: var(--wf-gap-xs);
+  min-height: var(--wf-field-height);
+  padding: var(--wf-control-pad-y) var(--wf-space-sm);
+  font-size: var(--wf-font-size-sm);
+}
+
 /* weifuwu/components — Tree */
 
 .wf-tree {
@@ -8718,7 +9172,7 @@ body.wf-dragging {
   display: flex;
   align-items: center;
   gap: var(--wf-gap-xs);
-  padding: 3px var(--wf-space-sm);
+  padding: var(--wf-space-xs) var(--wf-space-sm);
   border-radius: var(--wf-radius-sm);
   cursor: pointer;
 }
@@ -8848,6 +9302,20 @@ body.wf-dragging {
   white-space: nowrap;
 }
 
+/* 搜索高亮 */
+.wf-tree-match {
+  background: var(--wf-color-warning-bg);
+  color: var(--wf-color-warning-text);
+  border-radius: var(--wf-radius-xs);
+  padding: 0 1px;
+}
+.wf-tree-empty {
+  padding: var(--wf-space-md);
+  color: var(--wf-color-text-secondary);
+  font-size: var(--wf-font-size-sm);
+  text-align: center;
+}
+
 .wf-treeselect {
   position: relative;
   display: inline-block;
@@ -8860,7 +9328,7 @@ body.wf-dragging {
   align-items: center;
   justify-content: space-between;
   gap: 8px;
-  padding: 7px 12px;
+  padding: var(--wf-space-sm) 12px;
   border: 1px solid var(--wf-color-border);
   border-radius: var(--wf-radius-sm);
   background: var(--wf-color-bg);
@@ -8873,7 +9341,7 @@ body.wf-dragging {
 }
 .wf-treeselect-trigger--open {
   border-color: var(--wf-color-primary);
-  box-shadow: 0 0 0 2px var(--wf-color-primary-bg, rgba(79, 110, 247, 0.15));
+  box-shadow: 0 0 0 2px var(--wf-color-primary-bg);
 }
 
 .wf-treeselect-placeholder {
@@ -8907,7 +9375,7 @@ body.wf-dragging {
   background: var(--wf-color-bg);
   border: 1px solid var(--wf-color-border);
   border-radius: var(--wf-radius-md);
-  box-shadow: var(--wf-shadow-md, 0 4px 16px rgba(0, 0, 0, 0.1));
+  box-shadow: var(--wf-shadow-md);
   padding: 4px;
   max-height: var(--wf-treeselect-dropdown-max-height);
   overflow: auto;
@@ -9103,6 +9571,21 @@ body.wf-dragging {
   font-size: var(--wf-font-size-sm);
 }
 
+/* 行选择复选框列 */
+.wf-virtual-table-th--select,
+.wf-virtual-table-td--select {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+.wf-virtual-table-check {
+  width: 16px;
+  height: 16px;
+  cursor: pointer;
+  accent-color: var(--wf-color-primary);
+}
+
 /* weifuwu/components — Watermark */
 
 .wf-watermark {