@property --play-border-angle-a {
	syntax: "<angle>";
	inherits: false;
	initial-value: 0deg;
}

@property --play-border-angle-b {
	syntax: "<angle>";
	inherits: false;
	initial-value: 180deg;
}

.navbar-logo-wrapper {
	display: grid;
	gap: 1rem;
	container-type: inline-size;
	container-name: radio-host;
}

.radio-player,
.radio-player button {
	font-family: "Manrope", "Noto Sans", "Segoe UI", sans-serif;
}

.radio-player {
	position: relative;
	isolation: isolate;
	box-sizing: border-box;
	width: 100%;
	min-height: 8.9rem;
	padding: 1rem 3.55rem 1rem 1rem;
	overflow: hidden;
	border: 1px solid var(--ml-border-soft);
	border-radius: var(--bs-border-radius-xl);
	background:
		linear-gradient(
			135deg,
			var(--ml-cool-deep) 0%,
			var(--ml-surface) 52%,
			var(--ml-surface-raised) 100%
		);
	box-shadow:
		var(--shadow-card),
		inset 0 1px color-mix(in srgb, var(--ml-text) 5%, transparent);
	color: var(--ml-text);
	transition:
		width 180ms ease,
		min-height 180ms ease,
		padding 180ms ease,
		border-radius 180ms ease,
		box-shadow 180ms ease;
}

.radio-player::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	z-index: -1;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--ml-accent), transparent);
	opacity: 0.8;
}

.radio-player__layout {
	display: grid;
	grid-template-columns:
		minmax(7.4rem, 8.35rem)
		minmax(0, 1fr)
		minmax(5.35rem, 6.2rem);
	align-items: center;
	gap: clamp(0.75rem, 1.5vw, 1.45rem);
	min-height: 6.9rem;
}

.radio-player__dock-toggle,
.radio-player__play-button,
.radio-player__app-button {
	appearance: none;
	display: inline-grid;
	place-items: center;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid var(--ml-border-soft);
	background: var(--ml-surface);
	color: inherit;
	font: inherit;
	cursor: pointer;
	transition:
		transform 150ms ease,
		background-color 150ms ease,
		border-color 150ms ease,
		box-shadow 150ms ease;
}

.radio-player__dock-toggle:hover,
.radio-player__app-button:hover {
	background: var(--ml-surface-hover);
	border-color: color-mix(in srgb, var(--ml-accent) 46%, var(--ml-border));
	transform: translateY(-1px);
}


.radio-player__dock-toggle:focus-visible,
.radio-player__play-button:focus-visible,
.radio-player__app-button:focus-visible,
.radio-player__volume-knob:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--ml-accent) 72%, transparent);
	outline-offset: 3px;
}

.radio-player__dock-toggle {
	position: absolute;
	top: 0.78rem;
	right: 0.9rem;
	z-index: 4;
	width: 2.4rem;
	height: 2.05rem;
	border-radius: 0.65rem;
}

.radio-player__dock-line {
	display: block;
	width: 1.05rem;
	height: 2px;
	border-radius: 999px;
	background: currentColor;
}

.radio-player__control-column {
	display: grid;
	justify-items: center;
	gap: 0.45rem;
	min-width: 7.4rem;
}

.radio-player__play-stage {
	position: relative;
	isolation: isolate;
	display: grid;
	place-items: center;
	box-sizing: border-box;
	width: 6.9rem;
	height: 5.1rem;
}


.radio-player__equalizer {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 0.45rem 0.1rem;
	overflow: hidden;
	pointer-events: none;
	filter: drop-shadow(0 0.15rem 0.42rem color-mix(in srgb, var(--ml-accent) 24%, transparent));
}

.radio-player__equalizer span {
	flex: 0 0 0.42rem;
	width: 0.42rem;
	height: 100%;
	max-height: 100%;
	border-radius: 999px;
	/* background: linear-gradient(to top, var(--ml-accent-active), var(--ml-accent-hover)); */
	background: linear-gradient(to top, color-mix(in srgb, var(--ml-accent) 52%, transparent), color-mix(in srgb, var(--ml-text) 66%, transparent));
	transform: scaleY(0.18);
	transform-origin: center;
	opacity: 0.28;
	animation: radio-eq 760ms ease-in-out infinite alternate;
	animation-play-state: paused;
}

.radio-player__equalizer span:nth-child(2) { animation-duration: 620ms; animation-delay: -180ms; }
.radio-player__equalizer span:nth-child(3) { animation-duration: 890ms; animation-delay: -420ms; }
.radio-player__equalizer span:nth-child(4) { animation-duration: 540ms; animation-delay: -110ms; }
.radio-player__equalizer span:nth-child(5) { animation-duration: 810ms; animation-delay: -350ms; }
.radio-player__equalizer span:nth-child(6) { animation-duration: 680ms; animation-delay: -230ms; }
.radio-player__equalizer span:nth-child(7) { animation-duration: 940ms; animation-delay: -510ms; }

.radio-player[data-state="playing"] .radio-player__equalizer span {
	opacity: 0.9;
	animation-play-state: running;
}

.radio-player__play-button {
	position: relative;
	z-index: 2;
	width: 4.05rem;
	height: 4.05rem;
	border: 2px solid var(--ml-accent);
	border-radius: 50%;
	background: linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep));
	color: var(--ml-accent-hover);
	font-size: 1.2rem;
	overflow: visible;
	box-shadow:
		inset 0 1px color-mix(in srgb, var(--ml-text) 8%, transparent),
		0 0.55rem 1.4rem color-mix(in srgb, var(--bs-black) 22%, transparent);
	filter: none;
	transition:
		transform 160ms cubic-bezier(0.22, 1, 0.36, 1),
		border-color 160ms ease,
		background-color 160ms ease,
		box-shadow 160ms ease;
}

.radio-player__apps {
	display: grid;
	grid-template-columns: repeat(4, 1.9rem);
	gap: 0.25rem;
}

.radio-player__app-button {
	width: 1.9rem;
	height: 1.9rem;
	border-radius: 0.56rem;
	font-size: 0.72rem;
}

