.ml-self-hosted-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 25;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 7px 11px;
	border: 1px solid rgba(96,225,215,.34);
	border-radius: 999px;
	background: rgba(5,10,20,.88);
	box-shadow: 0 10px 30px rgba(0,0,0,.28);
	color: #dff7ff !important;
	font: 600 12px/1.2 system-ui, sans-serif;
	backdrop-filter: blur(8px);
	pointer-events: none;
}

.ml-self-hosted-badge::before {
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #62e7dc;
	box-shadow: 0 0 0 4px rgba(98,231,220,.12), 0 0 14px rgba(98,231,220,.7);
}

.ml-self-hosted-badge.is-live::before {
	background: #41dfa9;
	animation: ml-self-pulse 1.8s ease-in-out infinite;
}

.ml-self-hosted-badge.is-provider {
	border-color: rgba(255,116,162,.42);
}

.ml-self-hosted-badge.is-provider::before {
	background: #ff74a2;
	box-shadow: 0 0 0 4px rgba(255,116,162,.12), 0 0 14px rgba(255,116,162,.65);
}

#ml-player,
.ml-studio {
	position: relative;
}

.ml-self-ready-note {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 8px 12px !important;
	border: 1px solid rgba(77,216,198,.24);
	border-radius: 10px;
	background: rgba(17,88,83,.16);
	color: #c8f8ef !important;
}

.ml-self-transport-card {
	display: grid;
	grid-template-columns: auto minmax(0,1fr) auto auto;
	align-items: center;
	gap: 12px;
	margin: 12px 0 16px;
	padding: 13px 14px;
	border: 1px solid rgba(96,225,215,.22);
	border-radius: 15px;
	background: linear-gradient(135deg, rgba(11,33,46,.96), rgba(12,22,37,.96));
	box-shadow: 0 12px 34px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.04);
	font-family: system-ui, sans-serif;
}

.ml-self-transport-card.is-live {
	border-color: rgba(65,223,169,.36);
}

.ml-self-transport-card.is-provider {
	border-color: rgba(255,116,162,.38);
	background: linear-gradient(135deg, rgba(49,18,42,.96), rgba(14,22,36,.96));
}

.ml-self-transport-icon {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border: 1px solid rgba(96,225,215,.3);
	border-radius: 11px;
	background: rgba(96,225,215,.1);
}

.ml-self-transport-icon span {
	width: 13px;
	height: 13px;
	border: 2px solid #65e8de;
	border-radius: 50%;
	box-shadow: 0 0 16px rgba(101,232,222,.55);
}

.ml-self-transport-copy {
	display: grid;
	gap: 3px;
	min-width: 0;
}

.ml-self-transport-copy strong {
	color: #f4fbff;
	font-size: 13px;
	line-height: 1.2;
}

.ml-self-transport-copy span,
.ml-self-transport-capacity span {
	color: #93aabd;
	font-size: 11px;
	line-height: 1.35;
}

.ml-self-transport-capacity {
	display: grid;
	gap: 1px;
	text-align: right;
}

.ml-self-transport-capacity b {
	color: #67eadf;
	font-size: 13px;
}

.ml-self-network-pill {
	padding: 5px 8px;
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 999px;
	background: rgba(255,255,255,.045);
	color: #aebdcc;
	font-size: 9px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.ml-self-cb-help {
	display: grid;
	gap: 3px;
	margin-top: 8px;
	padding: 10px 11px;
	border: 1px solid rgba(255,116,162,.25);
	border-radius: 11px;
	background: rgba(121,32,82,.12);
	font-family: system-ui, sans-serif;
}

.ml-self-cb-help strong {
	color: #ffd8e6;
	font-size: 12px;
}

.ml-self-cb-help span {
	color: #b9a9b7;
	font-size: 11px;
	line-height: 1.45;
}

#ml-player.ml-provider-player {
	display: flex;
	flex-direction: column;
	min-height: clamp(360px, 60vw, 720px);
	overflow: hidden;
	background: #050812;
}

