diff --git a/web/src/components/canvas/canvas-agent-skill-library-modal.tsx b/web/src/components/canvas/canvas-agent-skill-library-modal.tsx
index c77c3d0ae..6fa552c50 100644
--- a/web/src/components/canvas/canvas-agent-skill-library-modal.tsx
+++ b/web/src/components/canvas/canvas-agent-skill-library-modal.tsx
@@ -1,11 +1,11 @@
-import { useEffect, useMemo, useRef, useState } from "react";
-import { Button, Input } from "antd";
+import { useEffect, useMemo, useRef, useState, type ReactNode } from "react";
+import { Alert, Button, Input } from "antd";
 import { Check, LoaderCircle, Plus, Search, Sparkles, Users } from "lucide-react";
 
 import { AppModal } from "@/components/ui/product/app-modal";
 import type { CanvasTheme } from "@/lib/canvas-theme";
 import type { Skill, SkillCategory, SkillLibraryCategory } from "@/services/api/skills";
-import { SkillCurationBrowser, matchesCuration, effectiveCurationRoot, type useSkillCuration } from "@/components/skills/skill-curation-browser";
+import { curationIcon, matchesCuration, effectiveCurationRoot, type useSkillCuration } from "@/components/skills/skill-curation-browser";
 
 type SkillLibraryTab = "enabled" | "installed" | "market";
 
@@ -72,6 +72,14 @@ export function CanvasAgentSkillLibraryModal({
         listRef.current?.scrollTo({ top: 0 });
     }, [category, libraryCategoryId, search, tab]);
 
+    useEffect(() => {
+        const data = curationState.curation;
+        const valid = platformCategory.startsWith("root:")
+            ? data?.roots?.some((root) => root.id === platformCategory.slice(5))
+            : data?.categories.some((item) => item.id === platformCategory);
+        if ((!data?.enabled || (platformCategory && platformCategory !== "__uncategorized__" && !valid)) && platformCategory) onPlatformCategoryChange("");
+    }, [curationState.curation, onPlatformCategoryChange, platformCategory]);
+
     const librarySource = useMemo(() => tab === "enabled"
         ? installedSkills.filter((skill) => selectedSkillIds.includes(skill.skillId))
         : installedSkills, [installedSkills, selectedSkillIds, tab]);
