/* Shared large artwork play control. Matches the approved /new_music Latest Music button.
   Functional classes (.play_btn, .play_btn_small) stay in place. */

#page[data-page="discover"] #ss-disc-new .track .track_info,
#page[data-page="albums"] .store_albums .track .cover_art {
	position: relative;
}

#page[data-page="discover"] #ss-disc-new .track .track_info .play_btn,
#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small,
#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play {
	position: absolute;
	left: auto;
	right: 12px;
	bottom: calc(100% + 12px);
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: #f5c518;
	background-image: none;
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28);
	overflow: visible;
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
	z-index: 2;
	cursor: pointer;
	flex: 0 0 auto;
}

#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small,
#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play {
	position: relative;
	right: auto;
	bottom: auto;
	top: auto;
	left: auto;
}

#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small {
	position: absolute;
	right: 12px;
	bottom: 12px;
}

#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play {
	margin-left: 15px;
}

#page[data-page="discover"] #ss-disc-new .track .track_info .play_btn::before,
#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small::before,
#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play::before {
	content: "";
	position: absolute;
	inset: -2px;
	border-radius: 50%;
	background: conic-gradient(from 210deg, #ffd166, #ff8a3d, #ff4d9a, #8b5cf6, #3b82f6, #22d3ee, #ffd166);
	box-shadow: 0 0 8px rgba(255, 209, 102, 0.28);
	z-index: 0;
	pointer-events: none;
}

#page[data-page="discover"] #ss-disc-new .track .track_info .play_btn::after,
#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small::after,
#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play::after {
	content: "";
	position: absolute;
	inset: 1px;
	border-radius: 50%;
	background: #f5c518;
	z-index: 1;
	pointer-events: none;
}

#page[data-page="discover"] #ss-disc-new .track .track_info .play_btn svg,
#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play svg {
	display: block !important;
	width: 20px;
	height: 20px;
	position: relative !important;
	left: auto !important;
	top: auto !important;
	transform: none !important;
	z-index: 2;
	margin: 0;
}

#page[data-page="discover"] #ss-disc-new .track .track_info .play_btn svg path,
#page[data-page="spotlight"] .feed_sidebar_song .ss-ring-play svg path {
	fill: #111 !important;
}

/* Album cards use a compound circle SVG. Hide that graphic and draw the same triangle on the fill. */
#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small svg {
	display: none !important;
}

#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small::after {
	background-color: #f5c518;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23111' d='M8 5.14v14l11-7-11-7z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}

@media (hover: hover) and (pointer: fine) {
	#page[data-page="discover"] #ss-disc-new .track .track_info .play_btn,
	#page[data-page="albums"] .store_albums .track .cover_art .play_btn_small {
		opacity: 0;
		visibility: hidden;
		transform: translateY(6px);
	}
	#page[data-page="discover"] #ss-disc-new .track:hover .track_info .play_btn,
	#page[data-page="albums"] .store_albums .track:hover .cover_art .play_btn_small {
		opacity: 1;
		visibility: visible;
		transform: none;
	}
}

/* Top Albums, Discover Most Popular, Artists New Videos. */
#page[data-page="top_music"] .mus_top_albms .cover_art .play_btn,
#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art,
#page[data-page="artists"] .ss-roster-videos .ss-video-card-play {
	position: absolute;
	top: auto;
	left: auto;
	right: 12px;
	bottom: 12px;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: #f5c518;
	background-image: none;
	color: #111;
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28);
	overflow: visible;
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
	z-index: 2;
	cursor: pointer;
}

#page[data-page="top_music"] .mus_top_albms .cover_art .play_btn::before,
#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art::before,
#page[data-page="artists"] .ss-roster-videos .ss-video-card-play::before {
	content: "";
	position: absolute;
	inset: -2px;
	border-radius: 50%;
	background: conic-gradient(from 210deg, #ffd166, #ff8a3d, #ff4d9a, #8b5cf6, #3b82f6, #22d3ee, #ffd166);
	box-shadow: 0 0 8px rgba(255, 209, 102, 0.28);
	z-index: 0;
	pointer-events: none;
}

#page[data-page="top_music"] .mus_top_albms .cover_art .play_btn::after,
#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art::after,
#page[data-page="artists"] .ss-roster-videos .ss-video-card-play::after {
	content: "";
	position: absolute;
	inset: 1px;
	border-radius: 50%;
	background: #f5c518;
	z-index: 1;
	pointer-events: none;
}

#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art svg {
	display: block !important;
	width: 20px;
	height: 20px;
	position: relative !important;
	z-index: 2;
	margin: 0;
	transform: none !important;
}

#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art svg path {
	fill: #111 !important;
}

#page[data-page="top_music"] .mus_top_albms .cover_art .play_btn svg,
#page[data-page="artists"] .ss-roster-videos .ss-video-card-play svg {
	display: none !important;
}

#page[data-page="top_music"] .mus_top_albms .cover_art .play_btn::after,
#page[data-page="artists"] .ss-roster-videos .ss-video-card-play::after {
	background-color: #f5c518;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23111' d='M8 5.14v14l11-7-11-7z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}

@media (hover: hover) and (pointer: fine) {
	#page[data-page="top_music"] .mus_top_albms .cover_art .play_btn,
	#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art,
	#page[data-page="artists"] .ss-roster-videos .ss-video-card-play {
		opacity: 0;
		visibility: hidden;
		transform: translateY(6px);
	}
	#page[data-page="top_music"] .mus_top_albms .track:hover .cover_art .play_btn,
	#page[data-page="discover"] #ss-disc-popular .ss-disc-card:hover .ss-disc-card-play--art,
	#page[data-page="discover"] #ss-disc-popular .ss-disc-card-play--art:focus,
	#page[data-page="artists"] .ss-roster-videos .ss-video-card:hover .ss-video-card-play {
		opacity: 1;
		visibility: visible;
		transform: none;
	}
}

/* Albums genre chips. Brand ring only. Not a play control. */
#page[data-page="albums"] .ds_genre_list a {
	position: relative;
	isolation: isolate;
	border: 1px solid transparent;
	background: rgba(255, 255, 255, 0.05);
	box-shadow: none;
	transition: color 0.2s ease, background-color 0.2s ease;
}

#page[data-page="albums"] .ds_genre_list a::before {
	content: "";
	position: absolute;
	inset: -3px;
	border-radius: inherit;
	background: conic-gradient(from 210deg, #ffd166, #ff8a3d, #ff4d9a, #8b5cf6, #3b82f6, #22d3ee, #ffd166);
	z-index: -2;
	pointer-events: none;
}

#page[data-page="albums"] .ds_genre_list a::after {
	content: "";
	position: absolute;
	inset: -1px;
	border-radius: inherit;
	background: rgb(7, 8, 9);
	z-index: -1;
	pointer-events: none;
}

#page[data-page="albums"] .ds_genre_list a:hover,
#page[data-page="albums"] .ds_genre_list a.active {
	background: rgba(255, 209, 102, 0.14);
	color: #ffd166;
}

#page[data-page="albums"] .ds_genre_list a:hover::before {
	box-shadow: 0 0 8px rgba(255, 209, 102, 0.22);
}