feat(ui-refactor 2/4): DESIGN.md 重写为 beautifului 标准（token/圆角/阴影/动效/字号体系）；插件组件库 Button 对齐 pill 体系

packages/plugin-sdk/src/ui.tsx

@@ -118,26 +118,28 @@ export function EmptyState({ title, description, action, className }: EmptyState
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
   /** primary=强调实心 / ghost=描边（默认）/ danger=危险描边 */
   variant?: 'primary' | 'ghost' | 'danger'
-  /** sm=辅助按钮 11px / md=标准 11.5px（默认） */
+  /** sm=辅助 pill（h-7 12px）/ md=标准 pill（13px）（默认） */
   size?: 'sm' | 'md'
   /** true 时禁用并显示旋转指示器（异步提交防重复点击） */
   loading?: boolean
 }
 
 export function Button({ variant = 'ghost', size = 'md', loading = false, disabled, className, children, ...rest }: ButtonProps): ReactElement {
+  /* beautifului pill 体系：rounded-full + 150ms ease-out + 按压回缩 0.96；
+   * filled 变体带 1px 内高光（类已在宿主 Button.tsx 中生成，插件可直接复用）。 */
   const variantCls =
     variant === 'primary'
-      ? 'bg-accent text-white hover:opacity-90'
+      ? 'bg-ink text-canvas hover:opacity-90 shadow-[inset_0_1px_0_rgba(255,255,255,0.14)]'
       : variant === 'danger'
         ? 'border border-line-strong text-red hover:bg-red/10'
-        : 'border border-line-strong text-ink hover:bg-hover'
-  const sizeCls = size === 'sm' ? 'px-2 py-1 text-[11px]' : 'px-3 py-1.5 text-[11.5px]'
+        : 'bg-surface text-ink shadow-btn hover:bg-inset'
+  const sizeCls = size === 'sm' ? 'h-7 px-2.5 text-[12px]' : 'h-[27px] px-3 text-[12.5px]'
   return (
     <button
       type="button"
       disabled={disabled || loading}
       className={cn(
-        'inline-flex items-center justify-center gap-1.5 rounded-control font-medium transition-colors disabled:pointer-events-none disabled:opacity-50',
+        'inline-flex items-center justify-center gap-1.5 rounded-full font-medium leading-none transition-[transform,background-color,opacity] duration-150 ease-out active:scale-[0.96] disabled:pointer-events-none disabled:opacity-50',
         variantCls,
         sizeCls,
         className