.card {
	--grain: url("grain.webp");
	--glitter: url("glitter.png");
	--glittersize: 25%;

	--space: 5%;
	--angle: 133deg;
	--imgsize: cover;

	--red: #f80e35;
	--yellow: #eedf10;
	--green: #21e985;
	--blue: #0dbde9;
	--violet: #c929f1;

	--clip: inset(9.85% 8% 52.85% 8%);
	--clip-invert: polygon(
		0% 0%,
		100% 0%,
		100% 100%,
		0% 100%,
		0 47.15%,
		91.5% 47.15%,
		91.5% 9.85%,
		8% 9.85%,
		8% 47.15%,
		0 50%
	);

	--clip-stage: polygon(
		91.5% 9.85%,
		57% 9.85%,
		54% 12%,
		17% 12%,
		16% 14%,
		12% 16%,
		8% 16%,
		8% 47.15%,
		92% 47.15%
	);
	--clip-stage-invert: polygon(
		0% 0%,
		100% 0%,
		100% 100%,
		0% 100%,
		0 47.15%,
		91.5% 47.15%,
		91.5% 9.85%,
		57% 9.85%,
		54% 12%,
		17% 12%,
		16% 14%,
		12% 16%,
		8% 16%,
		8% 47.15%,
		0 50%
	);

	--clip-trainer: inset(14.5% 8.5% 48.2% 8.5%);
	--clip-borders: inset(2.8% 4% round 2.55% / 1.5%);
}

.card__shine,
.card__glare {
	will-change:
		transform, opacity, background-image, background-size, background-position,
		background-blend-mode, filter;
}