#ml-player .ml-official-provider-frame {
	width: 100% !important;
	height: auto !important;
	min-height: clamp(360px, 60vw, 680px);
	flex: 1 1 auto;
	border: 0 !important;
	background: #050812;
}

.ml-provider-tools {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 42px;
	padding: 8px 12px;
	border-top: 1px solid rgba(255,255,255,.09);
	background: rgba(5,10,20,.96);
	font: 600 11px/1.25 system-ui, sans-serif;
}

.ml-provider-tools span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: #dce8f2;
}

.ml-provider-tools i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #41dfa9;
	box-shadow: 0 0 12px rgba(65,223,169,.7);
}

.ml-provider-tools a {
	padding: 6px 9px;
	border: 1px solid rgba(255,116,162,.3);
	border-radius: 8px;
	color: #ffc6da !important;
	text-decoration: none !important;
}

.ml-provider-tools a:hover,
.ml-provider-tools a:focus-visible {
	border-color: rgba(255,116,162,.65);
	background: rgba(255,116,162,.1);
}

.ml-capacity-afk {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 999999;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	width: min(560px, calc(100vw - 32px));
	padding: 13px 14px;
	border: 1px solid rgba(89, 224, 205, .35);
	border-radius: 16px;
	background: rgba(8, 14, 27, .96);
	box-shadow: 0 22px 70px rgba(0, 0, 0, .45), inset 0 1px rgba(255, 255, 255, .05);
	color: #f6f9ff;
	font-family: system-ui, sans-serif;
	backdrop-filter: blur(18px);
}

.ml-capacity-afk__pulse {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: #58dfcd;
	box-shadow: 0 0 0 6px rgba(88, 223, 205, .1), 0 0 22px rgba(88, 223, 205, .7);
	animation: ml-capacity-pulse 1.3s ease-in-out infinite;
}

.ml-capacity-afk div:nth-child(2) { display: grid; gap: 3px; }
.ml-capacity-afk strong { font-size: 14px; letter-spacing: -.01em; }
.ml-capacity-afk span { color: #aebbd0; font-size: 12px; line-height: 1.4; }
.ml-capacity-afk button,
.ml-capacity-resume {
	min-height: 36px !important;
	padding: 8px 13px !important;
	border: 1px solid rgba(89, 224, 205, .42) !important;
	border-radius: 10px !important;
	background: linear-gradient(145deg, #173f4d, #1c5260) !important;
	box-shadow: none !important;
	color: #ecfffd !important;
	font: 750 12px/1 system-ui, sans-serif !important;
	cursor: pointer;
}

.ml-capacity-afk button:hover,
.ml-capacity-afk button:focus-visible,
.ml-capacity-resume:hover,
.ml-capacity-resume:focus-visible { border-color: #72f1df !important; background: #235f6b !important; }

@keyframes ml-capacity-pulse {
	50% { transform: scale(.78); opacity: .62; }
}

@keyframes ml-self-pulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50% { transform: scale(.82); opacity: .62; }
}

@media (max-width: 680px) {
	.ml-self-transport-card {
		grid-template-columns: auto minmax(0,1fr) auto;
		gap: 9px;
		padding: 11px;
	}

	.ml-self-network-pill { display: none; }
	.ml-self-transport-capacity span { display: none; }
	.ml-provider-tools { align-items: flex-start; flex-direction: column; }
	.ml-provider-tools a { width: 100%; text-align: center; }
	#ml-player.ml-provider-player,
	#ml-player .ml-official-provider-frame { min-height: 360px; }
	.ml-capacity-afk { left: 16px; right: 16px; bottom: 16px; grid-template-columns: auto 1fr; }
	.ml-capacity-afk button { grid-column: 1 / -1; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.ml-self-hosted-badge.is-live::before { animation: none; }
	.ml-capacity-afk__pulse { animation: none; }
}
.ml-self-transport-capacity[hidden],
.ml-self-network-pill[hidden],
.ml-self-hosted-badge[hidden],
.ml-self-ready-note[hidden] { display: none !important; }