收口前端平台组件库能力

新增 PlatformUiKit 通用弹窗、按钮、状态、空态、媒体、表单和标签等公共组件
迁移结果页、创作工作台、认证入口、RPG 暗色面板和运行态弹窗的重复 UI chrome
补充组件测试、页面回归测试、技术文档和 Hermes 共享决策记录

src/components/common/PlatformOverlayBadge.test.tsx

@@ -0,0 +1,53 @@
+/* @vitest-environment jsdom */
+
+import { render, screen } from '@testing-library/react';
+import { expect, test } from 'vitest';
+
+import { PlatformOverlayBadge } from './PlatformOverlayBadge';
+
+test('renders a light top-left overlay badge by default', () => {
+  render(<PlatformOverlayBadge>第1幕</PlatformOverlayBadge>);
+
+  const badge = screen.getByText('第1幕');
+
+  expect(badge.className).toContain('absolute');
+  expect(badge.className).toContain('left-3');
+  expect(badge.className).toContain('top-3');
+  expect(badge.className).toContain('bg-white/88');
+  expect(badge.className).toContain('tracking-[0.18em]');
+});
+
+test('supports alternate placement and custom class', () => {
+  render(
+    <PlatformOverlayBadge placement="bottomRight" className="custom-overlay">
+      已选择
+    </PlatformOverlayBadge>,
+  );
+
+  const badge = screen.getByText('已选择');
+
+  expect(badge.className).toContain('bottom-3');
+  expect(badge.className).toContain('right-3');
+  expect(badge.className).toContain('custom-overlay');
+});
+
+test('supports compact muted tight overlay badge', () => {
+  render(
+    <PlatformOverlayBadge
+      placement="topRight"
+      offset="tight"
+      tone="muted"
+      size="compact"
+    >
+      占位图
+    </PlatformOverlayBadge>,
+  );
+
+  const badge = screen.getByText('占位图');
+
+  expect(badge.className).toContain('right-2');
+  expect(badge.className).toContain('top-2');
+  expect(badge.className).toContain('bg-[var(--platform-subpanel-fill)]');
+  expect(badge.className).toContain('px-2');
+  expect(badge.className).toContain('tracking-normal');
+});