.radio-player__app-text {
	font-size: 0.54rem;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.radio-player__identity {
	display: grid;
	align-content: center;
	min-width: 0;
	padding-block: 0.12rem;
	overflow: visible;
}

.radio-player__eyebrow {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.28rem;
	color: var(--ml-muted);
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

.radio-player__live-dot {
	width: 0.52rem;
	height: 0.52rem;
	border: 2px solid var(--ml-accent);
	border-radius: 50%;
}

.radio-player[data-state="playing"] .radio-player__live-dot {
	background: var(--ml-accent);
	animation: radio-live-pulse 1.35s ease-in-out infinite;
	animation-delay: var(--radio-live-phase-delay, 0s);
}

.radio-player__title {
	margin: 0;
	padding-block: 0.03em 0.09em;
	font-size: clamp(1.22rem, 2vw, 1.9rem);
	font-weight: 800;
	line-height: 1.16;
	letter-spacing: -0.03em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.radio-player__status {
	margin: 0.28rem 0 0;
	color: var(--ml-muted);
	font-size: 0.7rem;
	line-height: 1.35;
}


/* Körbeforgatható hangerő-potméter. */
.radio-player__volume-control {
	display: grid;
	grid-template-rows: auto auto auto;
	justify-items: center;
	align-content: center;
	gap: 0.28rem;
	min-width: 5.75rem;
}

.radio-player__volume-label {
	color: var(--ml-muted);
	font-size: 0.58rem;
	font-weight: 800;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.radio-player__volume-knob {
	--radio-volume-angle: 81deg;
	--radio-volume-progress: 216deg;

	position: relative;
	isolation: isolate;
	box-sizing: border-box;
	width: 4.7rem;
	height: 4.7rem;
	border: 1px solid var(--color-white-16);
	border-radius: 50%;
	background:
		radial-gradient(circle at 38% 30%, color-mix(in srgb, var(--ml-text) 12%, transparent), transparent 28%),
		linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep) 72%);
	box-shadow:
		0 0.6rem 1.45rem color-mix(in srgb, var(--bs-black) 30%, transparent),
		inset 0 1px color-mix(in srgb, var(--ml-text) 10%, transparent),
		inset 0 -0.3rem 0.7rem var(--color-black-28);
	cursor: grab;
	touch-action: none;
	user-select: none;
	transition:
		transform 100ms ease,
		box-shadow 100ms ease,
		border-color 100ms ease;
}

.radio-player__volume-knob:hover {
	border-color: color-mix(in srgb, var(--ml-text) 26%, transparent);
	transform: translateY(-1px);
	box-shadow:
		0 0.9rem 1.9rem color-mix(in srgb, var(--bs-black) 40%, transparent),
		0 0 0 0.3rem color-mix(in srgb, var(--ml-accent) 8%, transparent),
		inset 0 1px color-mix(in srgb, var(--ml-text) 14%, transparent),
		inset 0 -0.35rem 0.8rem var(--color-black-28);
}

.radio-player__volume-knob.is-dragging {
	cursor: grabbing;
	transform: scale(1.025);
}

.radio-player__volume-scale {
	position: absolute;
	inset: -0.34rem;
	z-index: -1;
	border-radius: 50%;
	background:
		repeating-conic-gradient(
			from 225deg,
			color-mix(in srgb, var(--ml-text) 24%, transparent) 0deg 1.5deg,
			transparent 1.5deg 13.5deg
		);
	-webkit-mask: conic-gradient(
		from 225deg,
		var(--bs-black) 0deg 270deg,
		transparent 270deg 360deg
	);
	mask: conic-gradient(
		from 225deg,
		var(--bs-black) 0deg 270deg,
		transparent 270deg 360deg
	);
	opacity: 0.52;
	pointer-events: none;
}

.radio-player__volume-knob::before {
	content: "";
	position: absolute;
	inset: -0.18rem;
	z-index: -1;
	border-radius: 50%;
	background: conic-gradient(
		from 225deg,
		var(--ml-accent) 0deg var(--radio-volume-progress),
		var(--color-white-10) var(--radio-volume-progress) 270deg,
		transparent 270deg 360deg
	);
	-webkit-mask: radial-gradient(circle, transparent 64%, var(--bs-black) 65% 74%, transparent 75%);
	mask: radial-gradient(circle, transparent 64%, var(--bs-black) 65% 74%, transparent 75%);
	filter: drop-shadow(0 0 0.35rem color-mix(in srgb, var(--ml-accent) 25%, transparent));
	pointer-events: none;
}

.radio-player__volume-indicator {
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: 50%;
	transform: rotate(var(--radio-volume-angle));
	pointer-events: none;
}

.radio-player__volume-indicator::before {
	content: "";
	position: absolute;
	top: 0.42rem;
	left: 50%;
	width: 0.18rem;
	height: 0.82rem;
	border-radius: 999px;
	background: linear-gradient(to bottom, var(--bs-white), var(--ml-accent));
	box-shadow: 0 0 0.5rem color-mix(in srgb, var(--ml-accent) 60%, transparent);
	transform: translateX(-50%);
}

.radio-player__volume-center {
	position: absolute;
	inset: 50% auto auto 50%;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 2.55rem;
	height: 2.55rem;
	border: 1px solid color-mix(in srgb, var(--ml-text) 8%, transparent);
	border-radius: 50%;
	background: linear-gradient(145deg, var(--ml-surface), var(--ml-cool-deep));
	box-shadow:
		inset 0 1px color-mix(in srgb, var(--ml-text) 8%, transparent),
		0 0.35rem 0.8rem var(--color-black-28);
	color: var(--ml-muted);
	font-size: 0.84rem;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.radio-player__volume-output {
	color: var(--ml-text);
	font-size: 0.7rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

.radio-player [hidden] {
	display: none !important;
}


@keyframes radio-live-pulse {
	0%, 100% {
		transform: scale(0.82);
		opacity: 0.55;
	}
	50% {
		transform: scale(1);
		opacity: 1;
	}
}

@keyframes radio-eq {
	0% { transform: scaleY(0.16); }
	46% { transform: scaleY(0.95); }
	100% { transform: scaleY(0.34); }
}


@media (max-width: 991.98px) {
	.radio-player__layout,
	.radio-player.is-docked .radio-player__layout {
		grid-template-columns: auto minmax(0, 1fr) auto;
	}

	.radio-player__volume-knob {
		width: 4.4rem;
		height: 4.4rem;
	}
}




/* A felső navigációban a tényleges rendelkezésre álló szélességhez igazodik. */
@container radio-host (max-width: 54rem) {
	.radio-player:not(.is-docked) {
		min-height: 7.9rem;
		padding: 0.8rem 2.9rem 0.8rem 0.8rem;
	}

	.radio-player:not(.is-docked) .radio-player__layout {
		grid-template-columns:
			minmax(5.25rem, 5.8rem)
			minmax(0, 1fr)
			minmax(4.35rem, 4.8rem);
		gap: 0.55rem;
		min-height: 6.15rem;
	}

	.radio-player:not(.is-docked) .radio-player__control-column {
		min-width: 5.25rem;
		gap: 0.3rem;
	}

	.radio-player:not(.is-docked) .radio-player__play-stage {
		width: 5.25rem;
		height: 4.35rem;
	}

	.radio-player:not(.is-docked) .radio-player__play-button {
		width: 3.5rem;
		height: 3.5rem;
	}

	.radio-player:not(.is-docked) .radio-player__apps {
		grid-template-columns: repeat(2, 1.42rem);
		gap: 0.14rem;
	}

	.radio-player:not(.is-docked) .radio-player__app-button {
		width: 1.42rem;
		height: 1.42rem;
		font-size: 0.6rem;
	}

	.radio-player:not(.is-docked) .radio-player__app-text {
		font-size: 0.48rem;
	}

	.radio-player:not(.is-docked) .radio-player__title {
		font-size: clamp(1rem, 3.2cqi, 1.34rem);
		line-height: 1.18;
	}

	.radio-player:not(.is-docked) .radio-player__public-label {
		font-size: 0.64rem;
	}

	.radio-player:not(.is-docked) .radio-player__public-mainline {
		font-size: clamp(0.88rem, 2.6cqi, 1rem);
		line-height: 1.26;
	}

	.radio-player:not(.is-docked) .radio-player__volume-control {
		min-width: 4.35rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-label {
		font-size: 0.52rem;
		letter-spacing: 0.1em;
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob {
		width: 3.85rem;
		height: 3.85rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-center {
		width: 2rem;
		height: 2rem;
		font-size: 0.7rem;
	}
}

@container radio-host (max-width: 42rem) {
	.radio-player:not(.is-docked) {
		padding-right: 2.65rem;
	}

	.radio-player:not(.is-docked) .radio-player__layout {
		grid-template-columns:
			minmax(4.45rem, 4.9rem)
			minmax(0, 1fr)
			4rem;
		gap: 0.42rem;
	}

	.radio-player:not(.is-docked) .radio-player__control-column {
		min-width: 4.45rem;
	}

	.radio-player:not(.is-docked) .radio-player__play-stage {
		width: 4.45rem;
	}

	.radio-player:not(.is-docked) .radio-player__play-button {
		width: 3.25rem;
		height: 3.25rem;
	}

	.radio-player:not(.is-docked) .radio-player__apps {
		grid-template-columns: repeat(2, 1.45rem);
	}

	.radio-player:not(.is-docked) .radio-player__volume-control {
		min-width: 4rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob {
		width: 3.55rem;
		height: 3.55rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-center {
		width: 1.85rem;
		height: 1.85rem;
		font-size: 0.66rem;
	}

	.radio-player:not(.is-docked) .radio-player__public-presenter {
		grid-template-columns: 2.4rem minmax(0, 1fr);
		gap: 0.45rem;
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar {
		width: 2.4rem;
		height: 2.4rem;
		min-width: 2.4rem;
		min-height: 2.4rem;
	}
}


/* Mobil alsó lejátszó: a hangerőgomb teljes képernyős vezérlőt nyit. */
.radio-player__mobile-actions,
.mobile-broadcast-modal {
	display: none;
}

@media (max-width: 767.98px) {
	.radio-player,
	.radio-player.is-docked {
		position: fixed;
		left: 8px;
		right: 8px;
		bottom: calc(64px + 8px + env(safe-area-inset-bottom));
		z-index: 1080;
		width: auto;
		min-height: 70px;
		padding: 7px 8px;
		border-radius: 17px;
		transform: none;
		contain: layout paint;
		background: linear-gradient(135deg, var(--ml-cool-deep) 0%, var(--ml-surface) 52%, var(--ml-surface-raised) 100%);
		box-shadow: 0 10px 32px color-mix(in srgb, var(--bs-black) 38%, transparent);
		opacity: 1;
		transition: transform .18s ease, opacity .18s ease;
	}

	body.mobile-radio-collapsed .radio-player,
	body.mobile-radio-collapsed .radio-player.is-docked {
		transform: translateY(calc(100% + 92px));
		opacity: 0;
		pointer-events: none;
	}

	body.radio-player-is-docked {
		padding-bottom: calc(64px + 70px + 18px + env(safe-area-inset-bottom));
	}

	body.radio-player-is-docked.mobile-radio-collapsed {
		padding-bottom: calc(64px + 12px + env(safe-area-inset-bottom));
	}

	body.mobile-broadcast-modal-open {
		overflow: hidden;
		touch-action: none;
	}

	.radio-player__dock-toggle,
	.radio-player__apps,
	.radio-player__equalizer,
	.radio-player__play-stage::before,
	.radio-player__eyebrow,
	.radio-player__status,
	.radio-player__volume-control {
		display: none;
	}

	.radio-player__layout,
	.radio-player.is-docked .radio-player__layout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 48px 42px;
		grid-template-rows: 56px;
		align-items: center;
		gap: 7px;
		min-height: 56px;
	}

	.radio-player__identity,
	.radio-player.is-docked .radio-player__identity {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
	}

	.radio-player__title,
	.radio-player.is-docked .radio-player__title {
		display: none;
	}


	.radio-player__control-column,
	.radio-player.is-docked .radio-player__control-column {
		grid-column: 2;
		grid-row: 1;
		display: grid;
		min-width: 48px;
		place-items: center;
	}

	.radio-player__play-stage,
	.radio-player.is-docked .radio-player__play-stage {
		width: 48px;
		height: 48px;
	}

	.radio-player__play-button,
	.radio-player.is-docked .radio-player__play-button {
		width: 42px;
		height: 42px;
		border-radius: 14px;
		font-size: .82rem;
		box-shadow:
			0 5px 13px color-mix(in srgb, var(--ml-accent) 22%, transparent),
			inset 0 2px 4px var(--color-black-18),
			inset 0 1px var(--color-white-18);
	}

	.radio-player__mobile-actions {
		grid-column: 3;
		grid-row: 1;
		display: grid;
		place-items: center;
	}

	.radio-player__mobile-action {
		display: grid;
		width: 40px;
		height: 40px;
		place-items: center;
		padding: 0;
		border: 1px solid color-mix(in srgb, var(--ml-text) 14%, transparent);
		border-radius: 12px;
		background: linear-gradient(145deg, color-mix(in srgb, var(--ml-text) 8.5%, transparent), color-mix(in srgb, var(--ml-text) 3.5%, transparent));
		box-shadow:
			inset 0 1px color-mix(in srgb, var(--ml-text) 8%, transparent),
			0 4px 12px var(--color-black-18);
		color: var(--ml-text);
		cursor: pointer;
	}

	.radio-player__mobile-action:active {
		transform: translateY(1px) scale(.98);
	}

	.radio-player__mobile-action:focus-visible {
		outline: 2px solid var(--ml-accent);
		outline-offset: 2px;
	}

	.radio-player__mobile-action .material-symbols-rounded {
		font-size: 21px;
	}

	.mobile-broadcast-modal {
		position: fixed;
		inset: 0;
		z-index: 1120;
		display: block;
		width: 100%;
		height: 100vh;
		height: 100dvh;
		overflow: hidden;
		background:
			radial-gradient(
				circle at 50% 31%,
				color-mix(in srgb, var(--ml-accent) 18%, transparent),
				transparent 38%
			),
			linear-gradient(
				155deg,
				var(--ml-cool-deep),
				var(--ml-surface) 52%,
				var(--ml-surface-raised)
			);
		color: var(--ml-text);
		overscroll-behavior: contain;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition:
			opacity 240ms ease,
			visibility 0s linear 320ms;
	}

	.mobile-broadcast-modal::before,
	.mobile-broadcast-modal::after {
		content: "";
		position: absolute;
		pointer-events: none;
	}

	.mobile-broadcast-modal::before {
		inset: -18% -35% auto;
		height: 56%;
		background: radial-gradient(
			ellipse at center,
			color-mix(in srgb, var(--ml-accent) 12%, transparent),
			transparent 66%
		);
		opacity: 0;
		transform: translateY(-8%) scale(.9);
		transition: opacity 320ms ease, transform 520ms cubic-bezier(.16, 1, .3, 1);
	}

	.mobile-broadcast-modal::after {
		left: 12%;
		right: 12%;
		bottom: max(12px, env(safe-area-inset-bottom));
		height: 1px;
		background: linear-gradient(
			90deg,
			transparent,
			color-mix(in srgb, var(--ml-accent) 62%, transparent),
			transparent
		);
		opacity: 0;
		transform: scaleX(.35);
		transition: opacity 300ms ease 80ms, transform 520ms cubic-bezier(.16, 1, .3, 1) 60ms;
	}

	.mobile-broadcast-modal.is-open {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transition-delay: 0s;
	}

	.mobile-broadcast-modal.is-open::before {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

	.mobile-broadcast-modal.is-open::after {
		opacity: .72;
		transform: scaleX(1);
	}

	.mobile-broadcast-modal.is-closing {
		visibility: visible;
		pointer-events: none;
	}

	.mobile-broadcast-modal[hidden] {
		display: none !important;
	}

	.mobile-broadcast-modal__sheet {
		position: absolute;
		inset: 0;
		display: grid;
		box-sizing: border-box;
		width: 100%;
		height: 100%;
		min-height: 100%;
		padding:
			calc(18px + env(safe-area-inset-top))
			calc(18px + env(safe-area-inset-right))
			calc(22px + env(safe-area-inset-bottom))
			calc(18px + env(safe-area-inset-left));
		overflow-y: auto;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		color: inherit;
	}

	.mobile-broadcast-modal__close {
		position: fixed;
		top: calc(12px + env(safe-area-inset-top));
		right: calc(12px + env(safe-area-inset-right));
		z-index: 3;
		display: grid;
		width: 46px;
		height: 46px;
		place-items: center;
		padding: 0;
		border: 1px solid color-mix(in srgb, var(--ml-accent) 46%, var(--ml-border-soft));
		border-radius: 50%;
		background: var(--ml-surface);
		box-shadow:
			0 10px 30px color-mix(in srgb, var(--bs-black) 38%, transparent),
			inset 0 1px color-mix(in srgb, var(--ml-text) 12%, transparent);
		color: var(--ml-accent);
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
		opacity: 0;
		transform: translateY(-10px) rotate(-14deg) scale(.88);
		transition:
			opacity 180ms ease,
			transform 420ms cubic-bezier(.16, 1, .3, 1),
			border-color 180ms ease,
			background-color 180ms ease;
	}

	.mobile-broadcast-modal.is-open .mobile-broadcast-modal__close {
		opacity: 1;
		transform: translateY(0) rotate(0) scale(1);
	}

	.mobile-broadcast-modal.is-open .mobile-broadcast-modal__close:active {
		transform: scale(.93);
	}

	.mobile-broadcast-modal__close:focus-visible {
		outline: 3px solid var(--ml-accent);
		outline-offset: 3px;
	}

	.mobile-broadcast-modal__close .material-symbols-rounded {
		font-size: 27px;
	}

	.mobile-broadcast-modal__content {
		display: grid;
		align-content: center;
		justify-items: center;
		box-sizing: border-box;
		width: min(100%, 31rem);
		min-height: 100%;
		margin: 0 auto;
		padding: 70px 12px 38px;
		text-align: center;
		opacity: 0;
		transform: translateY(26px) scale(.965);
		filter: blur(7px);
		transition:
			opacity 210ms ease 20ms,
			transform 520ms cubic-bezier(.16, 1, .3, 1),
			filter 300ms ease;
	}

	.mobile-broadcast-modal.is-open .mobile-broadcast-modal__content {
		opacity: 1;
		transform: translateY(0) scale(1);
		filter: blur(0);
	}

	.mobile-broadcast-modal__avatar {
		position: relative;
		display: grid;
		width: clamp(8rem, 38vw, 10.5rem);
		aspect-ratio: 1;
		place-items: center;
		overflow: hidden;
		border: 2px solid color-mix(in srgb, var(--ml-accent) 72%, var(--ml-border-soft));
		border-radius: 50%;
		background:
			radial-gradient(
				circle at 34% 28%,
				color-mix(in srgb, var(--ml-text) 14%, transparent),
				transparent 34%
			),
			var(--ml-surface);
		box-shadow:
			0 1.25rem 3rem color-mix(in srgb, var(--bs-black) 38%, transparent),
			0 0 0 .42rem color-mix(in srgb, var(--ml-accent) 10%, transparent),
			0 0 2.4rem color-mix(in srgb, var(--ml-accent) 18%, transparent);
		color: var(--ml-accent);
		transform: scale(.82) rotate(-3deg);
		transition:
			transform 620ms cubic-bezier(.16, 1.12, .28, 1) 40ms,
			box-shadow 420ms ease 60ms;
	}

	.mobile-broadcast-modal.is-open .mobile-broadcast-modal__avatar {
		transform: scale(1) rotate(0);
	}

	.mobile-broadcast-modal__avatar img {
		position: absolute;
		inset: 0;
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		border-radius: inherit;
	}

	.mobile-broadcast-modal__avatar img[hidden] {
		display: none !important;
	}

	.mobile-broadcast-modal__avatar-fallback {
		font-size: clamp(3rem, 14vw, 4.6rem);
		line-height: 1;
		opacity: .82;
	}

	.mobile-broadcast-modal__avatar.has-image .mobile-broadcast-modal__avatar-fallback {
		display: none;
	}

	.mobile-broadcast-modal__presenter-name {
		max-width: 100%;
		margin: 20px 0 0;
		color: var(--ml-text);
		font-size: clamp(1.45rem, 7vw, 2.05rem);
		font-weight: 850;
		line-height: 1.08;
		letter-spacing: -.035em;
		overflow-wrap: anywhere;
		opacity: 0;
		transform: translateY(10px);
		transition: opacity 240ms ease 120ms, transform 420ms cubic-bezier(.16, 1, .3, 1) 100ms;
	}

	.mobile-broadcast-modal.is-open .mobile-broadcast-modal__presenter-name {
		opacity: 1;
		transform: translateY(0);
	}

	.mobile-broadcast-modal__volume {
		display: grid;
		width: min(100%, 24rem);
		margin-top: clamp(38px, 8vh, 64px);
		opacity: 0;
		transform: translateY(16px) scale(.97);
		transition: opacity 240ms ease 160ms, transform 460ms cubic-bezier(.16, 1, .3, 1) 130ms;
	}

	.mobile-broadcast-modal.is-open .mobile-broadcast-modal__volume {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

	.mobile-broadcast-modal__volume-output {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.mobile-broadcast-modal__volume-row {
		display: grid;
		grid-template-columns: 28px minmax(0, 1fr) 28px;
		align-items: center;
		gap: 12px;
		width: 100%;
		color: color-mix(in srgb, var(--ml-text) 68%, var(--ml-muted));
	}

	.mobile-broadcast-modal__volume-row .material-symbols-rounded {
		font-size: 22px;
		color: var(--ml-accent);
	}

	.mobile-broadcast-modal__volume-row input[type="range"] {
		-webkit-appearance: none;
		appearance: none;
		width: 100%;
		height: 48px;
		margin: 0;
		padding: 0;
		background: transparent;
		accent-color: var(--ml-accent);
		touch-action: pan-x;
	}

	.mobile-broadcast-modal__volume-row input[type="range"]::-webkit-slider-runnable-track {
		height: 8px;
		border: 1px solid color-mix(in srgb, var(--ml-accent) 20%, var(--ml-border-soft));
		border-radius: 999px;
		background: color-mix(in srgb, var(--ml-surface) 86%, var(--ml-accent) 14%);
		box-shadow: inset 0 1px 3px color-mix(in srgb, var(--bs-black) 38%, transparent);
	}

	.mobile-broadcast-modal__volume-row input[type="range"]::-webkit-slider-thumb {
		-webkit-appearance: none;
		width: 28px;
		height: 28px;
		margin-top: -11px;
		border: 3px solid var(--ml-cool-deep);
		border-radius: 50%;
		background: var(--ml-accent);
		box-shadow:
			0 0 0 5px color-mix(in srgb, var(--ml-accent) 16%, transparent),
			0 6px 18px color-mix(in srgb, var(--bs-black) 38%, transparent);
	}

	.mobile-broadcast-modal__volume-row input[type="range"]::-moz-range-track {
		height: 8px;
		border: 1px solid color-mix(in srgb, var(--ml-accent) 20%, var(--ml-border-soft));
		border-radius: 999px;
		background: color-mix(in srgb, var(--ml-surface) 86%, var(--ml-accent) 14%);
		box-shadow: inset 0 1px 3px color-mix(in srgb, var(--bs-black) 38%, transparent);
	}

	.mobile-broadcast-modal__volume-row input[type="range"]::-moz-range-thumb {
		width: 28px;
		height: 28px;
		border: 3px solid var(--ml-cool-deep);
		border-radius: 50%;
		background: var(--ml-accent);
		box-shadow:
			0 0 0 5px color-mix(in srgb, var(--ml-accent) 16%, transparent),
			0 6px 18px color-mix(in srgb, var(--bs-black) 38%, transparent);
	}


}

@media (max-width: 370px) {
	.radio-player__layout,
	.radio-player.is-docked .radio-player__layout {
		grid-template-columns: minmax(0, 1fr) 45px 38px;
		gap: 4px;
	}

	.radio-player__mobile-action {
		width: 36px;
		height: 36px;
	}



	.mobile-broadcast-modal__content {
		padding-inline: 4px;
	}

	.mobile-broadcast-modal__volume-row {
		gap: 8px;
	}
}


/* --------------------------------------------------------------------------
 * Dokkolt tablet/desktop lejátszó
 * -------------------------------------------------------------------------- */
.radio-player__dock-console {
	display: contents;
}

.radio-player__dock-volume-button,
.radio-player__dock-volume-knob,
.radio-player__dock-seek-button,
.radio-player__dock-equalizer,
.radio-player__presenter-avatar,
.radio-player__live-badge {
	display: none;
}

@media (min-width: 768px) {
	:root {
		--radio-docked-height: 4.25rem;
		--radio-dock-console-width: 16.8rem;
		--radio-dock-main-button: 4.05rem;
		--radio-dock-main-button-half: 2.025rem;
		--radio-dock-side-button-width: 2.95rem;
		--radio-dock-side-button-height: 2.95rem;
	}

	.radio-player.is-docked {
		position: fixed;
		left: var(--radio-dock-left, 50%);
		right: auto;
		bottom: max(0.65rem, env(safe-area-inset-bottom));
		z-index: 1080;
		width: var(--radio-dock-width, min(calc(100vw - 24px), 82.5rem));
		max-width: none;
		min-height: var(--radio-docked-height);
		height: auto;
		margin: 0;
		padding: 0.52rem 3.35rem 0.52rem 0.7rem;
		overflow: visible;
		border: 1px solid var(--ml-border);
		border-radius: var(--bs-border-radius-lg);
		background: linear-gradient(110deg, var(--ml-cool-deep) 0%, var(--ml-surface) 50%, var(--ml-surface-raised) 100%);
		box-shadow:
			var(--shadow-lg),
			inset 0 1px color-mix(in srgb, var(--ml-text) 5%, transparent);
		transform: var(--radio-dock-transform, translateX(-50%));
		contain: layout;
	}

	.radio-player.is-docked::after {
		inset: 0 0 auto;
		z-index: 7;
		height: 1px;
		background: linear-gradient(90deg, transparent, var(--ml-accent), transparent);
		opacity: 0.82;
		pointer-events: none;
	}

	body.radio-player-is-docked {
		padding-bottom: calc(var(--radio-docked-height) + 1.65rem + env(safe-area-inset-bottom));
	}

	.radio-player.is-docked .radio-player__layout {
		position: relative;
		display: block;
		width: 100%;
		height: var(--radio-docked-height);
		min-height: var(--radio-docked-height);
		margin: 0;
		padding: 0;
		overflow: visible;
	}

	.radio-player.is-docked .radio-player__control-column,
	.radio-player.is-docked .radio-player__play-stage {
		position: static;
		display: block;
		width: 0;
		height: 0;
		min-width: 0;
		margin: 0;
		padding: 0;
		overflow: visible;
	}

	.radio-player.is-docked .radio-player__apps,
	.radio-player.is-docked .radio-player__eyebrow,
	.radio-player.is-docked .radio-player__status,
	.radio-player.is-docked .radio-player__volume-control,
	.radio-player.is-docked .radio-player__title,
	.radio-player.is-docked .radio-player__presenter-avatar,
	.radio-player.is-docked .radio-player__equalizer {
		display: none;
	}

	.radio-player.is-docked .radio-player__identity {
		position: absolute;
		left: 0;
		top: 50%;
		z-index: 2;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-items: center;
		align-content: center;
		width: calc(50% - 9rem);
		min-width: 0;
		height: auto;
		padding: 0 0.65rem 0 0.25rem;
		transform: translateY(-50%);
	}

	.radio-player.is-docked .radio-player__identity-copy {
		display: block;
		width: 100%;
		min-width: 0;
	}

	.radio-player.is-docked .radio-player__dock-console {
		--radio-dock-volume-value: 50;
		position: absolute;
		left: 50%;
		top: 50%;
		z-index: 5;
		display: block;
		box-sizing: border-box;
		width: var(--radio-dock-console-width);
		height: var(--radio-dock-main-button);
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		transform: translate(-50%, -50%);
		overflow: visible;
	}

	.radio-player.is-docked .radio-player__dock-console::before,
	.radio-player.is-docked .radio-player__dock-console::after {
		content: none;
	}

	.radio-player.is-docked .radio-player__play-button {
		position: absolute;
		left: calc(50% - var(--radio-dock-main-button-half));
		top: calc(50% - var(--radio-dock-main-button-half));
		z-index: 6;
		width: var(--radio-dock-main-button);
		height: var(--radio-dock-main-button);
		margin: 0;
		border: 2px solid var(--ml-accent);
		border-radius: 50%;
		background: linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep));
		box-shadow: none;
		color: var(--ml-accent-hover);
		font-size: 1.16rem;
		transform: none;
		scale: 1;
		filter: none;
		transition: opacity 120ms ease, scale 130ms cubic-bezier(0.22, 1, 0.36, 1), border-color 130ms ease, background-color 130ms ease;
	}

	.radio-player.is-docked .radio-player__play-button .material-symbols-rounded {
		color: var(--ml-accent-hover);
	}

	.radio-player.is-docked.is-volume-mode .radio-player__play-button {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		scale: 0.78;
	}

	.radio-player.is-docked .radio-player__dock-volume-button {
		appearance: none;
		position: absolute;
		top: 50%;
		z-index: 6;
		display: grid;
		place-items: center;
		box-sizing: border-box;
		width: var(--radio-dock-side-button-width);
		height: var(--radio-dock-side-button-height);
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--ml-accent-hover);
		font: inherit;
		font-size: 1.5rem;
		cursor: pointer;
		transform: translateY(-50%) scale(1);
		transform-origin: center;
		transition: transform 110ms cubic-bezier(0.22, 1, 0.36, 1), filter 110ms ease;
	}

	.radio-player.is-docked .radio-player__dock-volume-button--down { left: 3.25rem; }
	.radio-player.is-docked .radio-player__dock-volume-button--up { right: 3.25rem; }

	.radio-player.is-docked .radio-player__dock-volume-button::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		border: 1px solid var(--ml-accent);
		background: linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep));
		box-shadow: inset 0 1px color-mix(in srgb, var(--ml-text) 4%, transparent);
	}

	.radio-player.is-docked .radio-player__dock-volume-button--down::before {
		clip-path: polygon(100% 6%, 100% 94%, 30% 84%, 10% 50%, 30% 16%);
		border-radius: 0.65rem;
	}

	.radio-player.is-docked .radio-player__dock-volume-button--up::before {
		clip-path: polygon(0 6%, 0 94%, 70% 84%, 90% 50%, 70% 16%);
		border-radius: 0.65rem;
	}

	.radio-player.is-docked .radio-player__dock-volume-button i {
		position: relative;
		z-index: 2;
	}

	.radio-player.is-docked .radio-player__dock-volume-button:active {
		transform: translateY(-50%) scale(0.9);
	}

	.radio-player.is-docked .radio-player__dock-volume-button.is-holding {
		transform: translateY(-50%) scale(1.07);
		filter: brightness(1.12);
	}

	.radio-player.is-docked .radio-player__dock-volume-button.is-holding::before {
		border-color: var(--ml-accent-hover);
		box-shadow: 0 0 0.7rem color-mix(in srgb, var(--ml-accent) 28%, transparent), inset 0 1px color-mix(in srgb, var(--ml-text) 6%, transparent);
	}

	.radio-player.is-docked .radio-player__dock-volume-button:focus-visible,
	.radio-player.is-docked .radio-player__dock-volume-knob:focus-visible,
	.radio-player.is-docked .radio-player__dock-seek-button:focus-visible {
		outline: 2px solid var(--ml-accent-hover);
		outline-offset: 3px;
	}

	.radio-player.is-docked .radio-player__dock-volume-knob {
		position: absolute;
		left: 50%;
		top: 50%;
		z-index: 8;
		place-items: center;
		box-sizing: border-box;
		width: var(--radio-dock-main-button);
		height: var(--radio-dock-main-button);
		margin: 0;
		padding: 0;
		border: 1px solid var(--ml-accent);
		border-radius: 50%;
		background: radial-gradient(circle at 36% 28%, var(--ml-surface-raised) 0%, var(--ml-surface) 32%, var(--ml-cool-deep) 74%);
		color: var(--ml-accent-hover);
		cursor: grab;
		user-select: none;
		touch-action: none;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translate(-50%, -50%) scale(0.82);
		transition: opacity 100ms ease, transform 120ms cubic-bezier(0.22, 1, 0.36, 1), border-color 100ms ease;
	}

	.radio-player.is-docked .radio-player__dock-volume-knob::before {
		content: "";
		position: absolute;
		inset: -4px;
		z-index: 0;
		border-radius: 50%;
		background: conic-gradient(from 225deg, var(--ml-accent-hover) 0deg calc(var(--radio-dock-volume-value) * 2.7deg), color-mix(in srgb, var(--ml-text) 12%, transparent) calc(var(--radio-dock-volume-value) * 2.7deg) 270deg, transparent 270deg 360deg);
		-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), var(--bs-black) calc(100% - 2px));
		mask: radial-gradient(farthest-side, transparent calc(100% - 3px), var(--bs-black) calc(100% - 2px));
		pointer-events: none;
	}

	.radio-player.is-docked .radio-player__dock-volume-knob-indicator {
		position: absolute;
		inset: 0;
		z-index: 1;
		border-radius: 50%;
		transform: rotate(calc(-135deg + (var(--radio-dock-volume-value) * 2.7deg)));
		pointer-events: none;
	}

	.radio-player.is-docked .radio-player__dock-volume-knob-indicator::before {
		content: "";
		position: absolute;
		top: 0.34rem;
		left: 50%;
		width: 0.16rem;
		height: 0.58rem;
		border-radius: 999px;
		background: var(--ml-accent-hover);
		transform: translateX(-50%);
	}

	.radio-player.is-docked .radio-player__dock-volume-knob-value {
		position: relative;
		z-index: 2;
		font-size: 0.86rem;
		font-weight: 850;
		line-height: 1;
		letter-spacing: -0.035em;
		font-variant-numeric: tabular-nums;
		pointer-events: none;
	}

	.radio-player.is-docked.is-volume-mode .radio-player__dock-volume-knob {
		display: grid;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translate(-50%, -50%) scale(1);
	}

	.radio-player.is-docked.is-volume-mode .radio-player__dock-volume-knob.is-dragging {
		cursor: grabbing;
		transform: translate(-50%, -50%) scale(1.035);
	}

	.radio-player.is-docked .radio-player__dock-seek-button {
		appearance: none;
		position: absolute;
		top: 50%;
		z-index: 6;
		display: inline-grid;
		place-items: center;
		box-sizing: border-box;
		width: 2.15rem;
		height: 2.15rem;
		margin: 0;
		padding: 0;
		border: 1px solid color-mix(in srgb, var(--ml-text) 17%, transparent);
		border-radius: 50%;
		background: linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep));
		box-shadow: inset 0 1px color-mix(in srgb, var(--ml-text) 4%, transparent);
		color: color-mix(in srgb, var(--ml-text) 88%, transparent);
		cursor: pointer;
		transform: translateY(-50%) scale(1);
		transition: transform 120ms cubic-bezier(0.22, 1, 0.36, 1), border-color 120ms ease, color 120ms ease, opacity 120ms ease;
	}

	.radio-player.is-docked .radio-player__dock-seek-button--back { left: 0.34rem; }
	.radio-player.is-docked .radio-player__dock-seek-button--forward { right: 0.34rem; }

	.radio-player.is-docked .radio-player__dock-seek-button .material-symbols-rounded {
		font-size: 1.26rem;
		font-variation-settings: "FILL" 0, "wght" 560, "GRAD" 0, "opsz" 24;
		line-height: 1;
	}

	.radio-player.is-docked .radio-player__dock-seek-button:not(:disabled):active,
	.radio-player.is-docked .radio-player__dock-seek-button.is-seek-flash {
		transform: translateY(-50%) scale(0.9);
	}

	.radio-player.is-docked .radio-player__dock-seek-button:disabled {
		opacity: 0.24;
		cursor: not-allowed;
		filter: grayscale(0.65) saturate(0.4);
	}

	.radio-player.is-docked .radio-player__dock-equalizer {
		position: absolute;
		left: 50%;
		bottom: 0.2rem;
		z-index: 4;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		gap: 0.105rem;
		box-sizing: border-box;
		width: calc(var(--radio-dock-console-width) + 1.5rem);
		height: 0.7rem;
		padding: 0 0.18rem;
		overflow: hidden;
		opacity: 0.75;
		transform: translateX(-50%);
		pointer-events: none;
	}

	.radio-player.is-docked .radio-player__dock-equalizer span {
		flex: 1 1 0;
		min-width: 0;
		max-width: 0.16rem;
		height: 100%;
		border-radius: 999px 999px 0 0;
		background: linear-gradient(to top, color-mix(in srgb, var(--ml-accent) 48%, transparent), color-mix(in srgb, var(--ml-text) 62%, transparent));
		opacity: 0.42;
		transform: scaleY(0.2);
		transform-origin: bottom center;
		animation: radio-eq 760ms ease-in-out infinite alternate paused;
	}

	.radio-player.is-docked .radio-player__dock-equalizer span:nth-child(3n + 1) { animation-duration: 520ms; animation-delay: -170ms; }
	.radio-player.is-docked .radio-player__dock-equalizer span:nth-child(3n + 2) { animation-duration: 690ms; animation-delay: -390ms; }
	.radio-player.is-docked .radio-player__dock-equalizer span:nth-child(3n) { animation-duration: 840ms; animation-delay: -610ms; }
	.radio-player.is-docked[data-state="playing"] .radio-player__dock-equalizer span { opacity: 0.8; animation-play-state: running; }

	.radio-player.is-docked .radio-player__dock-toggle {
		top: 50%;
		right: 0.55rem;
		left: auto;
		width: 2.2rem;
		height: 2.2rem;
		margin: 0;
		border-color: color-mix(in srgb, var(--ml-text) 14%, transparent);
		border-radius: 50%;
		background: var(--ml-surface);
		transform: translateY(-50%);
	}

	@media (hover: hover) and (pointer: fine) {
		.radio-player.is-docked .radio-player__play-button:hover {
			border-color: var(--ml-accent-hover);
			background: linear-gradient(145deg, var(--ml-surface-hover), var(--ml-surface));
			scale: 1.035;
		}

		.radio-player.is-docked .radio-player__dock-volume-button:hover {
			transform: translateY(-50%) scale(1.045);
		}

		.radio-player.is-docked .radio-player__dock-volume-button:hover::before {
			border-color: var(--ml-accent-hover);
			background: linear-gradient(145deg, var(--ml-surface-hover), var(--ml-surface));
		}

		.radio-player.is-docked .radio-player__dock-seek-button:not(:disabled):hover {
			border-color: color-mix(in srgb, var(--ml-accent) 52%, transparent);
			color: var(--ml-accent-hover);
			transform: translateY(-50%) scale(1.05);
		}

		.radio-player.is-docked .radio-player__dock-toggle:hover {
			background: var(--ml-surface-hover);
			transform: translateY(-50%) scale(1.04);
		}
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	:root {
		--radio-docked-height: 4.05rem;
		--radio-dock-console-width: 14.9rem;
		--radio-dock-main-button: 3.65rem;
		--radio-dock-main-button-half: 1.825rem;
		--radio-dock-side-button-width: 2.55rem;
		--radio-dock-side-button-height: 2.6rem;
	}

	.radio-player.is-docked .radio-player__identity { width: calc(50% - 7.7rem); }
	.radio-player.is-docked .radio-player__dock-volume-button--down { left: 2.9rem; }
	.radio-player.is-docked .radio-player__dock-volume-button--up { right: 2.9rem; }
	.radio-player.is-docked .radio-player__dock-volume-knob-value { font-size: 0.76rem; }
	.radio-player.is-docked .radio-player__dock-volume-knob-indicator::before { top: 0.3rem; height: 0.5rem; }
	.radio-player.is-docked .radio-player__dock-seek-button { width: 1.92rem; height: 1.92rem; }
	.radio-player.is-docked .radio-player__dock-seek-button--back { left: 0.18rem; }
	.radio-player.is-docked .radio-player__dock-seek-button--forward { right: 0.18rem; }
	.radio-player.is-docked .radio-player__dock-seek-button .material-symbols-rounded { font-size: 1.08rem; }
	.radio-player.is-docked .radio-player__dock-equalizer { width: calc(var(--radio-dock-console-width) + 1rem); height: 0.62rem; gap: 0.085rem; }
}


/* --------------------------------------------------------------------------
 * Publikus műsoradatok
 * -------------------------------------------------------------------------- */
.radio-player .radio-player__info-rotator {
	display: none;
}

.radio-player__identity-copy {
	display: contents;
}

.radio-player__public-panel {
	position: relative;
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	min-height: 0;
	margin-top: 0.3rem;
	overflow: visible;
}


.radio-player__public-presenter {
	display: grid;
	grid-template-columns: 5.25rem minmax(0, 1fr);
	align-items: center;
	gap: 0.72rem;
	width: 100%;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}

.radio-player__public-presenter[href] { cursor: pointer; }
.radio-player__public-presenter[href]:hover .radio-player__public-mainline > span:first-child { text-decoration: underline; text-underline-offset: 0.14em; }
.radio-player__public-presenter[aria-disabled="true"] { cursor: default; }

.radio-player__public-presenter-copy {
	display: grid;
	align-content: center;
	gap: 0.2rem;
	min-width: 0;
	padding-block: 0.06rem 0.1rem;
	overflow: visible;
}

.radio-player__public-presenter-head {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	min-width: 0;
}

.radio-player__public-label {
	display: block;
	color: var(--ml-muted);
	font-size: 0.72rem;
	font-weight: 850;
	line-height: 1.2;
	letter-spacing: 0.105em;
	text-transform: uppercase;
}

.radio-player__public-mainline {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	min-width: 0;
	font-size: clamp(1rem, 1.35vw, 1.2rem);
	font-weight: 800;
	line-height: 1.24;
	letter-spacing: -0.018em;
	padding-block: 0.02em 0.12em;
	white-space: nowrap;
	overflow: visible;
	text-overflow: clip;
}

.radio-player__public-mainline > span { min-width: 0; }
.radio-player__public-mainline > span:first-child {
	flex: 0 0 auto;
	overflow: visible;
	text-overflow: clip;
}

/* Ha a név + hallgatószám együtt nem fér ki, a név élvez elsőbbséget. */
.radio-player__public-mainline.is-presenter-priority {
	align-items: center;
	white-space: normal;
}

.radio-player__public-mainline.is-presenter-priority > :not(:first-child) {
	display: none;
}

.radio-player__public-mainline.is-presenter-priority > :first-child {
	max-width: 100%;
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
	overflow-wrap: anywhere;
}
.radio-player__public-separator { flex: 0 0 auto; color: var(--ml-muted); font-weight: 900; }

.radio-player__public-live-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-height: 1.45rem;
	padding: 0.16rem 0.5rem;
	border: 1px solid var(--ml-accent);
	border-radius: 999px;
	background: transparent;
	color: var(--ml-accent-hover);
	font-size: 0.66rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}


.radio-player__public-avatar {
	position: relative;
	display: grid;
	place-items: center;
	width: 5.25rem;
	height: 2.75rem;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--ml-text) 10%, transparent);
	border-radius: 0.58rem;
	background: var(--ml-surface);
	box-shadow: inset 0 1px color-mix(in srgb, var(--ml-text) 4%, transparent);
	color: var(--ml-muted);
}

