.wr-font-preview {
	--wr-font-preview-bottom: calc(env(safe-area-inset-bottom) + var(--wp--preset--spacing--tight, 0.5rem));
	position: fixed;
	inset-inline-start: var(--wp--preset--spacing--tight, 0.5rem);
	bottom: var(--wr-font-preview-bottom);
	z-index: 100;
	padding: var(--wp--preset--spacing--tight, 0.5rem);
	border: var(--wp--custom--border--hairline, 0.0625rem) solid currentColor;
	border-radius: 2rem;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font-family: system-ui, sans-serif;
	font-size: 0.875rem;
	line-height: 1.5;
}

.wr-font-preview__toggle {
	cursor: pointer;
	font-weight: 600;
	list-style: none;
}

.wr-font-preview__toggle::-webkit-details-marker {
	display: none;
}

.wr-font-preview__panel {
	position: absolute;
	inset-inline-start: 0;
	bottom: calc(100% + var(--wp--preset--spacing--tight, 0.5rem));
	box-sizing: border-box;
	width: min(18rem, calc(100vw - 2 * var(--wp--preset--spacing--tight, 0.5rem)));
	max-height: max(0rem, calc(100dvh - var(--wr-font-preview-bottom) - 4rem));
	overflow: auto;
	display: grid;
	gap: var(--wp--preset--spacing--tight, 0.5rem);
	padding: var(--wp--preset--spacing--snug, 0.75rem);
	border: var(--wp--custom--border--hairline, 0.0625rem) solid currentColor;
	border-radius: 0.5rem;
	background: var(--wp--preset--color--base);
}

.wr-font-preview:not([open]) .wr-font-preview__panel {
	display: none;
}

.wr-font-preview__select {
	width: 100%;
	min-width: 0;
	padding: var(--wp--preset--spacing--tight, 0.5rem);
	border: var(--wp--custom--border--hairline, 0.0625rem) solid currentColor;
	border-radius: 0;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font: inherit;
}

.wr-font-preview__toggle:focus-visible,
.wr-font-preview__select:focus-visible {
	outline: 0.125rem solid currentColor;
	outline-offset: 0.125rem;
}

@media (max-width: 48.8125rem) {
	body.wr-has-sticky-call .wr-font-preview {
		--wr-font-preview-bottom: calc(3.5rem + env(safe-area-inset-bottom) + var(--wp--preset--spacing--tight, 0.5rem));
	}
}

@media print {
	.wr-font-preview {
		display: none;
	}
}