/**
 * Accent Colors
 */
:where(:root), .tc-root {
	/* Core accent colors */
	--color-red: oklch(55% 0.2 25);
	--color-orange: oklch(70% 0.185 58);
	--color-yellow: oklch(88% 0.2 95);
	--color-green: oklch(70% 0.21 138);
	--color-aqua: oklch(65% 0.15 210);
	--color-blue: oklch(60% 0.2 248);
	--color-purple: oklch(55% 0.2 285);
	--color-magenta: oklch(65% 0.23 6);

	/*
	 * Tints and shades
	 */
	--color-red-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-red) var(--color-level-0), var(--color-canvastext)));
	--color-red-10: color-mix(in oklch, var(--color-red-0), var(--color-red-50) 20%);
	--color-red-20: color-mix(in oklch, var(--color-red-0), var(--color-red-50) 40%);
	--color-red-30: color-mix(in oklch, var(--color-red-0), var(--color-red-50) 60%);
	--color-red-40: color-mix(in oklch, var(--color-red-0), var(--color-red-50) 80%);
	--color-red-50-abs: color-mix(in oklch, var(--color-red) 0%, oklch(var(--color-level-50) none none));
	--color-red-50: color-mix(in oklch, var(--color-red), var(--color-red-50-abs) var(--color-absolutize, ));
	--color-red-60: color-mix(in oklab, var(--color-red-50), var(--color-red-100) 20%);
	--color-red-70: color-mix(in oklab, var(--color-red-50), var(--color-red-100) 40%);
	--color-red-80: color-mix(in oklab, var(--color-red-50), var(--color-red-100) 60%);
	--color-red-90: color-mix(in oklab, var(--color-red-50), var(--color-red-100) 80%);
	--color-red-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-red), var(--color-canvas) var(--color-level-100)));

	--color-orange-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-orange) var(--color-level-0), var(--color-canvastext)));
	--color-orange-10: color-mix(in oklch, var(--color-orange-0), var(--color-orange-50) 20%);
	--color-orange-20: color-mix(in oklch, var(--color-orange-0), var(--color-orange-50) 40%);
	--color-orange-30: color-mix(in oklch, var(--color-orange-0), var(--color-orange-50) 60%);
	--color-orange-40: color-mix(in oklch, var(--color-orange-0), var(--color-orange-50) 80%);
	--color-orange-50-abs: color-mix(in oklch, var(--color-orange) 0%, oklch(var(--color-level-50) none none));
	--color-orange-50: color-mix(in oklch, var(--color-orange), var(--color-orange-50-abs) var(--color-absolutize, ));
	--color-orange-60: color-mix(in oklab, var(--color-orange-50), var(--color-orange-100) 20%);
	--color-orange-70: color-mix(in oklab, var(--color-orange-50), var(--color-orange-100) 40%);
	--color-orange-80: color-mix(in oklab, var(--color-orange-50), var(--color-orange-100) 60%);
	--color-orange-90: color-mix(in oklab, var(--color-orange-50), var(--color-orange-100) 80%);
	--color-orange-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-orange), var(--color-canvas) var(--color-level-100)));

	--color-yellow-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-yellow) var(--color-level-0), var(--color-canvastext)));
	--color-yellow-10: color-mix(in oklch, var(--color-yellow-0), var(--color-yellow-50) 20%);
	--color-yellow-20: color-mix(in oklch, var(--color-yellow-0), var(--color-yellow-50) 40%);
	--color-yellow-30: color-mix(in oklch, var(--color-yellow-0), var(--color-yellow-50) 60%);
	--color-yellow-40: color-mix(in oklch, var(--color-yellow-0), var(--color-yellow-50) 80%);
	--color-yellow-50-abs: color-mix(in oklch, var(--color-yellow) 0%, oklch(var(--color-level-50) none none));
	--color-yellow-50: color-mix(in oklch, var(--color-yellow), var(--color-yellow-50-abs) var(--color-absolutize, ));
	--color-yellow-60: color-mix(in oklab, var(--color-yellow-50), var(--color-yellow-100) 20%);
	--color-yellow-70: color-mix(in oklab, var(--color-yellow-50), var(--color-yellow-100) 40%);
	--color-yellow-80: color-mix(in oklab, var(--color-yellow-50), var(--color-yellow-100) 60%);
	--color-yellow-90: color-mix(in oklab, var(--color-yellow-50), var(--color-yellow-100) 80%);
	--color-yellow-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-yellow), var(--color-canvas) var(--color-level-100)));

	--color-green-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-green) var(--color-level-0), var(--color-canvastext)));
	--color-green-10: color-mix(in oklch, var(--color-green-0), var(--color-green-50) 20%);
	--color-green-20: color-mix(in oklch, var(--color-green-0), var(--color-green-50) 40%);
	--color-green-30: color-mix(in oklch, var(--color-green-0), var(--color-green-50) 60%);
	--color-green-40: color-mix(in oklch, var(--color-green-0), var(--color-green-50) 80%);
	--color-green-50-abs: color-mix(in oklch, var(--color-green) 0%, oklch(var(--color-level-50) none none));
	--color-green-50: color-mix(in oklch, var(--color-green), var(--color-green-50-abs) var(--color-absolutize, ));
	--color-green-60: color-mix(in oklab, var(--color-green-50), var(--color-green-100) 20%);
	--color-green-70: color-mix(in oklab, var(--color-green-50), var(--color-green-100) 40%);
	--color-green-80: color-mix(in oklab, var(--color-green-50), var(--color-green-100) 60%);
	--color-green-90: color-mix(in oklab, var(--color-green-50), var(--color-green-100) 80%);
	--color-green-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-green), var(--color-canvas) var(--color-level-100)));

	--color-aqua-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-aqua) var(--color-level-0), var(--color-canvastext)));
	--color-aqua-10: color-mix(in oklch, var(--color-aqua-0), var(--color-aqua-50) 20%);
	--color-aqua-20: color-mix(in oklch, var(--color-aqua-0), var(--color-aqua-50) 40%);
	--color-aqua-30: color-mix(in oklch, var(--color-aqua-0), var(--color-aqua-50) 60%);
	--color-aqua-40: color-mix(in oklch, var(--color-aqua-0), var(--color-aqua-50) 80%);
	--color-aqua-50-abs: color-mix(in oklch, var(--color-aqua) 0%, oklch(var(--color-level-50) none none));
	--color-aqua-50: color-mix(in oklch, var(--color-aqua), var(--color-aqua-50-abs) var(--color-absolutize, ));
	--color-aqua-60: color-mix(in oklab, var(--color-aqua-50), var(--color-aqua-100) 20%);
	--color-aqua-70: color-mix(in oklab, var(--color-aqua-50), var(--color-aqua-100) 40%);
	--color-aqua-80: color-mix(in oklab, var(--color-aqua-50), var(--color-aqua-100) 60%);
	--color-aqua-90: color-mix(in oklab, var(--color-aqua-50), var(--color-aqua-100) 80%);
	--color-aqua-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-aqua), var(--color-canvas) var(--color-level-100)));

	--color-blue-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-blue) var(--color-level-0), var(--color-canvastext)));
	--color-blue-10: color-mix(in oklch, var(--color-blue-0), var(--color-blue-50) 20%);
	--color-blue-20: color-mix(in oklch, var(--color-blue-0), var(--color-blue-50) 40%);
	--color-blue-30: color-mix(in oklch, var(--color-blue-0), var(--color-blue-50) 60%);
	--color-blue-40: color-mix(in oklch, var(--color-blue-0), var(--color-blue-50) 80%);
	--color-blue-50-abs: color-mix(in oklch, var(--color-blue) 0%, oklch(var(--color-level-50) none none));
	--color-blue-50: color-mix(in oklch, var(--color-blue), var(--color-blue-50-abs) var(--color-absolutize, ));
	--color-blue-60: color-mix(in oklab, var(--color-blue-50), var(--color-blue-100) 20%);
	--color-blue-70: color-mix(in oklab, var(--color-blue-50), var(--color-blue-100) 40%);
	--color-blue-80: color-mix(in oklab, var(--color-blue-50), var(--color-blue-100) 60%);
	--color-blue-90: color-mix(in oklab, var(--color-blue-50), var(--color-blue-100) 80%);
	--color-blue-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-blue), var(--color-canvas) var(--color-level-100)));

	--color-purple-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-purple) var(--color-level-0), var(--color-canvastext)));
	--color-purple-10: color-mix(in oklch, var(--color-purple-0), var(--color-purple-50) 20%);
	--color-purple-20: color-mix(in oklch, var(--color-purple-0), var(--color-purple-50) 40%);
	--color-purple-30: color-mix(in oklch, var(--color-purple-0), var(--color-purple-50) 60%);
	--color-purple-40: color-mix(in oklch, var(--color-purple-0), var(--color-purple-50) 80%);
	--color-purple-50-abs: color-mix(in oklch, var(--color-purple) 0%, oklch(var(--color-level-50) none none));
	--color-purple-50: color-mix(in oklch, var(--color-purple), var(--color-purple-50-abs) var(--color-absolutize, ));
	--color-purple-60: color-mix(in oklab, var(--color-purple-50), var(--color-purple-100) 20%);
	--color-purple-70: color-mix(in oklab, var(--color-purple-50), var(--color-purple-100) 40%);
	--color-purple-80: color-mix(in oklab, var(--color-purple-50), var(--color-purple-100) 60%);
	--color-purple-90: color-mix(in oklab, var(--color-purple-50), var(--color-purple-100) 80%);
	--color-purple-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-purple), var(--color-canvas) var(--color-level-100)));

	--color-magenta-0: color-mix(in oklab, canvastext var(--color-tintify), color-mix(in oklab, var(--color-magenta) var(--color-level-0), var(--color-canvastext)));
	--color-magenta-10: color-mix(in oklch, var(--color-magenta-0), var(--color-magenta-50) 20%);
	--color-magenta-20: color-mix(in oklch, var(--color-magenta-0), var(--color-magenta-50) 40%);
	--color-magenta-30: color-mix(in oklch, var(--color-magenta-0), var(--color-magenta-50) 60%);
	--color-magenta-40: color-mix(in oklch, var(--color-magenta-0), var(--color-magenta-50) 80%);
	--color-magenta-50-abs: color-mix(in oklch, var(--color-magenta) 0%, oklch(var(--color-level-50) none none));
	--color-magenta-50: color-mix(in oklch, var(--color-magenta), var(--color-magenta-50-abs) var(--color-absolutize, ));
	--color-magenta-60: color-mix(in oklab, var(--color-magenta-50), var(--color-magenta-100) 20%);
	--color-magenta-70: color-mix(in oklab, var(--color-magenta-50), var(--color-magenta-100) 40%);
	--color-magenta-80: color-mix(in oklab, var(--color-magenta-50), var(--color-magenta-100) 60%);
	--color-magenta-90: color-mix(in oklab, var(--color-magenta-50), var(--color-magenta-100) 80%);
	--color-magenta-100: color-mix(in oklab, canvas var(--color-tintify), color-mix(in oklab, var(--color-magenta), var(--color-canvas) var(--color-level-100)));
/*
	 * Colors by semantic purpose
	 */
	--color-accent-1: var(--color-aqua);
	--color-accent-2: var(--color-green);
	--color-accent-3: var(--color-yellow);
	--color-accent-4: var(--color-magenta);
}