:host {
																font: var(
																	--media-font,
																	var(--media-font-weight, normal)
																		var(--media-font-size, 14px) /
																		var(
																			--media-text-content-height,
																			var(--media-control-height, 24px)
																		)
																		var(
																			--media-font-family,
																			helvetica neue,
																			segoe ui,
																			roboto,
																			arial,
																			sans-serif
																		)
																);
																color: var(
																	--media-text-color,
																	var(--media-primary-color, rgb(238 238 238))
																);
																background: var(
																	--media-text-background,
																	var(
																		--media-control-background,
																		var(
																			--media-secondary-color,
																			rgb(20 20 30 / 0.7)
																		)
																	)
																);
																padding: var(--media-control-padding, 10px);
																display: var(
																	--media-control-display,
																	var(--media-time-display-display, inline-flex)
																);
																justify-content: center;
																align-items: center;
																vertical-align: middle;
																box-sizing: border-box;
																text-align: center;
																pointer-events: auto;
															}
															:host(:focus-visible) {
																box-shadow: rgba(27, 127, 204, 0.9) 0px 0px 0px
																	2px inset;
																outline: 0px;
															}
															:host(:where(:focus)) {
																box-shadow: none;
																outline: 0px;
															}
															:host(:hover:not([notoggle])) {
																cursor: var(--media-cursor, pointer);
																background: var(
																	--media-control-hover-background,
																	rgba(50 50 70 / 0.7)
																);
															}