.radio-player__public-avatar img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	border-radius: inherit;
}

.radio-player__public-avatar-fallback { display: inline-block; font-size: 1.55rem; line-height: 1; opacity: 0.68; }
.radio-player__public-avatar.has-image .radio-player__public-avatar-fallback { display: none; }

@media (min-width: 768px) {
	.radio-player:not(.is-docked) .radio-player__public-presenter {
		grid-template-columns: 2.75rem minmax(0, 1fr);
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar {
		width: 2.75rem;
		height: 2.75rem;
		min-width: 2.75rem;
		min-height: 2.75rem;
		aspect-ratio: 1 / 1;
	}

	.radio-player.is-docked .radio-player__public-panel { margin: 0; }
	.radio-player.is-docked .radio-player__public-presenter { grid-template-columns: 2.75rem minmax(0, 1fr); gap: 0.58rem; }
	.radio-player.is-docked .radio-player__public-avatar { width: 2.75rem; height: 2.75rem; border-radius: 0.52rem; }
	.radio-player.is-docked .radio-player__public-label { font-size: 0.68rem; }
	.radio-player.is-docked .radio-player__public-mainline { font-size: clamp(1rem, 1.18vw, 1.16rem); }
	.radio-player.is-docked .radio-player__public-live-badge { min-height: 1.42rem; padding: 0.15rem 0.48rem; font-size: 0.64rem; }
}

@media (max-width: 767.98px) {
	.radio-player__public-panel { margin-top: 1px; }
	.radio-player__public-presenter { grid-template-columns: 2.6rem minmax(0, 1fr); gap: 0.46rem; }
	.radio-player__public-avatar { width: 2.6rem; height: 2.6rem; border-radius: 0.46rem; }
	.radio-player__public-label { font-size: 0.5rem; letter-spacing: 0.07em; }
	.radio-player__public-mainline { gap: 0.34rem; font-size: 0.78rem; line-height: 1.22; padding-block: 0.02em 0.1em; }
	.radio-player__public-live-badge { min-height: 1.08rem; padding: 0.1rem 0.34rem; font-size: 0.48rem; letter-spacing: 0.065em; }
	.radio-player__public-avatar-fallback { font-size: 1.45rem; }
}

@media (max-width: 370px) {
	.radio-player__public-presenter { grid-template-columns: 2.35rem minmax(0, 1fr); gap: 0.36rem; }
	.radio-player__public-avatar { width: 2.35rem; height: 2.35rem; }
	.radio-player__public-mainline { font-size: 0.7rem; }
}

/* Betöltési skeleton. */
.radio-player__public-skeleton {
	position: relative;
	display: grid;
	grid-template-columns: 5.25rem minmax(0, 1fr);
	align-items: center;
	gap: 0.62rem;
	width: 100%;
	min-width: 0;
}

.radio-player__public-skeleton-avatar,
.radio-player__public-skeleton-line {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--color-white-10);
}

