:host {
																--media-box-border-radius: 4px;
																--media-box-padding-left: 10px;
																--media-box-padding-right: 10px;
																--media-preview-border-radius: var(
																	--media-box-border-radius
																);
																--media-box-arrow-offset: var(
																	--media-box-border-radius
																);
																--_control-background: var(
																	--media-control-background,
																	var(
																		--media-secondary-color,
																		rgb(20 20 30 / 0.7)
																	)
																);
																--_preview-background: var(
																	--media-preview-background,
																	var(--_control-background)
																);
																contain: layout;
															}
															#buffered {
																background: var(
																	--media-time-range-buffered-color,
																	rgb(255 255 255 / 0.4)
																);
																position: absolute;
																height: 100%;
																will-change: width;
																width: 7.53267%;
															}
															#preview-rail,
															#current-rail {
																width: 100%;
																position: absolute;
																left: 0px;
																bottom: 100%;
																pointer-events: none;
																will-change: transform;
															}
															[part~='box'] {
																width: min-content;
																position: absolute;
																bottom: 100%;
																flex-direction: column;
																align-items: center;
																transform: translateX(-50%);
															}
															[part~='current-box'] {
																display: var(
																	--media-current-box-display,
																	var(--media-box-display, flex)
																);
																margin: var(
																	--media-current-box-margin,
																	var(--media-box-margin, 0 0 5px)
																);
																visibility: hidden;
															}
															[part~='preview-box'] {
																display: var(
																	--media-preview-box-display,
																	var(--media-box-display, flex)
																);
																margin: var(
																	--media-preview-box-margin,
																	var(--media-box-margin, 0 0 5px)
																);
																transition-property: var(
																	--media-preview-transition-property,
																	visibility,
																	opacity
																);
																transition-duration: var(
																	--media-preview-transition-duration-out,
																	0.25s
																);
																transition-delay: var(
																	--media-preview-transition-delay-out,
																	0s
																);
																visibility: hidden;
																opacity: 0;
															}
															:host(
																	:is(
																		[mediapreviewimage],
																		[mediapreviewtime]
																	)[dragging]
																)
																[part~='preview-box'] {
																transition-duration: var(
																	--media-preview-transition-duration-in,
																	0.5s
																);
																transition-delay: var(
																	--media-preview-transition-delay-in,
																	0.25s
																);
																visibility: visible;
																opacity: 1;
															}
															@media (hover: hover) {
																:host(
																		:is(
																			[mediapreviewimage],
																			[mediapreviewtime]
																		):hover
																	)
																	[part~='preview-box'] {
																	transition-duration: var(
																		--media-preview-transition-duration-in,
																		0.5s
																	);
																	transition-delay: var(
																		--media-preview-transition-delay-in,
																		0.25s
																	);
																	visibility: visible;
																	opacity: 1;
																}
															}
															media-preview-thumbnail,
															::slotted(media-preview-thumbnail) {
																visibility: hidden;
																transition-behavior: normal;
																transition-duration: 0s;
																transition-timing-function: ease;
																transition-property: visibility;
																transition-delay: calc(
																	var(
																			--media-preview-transition-delay-out,
																			0s
																		) +
																		var(
																			--media-preview-transition-duration-out,
																			0.25s
																		)
																);
																background: var(
																	--media-preview-thumbnail-background,
																	var(--_preview-background)
																);
																box-shadow: var(
																	--media-preview-thumbnail-box-shadow,
																	0 0 4px rgb(0 0 0 / 0.2)
																);
																max-width: var(
																	--media-preview-thumbnail-max-width,
																	180px
																);
																max-height: var(
																	--media-preview-thumbnail-max-height,
																	160px
																);
																min-width: var(
																	--media-preview-thumbnail-min-width,
																	120px
																);
																min-height: var(
																	--media-preview-thumbnail-min-height,
																	80px
																);
																border: var(--media-preview-thumbnail-border);
																border-radius: var(
																	--media-preview-thumbnail-border-radius,
																	var(--media-preview-border-radius)
																		var(--media-preview-border-radius) 0 0
																);
															}
															:host([mediapreviewimage][dragging])
																media-preview-thumbnail,
															:host([mediapreviewimage][dragging])
																::slotted(media-preview-thumbnail) {
																transition-delay: var(
																	--media-preview-transition-delay-in,
																	0.25s
																);
																visibility: visible;
															}
															@media (hover: hover) {
																:host([mediapreviewimage]:hover)
																	media-preview-thumbnail,
																:host([mediapreviewimage]:hover)
																	::slotted(media-preview-thumbnail) {
																	transition-delay: var(
																		--media-preview-transition-delay-in,
																		0.25s
																	);
																	visibility: visible;
																}
																:host([mediapreviewtime]:hover) {
																	--media-time-range-hover-display: block;
																}
															}
															media-preview-chapter-display,
															::slotted(media-preview-chapter-display) {
																font-size: var(--media-font-size, 13px);
																line-height: 17px;
																min-width: 0px;
																visibility: hidden;
																transition-behavior:
																	normal, normal, normal, normal, normal;
																transition-duration: 0s, 0s, 0s, 0s, 0s;
																transition-timing-function:
																	ease, ease, ease, ease, ease;
																transition-property:
																	min-width, border-radius, margin, padding,
																	visibility;
																transition-delay: calc(
																	var(
																			--media-preview-transition-delay-out,
																			0s
																		) +
																		var(
																			--media-preview-transition-duration-out,
																			0.25s
																		)
																);
																background: var(
																	--media-preview-chapter-background,
																	var(--_preview-background)
																);
																border-radius: var(
																	--media-preview-chapter-border-radius,
																	var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																);
																padding: var(
																	--media-preview-chapter-padding,
																	3.5px 9px
																);
																margin: var(
																	--media-preview-chapter-margin,
																	0 0 5px
																);
																text-shadow: var(
																	--media-preview-chapter-text-shadow,
																	0 0 4px rgb(0 0 0 / 0.75)
																);
															}
															:host([mediapreviewimage])
																media-preview-chapter-display,
															:host([mediapreviewimage])
																::slotted(media-preview-chapter-display) {
																transition-delay: var(
																	--media-preview-transition-delay-in,
																	0.25s
																);
																border-radius: var(
																	--media-preview-chapter-border-radius,
																	0
																);
																padding: var(
																	--media-preview-chapter-padding,
																	3.5px 9px 0
																);
																margin: var(--media-preview-chapter-margin, 0);
																min-width: 100%;
															}
															media-preview-chapter-display[mediapreviewchapter],
															::slotted(
																media-preview-chapter-display[mediapreviewchapter]
															) {
																visibility: visible;
															}
															media-preview-chapter-display:not(
																[aria-valuetext]
															),
															::slotted(
																media-preview-chapter-display:not(
																	[aria-valuetext]
																)
															) {
																display: none;
															}
															media-preview-time-display,
															::slotted(media-preview-time-display),
															media-time-display,
															::slotted(media-time-display) {
																font-size: var(--media-font-size, 13px);
																line-height: 17px;
																min-width: 0px;
																transition-behavior: normal, normal;
																transition-duration: 0s, 0s;
																transition-timing-function: ease, ease;
																transition-property: min-width, border-radius;
																transition-delay: calc(
																	var(
																			--media-preview-transition-delay-out,
																			0s
																		) +
																		var(
																			--media-preview-transition-duration-out,
																			0.25s
																		)
																);
																background: var(
																	--media-preview-time-background,
																	var(--_preview-background)
																);
																border-radius: var(
																	--media-preview-time-border-radius,
																	var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																);
																padding: var(
																	--media-preview-time-padding,
																	3.5px 9px
																);
																margin: var(--media-preview-time-margin, 0);
																text-shadow: var(
																	--media-preview-time-text-shadow,
																	0 0 4px rgb(0 0 0 / 0.75)
																);
																transform: translateX(
																	min(
																		max(
																			calc(50% - var(--_box-width) / 2),
																			calc(var(--_box-shift, 0))
																		),
																		calc(var(--_box-width) / 2 - 50%)
																	)
																);
															}
															:host([mediapreviewimage])
																media-preview-time-display,
															:host([mediapreviewimage])
																::slotted(media-preview-time-display) {
																transition-delay: var(
																	--media-preview-transition-delay-in,
																	0.25s
																);
																border-radius: var(
																	--media-preview-time-border-radius,
																	0 0 var(--media-preview-border-radius)
																		var(--media-preview-border-radius)
																);
																min-width: 100%;
															}
															:host([mediapreviewtime]:hover) {
																--media-time-range-hover-display: block;
															}
															[part~='arrow'],
															::slotted([part~='arrow']) {
																display: var(
																	--media-box-arrow-display,
																	inline-block
																);
																transform: translateX(
																	min(
																		max(
																			calc(
																				50% - var(--_box-width) / 2 +
																					var(--media-box-arrow-offset)
																			),
																			calc(var(--_box-shift, 0))
																		),
																		calc(
																			var(--_box-width) / 2 - 50% -
																				var(--media-box-arrow-offset)
																		)
																	)
																);
																border-right-color: transparent;
																border-bottom-color: transparent;
																border-left-color: transparent;
																border-top-color: var(
																	--media-box-arrow-background,
																	var(--_control-background)
																);
																border-width: var(
																	--media-box-arrow-border-width,
																	var(--media-box-arrow-height, 5px)
																		var(--media-box-arrow-width, 6px) 0
																);
																border-style: solid;
																justify-content: center;
																height: 0px;
															}
															#segments-clipping rect:nth-child(0) {
															}