diff --git a/electron/main/ipc/comments.ts b/electron/main/ipc/comments.ts
index e4dbdbf0..8915b036 100644
--- a/electron/main/ipc/comments.ts
+++ b/electron/main/ipc/comments.ts
@@ -1,7 +1,13 @@
 import { ipcMain } from "electron";
 import { getCommentSources, getMusicComments } from "@main/services/comments";
+import { getCreatorComments } from "@main/services/comments/creator";
 import { coreLog } from "@main/utils/logger";
-import type { MusicCommentQuery, MusicCommentResponse } from "@shared/types/comment";
+import type {
+  MusicCommentCreatorQuery,
+  MusicCommentCreatorResponse,
+  MusicCommentQuery,
+  MusicCommentResponse,
+} from "@shared/types/comment";
 
 /** 注册评论 IPC */
 export const registerCommentsIpc = (): void => {
@@ -18,4 +24,16 @@ export const registerCommentsIpc = (): void => {
       }
     },
   );
+
+  ipcMain.handle(
+    "comments:creator",
+    async (_evt, args: MusicCommentCreatorQuery): Promise<MusicCommentCreatorResponse> => {
+      try {
+        return { ok: true, data: await getCreatorComments(args) };
+      } catch (err) {
+        coreLog.warn("[comments] creator failed:", err);
+        return { ok: false, error: err instanceof Error ? err.message : String(err) };
+      }
+    },
+  );
 };
diff --git a/electron/main/services/comments/creator.ts b/electron/main/services/comments/creator.ts
new file mode 100644
index 00000000..3d3426f4
--- /dev/null
+++ b/electron/main/services/comments/creator.ts
@@ -0,0 +1,145 @@
+import { callNetease } from "@main/apis/netease";
+import { coreLog } from "@main/utils/logger";
+import type { MusicCommentCreatorQuery, MusicCommentItem } from "@shared/types/comment";
+import { normalizeNeteaseCommentPage, scanCreatorComments } from "./data";
+import { findNeteaseSongMeta } from "./index";
+
+const NETEASE_SOURCE_ID = "builtin:netease";
+const NETEASE_RESOURCE_TYPE = "R_SO_4_";
+const HOT_LIMIT = 20;
+/** 首屏前两页未命中时，最多额外翻页数 */
+const MAX_EXTRA_PAGES = 3;
+const ARTIST_ACCOUNT_CACHE_LIMIT = 200;
+const CREATOR_COMMENTS_CACHE_LIMIT = 100;
+
+/**
+ * 简易有界 LRU Map
+ * Map 保持插入顺序，访问时移到末尾，超限时删除首项
+ */
+class BoundedMap<K, V> {
+  private readonly map = new Map<K, V>();
+  constructor(private readonly limit: number) {}
+
+  has(key: K): boolean {
+    return this.map.has(key);
+  }
+
+  get(key: K): V | undefined {
+    const v = this.map.get(key);
+    if (v !== undefined && this.map.size > 1) {
+      this.map.delete(key);
+      this.map.set(key, v);
+    }
+    return v;
+  }
+
+  set(key: K, value: V): void {
+    if (this.map.has(key)) this.map.delete(key);
+    this.map.set(key, value);
+    while (this.map.size > this.limit) {
+      const first = this.map.keys().next().value;
+      if (first === undefined) break;
+      this.map.delete(first);
+    }
+  }
+}
+
+/** artist id → 绑定的网易云用户 accountId（null 表示负缓存：未绑定） */
+const artistAccountIdCache = new BoundedMap<string, string | null>(ARTIST_ACCOUNT_CACHE_LIMIT);
+/** 网易云 songId → 主创评论列表（空数组表示负缓存：无主创评论） */
+const creatorCommentsCache = new BoundedMap<string, MusicCommentItem[]>(
+  CREATOR_COMMENTS_CACHE_LIMIT,
+);
+
+/** 拉取一页热门评论（归一化后返回） */
+const fetchHotPage = async (
+  songId: string,
+  page: number,
+): Promise<{ items: MusicCommentItem[]; hasMore: boolean }> => {
+  const { body } = await callNetease("comment_hot", {
+    id: songId,
+    type: NETEASE_RESOURCE_TYPE,
+    limit: HOT_LIMIT,
+    offset: (page - 1) * HOT_LIMIT,
+  });
+  const normalized = normalizeNeteaseCommentPage(body, "hot", page, HOT_LIMIT);
+  const hasMore = Boolean(body?.hasMore ?? body?.data?.hasMore ?? false);
+  return { items: normalized.list, hasMore };
+};
+
+/**
+ * 解析歌手列表对应的网易云用户 accountId 集合
+ * 多歌手多账号匹配并去重；accountId 为 0 或不存在视为未绑定（负缓存）
+ */
+const resolveArtistAccountIds = async (artistIds: string[]): Promise<Set<string>> => {
+  const accountIds = new Set<string>();
+  for (const artistId of artistIds) {
+    if (!artistId) continue;
+    const cached = artistAccountIdCache.get(artistId);
+    if (cached !== undefined) {
+      if (cached) accountIds.add(cached);
+      continue;
+    }
+    try {
+      const { body } = await callNetease("artists", { id: artistId });
+      const raw = body?.artist?.accountId;
+      const normalized =
+        typeof raw === "number" && raw > 0
+          ? String(raw)
+          : typeof raw === "string" && raw
+            ? raw
+            : null;
+      artistAccountIdCache.set(artistId, normalized);
+      if (normalized) accountIds.add(normalized);
+    } catch (err) {
+      coreLog.warn(`[comments] resolve artist ${artistId} accountId failed:`, err);
+      artistAccountIdCache.set(artistId, null);
+    }
+  }
+  return accountIds;
+};
+
+/**
+ * 获取「主创说」评论：歌曲关联歌手在网易云绑定的账号，在该歌曲热门评论中的发言
+ * 仅网易云内建源启用；前两页必拉，未命中且 hasMore 时额外翻页最多 MAX_EXTRA_PAGES 页
+ */
+export const getCreatorComments = async (
+  args: MusicCommentCreatorQuery,
+): Promise<MusicCommentItem[]> => {
+  if (args.sourceId !== NETEASE_SOURCE_ID) return [];
+
+  const meta = await findNeteaseSongMeta(args.track);
+  if (!meta) return [];
+  const { songId, artistIds } = meta;
+
+  const cached = creatorCommentsCache.get(songId);
+  if (cached) return cached;
+
+  const accountIds = await resolveArtistAccountIds(artistIds);
+  if (accountIds.size === 0) {
+    creatorCommentsCache.set(songId, []);
+    return [];
+  }
+
+  const result: MusicCommentItem[] = [];
+  let hasMore = true;
+  // 前两页必拉，收集全部命中
+  for (let page = 1; page <= 2 && hasMore; page++) {
+    const { items, hasMore: hm } = await fetchHotPage(songId, page);
+    result.push(...scanCreatorComments(items, accountIds));
+    hasMore = hm;
+  }
+  // 前两页无命中 + 还有更多 → 额外翻页，命中即停
+  if (result.length === 0 && hasMore) {
+    for (let extra = 1; extra <= MAX_EXTRA_PAGES && hasMore; extra++) {
+      const { items, hasMore: hm } = await fetchHotPage(songId, 2 + extra);
+      const hits = scanCreatorComments(items, accountIds);
+      result.push(...hits);
+      hasMore = hm;
+      if (hits.length > 0) break;
+    }
+  }
+
+  creatorCommentsCache.set(songId, result);
+  return result;
+};
diff --git a/electron/main/services/comments/data.ts b/electron/main/services/comments/data.ts
index 7a9828bf..62356ebc 100644
--- a/electron/main/services/comments/data.ts
+++ b/electron/main/services/comments/data.ts
@@ -104,6 +104,15 @@ export const normalizeNeteaseCommentPage = (
   };
 };
 
