:root {
	--a-color: oklch(40% 0.05 0.39 / var(--opacity-50));
	--b-color: rgba(133, 0, 67, var(--opacity-50));
}

@media (color-gamut: rec2020) {
:root {
	--b-color: oklch(40% 0.234 0.39 / var(--opacity-50));
}
}

.oklch {
	color-1: oklch(40% 0.1268735435 34.568626);
	color-2: oklch(40% 0.1268735435 34.568626 / 1);
	color-3: oklch(40% 0.1268735435 34.568626 / .5);
	color-4: oklch(40% 0.1268735435 34.568626 / 100%);
	color-5: oklch(40% 0.1268735435 34.568626 / 50%);
	color-6: oklch(60% 0.150 0);

	@supports (color: oklch(60% 0.1250 180)) {
		color-7: rgb(0, 149, 131);
		color-8: rgb(0, 149, 131);
		color-9: rgb(0, 149, 131);
		color-10: rgb(0, 149, 131);
		color-11: rgb(0, 149, 131);
	}

@media (color-gamut: p3) {
@supports (color: oklch(60% 0.1250 180)) {
		color-7: oklch(60% 0.1250 180);
		color-8: oklch(60% 0.1250 180deg);
		color-9: oklch(60% 0.1250 0.5turn);
		color-10: oklch(60% 0.1250 200grad);
		color-11: oklch(60% 0.1250 3.14159rad);
	}
}

	@media (prefers-color-scheme: dark) {
		color-12: oklch(60% 0.1250 45);
		color-13: oklch(60% 0.1250 45deg);
		color-14: oklch(60% 0.1250 0.125turn);
		color-15: oklch(60% 0.1250 50grad);
		color-16: oklch(60% 0.1250 0.785398rad);
		color-17: oklch(60% 0.1250 0.785398unknown);
	}
}

.default-1 {
	/* In gamut */
	color: color(srgb 1 1 1);
}

.default-2 {
	/* Out rgb of gamut */
	color: rgb(252, 255, 252);
}

@media (color-gamut: p3) {
.default-2 {
	color: color(srgb 0.99 1.0001 0.99);
}
}

.default-3 {
	/* Out rgb of gamut */
	color: rgb(252, 255, 252);
}

@media (color-gamut: p3) {
.default-3 {
	color: color(display-p3 0.99 1 0.99);
}
}

.default-4 {
	/* Out p3 of gamut */
	color: rgb(253, 255, 253);
}

@media (color-gamut: rec2020) {
.default-4 {
	color: color(srgb 0.99 1.001 0.99);
}
}

.default-5 {
	/* Out p3 of gamut */
	color: rgb(252, 255, 252);
}

@media (color-gamut: rec2020) {
.default-5 {
	color: color(display-p3 0.99 1.0001 0.99);
}
}

/* With fallbacks */
.with-fallback-1 {
	/* In gamut */
	color: white;
	color: color(srgb 1 1 1);
}

.with-fallback-2 {
	/* Out rgb of gamut */
	color: white;
}

@media (color-gamut: p3) {
.with-fallback-2 {
	color: color(srgb 0.99 1.0001 0.99);
}
}

.with-fallback-3 {
	/* Out rgb of gamut */
	color: white;
}

@media (color-gamut: p3) {
.with-fallback-3 {
	color: color(display-p3 0.99 1 0.99);
}
}

.with-fallback-4 {
	/* Out p3 of gamut */
	color: white;
}

@media (color-gamut: rec2020) {
.with-fallback-4 {
	color: color(srgb 0.99 1.001 0.99);
}
}

.with-fallback-5 {
	/* Out p3 of gamut */
	color: white;
}

@media (color-gamut: rec2020) {
.with-fallback-5 {
	color: color(display-p3 0.99 1.0001 0.99);
}
}

/* With overrides */
.with-override-1 {
	/* In gamut */
	color: color(srgb 1 1 1);
	color: white;
}

.with-override-2 {
	/* Out rgb of gamut */
	color: color(srgb 0.99 1.0001 0.99);
	color: white;
}

.with-override-3 {
	/* Out rgb of gamut */
	color: color(display-p3 0.99 1 0.99);
	color: white;
}

.with-override-4 {
	/* Out p3 of gamut */
	color: color(srgb 0.99 1.001 0.99);
	color: white;
}

.with-override-5 {
	/* Out p3 of gamut */
	color: color(display-p3 0.99 1.0001 0.99);
	color: white;
}

@media (color-gamut: p3) {
	.guarded {
		color: color(srgb 0.99 1.0001 0.99);
	}
}

@media (color-gamut: p3) {
	.guarded-out-of-gamut {
		/* This color is out of gamut for p3, but still ignored by the plugin, we assume the author intended this */
		color: color(rec2020 1 1 0.8);
	}
}

.guarded-by-supports {
	color: lime;
}

@supports (color: color(display-p3 0 1 0)) {
	.guarded-by-supports {
		color: rgb(0, 247, 79);
	}

@media (color-gamut: p3) {
.guarded-by-supports {
		color: color(display-p3 0 1 0);
	}
}
}

:root {
	background: linear-gradient(to right, rgb(180, 6, 95) 0%, rgb(185, 0, 68), rgb(187, 5, 34), rgb(186, 22, 0), rgb(182, 38, 0), rgb(174, 53, 0), rgb(164, 67, 0), rgb(151, 80, 0), rgb(134, 92, 0), rgb(113, 103, 0), rgb(87, 112, 0) 100%)
}

@media (color-gamut: rec2020) {
:root {
	background: linear-gradient(to right, rgb(180, 6, 95) 0%, color(display-p3 0.66274 0.13281 0.2732), rgb(187, 5, 34), color(display-p3 0.66744 0.1674 -0.0377), color(display-p3 0.65449 0.20282 -0.1531), color(display-p3 0.63125 0.24386 -0.1941), color(display-p3 0.59786 0.28667 -0.2143), color(display-p3 0.55449 0.32865 -0.2232), color(display-p3 0.50119 0.3681 -0.2238), color(display-p3 0.43745 0.40384 -0.2152), color(display-p3 0.36142 0.435 -0.1928) 100%);
	background: linear-gradient(to right in oklch, oklch(50% 50% 0deg) 0%, oklch(50% 50% 120deg) 100%)
}
}
