:root {
	--zl-tqr-a: #34d399;
	--zl-tqr-b: #38bdf8;
	--zl-tqr-c: #f59e0b;
	--zl-tqr-d: #f0525f;
	--zl-tqr-na: #94a3b8;
}

.tqr-grade-a,
[data-tqr-grade="A"] {
	--tqr-accent: var(--zl-tqr-a) !important;
	--tqr-border: color-mix(in srgb, var(--zl-tqr-a) 40%, transparent) !important;
	--tqr-divider: color-mix(in srgb, var(--zl-tqr-a) 25%, transparent) !important;
	--tqr-glow: color-mix(in srgb, var(--zl-tqr-a) 16%, transparent) !important;
	--tqr-bg: linear-gradient(135deg, color-mix(in srgb, var(--zl-tqr-a) 18%, transparent), color-mix(in srgb, var(--zl-tqr-a) 5%, transparent)) !important;
}

.tqr-grade-a {
	color: var(--zl-tqr-a) !important;
}

.tqr-grade-b,
[data-tqr-grade="B"] {
	--tqr-accent: var(--zl-tqr-b) !important;
	--tqr-border: color-mix(in srgb, var(--zl-tqr-b) 38%, transparent) !important;
	--tqr-divider: color-mix(in srgb, var(--zl-tqr-b) 24%, transparent) !important;
	--tqr-glow: color-mix(in srgb, var(--zl-tqr-b) 15%, transparent) !important;
	--tqr-bg: linear-gradient(135deg, color-mix(in srgb, var(--zl-tqr-b) 16%, transparent), color-mix(in srgb, var(--zl-tqr-b) 5%, transparent)) !important;
}

.tqr-grade-b {
	color: var(--zl-tqr-b) !important;
}

.tqr-grade-c,
[data-tqr-grade="C"] {
	--tqr-accent: var(--zl-tqr-c) !important;
	--tqr-border: color-mix(in srgb, var(--zl-tqr-c) 36%, transparent) !important;
	--tqr-divider: color-mix(in srgb, var(--zl-tqr-c) 24%, transparent) !important;
	--tqr-glow: color-mix(in srgb, var(--zl-tqr-c) 13%, transparent) !important;
	--tqr-bg: linear-gradient(135deg, color-mix(in srgb, var(--zl-tqr-c) 15%, transparent), color-mix(in srgb, var(--zl-tqr-c) 4%, transparent)) !important;
}

.tqr-grade-c {
	color: var(--zl-tqr-c) !important;
}

.tqr-grade-d,
[data-tqr-grade="D"] {
	--tqr-accent: var(--zl-tqr-d) !important;
	--tqr-border: color-mix(in srgb, var(--zl-tqr-d) 36%, transparent) !important;
	--tqr-divider: color-mix(in srgb, var(--zl-tqr-d) 24%, transparent) !important;
	--tqr-glow: color-mix(in srgb, var(--zl-tqr-d) 13%, transparent) !important;
	--tqr-bg: linear-gradient(135deg, color-mix(in srgb, var(--zl-tqr-d) 15%, transparent), color-mix(in srgb, var(--zl-tqr-d) 4%, transparent)) !important;
}

.tqr-grade-d {
	color: var(--zl-tqr-d) !important;
}