+/** 纯函数：从已归一化的评论中筛选主创评论（userId 命中账号集合） */
+export const scanCreatorComments = (
+  items: MusicCommentItem[],
+  accountIds: Set<string>,
+): MusicCommentItem[] => {
+  if (accountIds.size === 0) return [];
+  return items.filter((item) => item.userId != null && accountIds.has(item.userId));
+};
+
 /** 构建可用评论源 */
 export const buildCommentSources = (
   plugins: Array<
diff --git a/electron/main/services/comments/index.ts b/electron/main/services/comments/index.ts
index 0bbe8eef..eba3a5ca 100644
--- a/electron/main/services/comments/index.ts
+++ b/electron/main/services/comments/index.ts
@@ -68,8 +68,19 @@ const findPluginMatch = async (
   return pickBestCandidate(candidates, track)?.extra ?? null;
 };
 
-const findNeteaseId = async (track: Track): Promise<string | null> => {
-  if (track.source === "netease" && track.id) return track.id;
+/**
+ * 解析 Track 对应的网易云歌曲元信息：songId + 歌手 id 列表
+ * 一次 search 同时取两者，避免主创说二次搜索
+ */
+export const findNeteaseSongMeta = async (
+  track: Track,
+): Promise<{ songId: string; artistIds: string[] } | null> => {
+  if (track.source === "netease" && track.id) {
+    return {
+      songId: track.id,
+      artistIds: track.artists.map((a) => a.id).filter((id): id is string => !!id),
+    };
+  }
   const keyword = toKeyword(track);
   if (!keyword) return null;
   const { status, body } = await callNetease("search", {
@@ -79,11 +90,11 @@ const findNeteaseId = async (track: Track): Promise<string | null> => {
   });
   if (status !== 200) return null;
   const songs = body.result?.songs ?? [];
-  const candidates: LyricCandidate<{ id: string }>[] = songs.map(
+  const candidates: LyricCandidate<{ id: string; artistIds: string[] }>[] = songs.map(
     (song: {
       id: string | number;
       name?: string;
-      artists?: { name: string }[];
+      artists?: { id?: string | number; name: string }[];
       album?: { name?: string };
       duration?: number;
     }) => ({
@@ -91,10 +102,21 @@ const findNeteaseId = async (track: Track): Promise<string | null> => {
       artist: (song.artists ?? []).map((artist) => artist.name).join(" / "),
       album: song.album?.name,
       duration: song.duration,
-      extra: { id: String(song.id) },
+      extra: {
+        id: String(song.id),
+        artistIds: (song.artists ?? []).map((a) => (a.id ? String(a.id) : "")).filter(Boolean),
+      },
     }),
   );
-  return pickBestCandidate(candidates, track)?.extra.id ?? null;
+  const best = pickBestCandidate(candidates, track)?.extra;
+  if (!best) return null;
+  return { songId: best.id, artistIds: best.artistIds };
+};
+
+/** 取网易云歌曲 id（薄包装，供普通评论拉取复用） */
+const findNeteaseId = async (track: Track): Promise<string | null> => {
+  const meta = await findNeteaseSongMeta(track);
+  return meta?.songId ?? null;
 };
 
 const getNeteaseComments = async (args: MusicCommentQuery): Promise<MusicCommentPage> => {
diff --git a/electron/preload/index.ts b/electron/preload/index.ts
index bd2db81d..61e4875b 100644
--- a/electron/preload/index.ts
+++ b/electron/preload/index.ts
@@ -15,7 +15,7 @@ import type { PlayEventInput, FavoriteEventInput } from "@shared/types/stats";
 import type { TagEditRequest } from "@shared/types/tagEditor";
 import type { UpdateEvent } from "@shared/types/update";
 import type { CloudUploadProgress } from "@shared/types/cloudUpload";
-import type { MusicCommentQuery } from "@shared/types/comment";
+import type { MusicCommentCreatorQuery, MusicCommentQuery } from "@shared/types/comment";
 import type { AiModelSaveInput } from "@shared/types/ai";
 
 /** 订阅主进程推送的事件 */
@@ -369,6 +369,7 @@ const api = {
   comments: {
     sources: () => ipcRenderer.invoke("comments:sources"),
     get: (args: MusicCommentQuery) => ipcRenderer.invoke("comments:get", args),
+    creator: (args: MusicCommentCreatorQuery) => ipcRenderer.invoke("comments:creator", args),
   },
   download: {
     // 入队下载
diff --git a/shared/types/comment.ts b/shared/types/comment.ts
index c8317f2e..4e38738c 100644
--- a/shared/types/comment.ts
+++ b/shared/types/comment.ts
@@ -54,8 +54,20 @@ export type MusicCommentResponse =
   | { ok: true; data: MusicCommentPage }
   | { ok: false; error: string };
 
+/** 主创说查询参数 */
+export interface MusicCommentCreatorQuery {
+  sourceId: string;
+  track: Track;
+}
+
+/** 主创说 IPC 响应 */
+export type MusicCommentCreatorResponse =
+  | { ok: true; data: MusicCommentItem[] }
+  | { ok: false; error: string };
+
 /** 渲染端评论 API */
 export interface CommentsApi {
   sources: () => Promise<CommentSource[]>;
   get: (args: MusicCommentQuery) => Promise<MusicCommentResponse>;
+  creator: (args: MusicCommentCreatorQuery) => Promise<MusicCommentCreatorResponse>;
 }
diff --git a/src/components/comments/CommentCard.vue b/src/components/comments/CommentCard.vue
new file mode 100644
index 00000000..bf4d0044
--- /dev/null
+++ b/src/components/comments/CommentCard.vue
@@ -0,0 +1,93 @@
+<script setup lang="ts">
+import type { MusicCommentItem } from "@shared/types/comment";
+import { formatDate } from "@/utils/time";
+import IconLucideThumbsUp from "~icons/lucide/thumbs-up";
+
+interface Props {
+  /** 评论数据 */
+  item: MusicCommentItem;
+  /** 是否显示主创徽章 */
+  creator?: boolean;
+  /** 紧凑模式（缩减间距） */
+  compact?: boolean;
+  /** 是否使用全屏播放器配色 */
+  cover?: boolean;
+}
+
+withDefaults(defineProps<Props>(), {
+  creator: false,
+  compact: false,
+  cover: false,
+});
+</script>
+
+<template>
+  <div
+    class="rounded-xl border border-solid px-3 py-2.5 transition-colors duration-150"
+    :class="
+      cover ? 'border-cover/10 bg-cover/6 hover:bg-cover/10' : 'border-primary/20 bg-surface-panel'
+    "
+  >
+    <div :class="compact ? 'flex gap-2.5' : 'flex gap-3'">
+      <SImg
+        v-if="item.avatar"
+        :src="item.avatar"
+        class="h-9 w-9 shrink-0 rounded-full ring-1"
+        :class="cover ? 'ring-cover/15' : 'ring-black/10 dark:ring-white/10'"
+        alt=""
+      />
+      <div
+        v-else
+        class="h-9 w-9 shrink-0 rounded-full"
+        :class="cover ? 'bg-cover/10' : 'bg-on-surface/8'"
+      />
+      <div class="min-w-0 flex-1">
+        <div class="flex items-start justify-between gap-3">
+          <div class="min-w-0">
+            <div class="flex items-center gap-1.5">
+              <span class="truncate text-sm font-medium">{{ item.userName }}</span>
+              <STag v-if="creator" type="primary" variant="soft" size="tiny" round>
+                {{ $t("comments.creatorBadge") }}
+              </STag>
+            </div>
+            <div
+              class="mt-0.5 flex gap-2 text-xs"
+              :class="cover ? 'text-cover/50' : 'text-on-surface-variant'"
+            >
+              <span v-if="item.time">{{ formatDate(item.time) }}</span>
+              <span v-if="item.location">
+                {{ $t("comments.location", { location: item.location }) }}
+              </span>
+            </div>
+          </div>
+          <div
+            v-if="item.likedCount != null"
+            class="flex shrink-0 items-center gap-1 text-xs tabular-nums"
+            :class="cover ? 'text-cover/50' : 'text-on-surface-variant'"
+          >
+            <IconLucideThumbsUp class="size-3.5" />
+            <span>{{ item.likedCount }}</span>
+          </div>
+        </div>
+        <p class="mt-2 whitespace-pre-wrap break-words text-sm leading-6">{{ item.text }}</p>
+        <div
+          v-if="item.reply?.length"
+          class="mt-2 rounded-lg px-3 py-2"
+          :class="cover ? 'bg-cover/7' : 'bg-on-surface/5'"
+        >
+          <div
+            v-for="reply in item.reply"
+            :key="reply.id"
+            class="text-xs leading-5"
+            :class="cover ? 'text-cover/60' : 'text-on-surface-variant'"
+          >
+            <span class="font-medium" :class="cover ? 'text-cover/85' : 'text-on-surface'">
+              {{ reply.userName }}：
+            </span>
+            {{ reply.text }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/src/components/comments/CommentList.vue b/src/components/comments/CommentList.vue
new file mode 100644
index 00000000..32c1ec4d
--- /dev/null
+++ b/src/components/comments/CommentList.vue
@@ -0,0 +1,124 @@
+<script setup lang="ts">
+import type { MusicCommentItem } from "@shared/types/comment";
+import { getMasonryRowSpan } from "@/utils/commentMasonry";
+import CommentCard from "./CommentCard.vue";
+
+interface Props {
+  /** 评论列表 */
+  items: MusicCommentItem[];
+  /** 最小列宽（px），容器更宽时自动增加列数 */
+  columnMinWidth?: number;
+  /** 主创评论 id 集合，命中时卡片显示主创徽章 */
+  creatorIds?: Set<string>;
+  /** 紧凑模式透传给 CommentCard */
+  compact?: boolean;
+  /** 是否使用全屏播放器配色 */
+  cover?: boolean;
+  /** 列间距（px） */
+  gap?: number;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  columnMinWidth: 280,
+  creatorIds: () => new Set<string>(),
+  compact: false,
+  cover: false,
+  gap: 12,
+});
+
+const GRID_ROW_HEIGHT = 1;
+const itemElements = new Map<string, HTMLElement>();
+const rowSpans = reactive(new Map<string, number>());
+let resizeObserver: ResizeObserver | undefined;
+
+const gridStyle = computed(() => ({
+  display: "grid",
+  gridTemplateColumns: `repeat(auto-fill, minmax(${props.columnMinWidth}px, 1fr))`,
+  gridAutoRows: `${GRID_ROW_HEIGHT}px`,
+  gap: `${props.gap}px`,
+}));
+
+const updateItemSpan = (id: string, element: HTMLElement): void => {
+  const content = element.firstElementChild;
+  if (!(content instanceof HTMLElement)) return;
+  rowSpans.set(
+    id,
+    getMasonryRowSpan(content.getBoundingClientRect().height, GRID_ROW_HEIGHT, props.gap),
+  );
+};
+
+const updateAllSpans = (): void => {
+  for (const [id, element] of itemElements) updateItemSpan(id, element);
+};
+
+const setItemRef = (id: string, value: unknown): void => {
+  const element = value instanceof HTMLElement ? value : null;
+  const previous = itemElements.get(id);
+  if (previous && previous !== element) {
+    const previousContent = previous.firstElementChild;
+    if (previousContent) resizeObserver?.unobserve(previousContent);
+  }
+  if (!element) {
+    itemElements.delete(id);
+    rowSpans.delete(id);
+    return;
+  }
+  itemElements.set(id, element);
+  const content = element.firstElementChild;
+  if (content) resizeObserver?.observe(content);
+  updateItemSpan(id, element);
+};
+
+watch(
+  () => [props.items, props.gap] as const,
+  async ([items]) => {
+    const ids = new Set(items.map((item) => item.id));
+    for (const id of rowSpans.keys()) {
+      if (!ids.has(id)) rowSpans.delete(id);
+    }
+    await nextTick();
+    updateAllSpans();
+  },
+  { deep: true },
+);
+
+onMounted(() => {
+  resizeObserver = new ResizeObserver((entries) => {
+    for (const entry of entries) {
+      const wrapper = entry.target.parentElement;
+      const id = wrapper?.getAttribute("data-comment-id");
+      if (id && wrapper) updateItemSpan(id, wrapper);
+    }
+  });
+  for (const element of itemElements.values()) {
+    const content = element.firstElementChild;
+    if (content) resizeObserver.observe(content);
+  }
+  updateAllSpans();
+});
+
+onBeforeUnmount(() => {
+  resizeObserver?.disconnect();
+  itemElements.clear();
+  rowSpans.clear();
+});
+</script>
+
+<template>
+  <div :style="gridStyle">
+    <div
+      v-for="item in items"
+      :key="item.id"
+      :ref="(value) => setItemRef(item.id, value)"
+      :data-comment-id="item.id"
+      :style="{ gridRowEnd: `span ${rowSpans.get(item.id) ?? 1}` }"
+    >
+      <CommentCard
+        :item="item"
+        :creator="creatorIds.has(item.id)"
+        :compact="compact"
+        :cover="cover"
+      />
+    </div>
+  </div>
+</template>
diff --git a/src/components/modals/MusicCommentsDialog.vue b/src/components/modals/MusicCommentsDialog.vue
index 8f6fe7a4..b728c912 100644
--- a/src/components/modals/MusicCommentsDialog.vue
+++ b/src/components/modals/MusicCommentsDialog.vue
@@ -1,4 +1,8 @@
 <script setup lang="ts">
+/**
+ * @deprecated 歌曲评论主入口已迁移至 /comments 路由（Comments.vue）与全屏内嵌面板（FullPlayerComments.vue）
+ * 本组件保留挂载于 MainLayout 以兼容旧入口，不再扩展新功能
+ */
 import type { CommentSource, MusicCommentPage } from "@shared/types/comment";
 import { useStatusStore } from "@/stores/status";
 import { toast } from "@/composables/useToast";
diff --git a/src/components/player/FullPlayer/FullPlayerComments.vue b/src/components/player/FullPlayer/FullPlayerComments.vue
new file mode 100644
index 00000000..afa82b74
--- /dev/null
+++ b/src/components/player/FullPlayer/FullPlayerComments.vue
@@ -0,0 +1,210 @@
+<script setup lang="ts">
+import { useMediaStore } from "@/stores/media";
+import { useMusicComments } from "@/composables/useMusicComments";
+import CommentList from "@/components/comments/CommentList.vue";
+import IconLucideX from "~icons/lucide/x";
+import IconLucideRefreshCw from "~icons/lucide/refresh-cw";
+import IconLucideMessageCircleOff from "~icons/lucide/message-circle-off";
+
+interface Props {
+  /** 展示模式：half 左半屏窄列，full 全屏多列 */
+  mode: "half" | "full";
+  /** 播放器当前是否处于沉浸状态 */
+  immersive: boolean;
+}
+
+const props = defineProps<Props>();
+const emit = defineEmits<{ close: [] }>();
+
+const { t } = useI18n();
+const media = useMediaStore();
+
+const trackRef = computed(() => media.track ?? null);
+const listScrollRef = ref<HTMLElement | null>(null);
+const loadMoreSentinelRef = ref<HTMLElement | null>(null);
+const comments = useMusicComments(trackRef, listScrollRef);
+
+const {
+  sources,
+  sourceId,
+  activeTab,
+  creatorComments,
+  creatorIds,
+  loading,
+  page,
+  sourceOptions,
+  tabs,
+  dedupedList,
+  error,
+} = comments;
+
+const columnMinWidth = computed(() => (props.mode === "half" ? 400 : 360));
+const artistNames = computed(() => media.track?.artists.map((artist) => artist.name).join(" / "));
+const scrolling = ref(false);
+let loadMoreObserver: IntersectionObserver | undefined;
+let scrollTimer: ReturnType<typeof setTimeout> | undefined;
+
+const handleClose = (): void => emit("close");
+
+const handleScroll = (): void => {
+  scrolling.value = true;
+  clearTimeout(scrollTimer);
+  scrollTimer = setTimeout(() => {
+    scrolling.value = false;
+  }, 700);
+};
+
+onMounted(() => {
+  loadMoreObserver = new IntersectionObserver(
+    ([entry]) => {
+      if (entry?.isIntersecting) void comments.loadMore();
+    },
+    { root: listScrollRef.value, rootMargin: "0px 0px 400px", threshold: 0 },
+  );
+  if (loadMoreSentinelRef.value) loadMoreObserver.observe(loadMoreSentinelRef.value);
+});
+
+watch(
+  () => [activeTab.value, loading.value, page.value.list.length] as const,
+  async () => {
+    await nextTick();
+    const sentinel = loadMoreSentinelRef.value;
+    if (!sentinel || !loadMoreObserver) return;
+    loadMoreObserver.unobserve(sentinel);
+    loadMoreObserver.observe(sentinel);
+  },
+);
+
+onBeforeUnmount(() => {
+  loadMoreObserver?.disconnect();
+  clearTimeout(scrollTimer);
+});
+</script>
+
+<template>
+  <div class="flex h-full flex-col text-cover">
+    <div class="shrink-0 flex items-start justify-between gap-4 pl-1 pb-4">
+      <div class="flex min-w-0 items-center gap-3 pl-2.5">
+        <SImg
+          v-if="media.track?.cover"
+          :src="media.track.cover"
+          class="size-12 shrink-0 rounded-lg"
+          alt=""
+        />
+        <div v-else class="size-12 shrink-0 rounded-lg bg-cover/14" />
+        <div class="min-w-0">
+          <h2 class="m-0 truncate text-2xl font-semibold leading-tight">
+            {{ t("comments.name") }}
+          </h2>
+          <div class="mt-1 flex min-w-0 items-center gap-2 text-sm text-cover/55">
+            <span class="truncate">{{ media.track?.title }}</span>
+            <span v-if="artistNames" class="shrink-0 text-cover/25">·</span>
+            <span v-if="artistNames" class="truncate">{{ artistNames }}</span>
+          </div>
+        </div>
+      </div>
+      <div class="shrink-0 flex items-center gap-3">
+        <SButton
+          type="cover"
+          variant="secondary"
+          round
+          :size="40"
+          :loading="loading"
+          @click="comments.refresh"
+        >
+          <template #icon><IconLucideRefreshCw /></template>
+        </SButton>
+        <SButton type="cover" variant="secondary" round :size="40" @click="handleClose">
+          <template #icon><IconLucideX /></template>
+        </SButton>
+      </div>
+    </div>
+
+    <div class="shrink-0 flex items-center gap-4 pl-3 pb-3">
+      <div class="min-w-0 flex-1">
+        <STabs v-model="activeTab" :tabs="tabs" type="bar" size="medium" cover />
+      </div>
+      <div class="w-32 shrink-0">
+        <SSelect
+          v-model="sourceId"
+          :options="sourceOptions"
+          :disabled="sources.length === 0 || loading"
+          cover
+        />
+      </div>
+    </div>
+
+    <div
+      class="relative min-h-0 flex-1"
+      :style="{
+        maskImage:
+          'linear-gradient(180deg, transparent 0px, #000 24px, #000 calc(100% - 32px), transparent 100%)',
+      }"
+    >
+      <div
+        ref="listScrollRef"
+        class="h-full overflow-y-auto pl-3 pr-2 pt-6 pb-8 [scrollbar-gutter:stable] [&::-webkit-scrollbar-thumb]:bg-cover/25 [&::-webkit-scrollbar-thumb:hover]:bg-cover/45"
+        :class="immersive && !scrolling ? '[&::-webkit-scrollbar-thumb]:bg-transparent' : ''"
+        @scroll="handleScroll"
+      >
+        <div v-if="creatorComments.length" class="mb-6">
+          <div class="mb-3 flex items-center gap-2">
+            <span class="h-4 w-0.5 rounded-full bg-cover/70" />
+            <h3 class="m-0 text-sm font-semibold text-cover/85">{{ t("comments.creator") }}</h3>
+          </div>
+          <CommentList
+            :items="creatorComments"
+            :creator-ids="creatorIds"
+            :column-min-width="columnMinWidth"
+            cover
+          />
+        </div>
+
+        <div v-if="!sources.length" class="flex min-h-64 items-center justify-center text-cover/35">
+          <div class="text-center">
+            <IconLucideMessageCircleOff class="mx-auto mb-4 size-14 opacity-30" />
+            <div class="text-sm">{{ t("comments.noSource") }}</div>
+          </div>
+        </div>
+        <div
+          v-else-if="error && page.list.length === 0"
+          class="flex min-h-64 flex-col items-center justify-center gap-3"
+        >
+          <div class="text-sm text-cover/55">{{ error }}</div>
+          <SButton type="cover" variant="outline" @click="comments.loadPage(activeTab, 1)">
+            {{ t("common.retry") }}
+          </SButton>
+        </div>
+        <div
+          v-else-if="page.list.length === 0 && loading"
+          class="flex min-h-64 items-center justify-center text-cover/35"
+        >
+          <div class="text-center">
+            <SLoading class="mx-auto mb-4 block text-4xl text-cover/50" />
+            <div class="text-sm">{{ t("comments.loading") }}</div>
+          </div>
+        </div>
+        <div
+          v-else-if="page.list.length === 0"
+          class="flex min-h-64 items-center justify-center text-cover/35"
+        >
+          <div class="text-center">
+            <IconLucideMessageCircleOff class="mx-auto mb-4 size-14 opacity-30" />
+            <div class="text-sm">{{ t("comments.empty") }}</div>
+          </div>
+        </div>
+        <CommentList v-else :items="dedupedList" :column-min-width="columnMinWidth" cover />
+
+        <div ref="loadMoreSentinelRef" class="h-px" />
+        <div v-if="page.loadingMore" class="flex justify-center py-5 text-cover/55">
+          <SLoading class="text-2xl" />
+        </div>
+        <div v-else-if="page.appendError" class="flex justify-center py-5">
+          <SButton size="small" type="cover" variant="outline" @click="comments.loadMore">
+            {{ t("common.retry") }}
+          </SButton>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/src/components/player/FullPlayer/index.vue b/src/components/player/FullPlayer/index.vue
index 03d8a43c..d21817d8 100644
--- a/src/components/player/FullPlayer/index.vue
+++ b/src/components/player/FullPlayer/index.vue
@@ -13,6 +13,7 @@ import { useTimeFormat } from "@/composables/useTimeFormat";
 import Lyrics from "@/components/player/Lyrics/index.vue";
 import AMLLLyrics from "@/components/player/Lyrics/AMLLLyrics.vue";
 import PlaylistPickerDialog from "@/components/modals/PlaylistPickerDialog.vue";
+import FullPlayerComments from "./FullPlayerComments.vue";
 import { useWindowControls } from "@/composables/useWindowControls";
 import * as player from "@/core/player";
 import { openExternal } from "@/utils/url";
@@ -105,10 +106,16 @@ watch(
 const fullscreenCover = computed(() => settings.player.coverLayout === "fullscreen");
 
 const coverCentered = computed(() => {
-  if (fullscreenCover.value || status.fullQueueOpen) return false;
+  if (fullscreenCover.value || status.fullQueueOpen || status.fullCommentsOpen) return false;
   return !showLyric.value || (settings.player.autoCenterCover && !hasLyric.value);
 });
 
+/** 全屏内嵌评论布局模式：off 关闭 / half 左半屏 / full 全屏 */
+const fullCommentMode = computed<"off" | "half" | "full">(() => {
+  if (!status.fullCommentsOpen) return "off";
+  return hasLyric.value && showLyric.value ? "half" : "full";
+});
+
 const handleLyricSeek = async (timeMs: number): Promise<void> => {
   await player.seek(timeMs);
   if (!isPlaying.value) await player.play();
@@ -173,9 +180,17 @@ const toggleLyric = (): void => {
   }
 };
 
-const showComments = (): void => {
-  if (media.track) status.showComments(media.track);
+const toggleFullComments = (): void => {
+  if (status.fullQueueOpen) status.fullQueueOpen = false;
+  status.fullCommentsOpen = !status.fullCommentsOpen;
 };
+
+watch(
+  () => status.fullQueueOpen,
+  (open) => {
+    if (open && status.fullCommentsOpen) status.fullCommentsOpen = false;
+  },
+);
 </script>
 
 <template>
@@ -200,9 +215,19 @@ const showComments = (): void => {
         <!-- 背景 -->
         <PlayerBackground />
         <!-- 全屏封面 -->
-        <div v-if="fullscreenCover" class="absolute inset-y-0 left-0 w-[60%]">
-          <PlayerCover fullscreen />
-        </div>
+        <Transition
+          enter-active-class="transition-opacity duration-250"
+          enter-from-class="opacity-0"
+          leave-active-class="transition-opacity duration-250"
+          leave-to-class="opacity-0"
+        >
+          <div
+            v-if="fullscreenCover && fullCommentMode === 'off'"
+            class="absolute inset-y-0 left-0 w-[60%]"
+          >
+            <PlayerCover fullscreen />
+          </div>
+        </Transition>
         <!-- 底部频谱 -->
         <BottomSpectrum
           v-if="isExpanded && settings.player.enableSpectrum"
@@ -210,12 +235,12 @@ const showComments = (): void => {
         />
         <!-- 顶/底栏渐变遮罩（全屏封面模式） -->
         <div
-          v-if="fullscreenCover"
+          v-if="fullscreenCover && fullCommentMode === 'off'"
           class="cover-mask-top absolute top-0 inset-x-0 h-20 z-5 pointer-events-none transition-opacity duration-400"
           :class="immersive ? 'opacity-0' : 'opacity-100'"
         />
         <div
-          v-if="fullscreenCover"
+          v-if="fullscreenCover && fullCommentMode === 'off'"
           class="cover-mask-bottom absolute bottom-0 inset-x-0 h-48 z-5 pointer-events-none transition-opacity duration-400"
           :class="immersive ? 'opacity-0' : 'opacity-100'"
         />
@@ -254,7 +279,8 @@ const showComments = (): void => {
           <!-- 左侧 -->
           <div
             v-if="!fullscreenCover"
-            class="absolute inset-y-0 left-0 w-[45%] flex items-center justify-center px-12 transition-transform duration-600 ease-[cubic-bezier(0.4,0,0.2,1)]"
+            class="absolute inset-y-0 left-0 w-[45%] flex items-center justify-center px-12 transition-[transform,opacity] duration-250 ease-[cubic-bezier(0.4,0,0.2,1)]"
+            :class="fullCommentMode === 'off' ? 'opacity-100' : 'opacity-0 pointer-events-none'"
             :style="coverCentered ? 'transform: translateX(calc(100% * 11 / 18))' : undefined"
           >
             <div class="relative w-[clamp(200px,85%,50vh)] -translate-y-[11vh]">
@@ -270,22 +296,29 @@ const showComments = (): void => {
           </div>
           <!-- 右侧 -->
           <div
-            class="group absolute inset-y-0 right-0 pr-20 flex flex-col transition-opacity duration-600 ease-[cubic-bezier(0.4,0,0.2,1)]"
+            class="group absolute inset-y-0 right-0 pr-20 flex flex-col transition-opacity duration-250 ease-[cubic-bezier(0.4,0,0.2,1)]"
             :class="[
-              fullscreenCover ? 'w-1/2' : 'w-[55%]',
-              coverCentered || status.fullQueueOpen
+              fullscreenCover || fullCommentMode === 'half' ? 'w-1/2' : 'w-[55%]',
+              coverCentered || status.fullQueueOpen || fullCommentMode === 'full'
                 ? 'opacity-0 pointer-events-none'
                 : 'opacity-100',
             ]"
           >
             <!-- 全屏封面 -->
-            <div
-              v-if="fullscreenCover"
-              class="shrink-0 pt-2 pb-6 pl-[calc(1em-0.5rem)]"
-              :style="{ fontSize: lyricFontSize }"
+            <Transition
+              enter-active-class="transition-opacity duration-250"
+              enter-from-class="opacity-0"
+              leave-active-class="transition-opacity duration-250"
+              leave-to-class="opacity-0"
             >
-              <PlayerData align="left" simple />
-            </div>
+              <div
+                v-if="fullscreenCover && fullCommentMode === 'off'"
+                class="shrink-0 pt-2 pb-6 pl-[calc(1em-0.5rem)]"
+                :style="{ fontSize: lyricFontSize }"
+              >
+                <PlayerData align="left" simple />
+              </div>
+            </Transition>
             <!-- 歌词容器 -->
             <div
               class="lyric-area relative flex-1 min-h-0"
@@ -374,6 +407,29 @@ const showComments = (): void => {
             <!-- 歌词侧边工具栏 -->
             <LyricActions :immersive="immersive" />
           </div>
+          <!-- 全屏内嵌评论 -->
+          <Transition
+            enter-active-class="transition-opacity duration-250 ease-[cubic-bezier(0.4,0,0.2,1)]"
+            enter-from-class="opacity-0"
+            leave-active-class="transition-opacity duration-250 ease-[cubic-bezier(0.4,0,0.2,1)]"
+            leave-to-class="opacity-0"
+          >
+            <div
+              v-if="fullCommentMode !== 'off'"
+              class="absolute py-4 z-6 transition-[inset,width,padding] duration-250 ease-[cubic-bezier(0.4,0,0.2,1)]"
+              :class="
+                fullCommentMode === 'half'
+                  ? 'inset-y-0 left-0 w-1/2 pl-[clamp(32px,4vw,64px)] pr-[clamp(20px,2.5vw,40px)]'
+                  : 'inset-0 w-full px-[clamp(32px,5vw,80px)]'
+              "
+            >
+              <FullPlayerComments
+                :mode="fullCommentMode"
+                :immersive="immersive"
+                @close="toggleFullComments"
+              />
+            </div>
+          </Transition>
           <!-- 播放队列 -->
           <div
             class="absolute inset-y-0 right-0 pl-4 py-6 flex items-center"
@@ -426,7 +482,8 @@ const showComments = (): void => {
               size="large"
               circle
               :disabled="!hasTrack"
-              @click="showComments"
+              :class="status.fullCommentsOpen ? 'opacity-100' : 'opacity-40'"
+              @click="toggleFullComments"
             >
               <template #icon><IconLucideMessageCircle /></template>
             </SButton>
diff --git a/src/components/ui/SSelect.vue b/src/components/ui/SSelect.vue
index c46c1c10..69d1a576 100644
--- a/src/components/ui/SSelect.vue
+++ b/src/components/ui/SSelect.vue
@@ -15,6 +15,8 @@ export interface SSelectProps {
   placeholder?: string;
   /** 全圆角胶囊形 */
   round?: boolean;
+  /** 使用全屏播放器配色 */
+  cover?: boolean;
 }
 
 const props = withDefaults(defineProps<SSelectProps>(), {
@@ -22,6 +24,7 @@ const props = withDefaults(defineProps<SSelectProps>(), {
   disabled: false,
   placeholder: "",
   round: false,
+  cover: false,
 });
 
 const emit = defineEmits<{
@@ -45,15 +48,21 @@ const handleChange = (val: string) => {
     @update:model-value="handleChange"
   >
     <SelectTrigger
-      class="group flex w-full items-center justify-between gap-2 h-8.5 px-3 text-sm text-on-surface bg-field border border-solid border-on-surface/20 cursor-pointer outline-none focus-visible:outline-none transition-[border-color,box-shadow,opacity] duration-250 hover:border-on-surface/50 data-[state=open]:border-primary data-[state=open]:ring-2 data-[state=open]:ring-primary/25 disabled:opacity-50 disabled:cursor-not-allowed overflow-hidden"
-      :class="round ? 'rounded-full' : 'rounded-lg'"
+      class="group flex w-full items-center justify-between gap-2 h-8.5 px-3 text-sm border border-solid cursor-pointer outline-none focus-visible:outline-none transition-[border-color,background-color,box-shadow,opacity] duration-250 disabled:opacity-50 disabled:cursor-not-allowed overflow-hidden"
+      :class="[
+        round ? 'rounded-full' : 'rounded-lg',
+        cover
+          ? 'text-cover bg-cover/8 border-cover/15 hover:bg-cover/12 hover:border-cover/25 data-[state=open]:border-cover/35 data-[state=open]:ring-2 data-[state=open]:ring-cover/10'
+          : 'text-on-surface bg-field border-on-surface/20 hover:border-on-surface/50 data-[state=open]:border-primary data-[state=open]:ring-2 data-[state=open]:ring-primary/25',
+      ]"
     >
       <SelectValue class="min-w-0 truncate">
         <span class="truncate">{{ selectedLabel }}</span>
       </SelectValue>
       <SelectIcon as-child>
         <IconLucideChevronDown
-          class="size-3.5 text-on-surface-variant/50 shrink-0 transition-transform duration-200 group-data-[state=open]:rotate-180"
+          class="size-3.5 shrink-0 transition-transform duration-200 group-data-[state=open]:rotate-180"
+          :class="cover ? 'text-cover/50' : 'text-on-surface-variant/50'"
         />
       </SelectIcon>
     </SelectTrigger>
diff --git a/src/components/ui/STabs.vue b/src/components/ui/STabs.vue
index 630ee2d4..2d58dc68 100644
--- a/src/components/ui/STabs.vue
+++ b/src/components/ui/STabs.vue
@@ -29,6 +29,8 @@ export interface STabsProps {
   animated?: boolean;
   /** 圆角胶囊 */
   round?: boolean;
+  /** 使用全屏播放器配色 */
+  cover?: boolean;
 }
 
 const props = withDefaults(defineProps<STabsProps>(), {
@@ -36,6 +38,7 @@ const props = withDefaults(defineProps<STabsProps>(), {
   size: "medium",
   animated: false,
   round: false,
+  cover: false,
 });
 
 const emit = defineEmits<{
@@ -221,15 +224,19 @@ const panelTransitionClasses = computed(() => {
       type === 'bar' && (justifyContent ? 'flex w-full pb-1' : 'inline-flex shrink-0 gap-3 pb-1'),
     ]"
   >
-    <div v-if="type === 'line'" class="absolute inset-x-0 bottom-0 h-0.5 bg-outline-variant/65" />
+    <div
+      v-if="type === 'line'"
+      class="absolute inset-x-0 bottom-0 h-0.5"
+      :class="cover ? 'bg-cover/15' : 'bg-outline-variant/65'"
+    />
 
     <div
       v-if="indicatorStyle.width"
       :class="[
         'absolute pointer-events-none transition-[left,width] duration-320 ease-[cubic-bezier(0.4,0,0.2,1)]',
         type === 'segment'
-          ? ['bg-primary/12', round ? 'rounded-full' : 'rounded-md']
-          : 'bottom-0.5 h-[3px] bg-primary rounded-full',
+          ? [cover ? 'bg-cover/14' : 'bg-primary/12', round ? 'rounded-full' : 'rounded-md']
+          : [cover ? 'bg-cover' : 'bg-primary', 'bottom-0.5 h-[3px] rounded-full'],
       ]"
       :style="indicatorStyle"
     />
@@ -246,16 +253,20 @@ const panelTransitionClasses = computed(() => {
         type === 'segment' ? ['flex-1 h-full', segmentTabClasses[size]] : sizeClasses[size],
         tab.disabled ? 'opacity-40 cursor-not-allowed' : 'cursor-pointer',
         modelValue === tab.key
-          ? {
-              bar: 'text-primary font-medium',
-              line: 'text-primary font-medium',
-              segment: 'text-on-surface font-medium',
-            }[type]
-          : {
-              bar: 'text-on-surface-variant',
-              line: 'text-on-surface-variant',
-              segment: 'text-on-surface',
-            }[type],
+          ? cover
+            ? 'text-cover font-medium'
+            : {
+                bar: 'text-primary font-medium',
+                line: 'text-primary font-medium',
+                segment: 'text-on-surface font-medium',
+              }[type]
+          : cover
+            ? 'text-cover/55 hover:text-cover/75'
+            : {
+                bar: 'text-on-surface-variant',
+                line: 'text-on-surface-variant',
+                segment: 'text-on-surface',
+              }[type],
       ]"
       @click="select(tab)"
     >
diff --git a/src/composables/useMusicComments.ts b/src/composables/useMusicComments.ts
new file mode 100644
index 00000000..3a77d87d
--- /dev/null
+++ b/src/composables/useMusicComments.ts
@@ -0,0 +1,289 @@
+import type { Ref } from "vue";
+import type { Track } from "@shared/types/player";
+import type {
+  CommentSource,
+  CommentTab,
+  MusicCommentItem,
+  MusicCommentPage,
+} from "@shared/types/comment";
+import { toast } from "@/composables/useToast";
+import { appendUniqueComments, hasNextCommentPage } from "@/utils/commentPagination";
+
+const DEFAULT_LIMIT = 20;
+const NETEASE_SOURCE_ID = "builtin:netease";
+
+type CommentTabState = MusicCommentPage & {
+  hasMore: boolean;
+  loadingMore: boolean;
+  initialError: string;
+  appendError: string;
+};
+
+const createTabState = (): CommentTabState => ({
+  list: [],
+  total: 0,
+  page: 0,
+  limit: DEFAULT_LIMIT,
+  hasMore: true,
+  loadingMore: false,
+  initialError: "",
+  appendError: "",
+});
+
+const makeTrackKey = (track: Track): string =>
+  `${track.source}\n${track.serverId ?? ""}\n${track.id}`;
+
+const makeContextKey = (track: Track, source: string): string =>
+  `${makeTrackKey(track)}\n${source}`;
+
+/**
+ * 歌曲评论数据加载 composable
+ * @param trackRef - 当前曲目引用（独立页为冻结快照，全屏内嵌为 media.track）
+ * @param scrollRef - 评论滚动容器
+ */
+export const useMusicComments = (
+  trackRef: Ref<Track | null>,
+  scrollRef: Ref<HTMLElement | null>,
+) => {
+  const { t } = useI18n();
+
+  const sources = shallowRef<CommentSource[]>([]);
+  const sourceId = ref("");
+  const activeTab = ref<CommentTab>("hot");
+  const loadingCount = ref(0);
+
+  const pages = reactive<Record<CommentTab, CommentTabState>>({
+    hot: createTabState(),
+    new: createTabState(),
+  });
+  const requestTokens = reactive<Record<CommentTab, number>>({ hot: 0, new: 0 });
+
+  const creatorComments = shallowRef<MusicCommentItem[]>([]);
+  const creatorLoading = ref(false);
+  const creatorError = ref("");
+
+  let loadingEpoch = 0;
+  let creatorEpoch = 0;
+  let disposed = false;
+
+  const sourceOptions = computed(() =>
+    sources.value.map((source) => ({ value: source.id, label: source.name })),
+  );
+  const tabs = computed(() => [
+    { key: "hot", label: `${t("comments.hot")} (${pages.hot.total})` },
+    { key: "new", label: `${t("comments.new")} (${pages.new.total})` },
+  ]);
+
+  const loading = computed(() => loadingCount.value > 0);
+  const page = computed(() => pages[activeTab.value]);
+  const error = computed(() => page.value.initialError);
+  const creatorIds = computed(() => new Set(creatorComments.value.map((comment) => comment.id)));
+  const dedupedList = computed(() =>
+    page.value.list.filter((item) => !creatorIds.value.has(item.id)),
+  );
+
+  /** 加载可用评论源，确保 sourceId 有效 */
+  const loadSources = async (): Promise<void> => {
+    const availableSources = await window.api.comments.sources();
+    if (disposed) return;
+    sources.value = availableSources;
+    if (!sources.value.some((source) => source.id === sourceId.value)) {
+      sourceId.value = sources.value[0]?.id ?? "";
+    }
+  };
+
+  /** 重置分页与主创数据，作废所有进行中的请求 */
+  const resetPages = (): void => {
+    requestTokens.hot += 1;
+    requestTokens.new += 1;
+    creatorEpoch += 1;
+    loadingEpoch += 1;
+    loadingCount.value = 0;
+    pages.hot = createTabState();
+    pages.new = createTabState();
+    creatorComments.value = [];
+    creatorLoading.value = false;
+    creatorError.value = "";
+  };
+
+  /**
+   * 加载指定 Tab 的评论
+   * @param type - 评论 Tab
+   * @param pageNo - 页码
+   * @param append - 是否追加到现有列表
+   */
+  const loadPage = async (type: CommentTab, pageNo = 1, append = false): Promise<void> => {
+    const track = trackRef.value;
+    if (!track || !sourceId.value) return;
+
+    const token = requestTokens[type] + 1;
+    requestTokens[type] = token;
+    const contextKey = makeContextKey(track, sourceId.value);
+    const epoch = loadingEpoch;
+
+    if (append) {
+      pages[type].loadingMore = true;
+      pages[type].appendError = "";
+    } else {
+      loadingCount.value += 1;
+      pages[type].initialError = "";
+    }
+
+    const isCurrentRequest = (): boolean => {
+      const currentTrack = trackRef.value;
+      return (
+        !disposed &&
+        requestTokens[type] === token &&
+        loadingEpoch === epoch &&
+        !!currentTrack &&
+        makeContextKey(currentTrack, sourceId.value) === contextKey
+      );
+    };
+
+    try {
+      const result = await window.api.comments.get({
+        sourceId: sourceId.value,
+        track: toRaw(track),
+        type,
+        page: pageNo,
+        limit: pages[type].limit,
+      });
+      if (!result.ok) throw new Error(result.error);
+      if (!isCurrentRequest()) return;
+
+      const previousCount = pages[type].list.length;
+      const nextList = append
+        ? appendUniqueComments(pages[type].list, result.data.list)
+        : result.data.list;
+      pages[type] = {
+        ...result.data,
+        list: nextList,
+        hasMore:
+          hasNextCommentPage(
+            nextList.length,
+            result.data.total,
+            result.data.list.length,
+            result.data.limit,
+          ) &&
+          (!append || nextList.length > previousCount),
+        loadingMore: false,
+        initialError: "",
+        appendError: "",
+      };
+    } catch (err) {
+      if (!isCurrentRequest()) return;
+      const message = err instanceof Error ? err.message : String(err);
+      if (append) {
+        pages[type].appendError = message;
+      } else {
+        pages[type].initialError = message;
+        toast.error(message);
+      }
+    } finally {
+      if (isCurrentRequest()) {
+        if (append) {
+          pages[type].loadingMore = false;
+        } else {
+          loadingCount.value = Math.max(0, loadingCount.value - 1);
+        }
+      }
+    }
+  };
+
+  /** 加载当前 Tab 的下一页 */
+  const loadMore = async (): Promise<void> => {
+    const state = pages[activeTab.value];
+    if (loading.value || state.loadingMore || !state.hasMore || state.page < 1) return;
+    await loadPage(activeTab.value, state.page + 1, true);
+  };
+
+  /** 加载主创说评论（仅网易云内建源） */
+  const loadCreator = async (): Promise<void> => {
+    const track = trackRef.value;
+    if (!track || sourceId.value !== NETEASE_SOURCE_ID) {
+      creatorComments.value = [];
+      creatorError.value = "";
+      return;
+    }
+    const epoch = ++creatorEpoch;
+    creatorLoading.value = true;
+    creatorError.value = "";
+    try {
+      const result = await window.api.comments.creator({
+        sourceId: sourceId.value,
+        track: toRaw(track),
+      });
+      if (epoch !== creatorEpoch) return;
+      if (!result.ok) throw new Error(result.error);
+      creatorComments.value = result.data;
+    } catch (err) {
+      if (epoch !== creatorEpoch) return;
+      creatorError.value = err instanceof Error ? err.message : String(err);
+      creatorComments.value = [];
+    } finally {
+      if (epoch === creatorEpoch) creatorLoading.value = false;
+    }
+  };
+
+  /** 刷新两组评论与主创说 */
+  const refresh = async (): Promise<void> => {
+    resetPages();
+    await Promise.all([loadPage("hot"), loadPage("new"), loadCreator()]);
+    await nextTick();
+    scrollRef.value?.scrollTo({ top: 0 });
+  };
+
+  const setSource = (id: string): void => {
+    sourceId.value = id;
+  };
+
+  const setTab = (key: string): void => {
+    activeTab.value = key as CommentTab;
+  };
+
+  watch(trackRef, (next, previous) => {
+    if (!next || (previous && makeTrackKey(next) === makeTrackKey(previous))) return;
+    void refresh();
+  });
+
+  watch(sourceId, (next, previous) => {
+    if (!next || !previous || next === previous) return;
+    void refresh();
+  });
+
+  void loadSources().then(async () => {
+    if (!disposed) await refresh();
+  });
+
+  onScopeDispose(() => {
+    disposed = true;
+    requestTokens.hot += 1;
+    requestTokens.new += 1;
+    creatorEpoch += 1;
+    loadingEpoch += 1;
+  });
+
+  return {
+    sources,
+    sourceId,
+    activeTab,
+    pages,
+    creatorComments,
+    creatorLoading,
+    creatorError,
+    loading,
+    page,
+    sourceOptions,
+    tabs,
+    creatorIds,
+    dedupedList,
+    error,
+    loadSources,
+    loadPage,
+    loadMore,
+    loadCreator,
+    refresh,
+    setSource,
+    setTab,
+  };
+};
diff --git a/src/composables/useTrackMenu.ts b/src/composables/useTrackMenu.ts
index c582f787..d1ec3670 100644
--- a/src/composables/useTrackMenu.ts
+++ b/src/composables/useTrackMenu.ts
@@ -6,11 +6,11 @@ import type { DropdownMenuItem } from "@/components/ui/SDropdownMenu.vue";
 import * as player from "@/core/player";
 import { useSettingsStore } from "@/stores/settings";
 import { usePluginsStore } from "@/stores/plugins";
-import { useStatusStore } from "@/stores/status";
 import { useCopyText } from "@/composables/useCopyText";
 import { toast } from "@/composables/useToast";
 import { buildDownloadQualityItems } from "@/composables/useDownload";
 import { getShareUrl } from "@/utils/format/shareUrl";
+import { setCommentPageSnapshot } from "@/services/commentPageSnapshot";
 import { openExternal } from "@/utils/url";
 import IconPlay from "~icons/lucide/play";
 import IconListEnd from "~icons/lucide/list-end";
@@ -59,7 +59,6 @@ export const useTrackMenu = (
 ) => {
   const { t } = useI18n();
   const router = useRouter();
-  const status = useStatusStore();
   const settings = useSettingsStore();
   const plugins = usePluginsStore();
   const { copy } = useCopyText();
@@ -256,9 +255,18 @@ export const useTrackMenu = (
       case "searchSame":
         router.push({ path: "/search", query: { q: current.title } });
         break;
-      case "comments":
-        status.showComments(current);
+      case "comments": {
+        setCommentPageSnapshot(current);
+        router.push({
+          name: "comments",
+          params: { source: current.source, id: encodeURIComponent(current.id) },
+          query: {
+            name: current.title,
+            artists: current.artists.map((a) => a.name).join(" / "),
+          },
+        });
         break;
+      }
       case "copyTitle":
         await copy(current.title);
         break;
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
index 73b0c3bb..f765b856 100644
--- a/src/i18n/locales/en-US.json
+++ b/src/i18n/locales/en-US.json
@@ -131,7 +131,12 @@
     "empty": "No comments yet",
     "noSource": "No comment source available",
     "location": "From {location}",
-    "page": "Page {page} / {total}"
+    "page": "Page {page} / {total}",
+    "creator": "Creator Says",
+    "creatorBadge": "Creator",
+    "playTrack": "Play Track",
+    "back": "Back",
+    "pageTitle": "Song Comments"
   },
   "equalizer": {
     "title": "Equalizer",
diff --git a/src/i18n/locales/zh-CN.json b/src/i18n/locales/zh-CN.json
index 98c1fcfa..cae0bec3 100644
--- a/src/i18n/locales/zh-CN.json
+++ b/src/i18n/locales/zh-CN.json
@@ -119,7 +119,12 @@
     "empty": "暂无评论",
     "noSource": "没有可用的评论来源",
     "location": "来自{location}",
-    "page": "第 {page} / {total} 页"
+    "page": "第 {page} / {total} 页",
+    "creator": "主创说",
+    "creatorBadge": "主创",
+    "playTrack": "播放此曲",
+    "back": "返回",
+    "pageTitle": "歌曲评论"
   },
   "equalizer": {
     "title": "均衡器",
diff --git a/src/pages/Comments.vue b/src/pages/Comments.vue
new file mode 100644
index 00000000..ebedc8aa
--- /dev/null
+++ b/src/pages/Comments.vue
@@ -0,0 +1,224 @@
+<script setup lang="ts">
+import type { Track, TrackSource } from "@shared/types/player";
+import { useMediaStore } from "@/stores/media";
+import { consumeCommentPageSnapshot } from "@/services/commentPageSnapshot";
+import { useMusicComments } from "@/composables/useMusicComments";
+import * as player from "@/core/player";
+import CommentList from "@/components/comments/CommentList.vue";
+import IconLucideArrowLeft from "~icons/lucide/arrow-left";
+import IconLucidePlay from "~icons/lucide/play";
+import IconLucideRefreshCw from "~icons/lucide/refresh-cw";
+import IconLucideMessageCircleOff from "~icons/lucide/message-circle-off";
+
+const { t } = useI18n();
+const route = useRoute();
+const router = useRouter();
+const media = useMediaStore();
+
+const source = route.params.source as TrackSource;
+const id = decodeURIComponent(route.params.id as string);
+
+/** 构建独立页使用的冻结曲目快照 */
+const buildSnapshot = (): Track | null => {
+  const cached = consumeCommentPageSnapshot();
+  if (cached) return cached;
+  if (media.track && media.track.source === source && media.track.id === id) {
+    return media.track;
+  }
+  const name = typeof route.query.name === "string" ? route.query.name : id;
+  const artistsStr = typeof route.query.artists === "string" ? route.query.artists : "";
+  return {
+    id,
+    source,
+    title: name,
+    artists: artistsStr ? artistsStr.split(" / ").map((name) => ({ name })) : [],
+    duration: 0,
+  };
+};
+
+const trackSnapshot = shallowRef<Track | null>(buildSnapshot());
+const listScrollRef = ref<HTMLElement | null>(null);
+const loadMoreSentinelRef = ref<HTMLElement | null>(null);
+const comments = useMusicComments(trackSnapshot, listScrollRef);
+
+const {
+  sources,
+  sourceId,
+  activeTab,
+  creatorComments,
+  creatorIds,
+  loading,
+  page,
+  sourceOptions,
+  tabs,
+  dedupedList,
+  error,
+} = comments;
+
+const collapsed = ref(false);
+let loadMoreObserver: IntersectionObserver | undefined;
+
+const handleListScroll = (event: Event): void => {
+  const scrollTop = (event.target as HTMLElement).scrollTop;
+  if (!collapsed.value && scrollTop > 16) {
+    collapsed.value = true;
+  } else if (collapsed.value && scrollTop < 4) {
+    collapsed.value = false;
+  }
+};
+
+const handleBack = (): void => {
+  router.back();
+};
+
+const handlePlay = (): void => {
+  if (trackSnapshot.value) player.playNow(trackSnapshot.value);
+};
+
+onMounted(() => {
+  loadMoreObserver = new IntersectionObserver(
+    ([entry]) => {
+      if (entry?.isIntersecting) void comments.loadMore();
+    },
+    { root: listScrollRef.value, rootMargin: "0px 0px 400px", threshold: 0 },
+  );
+  if (loadMoreSentinelRef.value) loadMoreObserver.observe(loadMoreSentinelRef.value);
+});
+
+watch(
+  () => [activeTab.value, loading.value, page.value.list.length] as const,
+  async () => {
+    await nextTick();
+    const sentinel = loadMoreSentinelRef.value;
+    if (!sentinel || !loadMoreObserver) return;
+    loadMoreObserver.unobserve(sentinel);
+    loadMoreObserver.observe(sentinel);
+  },
+);
+
+onBeforeUnmount(() => loadMoreObserver?.disconnect());
+</script>
+
+<template>
+  <div class="flex flex-col h-full">
+    <div v-if="trackSnapshot" class="shrink-0 px-5 pb-2">
+      <div
+        class="flex mt-2 transition-[gap,margin] duration-250"
+        :class="collapsed ? 'gap-3 mb-3' : 'gap-5 mb-4'"
+      >
+        <SButton variant="ghost" circle class="shrink-0 mt-1" @click="handleBack">
+          <template #icon><IconLucideArrowLeft /></template>
+        </SButton>
+        <SImg
+          v-if="trackSnapshot.cover"
+          :src="trackSnapshot.cover"
+          :alt="trackSnapshot.title"
+          class="shrink-0 rounded-lg transition-[width,height] duration-250"
+          :class="collapsed ? 'size-14' : 'size-20'"
+        />
+        <div
+          v-else
+          class="shrink-0 rounded-lg bg-on-surface/8 transition-[width,height] duration-250"
+          :class="collapsed ? 'size-14' : 'size-20'"
+        />
+        <div class="flex-1 flex flex-col min-w-0 py-1">
+          <h1
+            class="font-bold text-on-surface truncate lh-normal transition-[font-size,line-height] duration-250"
+            :class="collapsed ? 'text-lg' : 'text-2xl'"
+          >
+            {{ trackSnapshot.title }}
+          </h1>
+          <div
+            class="truncate transition-[font-size,color] duration-250"
+            :class="
+              collapsed
+                ? 'text-xs text-on-surface-variant/50'
+                : 'text-sm text-on-surface-variant/60'
+            "
+          >
+            {{ trackSnapshot.artists.map((artist) => artist.name).join(" / ") }}
+          </div>
+        </div>
+        <SButton type="primary" variant="secondary" round class="shrink-0 mt-1" @click="handlePlay">
+          <template #icon><IconLucidePlay /></template>
+          {{ t("comments.playTrack") }}
+        </SButton>
+      </div>
+    </div>
+
+    <div class="shrink-0 flex items-center gap-3 px-5 pb-3">
+      <div class="min-w-0 flex-1">
+        <STabs v-model="activeTab" :tabs="tabs" type="bar" size="medium" />
+      </div>
+      <SButton variant="ghost" circle size="small" :loading="loading" @click="comments.refresh">
+        <template #icon><IconLucideRefreshCw /></template>
+      </SButton>
+      <div class="w-28 shrink-0">
+        <SSelect
+          v-model="sourceId"
+          :options="sourceOptions"
+          :disabled="sources.length === 0 || loading"
+        />
+      </div>
+    </div>
+
+    <div
+      ref="listScrollRef"
+      class="min-h-0 flex-1 overflow-y-auto px-5 pb-4 [scrollbar-gutter:stable]"
+      @scroll="handleListScroll"
+    >
+      <div v-if="creatorComments.length" class="mb-5">
+        <h3 class="text-sm font-semibold mb-3 text-on-surface">{{ t("comments.creator") }}</h3>
+        <CommentList :items="creatorComments" :creator-ids="creatorIds" :column-min-width="360" />
+      </div>
+
+      <div
+        v-if="!sources.length"
+        class="flex items-center justify-center py-16 text-on-surface-variant/60"
+      >
+        <div class="text-center">
+          <IconLucideMessageCircleOff class="mx-auto mb-4 size-14 opacity-30" />
+          <div class="text-sm">{{ t("comments.noSource") }}</div>
+        </div>
+      </div>
+      <div
+        v-else-if="error && page.list.length === 0"
+        class="flex flex-col items-center justify-center gap-3 py-16"
+      >
+        <div class="text-sm text-on-surface-variant">{{ error }}</div>
+        <SButton variant="outline" @click="comments.loadPage(activeTab, 1)">
+          {{ t("common.retry") }}
+        </SButton>
+      </div>
+      <div
+        v-else-if="page.list.length === 0 && loading"
+        class="flex items-center justify-center py-16 text-on-surface-variant/60"
+      >
+        <div class="text-center">
+          <SLoading class="mx-auto mb-4 block text-4xl text-primary/70" />
+          <div class="text-sm">{{ t("comments.loading") }}</div>
+        </div>
+      </div>
+      <div
+        v-else-if="page.list.length === 0"
+        class="flex items-center justify-center py-16 text-on-surface-variant/60"
+      >
+        <div class="text-center">
+          <IconLucideMessageCircleOff class="mx-auto mb-4 size-14 opacity-30" />
+          <div class="text-sm">{{ t("comments.empty") }}</div>
+        </div>
+      </div>
+      <CommentList v-else :items="dedupedList" :column-min-width="360" />
+
+      <div ref="loadMoreSentinelRef" class="h-px" />
+      <div v-if="page.loadingMore" class="flex justify-center py-5 text-on-surface-variant/60">
+        <SLoading class="text-2xl" />
+      </div>
+      <div v-else-if="page.appendError" class="flex justify-center py-5">
+        <SButton size="small" variant="outline" @click="comments.loadMore">
+          {{ t("common.retry") }}
+        </SButton>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/src/router/index.ts b/src/router/index.ts
index 173be534..ecb85c66 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -67,6 +67,11 @@ const router = createRouter({
           name: "artist",
           component: () => import("@/pages/Artist.vue"),
         },
+        {
+          path: "comments/:source/:id",
+          name: "comments",
+          component: () => import("@/pages/Comments.vue"),
+        },
         {
           path: "artists/local",
           name: "artist-list",
diff --git a/src/services/commentPageSnapshot.ts b/src/services/commentPageSnapshot.ts
new file mode 100644
index 00000000..237047a4
--- /dev/null
+++ b/src/services/commentPageSnapshot.ts
@@ -0,0 +1,22 @@
+import type { Track } from "@shared/types/player";
+
+/** 模块级快照：进入评论页前暂存 Track，页面消费后清空，避免长期持有引用 */
+let snapshot: Track | null = null;
+
+/**
+ * 设置评论页曲目快照
+ * @param track - 进入评论页的曲目
+ */
+export const setCommentPageSnapshot = (track: Track): void => {
+  snapshot = track;
+};
+
+/**
+ * 消费评论页曲目快照（一次性，取后即空）
+ * @returns 快照 Track 或 null
+ */
+export const consumeCommentPageSnapshot = (): Track | null => {
+  const track = snapshot;
+  snapshot = null;
+  return track;
+};
diff --git a/src/stores/status.ts b/src/stores/status.ts
index 0a46a829..c579bc1f 100644
--- a/src/stores/status.ts
+++ b/src/stores/status.ts
@@ -39,6 +39,8 @@ export const useStatusStore = defineStore(
     const commentsOpen = ref(false);
     /** 评论弹窗当前歌曲 */
     const commentsTrack = shallowRef<Track | null>(null);
+    /** 全屏播放器内嵌评论开关 */
+    const fullCommentsOpen = ref(false);
     /** 全屏播放器是否展示歌词 */
     const showLyric = ref(true);
     /** 当前播放索引 */
@@ -119,6 +121,7 @@ export const useStatusStore = defineStore(
       searchOpen,
       commentsOpen,
       commentsTrack,
+      fullCommentsOpen,
       showLyric,
       outputDevices,
       playIndex,
diff --git a/src/utils/commentMasonry.ts b/src/utils/commentMasonry.ts
new file mode 100644
index 00000000..6ea59802
--- /dev/null
+++ b/src/utils/commentMasonry.ts
@@ -0,0 +1,2 @@
+export const getMasonryRowSpan = (height: number, rowHeight: number, gap: number): number =>
+  Math.max(1, Math.ceil((height + gap) / (rowHeight + gap)));
diff --git a/src/utils/commentPagination.ts b/src/utils/commentPagination.ts
new file mode 100644
index 00000000..b8dd9be0
--- /dev/null
+++ b/src/utils/commentPagination.ts
@@ -0,0 +1,16 @@
+import type { MusicCommentItem } from "@shared/types/comment";
+
+export const appendUniqueComments = (
+  current: readonly MusicCommentItem[],
+  incoming: readonly MusicCommentItem[],
+): MusicCommentItem[] => {
+  const ids = new Set(current.map((item) => item.id));
+  return [...current, ...incoming.filter((item) => !ids.has(item.id) && ids.add(item.id))];
+};
+
+export const hasNextCommentPage = (
+  loadedCount: number,
+  total: number,
+  receivedCount: number,
+  limit = 20,
+): boolean => receivedCount === limit && loadedCount < total;