.radio-player__public-skeleton-avatar::after,
.radio-player__public-skeleton-line::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, transparent 0%, color-mix(in srgb, var(--ml-text) 4%, transparent) 32%, color-mix(in srgb, var(--ml-text) 16%, transparent) 50%, color-mix(in srgb, var(--ml-text) 4%, transparent) 68%, transparent 100%);
	transform: translateX(-110%);
	animation: radio-public-skeleton-shimmer 1.25s ease-in-out infinite;
}

.radio-player__public-skeleton-avatar { width: 5.25rem; height: 2.35rem; border-radius: 0.55rem; }
.radio-player__public-skeleton-copy { display: grid; align-content: center; gap: 0.48rem; min-width: 0; }
.radio-player__public-skeleton-line { height: 0.62rem; border-radius: 999px; }
.radio-player__public-skeleton-line--short { width: min(7.6rem, 48%); }
.radio-player__public-skeleton-line--long { width: min(15rem, 78%); height: 0.92rem; }

@keyframes radio-public-skeleton-shimmer { to { transform: translateX(110%); } }

@media (min-width: 768px) {
	.radio-player.is-docked .radio-player__public-skeleton,
	.radio-player:not(.is-docked) .radio-player__public-skeleton {
		grid-template-columns: 2.75rem minmax(0, 1fr);
		gap: 0.58rem;
	}
	.radio-player.is-docked .radio-player__public-skeleton-avatar { width: 2.75rem; height: 2.75rem; border-radius: 0.52rem; }
	.radio-player.is-docked .radio-player__public-skeleton-line--short { width: min(6.2rem, 42%); }
	.radio-player.is-docked .radio-player__public-skeleton-line--long { width: min(12rem, 72%); }
}

@media (max-width: 767.98px) {
	.radio-player__public-skeleton { grid-template-columns: 2.25rem minmax(0, 1fr); gap: 0.38rem; }
	.radio-player__public-skeleton-avatar { width: 2.25rem; height: 2.25rem; border-radius: 0.42rem; }
	.radio-player__public-skeleton-copy { gap: 0.34rem; }
	.radio-player__public-skeleton-line--short { width: min(5rem, 44%); height: 0.46rem; }
	.radio-player__public-skeleton-line--long { width: min(9rem, 74%); height: 0.68rem; }
}

@media (max-width: 370px) {
	.radio-player__public-skeleton { grid-template-columns: 2rem minmax(0, 1fr); gap: 0.3rem; }
	.radio-player__public-skeleton-avatar { width: 2rem; height: 2rem; }
}

.radio-player.is-info-refreshing .radio-player__status {
	display: flex;
	align-items: center;
	gap: 0.46rem;
	color: var(--ml-muted);
}

.radio-player.is-info-refreshing .radio-player__status::before {
	content: "";
	box-sizing: border-box;
	width: 0.78rem;
	height: 0.78rem;
	flex: 0 0 0.78rem;
	border: 2px solid var(--color-white-16);
	border-top-color: var(--ml-accent-hover);
	border-radius: 50%;
	animation: radio-data-refresh-spin 720ms linear infinite;
}

@keyframes radio-data-refresh-spin { to { transform: rotate(360deg); } }

.radio-player.is-info-refreshing .radio-player__public-skeleton { box-sizing: border-box; }

@media (min-width: 768px) {
	.radio-player.is-docked.is-info-refreshing .radio-player__public-panel {
		display: block;
		opacity: 1;
		visibility: visible;
		pointer-events: none;
	}

	.radio-player.is-docked.is-info-refreshing .radio-player__public-skeleton {
		display: grid;
		padding-right: 1.9rem;
		opacity: 1;
		visibility: visible;
	}

	.radio-player.is-docked.is-info-refreshing .radio-player__public-skeleton::before {
		content: "";
		position: absolute;
		right: 0.28rem;
		top: 50%;
		box-sizing: border-box;
		width: 0.9rem;
		height: 0.9rem;
		border: 2px solid var(--color-white-16);
		border-top-color: var(--ml-accent-hover);
		border-radius: 50%;
		transform: translateY(-50%);
		animation: radio-dock-refresh-spin 720ms linear infinite;
	}

	.radio-player.is-docked.is-info-refreshing .radio-player__status { display: none; }
}

@media (max-width: 767.98px) {
	.radio-player.is-docked.is-info-refreshing .radio-player__public-panel {
		display: block;
		opacity: 1;
		visibility: visible;
		pointer-events: none;
	}
	.radio-player.is-docked.is-info-refreshing .radio-player__public-skeleton { display: grid; padding-right: 1.45rem; }
	.radio-player.is-docked.is-info-refreshing .radio-player__public-skeleton::before {
		content: "";
		position: absolute;
		right: 0.12rem;
		top: 50%;
		box-sizing: border-box;
		width: 0.72rem;
		height: 0.72rem;
		border: 2px solid var(--color-white-16);
		border-top-color: var(--ml-accent-hover);
		border-radius: 50%;
		transform: translateY(-50%);
		animation: radio-dock-refresh-spin 720ms linear infinite;
	}
	.radio-player.is-docked.is-info-refreshing .radio-player__status { display: none; }
}

@keyframes radio-dock-refresh-spin {
	from { transform: translateY(-50%) rotate(0deg); }
	to { transform: translateY(-50%) rotate(360deg); }
}


/* --------------------------------------------------------------------------
 * Lejátszógomb-effektek
 * -------------------------------------------------------------------------- */

.radio-player__play-button::before {
	content: "";
	position: absolute;
	inset: -3px;
	z-index: 0;
	box-sizing: border-box;
	padding: 2px;
	border-radius: inherit;
	background:
		conic-gradient(from var(--play-border-angle-a), color-mix(in srgb, var(--ml-text) 90%, transparent) 0deg, color-mix(in srgb, var(--ml-text) 52%, transparent) 8deg, color-mix(in srgb, var(--ml-text) 22%, transparent) 17deg, color-mix(in srgb, var(--ml-text) 8%, transparent) 26deg, color-mix(in srgb, var(--ml-text) 2%, transparent) 34deg, transparent 42deg 360deg),
		conic-gradient(from var(--play-border-angle-b), color-mix(in srgb, var(--ml-text) 90%, transparent) 0deg, color-mix(in srgb, var(--ml-text) 52%, transparent) 8deg, color-mix(in srgb, var(--ml-text) 22%, transparent) 17deg, color-mix(in srgb, var(--ml-text) 8%, transparent) 26deg, color-mix(in srgb, var(--ml-text) 2%, transparent) 34deg, transparent 42deg 360deg);
	-webkit-mask: linear-gradient(var(--bs-black) 0 0) content-box, linear-gradient(var(--bs-black) 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(var(--bs-black) 0 0) content-box, linear-gradient(var(--bs-black) 0 0);
	mask-composite: exclude;
	opacity: 0;
	pointer-events: none;
	transition: opacity 220ms ease, filter 180ms ease;
}

.radio-player[data-state="playing"] .radio-player__play-button::before {
	opacity: 0.78;
	animation: radio-border-light-clockwise 3.2s linear infinite, radio-border-light-counterclockwise 3.2s linear infinite;
	animation-delay: var(--radio-border-phase-delay, 0s), var(--radio-border-phase-delay, 0s);
}

.radio-player__play-button::after {
	content: "";
	position: absolute;
	inset: 5px;
	z-index: 1;
	border: 1px solid transparent;
	border-radius: inherit;
	background: linear-gradient(145deg, color-mix(in srgb, var(--ml-text) 12%, transparent), transparent 45%);
	opacity: 0;
	transform: scale(0.74);
	pointer-events: none;
	transition: opacity 150ms ease, transform 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 80ms ease;
}

.radio-player__play-button .material-symbols-rounded {
	position: relative;
	z-index: 2;
	display: block;
	transform: rotate(0deg) scale(1);
	transform-origin: center;
	opacity: 1;
	filter: blur(0);
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1), opacity 180ms ease, filter 180ms ease;
}

