diff --git a/app/page.tsx b/app/page.tsx
index 82632dc..95810ce 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -6,7 +6,6 @@ import { useRouter, useSearchParams } from 'next/navigation'
 import Image from 'next/image'
 import { format } from 'date-fns'
 import UploadModal from '@/components/UploadModal'
-import AudioVisualizer from '@/components/AudioVisualizer'
 import Header from '@/components/Header'
 import ChangePasswordModal from '@/components/ChangePasswordModal'
 import MaterialPreviewModal from '@/components/MaterialPreviewModal'
@@ -2033,64 +2032,46 @@ export default function Home() {
                             />
                           )
                         ) : isAudioMaterial ? (
-                          // 音频素材卡片 - 支持卡片内播放 + 圆形频谱可视化
-                          <div className="absolute inset-0 flex flex-col items-center justify-center bg-slate-800 overflow-hidden">
-                            {/* 圆形频谱可视化背景 - 只在播放时显示 */}
-                            {playingAudioId === material.id && (
-                              <div className="absolute inset-0 flex items-center justify-center">
-                                <AudioVisualizer
-                                  audioElement={audioRef.current}
-                                  isPlaying={true}
-                                  size="sm"
-                                  coverImage={null}
-                                  showCoverOnPause={false}
+                          <div className="absolute inset-0 flex flex-col justify-between bg-slate-100 p-4 dark:bg-slate-800">
+                            <div className="flex items-start gap-3">
+                              <div className="flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg border border-slate-200 bg-white dark:border-slate-700 dark:bg-slate-900">
+                                <svg className="h-5 w-5 text-slate-500 dark:text-slate-300" fill="currentColor" viewBox="0 0 24 24">
+                                  <path d="M9 19V6l12-3v13M9 19c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zm12-3c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2z" />
+                                </svg>
+                              </div>
+                              <div className="min-w-0">
+                                <p className="line-clamp-2 text-sm font-medium text-slate-900 dark:text-white">{material.productModel}</p>
+                                <p className="mt-1 text-xs text-slate-500 dark:text-slate-400">
+                                  {material.audioDuration || '音频素材'}
+                                </p>
+                              </div>
+                            </div>
+                            <div className="space-y-3">
+                              <div className="h-1.5 overflow-hidden rounded bg-slate-200 dark:bg-slate-700">
+                                <div
+                                  className="h-full bg-slate-500 transition-[width] duration-100 dark:bg-slate-400"
+                                  style={{ width: playingAudioId === material.id ? `${audioProgress}%` : '0%' }}
                                 />
                               </div>
-                            )}
-                            {/* 播放进度条（底部） */}
-                            {playingAudioId === material.id && (
-                              <div className="absolute bottom-0 left-0 right-0 h-1 bg-slate-700 z-20">
-                                <div 
-                                  className="h-full bg-slate-400 transition-all duration-100"
-                                  style={{ width: `${audioProgress}%` }}
-                                />
-                              </div>
-                            )}
-                            {/* 信息覆盖层 */}
-                            <div className="absolute inset-0 z-10 flex flex-col items-center justify-center pointer-events-none">
-                              {/* 播放/暂停按钮 */}
                               <button
                                 type="button"
                                 onClick={(e) => {
                                   e.stopPropagation()
                                   handleAudioPlay(material.id, audioUrl)
                                 }}
-                                className={cn(
-                                  "w-14 h-14 rounded-full flex items-center justify-center border transition-colors pointer-events-auto",
-                                  playingAudioId === material.id 
-                                    ? "bg-white/30 border-white/50 hover:bg-white/40" 
-                                    : "bg-white/20 border-white/30 hover:bg-white/30"
-                                )}
+                                className="inline-flex h-9 items-center gap-2 rounded-md border border-slate-300 bg-white px-3 text-sm font-medium text-slate-700 transition-colors hover:bg-slate-50 dark:border-slate-600 dark:bg-slate-900 dark:text-slate-200 dark:hover:bg-slate-800"
                               >
                                 {playingAudioId === material.id ? (
-                                  <svg className="w-7 h-7 text-white" fill="currentColor" viewBox="0 0 24 24">
+                                  <svg className="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
                                     <path d="M6 4h4v16H6V4zm8 0h4v16h-4V4z" />
                                   </svg>
                                 ) : (
-                                  <svg className="w-7 h-7 text-white ml-1" fill="currentColor" viewBox="0 0 24 24">
+                                  <svg className="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
                                     <path d="M8 5v14l11-7z" />
                                   </svg>
                                 )}
+                                <span>{playingAudioId === material.id ? '暂停' : '播放'}</span>
                               </button>
-                              {/* 音频名称 - 只在未播放时显示 */}
-                              {playingAudioId !== material.id && (
-                                <>
-                                  <p className="text-white text-sm font-medium text-center px-4 line-clamp-1 mt-3">{material.productModel}</p>
-                                  {material.audioDuration && (
-                                    <p className="text-white/80 text-xs mt-1">{material.audioDuration}</p>
-                                  )}
-                                </>
-                              )}
                             </div>
                           </div>
                         ) : (
diff --git a/docs/商业化地基排查问题清单_20260524.md b/docs/商业化地基排查问题清单_20260524.md
index 732b85a..d51baa7 100644
--- a/docs/商业化地基排查问题清单_20260524.md
+++ b/docs/商业化地基排查问题清单_20260524.md
@@ -1046,6 +1046,7 @@ NAS 私有化系统可能在平板或窄屏浏览器里使用。模板编辑器
 - `app/page.tsx:400`：精品、下载榜、点赞榜使用多段渐变角标。
 - `app/page.tsx`：排序方式已从大号胶囊按钮改为普通矩形按钮组。
 - `app/page.tsx`：首页素材类型筛选和筛选弹窗内选项已从胶囊按钮、hover 滑动显示数量和阴影状态，收为普通矩形按钮；数量默认稳定显示，不再依赖鼠标悬停。
+- `app/page.tsx`：首页音频素材卡片已从大圆形播放按钮和圆形频谱背景，收为小图标、文件名、普通进度条和矩形播放按钮。
 - `app/page.tsx`：首页素材卡片已从大圆角、轻阴影和黑色半透明胶囊收为普通 `rounded-lg` 边框卡片、中性标签和弱化的素材型号标识。
 - `app/profile/page.tsx`：个人页“我的素材 / 我的点赞 / 浏览历史”卡片已从大圆角和黑色渐变覆盖层收为普通边框卡片和浅底信息条。
 - `components/RankingPanel.tsx`：浮动榜单面板已移除毛玻璃、重阴影、超大圆角和前三名金色卡片感，改为普通边框小面板。