.glass {
	position: relative;
	isolation: isolate;

	/* Blur on a separate layer so the copy stays crisp. */
	&::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		pointer-events: none;
		background: linear-gradient(145deg,
			color-mix(in srgb, var(--color-porcelain) 82%, transparent),
			color-mix(in srgb, var(--color-porcelain) 58%, transparent));
		-webkit-backdrop-filter: blur(18px) saturate(140%);
		backdrop-filter: blur(18px) saturate(140%);
		box-shadow: inset 0 1px rgb(255 255 255 / 65%);
		-webkit-mask-image: linear-gradient(to right,
			transparent, black 0.65em, black calc(100% - 0.65em), transparent);
		mask-image: linear-gradient(to right,
			transparent, black 0.65em, black calc(100% - 0.65em), transparent);
	}
}

.glass--link {
	padding: 0.15rem 1.5rem 0.65rem;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	color: var(--color-blueprint--darker);
}