@media (hover: hover) and (pointer: fine) {
	.radio-player:not(.is-docked) .radio-player__play-button:hover {
		border-color: color-mix(in srgb, var(--ml-text) 38%, transparent);
		transform: translateY(-2px) scale(1.035);
		filter: brightness(1.06) saturate(1.03);
	}
	.radio-player__play-button:hover::after { opacity: 0.36; transform: scale(1); }
	.radio-player[data-state="playing"] .radio-player__play-button:hover::before { opacity: 0.98; filter: brightness(1.14); }
	.radio-player__play-button:hover .material-symbols-rounded { transform: rotate(3deg) scale(1.07); }
}

.radio-player:not(.is-docked) .radio-player__play-button:active {
	transform: translateY(1px) scale(0.92);
	filter: brightness(0.94) saturate(0.92);
	transition-duration: 70ms;
}

.radio-player.is-docked .radio-player__play-button:active { scale: 0.92; transition-duration: 70ms; }
.radio-player__play-button:active::after { border-color: color-mix(in srgb, var(--ml-text) 50%, transparent); opacity: 0.9; transform: scale(0.86); transition-duration: 70ms; }
.radio-player__play-button:active .material-symbols-rounded { transform: rotate(-10deg) scale(0.72); opacity: 0.58; filter: blur(0.5px); transition-duration: 70ms; }

/*
 * Az ikon állapotát a JS a [hidden] attribútummal kezeli.
 * Nem kötünk egyszer lefutó keyframe-et a data-state selectorhoz, mert Turbo
 * DOM-áthelyezéskor az ilyen animáció böngészőtől függően újra lefuthat.
 */
.radio-player__play-button .material-symbols-rounded {
	animation: none;
}

@keyframes radio-border-light-clockwise { from { --play-border-angle-a: 0deg; } to { --play-border-angle-a: 360deg; } }
@keyframes radio-border-light-counterclockwise { from { --play-border-angle-b: 180deg; } to { --play-border-angle-b: -180deg; } }

@keyframes radio-icon-change-playing {
	0%, 100% { opacity: 1; transform: rotate(0deg) scale(1); filter: blur(0); }
	34% { opacity: 0.16; transform: rotate(20deg) scale(0.46); filter: blur(1.6px); }
	64% { opacity: 1; transform: rotate(-5deg) scale(1.1); filter: blur(0); }
}

@keyframes radio-icon-change-stopped {
	0%, 100% { opacity: 1; transform: rotate(0deg) scale(1); filter: blur(0); }
	34% { opacity: 0.16; transform: rotate(-20deg) scale(0.46); filter: blur(1.6px); }
	64% { opacity: 1; transform: rotate(5deg) scale(1.1); filter: blur(0); }
}


@media (prefers-reduced-motion: reduce) {
	.radio-player *,
	.radio-player *::before,
	.radio-player *::after,
	.mobile-broadcast-modal,
	.mobile-broadcast-modal *,
	.mobile-broadcast-modal *::before,
	.mobile-broadcast-modal *::after {
		scroll-behavior: auto !important;
		animation-duration: 1ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 1ms !important;
		transition-delay: 0ms !important;
	}
}

/* ========================================================================== 
 * MEGALIVE 2026 — referencia szerinti felső rádiólejátszó
 * --------------------------------------------------------------------------
 * Csak a NEM dokkolt desktop lejátszót módosítja. A meglévő HTML/PHP,
 * JavaScript, mobil lejátszó és dokkolt mód változatlanul működik.
 * ========================================================================== */