@@ -188,7 +196,29 @@ export function CanvasAgentSkillLibraryModal({
                         className="canvas-agent-skill-library-search"
                     />
                     <nav className="canvas-agent-skill-library-categories thin-scrollbar" aria-label="技能视图与分类">
-                        <SkillCurationBrowser data={curationState.curation} value={platformCategory} onChange={onPlatformCategoryChange} error={curationState.error} retry={curationState.retry} />
+                        {curationState.error ? <Alert type="warning" title={curationState.error} action={<Button onClick={curationState.retry}>重试</Button>} /> : null}
+                        {curationState.curation?.enabled ? (
+                            <div className="canvas-agent-skill-library-category-group" role="group" aria-label="平台分类">
+                                <div className="canvas-agent-skill-library-category-heading">平台分类</div>
+                                <SkillTab active={!platformCategory} label="全部分类" onClick={() => onPlatformCategoryChange("")} />
+                                <SkillTab active={platformCategory === "__uncategorized__"} label="未细分" onClick={() => onPlatformCategoryChange("__uncategorized__")} />
+                                {(curationState.curation.roots || []).map((root) => {
+                                    const Icon = curationIcon(root.iconKey);
+                                    const children = curationState.curation?.categories.filter((item) => item.rootTag === root.id) || [];
+                                    return (
+                                        <div key={root.id} className="canvas-agent-skill-library-platform-branch">
+                                            <SkillTab active={platformCategory === `root:${root.id}`} icon={<Icon className="size-4" aria-hidden="true" />} label={root.name} onClick={() => onPlatformCategoryChange(`root:${root.id}`)} />
+                                            {children.map((item) => (
+                                                <SkillTab key={item.id} active={platformCategory === item.id} label={item.name} onClick={() => onPlatformCategoryChange(item.id)} />
+                                            ))}
+                                        </div>
+                                    );
+                                })}
+                                {(curationState.curation.categories || []).filter((item) => !(curationState.curation?.roots || []).some((root) => root.id === item.rootTag)).map((item) => (
+                                    <SkillTab key={item.id} active={platformCategory === item.id} label={item.name} onClick={() => onPlatformCategoryChange(item.id)} />
+                                ))}
+                            </div>
+                        ) : null}
                         <div className="canvas-agent-skill-library-category-group">
                             <div className="canvas-agent-skill-library-category-heading">我的技能分类</div>
                             <SkillTab active={tab !== "market" && libraryCategoryId === "all"} label="全部分类" count={librarySource.length} onClick={() => selectLibraryCategory("all")} />
@@ -270,9 +300,10 @@ export function CanvasAgentSkillLibraryModal({
     );
 }
 
-function SkillTab({ active, label, count, onClick }: { active: boolean; label: string; count?: number; onClick: () => void }) {
+function SkillTab({ active, icon, label, count, onClick }: { active: boolean; icon?: ReactNode; label: string; count?: number; onClick: () => void }) {
     return (
-        <button type="button" aria-pressed={active} className={`canvas-agent-skill-library-tab ${active ? "is-active" : ""}`} onClick={onClick}>
+        <button type="button" aria-pressed={active} className={`canvas-agent-skill-library-tab${icon ? " has-icon" : ""}${active ? " is-active" : ""}`} onClick={onClick}>
+            {icon}
             {label}
             {typeof count === "number" ? <span>{count}</span> : null}
         </button>
diff --git a/web/src/components/canvas/canvas-cloud-agent.css b/web/src/components/canvas/canvas-cloud-agent.css
index 27a43bb96..bbb1a03fb 100644
--- a/web/src/components/canvas/canvas-cloud-agent.css
+++ b/web/src/components/canvas/canvas-cloud-agent.css
@@ -2459,6 +2459,7 @@
 .canvas-agent-skill-library-categories {
     display: flex;
     min-height: 0;
+    min-width: 0;
     flex-direction: column;
     gap: var(--space-1);
     overflow-y: auto;
@@ -2466,6 +2467,27 @@
     overscroll-behavior: contain;
 }
 
+.canvas-agent-skill-library-categories > .skill-curation-browser {
+    display: grid;
+    min-width: 0;
+    gap: var(--space-2);
+    margin-bottom: var(--space-3);
+    border-bottom: 1px solid var(--border);
+    padding: 0 var(--space-3) var(--space-4);
+}
+
+.canvas-agent-skill-library-categories .skill-curation-browser-label {
+    color: var(--muted-foreground);
+    font-size: var(--fs-caption);
+    font-weight: 650;
+    letter-spacing: 0.04em;
+}
+
+.canvas-agent-skill-library-categories .skill-curation-browser-select {
+    width: 100%;
+    min-width: 0;
+}
+
 .canvas-agent-skill-library-category-group {
     display: grid;
     gap: var(--space-1);
@@ -2534,6 +2556,17 @@
     opacity: 1;
 }
 
+.canvas-agent-skill-library-tab.has-icon::before {
+    display: none;
+}
+
+.canvas-agent-skill-library-platform-branch {
+    display: grid;
+    min-width: 0;
+    gap: var(--space-1);
+    border: 0;
+}
+
 .canvas-agent-skill-library-content {
     container: agent-skill-content / inline-size;
     display: flex;
@@ -2871,6 +2904,27 @@
         overscroll-behavior-x: contain;
     }
 
+    .canvas-agent-skill-library-categories > .skill-curation-browser {
+        display: flex;
+        flex: 0 0 auto;
+        align-items: center;
+        gap: var(--space-2);
+        margin-bottom: 0;
+        border-right: 1px solid var(--border);
+        border-bottom: 0;
+        padding: 0 var(--space-3) 0 var(--space-2);
+    }
+
+    .canvas-agent-skill-library-categories .skill-curation-browser-label {
+        flex: 0 0 auto;
+        white-space: nowrap;
+    }
+
+    .canvas-agent-skill-library-categories .skill-curation-browser-select {
+        width: 156px;
+        flex: 0 0 156px;
+    }
+
     .canvas-agent-skill-library-category-group {
         display: flex;
         flex: 0 0 auto;
diff --git a/web/src/components/skills/skill-curation-browser.tsx b/web/src/components/skills/skill-curation-browser.tsx
index 07d0f512b..d5e2323b6 100644
--- a/web/src/components/skills/skill-curation-browser.tsx
+++ b/web/src/components/skills/skill-curation-browser.tsx
@@ -56,9 +56,25 @@ export function SkillCurationBrowser({ data, value, onChange, error, retry }: {
     }, [data, value, onChange]);
     if (error) return <Alert type="warning" title={error} action={<Button onClick={retry}>重试</Button>} />;
     if (!data?.enabled) return null;
-    return <Space wrap><span>平台分类</span><Select aria-label="平台分类" value={value} onChange={onChange} popupMatchSelectWidth={false} options={[
-        { value: "", label: "全部分类" }, { value: "__uncategorized__", label: "未细分" },
-        ...(data.roots || []).map((root) => { const Icon = curationIcon(root.iconKey); return { value: `root:${root.id}`, label: <Space><Icon size={16} />{root.name}</Space> }; }),
-        ...data.categories.map((item) => ({ value: item.id, label: `${data.roots?.find((root) => root.id === item.rootTag)?.name || "分类"} / ${item.name}` })),
-    ]} /></Space>;
+    return (
+        <div className="skill-curation-browser">
+            <span className="skill-curation-browser-label">平台分类</span>
+            <Select
+                aria-label="平台分类"
+                className="skill-curation-browser-select"
+                value={value}
+                onChange={onChange}
+                popupMatchSelectWidth={false}
+                options={[
+                    { value: "", label: "全部分类" },
+                    { value: "__uncategorized__", label: "未细分" },
+                    ...(data.roots || []).map((root) => {
+                        const Icon = curationIcon(root.iconKey);
+                        return { value: `root:${root.id}`, label: <Space><Icon size={16} />{root.name}</Space> };
+                    }),
+                    ...data.categories.map((item) => ({ value: item.id, label: `${data.roots?.find((root) => root.id === item.rootTag)?.name || "分类"} / ${item.name}` })),
+                ]}
+            />
+        </div>
+    );
 }
diff --git a/web/src/pages/admin/skill-curation-page.css b/web/src/pages/admin/skill-curation-page.css
index a768c1038..200f45942 100644
--- a/web/src/pages/admin/skill-curation-page.css
+++ b/web/src/pages/admin/skill-curation-page.css
@@ -1,29 +1,396 @@
-.admin-skill-curation-section-heading {
+.admin-skill-curation {
     display: flex;
-    align-items: flex-start;
+    width: 100%;
+    min-width: 0;
+    flex-direction: column;
+    gap: 16px;
+    padding-bottom: 24px;
+}
+
+.admin-skill-curation-policy {
+    display: flex;
+    min-width: 0;
+    min-height: 112px;
+    align-items: center;
+    gap: 14px;
+    border: 1px solid var(--admin-card-border);
+    border-radius: var(--r-lg);
+    background: var(--admin-layer-1);
+    padding: 18px 20px;
+    box-shadow: var(--admin-card-shadow);
+}
+
+.admin-skill-curation-policy-icon {
+    display: grid;
+    width: 38px;
+    height: 38px;
+    flex: 0 0 auto;
+    place-items: center;
+    border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent);
+    border-radius: 9px;
+    background: var(--admin-layer-2);
+    color: var(--admin-text-secondary);
+}
+
+.admin-skill-curation-policy-copy {
+    min-width: 0;
+    flex: 1 1 auto;
+}
+
+.admin-skill-curation-policy-title {
+    color: var(--admin-text-primary);
+    font-size: 14px;
+    font-weight: 650;
+}
+
+.admin-skill-curation-policy-copy p {
+    max-width: 980px;
+    margin: 6px 0 0;
+    color: var(--admin-text-secondary);
+    font-size: 12px;
+    line-height: 1.65;
+}
+
+.admin-skill-curation-policy-control {
+    display: flex;
+    flex: 0 0 auto;
+    align-items: center;
+    gap: 10px;
+}
+
+.admin-skill-curation-workspace {
+    display: grid;
+    min-width: 0;
+    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
+    align-items: start;
+    gap: 16px;
+}
+
+.admin-skill-curation-detail-column {
+    display: flex;
+    min-width: 0;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.admin-skill-curation-tree-panel,
+.admin-skill-curation-editor-panel,
+.admin-skill-curation-assignment-panel {
+    min-width: 0;
+}
+
+.admin-skill-curation-tree-toolbar {
+    display: flex;
+    min-height: 54px;
+    align-items: center;
     justify-content: space-between;
     gap: 12px;
     border-bottom: 1px solid var(--admin-divider);
-    padding-bottom: 10px;
+    padding: 10px 16px;
 }
 
-.admin-skill-curation-section-heading h3 {
-    margin: 0;
+.admin-skill-curation-tree-toolbar-label {
+    min-width: 0;
+    color: var(--admin-text-secondary);
+    font-size: 12px;
+    font-weight: 600;
+}
+
+.admin-skill-curation-tree-list {
+    max-height: min(660px, calc(100dvh - 340px));
+    overflow: auto;
+    padding: 8px;
+}
+
+.admin-skill-curation-tree-loading {
+    display: grid;
+    min-height: 220px;
+    place-items: center;
+    color: var(--admin-text-muted);
+    font-size: 12px;
+}
+
+.admin-skill-curation-tree-branch {
+    min-width: 0;
+}
+
+.admin-skill-curation-tree-node-row {
+    display: flex;
+    min-width: 0;
+    align-items: stretch;
+    gap: 4px;
+}
+
+.admin-skill-curation-tree-node {
+    display: flex;
+    min-width: 0;
+    min-height: 44px;
+    flex: 1 1 auto;
+    align-items: center;
+    gap: 10px;
+    border: 1px solid transparent;
+    border-radius: var(--r-md, 8px);
+    background: transparent;
+    color: var(--admin-text-primary);
+    padding: 8px 10px;
+    text-align: left;
+    cursor: pointer;
+    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
+}
+
+.admin-skill-curation-tree-node:hover {
+    background: color-mix(in srgb, var(--foreground) 5%, transparent);
+}
+
+.admin-skill-curation-tree-node:focus-visible,
+.admin-skill-curation-tree-node-add:focus-visible {
+    outline: 2px solid color-mix(in srgb, var(--primary) 70%, transparent);
+    outline-offset: 1px;
+}
+
+.admin-skill-curation-tree-node.is-active {
+    border-color: color-mix(in srgb, var(--primary) 22%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--primary) 9%, var(--admin-layer-1));
+    color: var(--admin-text-primary);
+}
+
+.admin-skill-curation-tree-node-child {
+    min-height: 40px;
+    padding-block: 7px;
+}
+
+.admin-skill-curation-tree-node-child.is-disabled {
+    color: var(--admin-text-muted);
+}
+
+.admin-skill-curation-tree-node-icon {
+    display: grid;
+    width: 28px;
+    height: 28px;
+    flex: 0 0 auto;
+    place-items: center;
+    border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent);
+    border-radius: 7px;
+    background: var(--admin-layer-2);
+    color: var(--admin-text-secondary);
+}
+
+.admin-skill-curation-tree-node.is-active .admin-skill-curation-tree-node-icon {
+    border-color: color-mix(in srgb, var(--primary) 24%, transparent);
+    color: var(--primary);
+}
+
+.admin-skill-curation-tree-node-marker {
+    width: 6px;
+    height: 6px;
+    flex: 0 0 auto;
+    margin-left: 4px;
+    border-radius: 50%;
+    background: color-mix(in srgb, var(--admin-text-muted) 72%, transparent);
+}
+
+.admin-skill-curation-tree-node.is-active .admin-skill-curation-tree-node-marker {
+    background: var(--primary);
+}
+
+.admin-skill-curation-tree-node-copy {
+    display: flex;
+    min-width: 0;
+    flex: 1 1 auto;
+    flex-direction: column;
+    gap: 2px;
+}
+
+.admin-skill-curation-tree-node-name {
+    overflow-wrap: anywhere;
+    color: inherit;
+    font-size: 12px;
+    font-weight: 600;
+    line-height: 17px;
+}
+
+.admin-skill-curation-tree-node-meta {
+    display: flex;
+    min-width: 0;
+    align-items: center;
+    gap: 6px;
+    color: var(--admin-text-muted);
+    font-size: 10px;
+    font-weight: 500;
+    line-height: 15px;
+}
+
+.admin-skill-curation-tree-node-chevron {
+    flex: 0 0 auto;
+    color: var(--admin-text-muted);
+}
+
+.admin-skill-curation-tree-node-add {
+    width: 34px;
+    min-width: 34px;
+    height: 34px;
+    align-self: center;
+    color: var(--admin-text-muted);
+}
+
+.admin-skill-curation-tree-node-add:hover {
+    color: var(--primary);
+}
+
+.admin-skill-curation-tree-children {
+    display: grid;
+    gap: 2px;
+    margin: 0 0 4px 24px;
+    border-left: 1px solid var(--admin-divider);
+    padding: 3px 0 3px 10px;
+}
+
+.admin-skill-curation-tree-orphans {
+    display: grid;
+    gap: 2px;
+    margin-top: 10px;
+    border-top: 1px solid var(--admin-divider);
+    padding-top: 10px;
+}
+
+.admin-skill-curation-tree-orphans-title {
+    padding: 2px 10px 6px;
+    color: var(--admin-text-muted);
+    font-size: 10px;
+    font-weight: 650;
+    letter-spacing: 0.02em;
+}
+
+.admin-skill-curation-form,
+.admin-skill-curation-assignment-form {
+    min-width: 0;
+    padding: 20px;
+}
+
+.admin-skill-curation-editor-context {
+    display: grid;
+    gap: 4px;
+    border: 1px solid var(--admin-divider);
+    border-radius: var(--r-md, 8px);
+    background: var(--admin-layer-2);
+    padding: 12px 14px;
+}
+
+.admin-skill-curation-editor-context strong {
     color: var(--admin-text-primary);
     font-size: 13px;
     font-weight: 650;
     line-height: 20px;
 }
 
-.admin-skill-curation-section-heading p {
-    margin: 2px 0 0;
+.admin-skill-curation-editor-context > span:last-child {
     color: var(--admin-text-muted);
     font-size: 11px;
     line-height: 17px;
 }
 
+.admin-skill-curation-editor-kicker {
+    color: var(--admin-text-muted);
+    font-size: 10px;
+    font-weight: 650;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+}
+
+.admin-skill-curation-editor-empty {
+    display: grid;
+    min-height: 260px;
+    place-items: center;
+    padding: 16px;
+}
+
+.admin-skill-curation-assignment-form {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 16px 18px;
+}
+
+.admin-skill-curation-fields {
+    display: grid;
+    min-width: 0;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 16px 18px;
+    padding-top: 16px;
+}
+
 .admin-skill-curation-fields-root {
-    grid-template-columns: minmax(180px, 1.4fr) minmax(180px, 1fr) 96px 110px;
+    grid-template-columns: minmax(220px, 1fr) 112px 132px;
+}
+
+.admin-skill-curation-fields-category {
+    grid-template-columns: minmax(150px, 1.2fr) minmax(180px, 1.4fr) 96px 110px;
+}
+
+.admin-skill-curation-field {
+    display: flex;
+    min-width: 0;
+    flex-direction: column;
+    gap: 6px;
+    color: var(--admin-text-secondary);
+    font-size: 12px;
+    font-weight: 600;
+}
+
+.admin-skill-curation-field > span {
+    line-height: 18px;
+}
+
+.admin-skill-curation-field :where(.ant-input, .ant-input-affix-wrapper, .ant-input-number, .ant-select) {
+    width: 100%;
+}
+
+.admin-skill-curation-control {
+    width: 100%;
+}
+
+.admin-skill-curation-field.is-switch {
+    justify-content: flex-start;
+}
+
+.admin-skill-curation-switch-row {
+    display: flex;
+    min-height: 32px;
+    align-items: center;
+    gap: 8px;
+    color: var(--admin-text-secondary);
+    font-size: 12px;
+    font-weight: 500;
+}
+
+.admin-skill-curation-form-actions,
+.admin-skill-curation-assignment-footer {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    margin-top: 18px;
+    border-top: 1px solid var(--admin-divider);
+    padding-top: 14px;
+}
+
+.admin-skill-curation-assignment-footer {
+    grid-column: 1 / -1;
+    margin-top: 0;
+}
+
+.admin-skill-curation-hint {
+    min-width: 0;
+    color: var(--admin-text-muted);
+    font-size: 11px;
+    line-height: 1.5;
+}
+
+.admin-skill-curation-action-buttons {
+    display: flex;
+    flex: 0 0 auto;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin-left: auto;
 }
 
 .admin-skill-curation-icon-option {
@@ -32,23 +399,702 @@
     gap: 8px;
 }
 
-.admin-skill-curation-subsection {
-    display: flex;
-    flex-direction: column;
-    gap: 14px;
-    margin-top: 8px;
-    border-top: 1px solid var(--admin-divider);
-    padding-top: 18px;
+.admin-skill-curation-multi-select {
+    min-height: 32px;
 }
 
 @media (max-width: 1199px) {
-    .admin-skill-curation-fields-root {
+    .admin-skill-curation-workspace {
+        grid-template-columns: minmax(0, 1fr);
+    }
+
+    .admin-skill-curation-tree-list {
+        max-height: none;
+    }
+
+    .admin-skill-curation-fields-root,
+    .admin-skill-curation-fields-category {
         grid-template-columns: repeat(2, minmax(0, 1fr));
     }
 }
 
-@media (max-width: 639px) {
-    .admin-skill-curation-fields-root {
-        grid-template-columns: minmax(0, 1fr);
+@media (max-width: 720px) {
+    .admin-skill-curation-policy {
+        align-items: flex-start;
+        flex-wrap: wrap;
+    }
+
+    .admin-skill-curation-policy-copy {
+        flex-basis: calc(100% - 56px);
+    }
+
+    .admin-skill-curation-policy-control {
+        width: 100%;
+        justify-content: flex-start;
+        padding-left: 52px;
+    }
+}
+
+@media (max-width: 639px) {
+    .admin-skill-curation-policy,
+    .admin-skill-curation-form,
+    .admin-skill-curation-assignment-form {
+        padding-inline: 16px;
+    }
+
+    .admin-skill-curation-tree-toolbar {
+        align-items: flex-start;
+        flex-direction: column;
+        padding-inline: 16px;
+    }
+
+    .admin-skill-curation-tree-list {
+        padding-inline: 8px;
+    }
+
+    .admin-skill-curation-fields,
+    .admin-skill-curation-fields-root,
+    .admin-skill-curation-fields-category,
+    .admin-skill-curation-assignment-form {
+        grid-template-columns: minmax(0, 1fr);
+    }
+
+    .admin-skill-curation-assignment-footer {
+        grid-column: auto;
+    }
+
+    .admin-skill-curation-form-actions,
+    .admin-skill-curation-assignment-footer {
+        align-items: flex-start;
+        flex-direction: column;
+    }
+
+    .admin-skill-curation-action-buttons {
+        width: 100%;
+        justify-content: flex-end;
+    }
+
+    .admin-skill-curation-policy-copy {
+        flex-basis: calc(100% - 52px);
+    }
+
+    .admin-skill-curation-policy-control {
+        padding-left: 0;
+    }
+}
+
+/* Direct, always-visible choices for the curation workspace. */
+.admin-skill-curation-policy {
+    min-height: 96px;
+    border-color: color-mix(in srgb, var(--admin-accent) 12%, var(--admin-card-border));
+    border-radius: 10px;
+    background: color-mix(in srgb, var(--admin-layer-1) 94%, var(--admin-layer-2));
+    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--admin-accent) 5%, transparent), 0 12px 30px color-mix(in srgb, var(--foreground) 4%, transparent);
+}
+
+.admin-skill-curation-workspace {
+    grid-template-columns: minmax(300px, 0.34fr) minmax(0, 1fr);
+    gap: 20px;
+}
+
+.admin-skill-curation-tree-panel,
+.admin-skill-curation-editor-panel,
+.admin-skill-curation-assignment-panel {
+    border: 1px solid var(--admin-card-border);
+    box-shadow: 0 12px 30px color-mix(in srgb, var(--foreground) 4%, transparent);
+}
+
+.admin-skill-curation-tree-panel .admin-settings-section-summary,
+.admin-skill-curation-editor-panel .admin-settings-section-summary,
+.admin-skill-curation-assignment-panel .admin-settings-section-summary {
+    border-bottom: 1px solid var(--admin-divider);
+    background: color-mix(in srgb, var(--admin-layer-2) 68%, var(--admin-layer-1));
+}
+
+.admin-skill-curation-tree-toolbar {
+    min-height: 58px;
+    border-bottom-color: var(--admin-divider);
+    padding: 12px 16px;
+}
+
+.admin-skill-curation-tree-toolbar-label {
+    color: var(--admin-text-primary);
+    font-size: 11px;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+}
+
+.admin-skill-curation-tree-list {
+    max-height: none;
+    overflow: visible;
+    padding: 12px;
+}
+
+.admin-skill-curation-tree-branch {
+    padding-bottom: 6px;
+}
+
+.admin-skill-curation-tree-node-row {
+    gap: 6px;
+}
+
+.admin-skill-curation-tree-node {
+    min-height: 52px;
+    gap: 12px;
+    border-color: transparent;
+    border-radius: 10px;
+    background: color-mix(in srgb, var(--admin-layer-2) 44%, transparent);
+    padding: 10px 12px;
+    transition: background-color 160ms cubic-bezier(0.16, 1, 0.3, 1), border-color 160ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 160ms cubic-bezier(0.16, 1, 0.3, 1), transform 160ms cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.admin-skill-curation-tree-node:hover {
+    border-color: color-mix(in srgb, var(--admin-accent) 12%, var(--admin-card-border));
+    background: var(--admin-row-hover);
+}
+
+.admin-skill-curation-tree-node:active {
+    transform: none;
+}
+
+.admin-skill-curation-tree-node.is-active {
+    border-color: color-mix(in srgb, var(--admin-accent) 28%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--admin-accent) 9%, var(--admin-layer-1));
+    box-shadow: none;
+}
+
+.admin-skill-curation-tree-node-child {
+    min-height: 46px;
+    border-radius: 8px;
+    background: transparent;
+    padding-block: 8px;
+}
+
+.admin-skill-curation-tree-node-child:hover {
+    background: color-mix(in srgb, var(--admin-accent) 5%, var(--admin-layer-1));
+}
+
+.admin-skill-curation-tree-node-icon,
+.admin-skill-curation-direct-choice-icon {
+    width: 32px;
+    height: 32px;
+    border-color: color-mix(in srgb, var(--admin-accent) 14%, var(--admin-card-border));
+    border-radius: 9px;
+    background: color-mix(in srgb, var(--admin-layer-1) 66%, var(--admin-layer-2));
+}
+
+.admin-skill-curation-tree-node.is-active .admin-skill-curation-tree-node-icon,
+.admin-skill-curation-direct-choice.is-selected .admin-skill-curation-direct-choice-icon {
+    border-color: color-mix(in srgb, var(--admin-accent) 30%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--admin-accent) 10%, var(--admin-layer-1));
+    color: var(--admin-accent);
+}
+
+.admin-skill-curation-tree-node-name {
+    font-size: 13px;
+    font-weight: 650;
+    line-height: 18px;
+}
+
+.admin-skill-curation-tree-node-meta {
+    gap: 8px;
+    font-size: 10px;
+}
+
+.admin-skill-curation-tree-node-chevron {
+    color: color-mix(in srgb, var(--admin-text-muted) 75%, transparent);
+    transition: transform 160ms ease, color 160ms ease;
+}
+
+.admin-skill-curation-tree-node:hover .admin-skill-curation-tree-node-chevron,
+.admin-skill-curation-tree-node.is-active .admin-skill-curation-tree-node-chevron {
+    color: var(--admin-accent);
+}
+
+.admin-skill-curation-tree-node-add {
+    width: 38px;
+    min-width: 38px;
+    height: 38px;
+    border: 1px solid transparent;
+    border-radius: 9px;
+}
+
+.admin-skill-curation-tree-node-add:hover {
+    border-color: color-mix(in srgb, var(--admin-accent) 20%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--admin-accent) 8%, transparent);
+}
+
+.admin-skill-curation-tree-children {
+    gap: 3px;
+    margin: 4px 0 8px;
+    border-left: 0;
+    padding: 0;
+}
+
+.admin-skill-curation-tree-node-marker {
+    display: none;
+}
+
+.admin-skill-curation-tree-orphans {
+    gap: 4px;
+    margin-top: 14px;
+    border-top-color: var(--admin-divider);
+    padding-top: 14px;
+}
+
+.admin-skill-curation-tree-orphans-title {
+    padding: 2px 12px 7px;
+    color: var(--admin-text-secondary);
+    font-size: 10px;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+}
+
+.admin-skill-curation-form,
+.admin-skill-curation-assignment-form {
+    padding: 24px;
+}
+
+.admin-skill-curation-editor-context {
+    gap: 5px;
+    border: 0;
+    border-radius: 0;
+    background: transparent;
+    padding: 0;
+}
+
+.admin-skill-curation-editor-context strong {
+    font-size: 14px;
+    line-height: 21px;
+}
+
+.admin-skill-curation-editor-context > span:last-child {
+    max-width: 720px;
+    font-size: 11px;
+}
+
+.admin-skill-curation-fields {
+    gap: 20px 18px;
+    padding-top: 20px;
+}
+
+.admin-skill-curation-field {
+    gap: 8px;
+}
+
+.admin-skill-curation-field > span,
+.admin-skill-curation-field-heading > span {
+    color: var(--admin-text-secondary);
+    font-size: 11px;
+    font-weight: 650;
+    letter-spacing: 0.02em;
+}
+
+.admin-skill-curation-icon-field {
+    grid-column: 1 / -1;
+}
+
+.admin-skill-curation-icon-grid {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+}
+
+.admin-skill-curation-icon-choice,
+.admin-skill-curation-direct-choice,
+.admin-skill-curation-skill-choice,
+.admin-skill-curation-category-choice {
+    display: flex;
+    min-width: 0;
+    align-items: center;
+    gap: 10px;
+    border: 1px solid var(--admin-card-border);
+    border-radius: 9px;
+    background: color-mix(in srgb, var(--admin-layer-2) 42%, transparent);
+    color: var(--admin-text-primary);
+    cursor: pointer;
+    text-align: left;
+    transition: background-color 150ms cubic-bezier(0.16, 1, 0.3, 1), border-color 150ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 150ms cubic-bezier(0.16, 1, 0.3, 1), transform 150ms cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.admin-skill-curation-icon-choice {
+    width: auto;
+    min-height: 36px;
+    flex: 0 0 auto;
+    gap: 8px;
+    padding: 0 12px;
+    white-space: nowrap;
+}
+
+.admin-skill-curation-icon-choice:hover,
+.admin-skill-curation-icon-choice:active {
+    transform: none;
+}
+
+.admin-skill-curation-icon-choice > span {
+    white-space: nowrap;
+    overflow-wrap: normal;
+    font-size: 12px;
+    font-weight: 600;
+    line-height: 18px;
+}
+
+.admin-skill-curation-icon-choice.is-selected {
+    border-color: color-mix(in srgb, var(--admin-accent) 55%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--admin-accent) 12%, var(--admin-layer-1));
+    box-shadow: none;
+    color: var(--admin-text-primary);
+}
+
+.admin-skill-curation-icon-choice:hover,
+.admin-skill-curation-direct-choice:hover,
+.admin-skill-curation-skill-choice:hover,
+.admin-skill-curation-category-choice:hover {
+    border-color: color-mix(in srgb, var(--admin-accent) 22%, var(--admin-card-border));
+    background: var(--admin-row-hover);
+    transform: translateY(-1px);
+}
+
+.admin-skill-curation-icon-choice:active,
+.admin-skill-curation-direct-choice:active,
+.admin-skill-curation-skill-choice:active,
+.admin-skill-curation-category-choice:active {
+    transform: translateY(0) scale(0.995);
+}
+
+.admin-skill-curation-icon-choice.is-selected,
+.admin-skill-curation-direct-choice.is-selected,
+.admin-skill-curation-skill-choice.is-selected,
+.admin-skill-curation-category-choice.is-selected {
+    border-color: color-mix(in srgb, var(--admin-accent) 28%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--admin-accent) 8%, var(--admin-layer-1));
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-accent) 12%, transparent);
+}
+
+.admin-skill-curation-icon-choice:focus-visible,
+.admin-skill-curation-direct-choice:focus-visible,
+.admin-skill-curation-skill-choice:focus-visible,
+.admin-skill-curation-category-choice:focus-visible {
+    outline: 2px solid var(--admin-focus);
+    outline-offset: 2px;
+}
+
+.admin-skill-curation-icon-choice:disabled,
+.admin-skill-curation-direct-choice:disabled,
+.admin-skill-curation-skill-choice:disabled,
+.admin-skill-curation-category-choice:disabled {
+    cursor: not-allowed;
+    opacity: 0.48;
+    transform: none;
+}
+
+.admin-skill-curation-icon-choice-mark {
+    display: grid;
+    width: 26px;
+    height: 26px;
+    flex: 0 0 auto;
+    place-items: center;
+    border: 1px solid var(--admin-card-border);
+    border-radius: 7px;
+    background: var(--admin-layer-1);
+    color: var(--admin-text-secondary);
+}
+
+.admin-skill-curation-icon-choice.is-selected .admin-skill-curation-icon-choice-mark {
+    border-color: color-mix(in srgb, var(--admin-accent) 24%, var(--admin-card-border));
+    color: var(--admin-accent);
+}
+
+.admin-skill-curation-icon-choice > span:last-of-type,
+.admin-skill-curation-direct-choice-copy strong,
+.admin-skill-curation-skill-choice-copy strong,
+.admin-skill-curation-category-choice-copy strong {
+    min-width: 0;
+    overflow-wrap: anywhere;
+    font-size: 12px;
+    font-weight: 650;
+    line-height: 17px;
+}
+
+.admin-skill-curation-choice-check {
+    flex: 0 0 auto;
+    margin-left: auto;
+    color: var(--admin-accent);
+}
+
+.admin-skill-curation-direct-list,
+.admin-skill-curation-skill-list,
+.admin-skill-curation-category-list {
+    display: grid;
+    min-width: 0;
+    gap: 7px;
+}
+
+.admin-skill-curation-direct-choice {
+    min-height: 52px;
+    padding: 9px 11px;
+}
+
+.admin-skill-curation-direct-choice-copy,
+.admin-skill-curation-skill-choice-copy,
+.admin-skill-curation-category-choice-copy {
+    display: grid;
+    min-width: 0;
+    flex: 1 1 auto;
+    gap: 2px;
+}
+
+.admin-skill-curation-direct-choice-copy small,
+.admin-skill-curation-skill-choice-copy small,
+.admin-skill-curation-category-choice-copy small,
+.admin-skill-curation-field-heading small {
+    overflow-wrap: anywhere;
+    color: var(--admin-text-muted);
+    font-size: 10px;
+    font-weight: 500;
+    line-height: 15px;
+}
+
+.admin-skill-curation-direct-empty {
+    display: grid;
+    min-height: 48px;
+    place-items: center;
+    border: 1px dashed color-mix(in srgb, var(--admin-text-muted) 34%, var(--admin-card-border));
+    border-radius: 9px;
+    color: var(--admin-text-muted);
+    font-size: 11px;
+    line-height: 17px;
+    padding: 10px 12px;
+    text-align: center;
+}
+
+.admin-skill-curation-field-heading {
+    display: flex;
+    min-width: 0;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 12px;
+}
+
+.admin-skill-curation-field-heading small {
+    min-width: 0;
+    text-align: right;
+}
+
+.admin-skill-curation-assignment-search,
+.admin-skill-curation-skill-field,
+.admin-skill-curation-assignment-root-field,
+.admin-skill-curation-assignment-category-field {
+    grid-column: 1 / -1;
+}
+
+.admin-skill-curation-skill-list {
+    display: grid;
+    max-height: 240px;
+    grid-auto-rows: 36px;
+    gap: 2px;
+    overflow: auto;
+    border: 1px solid var(--admin-card-border);
+    border-radius: 8px;
+    background: transparent;
+    padding: 4px;
+}
+
+.admin-skill-curation-skill-row {
+    display: grid;
+    min-width: 0;
+    height: 36px;
+    grid-template-columns: minmax(0, 1fr) auto auto;
+    align-items: center;
+    gap: 12px;
+    border: 0;
+    border-radius: 6px;
+    background: transparent;
+    color: var(--admin-text-primary);
+    padding: 0 10px;
+    text-align: left;
+    cursor: pointer;
+}
+
+.admin-skill-curation-skill-row strong,
+.admin-skill-curation-skill-row em {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.admin-skill-curation-skill-row strong {
+    font-size: 13px;
+    font-weight: 600;
+}
+
+.admin-skill-curation-skill-row em {
+    color: var(--admin-text-muted);
+    font-size: 12px;
+    font-style: normal;
+}
+
+.admin-skill-curation-skill-row svg {
+    color: var(--admin-text-primary);
+}
+
+.admin-skill-curation-skill-row:hover {
+    background: var(--admin-row-hover);
+}
+
+.admin-skill-curation-skill-row.is-selected {
+    background: color-mix(in srgb, var(--admin-accent) 10%, var(--admin-layer-1));
+}
+
+.admin-skill-curation-skill-row:focus-visible,
+.admin-skill-curation-assign-chip:focus-visible {
+    outline: 2px solid var(--admin-focus);
+    outline-offset: 1px;
+}
+
+.admin-skill-curation-assign-chips {
+    display: flex;
+    min-width: 0;
+    flex-wrap: wrap;
+    gap: 8px;
+}
+
+.admin-skill-curation-assign-chips.is-disabled {
+    opacity: 0.62;
+}
+
+.admin-skill-curation-assign-chip {
+    display: inline-flex;
+    min-height: 36px;
+    flex: 0 0 auto;
+    align-items: center;
+    gap: 8px;
+    border: 1px solid var(--admin-card-border);
+    border-radius: 8px;
+    background: transparent;
+    color: var(--admin-text-primary);
+    padding: 0 12px;
+    white-space: nowrap;
+    cursor: pointer;
+}
+
+.admin-skill-curation-assign-chip span {
+    font-size: 12px;
+    font-weight: 600;
+    line-height: 18px;
+}
+
+.admin-skill-curation-assign-chip:hover:not(:disabled) {
+    background: var(--admin-row-hover);
+}
+
+.admin-skill-curation-assign-chip.is-selected {
+    border-color: color-mix(in srgb, var(--admin-accent) 55%, var(--admin-card-border));
+    background: color-mix(in srgb, var(--admin-accent) 12%, var(--admin-layer-1));
+}
+
+.admin-skill-curation-assign-chip:disabled {
+    cursor: not-allowed;
+    opacity: 0.48;
+}
+
+.admin-skill-curation-skill-choice {
+    min-height: 48px;
+    border-color: transparent;
+    background: transparent;
+    padding: 9px 10px;
+}
+
+.admin-skill-curation-skill-choice:hover {
+    border-color: var(--admin-card-border);
+}
+
+.admin-skill-curation-skill-choice-chevron {
+    flex: 0 0 auto;
+    color: var(--admin-text-muted);
+}
+
+.admin-skill-curation-assignment-root-field,
+.admin-skill-curation-assignment-category-field {
+    min-width: 0;
+}
+
+.admin-skill-curation-category-list {
+    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
+}
+
+.admin-skill-curation-category-choice {
+    min-height: 50px;
+    padding: 9px 10px;
+}
+
+.admin-skill-curation-category-choice-check {
+    display: grid;
+    width: 20px;
+    height: 20px;
+    flex: 0 0 auto;
+    place-items: center;
+    border: 1px solid color-mix(in srgb, var(--admin-text-muted) 44%, var(--admin-card-border));
+    border-radius: 6px;
+    color: var(--admin-accent-fg);
+}
+
+.admin-skill-curation-category-choice.is-selected .admin-skill-curation-category-choice-check {
+    border-color: var(--admin-accent);
+    background: var(--admin-accent);
+}
+
+.admin-skill-curation-category-list.is-disabled {
+    opacity: 0.62;
+}
+
+.admin-skill-curation-form-actions,
+.admin-skill-curation-assignment-footer {
+    margin-top: 22px;
+    padding-top: 16px;
+}
+
+.admin-skill-curation-action-buttons {
+    gap: 8px;
+}
+
+@media (max-width: 1199px) {
+    .admin-skill-curation-workspace {
+        grid-template-columns: minmax(0, 1fr);
+    }
+
+    .admin-skill-curation-tree-list {
+        max-height: none;
+    }
+}
+
+@media (max-width: 639px) {
+    .admin-skill-curation-form,
+    .admin-skill-curation-assignment-form {
+        padding: 20px 16px;
+    }
+
+    .admin-skill-curation-icon-grid {
+        display: flex;
+    }
+
+    .admin-skill-curation-category-list {
+        grid-template-columns: minmax(0, 1fr);
+    }
+
+    .admin-skill-curation-skill-list {
+        max-height: 260px;
+    }
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .admin-skill-curation-tree-node,
+    .admin-skill-curation-tree-node-chevron,
+    .admin-skill-curation-icon-choice,
+    .admin-skill-curation-direct-choice,
+    .admin-skill-curation-skill-choice,
+    .admin-skill-curation-category-choice {
+        transition: none;
     }
 }
diff --git a/web/src/pages/admin/skill-curation-page.tsx b/web/src/pages/admin/skill-curation-page.tsx
index 714580f9e..7eca42f4d 100644
--- a/web/src/pages/admin/skill-curation-page.tsx
+++ b/web/src/pages/admin/skill-curation-page.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useState } from "react";
-import { Alert, App, Button, Input, InputNumber, Select } from "antd";
-import { Check, Edit3, Plus, RefreshCw, Shapes, SlidersHorizontal } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+import { Alert, App, Button, Input, InputNumber } from "antd";
+import { Check, CheckCircle2, ChevronRight, FolderTree, Plus, RefreshCw, Search, Shapes, SlidersHorizontal } from "lucide-react";
 import { AdminPageFrame } from "./components/admin-shell";
-import { AdminDataTable, AdminStatusBadge, AdminTableEmpty, SettingsSectionCard } from "./components/admin-ui";
+import { AdminStatusBadge, AdminTableEmpty, SettingsSectionCard } from "./components/admin-ui";
 import { AdminSwitch } from "./ui/controls";
 import { getSkillCuration, updateSkillCuration, type CurationCategory, type CurationChange, type CurationRoot, type SkillCuration } from "@/services/api/skill-curation";
 import { curationIcon, curationIconKeys, curationIconLabels } from "@/components/skills/skill-curation-browser";
@@ -12,6 +12,17 @@ import "./skill-curation-page.css";
 const emptyRoot = (): CurationRoot => ({ id: "", name: "", iconKey: "shapes", sortOrder: 0, enabled: true });
 const emptyCategory = (rootTag = "drama"): CurationCategory => ({ id: "", rootTag, name: "", sortOrder: 0, enabled: true });
 
+type EditorTarget =
+    | { kind: "root"; id: string }
+    | { kind: "category"; id: string }
+    | { kind: "new-root" }
+    | { kind: "new-category"; rootTag: string }
+    | null;
+
+function normalizeName(value: string) {
+    return value.replace(/\s+/g, " ").trim();
+}
+
 export default function SkillCurationPage() {
     const { message } = App.useApp();
     const [data, setData] = useState<SkillCuration | null>(null);
@@ -19,15 +30,34 @@ export default function SkillCurationPage() {
     const [busy, setBusy] = useState(false);
     const [root, setRoot] = useState<CurationRoot>(emptyRoot);
     const [category, setCategory] = useState<CurationCategory>(emptyCategory);
+    const [target, setTarget] = useState<EditorTarget>(null);
     const [search, setSearch] = useState("");
     const [skills, setSkills] = useState<Skill[]>([]);
     const [skillId, setSkillId] = useState("");
     const [assignedRoot, setAssignedRoot] = useState("");
     const [categoryIds, setCategoryIds] = useState<string[]>([]);
 
+    const sortedRoots = useMemo(() => [...(data?.roots || [])].sort((a, b) => a.sortOrder - b.sortOrder || a.name.localeCompare(b.name)), [data?.roots]);
+    const sortedCategories = useMemo(() => [...(data?.categories || [])].sort((a, b) => a.sortOrder - b.sortOrder || a.name.localeCompare(b.name)), [data?.categories]);
+    const categoriesByRoot = useMemo(() => {
+        const grouped = new Map<string, CurationCategory[]>();
+        sortedCategories.forEach((item) => {
+            const list = grouped.get(item.rootTag) || [];
+            list.push(item);
+            grouped.set(item.rootTag, list);
+        });
+        return grouped;
+    }, [sortedCategories]);
+    const orphanCategories = useMemo(() => sortedCategories.filter((item) => !data?.roots?.some((rootItem) => rootItem.id === item.rootTag)), [data?.roots, sortedCategories]);
+
     const selectedSkill = skills.find((skill) => skill.skillId === skillId);
     const selectedRoot = data?.roots?.find((item) => item.id === assignedRoot);
     const availableCategories = data?.categories.filter((item) => item.enabled && item.rootTag === (assignedRoot || selectedSkill?.tag)) ?? [];
+    const selectedEditorRootId = target?.kind === "root" ? target.id : target?.kind === "category" ? category.rootTag : target?.kind === "new-category" ? target.rootTag : "";
+    const editorIsRoot = target?.kind === "root" || target?.kind === "new-root";
+    const editorIsCategory = target?.kind === "category" || target?.kind === "new-category";
+    const editorTitle = target?.kind === "new-root" ? "新增一级分类" : target?.kind === "new-category" ? "新增子分类" : target?.kind === "root" ? `编辑一级分类 · ${root.name || "未命名"}` : target?.kind === "category" ? `编辑子分类 · ${category.name || "未命名"}` : "选择一个分类";
+    const editorDescription = editorIsRoot ? "一级分类用于组织技能库的主导航和图示。" : editorIsCategory ? "子分类必须归属于一个启用中的一级分类。" : "从左侧分类树选择一个节点，或先创建新的一级分类。";
 
     const reload = async () => {
         try {
@@ -59,12 +89,37 @@ export default function SkillCurationPage() {
         };
     }, [search]);
 
-    const save = async (change: CurationChange) => {
+    useEffect(() => {
+        if (!data || target) return;
+        const firstRoot = sortedRoots[0];
+        if (firstRoot) {
+            setRoot({ ...firstRoot });
+            setTarget({ kind: "root", id: firstRoot.id });
+        }
+    }, [data, sortedRoots, target]);
+
+    useEffect(() => {
+        if (!data || !target) return;
+        if (target.kind === "root") {
+            const next = data.roots?.find((item) => item.id === target.id);
+            if (next) setRoot({ ...next });
+            else setTarget(null);
+        }
+        if (target.kind === "category") {
+            const next = data.categories.find((item) => item.id === target.id);
+            if (next) setCategory({ ...next });
+            else setTarget(null);
+        }
+    }, [data, target]);
+
+    const save = async (change: CurationChange, onSaved?: (next: SkillCuration) => void) => {
         if (!data) return;
         setBusy(true);
         try {
-            setData(await updateSkillCuration(data.revision, change));
+            const next = await updateSkillCuration(data.revision, change);
+            setData(next);
             setError("");
+            onSaved?.(next);
             message.success("已保存");
             window.dispatchEvent(new Event("canvas-skills-changed"));
         } catch (e) {
@@ -74,6 +129,68 @@ export default function SkillCurationPage() {
         }
     };
 
+    const selectRoot = (item: CurationRoot) => {
+        setRoot({ ...item });
+        setTarget({ kind: "root", id: item.id });
+    };
+
+    const selectCategory = (item: CurationCategory) => {
+        setCategory({ ...item });
+        setTarget({ kind: "category", id: item.id });
+    };
+
+    const startNewRoot = () => {
+        setRoot(emptyRoot());
+        setTarget({ kind: "new-root" });
+    };
+
+    const startNewCategory = (rootId = selectedEditorRootId) => {
+        const nextRootId = rootId && sortedRoots.some((item) => item.id === rootId && item.enabled) ? rootId : sortedRoots.find((item) => item.enabled)?.id || "";
+        if (!nextRootId) return;
+        setCategory(emptyCategory(nextRootId));
+        setTarget({ kind: "new-category", rootTag: nextRootId });
+    };
+
+    const resetEditor = () => {
+        if (target?.kind === "root") {
+            const current = data?.roots?.find((item) => item.id === target.id);
+            if (current) setRoot({ ...current });
+            return;
+        }
+        if (target?.kind === "category") {
+            const current = data?.categories.find((item) => item.id === target.id);
+            if (current) setCategory({ ...current });
+            return;
+        }
+        if (target?.kind === "new-category") {
+            setCategory(emptyCategory(target.rootTag));
+            return;
+        }
+        setRoot(emptyRoot());
+    };
+
+    const saveRoot = () => {
+        const payload = { ...root, name: normalizeName(root.name) };
+        void save({ root: payload }, (next) => {
+            const saved = next.roots?.find((item) => item.id === payload.id || item.name === payload.name);
+            if (saved) {
+                setRoot({ ...saved });
+                setTarget({ kind: "root", id: saved.id });
+            }
+        });
+    };
+
+    const saveCategory = () => {
+        const payload = { ...category, name: normalizeName(category.name) };
+        void save({ category: payload }, (next) => {
+            const saved = next.categories.find((item) => item.id === payload.id || (item.rootTag === payload.rootTag && item.name === payload.name));
+            if (saved) {
+                setCategory({ ...saved });
+                setTarget({ kind: "category", id: saved.id });
+            }
+        });
+    };
+
     const selectSkill = (id: string) => {
         const nextRoot = data?.rootAssignments?.find((item) => item.skillId === id)?.rootId || "";
         setSkillId(id);
@@ -109,270 +226,376 @@ export default function SkillCurationPage() {
                     </div>
                 </section>
 
-                <div className="admin-skill-curation-grid">
+                <div className="admin-skill-curation-workspace">
                     <SettingsSectionCard
                         layout="stacked"
-                        className="admin-skill-curation-panel"
-                        icon={<Shapes className="size-4" aria-hidden="true" />}
-                        title="分类维护"
-                        description="先维护一级分类和子分类，再把公开技能归入对应分类。"
-                        status={<AdminStatusBadge label={`${(data?.roots?.length ?? 0) + (data?.categories.length ?? 0)} 个分类`} tone="info" />}
+                        className="admin-skill-curation-tree-panel"
+                        icon={<FolderTree className="size-4" aria-hidden="true" />}
+                        title="分类树"
+                        description="选择分类后，在右侧编辑；也可以从这里直接新增。"
+                        status={<AdminStatusBadge label={`${(data?.roots?.length ?? 0) + (data?.categories.length ?? 0)} 个节点`} tone="info" />}
                     >
-                        <div className="admin-skill-curation-form" aria-label="一级分类编辑表单">
-                            <div className="admin-skill-curation-section-heading">
-                                <div>
-                                    <h3>一级分类</h3>
-                                    <p>一级分类用于组织技能库的主导航和图示。</p>
+                        <div className="admin-skill-curation-tree-toolbar">
+                            <span className="admin-skill-curation-tree-toolbar-label">一级分类与子分类</span>
+                            <Button size="small" icon={<Plus className="size-3.5" />} onClick={startNewRoot} disabled={busy}>
+                                新增一级
+                            </Button>
+                        </div>
+                        <div className="admin-skill-curation-tree-list" role="tree" aria-label="技能分类树">
+                            {!data ? (
+                                <div className="admin-skill-curation-tree-loading" role="status">
+                                    正在加载分类…
                                 </div>
-                                {root.id ? <AdminStatusBadge label={`正在编辑「${root.name}」`} tone="warning" /> : null}
-                            </div>
-                            <div className="admin-skill-curation-fields admin-skill-curation-fields-root">
-                                <label className="admin-skill-curation-field">
-                                    <span>分类名称</span>
-                                    <Input aria-label="一级分类名称" placeholder="例如：视频创作" maxLength={64} value={root.name} onChange={(e) => setRoot({ ...root, name: e.target.value })} />
-                                </label>
-                                <label className="admin-skill-curation-field">
-                                    <span>分类图示</span>
-                                    <Select
-                                        aria-label="一级分类图示"
-                                        className="admin-skill-curation-control"
-                                        value={root.iconKey || "shapes"}
-                                        options={curationIconKeys.map((key) => {
-                                            const Icon = curationIcon(key);
-                                            return {
-                                                value: key,
-                                                label: (
-                                                    <span className="admin-skill-curation-icon-option">
-                                                        <Icon className="size-3.5" />
-                                                        {curationIconLabels[key]}
+                            ) : sortedRoots.length ? (
+                                <>
+                                    {sortedRoots.map((rootItem) => {
+                                        const Icon = curationIcon(rootItem.iconKey);
+                                        const children = categoriesByRoot.get(rootItem.id) || [];
+                                        const active = (target?.kind === "root" && target.id === rootItem.id) || (target?.kind === "new-category" && target.rootTag === rootItem.id);
+                                        return (
+                                            <div key={rootItem.id} className="admin-skill-curation-tree-branch">
+                                                <div className="admin-skill-curation-tree-node-row">
+                                                    <button
+                                                        type="button"
+                                                        role="treeitem"
+                                                        aria-selected={active}
+                                                        className={`admin-skill-curation-tree-node admin-skill-curation-tree-node-root${active ? " is-active" : ""}`}
+                                                        onClick={() => selectRoot(rootItem)}
+                                                    >
+                                                        <span className="admin-skill-curation-tree-node-icon">
+                                                            <Icon className="size-4" aria-hidden="true" />
+                                                        </span>
+                                                        <span className="admin-skill-curation-tree-node-copy">
+                                                            <span className="admin-skill-curation-tree-node-name">{rootItem.name}</span>
+                                                            <span className="admin-skill-curation-tree-node-meta">
+                                                                {children.length ? `${children.length} 个子分类` : "暂无子分类"}
+                                                                {!rootItem.enabled ? <AdminStatusBadge label="已停用" tone="neutral" /> : null}
+                                                            </span>
+                                                        </span>
+                                                        <ChevronRight className="admin-skill-curation-tree-node-chevron size-4" aria-hidden="true" />
+                                                    </button>
+                                                    <Button
+                                                        type="text"
+                                                        size="small"
+                                                        className="admin-skill-curation-tree-node-add"
+                                                        icon={<Plus className="size-3.5" />}
+                                                        aria-label={`在${rootItem.name}下新增子分类`}
+                                                        title={rootItem.enabled ? "新增子分类" : "启用一级分类后才能新增子分类"}
+                                                        onClick={() => startNewCategory(rootItem.id)}
+                                                        disabled={busy || !rootItem.enabled}
+                                                    />
+                                                </div>
+                                                {children.length ? (
+                                                    <div className="admin-skill-curation-tree-children" role="group">
+                                                        {children.map((item) => {
+                                                            const childActive = target?.kind === "category" && target.id === item.id;
+                                                            return (
+                                                                <button
+                                                                    key={item.id}
+                                                                    type="button"
+                                                                    role="treeitem"
+                                                                    aria-selected={childActive}
+                                                                    className={`admin-skill-curation-tree-node admin-skill-curation-tree-node-child${childActive ? " is-active" : ""}${!item.enabled ? " is-disabled" : ""}`}
+                                                                    onClick={() => selectCategory(item)}
+                                                                >
+                                                                    <span className="admin-skill-curation-tree-node-marker" aria-hidden="true" />
+                                                                    <span className="admin-skill-curation-tree-node-copy">
+                                                                        <span className="admin-skill-curation-tree-node-name">{item.name}</span>
+                                                                        <span className="admin-skill-curation-tree-node-meta">{item.enabled ? "启用中" : "已停用"}</span>
+                                                                    </span>
+                                                                    <ChevronRight className="admin-skill-curation-tree-node-chevron size-3.5" aria-hidden="true" />
+                                                                </button>
+                                                            );
+                                                        })}
+                                                    </div>
+                                                ) : null}
+                                            </div>
+                                        );
+                                    })}
+                                    {orphanCategories.length ? (
+                                        <div className="admin-skill-curation-tree-orphans">
+                                            <div className="admin-skill-curation-tree-orphans-title">未关联一级分类</div>
+                                            {orphanCategories.map((item) => (
+                                                <button key={item.id} type="button" role="treeitem" aria-selected={target?.kind === "category" && target.id === item.id} className={`admin-skill-curation-tree-node admin-skill-curation-tree-node-child${target?.kind === "category" && target.id === item.id ? " is-active" : ""}`} onClick={() => selectCategory(item)}>
+                                                    <span className="admin-skill-curation-tree-node-marker" aria-hidden="true" />
+                                                    <span className="admin-skill-curation-tree-node-copy">
+                                                        <span className="admin-skill-curation-tree-node-name">{item.name}</span>
+                                                        <span className="admin-skill-curation-tree-node-meta">{item.enabled ? "启用中" : "已停用"}</span>
                                                     </span>
-                                                ),
-                                            };
+                                                    <ChevronRight className="admin-skill-curation-tree-node-chevron size-3.5" aria-hidden="true" />
+                                                </button>
+                                            ))}
+                                        </div>
+                                    ) : null}
+                                </>
+                            ) : (
+                                <AdminTableEmpty
+                                    title="还没有一级分类"
+                                    description="先创建一个一级分类，再继续添加子分类。"
+                                    action={
+                                        <Button type="primary" size="small" icon={<Plus className="size-3.5" />} onClick={startNewRoot}>
+                                            创建一级分类
+                                        </Button>
+                                    }
+                                />
+                            )}
+                        </div>
+                    </SettingsSectionCard>
+
+                    <div className="admin-skill-curation-detail-column">
+                        <SettingsSectionCard
+                            layout="stacked"
+                            className="admin-skill-curation-editor-panel"
+                            icon={<Shapes className="size-4" aria-hidden="true" />}
+                            title={editorTitle}
+                            description={editorDescription}
+                            status={editorIsRoot || editorIsCategory ? <AdminStatusBadge label={target?.kind?.startsWith("new-") ? "新建中" : "已选中"} tone={target?.kind?.startsWith("new-") ? "warning" : "info"} /> : <AdminStatusBadge label="未选择" tone="neutral" />}
+                        >
+                            {!data ? (
+                                <div className="admin-skill-curation-editor-empty" role="status">
+                                    正在加载编辑器…
+                                </div>
+                            ) : editorIsRoot ? (
+                                <div className="admin-skill-curation-form" aria-label="一级分类编辑表单">
+                                    <div className="admin-skill-curation-editor-context">
+                                        <span className="admin-skill-curation-editor-kicker">一级分类</span>
+                                        <strong>{root.id ? `正在编辑「${root.name || "未命名"}」` : "准备创建一个新的一级分类"}</strong>
+                                        <span>一级分类会显示在技能库主导航中，并决定子分类的归属。</span>
+                                    </div>
+                                    <div className="admin-skill-curation-fields admin-skill-curation-fields-root">
+                                        <label className="admin-skill-curation-field">
+                                            <span>分类名称</span>
+                                            <Input aria-label="一级分类名称" placeholder="例如：视频创作" maxLength={64} value={root.name} onChange={(e) => setRoot({ ...root, name: e.target.value })} />
+                                        </label>
+                                        <label className="admin-skill-curation-field is-order">
+                                            <span>排序</span>
+                                            <InputNumber aria-label="一级分类排序" className="admin-skill-curation-control" precision={0} min={0} value={root.sortOrder} onChange={(sortOrder) => setRoot({ ...root, sortOrder: sortOrder ?? 0 })} />
+                                        </label>
+                                        <div className="admin-skill-curation-field is-switch">
+                                            <span>状态</span>
+                                            <div className="admin-skill-curation-switch-row">
+                                                <AdminSwitch aria-label="一级分类启用" checked={root.enabled} onChange={(enabled) => setRoot({ ...root, enabled })} />
+                                                <span>{root.enabled ? "启用" : "停用"}</span>
+                                            </div>
+                                        </div>
+                                        <div className="admin-skill-curation-field admin-skill-curation-icon-field">
+                                            <span>分类图示</span>
+                                            <div className="admin-skill-curation-icon-grid" role="radiogroup" aria-label="一级分类图示">
+                                                {curationIconKeys.map((key) => {
+                                                    const Icon = curationIcon(key);
+                                                    const selected = (root.iconKey || "shapes") === key;
+                                                    return (
+                                                        <button key={key} type="button" role="radio" aria-checked={selected} className={`admin-skill-curation-icon-choice${selected ? " is-selected" : ""}`} onClick={() => setRoot({ ...root, iconKey: key })}>
+                                                            <Icon className="size-4" aria-hidden="true" />
+                                                            <span>{curationIconLabels[key]}</span>
+                                                        </button>
+                                                    );
+                                                })}
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div className="admin-skill-curation-form-actions">
+                                        <span className="admin-skill-curation-hint">停用一级分类后，技能仍保留原有数据，不再作为可选归类。</span>
+                                        <div className="admin-skill-curation-action-buttons">
+                                            <Button onClick={resetEditor} disabled={busy || (!root.id && !root.name)}>
+                                                {root.id ? "还原" : "清空"}
+                                            </Button>
+                                            <Button type="primary" icon={root.id ? <Check className="size-3.5" /> : <Plus className="size-3.5" />} loading={busy} disabled={!data || !root.name.trim()} onClick={saveRoot}>
+                                                {root.id ? "保存一级分类" : "新增一级分类"}
+                                            </Button>
+                                        </div>
+                                    </div>
+                                </div>
+                            ) : editorIsCategory ? (
+                                <div className="admin-skill-curation-form" aria-label="子分类编辑表单">
+                                    <div className="admin-skill-curation-editor-context">
+                                        <span className="admin-skill-curation-editor-kicker">子分类</span>
+                                        <strong>{category.id ? `正在编辑「${category.name || "未命名"}」` : "准备创建一个新的子分类"}</strong>
+                                        <span>子分类只能在创建后归属于当前一级分类，已保存的子分类不能移动到其他一级分类。</span>
+                                    </div>
+                                    <div className="admin-skill-curation-fields admin-skill-curation-fields-category">
+                                        <div className="admin-skill-curation-field admin-skill-curation-parent-field">
+                                            <span>所属一级分类</span>
+                                            <div className="admin-skill-curation-direct-list" role="radiogroup" aria-label="所属一级分类">
+                                                {sortedRoots.length ? (
+                                                    sortedRoots.map((item) => {
+                                                        const Icon = curationIcon(item.iconKey);
+                                                        const selected = category.rootTag === item.id;
+                                                        return (
+                                                            <button
+                                                                key={item.id}
+                                                                type="button"
+                                                                role="radio"
+                                                                aria-checked={selected}
+                                                                className={`admin-skill-curation-direct-choice${selected ? " is-selected" : ""}`}
+                                                                disabled={Boolean(category.id) || !item.enabled}
+                                                                onClick={() => setCategory({ ...category, rootTag: item.id })}
+                                                            >
+                                                                <span className="admin-skill-curation-direct-choice-icon">
+                                                                    <Icon className="size-3.5" aria-hidden="true" />
+                                                                </span>
+                                                                <span className="admin-skill-curation-direct-choice-copy">
+                                                                    <strong>{item.name}</strong>
+                                                                    <small>{item.enabled ? "可用于新建子分类" : "已停用"}</small>
+                                                                </span>
+                                                                {selected ? <CheckCircle2 className="admin-skill-curation-choice-check size-3.5" aria-hidden="true" /> : null}
+                                                            </button>
+                                                        );
+                                                    })
+                                                ) : (
+                                                    <div className="admin-skill-curation-direct-empty">还没有可用的一级分类</div>
+                                                )}
+                                            </div>
+                                        </div>
+                                        <label className="admin-skill-curation-field">
+                                            <span>子分类名称</span>
+                                            <Input aria-label="分类名称" placeholder="例如：分镜设计" value={category.name} maxLength={64} onChange={(e) => setCategory({ ...category, name: e.target.value })} />
+                                        </label>
+                                        <label className="admin-skill-curation-field is-order">
+                                            <span>排序</span>
+                                            <InputNumber aria-label="排序" className="admin-skill-curation-control" value={category.sortOrder} precision={0} min={0} onChange={(sortOrder) => setCategory({ ...category, sortOrder: sortOrder ?? 0 })} />
+                                        </label>
+                                        <div className="admin-skill-curation-field is-switch">
+                                            <span>状态</span>
+                                            <div className="admin-skill-curation-switch-row">
+                                                <AdminSwitch aria-label="分类启用" checked={category.enabled} onChange={(enabled) => setCategory({ ...category, enabled })} />
+                                                <span>{category.enabled ? "启用" : "停用"}</span>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div className="admin-skill-curation-form-actions">
+                                        <span className="admin-skill-curation-hint">{category.id ? `正在编辑「${category.name}」` : "新增后即可在技能归类中使用"}</span>
+                                        <div className="admin-skill-curation-action-buttons">
+                                            <Button onClick={resetEditor} disabled={busy || (!category.id && !category.name)}>
+                                                {category.id ? "还原" : "清空"}
+                                            </Button>
+                                            <Button type="primary" icon={category.id ? <Check className="size-3.5" /> : <Plus className="size-3.5" />} loading={busy} disabled={!data || !category.name.trim() || !category.rootTag} onClick={saveCategory}>
+                                                {category.id ? "保存子分类" : "新增子分类"}
+                                            </Button>
+                                        </div>
+                                    </div>
+                                </div>
+                            ) : (
+                                <div className="admin-skill-curation-editor-empty">
+                                    <AdminTableEmpty
+                                        title="还没有选择分类"
+                                        description="从左侧选择一个分类，或先创建一个新的一级分类。"
+                                        action={
+                                            <Button type="primary" size="small" icon={<Plus className="size-3.5" />} onClick={startNewRoot}>
+                                                新增一级分类
+                                            </Button>
+                                        }
+                                    />
+                                </div>
+                            )}
+                        </SettingsSectionCard>
+
+                        <SettingsSectionCard
+                            layout="stacked"
+                            className="admin-skill-curation-assignment-panel"
+                            icon={<Check className="size-4" aria-hidden="true" />}
+                            title="技能归类"
+                            description="搜索公开技能，选择一级分类和它应该出现的子分类。"
+                            status={<AdminStatusBadge label={skillId ? "已选择技能" : "等待选择"} tone={skillId ? "success" : "neutral"} />}
+                        >
+                            <div className="admin-skill-curation-assignment-form" aria-label="技能归类表单">
+                                <label className="admin-skill-curation-field admin-skill-curation-assignment-search">
+                                    <span>搜索技能</span>
+                                    <Input prefix={<Search className="size-3.5" aria-hidden="true" />} aria-label="搜索公开技能" placeholder="按名称搜索公开技能" value={search} onChange={(e) => setSearch(e.target.value)} allowClear />
+                                </label>
+                                <div className="admin-skill-curation-field admin-skill-curation-skill-field">
+                                    <div className="admin-skill-curation-field-heading">
+                                        <span>选择技能</span>
+                                        <small>{skills.length ? `${skills.length} 个结果` : search ? "没有匹配结果" : "暂无公开技能"}</small>
+                                    </div>
+                                    <div className="admin-skill-curation-skill-list" role="listbox" aria-label="选择技能">
+                                        {skills.length ? (
+                                            skills.map((skill) => {
+                                                const selected = skill.skillId === skillId;
+                                                return (
+                                                    <button key={skill.skillId} type="button" role="option" aria-selected={selected} className={`admin-skill-curation-skill-row${selected ? " is-selected" : ""}`} onClick={() => selectSkill(skill.skillId)}>
+                                                        <strong>{skill.skillName || skill.skillId}</strong>
+                                                        <em>{skill.tag || "未分类"}</em>
+                                                        {selected ? <Check className="size-3.5" aria-hidden="true" /> : null}
+                                                    </button>
+                                                );
+                                            })
+                                        ) : (
+                                            <div className="admin-skill-curation-direct-empty">{search ? "没有找到匹配的公开技能" : "暂无公开技能"}</div>
+                                        )}
+                                    </div>
+                                </div>
+                                <div className="admin-skill-curation-field admin-skill-curation-assignment-root-field">
+                                    <div className="admin-skill-curation-field-heading">
+                                        <span>技能一级分类</span>
+                                        <small>{assignedRoot ? selectedRoot?.name || "已指定分类" : "沿用原始分类"}</small>
+                                    </div>
+                                    <div className="admin-skill-curation-assign-chips" role="radiogroup" aria-label="技能一级分类">
+                                        <button
+                                            type="button"
+                                            role="radio"
+                                            aria-checked={!assignedRoot}
+                                            className={`admin-skill-curation-assign-chip${!assignedRoot ? " is-selected" : ""}`}
+                                            onClick={() => {
+                                                setAssignedRoot("");
+                                                setCategoryIds([]);
+                                            }}
+                                        >
+                                            <Shapes className="size-4" aria-hidden="true" />
+                                            <span>按原始分类{selectedSkill?.tag ? ` · ${selectedSkill.tag}` : ""}</span>
+                                        </button>
+                                        {sortedRoots.map((item) => {
+                                            const Icon = curationIcon(item.iconKey);
+                                            const selected = assignedRoot === item.id;
+                                            return (
+                                                <button
+                                                    key={item.id}
+                                                    type="button"
+                                                    role="radio"
+                                                    aria-checked={selected}
+                                                    className={`admin-skill-curation-assign-chip${selected ? " is-selected" : ""}`}
+                                                    disabled={!item.enabled}
+                                                    onClick={() => {
+                                                        setAssignedRoot(item.id);
+                                                        setCategoryIds([]);
+                                                    }}
+                                                >
+                                                    <Icon className="size-4" aria-hidden="true" />
+                                                    <span>{item.name}</span>
+                                                </button>
+                                            );
                                         })}
-                                        onChange={(iconKey) => setRoot({ ...root, iconKey })}
-                                    />
-                                </label>
-                                <label className="admin-skill-curation-field is-order">
-                                    <span>排序</span>
-                                    <InputNumber aria-label="一级分类排序" className="admin-skill-curation-control" precision={0} min={0} value={root.sortOrder} onChange={(sortOrder) => setRoot({ ...root, sortOrder: sortOrder ?? 0 })} />
-                                </label>
-                                <div className="admin-skill-curation-field is-switch">
-                                    <span>状态</span>
-                                    <div className="admin-skill-curation-switch-row">
-                                        <AdminSwitch aria-label="一级分类启用" checked={root.enabled} onChange={(enabled) => setRoot({ ...root, enabled })} />
-                                        <span>{root.enabled ? "启用" : "停用"}</span>
                                     </div>
                                 </div>
-                            </div>
-                            <div className="admin-skill-curation-form-actions">
-                                <span className="admin-skill-curation-hint">停用一级分类后，技能仍保留原有数据，不再作为可选归类。</span>
-                                <div className="admin-skill-curation-action-buttons">
-                                    <Button onClick={() => setRoot(emptyRoot())} disabled={busy || (!root.id && !root.name)}>
-                                        清空
-                                    </Button>
-                                    <Button type="primary" icon={root.id ? <Check className="size-3.5" /> : <Plus className="size-3.5" />} loading={busy} disabled={!data || !root.name.trim()} onClick={() => void save({ root })}>
-                                        {root.id ? "保存一级分类" : "新增一级分类"}
-                                    </Button>
-                                </div>
-                            </div>
-                        </div>
-
-                        <div className="admin-skill-curation-table-wrap">
-                            <AdminDataTable<CurationRoot>
-                                className="admin-skill-curation-table"
-                                table={{
-                                    rowKey: "id",
-                                    dataSource: data?.roots || [],
-                                    pagination: false,
-                                    loading: !data,
-                                    columns: [
-                                        { title: "一级分类", dataIndex: "name" },
-                                        {
-                                            title: "图示",
-                                            width: 88,
-                                            render: (_, item) => {
-                                                const Icon = curationIcon(item.iconKey);
-                                                return <Icon className="size-4" aria-hidden="true" />;
-                                            },
-                                        },
-                                        { title: "排序", dataIndex: "sortOrder", width: 78, align: "center" },
-                                        { title: "状态", width: 90, render: (_, item) => <AdminStatusBadge label={item.enabled ? "启用" : "停用"} tone={item.enabled ? "success" : "neutral"} /> },
-                                        {
-                                            title: "操作",
-                                            width: 90,
-                                            render: (_, item) => (
-                                                <Button type="text" size="small" className="admin-row-action admin-row-action-primary" icon={<Edit3 className="size-3.5" />} onClick={() => setRoot({ ...item })}>
-                                                    编辑
-                                                </Button>
-                                            ),
-                                        },
-                                    ],
-                                }}
-                                empty={
-                                    <AdminTableEmpty
-                                        title="还没有一级分类"
-                                        description="先创建一个一级分类，再继续添加子分类。"
-                                        action={
-                                            <Button type="primary" size="small" icon={<Plus className="size-3.5" />} onClick={() => document.querySelector<HTMLInputElement>("[aria-label=一级分类名称]")?.focus()}>
-                                                创建一级分类
-                                            </Button>
-                                        }
-                                    />
-                                }
-                            />
-                        </div>
-
-                        <div className="admin-skill-curation-subsection">
-                            <div className="admin-skill-curation-section-heading">
-                                <div>
-                                    <h3>子分类</h3>
-                                    <p>子分类必须归属于一个启用中的一级分类。</p>
-                                </div>
-                            </div>
-                            <div className="admin-skill-curation-fields admin-skill-curation-fields-category">
-                                <label className="admin-skill-curation-field">
-                                    <span>所属一级分类</span>
-                                    <Select
-                                        aria-label="所属一级分类"
-                                        className="admin-skill-curation-control"
-                                        value={category.rootTag}
-                                        disabled={Boolean(category.id)}
-                                        options={data?.roots?.map((item) => ({ value: item.id, label: item.name, disabled: !item.enabled }))}
-                                        onChange={(rootTag) => setCategory({ ...category, rootTag })}
-                                    />
-                                </label>
-                                <label className="admin-skill-curation-field">
-                                    <span>子分类名称</span>
-                                    <Input aria-label="分类名称" placeholder="例如：分镜设计" value={category.name} maxLength={64} onChange={(e) => setCategory({ ...category, name: e.target.value })} />
-                                </label>
-                                <label className="admin-skill-curation-field is-order">
-                                    <span>排序</span>
-                                    <InputNumber aria-label="排序" className="admin-skill-curation-control" value={category.sortOrder} precision={0} min={0} onChange={(sortOrder) => setCategory({ ...category, sortOrder: sortOrder ?? 0 })} />
-                                </label>
-                                <div className="admin-skill-curation-field is-switch">
-                                    <span>状态</span>
-                                    <div className="admin-skill-curation-switch-row">
-                                        <AdminSwitch aria-label="分类启用" checked={category.enabled} onChange={(enabled) => setCategory({ ...category, enabled })} />
-                                        <span>{category.enabled ? "启用" : "停用"}</span>
+                                <div className="admin-skill-curation-field admin-skill-curation-assignment-category-field">
+                                    <div className="admin-skill-curation-field-heading">
+                                        <span>技能子分类</span>
+                                        <small>{selectedSkill ? `${categoryIds.length} 个已选` : "先选择技能"}</small>
+                                    </div>
+                                    <div className={`admin-skill-curation-assign-chips${!selectedSkill ? " is-disabled" : ""}`} role="listbox" aria-label="技能子分类" aria-multiselectable="true">
+                                        {availableCategories.length ? (
+                                            availableCategories.map((item) => {
+                                                const selected = categoryIds.includes(item.id);
+                                                return (
+                                                    <button key={item.id} type="button" role="option" aria-selected={selected} aria-pressed={selected} className={`admin-skill-curation-assign-chip${selected ? " is-selected" : ""}`} disabled={!selectedSkill} onClick={() => setCategoryIds((current) => (selected ? current.filter((id) => id !== item.id) : [...current, item.id]))}>
+                                                        <span>{item.name}</span>
+                                                    </button>
+                                                );
+                                            })
+                                        ) : (
+                                            <div className="admin-skill-curation-direct-empty">{selectedSkill ? (selectedRoot || assignedRoot ? "该一级分类暂无启用的子分类" : "原始分类下暂无启用的子分类") : "先选择技能"}</div>
+                                        )}
                                     </div>
                                 </div>
-                            </div>
-                            <div className="admin-skill-curation-form-actions">
-                                <span className="admin-skill-curation-hint">{category.id ? `正在编辑「${category.name}」` : "新增后即可在技能归类中使用"}</span>
-                                <div className="admin-skill-curation-action-buttons">
-                                    <Button onClick={() => setCategory(emptyCategory(data?.roots?.[0]?.id || "drama"))} disabled={busy || (!category.id && !category.name)}>
-                                        清空
-                                    </Button>
-                                    <Button type="primary" icon={category.id ? <Check className="size-3.5" /> : <Plus className="size-3.5" />} loading={busy} disabled={!data || !category.name.trim()} onClick={() => void save({ category })}>
-                                        {category.id ? "保存分类" : "新增子分类"}
+                                <div className="admin-skill-curation-assignment-footer">
+                                    <span className="admin-skill-curation-hint">{selectedSkill ? `当前技能：${selectedSkill.skillName}` : "未选择技能时不会修改任何归类"}</span>
+                                    <Button type="primary" loading={busy} disabled={!skillId || !data} onClick={() => void save({ assignment: { skillId, categoryIds, rootId: assignedRoot } })}>
+                                        保存技能归类
                                     </Button>
                                 </div>
                             </div>
-                        </div>
-
-                        <div className="admin-skill-curation-table-wrap">
-                            <AdminDataTable<CurationCategory>
-                                className="admin-skill-curation-table"
-                                table={{
-                                    rowKey: "id",
-                                    dataSource: data?.categories || [],
-                                    pagination: false,
-                                    loading: !data,
-                                    columns: [
-                                        { title: "一级分类", render: (_, row) => data?.roots?.find((item) => item.id === row.rootTag)?.name || "未归入启用分类" },
-                                        { title: "子分类", dataIndex: "name" },
-                                        { title: "排序", dataIndex: "sortOrder", width: 78, align: "center" },
-                                        { title: "状态", width: 90, render: (_, row) => <AdminStatusBadge label={row.enabled ? "启用" : "停用"} tone={row.enabled ? "success" : "neutral"} /> },
-                                        {
-                                            title: "操作",
-                                            width: 90,
-                                            render: (_, row) => (
-                                                <Button type="text" size="small" className="admin-row-action admin-row-action-primary" icon={<Edit3 className="size-3.5" />} onClick={() => setCategory({ ...row })}>
-                                                    编辑
-                                                </Button>
-                                            ),
-                                        },
-                                    ],
-                                }}
-                                empty={
-                                    <AdminTableEmpty
-                                        title="还没有子分类"
-                                        description="先在上方创建一个子分类，技能归类时就能直接选择。"
-                                        action={
-                                            <Button type="primary" size="small" icon={<Plus className="size-3.5" />} onClick={() => document.querySelector<HTMLInputElement>("[aria-label=分类名称]")?.focus()}>
-                                                创建子分类
-                                            </Button>
-                                        }
-                                    />
-                                }
-                            />
-                        </div>
-                    </SettingsSectionCard>
-
-                    <SettingsSectionCard
-                        layout="stacked"
-                        className="admin-skill-curation-panel"
-                        icon={<Check className="size-4" aria-hidden="true" />}
-                        title="技能归类"
-                        description="搜索公开技能，选择一级分类和它应该出现的子分类。"
-                        status={<AdminStatusBadge label={skillId ? "已选择技能" : "等待选择"} tone={skillId ? "success" : "neutral"} />}
-                    >
-                        <div className="admin-skill-curation-assignment-form" aria-label="技能归类表单">
-                            <label className="admin-skill-curation-field">
-                                <span>搜索技能</span>
-                                <Input aria-label="搜索公开技能" placeholder="按名称搜索公开技能" value={search} onChange={(e) => setSearch(e.target.value)} allowClear />
-                            </label>
-                            <label className="admin-skill-curation-field">
-                                <span>选择技能</span>
-                                <Select
-                                    aria-label="选择技能"
-                                    className="admin-skill-curation-control"
-                                    value={skillId || undefined}
-                                    placeholder="请选择一个技能"
-                                    options={skills.map((skill) => ({ value: skill.skillId, label: skill.skillName }))}
-                                    onChange={selectSkill}
-                                    showSearch
-                                    optionFilterProp="label"
-                                    notFoundContent={search ? "没有找到匹配的公开技能" : "暂无公开技能"}
-                                />
-                            </label>
-                            <label className="admin-skill-curation-field">
-                                <span>技能一级分类</span>
-                                <Select
-                                    aria-label="技能一级分类"
-                                    className="admin-skill-curation-control"
-                                    value={assignedRoot || undefined}
-                                    placeholder="按原始分类"
-                                    options={[{ value: "", label: "按原始分类" }, ...(data?.roots || []).map((item) => ({ value: item.id, label: item.name, disabled: !item.enabled }))]}
-                                    onChange={(id) => {
-                                        setAssignedRoot(id);
-                                        setCategoryIds([]);
-                                    }}
-                                />
-                            </label>
-                            <label className="admin-skill-curation-field">
-                                <span>技能子分类</span>
-                                <Select
-                                    mode="multiple"
-                                    aria-label="技能子分类"
-                                    className="admin-skill-curation-control admin-skill-curation-multi-select"
-                                    placeholder={selectedSkill ? "请选择一个或多个子分类" : "先选择技能"}
-                                    value={categoryIds}
-                                    disabled={!selectedSkill}
-                                    onChange={setCategoryIds}
-                                    options={availableCategories.map((item) => ({ value: item.id, label: item.name }))}
-                                    maxTagCount="responsive"
-                                    notFoundContent={selectedRoot || selectedSkill ? "该一级分类暂无启用的子分类" : "先选择技能"}
-                                />
-                            </label>
-                            <div className="admin-skill-curation-assignment-footer">
-                                <span className="admin-skill-curation-hint">{selectedSkill ? `当前技能：${selectedSkill.skillName}` : "未选择技能时不会修改任何归类"}</span>
-                                <Button type="primary" loading={busy} disabled={!skillId || !data} onClick={() => void save({ assignment: { skillId, categoryIds, rootId: assignedRoot } })}>
-                                    保存技能归类
-                                </Button>
-                            </div>
-                        </div>
-                    </SettingsSectionCard>
+                        </SettingsSectionCard>
+                    </div>
                 </div>
             </div>
         </AdminPageFrame>
diff --git a/web/src/styles/workspace-product.css b/web/src/styles/workspace-product.css
index fea94f3e3..2e939fcec 100644
--- a/web/src/styles/workspace-product.css
+++ b/web/src/styles/workspace-product.css
@@ -417,6 +417,9 @@
 }
 .app-product-workspace .skills-browse-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
 .app-product-workspace .skills-browse-bar .collection-toolbar { margin: 0; max-width: 100%; }
+.app-product-workspace .skill-curation-browser { display: flex; min-width: 0; max-width: 100%; align-items: center; gap: var(--space-2); }
+.app-product-workspace .skill-curation-browser-label { flex: 0 0 auto; color: var(--user-ink-muted); font-size: var(--fs-label); white-space: nowrap; }
+.app-product-workspace .skill-curation-browser-select { width: min(220px, 100%); min-width: 0; }
 
 .app-product-workspace .skills-scope-panel { display: grid; gap: 28px; padding: 0; animation: none; }
 .app-product-workspace .skills-library-layout { display: grid; grid-template-columns: minmax(208px, 236px) minmax(0, 1fr); align-items: start; gap: 24px; }