继续收口暗色局部动作按钮

预设形象编辑器按钮改为委托 PlatformActionButton
技能预览重播按钮改为委托 PlatformActionButton
更新 PlatformUiKit 收口文档与团队决策记录

src/components/CustomWorldNpcVisualEditor.tsx

@@ -28,6 +28,7 @@ import {
   type CustomWorldNpcVisual,
   type CustomWorldProfile,
 } from '../types';
+import { PlatformActionButton } from './common/PlatformActionButton';
 import { buildDefaultCustomWorldNpcVisual } from './customWorldNpcVisualDefaults';
 import { HostileNpcAnimator } from './HostileNpcAnimator';
 import { MedievalNpcAnimator } from './MedievalNpcAnimator';
@@ -282,9 +283,18 @@ function ActionButton({
   onClick: () => void;
   tone?: 'default' | 'sky';
 }) {
+  const buttonTone = tone === 'sky' ? 'primary' : 'ghost';
+  const visualClassName =
+    tone === 'sky'
+      ? 'border-sky-300/22 bg-sky-500/12 text-sky-50 hover:border-sky-200/40 hover:bg-sky-500/12 hover:text-white'
+      : 'border-white/12 bg-black/20 text-zinc-200 hover:border-white/22 hover:bg-black/20 hover:text-white';
+
   return (
-    <button
-      type="button"
+    <PlatformActionButton
+      surface="editorDark"
+      tone={buttonTone}
+      size="xs"
+      shape="pill"
       onPointerDown={(event) => {
         event.stopPropagation();
       }}
@@ -292,14 +302,10 @@ function ActionButton({
         event.stopPropagation();
       }}
       onClick={onClick}
-      className={`rounded-full border px-4 py-2 text-sm font-semibold transition-colors ${
-        tone === 'sky'
-          ? 'border-sky-300/22 bg-sky-500/12 text-sky-50 hover:border-sky-200/40 hover:text-white'
-          : 'border-white/12 bg-black/20 text-zinc-200 hover:border-white/22 hover:text-white'
-      }`}
+      className={`text-sm font-semibold ${visualClassName}`}
     >
       {label}
-    </button>
+    </PlatformActionButton>
   );
 }
 

src/components/SkillEffectPreview.tsx

@@ -17,6 +17,7 @@ import {
   SceneHostileNpc,
   WorldType,
 } from '../types';
+import { PlatformActionButton } from './common/PlatformActionButton';
 import { GameCanvas } from './GameCanvas';
 
 export interface SkillEffectPreviewProps {
@@ -227,15 +228,17 @@ export function SkillEffectPreview({
             {mode === 'player' ? `受击对象：${sceneHostileNpcs[0]?.name ?? '无目标'}` : `受击对象：${fallbackTargetCharacter.name}`}
           </div>
         </div>
-        <button
-          type="button"
+        <PlatformActionButton
           onClick={() => setRestartTick(value => value + 1)}
           disabled={!skill || isPlaying}
-          className="inline-flex items-center gap-2 rounded-lg border border-white/10 bg-black/30 px-3 py-2 text-xs text-zinc-200 transition hover:border-white/20 hover:text-white disabled:cursor-not-allowed disabled:opacity-50"
+          surface="editorDark"
+          tone="ghost"
+          size="xs"
+          className="min-h-0 rounded-lg bg-black/30 px-3 py-2 text-xs hover:border-white/20 disabled:opacity-50"
         >
           <RotateCcw className="h-3.5 w-3.5" />
           <span>{isPlaying ? '播放中' : '重新预览'}</span>
-        </button>
+        </PlatformActionButton>
       </div>
 
       <div className="overflow-hidden rounded-2xl border border-white/10 bg-black">