继续收口工具弹窗与分段切换预设

新增 PlatformToolModalShell 承接白底工具弹窗壳层和固定可访问名称

新增 PlatformSegmentedTabPresets 沉淀频道下划线、创作 pill rail 与二列 option segment

迁移拼图、抓大鹅、历史素材弹窗和首页 / 作品架 / 充值切换的重复组件写法

同步 PlatformUiKit 文档和 Hermes 决策记录

src/components/rpg-entry/RpgEntryHomeView.tsx

@@ -89,7 +89,10 @@ import { PlatformIconButton } from '../common/PlatformIconButton';
 import { PlatformModalCloseButton } from '../common/PlatformModalCloseButton';
 import { PlatformNavigableListItem } from '../common/PlatformNavigableListItem';
 import { PlatformPillBadge } from '../common/PlatformPillBadge';
-import { PlatformSegmentedTabs } from '../common/PlatformSegmentedTabs';
+import {
+  PlatformOptionSegment,
+  PlatformUnderlineTabRail,
+} from '../common/PlatformSegmentedTabPresets';
 import { PlatformStatusDialog } from '../common/PlatformStatusDialog';
 import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
 import { PlatformSubpanel } from '../common/PlatformSubpanel';
@@ -2178,27 +2181,11 @@ function PlatformCategoryFilterDialog({
         <div className="text-xs font-black text-[var(--platform-text-soft)]">
           玩法
         </div>
-        <PlatformSegmentedTabs
+        <PlatformOptionSegment
           items={kindFilterTabs}
           activeId={kindFilter}
           onChange={onKindFilterChange}
-          columns="two"
-          gap="md"
-          frame="bare"
-          surface="transparent"
-          size="sm"
-          semantics="segment"
-          className="platform-category-filter-dialog__options"
-          itemClassName={(_, active) =>
-            [
-              'platform-category-filter-dialog__option !min-h-[2.35rem] !rounded-[0.78rem] !border !border-[var(--platform-subpanel-border)] !bg-[var(--platform-subpanel-fill)] !px-3 !text-[0.88rem] !font-black !text-[var(--platform-text-base)] !shadow-none hover:!bg-[var(--platform-subpanel-fill)]',
-              active
-                ? 'platform-category-filter-dialog__option--active !border-[var(--platform-cool-border)] !bg-[var(--platform-cool-bg)] !text-[var(--platform-cool-text)]'
-                : null,
-            ]
-              .filter(Boolean)
-              .join(' ')
-          }
+          variant="categoryFilter"
         />
       </div>
 
@@ -2206,27 +2193,11 @@ function PlatformCategoryFilterDialog({
         <div className="text-xs font-black text-[var(--platform-text-soft)]">
           排序
         </div>
-        <PlatformSegmentedTabs
+        <PlatformOptionSegment
           items={sortModeTabs}
           activeId={sortMode}
           onChange={onSortModeChange}
-          columns="two"
-          gap="md"
-          frame="bare"
-          surface="transparent"
-          size="sm"
-          semantics="segment"
-          className="platform-category-filter-dialog__options"
-          itemClassName={(_, active) =>
-            [
-              'platform-category-filter-dialog__option !min-h-[2.35rem] !rounded-[0.78rem] !border !border-[var(--platform-subpanel-border)] !bg-[var(--platform-subpanel-fill)] !px-3 !text-[0.88rem] !font-black !text-[var(--platform-text-base)] !shadow-none hover:!bg-[var(--platform-subpanel-fill)]',
-              active
-                ? 'platform-category-filter-dialog__option--active !border-[var(--platform-cool-border)] !bg-[var(--platform-cool-bg)] !text-[var(--platform-cool-text)]'
-                : null,
-            ]
-              .filter(Boolean)
-              .join(' ')
-          }
+          variant="categoryFilter"
         />
       </div>
 
@@ -3604,30 +3575,15 @@ export function RpgEntryHomeView({
     <section
       className={`${PANEL_SURFACE_CLASS} platform-ranking-panel px-4 py-3.5 sm:px-5 sm:py-4`}
     >
-      <PlatformSegmentedTabs
+      <PlatformUnderlineTabRail
         items={PLATFORM_RANKING_TABS.map((tab) => ({
           id: tab.id,
           label: tab.label,
         }))}
         activeId={activeRankingTab}
         onChange={setActiveRankingTab}
-        layout="scroll"
-        gap="md"
-        frame="bare"
-        surface="transparent"
-        size="sm"
-        tone="neutral"
-        semantics="tabs"
         ariaLabel="作品排行"
-        className="platform-ranking-tabs pb-1"
-        itemClassName={(_, active) =>
-          [
-            'platform-ranking-tab shrink-0 !min-h-[2.35rem] !rounded-none !border-0 !bg-transparent !px-[0.15rem] !shadow-none hover:!bg-transparent',
-            active ? 'platform-ranking-tab--active' : null,
-          ]
-            .filter(Boolean)
-            .join(' ')
-        }
+        variant="ranking"
       />
 
       <PlatformAsyncStatePanel
@@ -3801,27 +3757,11 @@ export function RpgEntryHomeView({
         />
       ) : (
         <>
-          <PlatformSegmentedTabs
+          <PlatformUnderlineTabRail
             items={discoverChannelTabs}
             activeId={discoverChannel}
             onChange={handleDiscoverChannelChange}
-            layout="scroll"
-            gap="md"
-            frame="bare"
-            surface="transparent"
-            size="sm"
-            tone="neutral"
-            semantics="tabs"
             ariaLabel="发现频道"
-            className="platform-mobile-home-channelbar pb-1"
-            itemClassName={(_, active) =>
-              [
-                'platform-mobile-home-channel shrink-0 !min-h-8 !rounded-none !border-0 !bg-transparent !px-0 !shadow-none hover:!bg-transparent',
-                active ? 'platform-mobile-home-channel--active' : null,
-              ]
-                .filter(Boolean)
-                .join(' ')
-            }
           />
 
           {platformError ? (
@@ -3969,27 +3909,11 @@ export function RpgEntryHomeView({
 
   const desktopDiscoverContent: ReactNode = (
     <div className={DESKTOP_DISCOVER_PAGE_STAGE_CLASS}>
-      <PlatformSegmentedTabs
+      <PlatformUnderlineTabRail
         items={discoverChannelTabs}
         activeId={discoverChannel}
         onChange={handleDiscoverChannelChange}
-        layout="scroll"
-        gap="md"
-        frame="bare"
-        surface="transparent"
-        size="sm"
-        tone="neutral"
-        semantics="tabs"
         ariaLabel="发现频道"
-        className="platform-mobile-home-channelbar pb-1"
-        itemClassName={(_, active) =>
-          [
-            'platform-mobile-home-channel shrink-0 !min-h-8 !rounded-none !border-0 !bg-transparent !px-0 !shadow-none hover:!bg-transparent',
-            active ? 'platform-mobile-home-channel--active' : null,
-          ]
-            .filter(Boolean)
-            .join(' ')
-        }
       />
 
       {platformError ? (