.aplayer.aplayer-fixed {
	left: unset !important;
	right: 1rem !important;
	bottom: 2rem !important;
	color: #000;
	width: 100%;
	background: transparent !important;
	box-shadow: none !important;
	transition:
		background 0.3s ease,
		box-shadow 0.3s ease,
		border-radius 0.3s ease;
}

/* 展开状态时始终显示背景（包括 local 模式和 meting 模式） */
.aplayer.aplayer-fixed:not(.aplayer-narrow) {
	background: var(--card-bg, white) !important;
	box-shadow:
		0 8px 32px rgba(0, 0, 0, 0.12),
		0 2px 8px rgba(0, 0, 0, 0.08) !important;
	border-radius: 16px !important;
	overflow: hidden;
}

.aplayer.aplayer-fixed:not(.aplayer-narrow) .aplayer-body {
	background: var(--card-bg, white) !important;
	border-radius: 16px !important;
}

/* 暗色主题：展开状态时显示背景 */
:root.dark .aplayer.aplayer-fixed:not(.aplayer-narrow) {
	background: var(--card-bg, oklch(0.23 0.015 var(--hue))) !important;
	box-shadow:
		0 8px 32px rgba(0, 0, 0, 0.4),
		0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

:root.dark .aplayer.aplayer-fixed:not(.aplayer-narrow) .aplayer-body {
	background: var(--card-bg, oklch(0.23 0.015 var(--hue))) !important;
}

/* 收缩状态下鼠标悬浮时显示背景 */
.aplayer.aplayer-fixed.aplayer-narrow:hover {
	background: var(--card-bg, white) !important;
	box-shadow:
		0 8px 32px rgba(0, 0, 0, 0.12),
		0 2px 8px rgba(0, 0, 0, 0.08) !important;
	border-radius: 16px !important;
}

/* 暗色主题悬浮效果 */
:root.dark .aplayer.aplayer-fixed.aplayer-narrow:hover {
	background: var(--card-bg, oklch(0.23 0.015 var(--hue))) !important;
	box-shadow:
		0 8px 32px rgba(0, 0, 0, 0.4),
		0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

:root.dark .aplayer.aplayer-fixed {
	color: var(--btn-content, oklch(0.75 0.1 var(--hue)));
}

.aplayer.aplayer-fixed .aplayer-body {
	left: unset !important;
	right: 1rem !important;
	width: 400px !important;
	bottom: 2rem !important;
	max-width: calc(100% - 18px);
	padding-right: 0 !important;
	background: transparent !important;
	transition: background 0.3s ease;
}

.aplayer.aplayer-fixed .aplayer-miniswitcher {
	right: unset;
	left: -18px;
	transform: rotate(180deg);
	opacity: 0;
	transition: opacity 0.2s ease;
}

/* 触摸设备：始终显示 miniswitcher 和背景 */
@media (hover: none) and (pointer: coarse) {
	.aplayer.aplayer-fixed .aplayer-miniswitcher {
		display: block;
		opacity: 1;
		/* 触摸设备上半透明背景 */
		background: rgba(200, 200, 200, 0.5) !important;
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
	}

	/* 触摸设备暗色主题：半透明背景 */
	:root.dark .aplayer.aplayer-fixed .aplayer-miniswitcher {
		background: rgba(100, 100, 100, 0.5) !important;
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
	}

	/* 触摸设备上始终显示背景 */
	.aplayer.aplayer-fixed {
		background: var(--card-bg, white) !important;
		box-shadow:
			0 2px 2px 0 rgba(0, 0, 0, 0.07),
			0 1px 5px 0 rgba(0, 0, 0, 0.1) !important;
	}

	:root.dark .aplayer.aplayer-fixed {
		background: var(--card-bg, oklch(0.23 0.015 var(--hue))) !important;
		box-shadow:
			0 2px 2px 0 rgba(0, 0, 0, 0.3),
			0 1px 5px 0 rgba(0, 0, 0, 0.4) !important;
	}
}

/* 非触摸设备：默认隐藏，悬停时显示 */
@media (hover: hover) {
	.aplayer.aplayer-fixed .aplayer-miniswitcher {
		display: none;
	}

	/* 鼠标悬停在播放器上时显示 miniswitcher */
	.aplayer.aplayer-fixed:hover .aplayer-miniswitcher {
		display: block;
		opacity: 1;
	}

	/* 收起状态下也支持悬停显示 */
	.aplayer.aplayer-fixed.aplayer-narrow:hover .aplayer-miniswitcher {
		display: block;
		opacity: 1;
	}

	/* 列表展开状态时始终显示收缩按钮 */
	.aplayer.aplayer-fixed.aplayer-withlist:not(.aplayer-narrow)
	.aplayer-miniswitcher {
		display: block !important;
		opacity: 1 !important;
	}
}

/* 禁用初始化时的过渡动画，只在加载完成后恢复 */
.aplayer.aplayer-fixed:not([data-initialized="true"]) .aplayer-body {
	transition: none !important;
}

.aplayer.aplayer-fixed:not([data-initialized="true"]) .aplayer-info {
	transition: none !important;
}

/* 缩小状态下禁用所有过渡动画 */
.aplayer.aplayer-narrow .aplayer-body {
	transition: none !important;
}

.aplayer.aplayer-narrow .aplayer-info {
	transition: none !important;
}

/* ===== 移动端适配 ===== */
@media (max-width: 768px) {
	.aplayer.aplayer-fixed {
		right: 0 !important;
		bottom: 0rem !important;
	}
	.aplayer.aplayer-fixed .aplayer-body {
		right: 0 !important;
		bottom: 0rem !important;
	}
}

/* ===== 平板适配 (改为与 FloatingControls 对齐) ===== */
@media (max-width: 1024px) and (min-width: 769px) {
	.aplayer.aplayer-fixed {
		right: 1rem !important;
		bottom: 2rem !important;
	}
	.aplayer.aplayer-fixed .aplayer-body {
		right: 1rem !important;
		bottom: 2rem !important;
	}
}

/* 高缩放比例适配 (Retina/High DPI) - 保持与 FloatingControls 一致 */
@media (min-resolution: 2dppx) and (min-width: 769px) {
	.aplayer.aplayer-fixed {
		right: max(0.5rem, 2rem - 2vw) !important;
	}
	.aplayer.aplayer-fixed .aplayer-body {
		right: max(0.5rem, 2rem - 2vw) !important;
	}
}

/* 横屏模式适配 */
@media (orientation: landscape) and (max-height: 640px) {
	.aplayer.aplayer-fixed {
		bottom: 2rem !important;
	}
	.aplayer.aplayer-fixed .aplayer-body {
		bottom: 2rem !important;
	}
}

/* ===== 封面播放特效 ===== */
/* 封面基础样式 - 改为发光音符 */
.aplayer .aplayer-pic,
.aplayer.aplayer-fixed .aplayer-pic,
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-pic {
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease,
		border-radius 0.3s ease;
	overflow: visible !important;
	position: relative;
	aspect-ratio: 1;
	background: rgba(34, 197, 94, 0.1) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
}

/* 隐藏原封面图片 */
.aplayer .aplayer-pic img,
.aplayer.aplayer-fixed .aplayer-pic img {
	display: none !important;
	opacity: 0 !important;
	visibility: hidden !important;
}

/* 发光绿色音符 */
.aplayer .aplayer-pic::before,
.aplayer.aplayer-fixed .aplayer-pic::before {
	content: "♪" !important;
	font-size: 36px !important;
	color: #22c55e !important;
	text-shadow:
		0 0 10px #22c55e,
		0 0 20px #22c55e,
		0 0 30px #22c55e,
		0 0 40px rgba(34, 197, 94, 0.5) !important;
	animation: music-note-glow 2s ease-in-out infinite !important;
	position: absolute !important;
	z-index: 10 !important;
	display: block !important;
}

/* 音符发光呼吸动画 */
@keyframes music-note-glow {
	0%,
	100% {
		text-shadow:
			0 0 10px #22c55e,
			0 0 20px #22c55e,
			0 0 30px #22c55e,
			0 0 40px rgba(34, 197, 94, 0.5);
		opacity: 1;
	}
	50% {
		text-shadow:
			0 0 15px #22c55e,
			0 0 30px #22c55e,
			0 0 45px #22c55e,
			0 0 60px rgba(34, 197, 94, 0.6);
		opacity: 0.9;
	}
}

/* 隐藏播放/暂停按钮覆盖层 */
.aplayer .aplayer-pic .aplayer-play,
.aplayer .aplayer-pic .aplayer-pause,
.aplayer .aplayer-pic .aplayer-button,
.aplayer.aplayer-fixed .aplayer-pic .aplayer-play,
.aplayer.aplayer-fixed .aplayer-pic .aplayer-pause,
.aplayer.aplayer-fixed .aplayer-pic .aplayer-button {
	display: none !important;
	opacity: 0 !important;
}

/* 缩小状态下禁用过渡动画 */
.aplayer.aplayer-narrow .aplayer-pic {
	transition: none !important;
}

/* 旋转动画关键帧 */
@keyframes aplayer-cover-rotate {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* 发光脉动动画 */
@keyframes aplayer-cover-pulse {
	0%,
	100% {
		box-shadow: 0 0 15px rgba(34, 197, 94, 0.3);
	}
	50% {
		box-shadow: 0 0 25px rgba(34, 197, 94, 0.5);
	}
}

/* 暗色主题脉动动画 */
@keyframes aplayer-cover-pulse-dark {
	0%,
	100% {
		box-shadow: 0 0 20px rgba(34, 197, 94, 0.4);
	}
	50% {
		box-shadow: 0 0 35px rgba(34, 197, 94, 0.6);
	}
}

/* 桌面端：播放状态旋转动画 */
@media (hover: hover) {
	/* 始终应用旋转动画，但通过 animation-play-state 控制播放/暂停 */
	.aplayer .aplayer-pic {
		animation:
			aplayer-cover-rotate 8s linear infinite,
			aplayer-cover-pulse 2s ease-in-out infinite;
		animation-play-state: paused;
	}

	/* 播放状态：恢复动画 */
	.aplayer[data-playing="true"] .aplayer-pic,
	.aplayer.aplayer-playing .aplayer-pic {
		animation-play-state: running;
	}

	/* 暂停状态：暂停动画（保持当前位置） */
	.aplayer[data-playing="false"] .aplayer-pic,
	.aplayer.aplayer-pause .aplayer-pic {
		animation-play-state: paused;
	}

	/* 暗色主题下的播放特效 */
	:root.dark .aplayer[data-playing="true"] .aplayer-pic,
	:root.dark .aplayer.aplayer-playing .aplayer-pic {
		animation:
			aplayer-cover-rotate 8s linear infinite,
			aplayer-cover-pulse-dark 2s ease-in-out infinite;
		animation-play-state: running;
	}

	/* 暗色主题暂停状态 */
	:root.dark .aplayer[data-playing="false"] .aplayer-pic,
	:root.dark .aplayer.aplayer-pause .aplayer-pic {
		animation:
			aplayer-cover-rotate 8s linear infinite,
			aplayer-cover-pulse-dark 2s ease-in-out infinite;
		animation-play-state: paused;
	}
}

/* 触摸设备：无旋转动画，保持静态 */
@media (hover: none) and (pointer: coarse) {
	.aplayer .aplayer-pic {
		animation: none !important;
	}

	.aplayer[data-playing="true"] .aplayer-pic,
	.aplayer.aplayer-playing .aplayer-pic,
	.aplayer[data-playing="false"] .aplayer-pic,
	.aplayer.aplayer-pause .aplayer-pic {
		animation: none !important;
		animation-play-state: paused !important;
	}
}

/* 桌面端：播放时隐藏暂停按钮，暂停时显示播放按钮 */
@media (hover: hover) {
	/* 播放状态时隐藏暂停按钮（封面在转，不需要暂停按钮） */
	.aplayer[data-playing="true"] .aplayer-pic .aplayer-pause,
	.aplayer.aplayer-playing .aplayer-pic .aplayer-pause {
		display: none !important;
	}

	/* 播放状态时隐藏播放按钮（因为已经播放了） */
	.aplayer[data-playing="true"] .aplayer-pic .aplayer-play,
	.aplayer.aplayer-playing .aplayer-pic .aplayer-play {
		display: none !important;
	}

	/* 暂停状态时隐藏暂停按钮，只显示播放按钮 */
	.aplayer[data-playing="false"] .aplayer-pic .aplayer-pause,
	.aplayer.aplayer-pause .aplayer-pic .aplayer-pause,
	.aplayer:not([data-playing="true"]):not(.aplayer-playing)
		.aplayer-pic
		.aplayer-pause {
		display: none !important;
	}

	/* 暂停状态时显示播放按钮（通过悬停显示） */
	.aplayer[data-playing="false"] .aplayer-pic:hover .aplayer-play,
	.aplayer.aplayer-pause .aplayer-pic:hover .aplayer-play,
	.aplayer:not([data-playing="true"]):not(.aplayer-playing)
		.aplayer-pic:hover
		.aplayer-play {
		display: block !important;
	}
}

/* ===== 亮色主题适配 ===== */

/* ===== 暗色主题适配 ===== */
:root.dark .aplayer {
	background: var(--card-bg, oklch(0.23 0.015 var(--hue)));
	box-shadow:
		0 2px 2px 0 rgba(0, 0, 0, 0.3),
		0 1px 5px 0 rgba(0, 0, 0, 0.4);
}

:root.dark .aplayer.aplayer-withlist .aplayer-info {
	border-bottom: 1px solid var(--line-divider, rgba(255, 255, 255, 0.08));
}

:root.dark .aplayer.aplayer-fixed .aplayer-list {
	border: 1px solid var(--line-divider, rgba(255, 255, 255, 0.08));
	border-bottom: none;
}

:root.dark .aplayer.aplayer-fixed .aplayer-body {
	background: var(--card-bg, oklch(0.23 0.015 var(--hue)));
}

:root.dark .aplayer.aplayer-fixed .aplayer-lrc {
	text-shadow: -1px -1px 0 var(--card-bg, oklch(0.23 0.015 var(--hue)));
}

:root.dark .aplayer.aplayer-fixed .aplayer-info {
	border-top: 1px solid var(--line-divider, rgba(255, 255, 255, 0.08));
}

:root.dark .aplayer .aplayer-info .aplayer-music .aplayer-author {
	color: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark
	.aplayer
	.aplayer-info
	.aplayer-controller
	.aplayer-bar-wrap
	.aplayer-bar {
	background: rgba(255, 255, 255, 0.2);
}

:root.dark
	.aplayer
	.aplayer-info
	.aplayer-controller
	.aplayer-bar-wrap
	.aplayer-bar
	.aplayer-loaded {
	background: rgba(255, 255, 255, 0.3);
}

:root.dark .aplayer .aplayer-info .aplayer-controller .aplayer-time {
	color: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark
	.aplayer
	.aplayer-info
	.aplayer-controller
	.aplayer-time
	.aplayer-icon
	path {
	fill: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark
	.aplayer
	.aplayer-info
	.aplayer-controller
	.aplayer-time
	.aplayer-icon:hover
	path {
	fill: var(--btn-content, oklch(0.75 0.1 var(--hue)));
}

:root.dark
	.aplayer
	.aplayer-info
	.aplayer-controller
	.aplayer-volume-wrap
	.aplayer-volume-bar-wrap
	.aplayer-volume-bar {
	background: rgba(255, 255, 255, 0.2);
}

:root.dark .aplayer .aplayer-lrc:before {
	background: linear-gradient(
		180deg,
		var(--card-bg, oklch(0.23 0.015 var(--hue))) 0,
		hsla(0, 0%, 100%, 0)
	);
}

:root.dark .aplayer .aplayer-lrc:after {
	background: linear-gradient(
		180deg,
		hsla(0, 0%, 100%, 0) 0,
		rgba(255, 255, 255, 0.1)
	);
}

:root.dark .aplayer .aplayer-lrc p {
	color: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark .aplayer .aplayer-list ol::-webkit-scrollbar-thumb {
	background-color: rgba(255, 255, 255, 0.2);
}

:root.dark .aplayer .aplayer-list ol::-webkit-scrollbar-thumb:hover {
	background-color: rgba(255, 255, 255, 0.3);
}

:root.dark .aplayer .aplayer-list ol li {
	border-top: 1px solid var(--line-divider, rgba(255, 255, 255, 0.08));
}

:root.dark .aplayer .aplayer-list ol li:hover {
	background: var(--btn-plain-bg-hover, oklch(0.3 0.035 var(--hue)));
}

:root.dark .aplayer .aplayer-list ol li.aplayer-list-light {
	background: var(--btn-plain-bg-hover, oklch(0.3 0.035 var(--hue)));
}

:root.dark .aplayer .aplayer-list ol li .aplayer-list-index {
	color: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark .aplayer .aplayer-list ol li .aplayer-list-author {
	color: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark .aplayer .aplayer-notice {
	background-color: var(--card-bg, oklch(0.23 0.015 var(--hue)));
	color: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark .aplayer .aplayer-miniswitcher {
	background: var(--btn-regular-bg, oklch(0.33 0.035 var(--hue)));
	border-top: 1px solid var(--line-divider, #e5e7eb);
	border-bottom: 1px solid var(--line-divider, #e5e7eb);
	border-left: 1px solid var(--line-divider, #e5e7eb);
}

:root.dark .aplayer .aplayer-miniswitcher .aplayer-icon path {
	fill: var(--content-meta, rgba(255, 255, 255, 0.6));
}

:root.dark .aplayer .aplayer-miniswitcher .aplayer-icon:hover path {
	fill: var(--btn-content, oklch(0.75 0.1 var(--hue)));
}

:root.dark .aplayer .aplayer-info .aplayer-music .aplayer-title {
	color: var(--btn-content, oklch(0.75 0.1 var(--hue)));
}

:root.dark .aplayer .aplayer-list ol li .aplayer-list-title {
	color: var(--btn-content, oklch(0.75 0.1 var(--hue)));
}

/* ===== 现代简约风格增强 ===== */

/* 进度条渐变 */
.aplayer .aplayer-bar-wrap .aplayer-bar .aplayer-played {
	background: linear-gradient(90deg, #8b5cf6, #a78bfa) !important;
}

.aplayer .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb {
	background: #8b5cf6 !important;
	box-shadow: 0 0 8px rgba(139, 92, 246, 0.5);
}

/* 进度条圆角 */
.aplayer .aplayer-bar-wrap .aplayer-bar {
	border-radius: 4px !important;
	height: 4px !important;
	background: rgba(0, 0, 0, 0.1) !important;
}

.aplayer .aplayer-bar-wrap .aplayer-bar .aplayer-loaded {
	border-radius: 4px !important;
}

.aplayer .aplayer-bar-wrap .aplayer-bar .aplayer-played {
	border-radius: 4px !important;
}

/* 音量条渐变 */
.aplayer .aplayer-volume-bar-wrap .aplayer-volume-bar .aplayer-volume {
	background: linear-gradient(180deg, #8b5cf6, #a78bfa) !important;
	border-radius: 4px !important;
}

/* 列表项悬浮效果 */
.aplayer .aplayer-list ol li {
	transition:
		background 0.2s ease,
		transform 0.2s ease;
	border-radius: 8px;
	margin: 2px 4px;
}

.aplayer .aplayer-list ol li:hover {
	background: rgba(139, 92, 246, 0.1) !important;
}

.aplayer .aplayer-list ol li.aplayer-list-light {
	background: rgba(139, 92, 246, 0.15) !important;
}

/* 列表容器圆角 */
.aplayer.aplayer-fixed .aplayer-list {
	border-radius: 12px !important;
	overflow: hidden;
	margin-top: 8px;
}

/* 控制按钮悬浮效果 */
.aplayer .aplayer-icon {
	transition:
		transform 0.2s ease,
		opacity 0.2s ease;
}

.aplayer .aplayer-icon:hover {
	transform: scale(1.1);
}

/* 歌曲标题样式 */
.aplayer .aplayer-info .aplayer-music .aplayer-title {
	font-weight: 600;
}

/* 暗色主题进度条 */
:root.dark .aplayer .aplayer-bar-wrap .aplayer-bar {
	background: rgba(255, 255, 255, 0.15) !important;
}

:root.dark .aplayer .aplayer-list ol li:hover {
	background: rgba(139, 92, 246, 0.2) !important;
}

:root.dark .aplayer .aplayer-list ol li.aplayer-list-light {
	background: rgba(139, 92, 246, 0.25) !important;
}