@media (min-width: 992px) {
	.radio-player:not(.is-docked) {
		--ml26-player-bg: #031719;
		--ml26-player-bg-deep: #021214;
		--ml26-player-surface: rgba(6, 37, 41, 0.78);
		--ml26-player-surface-hover: rgba(10, 52, 57, 0.9);
		--ml26-player-border: rgba(65, 214, 226, 0.22);
		--ml26-player-border-strong: rgba(65, 214, 226, 0.48);
		--ml26-player-accent: #45dbe7;
		--ml26-player-accent-soft: rgba(69, 219, 231, 0.13);
		--ml26-player-text: #eefbfc;
		--ml26-player-muted: #91aeb2;

		min-height: 13.1rem;
		padding: 1.15rem 4.35rem 1.15rem 1.35rem;
		border: 1px solid var(--ml26-player-border);
		border-radius: 1.25rem;
		background:
			radial-gradient(circle at 14% 40%, rgba(69, 219, 231, 0.055), transparent 27%),
			radial-gradient(circle at 72% 18%, rgba(69, 219, 231, 0.035), transparent 31%),
			linear-gradient(118deg, var(--ml26-player-bg-deep) 0%, var(--ml26-player-bg) 46%, #052327 100%);
		box-shadow:
			0 22px 55px rgba(0, 0, 0, 0.28),
			inset 0 1px rgba(238, 251, 252, 0.035);
		color: var(--ml26-player-text);
	}

	.radio-player:not(.is-docked)::after {
		inset: auto 1.4rem 0;
		height: 1px;
		background: linear-gradient(90deg, transparent, rgba(69, 219, 231, 0.58), transparent);
		opacity: 0.62;
	}

	.radio-player:not(.is-docked) .radio-player__layout {
		position: relative;
		z-index: 1;
		grid-template-columns: minmax(9.6rem, 10.4rem) minmax(0, 1fr) minmax(7.4rem, 8.15rem);
		gap: clamp(1.15rem, 2vw, 2.25rem);
		min-height: 10.75rem;
	}

	/* Bal oldali fő vezérlőblokk. */
	.radio-player:not(.is-docked) .radio-player__control-column {
		min-width: 9.6rem;
		gap: 0.65rem;
	}

	.radio-player:not(.is-docked) .radio-player__play-stage {
		width: 8.6rem;
		height: 6.8rem;
	}

	.radio-player:not(.is-docked) .radio-player__equalizer {
		inset: 0.55rem -0.15rem;
		padding: 0.65rem 0;
		opacity: 0.72;
		filter: drop-shadow(0 0 0.65rem rgba(69, 219, 231, 0.16));
	}

	.radio-player:not(.is-docked) .radio-player__equalizer span {
		flex-basis: 0.34rem;
		width: 0.34rem;
		border-radius: 999px;
		background: linear-gradient(to top, rgba(69, 219, 231, 0.13), rgba(69, 219, 231, 0.62));
		opacity: 0.34;
	}

	.radio-player:not(.is-docked) .radio-player__play-button {
		width: 4.75rem;
		height: 4.75rem;
		/* border: 1px solid rgba(69, 219, 231, 0.88); */
		background:
			radial-gradient(circle at 36% 28%, rgba(238, 251, 252, 0.10), transparent 34%),
			linear-gradient(145deg, rgba(10, 53, 58, 0.95), rgba(2, 20, 22, 0.98));
		box-shadow:
			0 0 0 0.42rem rgba(69, 219, 231, 0.035),
			0 0 1.45rem rgba(69, 219, 231, 0.13),
			0 0.9rem 2rem rgba(0, 0, 0, 0.34),
			inset 0 1px rgba(238, 251, 252, 0.08);
		color: var(--ml26-player-accent);
		font-size: 1.28rem;
	}

	.radio-player:not(.is-docked) .radio-player__play-button i,
	.radio-player:not(.is-docked) .radio-player__play-button .material-symbols-rounded {
		color: var(--ml26-player-accent) !important;
		filter: drop-shadow(0 0 0.45rem rgba(69, 219, 231, 0.34));
	}

	.radio-player:not(.is-docked) .radio-player__apps {
		grid-template-columns: repeat(4, 2.05rem);
		gap: 0.38rem;
	}

	.radio-player:not(.is-docked) .radio-player__app-button {
		width: 2.05rem;
		height: 2.05rem;
		border: 1px solid rgba(69, 219, 231, 0.13);
		border-radius: 0.58rem;
		background: rgba(7, 40, 44, 0.68);
		box-shadow: inset 0 1px rgba(238, 251, 252, 0.025);
		color: #b8d6d9;
	}

	.radio-player:not(.is-docked) .radio-player__app-button:hover {
		border-color: rgba(69, 219, 231, 0.40);
		background: rgba(10, 54, 59, 0.88);
		color: var(--ml26-player-accent);
		box-shadow: 0 0 0.8rem rgba(69, 219, 231, 0.08);
	}

	/* Középső információs blokk. */
	.radio-player:not(.is-docked) .radio-player__identity {
		position: relative;
		isolation: isolate;
		display: grid;
		align-content: center;
		min-height: 9.6rem;
		padding: 0.2rem 1rem 0.2rem 0;
		overflow: hidden;
	}

	/* A referencia finom, háttérben futó audió-hulláma — külön HTML nélkül. */
	.radio-player:not(.is-docked) .radio-player__identity::after {
		content: "";
		position: absolute;
		top: 1.75rem;
		right: 0;
		z-index: -1;
		width: min(66%, 36rem);
		height: 5.4rem;
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100% 100%;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 720 120'%3E%3Cpath d='M0 60 C20 60 28 60 40 60 C50 60 56 48 64 60 C72 72 78 26 88 60 C98 94 108 18 120 60 C132 102 142 40 154 60 C166 80 178 54 190 60 C204 66 216 54 230 60 C244 66 256 32 270 60 C284 88 298 47 312 60 C326 73 340 51 354 60 C368 69 382 22 398 60 C414 98 430 42 446 60 C462 78 478 54 494 60 C510 66 526 50 542 60 C558 70 574 45 590 60 C606 75 620 54 636 60 C652 66 668 57 684 60 C700 63 710 60 720 60' fill='none' stroke='%2345dbe7' stroke-opacity='.16' stroke-width='1.5'/%3E%3C/svg%3E");
		pointer-events: none;
	}

	.radio-player:not(.is-docked) .radio-player__identity-copy {
		display: grid;
		align-content: center;
		justify-items: start;
		min-width: 0;
	}

	.radio-player:not(.is-docked) .radio-player__eyebrow {
		order: 1;
		margin: 0 0 0.42rem;
		color: #9cc1c5;
		font-size: 0.68rem;
		font-weight: 800;
		letter-spacing: 0.13em;
	}

	.radio-player:not(.is-docked) .radio-player__live-dot {
		width: 0.48rem;
		height: 0.48rem;
		border: 1px solid var(--ml26-player-accent);
		box-shadow: 0 0 0.55rem rgba(69, 219, 231, 0.16);
	}

	.radio-player:not(.is-docked) .radio-player__title {
		order: 2;
		max-width: 100%;
		margin: 0;
		padding: 0;
		color: var(--ml26-player-text);
		font-size: clamp(1.55rem, 2vw, 2rem);
		font-weight: 800;
		line-height: 1.1;
		letter-spacing: -0.035em;
		text-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.25);
	}

	.radio-player:not(.is-docked) .radio-player__status {
		order: 3;
		margin: 0.44rem 0 0.72rem;
		color: var(--ml26-player-muted);
		font-size: 0.72rem;
		line-height: 1.35;
	}

	.radio-player:not(.is-docked) .radio-player__public-panel {
		order: 4;
		width: min(100%, 34rem);
		margin: 0;
	}

	.radio-player:not(.is-docked) .radio-player__public-presenter {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
	}

	/* A referencia desktop lejátszóján a műsorvezető szövegesen jelenik meg. */
	.radio-player:not(.is-docked) .radio-player__public-avatar,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar {
		display: none !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-presenter-copy {
		gap: 0.18rem;
		padding: 0;
	}

	.radio-player:not(.is-docked) .radio-player__public-label {
		color: #86a7ab;
		font-size: 0.62rem;
		font-weight: 850;
		letter-spacing: 0.115em;
	}

	.radio-player:not(.is-docked) .radio-player__public-mainline {
		gap: 0.48rem;
		padding: 0;
		color: var(--ml26-player-text);
		font-size: clamp(0.98rem, 1.25vw, 1.12rem);
		font-weight: 800;
		line-height: 1.26;
		letter-spacing: -0.018em;
	}

	.radio-player:not(.is-docked) .radio-player__public-separator {
		color: #6f9599;
	}

	.radio-player:not(.is-docked) .radio-player__public-live-badge {
		min-height: 1.25rem;
		padding: 0.12rem 0.42rem;
		border-color: rgba(69, 219, 231, 0.38);
		background: rgba(69, 219, 231, 0.055);
		color: var(--ml26-player-accent);
		font-size: 0.56rem;
	}

	/* Jobb oldali hangerő — a referencia körműszere. */
	.radio-player:not(.is-docked) .radio-player__volume-control {
		position: relative;
		min-width: 7.4rem;
		gap: 0.38rem;
		padding-top: 0.25rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-label {
		color: #91aeb2;
		font-size: 0.58rem;
		font-weight: 850;
		letter-spacing: 0.13em;
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob {
		width: 5.35rem;
		height: 5.35rem;
		border: 1px solid rgba(169, 224, 229, 0.13);
		background:
			radial-gradient(circle at 36% 30%, rgba(238, 251, 252, 0.075), transparent 27%),
			linear-gradient(145deg, rgba(8, 43, 47, 0.96), rgba(2, 20, 22, 0.98) 74%);
		box-shadow:
			0 0.8rem 2rem rgba(0, 0, 0, 0.35),
			0 0 1rem rgba(69, 219, 231, 0.045),
			inset 0 1px rgba(238, 251, 252, 0.07),
			inset 0 -0.3rem 0.8rem rgba(0, 0, 0, 0.26);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob::before {
		background: conic-gradient(
			from 225deg,
			var(--ml26-player-accent) 0deg var(--radio-volume-progress),
			rgba(224, 245, 247, 0.08) var(--radio-volume-progress) 270deg,
			transparent 270deg 360deg
		);
		filter: drop-shadow(0 0 0.42rem rgba(69, 219, 231, 0.20));
	}

	.radio-player:not(.is-docked) .radio-player__volume-scale {
		background: repeating-conic-gradient(
			from 225deg,
			rgba(207, 238, 241, 0.24) 0deg 1.4deg,
			transparent 1.4deg 13.5deg
		);
		opacity: 0.48;
	}

	.radio-player:not(.is-docked) .radio-player__volume-center {
		width: 2.65rem;
		height: 2.65rem;
		border-color: rgba(238, 251, 252, 0.07);
		background: linear-gradient(145deg, rgba(8, 43, 47, 0.96), rgba(2, 20, 22, 0.98));
		color: #9bb8bb;
	}

	.radio-player:not(.is-docked) .radio-player__volume-output {
		color: #e6f8fa;
		font-size: 0.67rem;
		font-weight: 850;
	}

	/* A meglévő dokkoló gomb marad funkcionális, csak vizuálisan simul a referenciához. */
	.radio-player:not(.is-docked) .radio-player__dock-toggle {
		top: 0.82rem;
		right: 0.95rem;
		width: 2.35rem;
		height: 2.1rem;
		border: 1px solid rgba(69, 219, 231, 0.16);
		border-radius: 0.62rem;
		background: rgba(5, 31, 34, 0.76);
		box-shadow: inset 0 1px rgba(238, 251, 252, 0.025);
		color: #a7c7ca;
	}

	.radio-player:not(.is-docked) .radio-player__dock-toggle:hover {
		border-color: rgba(69, 219, 231, 0.40);
		background: rgba(9, 48, 52, 0.90);
		color: var(--ml26-player-accent);
		transform: none;
	}

	.radio-player:not(.is-docked) .radio-player__dock-line {
		width: 0.95rem;
		height: 1px;
	}
}

/* Kisebb desktopon se törjön szét: ugyanaz a vizuális nyelv, kompakt geometriával. */
@media (min-width: 992px) and (max-width: 1199.98px) {
	.radio-player:not(.is-docked) {
		min-height: 11.6rem;
		padding-left: 1rem;
		padding-right: 3.7rem;
	}

	.radio-player:not(.is-docked) .radio-player__layout {
		grid-template-columns: 8.15rem minmax(0, 1fr) 6.5rem;
		gap: 0.9rem;
		min-height: 9.2rem;
	}

	.radio-player:not(.is-docked) .radio-player__control-column { min-width: 8rem; }
	.radio-player:not(.is-docked) .radio-player__play-stage { width: 7.5rem; height: 5.9rem; }
	.radio-player:not(.is-docked) .radio-player__play-button { width: 4.25rem; height: 4.25rem; }
	.radio-player:not(.is-docked) .radio-player__identity { min-height: 8.4rem; }
	.radio-player:not(.is-docked) .radio-player__title { font-size: clamp(1.4rem, 2.2vw, 1.75rem); }
	.radio-player:not(.is-docked) .radio-player__volume-control { min-width: 6.35rem; }
	.radio-player:not(.is-docked) .radio-player__volume-knob { width: 4.7rem; height: 4.7rem; }
}

/* ========================================================================== 
 * MEGALIVE 2026 — referenciafinomítás v2
 * Dinamikus vonalkázott wave + referencia play gomb + pontosabb tipográfia.
 * Csak desktop, nem dokkolt állapot.
 * ========================================================================== */
@keyframes ml26-player-ring-orbit-v2 { to { transform: rotate(360deg); } }
@keyframes ml26-player-halo-breathe-v2 {
	0%,100% { opacity:.34; transform:scale(.96); }
	50% { opacity:.78; transform:scale(1.035); }
}
@keyframes ml26-player-button-breathe-v2 {
	0%,100% { box-shadow:0 0 0 .48rem rgba(69,219,231,.035),0 0 1.1rem rgba(69,219,231,.11),0 .85rem 2rem rgba(0,0,0,.36),inset 0 1px rgba(238,251,252,.11); }
	50% { box-shadow:0 0 0 .58rem rgba(69,219,231,.055),0 0 1.8rem rgba(69,219,231,.20),0 1rem 2.25rem rgba(0,0,0,.39),inset 0 1px rgba(238,251,252,.14); }
}

@media (min-width: 992px) {
	.radio-player:not(.is-docked) {
		min-height:13rem;
		padding:1.05rem 4.2rem 1.05rem 1.3rem;
		overflow:hidden;
	}

	.radio-player:not(.is-docked) .radio-player__layout {
		position:relative;
		z-index:2;
		grid-template-columns:minmax(9.8rem,10.6rem) minmax(0,1fr) minmax(7.4rem,8.2rem);
		gap:clamp(1.15rem,2vw,2.15rem);
		min-height:10.8rem;
	}

	/* A JS 72 függőleges vonalat hoz létre, ezekből épül a mozgó hullám. */
	.radio-player:not(.is-docked) .radio-player__ambient-wave {
		position:absolute;
		left:clamp(23rem,38%,38rem);
		right:clamp(8.4rem,13%,13rem);
		top:50%;
		z-index:1;
		display:flex;
		height:7.15rem;
		align-items:center;
		justify-content:space-between;
		gap:2px;
		opacity:.76;
		transform:translateY(-48%);
		pointer-events:none;
		-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 8%,#000 88%,transparent 100%);
		mask-image:linear-gradient(90deg,transparent 0%,#000 8%,#000 88%,transparent 100%);
	}
	.radio-player:not(.is-docked) .radio-player__ambient-wave::before {
		content:"";
		position:absolute;
		left:0; right:0; top:50%;
		height:1px;
		background:linear-gradient(90deg,transparent,rgba(69,219,231,.12) 14%,rgba(69,219,231,.22) 50%,rgba(69,219,231,.12) 86%,transparent);
		box-shadow:0 0 1rem rgba(69,219,231,.055);
	}
	.radio-player:not(.is-docked) .radio-player__ambient-wave-bar {
		width:1px;
		height:4.9rem;
		flex:1 1 1px;
		max-width:2px;
		border-radius:999px;
		background:linear-gradient(to bottom,transparent,rgba(69,219,231,.31) 22%,rgba(69,219,231,.58) 50%,rgba(69,219,231,.31) 78%,transparent);
		box-shadow:0 0 .25rem rgba(69,219,231,.10);
		opacity:var(--wave-opacity,.28);
		transform:scaleY(var(--wave-scale,.12));
		transform-origin:center;
		will-change:transform,opacity;
	}
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__ambient-wave-bar {
		box-shadow:0 0 .38rem rgba(69,219,231,.16);
	}

	/* A régi statikus SVG waveform kikapcsolva. */
	.radio-player:not(.is-docked) .radio-player__identity::after { content:none !important; }

	.radio-player:not(.is-docked) .radio-player__control-column {
		position:relative;
		z-index:3;
		min-width:9.8rem;
		gap:.72rem;
	}
	.radio-player:not(.is-docked) .radio-player__play-stage {
		position:relative;
		width:8.9rem;
		height:7.25rem;
	}
	.radio-player:not(.is-docked) .radio-player__play-stage::before {
		content:"";
		position:absolute;
		z-index:0;
		width:6.15rem;
		height:6.15rem;
		border-radius:50%;
		background:conic-gradient(from 215deg,rgba(69,219,231,.82) 0 54deg,rgba(69,219,231,.08) 54deg 248deg,rgba(69,219,231,.44) 248deg 286deg,rgba(69,219,231,.08) 286deg 360deg);
		-webkit-mask:radial-gradient(circle,transparent 67%,#000 68% 70%,transparent 71%);
		mask:radial-gradient(circle,transparent 67%,#000 68% 70%,transparent 71%);
		filter:drop-shadow(0 0 .65rem rgba(69,219,231,.22));
		opacity:.64;
		pointer-events:none;
	}
	.radio-player:not(.is-docked) .radio-player__play-stage::after {
		content:"";
		position:absolute;
		z-index:0;
		width:5.72rem;
		height:5.72rem;
		border:1px solid rgba(69,219,231,.14);
		border-radius:50%;
		box-shadow:0 0 2rem rgba(69,219,231,.08),inset 0 0 1.15rem rgba(69,219,231,.035);
		opacity:.58;
		pointer-events:none;
	}
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__play-stage::before {
		animation: ml26-player-ring-orbit-v2 5.2s linear infinite;
		animation-delay: var(--radio-ring-phase-delay, 0s);
	}
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__play-stage::after {
		animation: ml26-player-halo-breathe-v2 1.85s ease-in-out infinite;
		animation-delay: var(--radio-halo-phase-delay, 0s);
	}

	.radio-player:not(.is-docked) .radio-player__equalizer {
		inset:.48rem -.18rem;
		padding:.72rem 0;
		opacity:.74;
		filter:drop-shadow(0 0 .68rem rgba(69,219,231,.16));
	}
	.radio-player:not(.is-docked) .radio-player__equalizer span {
		flex-basis:.32rem;
		width:.32rem;
		background:linear-gradient(to top,rgba(69,219,231,.08),rgba(69,219,231,.56),rgba(69,219,231,.08));
		opacity:.32;
	}

	.radio-player:not(.is-docked) .radio-player__play-button {
		width:4.65rem;
		height:4.65rem;
		/* border:1px solid rgba(91,231,240,.88); */
		background:radial-gradient(circle at 35% 28%,rgba(238,251,252,.13),transparent 29%),radial-gradient(circle at 50% 58%,rgba(69,219,231,.075),transparent 48%),linear-gradient(145deg,rgba(9,51,56,.98),rgba(2,18,20,.99));
		box-shadow:0 0 0 .48rem rgba(69,219,231,.035),0 0 1.1rem rgba(69,219,231,.11),0 .85rem 2rem rgba(0,0,0,.36),inset 0 1px rgba(238,251,252,.11);
		color:#63e6ef;
		font-size:1.34rem;
		transform:translateZ(0);
	}
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__play-button {
		animation: ml26-player-button-breathe-v2 1.8s ease-in-out infinite;
		animation-delay: var(--radio-button-phase-delay, 0s);
	}
	.radio-player:not(.is-docked) .radio-player__play-button:hover {
		border-color:#7debf2;
		box-shadow:0 0 0 .56rem rgba(69,219,231,.045),0 0 1.85rem rgba(69,219,231,.21),0 1rem 2.3rem rgba(0,0,0,.4),inset 0 1px rgba(238,251,252,.13);
		transform:scale(1.025);
	}
	.radio-player:not(.is-docked) .radio-player__play-button i {
		position:relative;
		z-index:3;
		color:#63e6ef !important;
		filter:drop-shadow(0 0 .5rem rgba(69,219,231,.45));
	}
	.radio-player:not(.is-docked) .radio-player__play-button .fa-play { transform:translateX(2px) scale(1.08); }

	/* Referencia szerinti betűméretek és valódi gaps. */
	.radio-player:not(.is-docked) .radio-player__identity {
		position:relative;
		z-index:3;
		min-height:9.9rem;
		padding:.28rem 1rem .28rem 0;
		overflow:visible;
	}
	.radio-player:not(.is-docked) .radio-player__identity-copy {
		display:grid;
		align-content:center;
		justify-items:start;
		min-width:0;
	}
	.radio-player:not(.is-docked) .radio-player__eyebrow {
		order:1;
		margin:0 0 .58rem;
		font-size:.68rem;
		font-weight:850;
		line-height:1;
		letter-spacing:.135em;
	}
	.radio-player:not(.is-docked) .radio-player__title {
		order:2;
		font-size:clamp(1.78rem,2.2vw,2.18rem);
		font-weight:820;
		line-height:1.03;
		letter-spacing:-.038em;
	}
	.radio-player:not(.is-docked) .radio-player__status {
		order:3;
		margin:.64rem 0 .92rem;
		font-size:.78rem;
		font-weight:550;
		line-height:1.25;
	}
	.radio-player:not(.is-docked) .radio-player__public-panel {
		order:4;
		width:min(100%,36rem);
		margin:0;
	}
	.radio-player:not(.is-docked) .radio-player__public-presenter {
		display:grid;
		grid-template-columns:minmax(0,1fr);
		gap:0;
		cursor:default;
	}
	.radio-player:not(.is-docked) .radio-player__public-avatar,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar { display:none !important; }
	.radio-player:not(.is-docked) .radio-player__public-presenter-copy { display:grid; gap:.31rem; padding:0; }
	.radio-player:not(.is-docked) .radio-player__public-label {
		font-size:.66rem;
		font-weight:850;
		line-height:1;
		letter-spacing:.115em;
	}
	.radio-player:not(.is-docked) .radio-player__public-mainline {
		display:flex;
		align-items:baseline;
		gap:.52rem;
		padding:0;
		font-size:clamp(1.08rem,1.34vw,1.22rem);
		font-weight:800;
		line-height:1.22;
		white-space:nowrap;
	}

	/* Csak maga a műsorvezető neve link; a label és hallgatószám nem. */
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link {
		display:inline-block;
		min-width:0;
		color:inherit;
		font:inherit;
		text-decoration:none;
		text-underline-offset:.16em;
	}
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link[href] { cursor:pointer; }
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link[href]:hover,
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link[href]:focus-visible {
		color:#79e7ef;
		text-decoration:underline;
		text-shadow:0 0 .7rem rgba(69,219,231,.18);
	}

	.radio-player:not(.is-docked) .radio-player__volume-control { position:relative; z-index:3; }
}

@media (min-width:992px) and (max-width:1199.98px) {
	.radio-player:not(.is-docked) .radio-player__ambient-wave { left:22rem; right:8rem; height:6.4rem; }
	.radio-player:not(.is-docked) .radio-player__play-stage::before { width:5.55rem; height:5.55rem; }
	.radio-player:not(.is-docked) .radio-player__play-stage::after { width:5.15rem; height:5.15rem; }
	.radio-player:not(.is-docked) .radio-player__title { font-size:clamp(1.55rem,2.35vw,1.92rem); }
	.radio-player:not(.is-docked) .radio-player__public-mainline { font-size:clamp(1rem,1.35vw,1.12rem); }
}

@media (prefers-reduced-motion:reduce) {
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__play-stage::before,
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__play-stage::after,
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__play-button { animation:none !important; }
}

/* ========================================================================== 
 * MEGALIVE 2026 PLAYER v3 — finomhangolás a jóváhagyott referencia alapján
 * - műsorvezető + avatar visszaállítva a felső nézetben
 * - kisebb állomáscím
 * - részletesebb, prémium hangerő-potméter
 * ========================================================================== */
@media (min-width: 768px) {
	/* A referencia szerint az állomásnév hangsúlyos, de nem dominálja a panelt. */
	.radio-player:not(.is-docked) .radio-player__title {
		font-size: clamp(1.34rem, 1.72vw, 1.68rem) !important;
		font-weight: 820;
		line-height: 1.08;
		letter-spacing: -.034em;
	}

	/* Műsorvezető blokk: avatar + label + név + hallgatószám. */
	.radio-player:not(.is-docked) .radio-player__public-presenter {
		display: grid !important;
		grid-template-columns: 2.82rem minmax(0, 1fr) !important;
		align-items: center;
		gap: .66rem !important;
		width: min(100%, 38rem);
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar {
		display: grid !important;
		width: 2.82rem !important;
		height: 2.82rem !important;
		min-width: 2.82rem !important;
		min-height: 2.82rem !important;
		aspect-ratio: 1 / 1;
		border: 1px solid rgba(91, 231, 240, .25);
		border-radius: .72rem;
		background:
			radial-gradient(circle at 32% 25%, rgba(238, 251, 252, .11), transparent 34%),
			linear-gradient(145deg, rgba(13, 57, 61, .98), rgba(2, 23, 25, .98));
		box-shadow:
			0 0 0 .2rem rgba(69, 219, 231, .025),
			0 .38rem .95rem rgba(0, 0, 0, .25),
			inset 0 1px rgba(238, 251, 252, .08);
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar img {
		object-fit: cover;
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar-fallback {
		display: inline-flex;
		font-size: 1.45rem;
		color: #63e6ef;
		opacity: .8;
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar.has-image .radio-player__public-avatar-fallback {
		display: none;
	}

	.radio-player:not(.is-docked) .radio-player__public-presenter-copy {
		display: grid;
		gap: .34rem;
	}

	.radio-player:not(.is-docked) .radio-player__public-label {
		font-size: .64rem;
		letter-spacing: .12em;
		line-height: 1;
	}

	.radio-player:not(.is-docked) .radio-player__public-mainline {
		font-size: clamp(1.02rem, 1.18vw, 1.16rem);
		line-height: 1.18;
		gap: .48rem;
	}

	/* Csak a név kattintható, a címke/avatar/hallgatószám nem. */
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link {
		font-weight: 830;
	}

	/* ----------------------------------------------------------------------
	 * HANGERŐ POTMÉTER — referencia-közeli, műszerfal jellegű kivitel
	 * ---------------------------------------------------------------------- */
	.radio-player:not(.is-docked) .radio-player__volume-control {
		gap: .38rem;
		min-width: 6.15rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-label {
		color: rgba(217, 241, 242, .78);
		font-size: .59rem;
		font-weight: 850;
		letter-spacing: .14em;
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob {
		width: 5.15rem !important;
		height: 5.15rem !important;
		border: 1px solid rgba(103, 220, 227, .22);
		background:
			radial-gradient(circle at 35% 26%, rgba(238, 251, 252, .13), transparent 23%),
			radial-gradient(circle at 50% 52%, rgba(69, 219, 231, .055), transparent 53%),
			linear-gradient(145deg, #0c3538 0%, #061f22 48%, #031719 100%);
		box-shadow:
			0 0 0 .28rem rgba(69, 219, 231, .025),
			0 0 1.15rem rgba(69, 219, 231, .08),
			0 .8rem 1.8rem rgba(0, 0, 0, .34),
			inset 0 1px rgba(238, 251, 252, .1),
			inset 0 -.55rem 1.05rem rgba(0, 0, 0, .2);
	}

	.radio-player:not(.is-docked) .radio-player__volume-scale {
		inset: -.53rem;
		background: repeating-conic-gradient(
			from 225deg,
			rgba(217, 241, 242, .30) 0deg 1.25deg,
			transparent 1.25deg 10.8deg
		);
		opacity: .72;
		filter: drop-shadow(0 0 .24rem rgba(69, 219, 231, .08));
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob::before {
		inset: -.32rem;
		background: conic-gradient(
			from 225deg,
			#55dce7 0deg var(--radio-volume-progress),
			rgba(217, 241, 242, .11) var(--radio-volume-progress) 270deg,
			transparent 270deg 360deg
		);
		-webkit-mask: radial-gradient(circle, transparent 65%, #000 66% 72%, transparent 73%);
		mask: radial-gradient(circle, transparent 65%, #000 66% 72%, transparent 73%);
		filter: drop-shadow(0 0 .5rem rgba(69, 219, 231, .34));
	}

	.radio-player:not(.is-docked) .radio-player__volume-center {
		width: 2.7rem;
		height: 2.7rem;
		border: 1px solid rgba(217, 241, 242, .09);
		background:
			radial-gradient(circle at 36% 27%, rgba(238, 251, 252, .11), transparent 29%),
			linear-gradient(145deg, rgba(13, 54, 58, .98), rgba(3, 22, 24, .99));
		box-shadow:
			0 .35rem .85rem rgba(0, 0, 0, .3),
			inset 0 1px rgba(238, 251, 252, .08);
		color: #b9d9db;
		font-size: .82rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-indicator::before {
		top: .34rem;
		width: .16rem;
		height: .86rem;
		background: linear-gradient(to bottom, #e9fbfc 0%, #61e4ed 52%, rgba(97, 228, 237, .18) 100%);
		box-shadow: 0 0 .58rem rgba(69, 219, 231, .65);
	}

	.radio-player:not(.is-docked) .radio-player__volume-output {
		min-width: 2.7rem;
		padding: .18rem .42rem;
		border: 1px solid rgba(103, 220, 227, .13);
		border-radius: 999px;
		background: rgba(3, 24, 26, .56);
		color: #d9f1f2;
		font-size: .68rem;
		font-weight: 850;
		line-height: 1.15;
		text-align: center;
		box-shadow: inset 0 1px rgba(238, 251, 252, .035);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob:hover {
		border-color: rgba(103, 220, 227, .48);
		transform: translateY(-1px) scale(1.012);
		box-shadow:
			0 0 0 .34rem rgba(69, 219, 231, .035),
			0 0 1.7rem rgba(69, 219, 231, .15),
			0 1rem 2.1rem rgba(0, 0, 0, .38),
			inset 0 1px rgba(238, 251, 252, .12),
			inset 0 -.55rem 1.05rem rgba(0, 0, 0, .2);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob.is-dragging {
		transform: scale(1.025);
		box-shadow:
			0 0 0 .36rem rgba(69, 219, 231, .045),
			0 0 2rem rgba(69, 219, 231, .2),
			0 1rem 2.1rem rgba(0, 0, 0, .4),
			inset 0 1px rgba(238, 251, 252, .13);
	}
}

@media (min-width: 768px) and (max-width: 1199.98px) {
	.radio-player:not(.is-docked) .radio-player__title {
		font-size: clamp(1.24rem, 1.8vw, 1.48rem) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-knob {
		width: 4.7rem !important;
		height: 4.7rem !important;
	}
}

/* ========================================================================== 
 * MEGALIVE 2026 PLAYER v4 — skeleton pontos illesztése
 * A betöltési állapot ugyanazt a geometriát követi, mint a kész
 * műsorvezető blokk: avatar + címke + név/hallgatószám sor.
 * ========================================================================== */
@media (min-width: 768px) {
	.radio-player:not(.is-docked) .radio-player__public-skeleton {
		display: grid !important;
		grid-template-columns: 2.82rem minmax(0, 1fr) !important;
		align-items: center !important;
		gap: .66rem !important;
		width: min(100%, 38rem) !important;
		min-height: 2.82rem;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		box-shadow: none !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton[hidden] {
		display: none !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar {
		display: block !important;
		width: 2.82rem !important;
		height: 2.82rem !important;
		min-width: 2.82rem !important;
		min-height: 2.82rem !important;
		margin: 0 !important;
		border: 1px solid rgba(91, 231, 240, .18) !important;
		border-radius: .72rem !important;
		background:
			radial-gradient(circle at 32% 25%, rgba(238, 251, 252, .075), transparent 34%),
			linear-gradient(145deg, rgba(18, 71, 75, .76), rgba(6, 31, 34, .92)) !important;
		box-shadow:
			0 0 0 .2rem rgba(69, 219, 231, .018),
			0 .35rem .9rem rgba(0, 0, 0, .18),
			inset 0 1px rgba(238, 251, 252, .05) !important;
		overflow: hidden;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton-copy {
		display: grid !important;
		align-content: center !important;
		justify-items: start !important;
		gap: .34rem !important;
		min-width: 0;
		padding: 0 !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton-line {
		position: relative;
		display: block !important;
		margin: 0 !important;
		border: 0 !important;
		background: linear-gradient(90deg, rgba(132, 200, 204, .12), rgba(103, 220, 227, .20), rgba(132, 200, 204, .12)) !important;
		box-shadow: inset 0 1px rgba(255, 255, 255, .025);
		overflow: hidden;
	}

	/* MŰSORVEZETŐ label helye. */
	.radio-player:not(.is-docked) .radio-player__public-skeleton-line--short {
		width: 5.55rem !important;
		height: .54rem !important;
		border-radius: .22rem !important;
	}

	/* AluBoy • 9 hallgató sor helye. */
	.radio-player:not(.is-docked) .radio-player__public-skeleton-line--long {
		width: min(12.4rem, 86%) !important;
		height: .92rem !important;
		border-radius: .28rem !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar::after,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-line::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(105deg, transparent 18%, rgba(128, 239, 246, .15) 48%, transparent 78%);
		transform: translateX(-115%);
		animation: radio-public-skeleton-shimmer 1.35s cubic-bezier(.4, 0, .2, 1) infinite;
	}

	/* Frissítéskor se nőjön rá a teljes információs blokkra. */
	.radio-player:not(.is-docked).is-info-refreshing .radio-player__public-skeleton {
		position: static !important;
		inset: auto !important;
		z-index: auto !important;
		min-height: 2.82rem !important;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.radio-player:not(.is-docked) .radio-player__public-skeleton,
	.radio-player:not(.is-docked) .radio-player__public-presenter {
		grid-template-columns: 2.45rem minmax(0, 1fr) !important;
		gap: .5rem !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar,
	.radio-player:not(.is-docked) .radio-player__public-avatar {
		width: 2.45rem !important;
		height: 2.45rem !important;
		min-width: 2.45rem !important;
		min-height: 2.45rem !important;
		border-radius: .62rem !important;
	}
}

/* ========================================================================== 
 * MEGALIVE 2026 PLAYER v5
 * - skeleton / kész műsorvezető állapot kölcsönösen kizáró
 * - referencia-közeli hangerő műszer: küllők, skála, cyan ív, középtárcsa
 * ========================================================================== */
@media (min-width: 768px) {
	/* A korábbi !important display szabályok nem írhatják felül a hidden állapotot. */
	.radio-player:not(.is-docked) .radio-player__public-skeleton[hidden],
	.radio-player:not(.is-docked) .radio-player__public-presenter[hidden],
	.radio-player:not(.is-docked) .radio-player__public-live-badge[hidden],
	.radio-player:not(.is-docked) .radio-player__public-avatar img[hidden] {
		display: none !important;
	}

	/* Skeleton és kész állapot ugyanarra a 2 oszlopos geometriára ül. */
	.radio-player:not(.is-docked) .radio-player__public-skeleton,
	.radio-player:not(.is-docked) .radio-player__public-presenter {
		grid-template-columns: 2.82rem minmax(0, 1fr) !important;
		align-items: center !important;
		gap: .66rem !important;
		min-height: 2.82rem;
	}

	.radio-player:not(.is-docked) .radio-player__public-mainline {
		min-height: 1.36rem;
	}

	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link {
		flex: 0 0 auto;
		min-width: 1ch;
		color: #f2f8f8 !important;
		font-weight: 850 !important;
		visibility: visible !important;
		opacity: 1 !important;
	}

	.radio-player:not(.is-docked) [data-radio-public-listeners] {
		display: inline !important;
		min-width: .62ch;
		color: inherit;
		visibility: visible !important;
		opacity: 1 !important;
	}

	/* ----------------------------------------------------------------------
	 * HANGERŐ – a referencia műszerfal-szerű potmétere
	 * ---------------------------------------------------------------------- */
	.radio-player:not(.is-docked) .radio-player__volume-control {
		position: relative;
		z-index: 4;
		min-width: 7rem;
		gap: .38rem;
		padding-top: .04rem;
	}

	.radio-player:not(.is-docked) .radio-player__volume-label {
		margin-bottom: .02rem;
		color: rgba(225, 242, 243, .83);
		font-size: .64rem;
		font-weight: 900;
		line-height: 1;
		letter-spacing: .12em;
		text-shadow: 0 0 .7rem rgba(71, 219, 229, .10);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob {
		position: relative;
		isolation: isolate;
		width: 5.42rem !important;
		height: 5.42rem !important;
		margin: .12rem 0 .05rem;
		border: 0 !important;
		border-radius: 50%;
		background:
			radial-gradient(circle at 50% 50%, rgba(9, 44, 47, .22) 0 39%, transparent 40%),
			radial-gradient(circle, transparent 0 58%, rgba(91, 211, 221, .045) 59% 78%, transparent 79%);
		box-shadow: none !important;
		overflow: visible;
		transform: none;
		transition: filter 180ms ease, transform 180ms cubic-bezier(.22,1,.36,1);
	}

	/* Halvány, teljes 270°-os pálya a cyan progress alatt. */
	.radio-player:not(.is-docked) .radio-player__volume-knob::after {
		content: "";
		position: absolute;
		inset: -.29rem;
		z-index: 1;
		border-radius: 50%;
		background: conic-gradient(
			from 225deg,
			rgba(164, 204, 207, .26) 0deg 270deg,
			transparent 270deg 360deg
		);
		-webkit-mask: radial-gradient(circle, transparent 0 68.5%, #000 69.5% 72.5%, transparent 73.5%);
		mask: radial-gradient(circle, transparent 0 68.5%, #000 69.5% 72.5%, transparent 73.5%);
		pointer-events: none;
		opacity: .78;
	}

	/* Aktív cyan hangerőív. */
	.radio-player:not(.is-docked) .radio-player__volume-knob::before {
		content: "";
		position: absolute;
		inset: -.30rem;
		z-index: 3;
		border-radius: 50%;
		background: conic-gradient(
			from 225deg,
			#55e6ef 0deg var(--radio-volume-progress),
			transparent var(--radio-volume-progress) 360deg
		) !important;
		-webkit-mask: radial-gradient(circle, transparent 0 67%, #000 68% 73.5%, transparent 74.5%) !important;
		mask: radial-gradient(circle, transparent 0 67%, #000 68% 73.5%, transparent 74.5%) !important;
		filter:
			drop-shadow(0 0 .22rem rgba(76, 232, 241, .72))
			drop-shadow(0 0 .62rem rgba(53, 204, 216, .28));
		pointer-events: none;
		opacity: .98;
	}

	/* Külső rövid osztások. */
	.radio-player:not(.is-docked) .radio-player__volume-scale {
		position: absolute;
		inset: -.72rem !important;
		z-index: 0 !important;
		border-radius: 50%;
		background:
			repeating-conic-gradient(
				from 225deg,
				rgba(184, 216, 218, .44) 0deg 1.25deg,
				transparent 1.25deg 11.25deg
			),
			repeating-conic-gradient(
				from 225deg,
				rgba(92, 197, 205, .16) 0deg .7deg,
				transparent .7deg 5.625deg
			);
		-webkit-mask: radial-gradient(circle, transparent 0 73%, #000 74% 91%, transparent 92%) !important;
		mask: radial-gradient(circle, transparent 0 73%, #000 74% 91%, transparent 92%) !important;
		opacity: .82 !important;
		filter: drop-shadow(0 0 .22rem rgba(66, 209, 220, .11));
		pointer-events: none;
	}

	/* Belső hosszú „küllők”, amelyek a referencia potméter mélységét adják. */
	.radio-player:not(.is-docked) .radio-player__volume-scale::before {
		content: "";
		position: absolute;
		inset: .73rem;
		border-radius: 50%;
		background: repeating-conic-gradient(
			from 225deg,
			rgba(122, 190, 195, .17) 0deg 1deg,
			transparent 1deg 11.25deg
		);
		-webkit-mask: radial-gradient(circle, transparent 0 42%, #000 43% 91%, transparent 92%);
		mask: radial-gradient(circle, transparent 0 42%, #000 43% 91%, transparent 92%);
		pointer-events: none;
	}

	/* A referencia nem középről kifutó mutatót, hanem progress-ívet használ. */
	.radio-player:not(.is-docked) .radio-player__volume-indicator {
		display: none !important;
	}

	.radio-player:not(.is-docked) .radio-player__volume-center {
		position: absolute;
		inset: 50% auto auto 50%;
		z-index: 5;
		display: grid;
		width: 2.82rem;
		height: 2.82rem;
		place-items: center;
		border: 1px solid rgba(115, 193, 199, .25);
		border-radius: 50%;
		background:
			radial-gradient(circle at 35% 28%, rgba(231, 248, 249, .10), transparent 30%),
			linear-gradient(145deg, #123b3e 0%, #09292c 48%, #051c1f 100%);
		box-shadow:
			0 .42rem 1rem rgba(0, 0, 0, .34),
			0 0 0 .14rem rgba(75, 207, 218, .035),
			inset 0 1px rgba(237, 250, 251, .09),
			inset 0 -.35rem .7rem rgba(0, 0, 0, .19);
		color: #d0e6e7;
		font-size: .9rem;
		transform: translate(-50%, -50%);
		pointer-events: none;
	}

	.radio-player:not(.is-docked) .radio-player__volume-center::before {
		content: "";
		position: absolute;
		inset: -.18rem;
		z-index: -1;
		border: 1px solid rgba(86, 213, 223, .11);
		border-radius: inherit;
		box-shadow: 0 0 .65rem rgba(73, 218, 228, .055);
	}

	.radio-player:not(.is-docked) .radio-player__volume-center i {
		filter: drop-shadow(0 0 .22rem rgba(211, 242, 244, .12));
	}

	/* A referencia százaléka nem kapszulában, hanem tiszta feliratként áll. */
	.radio-player:not(.is-docked) .radio-player__volume-output {
		min-width: 3rem;
		margin-top: .04rem;
		padding: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		color: #eff8f8;
		font-size: .88rem;
		font-weight: 900;
		line-height: 1;
		letter-spacing: -.025em;
		text-align: center;
		text-shadow: 0 1px .35rem rgba(0,0,0,.45);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob:hover {
		transform: scale(1.018) !important;
		filter: brightness(1.07);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob:hover::before,
	.radio-player:not(.is-docked) .radio-player__volume-knob.is-dragging::before {
		filter:
			drop-shadow(0 0 .3rem rgba(86, 239, 247, .88))
			drop-shadow(0 0 .85rem rgba(55, 212, 223, .38));
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob.is-dragging {
		transform: scale(1.032) !important;
		filter: brightness(1.12);
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob.is-volume-feedback::before {
		animation: radio-v5-volume-flash 360ms cubic-bezier(.22,1,.36,1) both;
	}
}

@keyframes radio-v5-volume-flash {
	0%   { opacity: .82; filter: drop-shadow(0 0 .16rem rgba(86,239,247,.45)); }
	42%  { opacity: 1;   filter: drop-shadow(0 0 .42rem rgba(86,239,247,.95)) drop-shadow(0 0 1rem rgba(55,212,223,.46)); }
	100% { opacity: .98; filter: drop-shadow(0 0 .22rem rgba(76,232,241,.72)) drop-shadow(0 0 .62rem rgba(53,204,216,.28)); }
}

@media (prefers-reduced-motion: reduce) {
	.radio-player:not(.is-docked) .radio-player__volume-knob.is-volume-feedback::before {
		animation: none !important;
	}
}

/* ========================================================================== 
 * MEGALIVE 2026 — végső theme binding
 * Csak: kisebb cím + 1.5 line-height + az oldal meglévő --ml-* színei.
 * Geometria, pozíció és működés változatlan.
 * ========================================================================== */
@media (min-width: 768px) {
	.radio-player:not(.is-docked) {
		border-color: var(--ml-border-soft) !important;
		background:
			radial-gradient(circle at 14% 40%, color-mix(in srgb, var(--ml-accent) 6%, transparent), transparent 27%),
			radial-gradient(circle at 72% 18%, color-mix(in srgb, var(--ml-accent) 4%, transparent), transparent 31%),
			linear-gradient(118deg, var(--ml-cool-deep) 0%, var(--ml-surface) 46%, var(--ml-surface-raised) 100%) !important;
		box-shadow: var(--ml-shadow), inset 0 1px color-mix(in srgb, var(--ml-text) 4%, transparent) !important;
		color: var(--ml-text) !important;
	}

	.radio-player:not(.is-docked)::after {
		background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--ml-accent) 58%, transparent), transparent) !important;
	}

	/* Kisebb Megalive Rádió, a kért 1.5 line-height-tal. */
	.radio-player:not(.is-docked) .radio-player__title {
		color: var(--ml-text) !important;
		font-size: clamp(1.16rem, 1.42vw, 1.48rem) !important;
		line-height: 1.5 !important;
	}

	.radio-player:not(.is-docked) .radio-player__eyebrow,
	.radio-player:not(.is-docked) .radio-player__status,
	.radio-player:not(.is-docked) .radio-player__public-label,
	.radio-player:not(.is-docked) .radio-player__volume-label {
		color: var(--ml-muted) !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-mainline,
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link,
	.radio-player:not(.is-docked) .radio-player__volume-output {
		color: var(--ml-text) !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-separator { color: var(--ml-dim) !important; }

	.radio-player:not(.is-docked) .radio-player__live-dot {
		border-color: var(--ml-accent) !important;
		box-shadow: 0 0 .55rem color-mix(in srgb, var(--ml-accent) 20%, transparent) !important;
	}
	.radio-player:not(.is-docked)[data-state="playing"] .radio-player__live-dot { background: var(--ml-accent) !important; }

	.radio-player:not(.is-docked) .radio-player__public-live-badge {
		border-color: color-mix(in srgb, var(--ml-accent) 38%, transparent) !important;
		background: color-mix(in srgb, var(--ml-accent) 7%, transparent) !important;
		color: var(--ml-accent) !important;
	}

	.radio-player:not(.is-docked) .radio-player__ambient-wave::before {
		background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--ml-accent) 12%, transparent) 14%, color-mix(in srgb, var(--ml-accent) 22%, transparent) 50%, color-mix(in srgb, var(--ml-accent) 12%, transparent) 86%, transparent) !important;
		box-shadow: 0 0 1rem color-mix(in srgb, var(--ml-accent) 6%, transparent) !important;
	}
	.radio-player:not(.is-docked) .radio-player__ambient-wave-bar {
		background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--ml-accent) 31%, transparent) 22%, color-mix(in srgb, var(--ml-accent) 58%, transparent) 50%, color-mix(in srgb, var(--ml-accent) 31%, transparent) 78%, transparent) !important;
		box-shadow: 0 0 .25rem color-mix(in srgb, var(--ml-accent) 10%, transparent) !important;
	}

	.radio-player:not(.is-docked) .radio-player__play-stage::before {
		background: conic-gradient(from 215deg, color-mix(in srgb, var(--ml-accent) 82%, transparent) 0 54deg, color-mix(in srgb, var(--ml-accent) 8%, transparent) 54deg 248deg, color-mix(in srgb, var(--ml-accent) 44%, transparent) 248deg 286deg, color-mix(in srgb, var(--ml-accent) 8%, transparent) 286deg 360deg) !important;
		filter: drop-shadow(0 0 .65rem color-mix(in srgb, var(--ml-accent) 22%, transparent)) !important;
	}
	.radio-player:not(.is-docked) .radio-player__play-stage::after {
		border-color: color-mix(in srgb, var(--ml-accent) 14%, transparent) !important;
		box-shadow: 0 0 2rem color-mix(in srgb, var(--ml-accent) 8%, transparent), inset 0 0 1.15rem color-mix(in srgb, var(--ml-accent) 4%, transparent) !important;
	}
	.radio-player:not(.is-docked) .radio-player__equalizer { filter: drop-shadow(0 0 .68rem color-mix(in srgb, var(--ml-accent) 16%, transparent)) !important; }
	.radio-player:not(.is-docked) .radio-player__equalizer span {
		background: linear-gradient(to top, color-mix(in srgb, var(--ml-accent) 8%, transparent), color-mix(in srgb, var(--ml-accent) 56%, transparent), color-mix(in srgb, var(--ml-accent) 8%, transparent)) !important;
	}

	.radio-player:not(.is-docked) .radio-player__play-button {
		border-color: color-mix(in srgb, var(--ml-accent) 88%, transparent) !important;
		background: radial-gradient(circle at 35% 28%, color-mix(in srgb, var(--ml-text) 13%, transparent), transparent 29%), radial-gradient(circle at 50% 58%, color-mix(in srgb, var(--ml-accent) 8%, transparent), transparent 48%), linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep)) !important;
		color: var(--ml-accent) !important;
	}
	.radio-player:not(.is-docked) .radio-player__play-button:hover { border-color: var(--ml-accent-hover) !important; }
	.radio-player:not(.is-docked) .radio-player__play-button i,
	.radio-player:not(.is-docked) .radio-player__play-button .material-symbols-rounded {
		color: var(--ml-accent) !important;
		filter: drop-shadow(0 0 .5rem color-mix(in srgb, var(--ml-accent) 45%, transparent)) !important;
	}

	.radio-player:not(.is-docked) .radio-player__app-button,
	.radio-player:not(.is-docked) .radio-player__dock-toggle {
		border-color: color-mix(in srgb, var(--ml-accent) 14%, var(--ml-border-soft)) !important;
		background: color-mix(in srgb, var(--ml-surface) 88%, transparent) !important;
		color: var(--ml-muted) !important;
	}
	.radio-player:not(.is-docked) .radio-player__app-button:hover,
	.radio-player:not(.is-docked) .radio-player__dock-toggle:hover {
		border-color: color-mix(in srgb, var(--ml-accent) 40%, var(--ml-border-soft)) !important;
		background: var(--ml-surface-hover) !important;
		color: var(--ml-accent) !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-avatar,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar {
		border-color: color-mix(in srgb, var(--ml-accent) 25%, var(--ml-border-soft)) !important;
		background: radial-gradient(circle at 32% 25%, color-mix(in srgb, var(--ml-text) 11%, transparent), transparent 34%), linear-gradient(145deg, var(--ml-surface-raised), var(--ml-cool-deep)) !important;
	}
	.radio-player:not(.is-docked) .radio-player__public-avatar-fallback { color: var(--ml-accent) !important; }
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link[href]:hover,
	.radio-player:not(.is-docked) .radio-player__public-presenter-name-link[href]:focus-visible {
		color: var(--ml-accent-hover) !important;
		text-shadow: 0 0 .7rem color-mix(in srgb, var(--ml-accent) 18%, transparent) !important;
	}

	.radio-player:not(.is-docked) .radio-player__public-skeleton-line {
		background: linear-gradient(90deg, color-mix(in srgb, var(--ml-muted) 12%, transparent), color-mix(in srgb, var(--ml-accent) 20%, transparent), color-mix(in srgb, var(--ml-muted) 12%, transparent)) !important;
	}
	.radio-player:not(.is-docked) .radio-player__public-skeleton-avatar::after,
	.radio-player:not(.is-docked) .radio-player__public-skeleton-line::after {
		background: linear-gradient(105deg, transparent 18%, color-mix(in srgb, var(--ml-accent-hover) 15%, transparent) 48%, transparent 78%) !important;
	}

	.radio-player:not(.is-docked) .radio-player__volume-knob {
		background: radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--ml-surface) 78%, transparent) 0 39%, transparent 40%), radial-gradient(circle, transparent 0 58%, color-mix(in srgb, var(--ml-accent) 5%, transparent) 59% 78%, transparent 79%) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-knob::after {
		background: conic-gradient(from 225deg, color-mix(in srgb, var(--ml-muted) 26%, transparent) 0deg 270deg, transparent 270deg 360deg) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-knob::before {
		background: conic-gradient(from 225deg, var(--ml-accent) 0deg var(--radio-volume-progress), transparent var(--radio-volume-progress) 360deg) !important;
		filter: drop-shadow(0 0 .22rem color-mix(in srgb, var(--ml-accent) 72%, transparent)) drop-shadow(0 0 .62rem color-mix(in srgb, var(--ml-accent) 28%, transparent)) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-scale {
		background: repeating-conic-gradient(from 225deg, color-mix(in srgb, var(--ml-muted) 44%, transparent) 0deg 1.25deg, transparent 1.25deg 11.25deg), repeating-conic-gradient(from 225deg, color-mix(in srgb, var(--ml-accent) 16%, transparent) 0deg .7deg, transparent .7deg 5.625deg) !important;
		filter: drop-shadow(0 0 .22rem color-mix(in srgb, var(--ml-accent) 11%, transparent)) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-scale::before {
		background: repeating-conic-gradient(from 225deg, color-mix(in srgb, var(--ml-muted) 17%, transparent) 0deg 1deg, transparent 1deg 11.25deg) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-center {
		border-color: color-mix(in srgb, var(--ml-accent) 25%, var(--ml-border-soft)) !important;
		background: radial-gradient(circle at 35% 28%, color-mix(in srgb, var(--ml-text) 10%, transparent), transparent 30%), linear-gradient(145deg, var(--ml-surface-raised) 0%, var(--ml-surface) 48%, var(--ml-cool-deep) 100%) !important;
		color: var(--ml-muted) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-center::before {
		border-color: color-mix(in srgb, var(--ml-accent) 11%, var(--ml-border-soft)) !important;
		box-shadow: 0 0 .65rem color-mix(in srgb, var(--ml-accent) 6%, transparent) !important;
	}
	.radio-player:not(.is-docked) .radio-player__volume-knob:hover::before,
	.radio-player:not(.is-docked) .radio-player__volume-knob.is-dragging::before {
		filter: drop-shadow(0 0 .3rem color-mix(in srgb, var(--ml-accent-hover) 88%, transparent)) drop-shadow(0 0 .85rem color-mix(in srgb, var(--ml-accent) 38%, transparent)) !important;
	}
}

@keyframes ml26-player-button-breathe-v2 {
	0%,100% { box-shadow:0 0 0 .48rem color-mix(in srgb,var(--ml-accent) 4%,transparent),0 0 1.1rem color-mix(in srgb,var(--ml-accent) 11%,transparent),0 .85rem 2rem color-mix(in srgb,var(--bs-black) 36%,transparent),inset 0 1px color-mix(in srgb,var(--ml-text) 11%,transparent); }
	50% { box-shadow:0 0 0 .58rem color-mix(in srgb,var(--ml-accent) 6%,transparent),0 0 1.8rem color-mix(in srgb,var(--ml-accent) 20%,transparent),0 1rem 2.25rem color-mix(in srgb,var(--bs-black) 39%,transparent),inset 0 1px color-mix(in srgb,var(--ml-text) 14%,transparent); }
}

@keyframes radio-v5-volume-flash {
	0% { opacity:.82; filter:drop-shadow(0 0 .16rem color-mix(in srgb,var(--ml-accent) 45%,transparent)); }
	42% { opacity:1; filter:drop-shadow(0 0 .42rem color-mix(in srgb,var(--ml-accent-hover) 95%,transparent)) drop-shadow(0 0 1rem color-mix(in srgb,var(--ml-accent) 46%,transparent)); }
	100% { opacity:.98; filter:drop-shadow(0 0 .22rem color-mix(in srgb,var(--ml-accent) 72%,transparent)) drop-shadow(0 0 .62rem color-mix(in srgb,var(--ml-accent) 28%,transparent)); }
}